Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: 对于配置config 类型的修复 #890

Merged
merged 6 commits into from
Sep 9, 2024
Merged

fix: 对于配置config 类型的修复 #890

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
fadbbd5
fix: 对于配置config 类型的修复
RSS1102 Sep 4, 2024
3e8b177
chore: 将`CherryPreviewerOptions`包含的字段设为可选类型
RSS1102 Sep 5, 2024
6b327cc
chore: 修改类型
RSS1102 Sep 5, 2024
766afc2
chore: 修改CherryDefaultToolbar类型定义
RSS1102 Sep 5, 2024
2cec64e
chore: remove client's change
RSS1102 Sep 8, 2024
f6e1534
chore: 添加`syntax` 类型定义
RSS1102 Sep 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion client/src/components/CherryMarkdown/cherry.config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -283,4 +283,4 @@ const initCherryMarkdown = () => {
})
}

export default initCherryMarkdown;
export default initCherryMarkdown;
183 changes: 152 additions & 31 deletions types/cherry.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,8 @@ import CodeMirror from 'codemirror';
import SyntaxBase from '../src/core/SyntaxBase';
import { FormulaMenu } from '@/toolbars/BubbleFormula';


export interface CherryExternalsOptions {
[key: string]: any;
[key: symbol]: any;
Saraph1nes marked this conversation as resolved.
Show resolved Hide resolved
}

type CherryToolbarsCustomType = {
Expand Down Expand Up @@ -69,7 +68,7 @@ export interface _CherryOptions<T extends CherryCustomOptions = CherryCustomOpti
themeNameSpace: string,
themeSettings: {
/** 主题列表，用于切换主题 */
themeList:{
themeList: {
/** 主题对应的class名 */
className: string,
/** 主题名称 */
Expand Down Expand Up @@ -118,11 +117,11 @@ export interface _CherryOptions<T extends CherryCustomOptions = CherryCustomOpti
/** 编辑器选区变化时触发 */
selectionChange?: ({ selections: [], lastSelections: [], info }) => void;
/** 变更语言时触发 */
afterChangeLocale?: ( locale: string ) => void;
afterChangeLocale?: (locale: string) => void;
/** 变更主题时触发 */
changeMainTheme?: ( theme: string ) => void;
changeMainTheme?: (theme: string) => void;
/** 变更代码块主题时触发 */
changeCodeBlockTheme?: ( theme: string ) => void;
changeCodeBlockTheme?: (theme: string) => void;
};
/** 预览区域配置 */
previewer: CherryPreviewerOptions;
Expand Down Expand Up @@ -196,7 +195,133 @@ export interface CherryEngineOptions {
flowSessionContext?: boolean;
};
/** 内置语法配置 */
syntax?: Record<string, Record<string, any> | false>;
syntax?: {
// 语法开关
// 'hookName': false,
// 语法配置
// 'hookName': {
//
// }
link?: {
/** 生成的<a>标签追加target属性的默认值 空：在<a>标签里不会追加target属性， _blank：在<a>标签里追加target="_blank"属性 */
target?: '_blank' | '',
/** 生成的<a>标签追加rel属性的默认值 空：在<a>标签里不会追加rel属性， nofollow：在<a>标签里追加rel="nofollow：在"属性*/
rel?: '_blank' | 'nofollow' | '',
},
autoLink?: {
/** 生成的<a>标签追加target属性的默认值 空：在<a>标签里不会追加target属性， _blank：在<a>标签里追加target="_blank"属性 */
target?: '_blank' | '',
/** 生成的<a>标签追加rel属性的默认值 空：在<a>标签里不会追加rel属性， nofollow：在<a>标签里追加rel="nofollow：在"属性*/
rel?: '_blank' | 'nofollow' | '',
/** 是否开启短链接 默认:true */
enableShortLink?: boolean,
/** 短链接长度 默认:20 */
shortLinkLength?: number,
},
list?: {
listNested?: boolean, // 同级列表类型转换后变为子级
indentSpace?: number, // 默认2个空格缩进
},
table: {
enableChart?: boolean,
selfClosing?: boolean, // 自动闭合，为true时，当输入第一行table内容时，cherry会自动按表格进行解析
// chartRenderEngine: EChartsTableEngine,
// externals: ['echarts'],
},
inlineCode?: {
/**
* @deprecated 不再支持theme的配置，统一在`themeSettings.inlineCodeTheme`中配置
*/
// theme: 'red',
},
codeBlock?: {
/**
* @deprecated 不再支持theme的配置，统一在`themeSettings.codeBlockTheme`中配置
*/
// theme: 'dark', // 默认为深色主题
wrap?: boolean, // 超出长度是否换行，false则显示滚动条
lineNumber?: boolean, // 默认显示行号
copyCode?: boolean, // 是否显示“复制”按钮
editCode?: boolean, // 是否显示“编辑”按钮
changeLang?: boolean, // 是否显示“切换语言”按钮
expandCode?: boolean, // 是否展开/收起代码块，当代码块行数大于10行时，会自动收起代码块
selfClosing?: boolean, // 自动闭合，为true时，当md中有奇数个```时，会自动在md末尾追加一个```
customRenderer?: {
// 自定义语法渲染器
},
mermaid?: {
svg2img?: boolean, // 是否将mermaid生成的画图变成img格式
},
/**
* indentedCodeBlock是缩进代码块是否启用的开关
*
* 在6.X之前的版本中默认不支持该语法。
* 因为cherry的开发团队认为该语法太丑了（容易误触）
* 开发团队希望用```代码块语法来彻底取代该语法
* 但在后续的沟通中，开发团队发现在某些场景下该语法有更好的显示效果
* 因此开发团队在6.X版本中才引入了该语法
* 已经引用6.x以下版本的业务如果想做到用户无感知升级，可以去掉该语法：
* indentedCodeBlock：false
*/
indentedCodeBlock?: boolean,
},
emoji?: {
useUnicode?: boolean, // 是否使用unicode进行渲染
},
fontEmphasis?: {
/**
* 是否允许首尾空格
* 首尾、前后的定义： 语法前**语法首+内容+语法尾**语法后
* 例：
* true:
* __ hello __ ====> <strong> hello </strong>
* __hello__ ====> <strong>hello</strong>
* false:
* __ hello __ ====> <em>_ hello _</em>
* __hello__ ====> <strong>hello</strong>
*/
allowWhitespace?: boolean,
selfClosing?: boolean, // 自动闭合，为true时，当输入**XXX时，会自动在末尾追加**
},
strikethrough?: {
/**
* 是否必须有前后空格
* 首尾、前后的定义： 语法前**语法首+内容+语法尾**语法后
* 例：
* true:
* hello wor~~l~~d ====> hello wor~~l~~d
* hello wor ~~l~~ d ====> hello wor <del>l</del> d
* false:
* hello wor~~l~~d ====> hello wor<del>l</del>d
* hello wor ~~l~~ d ====> hello wor <del>l</del> d
*/
needWhitespace?: boolean,
},
mathBlock?: {
engine?: 'katex' | 'MathJax', // katex或MathJax
src?: string,
plugins?: boolean, // 加载插件
},
inlineMath?: {
engine?: 'katex' | 'MathJax', // katex或MathJax
src?: string,
},
toc?: {
/** 默认只渲染一个目录 */
allowMultiToc?: boolean,
/** 是否显示自增序号 */
showAutoNumber?: boolean,
},
header?: {
/**
* 标题的样式：
* - default 默认样式，标题前面有锚点
* - autonumber 标题前面有自增序号锚点
* - none 标题没有锚点
*/
anchorStyle?: 'default' | 'autonumber' | 'none',
},
};
/** 自定义语法 */
customSyntax?: Record<string, CustomSyntaxRegConfig['syntaxClass'] | CustomSyntaxRegConfig>;
}
Expand Down Expand Up @@ -241,42 +366,39 @@ export interface CherryEditorOptions {
export type CherryLifecycle = (text: string, html: string) => void;

export interface CherryPreviewerOptions {
dom: HTMLDivElement | false;
dom?: HTMLDivElement | false;
/** 预览区域的DOM className */
className: string;
enablePreviewerBubble: boolean;
floatWhenClosePreviewer: boolean;
className?: string;
enablePreviewerBubble?: boolean;
floatWhenClosePreviewer?: boolean;
// 配置图片懒加载的逻辑
lazyLoadImg: {
lazyLoadImg?: {
// 加载图片时如果需要展示loaing图，则配置loading图的地址
loadingImgPath: string;
loadingImgPath?: string;
// 同一时间最多有几个图片请求，最大同时加载6张图片
maxNumPerTime: 1 | 2 | 3 | 4 | 5 | 6,
maxNumPerTime?: 1 | 2 | 3 | 4 | 5 | 6,
// 不进行懒加载处理的图片数量，如果为0，即所有图片都进行懒加载处理， 如果设置为-1，则所有图片都不进行懒加载处理
noLoadImgNum: number,
noLoadImgNum?: number,
// 首次自动加载几张图片（不论图片是否滚动到视野内），autoLoadImgNum = -1 表示会自动加载完所有图片
autoLoadImgNum: -1 | number;
autoLoadImgNum?: -1 | number;
// 针对加载失败的图片 或 beforeLoadOneImgCallback 返回false 的图片，最多尝试加载几次，为了防止死循环，最多5次。以图片的src为纬度统计重试次数
maxTryTimesPerSrc: 0 | 1 | 2 | 3 | 4 | 5,
maxTryTimesPerSrc?: 0 | 1 | 2 | 3 | 4 | 5,
// 加载一张图片之前的回调函数，函数return false 会终止加载操作
beforeLoadOneImgCallback: (img: HTMLImageElement) => void | boolean;
beforeLoadOneImgCallback?: (img: HTMLImageElement) => void | boolean;
// 加载一张图片失败之后的回调函数
failLoadOneImgCallback: (img: HTMLImageElement) => void;
failLoadOneImgCallback?: (img: HTMLImageElement) => void;
// 加载一张图片之后的回调函数，如果图片加载失败，则不会回调该函数
afterLoadOneImgCallback: (img: HTMLImageElement) => void;
afterLoadOneImgCallback?: (img: HTMLImageElement) => void;
// 加载完所有图片后调用的回调函数
afterLoadAllImgCallback: () => void;
afterLoadAllImgCallback?: () => void;
};
}

export type CherryToolbarSeparator = '|';

export type CherryCustomToolbar = string;
RSS1102 marked this conversation as resolved.
Show resolved Hide resolved

export type CherryDefaultToolbar =
// | CherryToolbarSeparator
| 'audio'
| 'barTable'
| 'bar-table'
| 'bold'
| 'br'
| 'checklist'
Expand All @@ -300,7 +422,7 @@ export type CherryDefaultToolbar =
| 'insert'
| 'italic'
| 'justify'
| 'lineTable'
| 'line-table'
| 'link'
| 'list'
| 'mobilePreview'
Expand Down Expand Up @@ -390,13 +512,12 @@ export interface CherryToolbarsOptions<F extends CherryToolbarsCustomType = Cher
*/
theme?: 'light' | 'dark';
toolbar?:
| (CherryCustomToolbar |
CherryDefaultBubbleToolbar |
| (CherryDefaultBubbleToolbar |
CherryDefaultToolbar |
{ [K in keyof Partial<F['CustomMenuType']> | CherryDefaultToolbar]?: (keyof F['CustomMenuType'] | CherryDefaultToolbar)[] })[]
{ [K in (keyof Partial<F['CustomMenuType']>) | CherryDefaultToolbar]?: (keyof F['CustomMenuType'] | CherryDefaultToolbar)[] })[]
RSS1102 marked this conversation as resolved.
Show resolved Hide resolved
| false;
toolbarRight?:
| (CherryCustomToolbar | CherryDefaultBubbleToolbar | CherryDefaultToolbar)[]
| (CherryDefaultBubbleToolbar | CherryDefaultToolbar)[]
| false;
/** 是否展示悬浮目录 */
toc?: false | {
Expand Down Expand Up @@ -433,7 +554,7 @@ export interface CherryToolbarsOptions<F extends CherryToolbarsCustomType = Cher
shortcutKeySettings?: {
/** 是否替换已有的快捷键, true: 替换默认快捷键； false： 会追加到默认快捷键里，相同的shortcutKey会覆盖默认的 */
isReplace?: boolean,
shortcutKeyMap?: { [shortcutKey:string]: ShortcutKeyMapStruct};
shortcutKeyMap?: { [shortcutKey: string]: ShortcutKeyMapStruct };
};
/** 一些按钮的配置信息 */
config?: CherryToolbarConfig;
Expand Down
20 changes: 10 additions & 10 deletions types/previewer.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,24 +30,24 @@ export interface PreviewerOptions {
floatWhenClosePreviewer?: boolean;
$cherry?: Cherry;
// 配置图片懒加载的逻辑
lazyLoadImg: {
lazyLoadImg?: {
// 加载图片时如果需要展示loaing图，则配置loading图的地址
loadingImgPath: string;
loadingImgPath?: string;
// 同一时间最多有几个图片请求，最大同时加载6张图片
maxNumPerTime: 1 | 2 | 3 | 4 | 5 | 6,
maxNumPerTime?: 1 | 2 | 3 | 4 | 5 | 6,
// 不进行懒加载处理的图片数量，如果为0，即所有图片都进行懒加载处理， 如果设置为-1，则所有图片都不进行懒加载处理
noLoadImgNum: number,
noLoadImgNum?: number,
// 首次自动加载几张图片（不论图片是否滚动到视野内），autoLoadImgNum = -1 表示会自动加载完所有图片
autoLoadImgNum: -1 | number;
autoLoadImgNum?: -1 | number;
// 针对加载失败的图片 或 beforeLoadOneImgCallback 返回false 的图片，最多尝试加载几次，为了防止死循环，最多5次。以图片的src为纬度统计重试次数
maxTryTimesPerSrc: 0 | 1 | 2 | 3 | 4 | 5,
maxTryTimesPerSrc?: 0 | 1 | 2 | 3 | 4 | 5,
// 加载一张图片之前的回调函数，函数return false 会终止加载操作
beforeLoadOneImgCallback: (img: HTMLImageElement) => void | boolean;
beforeLoadOneImgCallback?: (img: HTMLImageElement) => void | boolean;
// 加载一张图片失败之后的回调函数
failLoadOneImgCallback: (img: HTMLImageElement) => void;
failLoadOneImgCallback?: (img: HTMLImageElement) => void;
// 加载一张图片之后的回调函数，如果图片加载失败，则不会回调该函数
afterLoadOneImgCallback: (img: HTMLImageElement) => void;
afterLoadOneImgCallback?: (img: HTMLImageElement) => void;
// 加载完所有图片后调用的回调函数
afterLoadAllImgCallback: () => void;
afterLoadAllImgCallback?: () => void;
};
}
Loading