@mdxeditor/editor 2.8.0 → 2.8.2

package/dist/index.d.ts

@@ -2006,6 +2006,8 @@ export declare const MultipleChoiceToggleGroup: React_2.FC<{
     }[];
 }>;
 
+export declare const muteChange$: NodeRef<boolean>;
+
 /* Excluded from this release type: NESTED_EDITOR_UPDATED_COMMAND */
 
 /* Excluded from this release type: nestedEditorChildren$ */

package/dist/index.js

@@ -3,7 +3,7 @@ export * from "@mdxeditor/gurx";
 import { MDXEditor } from "./MDXEditor.js";
 import { MarkdownParseError, UnrecognizedMarkdownConstructError, importMarkdownToLexical, importMdastTreeToLexical } from "./importMarkdownToLexical.js";
 import { exportLexicalTreeToMdast, exportMarkdownFromLexical } from "./exportMarkdownFromLexical.js";
-import { Appender, NESTED_EDITOR_UPDATED_COMMAND, activeEditor$, activeEditorSubscriptions$, activePlugins$, addActivePlugin$, addComposerChild$, addEditorWrapper$, addExportVisitor$, addImportVisitor$, addLexicalNode$, addMdastExtension$, addNestedEditorChild$, addSyntaxExtension$, addToMarkdownExtension$, addTopAreaChild$, applyBlockType$, applyFormat$, autoFocus$, codeBlockEditorDescriptors$, composerChildren$, contentEditableClassName$, convertSelectionToNode$, corePlugin, createActiveEditorSubscription$, createRootEditorSubscription$, currentBlockType$, currentFormat$, currentSelection$, directiveDescriptors$, editorInFocus$, editorRootElementRef$, editorWrappers$, exportVisitors$, historyState$, iconComponentFor$, importVisitors$, inFocus$, initialMarkdown$, initialRootEditorState$, insertDecoratorNode$, insertMarkdown$, jsxComponentDescriptors$, jsxIsAvailable$, markdown$, markdownErrorSignal$, markdownProcessingError$, markdownSourceEditorValue$, mdastExtensions$, nestedEditorChildren$, onBlur$, placeholder$, readOnly$, rootEditor$, rootEditorSubscriptions$, setMarkdown$, syntaxExtensions$, toMarkdownExtensions$, toMarkdownOptions$, topAreaChildren$, usedLexicalNodes$, viewMode$ } from "./plugins/core/index.js";
+import { Appender, NESTED_EDITOR_UPDATED_COMMAND, activeEditor$, activeEditorSubscriptions$, activePlugins$, addActivePlugin$, addComposerChild$, addEditorWrapper$, addExportVisitor$, addImportVisitor$, addLexicalNode$, addMdastExtension$, addNestedEditorChild$, addSyntaxExtension$, addToMarkdownExtension$, addTopAreaChild$, applyBlockType$, applyFormat$, autoFocus$, codeBlockEditorDescriptors$, composerChildren$, contentEditableClassName$, convertSelectionToNode$, corePlugin, createActiveEditorSubscription$, createRootEditorSubscription$, currentBlockType$, currentFormat$, currentSelection$, directiveDescriptors$, editorInFocus$, editorRootElementRef$, editorWrappers$, exportVisitors$, historyState$, iconComponentFor$, importVisitors$, inFocus$, initialMarkdown$, initialRootEditorState$, insertDecoratorNode$, insertMarkdown$, jsxComponentDescriptors$, jsxIsAvailable$, markdown$, markdownErrorSignal$, markdownProcessingError$, markdownSourceEditorValue$, mdastExtensions$, muteChange$, nestedEditorChildren$, onBlur$, placeholder$, readOnly$, rootEditor$, rootEditorSubscriptions$, setMarkdown$, syntaxExtensions$, toMarkdownExtensions$, toMarkdownOptions$, topAreaChildren$, usedLexicalNodes$, viewMode$ } from "./plugins/core/index.js";
 import { ALL_HEADING_LEVELS, allowedHeadingLevels$, headingsPlugin } from "./plugins/headings/index.js";
 import { insertThematicBreak$, thematicBreakPlugin } from "./plugins/thematic-break/index.js";
 import { applyListType$, currentListType$, listsPlugin } from "./plugins/lists/index.js";
@@ -246,6 +246,7 @@ export {
   markdownSourceEditorValue$,
   maxLengthPlugin,
   mdastExtensions$,
+  muteChange$,
   nestedEditorChildren$,
   noop,
   onBlur$,

package/dist/plugins/core/index.js

@@ -3,7 +3,7 @@ import { createEmptyHistoryState } from "@lexical/react/LexicalHistoryPlugin.js"
 import { $isHeadingNode } from "@lexical/rich-text";
 import { $setBlocksType } from "@lexical/selection";
 import { $findMatchingParent, $wrapNodeInElement, $insertNodeToNearestRoot } from "@lexical/utils";
-import { Cell, withLatestFrom, Signal, filter, scan } from "@mdxeditor/gurx";
+import { Cell, withLatestFrom, Signal, filter, map, scan } from "@mdxeditor/gurx";
 import { createCommand, FORMAT_TEXT_COMMAND, $isRootOrShadowRoot, $getRoot, $setSelection, $getSelection, $insertNodes, SELECTION_CHANGE_COMMAND, COMMAND_PRIORITY_CRITICAL, FOCUS_COMMAND, KEY_DOWN_COMMAND, $isDecoratorNode, BLUR_COMMAND, $isRangeSelection, $createParagraphNode, ParagraphNode, TextNode } from "lexical";
 import { mdxJsxFromMarkdown, mdxJsxToMarkdown } from "mdast-util-mdx-jsx";
 import { mdxJsx } from "micromark-extension-mdx-jsx";
@@ -83,6 +83,17 @@ const markdownSignal$ = Signal((r) => {
   r.link(markdown$, markdownSignal$);
   r.link(initialMarkdown$, markdown$);
 });
+const mutableMarkdownSignal$ = Signal((r) => {
+  r.link(
+    r.pipe(
+      markdownSignal$,
+      withLatestFrom(muteChange$),
+      filter(([, muted]) => !muted),
+      map(([value]) => value)
+    ),
+    mutableMarkdownSignal$
+  );
+});
 const importVisitors$ = Cell([]);
 const syntaxExtensions$ = Cell([]);
 const mdastExtensions$ = Cell([]);
@@ -101,6 +112,7 @@ const addSyntaxExtension$ = Appender(syntaxExtensions$);
 const addMdastExtension$ = Appender(mdastExtensions$);
 const addExportVisitor$ = Appender(exportVisitors$);
 const addToMarkdownExtension$ = Appender(toMarkdownExtensions$);
+const muteChange$ = Cell(false);
 const setMarkdown$ = Signal((r) => {
   r.sub(
     r.pipe(
@@ -111,15 +123,21 @@ const setMarkdown$ = Signal((r) => {
       })
     ),
     ([theNewMarkdownValue, , editor, inFocus]) => {
-      editor == null ? void 0 : editor.update(() => {
-        $getRoot().clear();
-        tryImportingMarkdown(r, $getRoot(), theNewMarkdownValue);
-        if (!inFocus) {
-          $setSelection(null);
-        } else {
-          editor.focus();
+      r.pub(muteChange$, true);
+      editor == null ? void 0 : editor.update(
+        () => {
+          $getRoot().clear();
+          tryImportingMarkdown(r, $getRoot(), theNewMarkdownValue);
+          if (!inFocus) {
+            $setSelection(null);
+          } else {
+            editor.focus();
+          }
+        },
+        {
+          onUpdate: () => r.pub(muteChange$, false)
         }
-      });
+      );
     }
   );
 });
@@ -504,7 +522,7 @@ const corePlugin = realmPlugin({
       [placeholder$]: params == null ? void 0 : params.placeholder,
       [readOnly$]: params == null ? void 0 : params.readOnly
     });
-    realm.singletonSub(markdownSignal$, params == null ? void 0 : params.onChange);
+    realm.singletonSub(mutableMarkdownSignal$, params == null ? void 0 : params.onChange);
     realm.singletonSub(onBlur$, params == null ? void 0 : params.onBlur);
     realm.singletonSub(markdownErrorSignal$, params == null ? void 0 : params.onError);
   }
@@ -563,6 +581,7 @@ export {
   markdownProcessingError$,
   markdownSourceEditorValue$,
   mdastExtensions$,
+  muteChange$,
   nestedEditorChildren$,
   onBlur$,
   placeholder$,

package/dist/plugins/toolbar/components/ChangeCodeMirrorLanguage.js

@@ -4,16 +4,21 @@ import styles from "../../../styles/ui.module.css.js";
 import { codeBlockLanguages$ } from "../../codemirror/index.js";
 import { editorInFocus$, activeEditor$ } from "../../core/index.js";
 import { Select } from "../primitives/select.js";
+const EMPTY_VALUE = "__EMPTY_VALUE__";
 const ChangeCodeMirrorLanguage = () => {
   const [editorInFocus, theEditor, codeBlockLanguages] = useCellValues(editorInFocus$, activeEditor$, codeBlockLanguages$);
   const codeBlockNode = editorInFocus.rootNode;
+  let currentLanguage = codeBlockNode.getLanguage();
+  if (currentLanguage === "") {
+    currentLanguage = EMPTY_VALUE;
+  }
   return /* @__PURE__ */ React__default.createElement("div", { className: styles.selectWithLabel }, /* @__PURE__ */ React__default.createElement("label", null, "Code block language:"), /* @__PURE__ */ React__default.createElement(
     Select,
     {
-      value: codeBlockNode.getLanguage(),
+      value: currentLanguage,
       onChange: (language) => {
         theEditor == null ? void 0 : theEditor.update(() => {
-          codeBlockNode.setLanguage(language);
+          codeBlockNode.setLanguage(language === EMPTY_VALUE ? "" : language);
           setTimeout(() => {
             theEditor == null ? void 0 : theEditor.update(() => {
               codeBlockNode.getLatest().select();
@@ -23,7 +28,7 @@ const ChangeCodeMirrorLanguage = () => {
       },
       triggerTitle: "Select code block language",
       placeholder: "Code block language",
-      items: Object.entries(codeBlockLanguages).map(([value, label]) => ({ value, label }))
+      items: Object.entries(codeBlockLanguages).map(([value, label]) => ({ value: value ? value : EMPTY_VALUE, label }))
     }
   ));
 };

package/package.json

@@ -11,7 +11,7 @@
     "*.css"
   ],
   "type": "module",
-  "version": "2.8.0",
+  "version": "2.8.2",
   "description": "React component for rich text markdown editing",
   "scripts": {
     "build": "vite build",