From 22c263f9df343aa2883ab7353662db98f1afaee3 Mon Sep 17 00:00:00 2001 From: zbf Date: Mon, 5 Aug 2024 11:29:43 +0800 Subject: [PATCH 01/10] chore: upgrade @vavt/markdown-theme --- package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index ae0d6c31..c0790569 100644 --- a/package.json +++ b/package.json @@ -61,7 +61,7 @@ "@types/node": "^20.12.7", "@typescript-eslint/eslint-plugin": "^7.7.0", "@typescript-eslint/parser": "^7.7.0", - "@vavt/markdown-theme": "^4.1.1", + "@vavt/markdown-theme": "^4.1.2", "@vavt/vite-plugin-import-markdown": "^1.0.0", "@vitejs/plugin-vue": "^5.0.4", "@vitejs/plugin-vue-jsx": "^3.1.0", diff --git a/yarn.lock b/yarn.lock index 24a54ad0..d6676104 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1376,10 +1376,10 @@ resolved "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.2.0.tgz#756641adb587851b5ccb3e095daf27ae581c8406" integrity sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ== -"@vavt/markdown-theme@^4.1.1": - version "4.1.1" - resolved "https://registry.npmjs.org/@vavt/markdown-theme/-/markdown-theme-4.1.1.tgz#ec961c2075e6d95d59e1dd431e79d73edce733d9" - integrity sha512-9l+qI+/73ANSI/b6aB34qiIrXgd/vxvfq7bing9VqmhkbQKkEb9s1WMnLuGnzLYggNYaKvfHK7xPSJx9Slbhmg== +"@vavt/markdown-theme@^4.1.2": + version "4.1.2" + resolved "https://registry.npmjs.org/@vavt/markdown-theme/-/markdown-theme-4.1.2.tgz#cb2114a62379301f0a22f7a5a6a7ce277a7b2004" + integrity sha512-SUaJB1yvfHPwecVwaLXjUDqnQxqzGVWP8Gbu4wdnzwZRCYpDyNwBirMaGUTZJsb+oEEheKS3t6saYnxCTeWfrg== "@vavt/util@^1.6.2": version "1.6.2" From 99025e33d6fd4709f8ab2262765ba64e0910e9a1 Mon Sep 17 00:00:00 2001 From: zbf Date: Mon, 5 Aug 2024 11:30:41 +0800 Subject: [PATCH 02/10] 4.18.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index c0790569..0a226e22 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "md-editor-v3", - "version": "4.17.4", + "version": "4.18.0", "license": "MIT", "keywords": [ "vue", From eaad790486bf4ae3fbe06f68d2d7d9996c0e37c2 Mon Sep 17 00:00:00 2001 From: zbf Date: Mon, 12 Aug 2024 09:27:26 +0800 Subject: [PATCH 03/10] refactor: shared mermaid cache(#619) --- .../layouts/Content/composition/useMermaid.ts | 8 +------- .../layouts/Content/markdownIt/mermaid/index.ts | 11 ++++++++++- packages/MdEditor/utils/cache.ts | 7 +++++++ 3 files changed, 18 insertions(+), 8 deletions(-) create mode 100644 packages/MdEditor/utils/cache.ts diff --git a/packages/MdEditor/layouts/Content/composition/useMermaid.ts b/packages/MdEditor/layouts/Content/composition/useMermaid.ts index 74411a9c..9424b40d 100644 --- a/packages/MdEditor/layouts/Content/composition/useMermaid.ts +++ b/packages/MdEditor/layouts/Content/composition/useMermaid.ts @@ -1,8 +1,8 @@ import { watch, inject, ComputedRef, onMounted, shallowRef, nextTick } from 'vue'; -import { LRUCache } from 'lru-cache'; import { prefix, configOption } from '~/config'; import { appendHandler } from '~/utils/dom'; import { uuid } from '@vavt/util'; +import { mermaidCache } from '~/utils/cache'; import { ContentPreviewProps } from '../ContentPreview'; @@ -17,12 +17,6 @@ const useMermaid = (props: ContentPreviewProps) => { const mermaidRef = shallowRef(editorExtensions!.mermaid!.instance); const reRenderRef = shallowRef(-1); - const mermaidCache = new LRUCache({ - max: 1000, - // 缓存10分钟 - ttl: 600000 - }); - const configMermaid = () => { const mermaid = mermaidRef.value; diff --git a/packages/MdEditor/layouts/Content/markdownIt/mermaid/index.ts b/packages/MdEditor/layouts/Content/markdownIt/mermaid/index.ts index 8dcaf348..4307a766 100644 --- a/packages/MdEditor/layouts/Content/markdownIt/mermaid/index.ts +++ b/packages/MdEditor/layouts/Content/markdownIt/mermaid/index.ts @@ -1,7 +1,8 @@ import { ComputedRef } from 'vue'; +import markdownit from 'markdown-it'; import { Themes } from '~/type'; import { prefix } from '~/config'; -import markdownit from 'markdown-it'; +import { mermaidCache } from '~/utils/cache'; const MermaidPlugin = (md: markdownit, options: { themeRef: ComputedRef }) => { const temp = md.renderer.rules.fence!.bind(md.renderer.rules); @@ -15,6 +16,14 @@ const MermaidPlugin = (md: markdownit, options: { themeRef: ComputedRef tokens[idx].attrSet('data-line', String(line)); } + const mermaidHtml = mermaidCache.get(code) as string; + + if (mermaidHtml) { + return `

${mermaidHtml}

`; + } + return `
${code}
`; diff --git a/packages/MdEditor/utils/cache.ts b/packages/MdEditor/utils/cache.ts new file mode 100644 index 00000000..971b9ede --- /dev/null +++ b/packages/MdEditor/utils/cache.ts @@ -0,0 +1,7 @@ +import { LRUCache } from 'lru-cache'; + +export const mermaidCache = new LRUCache({ + max: 1000, + // 缓存10分钟 + ttl: 600000 +}); From a14dd7a5f00938a3adb1f0a83c3da73b09febc21 Mon Sep 17 00:00:00 2001 From: zbf Date: Mon, 12 Aug 2024 13:54:23 +0800 Subject: [PATCH 04/10] fix: when placeholder text is long, cursor line height is incorrect(#617) --- .../MdEditor/layouts/Content/composition/useCodeMirror.ts | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/MdEditor/layouts/Content/composition/useCodeMirror.ts b/packages/MdEditor/layouts/Content/composition/useCodeMirror.ts index a35dc2fc..e03fd6a8 100644 --- a/packages/MdEditor/layouts/Content/composition/useCodeMirror.ts +++ b/packages/MdEditor/layouts/Content/composition/useCodeMirror.ts @@ -1,6 +1,6 @@ import { ref, onMounted, inject, ComputedRef, watch, shallowRef } from 'vue'; import { EditorView } from 'codemirror'; -import { keymap } from '@codemirror/view'; +import { keymap, drawSelection } from '@codemirror/view'; import { languages } from '@codemirror/language-data'; import { markdown } from '@codemirror/lang-markdown'; import { Compartment } from '@codemirror/state'; @@ -115,7 +115,9 @@ const useCodeMirror = (props: ContentProps) => { } } }), - eventComp.of(EditorView.domEventHandlers(domEventHandlers)) + eventComp.of(EditorView.domEventHandlers(domEventHandlers)), + // 解决多行placeholder时，光标异常的情况 + drawSelection() ]; const getExtensions = () => { From 2d009ec6246aeaeb9334414e3fdaa882ed621a85 Mon Sep 17 00:00:00 2001 From: zbf Date: Mon, 12 Aug 2024 14:46:45 +0800 Subject: [PATCH 05/10] 4.18.1 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 0a226e22..56e86034 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "md-editor-v3", - "version": "4.18.0", + "version": "4.18.1", "license": "MIT", "keywords": [ "vue", From 88f6024383aaa6dfed2e54493a32bce18966d1d2 Mon Sep 17 00:00:00 2001 From: zbf Date: Wed, 14 Aug 2024 10:38:25 +0800 Subject: [PATCH 06/10] feat: marking math expressions with `\(\)` and `\[\]`(#462) --- .../layouts/Content/markdownIt/katex/index.ts | 256 +++++++----------- 1 file changed, 100 insertions(+), 156 deletions(-) diff --git a/packages/MdEditor/layouts/Content/markdownIt/katex/index.ts b/packages/MdEditor/layouts/Content/markdownIt/katex/index.ts index ed0be74c..6491f863 100644 --- a/packages/MdEditor/layouts/Content/markdownIt/katex/index.ts +++ b/packages/MdEditor/layouts/Content/markdownIt/katex/index.ts @@ -4,185 +4,129 @@ * 该代码只是正对md-editor-v3系列功能做了适配 */ import { ShallowRef } from 'vue'; -import markdownit, { - ParserBlock, - ParserInline, - Renderer, - StateInline, - Token -} from 'markdown-it'; +import markdownit, { Renderer, Token, ParserInline, ParserBlock } from 'markdown-it'; import { prefix } from '~/config'; import { mergeAttrs } from '~/utils/md-it'; -// Test if potential opening or closing delimieter -// Assumes that there is a "$" at state.src[pos] -const isValidDelim = (state: StateInline, pos: number) => { - let can_open = true, - can_close = true; - - const max = state.posMax; - const prevChar = pos > 0 ? state.src.charCodeAt(pos - 1) : -1; - const nextChar = pos + 1 <= max ? state.src.charCodeAt(pos + 1) : -1; - - // Check non-whitespace conditions for opening and closing, and - // check that closing delimeter isn't followed by a number - if ( - prevChar === 0x20 /* " " */ || - prevChar === 0x09 /* \t */ || - (nextChar >= 0x30 /* "0" */ && nextChar <= 0x39) /* "9" */ - ) { - can_close = false; - } - if (nextChar === 0x20 /* " " */ || nextChar === 0x09 /* \t */) { - can_open = false; - } - - return { - can_open: can_open, - can_close: can_close - }; -}; - const math_inline: ParserInline.RuleInline = (state, silent) => { - let match, token, res, pos; - - if (state.src[state.pos] !== '$') { - return false; - } - - res = isValidDelim(state, state.pos); - if (!res.can_open) { - if (!silent) { - state.pending += '$'; - } - state.pos += 1; - return true; - } - - // First check for and bypass all properly escaped delimieters - // This loop will assume that the first leading backtick can not - // be the first character in state.src, which is known since - // we have found an opening delimieter already. - const start = state.pos + 1; - match = start; - while ((match = state.src.indexOf('$', match)) !== -1) { - // Found potential $, look for escapes, pos will point to - // first non escape when complete - pos = match - 1; - while (state.src[pos] === '\\') { - pos -= 1; - } - - // Even number of escapes, potential closing delimiter found - if ((match - pos) % 2 == 1) { - break; - } - match += 1; - } - - // No closing delimter found. Consume $ and continue. - if (match === -1) { - if (!silent) { - state.pending += '$'; + const delimiters = [ + { open: '$', close: '$' }, + { open: '\\(', close: '\\)' } + ]; + let match, token, pos; + + for (const delim of delimiters) { + if (state.src.startsWith(delim.open, state.pos)) { + const start = state.pos + delim.open.length; + match = start; + + while ((match = state.src.indexOf(delim.close, match)) !== -1) { + pos = match - 1; + while (state.src[pos] === '\\') { + pos -= 1; + } + if ((match - pos) % 2 == 1) { + break; + } + match += delim.close.length; + } + + if (match === -1) { + if (!silent) { + state.pending += delim.open; + } + state.pos = start; + return true; + } + + if (match - start === 0) { + if (!silent) { + state.pending += delim.open + delim.close; + } + state.pos = start + delim.close.length; + return true; + } + + if (!silent) { + token = state.push('math_inline', 'math', 0); + token.markup = delim.open; + token.content = state.src.slice(start, match); + } + + state.pos = match + delim.close.length; + return true; } - state.pos = start; - return true; - } - - // Check if we have empty content, ie: $$. Do not parse. - if (match - start === 0) { - if (!silent) { - state.pending += '$$'; - } - state.pos = start + 1; - return true; } - - // Check for valid closing delimiter - res = isValidDelim(state, match); - if (!res.can_close) { - if (!silent) { - state.pending += '$'; - } - state.pos = start; - return true; - } - - if (!silent) { - token = state.push('math_inline', 'math', 0); - token.markup = '$'; - token.content = state.src.slice(start, match); - } - - state.pos = match + 1; - return true; + return false; }; const math_block: ParserBlock.RuleBlock = (state, start, end, silent) => { + const delimiters = [ + { open: '$$', close: '$$' }, + { open: '\\[', close: '\\]' } + ]; let firstLine, lastLine, next, lastPos, - found = false, - pos = state.bMarks[start] + state.tShift[start], - max = state.eMarks[start]; + found = false; + let pos = state.bMarks[start] + state.tShift[start]; + let max = state.eMarks[start]; - if (pos + 2 > max) { - return false; - } - if (state.src.slice(pos, pos + 2) !== '$$') { - return false; - } - - pos += 2; - firstLine = state.src.slice(pos, max); - - if (silent) { - return true; - } - if (firstLine.trim().slice(-2) === '$$') { - // Single line expression - firstLine = firstLine.trim().slice(0, -2); - found = true; - } - - for (next = start; !found; ) { - next++; - - if (next >= end) { - break; + for (const delim of delimiters) { + if (pos + delim.open.length > max) { + continue; + } + if (state.src.slice(pos, pos + delim.open.length) !== delim.open) { + continue; } - pos = state.bMarks[next] + state.tShift[next]; - max = state.eMarks[next]; + pos += delim.open.length; + firstLine = state.src.slice(pos, max); - if (pos < max && state.tShift[next] < state.blkIndent) { - // non-empty line with negative indent should stop the list: - break; + if (silent) { + return true; } - - if (state.src.slice(pos, max).trim().slice(-2) === '$$') { - lastPos = state.src.slice(0, max).lastIndexOf('$$'); - lastLine = state.src.slice(pos, lastPos); + if (firstLine.trim().slice(-delim.close.length) === delim.close) { + firstLine = firstLine.trim().slice(0, -delim.close.length); found = true; } - } - state.line = next + 1; - - const token = state.push('math_block', 'math', 0); - token.block = true; - token.content = - (firstLine && firstLine.trim() ? firstLine + '\n' : '') + - state.getLines(start + 1, next, state.tShift[start], true) + - (lastLine && lastLine.trim() ? lastLine : ''); - token.map = [start, state.line]; - token.markup = '$$'; - return true; + for (next = start; !found; ) { + next++; + if (next >= end) { + break; + } + pos = state.bMarks[next] + state.tShift[next]; + max = state.eMarks[next]; + + if (pos < max && state.tShift[next] < state.blkIndent) { + break; + } + + if (state.src.slice(pos, max).trim().slice(-delim.close.length) === delim.close) { + lastPos = state.src.slice(0, max).lastIndexOf(delim.close); + lastLine = state.src.slice(pos, lastPos); + found = true; + } + } + + state.line = next + 1; + + const token = state.push('math_block', 'math', 0); + token.block = true; + token.content = + (firstLine && firstLine.trim() ? firstLine + '\n' : '') + + state.getLines(start + 1, next, state.tShift[start], true) + + (lastLine && lastLine.trim() ? lastLine : ''); + token.map = [start, state.line]; + token.markup = delim.open; + return true; + } + return false; }; const KatexPlugin = (md: markdownit, { katexRef }: { katexRef: ShallowRef }) => { - // set KaTeX as the renderer for markdown-it-simplemath const katexInline: Renderer.RenderRule = (tokens, idx, options, env, slf) => { const token = tokens[idx]; const tmpToken = { @@ -218,7 +162,7 @@ const KatexPlugin = (md: markdownit, { katexRef }: { katexRef: ShallowRef }) => } }; - md.inline.ruler.after('escape', 'math_inline', math_inline); + md.inline.ruler.before('escape', 'math_inline', math_inline); md.block.ruler.after('blockquote', 'math_block', math_block, { alt: ['paragraph', 'reference', 'blockquote', 'list'] }); From 447385e6a95ddfa481d80ca84aaac6d7949c1e19 Mon Sep 17 00:00:00 2001 From: zbf Date: Wed, 14 Aug 2024 10:57:18 +0800 Subject: [PATCH 07/10] feat: marking the toolbar's status(#626) --- README-CN.md | 2 +- README.md | 2 +- packages/MdEditor/Editor.tsx | 1 + packages/MdEditor/layouts/Toolbar/index.less | 10 +++++-- packages/MdEditor/layouts/Toolbar/index.tsx | 30 ++++++++++++++++---- packages/MdEditor/layouts/Toolbar/props.ts | 3 ++ packages/MdEditor/styles/vars.less | 2 +- 7 files changed, 38 insertions(+), 12 deletions(-) diff --git a/README-CN.md b/README-CN.md index 46cd38b5..26c0bae0 100644 --- a/README-CN.md +++ b/README-CN.md @@ -1030,7 +1030,7 @@ const onUploadImg = async (files, callback) => { --md-color: if(@isDark, #999, #222); --md-hover-color: if(@isDark, #bbb, #000); --md-bk-color: if(@isDark, #000, #fff); - --md-bk-color-outstand: if(@isDark, #111, #f6f6f6); + --md-bk-color-outstand: if(@isDark, #333, #f2f2f2); --md-bk-hover-color: if(@isDark, #1b1a1a, #f5f7fa); --md-border-color: if(@isDark, #2d2d2d, #e6e6e6); --md-border-hover-color: if(@isDark, #636262, #b9b9b9); diff --git a/README.md b/README.md index 312c4b72..40ac86e1 100644 --- a/README.md +++ b/README.md @@ -1008,7 +1008,7 @@ const onUploadImg = async (files, callback) => { --md-color: if(@isDark, #999, #222); --md-hover-color: if(@isDark, #bbb, #000); --md-bk-color: if(@isDark, #000, #fff); - --md-bk-color-outstand: if(@isDark, #111, #f6f6f6); + --md-bk-color-outstand: if(@isDark, #333, #f2f2f2); --md-bk-hover-color: if(@isDark, #1b1a1a, #f5f7fa); --md-border-color: if(@isDark, #2d2d2d, #e6e6e6); --md-border-hover-color: if(@isDark, #636262, #b9b9b9); diff --git a/packages/MdEditor/Editor.tsx b/packages/MdEditor/Editor.tsx index 0eec9240..6b649051 100644 --- a/packages/MdEditor/Editor.tsx +++ b/packages/MdEditor/Editor.tsx @@ -81,6 +81,7 @@ const Editor = defineComponent({ defToolbars={defToolbars} noUploadImg={noUploadImg} showToolbarName={props.showToolbarName} + catalogVisible={catalogVisible.value} /> )} { props.updateSetting('pageFullscreen'); @@ -690,7 +693,10 @@ export default defineComponent({ case 'fullscreen': { return (
{ fullscreenHandler(); @@ -711,7 +717,10 @@ export default defineComponent({ case 'preview': { return (
{ props.updateSetting('preview'); @@ -730,7 +739,10 @@ export default defineComponent({ case 'previewOnly': { return (
{ props.updateSetting('previewOnly'); @@ -749,7 +761,10 @@ export default defineComponent({ case 'htmlPreview': { return (
{ props.updateSetting('htmlPreview'); @@ -768,7 +783,10 @@ export default defineComponent({ case 'catalog': { return (
{ bus.emit(editorId, CHANGE_CATALOG_VISIBLE); diff --git a/packages/MdEditor/layouts/Toolbar/props.ts b/packages/MdEditor/layouts/Toolbar/props.ts index 14adc55f..76f42279 100644 --- a/packages/MdEditor/layouts/Toolbar/props.ts +++ b/packages/MdEditor/layouts/Toolbar/props.ts @@ -49,6 +49,9 @@ export const toolbarProps = { */ showToolbarName: { type: Boolean as PropType + }, + catalogVisible: { + type: Boolean as PropType } }; diff --git a/packages/MdEditor/styles/vars.less b/packages/MdEditor/styles/vars.less index 6f6555e2..c41a6cdd 100644 --- a/packages/MdEditor/styles/vars.less +++ b/packages/MdEditor/styles/vars.less @@ -5,7 +5,7 @@ --md-color: if(@isDark, #999, #3f4a54); --md-hover-color: if(@isDark, #bbb, #000); --md-bk-color: if(@isDark, #000, #fff); - --md-bk-color-outstand: if(@isDark, #111, #f6f6f6); + --md-bk-color-outstand: if(@isDark, #333, #f2f2f2); --md-bk-hover-color: if(@isDark, #1b1a1a, #f5f7fa); --md-border-color: if(@isDark, #2d2d2d, #e6e6e6); --md-border-hover-color: if(@isDark, #636262, #b9b9b9); From a8fd4c9dd7e8a3b8b19a963ec32b4571248643a5 Mon Sep 17 00:00:00 2001 From: zbf Date: Wed, 14 Aug 2024 10:57:54 +0800 Subject: [PATCH 08/10] fix: re-rendering bug when directly assigning values to components(#630) --- .../MdEditor/layouts/Toolbar/TableShape.tsx | 25 +++++++++++++------ 1 file changed, 17 insertions(+), 8 deletions(-) diff --git a/packages/MdEditor/layouts/Toolbar/TableShape.tsx b/packages/MdEditor/layouts/Toolbar/TableShape.tsx index c71b0cb2..a82771de 100644 --- a/packages/MdEditor/layouts/Toolbar/TableShape.tsx +++ b/packages/MdEditor/layouts/Toolbar/TableShape.tsx @@ -1,4 +1,12 @@ -import { defineComponent, PropType, reactive, ExtractPropTypes, ref, watch } from 'vue'; +import { + defineComponent, + PropType, + reactive, + ExtractPropTypes, + ref, + watch, + computed +} from 'vue'; import { LooseRequired } from '@vue/shared'; import { prefix } from '~/config'; @@ -29,8 +37,12 @@ const TableShape = defineComponent({ y: -1 }); + const tableShapeStr = computed(() => { + return JSON.stringify(props.tableShape); + }); + const initShape = () => { - const shape = [...props.tableShape]; + const shape = [...JSON.parse(tableShapeStr.value)]; if (!shape[2] || shape[2] < shape[0]) { shape[2] = shape[0]; @@ -45,12 +57,9 @@ const TableShape = defineComponent({ const tableShape = ref(initShape()); - watch( - () => props.tableShape, - () => { - tableShape.value = initShape(); - } - ); + watch([tableShapeStr], () => { + tableShape.value = initShape(); + }); return () => (
Date: Wed, 14 Aug 2024 10:58:28 +0800 Subject: [PATCH 09/10] feat: support modifying the configuration of katex(#622) --- README-CN.md | 17 ++++++++++++++ README.md | 17 ++++++++++++++ packages/MdEditor/config.ts | 3 ++- .../layouts/Content/markdownIt/katex/index.ts | 22 ++++++++++++------- packages/MdEditor/type.ts | 7 ++++++ 5 files changed, 57 insertions(+), 9 deletions(-) diff --git a/README-CN.md b/README-CN.md index 26c0bae0..09df9d30 100644 --- a/README-CN.md +++ b/README-CN.md @@ -782,6 +782,23 @@ config({ }); ``` +### 🔧 katexConfig + +katex 配置项，[配置详情](https://katex.org/docs/options) + +```js +import { config } from 'md-editor-v3'; + +config({ + katexConfig(base: any) { + return { + ...base, + strict: false + }; + } +}); +``` + ## 🪡 快捷键 主要以`CTRL`搭配对应功能英文单词首字母，冲突项添加`SHIFT`，再冲突替换为`ALT`。 diff --git a/README.md b/README.md index 40ac86e1..ddfc5cf0 100644 --- a/README.md +++ b/README.md @@ -768,6 +768,23 @@ config({ }); ``` +### 🔧 katexConfig + +Configure `katex`, [Details](https://katex.org/docs/options) + +```js +import { config } from 'md-editor-v3'; + +config({ + katexConfig(base: any) { + return { + ...base, + strict: false + }; + } +}); +``` + ## 🪡 Shortcut Key _Pay attention: shortcut keys are only available when the textarea has received focus!_ diff --git a/packages/MdEditor/config.ts b/packages/MdEditor/config.ts index 15bf13e2..525f4e31 100644 --- a/packages/MdEditor/config.ts +++ b/packages/MdEditor/config.ts @@ -480,7 +480,8 @@ export const configOption: ConfigOption = { markdownItConfig: () => {}, markdownItPlugins: (s) => s, iconfontType: 'svg', - mermaidConfig: (c) => c + mermaidConfig: (c) => c, + katexConfig: (c) => c }; export const config: Config = (option) => { diff --git a/packages/MdEditor/layouts/Content/markdownIt/katex/index.ts b/packages/MdEditor/layouts/Content/markdownIt/katex/index.ts index 6491f863..353837b1 100644 --- a/packages/MdEditor/layouts/Content/markdownIt/katex/index.ts +++ b/packages/MdEditor/layouts/Content/markdownIt/katex/index.ts @@ -5,7 +5,7 @@ */ import { ShallowRef } from 'vue'; import markdownit, { Renderer, Token, ParserInline, ParserBlock } from 'markdown-it'; -import { prefix } from '~/config'; +import { prefix, configOption } from '~/config'; import { mergeAttrs } from '~/utils/md-it'; const math_inline: ParserInline.RuleInline = (state, silent) => { @@ -134,9 +134,12 @@ const KatexPlugin = (md: markdownit, { katexRef }: { katexRef: ShallowRef }) => }; if (katexRef.value) { - const html = katexRef.value.renderToString(token.content, { - throwOnError: false - }); + const html = katexRef.value.renderToString( + token.content, + configOption.katexConfig({ + throwOnError: false + }) + ); return `${html}`; } else { @@ -151,10 +154,13 @@ const KatexPlugin = (md: markdownit, { katexRef }: { katexRef: ShallowRef }) => }; if (katexRef.value) { - const html = katexRef.value.renderToString(token.content, { - throwOnError: false, - displayMode: true - }); + const html = katexRef.value.renderToString( + token.content, + configOption.katexConfig({ + throwOnError: false, + displayMode: true + }) + ); return `

${html}

`; } else { diff --git a/packages/MdEditor/type.ts b/packages/MdEditor/type.ts index b3afce73..d7a9af2b 100644 --- a/packages/MdEditor/type.ts +++ b/packages/MdEditor/type.ts @@ -339,6 +339,13 @@ export interface ConfigOption { * @returns */ mermaidConfig: (base: any) => any; + /** + * katex配置 + * + * @param baseConfig + * @returns + */ + katexConfig: (baseConfig: any) => any; } /** From fc679e9b2d4d8f28a444fd46f1b60f9d9da33890 Mon Sep 17 00:00:00 2001 From: zbf Date: Wed, 14 Aug 2024 10:59:04 +0800 Subject: [PATCH 10/10] feat: auto-complete suggestions no longer include h1 --- packages/MdEditor/layouts/Content/codemirror/autocompletion.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/MdEditor/layouts/Content/codemirror/autocompletion.ts b/packages/MdEditor/layouts/Content/codemirror/autocompletion.ts index ab14e51a..07845b8d 100644 --- a/packages/MdEditor/layouts/Content/codemirror/autocompletion.ts +++ b/packages/MdEditor/layouts/Content/codemirror/autocompletion.ts @@ -61,7 +61,7 @@ const createAutocompletion = (completions: Array | undefined) from: word.from, options: [ // 标题 - ...['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].map((key, index) => { + ...['h2', 'h3', 'h4', 'h5', 'h6'].map((key, index) => { const label = new Array(index + 1).fill('#').join(''); return { label,