@mdxeditor/editor 3.21.5 → 3.22.1

package/dist/index.d.ts

@@ -1393,6 +1393,8 @@ export declare const inFocus$: NodeRef<boolean>;
 
 /* Excluded from this release type: initialMarkdown$ */
 
+export declare const initialMarkdownNormalize$: NodeRef<boolean>;
+
 /* Excluded from this release type: INSERT_IMAGE_COMMAND */
 
 /**
@@ -2085,8 +2087,9 @@ export declare interface MDXEditorProps {
     /**
      * Triggered when the editor value changes. The callback is not throttled, you can use any throttling mechanism
      * if you intend to do auto-saving.
+     * @param initialMarkdownNormalize - set to true if the change is triggered when the initial markdown is set. This can happen due to variety of reasons - for example, additional whitespace, bullet symbols different than the configured ones, etc.
      */
-    onChange?: (markdown: string) => void;
+    onChange?: (markdown: string, initialMarkdownNormalize: boolean) => void;
     /**
      * Triggered when the markdown parser encounters an error. The payload includes the invalid source and the error message.
      */
@@ -2513,6 +2516,7 @@ export declare const Select: <T extends string>(props: {
     onChange: (value: T) => void;
     triggerTitle: string;
     placeholder: string;
+    disabled?: boolean;
     items: ({
         label: string | JSX.Element;
         value: T;

package/dist/index.js

@@ -4,7 +4,7 @@ import { MDXEditor } from "./MDXEditor.js";
 import { defaultSvgIcons } from "./defaultSvgIcons.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$, contentEditableRef$, convertSelectionToNode$, corePlugin, createActiveEditorSubscription$, createRootEditorSubscription$, currentBlockType$, currentFormat$, currentSelection$, directiveDescriptors$, editorInFocus$, editorRootElementRef$, editorWrappers$, exportVisitors$, historyState$, iconComponentFor$, importVisitors$, inFocus$, initialMarkdown$, insertDecoratorNode$, insertMarkdown$, jsxComponentDescriptors$, jsxIsAvailable$, lexicalTheme$, markdown$, markdownErrorSignal$, markdownProcessingError$, markdownSourceEditorValue$, mdastExtensions$, muteChange$, nestedEditorChildren$, onBlur$, placeholder$, readOnly$, rootEditor$, rootEditorSubscriptions$, setMarkdown$, spellCheck$, syntaxExtensions$, toMarkdownExtensions$, toMarkdownOptions$, topAreaChildren$, translation$, useTranslation, 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$, contentEditableRef$, convertSelectionToNode$, corePlugin, createActiveEditorSubscription$, createRootEditorSubscription$, currentBlockType$, currentFormat$, currentSelection$, directiveDescriptors$, editorInFocus$, editorRootElementRef$, editorWrappers$, exportVisitors$, historyState$, iconComponentFor$, importVisitors$, inFocus$, initialMarkdown$, initialMarkdownNormalize$, insertDecoratorNode$, insertMarkdown$, jsxComponentDescriptors$, jsxIsAvailable$, lexicalTheme$, markdown$, markdownErrorSignal$, markdownProcessingError$, markdownSourceEditorValue$, mdastExtensions$, muteChange$, nestedEditorChildren$, onBlur$, placeholder$, readOnly$, rootEditor$, rootEditorSubscriptions$, setMarkdown$, spellCheck$, syntaxExtensions$, toMarkdownExtensions$, toMarkdownOptions$, topAreaChildren$, translation$, useTranslation, 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";
@@ -237,6 +237,7 @@ export {
   importVisitors$,
   inFocus$,
   initialMarkdown$,
+  initialMarkdownNormalize$,
   insertCodeBlock$,
   insertCodeMirror$,
   insertDecoratorNode$,

package/dist/plugins/codemirror/CodeMirrorEditor.js

@@ -83,6 +83,7 @@ const CodeMirrorEditor = ({ language, nodeKey, code, focusEmitter }) => {
     /* @__PURE__ */ React__default.createElement("div", { className: styles.codeMirrorToolbar }, /* @__PURE__ */ React__default.createElement(
       Select,
       {
+        disabled: readOnly,
         value: language,
         onChange: (language2) => {
           parentEditor.update(() => {
@@ -103,6 +104,7 @@ const CodeMirrorEditor = ({ language, nodeKey, code, focusEmitter }) => {
       {
         className: styles.iconButton,
         type: "button",
+        disabled: readOnly,
         title: t("codeblock.delete", "Delete code block"),
         onClick: (e) => {
           e.preventDefault();

package/dist/plugins/core/index.js

@@ -81,9 +81,15 @@ const currentSelection$ = Cell(null, (r) => {
 });
 const initialMarkdown$ = Cell("");
 const markdown$ = Cell("");
+const initialMarkdownNormalize$ = Cell(false);
 const markdownSignal$ = Signal((r) => {
   r.link(markdown$, markdownSignal$);
-  r.link(initialMarkdown$, markdown$);
+  r.sub(initialMarkdown$, (md) => {
+    r.pubIn({
+      [initialMarkdownNormalize$]: true,
+      [markdown$]: md
+    });
+  });
 });
 const mutableMarkdownSignal$ = Signal((r) => {
   r.link(
@@ -274,6 +280,7 @@ const createRootEditorSubscription$ = Appender(rootEditorSubscriptions$, (r, sig
           });
         });
         r.pub(markdown$, theNewMarkdownValue.trim());
+        r.pub(initialMarkdownNormalize$, false);
       });
     },
     (rootEditor) => {
@@ -508,7 +515,9 @@ const corePlugin = realmPlugin({
       [lexicalTheme$]: (params == null ? void 0 : params.lexicalTheme) ?? lexicalTheme
     });
     r.singletonSub(markdownErrorSignal$, params == null ? void 0 : params.onError);
-    r.singletonSub(mutableMarkdownSignal$, params == null ? void 0 : params.onChange);
+    r.singletonSub(mutableMarkdownSignal$, (value) => {
+      params == null ? void 0 : params.onChange(value, r.getValue(initialMarkdownNormalize$));
+    });
     r.singletonSub(onBlur$, params == null ? void 0 : params.onBlur);
     if (!(params == null ? void 0 : params.suppressHtmlProcessing)) {
       r.pubIn({
@@ -558,7 +567,9 @@ const corePlugin = realmPlugin({
       [placeholder$]: params == null ? void 0 : params.placeholder,
       [readOnly$]: params == null ? void 0 : params.readOnly
     });
-    realm.singletonSub(mutableMarkdownSignal$, params == null ? void 0 : params.onChange);
+    realm.singletonSub(mutableMarkdownSignal$, (value) => {
+      params == null ? void 0 : params.onChange(value, realm.getValue(initialMarkdownNormalize$));
+    });
     realm.singletonSub(onBlur$, params == null ? void 0 : params.onBlur);
     realm.singletonSub(markdownErrorSignal$, params == null ? void 0 : params.onError);
   }
@@ -611,6 +622,7 @@ export {
   importVisitors$,
   inFocus$,
   initialMarkdown$,
+  initialMarkdownNormalize$,
   insertDecoratorNode$,
   insertMarkdown$,
   jsxComponentDescriptors$,

package/dist/plugins/sandpack/SandpackEditor.js

@@ -21,6 +21,7 @@ const SandpackEditor = ({ nodeKey, code, focusEmitter, preset }) => {
     {
       className: styles.iconButton,
       type: "button",
+      disabled: readOnly,
       title: t("codeblock.delete", "Delete code block"),
       onClick: (e) => {
         e.preventDefault();

package/dist/plugins/toolbar/primitives/select.js

@@ -50,7 +50,7 @@ const SelectButtonTrigger = ({
   return /* @__PURE__ */ React__default.createElement(TooltipWrap, { title }, /* @__PURE__ */ React__default.createElement(RadixSelect.Trigger, { className: classNames(styles.toolbarButtonSelectTrigger, className), disabled: readOnly }, children, /* @__PURE__ */ React__default.createElement(RadixSelect.Icon, { className: styles.selectDropdownArrow }, iconComponentFor("arrow_drop_down"))));
 };
 const Select = (props) => {
-  return /* @__PURE__ */ React__default.createElement(RadixSelect.Root, { value: props.value || void 0, onValueChange: props.onChange }, /* @__PURE__ */ React__default.createElement(SelectTrigger, { title: props.triggerTitle, placeholder: props.placeholder }), /* @__PURE__ */ React__default.createElement(SelectContent, null, props.items.map((item, index) => {
+  return /* @__PURE__ */ React__default.createElement(RadixSelect.Root, { value: props.value || void 0, onValueChange: props.onChange, disabled: props.disabled }, /* @__PURE__ */ React__default.createElement(SelectTrigger, { title: props.triggerTitle, placeholder: props.placeholder }), /* @__PURE__ */ React__default.createElement(SelectContent, null, props.items.map((item, index) => {
     if (item === "separator") {
       return /* @__PURE__ */ React__default.createElement(RadixSelect.Separator, { key: index });
     }

package/package.json

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