@mdxeditor/editor 4.3.0 → 4.3.1

package/dist/exportMarkdownFromLexical.js

@@ -153,6 +153,7 @@ function exportLexicalTreeToMdast({
   } else {
     typedRoot.children.unshift(...imports);
   }
+  splitParagraphsAtBlankLines(typedRoot);
   fixWrappingWhitespace(typedRoot, []);
   collapseNestedHtmlTags(typedRoot);
   if (!jsxIsAvailable) {
@@ -206,6 +207,41 @@ function convertUnderlineJsxToHtml(node) {
     nodeAsParent.children = newChildren;
   }
 }
+const BLANK_LINE_REGEXP = /\n(?:[^\S\n]*\n)+/;
+function splitParagraphsAtBlankLines(node) {
+  if (!("children" in node)) {
+    return;
+  }
+  const children = [];
+  for (const child of node.children) {
+    if (child.type === "paragraph" && child.children.some((c) => c.type === "text" && BLANK_LINE_REGEXP.test(c.value))) {
+      children.push(...splitParagraph(child));
+    } else {
+      splitParagraphsAtBlankLines(child);
+      children.push(child);
+    }
+  }
+  node.children = children;
+}
+function splitParagraph(paragraph) {
+  const paragraphs = [{ type: "paragraph", children: [] }];
+  for (const child of paragraph.children) {
+    if (child.type !== "text") {
+      paragraphs.at(-1).children.push(child);
+      continue;
+    }
+    child.value.split(BLANK_LINE_REGEXP).forEach((value, index) => {
+      if (index > 0) {
+        paragraphs.push({ type: "paragraph", children: [] });
+      }
+      if (value) {
+        paragraphs.at(-1).children.push({ type: "text", value });
+      }
+    });
+  }
+  const nonEmptyParagraphs = paragraphs.filter((p) => p.children.length > 0);
+  return nonEmptyParagraphs.length > 0 ? nonEmptyParagraphs : [{ type: "paragraph", children: [] }];
+}
 const TRAILING_WHITESPACE_REGEXP = /\s+$/;
 const LEADING_WHITESPACE_REGEXP = /^\s+/;
 function fixWrappingWhitespace(node, parentChain) {

package/dist/importMarkdownToLexical.js

@@ -4,6 +4,7 @@ import { reconcileJsxKindMismatches } from "./plugins/jsx/reconcileJsxKind.js";
 function isParent(node) {
   return node.children instanceof Array;
 }
+const TEXT_BLOCK_TYPES = ["paragraph", "heading", "tableCell"];
 class MarkdownParseError extends Error {
   constructor(message, cause) {
     super(message);
@@ -103,6 +104,16 @@ function importMdastTreeToLexical({ root, mdastRoot, visitors, ...descriptors })
       throw new Error("Attempting to visit children of a non-parent");
     }
     mdastNode.children.forEach((child) => {
+      if (isParent(child) && !TEXT_BLOCK_TYPES.includes(child.type)) {
+        const formatting = formattingMap.get(mdastNode);
+        if (formatting !== void 0 && !formattingMap.has(child)) {
+          formattingMap.set(child, formatting);
+        }
+        const style = styleMap.get(mdastNode);
+        if (style !== void 0 && !styleMap.has(child)) {
+          styleMap.set(child, style);
+        }
+      }
       visit(child, lexicalParent, mdastNode);
     });
   }

package/dist/plugins/core/LexicalTextVisitor.js

@@ -1,9 +1,44 @@
 import { $isTextNode } from "lexical";
-import { IS_UNDERLINE, IS_SUPERSCRIPT, IS_SUBSCRIPT, IS_ITALIC, IS_BOLD, IS_STRIKETHROUGH, IS_HIGHLIGHT, IS_CODE } from "../../FormatConstants.js";
+import { IS_CODE, IS_UNDERLINE, IS_SUPERSCRIPT, IS_SUBSCRIPT, IS_ITALIC, IS_BOLD, IS_STRIKETHROUGH, IS_HIGHLIGHT } from "../../FormatConstants.js";
 function isMdastText(mdastNode) {
   return mdastNode.type === "text";
 }
 const JOINABLE_TAGS = ["u", "span", "sub", "sup"];
+function tagFormat(format, name) {
+  return {
+    format,
+    isTag: true,
+    matches: (node) => node.type === "mdxJsxTextElement" && node.name === name && node.attributes.length === 0,
+    create: () => ({ type: "mdxJsxTextElement", name, children: [], attributes: [] })
+  };
+}
+function markerFormat(format, type) {
+  return {
+    format,
+    isTag: false,
+    matches: (node) => node.type === type,
+    create: () => ({ type, children: [] })
+  };
+}
+const FORMAT_CONTAINERS = [
+  tagFormat(IS_UNDERLINE, "u"),
+  tagFormat(IS_SUPERSCRIPT, "sup"),
+  tagFormat(IS_SUBSCRIPT, "sub"),
+  markerFormat(IS_ITALIC, "emphasis"),
+  markerFormat(IS_BOLD, "strong"),
+  markerFormat(IS_STRIKETHROUGH, "delete"),
+  markerFormat(IS_HIGHLIGHT, "highlight")
+];
+function countFollowingTextNodesWithFormat(lexicalNode, format) {
+  const style = lexicalNode.getStyle();
+  let count = 0;
+  let sibling = lexicalNode.getNextSibling();
+  while ($isTextNode(sibling) && sibling.getFormat() & format && sibling.getStyle() === style) {
+    count++;
+    sibling = sibling.getNextSibling();
+  }
+  return count;
+}
 const LexicalTextVisitor = {
   shouldJoin: (prevNode, currentNode) => {
     if (["text", "emphasis", "strong", "highlight"].includes(prevNode.type)) {
@@ -31,8 +66,6 @@ const LexicalTextVisitor = {
   },
   testLexicalNode: $isTextNode,
   visitLexicalNode: ({ lexicalNode, mdastParent, actions }) => {
-    const previousSibling = lexicalNode.getPreviousSibling();
-    const prevFormat = $isTextNode(previousSibling) ? previousSibling.getFormat() : 0;
     const textContent = lexicalNode.getTextContent();
     const format = lexicalNode.getFormat();
     const style = lexicalNode.getStyle();
@@ -45,101 +78,19 @@ const LexicalTextVisitor = {
         attributes: [{ type: "mdxJsxAttribute", name: "style", value: style }]
       });
     }
-    if (prevFormat & format & IS_UNDERLINE) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "mdxJsxTextElement",
-        name: "u",
-        children: [],
-        attributes: []
-      });
-    }
-    if (prevFormat & format & IS_SUPERSCRIPT) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "mdxJsxTextElement",
-        name: "sup",
-        children: [],
-        attributes: []
-      });
-    }
-    if (prevFormat & format & IS_SUBSCRIPT) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "mdxJsxTextElement",
-        name: "sub",
-        children: [],
-        attributes: []
-      });
-    }
-    if (prevFormat & format & IS_ITALIC) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "emphasis",
-        children: []
-      });
-    }
-    if (prevFormat & format & IS_BOLD) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "strong",
-        children: []
-      });
-    }
-    if (prevFormat & format & IS_STRIKETHROUGH) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "delete",
-        children: []
-      });
-    }
-    if (prevFormat & format & IS_HIGHLIGHT) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "highlight",
-        children: []
-      });
-    }
-    if (format & IS_UNDERLINE && !(prevFormat & IS_UNDERLINE)) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "mdxJsxTextElement",
-        name: "u",
-        children: [],
-        attributes: []
-      });
-    }
-    if (format & IS_SUPERSCRIPT && !(prevFormat & IS_SUPERSCRIPT)) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "mdxJsxTextElement",
-        name: "sup",
-        children: [],
-        attributes: []
-      });
-    }
-    if (format & IS_SUBSCRIPT && !(prevFormat & IS_SUBSCRIPT)) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "mdxJsxTextElement",
-        name: "sub",
-        children: [],
-        attributes: []
-      });
-    }
-    if (format & IS_ITALIC && !(prevFormat & IS_ITALIC)) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "emphasis",
-        children: []
-      });
-    }
-    if (format & IS_BOLD && !(prevFormat & IS_BOLD)) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "strong",
-        children: []
-      });
+    let continuedFormats = 0;
+    for (; ; ) {
+      const lastChild = localParentNode.children.at(-1);
+      const container = lastChild && FORMAT_CONTAINERS.find((c) => format & c.format && !(continuedFormats & c.format) && c.matches(lastChild));
+      if (!container) {
+        break;
+      }
+      continuedFormats |= container.format;
+      localParentNode = lastChild;
     }
-    if (format & IS_STRIKETHROUGH && !(prevFormat & IS_STRIKETHROUGH)) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "delete",
-        children: []
-      });
-    }
-    if (format & IS_HIGHLIGHT && !(prevFormat & IS_HIGHLIGHT)) {
-      localParentNode = actions.appendToParent(localParentNode, {
-        type: "highlight",
-        children: []
-      });
+    const containersToOpen = FORMAT_CONTAINERS.filter((c) => format & c.format && !(continuedFormats & c.format)).map((container) => ({ container, runLength: countFollowingTextNodesWithFormat(lexicalNode, container.format) })).sort((a, b) => Number(b.container.isTag) - Number(a.container.isTag) || b.runLength - a.runLength);
+    for (const { container } of containersToOpen) {
+      localParentNode = actions.appendToParent(localParentNode, container.create());
     }
     if (format & IS_CODE) {
       actions.appendToParent(localParentNode, {

package/package.json

@@ -11,7 +11,7 @@
     "*.css"
   ],
   "type": "module",
-  "version": "4.3.0",
+  "version": "4.3.1",
   "description": "React component for rich text markdown editing",
   "scripts": {
     "build": "vite build",
@@ -82,13 +82,13 @@
     "mdast-util-directive": "^3.0.0",
     "mdast-util-from-markdown": "^2.0.0",
     "mdast-util-frontmatter": "^2.0.1",
-    "mdast-util-gfm-strikethrough": "^2.0.0",
+    "mdast-util-gfm-strikethrough": "^2.0.1",
     "mdast-util-gfm-table": "^2.0.0",
     "mdast-util-gfm-task-list-item": "^2.0.0",
     "mdast-util-highlight-mark": "^1.2.2",
     "mdast-util-mdx": "^3.0.0",
     "mdast-util-mdx-jsx": "^3.0.0",
-    "mdast-util-to-markdown": "^2.1.0",
+    "mdast-util-to-markdown": "^2.1.3",
     "micromark-extension-directive": "^3.0.0",
     "micromark-extension-frontmatter": "^2.0.0",
     "micromark-extension-gfm-strikethrough": "^2.0.0",