@mdxeditor/editor 3.53.0 → 3.54.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +14 -0
- package/dist/index.js +2 -1
- package/dist/plugins/codemirror/CodeMirrorEditor.js +17 -12
- package/dist/plugins/codemirror/index.js +10 -4
- package/dist/plugins/core/MdastParagraphVisitor.js +1 -1
- package/dist/plugins/quote/LexicalQuoteVisitor.js +2 -4
- package/dist/plugins/toolbar/components/ChangeCodeMirrorLanguage.js +1 -2
- package/dist/plugins/toolbar/primitives/select.js +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -540,6 +540,8 @@ export declare interface CodeBlockLanguage {
|
|
|
540
540
|
alias?: readonly string[];
|
|
541
541
|
/** File extensions associated with this language (e.g. `["js", "mjs"]`). */
|
|
542
542
|
extensions?: readonly string[];
|
|
543
|
+
/** Pre-loaded language support. When provided, this is used directly instead of auto-loading. */
|
|
544
|
+
support?: CodeBlockLanguageSupport;
|
|
543
545
|
}
|
|
544
546
|
|
|
545
547
|
/**
|
|
@@ -548,6 +550,14 @@ export declare interface CodeBlockLanguage {
|
|
|
548
550
|
*/
|
|
549
551
|
export declare const codeBlockLanguages$: NodeRef<NormalizedCodeBlockLanguages>;
|
|
550
552
|
|
|
553
|
+
/**
|
|
554
|
+
* Compatible with CodeMirror `LanguageSupport` objects without exposing that package in the public API.
|
|
555
|
+
* @group CodeMirror
|
|
556
|
+
*/
|
|
557
|
+
export declare interface CodeBlockLanguageSupport {
|
|
558
|
+
extension: Extension_2;
|
|
559
|
+
}
|
|
560
|
+
|
|
551
561
|
/**
|
|
552
562
|
* A lexical node that represents a fenced code block. Use {@link "$createCodeBlockNode"} to construct one.
|
|
553
563
|
* @group Code Block
|
|
@@ -1204,6 +1214,8 @@ export declare const editorWrapperElementRef$: NodeRef<default_2.RefObject<HTMLD
|
|
|
1204
1214
|
|
|
1205
1215
|
/* Excluded from this release type: editorWrappers$ */
|
|
1206
1216
|
|
|
1217
|
+
/* Excluded from this release type: EMPTY_VALUE */
|
|
1218
|
+
|
|
1207
1219
|
export declare const EmptyTextNodeIndex: TextNodeIndex;
|
|
1208
1220
|
|
|
1209
1221
|
/* Excluded from this release type: ExportLexicalTreeOptions */
|
|
@@ -2533,6 +2545,8 @@ export declare interface NormalizedCodeBlockLanguages {
|
|
|
2533
2545
|
}[];
|
|
2534
2546
|
/** Maps any known key (canonical, alias, extension) to the canonical key. */
|
|
2535
2547
|
keyMap: Record<string, string>;
|
|
2548
|
+
/** Maps canonical keys to pre-loaded language support, when provided. */
|
|
2549
|
+
supportMap: Partial<Record<string, CodeBlockLanguageSupport>>;
|
|
2536
2550
|
}
|
|
2537
2551
|
|
|
2538
2552
|
/**
|
package/dist/index.js
CHANGED
|
@@ -18,7 +18,7 @@ import { insertJsx$, isMdastJsxNode, jsxPlugin } from "./plugins/jsx/index.js";
|
|
|
18
18
|
import { GenericJsxEditor } from "./jsx-editors/GenericJsxEditor.js";
|
|
19
19
|
import { insertSandpack$, sandpackConfig$, sandpackPlugin } from "./plugins/sandpack/index.js";
|
|
20
20
|
import { SandpackEditor } from "./plugins/sandpack/SandpackEditor.js";
|
|
21
|
-
import { codeBlockLanguages$, codeMirrorAutoLoadLanguageSupport$, codeMirrorExtensions$, codeMirrorPlugin, insertCodeMirror$, normalizeCodeBlockLanguages } from "./plugins/codemirror/index.js";
|
|
21
|
+
import { EMPTY_VALUE, codeBlockLanguages$, codeMirrorAutoLoadLanguageSupport$, codeMirrorExtensions$, codeMirrorPlugin, insertCodeMirror$, normalizeCodeBlockLanguages } from "./plugins/codemirror/index.js";
|
|
22
22
|
import { COMMON_STATE_CONFIG_EXTENSIONS, CodeMirrorEditor } from "./plugins/codemirror/CodeMirrorEditor.js";
|
|
23
23
|
import { appendCodeBlockEditorDescriptor$, codeBlockPlugin, defaultCodeBlockLanguage$, insertCodeBlock$ } from "./plugins/codeblock/index.js";
|
|
24
24
|
import { directivesPlugin, insertDirective$ } from "./plugins/directives/index.js";
|
|
@@ -110,6 +110,7 @@ export {
|
|
|
110
110
|
DialogButton,
|
|
111
111
|
DiffSourceToggleWrapper,
|
|
112
112
|
DirectiveNode,
|
|
113
|
+
EMPTY_VALUE,
|
|
113
114
|
EmptyTextNodeIndex,
|
|
114
115
|
FrontmatterNode,
|
|
115
116
|
GenericDirectiveEditor,
|
|
@@ -10,11 +10,10 @@ import { indentWithTab } from "@codemirror/commands";
|
|
|
10
10
|
import { basicLight } from "cm6-theme-basic-light";
|
|
11
11
|
import { basicSetup } from "codemirror";
|
|
12
12
|
import { $setSelection } from "lexical";
|
|
13
|
-
import { codeMirrorExtensions$, codeMirrorAutoLoadLanguageSupport$, codeBlockLanguages
|
|
13
|
+
import { codeMirrorExtensions$, codeMirrorAutoLoadLanguageSupport$, codeBlockLanguages$, EMPTY_VALUE } from "./index.js";
|
|
14
14
|
import { useCodeMirrorRef } from "../sandpack/useCodeMirrorRef.js";
|
|
15
15
|
import { Select } from "../toolbar/primitives/select.js";
|
|
16
16
|
const COMMON_STATE_CONFIG_EXTENSIONS = [];
|
|
17
|
-
const EMPTY_VALUE = "__EMPTY_VALUE__";
|
|
18
17
|
const CodeMirrorEditor = ({ language, nodeKey, code, focusEmitter }) => {
|
|
19
18
|
const t = useTranslation();
|
|
20
19
|
const { parentEditor, lexicalNode } = useCodeBlockEditorContext();
|
|
@@ -58,16 +57,22 @@ const CodeMirrorEditor = ({ language, nodeKey, code, focusEmitter }) => {
|
|
|
58
57
|
if (readOnly) {
|
|
59
58
|
extensions.push(EditorState.readOnly.of(true));
|
|
60
59
|
}
|
|
61
|
-
if (language !== ""
|
|
62
|
-
const
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
extensions.
|
|
69
|
-
}
|
|
70
|
-
|
|
60
|
+
if (language !== "") {
|
|
61
|
+
const canonical = codeBlockLanguages.keyMap[language] ?? language;
|
|
62
|
+
const providedSupport = codeBlockLanguages.supportMap[canonical];
|
|
63
|
+
if (providedSupport) {
|
|
64
|
+
extensions.push(providedSupport.extension);
|
|
65
|
+
} else if (autoLoadLanguageSupport) {
|
|
66
|
+
const languageData = languages.find((l) => {
|
|
67
|
+
return l.name === language || l.alias.includes(language) || l.extensions.includes(language);
|
|
68
|
+
});
|
|
69
|
+
if (languageData) {
|
|
70
|
+
try {
|
|
71
|
+
const languageSupport = await languageData.load();
|
|
72
|
+
extensions.push(languageSupport.extension);
|
|
73
|
+
} catch (_e) {
|
|
74
|
+
console.warn("failed to load language support for", language);
|
|
75
|
+
}
|
|
71
76
|
}
|
|
72
77
|
}
|
|
73
78
|
}
|
|
@@ -2,10 +2,12 @@ import { realmPlugin } from "../../RealmWithPlugins.js";
|
|
|
2
2
|
import { Cell, Signal, map } from "@mdxeditor/gurx";
|
|
3
3
|
import { insertCodeBlock$, appendCodeBlockEditorDescriptor$ } from "../codeblock/index.js";
|
|
4
4
|
import { CodeMirrorEditor } from "./CodeMirrorEditor.js";
|
|
5
|
+
const EMPTY_VALUE = "__EMPTY_VALUE__";
|
|
5
6
|
function normalizeCodeBlockLanguages(input) {
|
|
6
7
|
var _a;
|
|
7
8
|
const items = [];
|
|
8
9
|
const keyMap = {};
|
|
10
|
+
const supportMap = {};
|
|
9
11
|
if (Array.isArray(input)) {
|
|
10
12
|
for (const lang of input) {
|
|
11
13
|
const canonical = ((_a = lang.alias) == null ? void 0 : _a[0]) ?? lang.name.toLowerCase();
|
|
@@ -22,18 +24,21 @@ function normalizeCodeBlockLanguages(input) {
|
|
|
22
24
|
}
|
|
23
25
|
}
|
|
24
26
|
keyMap[lang.name.toLowerCase()] = canonical;
|
|
27
|
+
if (lang.support) {
|
|
28
|
+
supportMap[canonical] = lang.support;
|
|
29
|
+
}
|
|
25
30
|
}
|
|
26
31
|
} else {
|
|
27
32
|
const firstKeyByLabel = {};
|
|
28
33
|
for (const [key, label] of Object.entries(input)) {
|
|
29
34
|
if (!(label in firstKeyByLabel)) {
|
|
30
35
|
firstKeyByLabel[label] = key;
|
|
31
|
-
items.push({ value: key ||
|
|
36
|
+
items.push({ value: key || EMPTY_VALUE, label });
|
|
32
37
|
}
|
|
33
|
-
keyMap[key] = firstKeyByLabel[label] ||
|
|
38
|
+
keyMap[key] = firstKeyByLabel[label] || EMPTY_VALUE;
|
|
34
39
|
}
|
|
35
40
|
}
|
|
36
|
-
return { items, keyMap };
|
|
41
|
+
return { items, keyMap, supportMap };
|
|
37
42
|
}
|
|
38
43
|
const codeBlockLanguages$ = Cell(
|
|
39
44
|
normalizeCodeBlockLanguages({
|
|
@@ -82,13 +87,14 @@ const codeMirrorPlugin = realmPlugin({
|
|
|
82
87
|
function buildCodeBlockDescriptor(normalized) {
|
|
83
88
|
return {
|
|
84
89
|
match(language, meta) {
|
|
85
|
-
return (language ?? "")
|
|
90
|
+
return Object.hasOwn(normalized.keyMap, language ?? "") && !meta;
|
|
86
91
|
},
|
|
87
92
|
priority: 1,
|
|
88
93
|
Editor: CodeMirrorEditor
|
|
89
94
|
};
|
|
90
95
|
}
|
|
91
96
|
export {
|
|
97
|
+
EMPTY_VALUE,
|
|
92
98
|
codeBlockLanguages$,
|
|
93
99
|
codeMirrorAutoLoadLanguageSupport$,
|
|
94
100
|
codeMirrorExtensions$,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { $createParagraphNode } from "lexical";
|
|
2
|
-
const lexicalTypesThatShouldSkipParagraphs = ["listitem", "
|
|
2
|
+
const lexicalTypesThatShouldSkipParagraphs = ["listitem", "admonition"];
|
|
3
3
|
const MdastParagraphVisitor = {
|
|
4
4
|
testNode: "paragraph",
|
|
5
5
|
visitNode: function({ mdastNode, lexicalParent, actions }) {
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
import { $isQuoteNode } from "@lexical/rich-text";
|
|
2
2
|
const LexicalQuoteVisitor = {
|
|
3
3
|
testLexicalNode: $isQuoteNode,
|
|
4
|
-
visitLexicalNode: ({
|
|
5
|
-
|
|
6
|
-
actions.appendToParent(mdastParent, { type: "blockquote", children: [paragraph] });
|
|
7
|
-
actions.visitChildren(lexicalNode, paragraph);
|
|
4
|
+
visitLexicalNode: ({ actions }) => {
|
|
5
|
+
actions.addAndStepInto("blockquote");
|
|
8
6
|
}
|
|
9
7
|
};
|
|
10
8
|
export {
|
|
@@ -2,10 +2,9 @@ import { useCellValues } from "@mdxeditor/gurx";
|
|
|
2
2
|
import React__default from "react";
|
|
3
3
|
import styles from "../../../styles/ui.module.css.js";
|
|
4
4
|
import { $isCodeBlockNode } from "../../codeblock/CodeBlockNode.js";
|
|
5
|
-
import { codeBlockLanguages
|
|
5
|
+
import { codeBlockLanguages$, EMPTY_VALUE } from "../../codemirror/index.js";
|
|
6
6
|
import { editorInFocus$, activeEditor$, useTranslation } from "../../core/index.js";
|
|
7
7
|
import { Select } from "../primitives/select.js";
|
|
8
|
-
const EMPTY_VALUE = "__EMPTY_VALUE__";
|
|
9
8
|
const ChangeCodeMirrorLanguage = () => {
|
|
10
9
|
const [editorInFocus, theEditor, codeBlockLanguages] = useCellValues(editorInFocus$, activeEditor$, codeBlockLanguages$);
|
|
11
10
|
const codeBlockNode = $isCodeBlockNode(editorInFocus.rootNode) ? editorInFocus.rootNode : null;
|
|
@@ -38,7 +38,7 @@ const SelectContent = ({
|
|
|
38
38
|
},
|
|
39
39
|
position: "popper"
|
|
40
40
|
},
|
|
41
|
-
/* @__PURE__ */ React__default.createElement(RadixSelect.Viewport, { "data-editor-dropdown": true }, children)
|
|
41
|
+
/* @__PURE__ */ React__default.createElement(RadixSelect.Viewport, { "data-editor-dropdown": true, style: { maxHeight: "var(--radix-select-content-available-height)" } }, children)
|
|
42
42
|
));
|
|
43
43
|
};
|
|
44
44
|
const SelectButtonTrigger = ({
|