@mdxeditor/editor 0.10.0 → 0.11.0

package/dist/TableEditor-777ac58a.js

@@ -1,426 +0,0 @@
-import { ContentEditable } from "@lexical/react/LexicalContentEditable";
-import LexicalErrorBoundary from "@lexical/react/LexicalErrorBoundary";
-import { LexicalNestedComposer } from "@lexical/react/LexicalNestedComposer";
-import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
-import { $createParagraphNode, createEditor, KEY_TAB_COMMAND, COMMAND_PRIORITY_CRITICAL, KEY_ENTER_COMMAND, BLUR_COMMAND, $getRoot } from "lexical";
-import * as React from "react";
-import React__default, { useEffect } from "react";
-import { s as styles, u as useEmitterValues, t as theme, i as importMdastTreeToLexical, S as SharedHistoryPlugin, e as exportLexicalTreeToMdast } from "./index-d34aa66b.js";
-import { toHast } from "mdast-util-to-hast";
-import { raw } from "hast-util-raw";
-import { sanitize } from "hast-util-sanitize";
-import { toHtml } from "hast-util-to-html";
-import * as RadixPopover from "@radix-ui/react-popover";
-import classNames from "classnames";
-import * as RadixToolbar from "@radix-ui/react-toolbar";
-import "@lexical/react/LexicalComposer";
-import "@lexical/react/LexicalHorizontalRulePlugin";
-import "@lexical/react/LexicalLinkPlugin";
-import "@lexical/react/LexicalListPlugin";
-import "@lexical/react/LexicalTabIndentationPlugin";
-import "@lexical/code";
-import "@lexical/link";
-import "@lexical/list";
-import "@lexical/react/LexicalHorizontalRuleNode";
-import "@lexical/rich-text";
-import "mdast-util-directive";
-import "mdast-util-from-markdown";
-import "mdast-util-frontmatter";
-import "mdast-util-gfm-table";
-import "mdast-util-mdx";
-import "micromark-extension-directive";
-import "micromark-extension-frontmatter";
-import "micromark-extension-gfm-table";
-import "micromark-extension-mdxjs";
-import "@lexical/utils";
-import "@lexical/react/LexicalComposerContext";
-import "@lexical/selection";
-import "@lexical/react/LexicalHistoryPlugin";
-import "mdast-util-to-markdown";
-import "@radix-ui/react-tooltip";
-import "downshift";
-import "@lexical/markdown";
-import "@lexical/react/LexicalMarkdownShortcutPlugin";
-import "react-diff-view";
-import "unidiff";
-import "@radix-ui/react-select";
-import "@radix-ui/react-dialog";
-const MarkdownAstRenderer = (props) => {
-  const root = { type: "root", children: props.mdastChildren };
-  const hast = raw(toHast(root, { allowDangerousHtml: true }));
-  const safeHast = sanitize(hast);
-  const html = toHtml(safeHast);
-  return /* @__PURE__ */ React__default.createElement("span", { dangerouslySetInnerHTML: { __html: html || " " } });
-};
-const SvgMoreHoriz = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, fill: "currentColor", viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React.createElement("mask", { id: "a", width: 24, height: 24, x: 0, y: 0, maskUnits: "userSpaceOnUse", style: {
-  maskType: "alpha"
-} }, /* @__PURE__ */ React.createElement("path", { d: "M0 0h24v24H0z" })), /* @__PURE__ */ React.createElement("g", { mask: "url(#a)" }, /* @__PURE__ */ React.createElement("path", { d: "M6 14c-.55 0-1.02-.196-1.412-.588A1.926 1.926 0 0 1 4 12c0-.55.196-1.02.588-1.412A1.926 1.926 0 0 1 6 10c.55 0 1.02.196 1.412.588.392.391.588.862.588 1.412 0 .55-.196 1.02-.588 1.412A1.926 1.926 0 0 1 6 14Zm6 0c-.55 0-1.02-.196-1.412-.588A1.926 1.926 0 0 1 10 12c0-.55.196-1.02.588-1.412A1.926 1.926 0 0 1 12 10c.55 0 1.02.196 1.412.588.392.391.588.862.588 1.412 0 .55-.196 1.02-.588 1.412A1.926 1.926 0 0 1 12 14Zm6 0c-.55 0-1.02-.196-1.413-.588A1.926 1.926 0 0 1 16 12c0-.55.196-1.02.587-1.412A1.926 1.926 0 0 1 18 10c.55 0 1.02.196 1.413.588.391.391.587.862.587 1.412 0 .55-.196 1.02-.587 1.412A1.926 1.926 0 0 1 18 14Z" })));
-const MoreHorizIcon = SvgMoreHoriz;
-const SvgFormatAlignLeft = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 20, height: 20, fill: "currentColor", viewBox: "0 0 20 20", ...props }, /* @__PURE__ */ React.createElement("mask", { id: "a", width: 20, height: 20, x: 0, y: 0, maskUnits: "userSpaceOnUse", style: {
-  maskType: "alpha"
-} }, /* @__PURE__ */ React.createElement("path", { d: "M0 0h20v20H0z" })), /* @__PURE__ */ React.createElement("g", { mask: "url(#a)" }, /* @__PURE__ */ React.createElement("path", { d: "M3 17v-1.5h14V17H3Zm0-3.125v-1.5h10v1.5H3Zm0-3.125v-1.5h14v1.5H3Zm0-3.125v-1.5h10v1.5H3ZM3 4.5V3h14v1.5H3Z" })));
-const AlignLeftIcon = SvgFormatAlignLeft;
-const SvgFormatAlignCenter = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 20, height: 20, fill: "currentColor", viewBox: "0 0 20 20", ...props }, /* @__PURE__ */ React.createElement("mask", { id: "a", width: 20, height: 20, x: 0, y: 0, maskUnits: "userSpaceOnUse", style: {
-  maskType: "alpha"
-} }, /* @__PURE__ */ React.createElement("path", { d: "M0 0h20v20H0z" })), /* @__PURE__ */ React.createElement("g", { mask: "url(#a)" }, /* @__PURE__ */ React.createElement("path", { d: "M3 17v-1.5h14V17H3Zm3-3.125v-1.5h8v1.5H6ZM3 10.75v-1.5h14v1.5H3Zm3-3.125v-1.5h8v1.5H6ZM3 4.5V3h14v1.5H3Z" })));
-const AlignCenterIcon = SvgFormatAlignCenter;
-const SvgFormatAlignRight = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 20, height: 20, fill: "currentColor", viewBox: "0 0 20 20", ...props }, /* @__PURE__ */ React.createElement("mask", { id: "a", width: 20, height: 20, x: 0, y: 0, maskUnits: "userSpaceOnUse", style: {
-  maskType: "alpha"
-} }, /* @__PURE__ */ React.createElement("path", { d: "M0 0h20v20H0z" })), /* @__PURE__ */ React.createElement("g", { mask: "url(#a)" }, /* @__PURE__ */ React.createElement("path", { d: "M3 17v-1.5h14V17H3Zm4-3.125v-1.5h10v1.5H7ZM3 10.75v-1.5h14v1.5H3Zm4-3.125v-1.5h10v1.5H7ZM3 4.5V3h14v1.5H3Z" })));
-const AlignRightIcon = SvgFormatAlignRight;
-const SvgInsertColLeft = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 20, height: 20, fill: "currentColor", viewBox: "0 0 20 20", ...props }, /* @__PURE__ */ React.createElement("mask", { id: "a", width: 20, height: 20, x: 0, y: 0, maskUnits: "userSpaceOnUse", style: {
-  maskType: "alpha"
-} }, /* @__PURE__ */ React.createElement("path", { d: "M0 20h20v20H0z", transform: "rotate(-90 0 20)" })), /* @__PURE__ */ React.createElement("g", { mask: "url(#a)" }, /* @__PURE__ */ React.createElement("path", { d: "M15.75 4.5H13v2.75h-1.5V4.5H8.75V3h2.75V.25H13V3h2.75v1.5ZM13 17H5V3h2.25v1.5H6.5v11h5V8.75H13V17Z" })));
-const InsertColLeftIcon = SvgInsertColLeft;
-const SvgInsertColRight = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 20, height: 20, fill: "currentColor", viewBox: "0 0 20 20", ...props }, /* @__PURE__ */ React.createElement("mask", { id: "a", width: 20, height: 20, x: 0, y: 0, maskUnits: "userSpaceOnUse", style: {
-  maskType: "alpha"
-} }, /* @__PURE__ */ React.createElement("path", { d: "M0 0h20v20H0z", transform: "matrix(0 -1 -1 0 20 20)" })), /* @__PURE__ */ React.createElement("g", { mask: "url(#a)" }, /* @__PURE__ */ React.createElement("path", { d: "M4.25 4.5H7v2.75h1.5V4.5h2.75V3H8.5V.25H7V3H4.25v1.5ZM7 17h8V3h-2.25v1.5h.75v11h-5V8.75H7V17Z" })));
-const InsertColRightIcon = SvgInsertColRight;
-const SvgDeleteSmall = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 20, height: 20, fill: "currentColor", viewBox: "0 0 20 20", ...props }, /* @__PURE__ */ React.createElement("mask", { id: "a", width: 20, height: 20, x: 0, y: 0, maskUnits: "userSpaceOnUse", style: {
-  maskType: "alpha"
-} }, /* @__PURE__ */ React.createElement("path", { d: "M0 0h20v20H0z" })), /* @__PURE__ */ React.createElement("g", { mask: "url(#a)" }, /* @__PURE__ */ React.createElement("path", { d: "M6.5 17a1.45 1.45 0 0 1-1.06-.44A1.445 1.445 0 0 1 5 15.5v-10H4V4h4V3h4v1h4v1.5h-1v9.991c0 .423-.147.78-.44 1.072A1.45 1.45 0 0 1 13.5 17h-7Zm7-11.5h-7v10h7v-10ZM8 14h1.5V7H8v7Zm2.5 0H12V7h-1.5v7Z" })));
-const DeleteSmallIcon = SvgDeleteSmall;
-const SvgInsertRowAbove = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 20, height: 20, fill: "currentColor", viewBox: "0 0 20 20", ...props }, /* @__PURE__ */ React.createElement("mask", { id: "a", width: 20, height: 20, x: 0, y: 0, maskUnits: "userSpaceOnUse", style: {
-  maskType: "alpha"
-} }, /* @__PURE__ */ React.createElement("path", { d: "M0 0h20v20H0z", transform: "matrix(-1 0 0 1 20 0)" })), /* @__PURE__ */ React.createElement("g", { mask: "url(#a)" }, /* @__PURE__ */ React.createElement("path", { d: "M4.5 16.75V14h2.75v-1.5H4.5V9.75H3v2.75H.25V14H3v2.75h1.5ZM17 14V6H3v2.25h1.5V7.5h11v5H8.75V14H17Z" })));
-const InsertRowAboveIcon = SvgInsertRowAbove;
-const SvgInsertRowBelow = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 20, height: 20, fill: "currentColor", viewBox: "0 0 20 20", ...props }, /* @__PURE__ */ React.createElement("mask", { id: "a", width: 20, height: 20, x: 0, y: 0, maskUnits: "userSpaceOnUse", style: {
-  maskType: "alpha"
-} }, /* @__PURE__ */ React.createElement("path", { d: "M20 20h20v20H20z", transform: "rotate(180 20 20)" })), /* @__PURE__ */ React.createElement("g", { mask: "url(#a)" }, /* @__PURE__ */ React.createElement("path", { d: "M4.5 3.25V6h2.75v1.5H4.5v2.75H3V7.5H.25V6H3V3.25h1.5ZM17 6v8H3v-2.25h1.5v.75h11v-5H8.75V6H17Z" })));
-const InsertRowBelowIcon = SvgInsertRowBelow;
-const SvgAddRow = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 20, height: 20, fill: "currentColor", viewBox: "0 0 20 20", ...props }, /* @__PURE__ */ React.createElement("mask", { id: "a", width: 20, height: 20, x: 0, y: 0, maskUnits: "userSpaceOnUse", style: {
-  maskType: "alpha"
-} }, /* @__PURE__ */ React.createElement("path", { d: "M20 20h20v20H20z", transform: "rotate(180 20 20)" })), /* @__PURE__ */ React.createElement("g", { mask: "url(#a)" }, /* @__PURE__ */ React.createElement("path", { d: "M10.5 3.25V6h2.75v1.5H10.5v2.75H9V7.5H6.25V6H9V3.25h1.5ZM17 6v8H3V6h2.5v1.5h-1v5h11v-5H14V6h3Z" })));
-const AddRowIcon = SvgAddRow;
-const SvgAddColumn = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 20, height: 20, fill: "currentColor", viewBox: "0 0 20 20", ...props }, /* @__PURE__ */ React.createElement("mask", { id: "a", width: 20, height: 20, x: 0, y: 0, maskUnits: "userSpaceOnUse", style: {
-  maskType: "alpha"
-} }, /* @__PURE__ */ React.createElement("path", { d: "M0 0h20v20H0z", transform: "matrix(0 -1 -1 0 20 20)" })), /* @__PURE__ */ React.createElement("g", { mask: "url(#a)" }, /* @__PURE__ */ React.createElement("path", { d: "M3.25 10.5H6v2.75h1.5V10.5h2.75V9H7.5V6.25H6V9H3.25v1.5ZM6 17h8V3H6v2.5h1.5v-1h5v11h-5V14H6v3Z" })));
-const AddColumnIcon = SvgAddColumn;
-const AlignToTailwindClassMap = {
-  center: styles.centeredCell,
-  left: styles.leftAlignedCell,
-  right: styles.rightAlignedCell
-};
-const TableEditor = ({ mdastNode, parentEditor, lexicalTable }) => {
-  const [activeCell, setActiveCell] = React__default.useState(null);
-  const setActiveCellWithBoundaries = React__default.useCallback(
-    (cell) => {
-      const colCount = lexicalTable.getColCount();
-      if (cell === null) {
-        setActiveCell(null);
-        return;
-      }
-      let [colIndex, rowIndex] = cell;
-      if (colIndex > colCount - 1) {
-        colIndex = 0;
-        rowIndex++;
-      }
-      if (colIndex < 0) {
-        colIndex = colCount - 1;
-        rowIndex -= 1;
-      }
-      if (rowIndex > lexicalTable.getRowCount() - 1) {
-        setActiveCell(null);
-        parentEditor.update(() => {
-          const nextSibling = lexicalTable.getLatest().getNextSibling();
-          if (nextSibling) {
-            lexicalTable.getLatest().selectNext();
-          } else {
-            const newParagraph = $createParagraphNode();
-            lexicalTable.insertAfter(newParagraph);
-            newParagraph.select();
-          }
-        });
-        return;
-      }
-      if (rowIndex < 0) {
-        setActiveCell(null);
-        parentEditor.update(() => {
-          lexicalTable.getLatest().selectPrevious();
-        });
-        return;
-      }
-      setActiveCell([colIndex, rowIndex]);
-    },
-    [lexicalTable, parentEditor]
-  );
-  useEffect(() => {
-    lexicalTable.focusEmitter.subscribe(setActiveCellWithBoundaries);
-  }, [lexicalTable, setActiveCellWithBoundaries]);
-  const addRowToBottom = React__default.useCallback(() => {
-    parentEditor.update(() => {
-      lexicalTable.addRowToBottom();
-      setActiveCell([0, lexicalTable.getRowCount()]);
-    });
-  }, [parentEditor, lexicalTable]);
-  const addColumnToRight = React__default.useCallback(() => {
-    parentEditor.update(() => {
-      lexicalTable.addColumnToRight();
-      setActiveCell([lexicalTable.getColCount(), 0]);
-    });
-  }, [parentEditor, lexicalTable]);
-  const [highlightedCoordinates, setHighlightedCoordinates] = React__default.useState([-1, -1]);
-  const onTableMouseOver = React__default.useCallback((e) => {
-    let tableCell = e.target;
-    while (tableCell && !["TH", "TD"].includes(tableCell.tagName)) {
-      if (tableCell === e.currentTarget) {
-        return;
-      }
-      tableCell = tableCell.parentElement;
-    }
-    if (tableCell === null) {
-      return;
-    }
-    const tableRow = tableCell.parentElement;
-    const tableContainer = tableRow.parentElement;
-    const colIndex = tableContainer.tagName === "TFOOT" ? -1 : Array.from(tableRow.children).indexOf(tableCell);
-    const rowIndex = tableCell.tagName === "TH" ? -1 : Array.from(tableRow.parentElement.children).indexOf(tableRow);
-    setHighlightedCoordinates([colIndex, rowIndex]);
-  }, []);
-  return /* @__PURE__ */ React__default.createElement("table", { className: styles.tableEditor, onMouseOver: onTableMouseOver, onMouseLeave: () => setHighlightedCoordinates([-1, -1]) }, /* @__PURE__ */ React__default.createElement("colgroup", null, /* @__PURE__ */ React__default.createElement("col", null), Array.from({ length: mdastNode.children[0].children.length }, (_, colIndex) => {
-    const align = mdastNode.align || [];
-    const currentColumnAlign = align[colIndex] || "left";
-    const className = AlignToTailwindClassMap[currentColumnAlign];
-    return /* @__PURE__ */ React__default.createElement("col", { key: colIndex, className });
-  }), /* @__PURE__ */ React__default.createElement("col", null)), /* @__PURE__ */ React__default.createElement("thead", null, /* @__PURE__ */ React__default.createElement("tr", null, /* @__PURE__ */ React__default.createElement("th", { className: styles.tableToolsColumn, "data-tool-cell": true }, /* @__PURE__ */ React__default.createElement(
-    "button",
-    {
-      className: styles.iconButton,
-      title: "Delete table",
-      onClick: () => {
-        parentEditor.update(() => {
-          lexicalTable.selectNext();
-          lexicalTable.remove();
-        });
-      }
-    },
-    /* @__PURE__ */ React__default.createElement(DeleteSmallIcon, null)
-  )), Array.from({ length: mdastNode.children[0].children.length }, (_, colIndex) => {
-    return /* @__PURE__ */ React__default.createElement("th", { key: colIndex, "data-tool-cell": true }, /* @__PURE__ */ React__default.createElement(
-      ColumnEditor,
-      {
-        ...{
-          setActiveCellWithBoundaries,
-          parentEditor,
-          colIndex,
-          highlightedCoordinates,
-          lexicalTable,
-          align: (mdastNode.align || [])[colIndex]
-        }
-      }
-    ));
-  }), /* @__PURE__ */ React__default.createElement("th", { className: styles.tableToolsColumn }))), /* @__PURE__ */ React__default.createElement("tbody", null, mdastNode.children.map((row, rowIndex) => {
-    return /* @__PURE__ */ React__default.createElement("tr", { key: rowIndex }, /* @__PURE__ */ React__default.createElement("td", { className: styles.toolCell, "data-tool-cell": true }, /* @__PURE__ */ React__default.createElement(RowEditor, { ...{ setActiveCellWithBoundaries, parentEditor, rowIndex, highlightedCoordinates, lexicalTable } })), row.children.map((mdastCell, colIndex) => {
-      var _a;
-      return /* @__PURE__ */ React__default.createElement(
-        Cell,
-        {
-          align: (_a = mdastNode.align) == null ? void 0 : _a[colIndex],
-          key: colIndex,
-          contents: mdastCell.children,
-          ...{ rowIndex, colIndex, lexicalTable, parentEditor, activeCellTuple: [activeCell, setActiveCellWithBoundaries] }
-        }
-      );
-    }), rowIndex === 0 && /* @__PURE__ */ React__default.createElement("th", { rowSpan: lexicalTable.getRowCount(), "data-tool-cell": true }, /* @__PURE__ */ React__default.createElement("button", { className: styles.addColumnButton, onClick: addColumnToRight }, /* @__PURE__ */ React__default.createElement(AddColumnIcon, null))));
-  })), /* @__PURE__ */ React__default.createElement("tfoot", null, /* @__PURE__ */ React__default.createElement("tr", null, /* @__PURE__ */ React__default.createElement("th", null), /* @__PURE__ */ React__default.createElement("th", { colSpan: lexicalTable.getColCount() }, /* @__PURE__ */ React__default.createElement("button", { className: styles.addRowButton, onClick: addRowToBottom }, /* @__PURE__ */ React__default.createElement(AddRowIcon, null))), /* @__PURE__ */ React__default.createElement("th", null))));
-};
-const Cell = ({ align, ...props }) => {
-  const [activeCell, setActiveCell] = props.activeCellTuple;
-  const isActive = activeCell && activeCell[0] === props.colIndex && activeCell[1] === props.rowIndex;
-  const className = AlignToTailwindClassMap[align || "left"];
-  return /* @__PURE__ */ React__default.createElement(
-    "td",
-    {
-      className,
-      "data-active": isActive,
-      onClick: () => {
-        setActiveCell([props.colIndex, props.rowIndex]);
-      }
-    },
-    isActive ? /* @__PURE__ */ React__default.createElement(CellEditor, { ...props }) : /* @__PURE__ */ React__default.createElement(MarkdownAstRenderer, { mdastChildren: props.contents })
-  );
-};
-const CellEditor = ({ activeCellTuple, parentEditor, lexicalTable, contents, colIndex, rowIndex }) => {
-  const [markdownParseOptions, lexicalConvertOptions, jsxComponentDescriptors, lexicalNodes] = useEmitterValues(
-    "markdownParseOptions",
-    "lexicalConvertOptions",
-    "jsxComponentDescriptors",
-    "lexicalNodes"
-  );
-  const [editor] = React__default.useState(() => {
-    let disposed = false;
-    const editor2 = createEditor({
-      nodes: lexicalNodes,
-      theme
-    });
-    function saveAndDispose(nextCell) {
-      if (disposed) {
-        return;
-      }
-      disposed = true;
-      editor2.getEditorState().read(() => {
-        const mdast = exportLexicalTreeToMdast({
-          root: $getRoot(),
-          jsxComponentDescriptors,
-          ...lexicalConvertOptions
-        });
-        parentEditor.update(() => {
-          lexicalTable.updateCellContents(colIndex, rowIndex, mdast.children[0].children);
-        });
-      });
-      activeCellTuple[1](nextCell);
-    }
-    editor2.registerCommand(
-      KEY_TAB_COMMAND,
-      (payload) => {
-        payload.preventDefault();
-        const nextCell = payload.shiftKey ? [colIndex - 1, rowIndex] : [colIndex + 1, rowIndex];
-        saveAndDispose(nextCell);
-        return true;
-      },
-      COMMAND_PRIORITY_CRITICAL
-    );
-    editor2.registerCommand(
-      KEY_ENTER_COMMAND,
-      (payload) => {
-        payload == null ? void 0 : payload.preventDefault();
-        const nextCell = (payload == null ? void 0 : payload.shiftKey) ? [colIndex, rowIndex - 1] : [colIndex, rowIndex + 1];
-        saveAndDispose(nextCell);
-        return true;
-      },
-      COMMAND_PRIORITY_CRITICAL
-    );
-    editor2.registerCommand(
-      BLUR_COMMAND,
-      (payload) => {
-        const relatedTarget = payload.relatedTarget;
-        if ((relatedTarget == null ? void 0 : relatedTarget.dataset["editorDialog"]) !== void 0 || (relatedTarget == null ? void 0 : relatedTarget.dataset["toolbarItem"]) !== void 0) {
-          return false;
-        }
-        saveAndDispose(null);
-        return true;
-      },
-      COMMAND_PRIORITY_CRITICAL
-    );
-    editor2.registerRootListener((element) => {
-      if (element) {
-        editor2.focus();
-      }
-    });
-    editor2.update(() => {
-      importMdastTreeToLexical({
-        root: $getRoot(),
-        mdastRoot: { type: "root", children: [{ type: "paragraph", children: contents }] },
-        visitors: markdownParseOptions.visitors
-      });
-    });
-    return editor2;
-  });
-  return /* @__PURE__ */ React__default.createElement(LexicalNestedComposer, { initialEditor: editor }, /* @__PURE__ */ React__default.createElement(RichTextPlugin, { contentEditable: /* @__PURE__ */ React__default.createElement(ContentEditable, { autoFocus: true }), placeholder: /* @__PURE__ */ React__default.createElement("div", null), ErrorBoundary: LexicalErrorBoundary }), /* @__PURE__ */ React__default.createElement(SharedHistoryPlugin, null));
-};
-const ColumnEditor = ({
-  parentEditor,
-  highlightedCoordinates,
-  align,
-  lexicalTable,
-  colIndex,
-  setActiveCellWithBoundaries
-}) => {
-  const [editorRootElementRef] = useEmitterValues("editorRootElementRef");
-  const insertColumnAt = React__default.useCallback(
-    (colIndex2) => {
-      parentEditor.update(() => {
-        lexicalTable.insertColumnAt(colIndex2);
-      });
-      setActiveCellWithBoundaries([colIndex2, 0]);
-    },
-    [parentEditor, lexicalTable, setActiveCellWithBoundaries]
-  );
-  const deleteColumnAt = React__default.useCallback(
-    (colIndex2) => {
-      parentEditor.update(() => {
-        lexicalTable.deleteColumnAt(colIndex2);
-      });
-    },
-    [parentEditor, lexicalTable]
-  );
-  const setColumnAlign = React__default.useCallback(
-    (colIndex2, align2) => {
-      parentEditor.update(() => {
-        lexicalTable.setColumnAlign(colIndex2, align2);
-      });
-    },
-    [parentEditor, lexicalTable]
-  );
-  return /* @__PURE__ */ React__default.createElement(RadixPopover.Root, null, /* @__PURE__ */ React__default.createElement(
-    RadixPopover.PopoverTrigger,
-    {
-      className: styles.tableColumnEditorTrigger,
-      "data-active": highlightedCoordinates[0] === colIndex + 1,
-      title: "Column menu"
-    },
-    /* @__PURE__ */ React__default.createElement(MoreHorizIcon, null)
-  ), /* @__PURE__ */ React__default.createElement(RadixPopover.Portal, { container: editorRootElementRef == null ? void 0 : editorRootElementRef.current }, /* @__PURE__ */ React__default.createElement(
-    RadixPopover.PopoverContent,
-    {
-      className: classNames(styles.tableColumnEditorPopoverContent),
-      onOpenAutoFocus: (e) => e.preventDefault(),
-      sideOffset: 5,
-      side: "top"
-    },
-    /* @__PURE__ */ React__default.createElement(RadixToolbar.Root, { className: styles.tableColumnEditorToolbar }, /* @__PURE__ */ React__default.createElement(
-      RadixToolbar.ToggleGroup,
-      {
-        className: styles.toggleGroupRoot,
-        onValueChange: (value) => {
-          setColumnAlign(colIndex, value);
-        },
-        value: align || "left",
-        type: "single",
-        "aria-label": "Text alignment"
-      },
-      /* @__PURE__ */ React__default.createElement(RadixToolbar.ToggleItem, { value: "left", title: "Align left" }, /* @__PURE__ */ React__default.createElement(AlignLeftIcon, null)),
-      /* @__PURE__ */ React__default.createElement(RadixToolbar.ToggleItem, { value: "center", title: "Align center" }, /* @__PURE__ */ React__default.createElement(AlignCenterIcon, null)),
-      /* @__PURE__ */ React__default.createElement(RadixToolbar.ToggleItem, { value: "right", title: "Align right" }, /* @__PURE__ */ React__default.createElement(AlignRightIcon, null))
-    ), /* @__PURE__ */ React__default.createElement(RadixToolbar.Separator, null), /* @__PURE__ */ React__default.createElement(RadixToolbar.Button, { onClick: insertColumnAt.bind(null, colIndex), title: "Insert a column to the left of this one" }, /* @__PURE__ */ React__default.createElement(InsertColLeftIcon, null)), /* @__PURE__ */ React__default.createElement(RadixToolbar.Button, { onClick: insertColumnAt.bind(null, colIndex + 1), title: "Insert a column to the right of this one" }, /* @__PURE__ */ React__default.createElement(InsertColRightIcon, null)), /* @__PURE__ */ React__default.createElement(RadixToolbar.Button, { onClick: deleteColumnAt.bind(null, colIndex), title: "Delete this column" }, /* @__PURE__ */ React__default.createElement(DeleteSmallIcon, null)))
-  )));
-};
-const RowEditor = ({
-  parentEditor,
-  highlightedCoordinates,
-  lexicalTable,
-  rowIndex,
-  setActiveCellWithBoundaries
-}) => {
-  const [editorRootElementRef] = useEmitterValues("editorRootElementRef");
-  const insertRowAt = React__default.useCallback(
-    (rowIndex2) => {
-      parentEditor.update(() => {
-        lexicalTable.insertRowAt(rowIndex2);
-      });
-      setActiveCellWithBoundaries([0, rowIndex2]);
-    },
-    [parentEditor, lexicalTable, setActiveCellWithBoundaries]
-  );
-  const deleteRowAt = React__default.useCallback(
-    (rowIndex2) => {
-      parentEditor.update(() => {
-        lexicalTable.deleteRowAt(rowIndex2);
-      });
-    },
-    [parentEditor, lexicalTable]
-  );
-  return /* @__PURE__ */ React__default.createElement(RadixPopover.Root, null, /* @__PURE__ */ React__default.createElement(RadixPopover.PopoverTrigger, { className: styles.tableColumnEditorTrigger, "data-active": highlightedCoordinates[1] === rowIndex }, /* @__PURE__ */ React__default.createElement(MoreHorizIcon, null)), /* @__PURE__ */ React__default.createElement(RadixPopover.Portal, { container: editorRootElementRef == null ? void 0 : editorRootElementRef.current }, /* @__PURE__ */ React__default.createElement(
-    RadixPopover.PopoverContent,
-    {
-      className: classNames(styles.tableColumnEditorPopoverContent),
-      onOpenAutoFocus: (e) => e.preventDefault(),
-      sideOffset: 5,
-      side: "bottom"
-    },
-    /* @__PURE__ */ React__default.createElement(RadixToolbar.Root, { className: styles.tableColumnEditorToolbar }, /* @__PURE__ */ React__default.createElement(RadixToolbar.Button, { onClick: insertRowAt.bind(null, rowIndex), title: "Insert a row above this one" }, /* @__PURE__ */ React__default.createElement(InsertRowAboveIcon, null)), /* @__PURE__ */ React__default.createElement(RadixToolbar.Button, { onClick: insertRowAt.bind(null, rowIndex + 1), title: "Insert a row below this one" }, /* @__PURE__ */ React__default.createElement(InsertRowBelowIcon, null)), /* @__PURE__ */ React__default.createElement(RadixToolbar.Button, { onClick: deleteRowAt.bind(null, rowIndex), title: "Delete this row" }, /* @__PURE__ */ React__default.createElement(DeleteSmallIcon, null)))
-  )));
-};
-export {
-  TableEditor
-};