@mdxeditor/editor 3.18.0 → 3.19.0

package/dist/MDXEditor.js

@@ -1,7 +1,7 @@
-import { useCellValue, useCellValues, usePublisher, useRealm } from "@mdxeditor/gurx";
+import { useCellValue, usePublisher, useCellValues, useRealm } from "@mdxeditor/gurx";
 import React__default from "react";
 import { RealmWithPlugins } from "./RealmWithPlugins.js";
-import { corePlugin, rootEditor$, useTranslation, contentEditableClassName$, spellCheck$, composerChildren$, topAreaChildren$, editorWrappers$, placeholder$, editorRootElementRef$, viewMode$, markdownSourceEditorValue$, markdown$, setMarkdown$, insertMarkdown$ } from "./plugins/core/index.js";
+import { corePlugin, rootEditor$, useTranslation, contentEditableRef$, contentEditableClassName$, spellCheck$, composerChildren$, topAreaChildren$, editorWrappers$, placeholder$, editorRootElementRef$, viewMode$, markdownSourceEditorValue$, markdown$, setMarkdown$, insertMarkdown$ } from "./plugins/core/index.js";
 import { ContentEditable } from "@lexical/react/LexicalContentEditable.js";
 import LexicalErrorBoundary from "@lexical/react/LexicalErrorBoundary.js";
 import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin.js";
@@ -20,6 +20,10 @@ const LexicalProvider = ({ children }) => {
 };
 const RichTextEditor = () => {
   const t = useTranslation();
+  const setContentEditableRef = usePublisher(contentEditableRef$);
+  const onRef = (_contentEditableRef) => {
+    setContentEditableRef({ current: _contentEditableRef });
+  };
   const [contentEditableClassName, spellCheck, composerChildren, topAreaChildren, editorWrappers, placeholder] = useCellValues(
     contentEditableClassName$,
     spellCheck$,
@@ -31,14 +35,14 @@ const RichTextEditor = () => {
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, topAreaChildren.map((Child, index) => /* @__PURE__ */ React__default.createElement(Child, { key: index })), /* @__PURE__ */ React__default.createElement(RenderRecursiveWrappers, { wrappers: editorWrappers }, /* @__PURE__ */ React__default.createElement("div", { className: classNames(styles.rootContentEditableWrapper, "mdxeditor-root-contenteditable") }, /* @__PURE__ */ React__default.createElement(
     RichTextPlugin,
     {
-      contentEditable: /* @__PURE__ */ React__default.createElement(
+      contentEditable: /* @__PURE__ */ React__default.createElement("div", { ref: onRef }, /* @__PURE__ */ React__default.createElement(
         ContentEditable,
         {
           className: classNames(styles.contentEditable, contentEditableClassName),
           ariaLabel: t("contentArea.editableMarkdown", "editable markdown"),
           spellCheck
         }
-      ),
+      )),
       placeholder: /* @__PURE__ */ React__default.createElement("div", { className: classNames(styles.contentEditable, styles.placeholder, contentEditableClassName) }, /* @__PURE__ */ React__default.createElement("p", null, placeholder)),
       ErrorBoundary: LexicalErrorBoundary
     }

package/dist/index.d.ts

@@ -632,6 +632,12 @@ export declare interface ConditionalContentsOption {
  */
 export declare const contentEditableClassName$: NodeRef<string>;
 
+/**
+ * A reference to the content editable element.
+ * @group Core
+ */
+export declare const contentEditableRef$: NodeRef<default_2.RefObject<HTMLDivElement> | null>;
+
 /**
  * Returns true if the user is pressing the control key on Windows or the meta key on Mac.
  * @group Utils

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$, 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$, 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";
@@ -189,6 +189,7 @@ export {
   compose,
   composerChildren$,
   contentEditableClassName$,
+  contentEditableRef$,
   controlOrMeta,
   convertSelectionToNode$,
   corePlugin,

package/dist/plugins/core/index.js

@@ -108,6 +108,7 @@ const jsxComponentDescriptors$ = Cell([]);
 const directiveDescriptors$ = Cell([]);
 const codeBlockEditorDescriptors$ = Cell([]);
 const editorRootElementRef$ = Cell(null);
+const contentEditableRef$ = Cell(null);
 const addLexicalNode$ = Appender(usedLexicalNodes$);
 const addImportVisitor$ = Appender(importVisitors$);
 const addSyntaxExtension$ = Appender(syntaxExtensions$);
@@ -592,6 +593,7 @@ export {
   codeBlockEditorDescriptors$,
   composerChildren$,
   contentEditableClassName$,
+  contentEditableRef$,
   convertSelectionToNode$,
   corePlugin,
   createActiveEditorSubscription$,

package/package.json

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