Skip to content

Commit

Permalink
fix: 对于配置config 类型的修复 (#890)
Browse files Browse the repository at this point in the history 
* fix: 对于配置config 类型的修复

* chore: 将`CherryPreviewerOptions`包含的字段设为可选类型

* chore: 修改类型

* chore: 修改CherryDefaultToolbar类型定义

* chore: remove client's change

* chore: 添加`syntax` 类型定义
  • Loading branch information
@RSS1102
RSS1102 authored Sep 9, 2024
1 parent 30c6fd7 commit 588f862
Show file tree
Hide file tree
Showing 3 changed files with 163 additions and 42 deletions.
2 changes: 1 addition & 1 deletion client/src/components/CherryMarkdown/cherry.config.ts
View file
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
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;
}

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;

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)[] })[]
| 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
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;
};
}

0 comments on commit 588f862

Please sign in to comment.