@payloadcms/richtext-lexical 3.0.0-beta.109 → 3.0.0-beta.110

package/dist/features/blocks/client/componentInline/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/componentInline/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAyC,MAAM,OAAO,CAAA;AAoB7D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAA;AAKrE,OAAO,cAAc,CAAA;AAErB,KAAK,KAAK,GAAG;IACX,QAAQ,CAAC,QAAQ,EAAE,iBAAiB,CAAA;IACpC,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA+HhD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/blocks/client/componentInline/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAyC,MAAM,OAAO,CAAA;AAoB7D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAA;AAKrE,OAAO,cAAc,CAAA;AAErB,KAAK,KAAK,GAAG;IACX,QAAQ,CAAC,QAAQ,EAAE,iBAAiB,CAAA;IACpC,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAkIhD,CAAA"}

package/dist/features/blocks/client/componentInline/index.js

@@ -41,16 +41,19 @@ export const InlineBlockComponent = props => {
     });
   }, [editor, nodeKey]);
   const $onDelete = useCallback(event => {
-    if (isSelected && $isNodeSelection($getSelection())) {
+    const deleteSelection = $getSelection();
+    if (isSelected && $isNodeSelection(deleteSelection)) {
       event.preventDefault();
-      const node = $getNodeByKey(nodeKey);
-      if ($isInlineBlockNode(node)) {
-        node.remove();
-        return true;
-      }
+      editor.update(() => {
+        deleteSelection.getNodes().forEach(node => {
+          if ($isInlineBlockNode(node)) {
+            node.remove();
+          }
+        });
+      });
     }
     return false;
-  }, [isSelected, nodeKey]);
+  }, [editor, isSelected]);
   const onClick = useCallback(payload => {
     const event_0 = payload;
     // Check if inlineBlockElemElemRef.target or anything WITHIN inlineBlockElemElemRef.target was clicked

package/dist/features/blocks/client/componentInline/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","useCallback","useEffect","useRef","baseClass","useLexicalComposerContext","useLexicalNodeSelection","mergeRegister","getTranslation","Button","RenderComponent","useTranslation","$getNodeByKey","$getSelection","$isNodeSelection","CLICK_COMMAND","COMMAND_PRIORITY_LOW","KEY_BACKSPACE_COMMAND","KEY_DELETE_COMMAND","useEditorConfigContext","$isInlineBlockNode","OPEN_INLINE_BLOCK_DRAWER_COMMAND","InlineBlockComponent","props","formData","nodeKey","editor","i18n","t","field","inlineBlockElemElemRef","isSelected","setSelected","clearSelection","richTextComponentMap","componentMapRenderedBlockPath","blocksField","get","clientBlock","blocks","find","block","slug","blockType","removeInlineBlock","update","remove","$onDelete","event","preventDefault","node","onClick","payload","target","current","contains","shiftKey","registerCommand","blockDisplayName","labels","singular","_jsxs","className","filter","Boolean","join","ref","admin","components","Label","_jsx","clientProps","blockKind","mappedComponent","isEditable","buttonStyle","disabled","readOnly","el","icon","dispatchCommand","fields","round","size","tooltip","label","e"],"sources":["../../../../../src/features/blocks/client/componentInline/index.tsx"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useEffect, useRef } from 'react'\nconst baseClass = 'inline-block'\n\nimport type { BlocksFieldClient } from 'payload'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { useLexicalNodeSelection } from '@lexical/react/useLexicalNodeSelection'\nimport { mergeRegister } from '@lexical/utils'\nimport { getTranslation } from '@payloadcms/translations'\nimport { Button, RenderComponent, useTranslation } from '@payloadcms/ui'\nimport {\n  $getNodeByKey,\n  $getSelection,\n  $isNodeSelection,\n  CLICK_COMMAND,\n  COMMAND_PRIORITY_LOW,\n  KEY_BACKSPACE_COMMAND,\n  KEY_DELETE_COMMAND,\n} from 'lexical'\n\nimport type { InlineBlockFields } from '../nodes/InlineBlocksNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { $isInlineBlockNode } from '../nodes/InlineBlocksNode.js'\nimport { OPEN_INLINE_BLOCK_DRAWER_COMMAND } from '../plugin/commands.js'\nimport './index.scss'\n\ntype Props = {\n  readonly formData: InlineBlockFields\n  readonly nodeKey: string\n}\n\nexport const InlineBlockComponent: React.FC<Props> = (props) => {\n  const { formData, nodeKey } = props\n  const [editor] = useLexicalComposerContext()\n  const { i18n, t } = useTranslation<object, string>()\n  const { field } = useEditorConfigContext()\n  const inlineBlockElemElemRef = useRef<HTMLDivElement | null>(null)\n  const [isSelected, setSelected, clearSelection] = useLexicalNodeSelection(nodeKey)\n\n  const {\n    field: { richTextComponentMap },\n  } = useEditorConfigContext()\n\n  const componentMapRenderedBlockPath = `lexical_internal_feature.blocks.fields.lexical_inline_blocks`\n  const blocksField: BlocksFieldClient = richTextComponentMap?.get(componentMapRenderedBlockPath)[0]\n  const clientBlock = blocksField.blocks.find((block) => block.slug === formData.blockType)\n\n  const removeInlineBlock = useCallback(() => {\n    editor.update(() => {\n      $getNodeByKey(nodeKey)?.remove()\n    })\n  }, [editor, nodeKey])\n\n  const $onDelete = useCallback(\n    (event: KeyboardEvent) => {\n      if (isSelected && $isNodeSelection($getSelection())) {\n        event.preventDefault()\n        const node = $getNodeByKey(nodeKey)\n        if ($isInlineBlockNode(node)) {\n          node.remove()\n          return true\n        }\n      }\n      return false\n    },\n    [isSelected, nodeKey],\n  )\n  const onClick = useCallback(\n    (payload: MouseEvent) => {\n      const event = payload\n      // Check if inlineBlockElemElemRef.target or anything WITHIN inlineBlockElemElemRef.target was clicked\n      if (\n        event.target === inlineBlockElemElemRef.current ||\n        inlineBlockElemElemRef.current?.contains(event.target as Node)\n      ) {\n        if (event.shiftKey) {\n          setSelected(!isSelected)\n        } else {\n          if (!isSelected) {\n            clearSelection()\n            setSelected(true)\n          }\n        }\n        return true\n      }\n\n      return false\n    },\n    [isSelected, setSelected, clearSelection],\n  )\n\n  useEffect(() => {\n    return mergeRegister(\n      editor.registerCommand<MouseEvent>(CLICK_COMMAND, onClick, COMMAND_PRIORITY_LOW),\n\n      editor.registerCommand(KEY_DELETE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n      editor.registerCommand(KEY_BACKSPACE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n    )\n  }, [clearSelection, editor, isSelected, nodeKey, $onDelete, setSelected, onClick])\n\n  const blockDisplayName = clientBlock?.labels?.singular\n    ? getTranslation(clientBlock.labels.singular, i18n)\n    : clientBlock?.slug\n\n  return (\n    <div\n      className={[\n        baseClass,\n        baseClass + '-' + formData.blockType,\n        isSelected && `${baseClass}--selected`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      ref={inlineBlockElemElemRef}\n    >\n      {clientBlock?.admin?.components?.Label ? (\n        <RenderComponent\n          clientProps={{ blockKind: 'lexicalInlineBlock', formData }}\n          mappedComponent={clientBlock.admin.components.Label}\n        />\n      ) : (\n        <div>{getTranslation(clientBlock!.labels!.singular, i18n)}</div>\n      )}\n      {editor.isEditable() && (\n        <div className={`${baseClass}__actions`}>\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__editButton`}\n            disabled={field?.admin?.readOnly}\n            el=\"div\"\n            icon=\"edit\"\n            onClick={() => {\n              editor.dispatchCommand(OPEN_INLINE_BLOCK_DRAWER_COMMAND, {\n                fields: formData,\n                nodeKey,\n              })\n            }}\n            round\n            size=\"small\"\n            tooltip={t('lexical:blocks:inlineBlocks:edit', { label: blockDisplayName })}\n          />\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__removeButton`}\n            disabled={field?.admin?.readOnly}\n            icon=\"x\"\n            onClick={(e) => {\n              e.preventDefault()\n              removeInlineBlock()\n            }}\n            round\n            size=\"small\"\n            tooltip={t('lexical:blocks:inlineBlocks:remove', { label: blockDisplayName })}\n          />\n        </div>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","useCallback","useEffect","useRef","baseClass","useLexicalComposerContext","useLexicalNodeSelection","mergeRegister","getTranslation","Button","RenderComponent","useTranslation","$getNodeByKey","$getSelection","$isNodeSelection","CLICK_COMMAND","COMMAND_PRIORITY_LOW","KEY_BACKSPACE_COMMAND","KEY_DELETE_COMMAND","useEditorConfigContext","$isInlineBlockNode","OPEN_INLINE_BLOCK_DRAWER_COMMAND","InlineBlockComponent","props","formData","nodeKey","editor","i18n","t","field","inlineBlockElemElemRef","isSelected","setSelected","clearSelection","richTextComponentMap","componentMapRenderedBlockPath","blocksField","get","clientBlock","blocks","find","block","slug","blockType","removeInlineBlock","update","remove","$onDelete","event","deleteSelection","preventDefault","getNodes","forEach","node","onClick","payload","target","current","contains","shiftKey","registerCommand","blockDisplayName","labels","singular","_jsxs","className","filter","Boolean","join","ref","admin","components","Label","_jsx","clientProps","blockKind","mappedComponent","isEditable","buttonStyle","disabled","readOnly","el","icon","dispatchCommand","fields","round","size","tooltip","label","e"],"sources":["../../../../../src/features/blocks/client/componentInline/index.tsx"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useEffect, useRef } from 'react'\nconst baseClass = 'inline-block'\n\nimport type { BlocksFieldClient } from 'payload'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { useLexicalNodeSelection } from '@lexical/react/useLexicalNodeSelection'\nimport { mergeRegister } from '@lexical/utils'\nimport { getTranslation } from '@payloadcms/translations'\nimport { Button, RenderComponent, useTranslation } from '@payloadcms/ui'\nimport {\n  $getNodeByKey,\n  $getSelection,\n  $isNodeSelection,\n  CLICK_COMMAND,\n  COMMAND_PRIORITY_LOW,\n  KEY_BACKSPACE_COMMAND,\n  KEY_DELETE_COMMAND,\n} from 'lexical'\n\nimport type { InlineBlockFields } from '../nodes/InlineBlocksNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { $isInlineBlockNode } from '../nodes/InlineBlocksNode.js'\nimport { OPEN_INLINE_BLOCK_DRAWER_COMMAND } from '../plugin/commands.js'\nimport './index.scss'\n\ntype Props = {\n  readonly formData: InlineBlockFields\n  readonly nodeKey: string\n}\n\nexport const InlineBlockComponent: React.FC<Props> = (props) => {\n  const { formData, nodeKey } = props\n  const [editor] = useLexicalComposerContext()\n  const { i18n, t } = useTranslation<object, string>()\n  const { field } = useEditorConfigContext()\n  const inlineBlockElemElemRef = useRef<HTMLDivElement | null>(null)\n  const [isSelected, setSelected, clearSelection] = useLexicalNodeSelection(nodeKey)\n\n  const {\n    field: { richTextComponentMap },\n  } = useEditorConfigContext()\n\n  const componentMapRenderedBlockPath = `lexical_internal_feature.blocks.fields.lexical_inline_blocks`\n  const blocksField: BlocksFieldClient = richTextComponentMap?.get(componentMapRenderedBlockPath)[0]\n  const clientBlock = blocksField.blocks.find((block) => block.slug === formData.blockType)\n\n  const removeInlineBlock = useCallback(() => {\n    editor.update(() => {\n      $getNodeByKey(nodeKey)?.remove()\n    })\n  }, [editor, nodeKey])\n\n  const $onDelete = useCallback(\n    (event: KeyboardEvent) => {\n      const deleteSelection = $getSelection()\n      if (isSelected && $isNodeSelection(deleteSelection)) {\n        event.preventDefault()\n        editor.update(() => {\n          deleteSelection.getNodes().forEach((node) => {\n            if ($isInlineBlockNode(node)) {\n              node.remove()\n            }\n          })\n        })\n      }\n      return false\n    },\n    [editor, isSelected],\n  )\n  const onClick = useCallback(\n    (payload: MouseEvent) => {\n      const event = payload\n      // Check if inlineBlockElemElemRef.target or anything WITHIN inlineBlockElemElemRef.target was clicked\n      if (\n        event.target === inlineBlockElemElemRef.current ||\n        inlineBlockElemElemRef.current?.contains(event.target as Node)\n      ) {\n        if (event.shiftKey) {\n          setSelected(!isSelected)\n        } else {\n          if (!isSelected) {\n            clearSelection()\n            setSelected(true)\n          }\n        }\n        return true\n      }\n\n      return false\n    },\n    [isSelected, setSelected, clearSelection],\n  )\n\n  useEffect(() => {\n    return mergeRegister(\n      editor.registerCommand<MouseEvent>(CLICK_COMMAND, onClick, COMMAND_PRIORITY_LOW),\n\n      editor.registerCommand(KEY_DELETE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n      editor.registerCommand(KEY_BACKSPACE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n    )\n  }, [clearSelection, editor, isSelected, nodeKey, $onDelete, setSelected, onClick])\n\n  const blockDisplayName = clientBlock?.labels?.singular\n    ? getTranslation(clientBlock.labels.singular, i18n)\n    : clientBlock?.slug\n\n  return (\n    <div\n      className={[\n        baseClass,\n        baseClass + '-' + formData.blockType,\n        isSelected && `${baseClass}--selected`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      ref={inlineBlockElemElemRef}\n    >\n      {clientBlock?.admin?.components?.Label ? (\n        <RenderComponent\n          clientProps={{ blockKind: 'lexicalInlineBlock', formData }}\n          mappedComponent={clientBlock.admin.components.Label}\n        />\n      ) : (\n        <div>{getTranslation(clientBlock!.labels!.singular, i18n)}</div>\n      )}\n      {editor.isEditable() && (\n        <div className={`${baseClass}__actions`}>\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__editButton`}\n            disabled={field?.admin?.readOnly}\n            el=\"div\"\n            icon=\"edit\"\n            onClick={() => {\n              editor.dispatchCommand(OPEN_INLINE_BLOCK_DRAWER_COMMAND, {\n                fields: formData,\n                nodeKey,\n              })\n            }}\n            round\n            size=\"small\"\n            tooltip={t('lexical:blocks:inlineBlocks:edit', { label: blockDisplayName })}\n          />\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__removeButton`}\n            disabled={field?.admin?.readOnly}\n            icon=\"x\"\n            onClick={(e) => {\n              e.preventDefault()\n              removeInlineBlock()\n            }}\n            round\n            size=\"small\"\n            tooltip={t('lexical:blocks:inlineBlocks:remove', { label: blockDisplayName })}\n          />\n        </div>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/experimental_table/client/plugins/TableActionMenuPlugin/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/experimental_table/client/plugins/TableActionMenuPlugin/index.tsx"],"names":[],"mappings":"AA4CA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAA;AAG3E,OAAO,cAAc,CAAA;AAwoBrB,eAAO,MAAM,qBAAqB,EAAE,yBAQnC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/experimental_table/client/plugins/TableActionMenuPlugin/index.tsx"],"names":[],"mappings":"AA4CA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAA;AAG3E,OAAO,cAAc,CAAA;AAonBrB,eAAO,MAAM,qBAAqB,EAAE,yBAQnC,CAAA"}

package/dist/features/experimental_table/client/plugins/TableActionMenuPlugin/index.js

@@ -17,43 +17,6 @@ function computeSelectionCount(selection) {
     rows: selectionShape.toY - selectionShape.fromY + 1
   };
 }
-// This is important when merging cells as there is no good way to re-merge weird shapes (a result
-// of selecting merged cells and non-merged)
-function isTableSelectionRectangular(selection) {
-  const nodes = selection.getNodes();
-  const currentRows = [];
-  let currentRow = null;
-  let expectedColumns = null;
-  let currentColumns = 0;
-  for (let i = 0; i < nodes.length; i++) {
-    const node = nodes[i];
-    if ($isTableCellNode(node)) {
-      const row = node.getParentOrThrow();
-      if (!$isTableRowNode(row)) {
-        throw new Error('Expected CellNode to have a RowNode parent');
-      }
-      if (currentRow !== row) {
-        if (expectedColumns !== null && currentColumns !== expectedColumns) {
-          return false;
-        }
-        if (currentRow !== null) {
-          expectedColumns = currentColumns;
-        }
-        currentRow = row;
-        currentColumns = 0;
-      }
-      const colSpan = node.__colSpan;
-      for (let j = 0; j < colSpan; j++) {
-        if (currentRows[currentColumns + j] === undefined) {
-          currentRows[currentColumns + j] = 0;
-        }
-        currentRows[currentColumns + j] += node.__rowSpan;
-      }
-      currentColumns += colSpan;
-    }
-  }
-  return (expectedColumns === null || currentColumns === expectedColumns) && currentRows.every(v => v === currentRows[0]);
-}
 function $canUnmerge() {
   const selection = $getSelection();
   if ($isRangeSelection(selection) && !selection.isCollapsed() || $isTableSelection(selection) && !selection.anchor.is(selection.focus) || !$isRangeSelection(selection) && !$isTableSelection(selection)) {
@@ -120,7 +83,7 @@ function TableActionMenu({
       if ($isTableSelection(selection)) {
         const currentSelectionCounts = computeSelectionCount(selection);
         updateSelectionCounts(computeSelectionCount(selection));
-        setCanMergeCells(isTableSelectionRectangular(selection) && (currentSelectionCounts.columns > 1 || currentSelectionCounts.rows > 1));
+        setCanMergeCells(currentSelectionCounts.columns > 1 || currentSelectionCounts.rows > 1);
       }
       // Unmerge cell
       setCanUnmergeCell($canUnmerge());
@@ -167,9 +130,9 @@ function TableActionMenu({
         if (!tableElement) {
           throw new Error('Expected to find tableElement in DOM');
         }
-        const tableSelection = getTableObserverFromTableElement(tableElement);
-        if (tableSelection !== null) {
-          tableSelection.clearHighlight();
+        const tableObserver = getTableObserverFromTableElement(tableElement);
+        if (tableObserver !== null) {
+          tableObserver.clearHighlight();
         }
         tableNode.markDirty();
         updateTableCellNode(tableCellNode.getLatest());
@@ -269,11 +232,12 @@ function TableActionMenu({
       if (!$isTableRowNode(tableRow)) {
         throw new Error('Expected table row');
       }
+      const newStyle = tableCellNode.getHeaderStyles() ^ TableCellHeaderStates.ROW;
       tableRow.getChildren().forEach(tableCell => {
         if (!$isTableCellNode(tableCell)) {
           throw new Error('Expected table cell');
         }
-        tableCell.toggleHeaderStyle(TableCellHeaderStates.ROW);
+        tableCell.setHeaderStyles(newStyle, TableCellHeaderStates.ROW);
       });
       clearTableSelection();
       onClose();
@@ -288,6 +252,7 @@ function TableActionMenu({
       if (tableColumnIndex >= maxRowsLength || tableColumnIndex < 0) {
         throw new Error('Expected table cell to be inside of table row.');
       }
+      const newStyle_0 = tableCellNode.getHeaderStyles() ^ TableCellHeaderStates.COLUMN;
       for (let r = 0; r < tableRows_0.length; r++) {
         const tableRow_0 = tableRows_0[r];
         if (!$isTableRowNode(tableRow_0)) {
@@ -301,7 +266,19 @@ function TableActionMenu({
         if (!$isTableCellNode(tableCell_0)) {
           throw new Error('Expected table cell');
         }
-        tableCell_0.toggleHeaderStyle(TableCellHeaderStates.COLUMN);
+        tableCell_0.setHeaderStyles(newStyle_0, TableCellHeaderStates.COLUMN);
+      }
+      clearTableSelection();
+      onClose();
+    });
+  }, [editor, tableCellNode, clearTableSelection, onClose]);
+  const toggleRowStriping = useCallback(() => {
+    editor.update(() => {
+      if (tableCellNode.isAttached()) {
+        const tableNode_3 = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
+        if (tableNode_3) {
+          tableNode_3.setRowStriping(!tableNode_3.getRowStriping());
+        }
       }
       clearTableSelection();
       onClose();
@@ -339,6 +316,15 @@ function TableActionMenu({
     children: [mergeCellButton ? /*#__PURE__*/_jsxs(React.Fragment, {
       children: [mergeCellButton, /*#__PURE__*/_jsx("hr", {})]
     }) : null, /*#__PURE__*/_jsx("button", {
+      className: "item",
+      "data-test-id": "table-row-striping",
+      onClick: () => toggleRowStriping(),
+      type: "button",
+      children: /*#__PURE__*/_jsx("span", {
+        className: "text",
+        children: "Toggle Row Striping"
+      })
+    }), /*#__PURE__*/_jsx("button", {
       className: "item",
       "data-test-id": "table-insert-row-above",
       onClick: () => insertTableRowAtSelection(false),

package/dist/features/experimental_table/client/plugins/TableActionMenuPlugin/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["useLexicalComposerContext","useLexicalEditable","$deleteTableColumn__EXPERIMENTAL","$deleteTableRow__EXPERIMENTAL","$getNodeTriplet","$getTableCellNodeFromLexicalNode","$getTableColumnIndexFromTableCellNode","$getTableNodeFromLexicalNodeOrThrow","$getTableRowIndexFromTableCellNode","$insertTableColumn__EXPERIMENTAL","$insertTableRow__EXPERIMENTAL","$isTableCellNode","$isTableRowNode","$isTableSelection","$unmergeCell","getTableObserverFromTableElement","TableCellHeaderStates","TableCellNode","useScrollInfo","$createParagraphNode","$getRoot","$getSelection","$isElementNode","$isParagraphNode","$isRangeSelection","$isTextNode","React","useCallback","useEffect","useRef","useState","createPortal","MeatballsIcon","computeSelectionCount","selection","selectionShape","getShape","columns","toX","fromX","rows","toY","fromY","isTableSelectionRectangular","nodes","getNodes","currentRows","currentRow","expectedColumns","currentColumns","i","length","node","row","getParentOrThrow","Error","colSpan","__colSpan","j","undefined","__rowSpan","every","v","$canUnmerge","isCollapsed","anchor","is","focus","cell","$cellContainsEmptyParagraph","getChildrenSize","firstChild","getFirstChildOrThrow","isEmpty","$selectLastDescendant","lastDescendant","getLastDescendant","select","selectEnd","selectNext","TableActionMenu","cellMerge","contextRef","onClose","setIsMenuOpen","tableCellNode","_tableCellNode","editor","dropDownRef","updateTableCellNode","selectionCounts","updateSelectionCounts","canMergeCells","setCanMergeCells","canUnmergeCell","setCanUnmergeCell","y","registerMutationListener","nodeMutations","nodeUpdated","get","getKey","getEditorState","read","getLatest","skipInitialization","currentSelectionCounts","menuButtonElement","current","dropDownElement","rootElement","getRootElement","rootEleRect","getBoundingClientRect","menuButtonRect","style","opacity","dropDownElementRect","margin","leftPosition","right","width","window","innerWidth","position","left","pageXOffset","topPosition","top","height","innerHeight","bottom","pageYOffset","handleClickOutside","event","contains","target","addEventListener","removeEventListener","clearTableSelection","update","isAttached","tableNode","tableElement","getElementByKey","tableSelection","clearHighlight","markDirty","rootNode","selectStart","mergeTableCellsAtSelection","firstCell","setColSpan","setRowSpan","getFirstChild","remove","append","getChildren","unmergeTableCellsAtSelection","insertTableRowAtSelection","shouldInsertAfter","insertTableColumnAtSelection","deleteTableRowAtSelection","deleteTableAtSelection","deleteTableColumnAtSelection","toggleTableRowIsHeader","tableRowIndex","tableRows","tableRow","forEach","tableCell","toggleHeaderStyle","ROW","toggleTableColumnIsHeader","tableColumnIndex","maxRowsLength","Math","max","map","r","tableCells","COLUMN","mergeCellButton","_jsx","className","onClick","type","_jsxs","e","stopPropagation","ref","Fragment","__headerState","document","body","TableCellActionMenuContainer","anchorElem","menuButtonRef","menuRootRef","isMenuOpen","setTableMenuCellNode","$moveMenu","menu","nativeSelection","getSelection","activeElement","anchorNode","tableCellNodeFromSelection","getNode","tableCellParentNodeDOM","registerUpdateListener","menuButtonDOM","tableCellNodeDOM","tableCellRect","menuRect","anchorRect","transform","prevTableCellDOM","TableActionMenuPlugin","isEditable"],"sources":["../../../../../../src/features/experimental_table/client/plugins/TableActionMenuPlugin/index.tsx"],"sourcesContent":["'use client'\n\nimport type {\n  HTMLTableElementWithWithTableSelectionState,\n  TableRowNode,\n  TableSelection,\n} from '@lexical/table'\nimport type { ElementNode } from 'lexical'\nimport type { JSX } from 'react'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport {\n  $deleteTableColumn__EXPERIMENTAL,\n  $deleteTableRow__EXPERIMENTAL,\n  $getNodeTriplet,\n  $getTableCellNodeFromLexicalNode,\n  $getTableColumnIndexFromTableCellNode,\n  $getTableNodeFromLexicalNodeOrThrow,\n  $getTableRowIndexFromTableCellNode,\n  $insertTableColumn__EXPERIMENTAL,\n  $insertTableRow__EXPERIMENTAL,\n  $isTableCellNode,\n  $isTableRowNode,\n  $isTableSelection,\n  $unmergeCell,\n  getTableObserverFromTableElement,\n  TableCellHeaderStates,\n  TableCellNode,\n} from '@lexical/table'\nimport { useScrollInfo } from '@payloadcms/ui'\nimport {\n  $createParagraphNode,\n  $getRoot,\n  $getSelection,\n  $isElementNode,\n  $isParagraphNode,\n  $isRangeSelection,\n  $isTextNode,\n} from 'lexical'\nimport * as React from 'react'\nimport { useCallback, useEffect, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\n\nimport type { PluginComponentWithAnchor } from '../../../../typesClient.js'\n\nimport { MeatballsIcon } from '../../../../../lexical/ui/icons/Meatballs/index.js'\nimport './index.scss'\n\nfunction computeSelectionCount(selection: TableSelection): {\n  columns: number\n  rows: number\n} {\n  const selectionShape = selection.getShape()\n  return {\n    columns: selectionShape.toX - selectionShape.fromX + 1,\n    rows: selectionShape.toY - selectionShape.fromY + 1,\n  }\n}\n\n// This is important when merging cells as there is no good way to re-merge weird shapes (a result\n// of selecting merged cells and non-merged)\nfunction isTableSelectionRectangular(selection: TableSelection): boolean {\n  const nodes = selection.getNodes()\n  const currentRows: Array<number> = []\n  let currentRow: null | TableRowNode = null\n  let expectedColumns: null | number = null\n  let currentColumns = 0\n  for (let i = 0; i < nodes.length; i++) {\n    const node = nodes[i]\n    if ($isTableCellNode(node)) {\n      const row = node.getParentOrThrow()\n      if (!$isTableRowNode(row)) {\n        throw new Error('Expected CellNode to have a RowNode parent')\n      }\n      if (currentRow !== row) {\n        if (expectedColumns !== null && currentColumns !== expectedColumns) {\n          return false\n        }\n        if (currentRow !== null) {\n          expectedColumns = currentColumns\n        }\n        currentRow = row\n        currentColumns = 0\n      }\n      const colSpan = node.__colSpan\n      for (let j = 0; j < colSpan; j++) {\n        if (currentRows[currentColumns + j] === undefined) {\n          currentRows[currentColumns + j] = 0\n        }\n        currentRows[currentColumns + j] += node.__rowSpan\n      }\n      currentColumns += colSpan\n    }\n  }\n  return (\n    (expectedColumns === null || currentColumns === expectedColumns) &&\n    currentRows.every((v) => v === currentRows[0])\n  )\n}\n\nfunction $canUnmerge(): boolean {\n  const selection = $getSelection()\n  if (\n    ($isRangeSelection(selection) && !selection.isCollapsed()) ||\n    ($isTableSelection(selection) && !selection.anchor.is(selection.focus)) ||\n    (!$isRangeSelection(selection) && !$isTableSelection(selection))\n  ) {\n    return false\n  }\n  const [cell] = $getNodeTriplet(selection.anchor)\n  return cell.__colSpan > 1 || cell.__rowSpan > 1\n}\n\nfunction $cellContainsEmptyParagraph(cell: TableCellNode): boolean {\n  if (cell.getChildrenSize() !== 1) {\n    return false\n  }\n  const firstChild = cell.getFirstChildOrThrow()\n  if (!$isParagraphNode(firstChild) || !firstChild.isEmpty()) {\n    return false\n  }\n  return true\n}\n\nfunction $selectLastDescendant(node: ElementNode): void {\n  const lastDescendant = node.getLastDescendant()\n  if ($isTextNode(lastDescendant)) {\n    lastDescendant.select()\n  } else if ($isElementNode(lastDescendant)) {\n    lastDescendant.selectEnd()\n  } else if (lastDescendant !== null) {\n    lastDescendant.selectNext()\n  }\n}\n\ntype TableCellActionMenuProps = Readonly<{\n  cellMerge: boolean\n  contextRef: { current: HTMLElement | null }\n  onClose: () => void\n  setIsMenuOpen: (isOpen: boolean) => void\n  tableCellNode: TableCellNode\n}>\n\nfunction TableActionMenu({\n  cellMerge,\n  contextRef,\n  onClose,\n  setIsMenuOpen,\n  tableCellNode: _tableCellNode,\n}: TableCellActionMenuProps) {\n  const [editor] = useLexicalComposerContext()\n  const dropDownRef = useRef<HTMLDivElement | null>(null)\n  const [tableCellNode, updateTableCellNode] = useState(_tableCellNode)\n  const [selectionCounts, updateSelectionCounts] = useState({\n    columns: 1,\n    rows: 1,\n  })\n  const [canMergeCells, setCanMergeCells] = useState(false)\n  const [canUnmergeCell, setCanUnmergeCell] = useState(false)\n  const { y } = useScrollInfo()\n\n  useEffect(() => {\n    return editor.registerMutationListener(\n      TableCellNode,\n      (nodeMutations) => {\n        const nodeUpdated = nodeMutations.get(tableCellNode.getKey()) === 'updated'\n\n        if (nodeUpdated) {\n          editor.getEditorState().read(() => {\n            updateTableCellNode(tableCellNode.getLatest())\n          })\n        }\n      },\n      { skipInitialization: true },\n    )\n  }, [editor, tableCellNode])\n\n  useEffect(() => {\n    editor.getEditorState().read(() => {\n      const selection = $getSelection()\n      // Merge cells\n      if ($isTableSelection(selection)) {\n        const currentSelectionCounts = computeSelectionCount(selection)\n        updateSelectionCounts(computeSelectionCount(selection))\n        setCanMergeCells(\n          isTableSelectionRectangular(selection) &&\n            (currentSelectionCounts.columns > 1 || currentSelectionCounts.rows > 1),\n        )\n      }\n      // Unmerge cell\n      setCanUnmergeCell($canUnmerge())\n    })\n  }, [editor])\n\n  useEffect(() => {\n    const menuButtonElement = contextRef.current\n    const dropDownElement = dropDownRef.current\n    const rootElement = editor.getRootElement()\n\n    if (menuButtonElement != null && dropDownElement != null && rootElement != null) {\n      const rootEleRect = rootElement.getBoundingClientRect()\n      const menuButtonRect = menuButtonElement.getBoundingClientRect()\n      dropDownElement.style.opacity = '1'\n      const dropDownElementRect = dropDownElement.getBoundingClientRect()\n      const margin = 5\n      let leftPosition = menuButtonRect.right + margin\n      if (\n        leftPosition + dropDownElementRect.width > window.innerWidth ||\n        leftPosition + dropDownElementRect.width > rootEleRect.right\n      ) {\n        const position = menuButtonRect.left - dropDownElementRect.width - margin\n        leftPosition = (position < 0 ? margin : position) + window.pageXOffset\n      }\n      dropDownElement.style.left = `${leftPosition + window.pageXOffset}px`\n\n      let topPosition = menuButtonRect.top\n      if (topPosition + dropDownElementRect.height > window.innerHeight) {\n        const position = menuButtonRect.bottom - dropDownElementRect.height\n        topPosition = (position < 0 ? margin : position) + window.pageYOffset\n      }\n      dropDownElement.style.top = `${topPosition}px`\n    }\n  }, [contextRef, dropDownRef, editor, y])\n\n  useEffect(() => {\n    function handleClickOutside(event: MouseEvent) {\n      if (\n        dropDownRef.current != null &&\n        contextRef.current != null &&\n        !dropDownRef.current.contains(event.target as Node) &&\n        !contextRef.current.contains(event.target as Node)\n      ) {\n        setIsMenuOpen(false)\n      }\n    }\n\n    window.addEventListener('click', handleClickOutside)\n\n    return () => window.removeEventListener('click', handleClickOutside)\n  }, [setIsMenuOpen, contextRef])\n\n  const clearTableSelection = useCallback(() => {\n    editor.update(() => {\n      if (tableCellNode.isAttached()) {\n        const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode)\n        const tableElement = editor.getElementByKey(\n          tableNode.getKey(),\n        ) as HTMLTableElementWithWithTableSelectionState\n\n        if (!tableElement) {\n          throw new Error('Expected to find tableElement in DOM')\n        }\n\n        const tableSelection = getTableObserverFromTableElement(tableElement)\n        if (tableSelection !== null) {\n          tableSelection.clearHighlight()\n        }\n\n        tableNode.markDirty()\n        updateTableCellNode(tableCellNode.getLatest())\n      }\n\n      const rootNode = $getRoot()\n      rootNode.selectStart()\n    })\n  }, [editor, tableCellNode])\n\n  const mergeTableCellsAtSelection = () => {\n    editor.update(() => {\n      const selection = $getSelection()\n      if ($isTableSelection(selection)) {\n        const { columns, rows } = computeSelectionCount(selection)\n        const nodes = selection.getNodes()\n        let firstCell: null | TableCellNode = null\n        for (let i = 0; i < nodes.length; i++) {\n          const node = nodes[i]\n          if ($isTableCellNode(node)) {\n            if (firstCell === null) {\n              node.setColSpan(columns).setRowSpan(rows)\n              firstCell = node\n              const isEmpty = $cellContainsEmptyParagraph(node)\n              let firstChild\n              if (isEmpty && $isParagraphNode((firstChild = node.getFirstChild()))) {\n                firstChild.remove()\n              }\n            } else if ($isTableCellNode(firstCell)) {\n              const isEmpty = $cellContainsEmptyParagraph(node)\n              if (!isEmpty) {\n                firstCell.append(...node.getChildren())\n              }\n              node.remove()\n            }\n          }\n        }\n        if (firstCell !== null) {\n          if (firstCell.getChildrenSize() === 0) {\n            firstCell.append($createParagraphNode())\n          }\n          $selectLastDescendant(firstCell)\n        }\n        onClose()\n      }\n    })\n  }\n\n  const unmergeTableCellsAtSelection = () => {\n    editor.update(() => {\n      $unmergeCell()\n    })\n  }\n\n  const insertTableRowAtSelection = useCallback(\n    (shouldInsertAfter: boolean) => {\n      editor.update(() => {\n        $insertTableRow__EXPERIMENTAL(shouldInsertAfter)\n        onClose()\n      })\n    },\n    [editor, onClose],\n  )\n\n  const insertTableColumnAtSelection = useCallback(\n    (shouldInsertAfter: boolean) => {\n      editor.update(() => {\n        for (let i = 0; i < selectionCounts.columns; i++) {\n          $insertTableColumn__EXPERIMENTAL(shouldInsertAfter)\n        }\n        onClose()\n      })\n    },\n    [editor, onClose, selectionCounts.columns],\n  )\n\n  const deleteTableRowAtSelection = useCallback(() => {\n    editor.update(() => {\n      $deleteTableRow__EXPERIMENTAL()\n      onClose()\n    })\n  }, [editor, onClose])\n\n  const deleteTableAtSelection = useCallback(() => {\n    editor.update(() => {\n      const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode)\n      tableNode.remove()\n\n      clearTableSelection()\n      onClose()\n    })\n  }, [editor, tableCellNode, clearTableSelection, onClose])\n\n  const deleteTableColumnAtSelection = useCallback(() => {\n    editor.update(() => {\n      $deleteTableColumn__EXPERIMENTAL()\n      onClose()\n    })\n  }, [editor, onClose])\n\n  const toggleTableRowIsHeader = useCallback(() => {\n    editor.update(() => {\n      const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode)\n\n      const tableRowIndex = $getTableRowIndexFromTableCellNode(tableCellNode)\n\n      const tableRows = tableNode.getChildren()\n\n      if (tableRowIndex >= tableRows.length || tableRowIndex < 0) {\n        throw new Error('Expected table cell to be inside of table row.')\n      }\n\n      const tableRow = tableRows[tableRowIndex]\n\n      if (!$isTableRowNode(tableRow)) {\n        throw new Error('Expected table row')\n      }\n\n      tableRow.getChildren().forEach((tableCell) => {\n        if (!$isTableCellNode(tableCell)) {\n          throw new Error('Expected table cell')\n        }\n\n        tableCell.toggleHeaderStyle(TableCellHeaderStates.ROW)\n      })\n\n      clearTableSelection()\n      onClose()\n    })\n  }, [editor, tableCellNode, clearTableSelection, onClose])\n\n  const toggleTableColumnIsHeader = useCallback(() => {\n    editor.update(() => {\n      const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode)\n\n      const tableColumnIndex = $getTableColumnIndexFromTableCellNode(tableCellNode)\n\n      const tableRows = tableNode.getChildren<TableRowNode>()\n      const maxRowsLength = Math.max(...tableRows.map((row) => row.getChildren().length))\n\n      if (tableColumnIndex >= maxRowsLength || tableColumnIndex < 0) {\n        throw new Error('Expected table cell to be inside of table row.')\n      }\n\n      for (let r = 0; r < tableRows.length; r++) {\n        const tableRow = tableRows[r]\n\n        if (!$isTableRowNode(tableRow)) {\n          throw new Error('Expected table row')\n        }\n\n        const tableCells = tableRow.getChildren()\n        if (tableColumnIndex >= tableCells.length) {\n          // if cell is outside of bounds for the current row (for example various merge cell cases) we shouldn't highlight it\n          continue\n        }\n\n        const tableCell = tableCells[tableColumnIndex]\n\n        if (!$isTableCellNode(tableCell)) {\n          throw new Error('Expected table cell')\n        }\n\n        tableCell.toggleHeaderStyle(TableCellHeaderStates.COLUMN)\n      }\n\n      clearTableSelection()\n      onClose()\n    })\n  }, [editor, tableCellNode, clearTableSelection, onClose])\n\n  let mergeCellButton: JSX.Element | null = null\n  if (cellMerge) {\n    if (canMergeCells) {\n      mergeCellButton = (\n        <button\n          className=\"item\"\n          data-test-id=\"table-merge-cells\"\n          onClick={() => mergeTableCellsAtSelection()}\n          type=\"button\"\n        >\n          Merge cells\n        </button>\n      )\n    } else if (canUnmergeCell) {\n      mergeCellButton = (\n        <button\n          className=\"item\"\n          data-test-id=\"table-unmerge-cells\"\n          onClick={() => unmergeTableCellsAtSelection()}\n          type=\"button\"\n        >\n          Unmerge cells\n        </button>\n      )\n    }\n  }\n\n  return createPortal(\n    // eslint-disable-next-line jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events\n    <div\n      className=\"table-action-menu-dropdown\"\n      onClick={(e) => {\n        e.stopPropagation()\n      }}\n      ref={dropDownRef}\n    >\n      {mergeCellButton ? (\n        <React.Fragment>\n          {mergeCellButton}\n          <hr />\n        </React.Fragment>\n      ) : null}\n\n      <button\n        className=\"item\"\n        data-test-id=\"table-insert-row-above\"\n        onClick={() => insertTableRowAtSelection(false)}\n        type=\"button\"\n      >\n        <span className=\"text\">\n          Insert {selectionCounts.rows === 1 ? 'row' : `${selectionCounts.rows} rows`} above\n        </span>\n      </button>\n      <button\n        className=\"item\"\n        data-test-id=\"table-insert-row-below\"\n        onClick={() => insertTableRowAtSelection(true)}\n        type=\"button\"\n      >\n        <span className=\"text\">\n          Insert {selectionCounts.rows === 1 ? 'row' : `${selectionCounts.rows} rows`} below\n        </span>\n      </button>\n      <hr />\n      <button\n        className=\"item\"\n        data-test-id=\"table-insert-column-before\"\n        onClick={() => insertTableColumnAtSelection(false)}\n        type=\"button\"\n      >\n        <span className=\"text\">\n          Insert {selectionCounts.columns === 1 ? 'column' : `${selectionCounts.columns} columns`}{' '}\n          left\n        </span>\n      </button>\n      <button\n        className=\"item\"\n        data-test-id=\"table-insert-column-after\"\n        onClick={() => insertTableColumnAtSelection(true)}\n        type=\"button\"\n      >\n        <span className=\"text\">\n          Insert {selectionCounts.columns === 1 ? 'column' : `${selectionCounts.columns} columns`}{' '}\n          right\n        </span>\n      </button>\n      <hr />\n      <button\n        className=\"item\"\n        data-test-id=\"table-delete-columns\"\n        onClick={() => deleteTableColumnAtSelection()}\n        type=\"button\"\n      >\n        <span className=\"text\">Delete column</span>\n      </button>\n      <button\n        className=\"item\"\n        data-test-id=\"table-delete-rows\"\n        onClick={() => deleteTableRowAtSelection()}\n        type=\"button\"\n      >\n        <span className=\"text\">Delete row</span>\n      </button>\n      <button\n        className=\"item\"\n        data-test-id=\"table-delete\"\n        onClick={() => deleteTableAtSelection()}\n        type=\"button\"\n      >\n        <span className=\"text\">Delete table</span>\n      </button>\n      <hr />\n      <button className=\"item\" onClick={() => toggleTableRowIsHeader()} type=\"button\">\n        <span className=\"text\">\n          {(tableCellNode.__headerState & TableCellHeaderStates.ROW) === TableCellHeaderStates.ROW\n            ? 'Remove'\n            : 'Add'}{' '}\n          row header\n        </span>\n      </button>\n      <button\n        className=\"item\"\n        data-test-id=\"table-column-header\"\n        onClick={() => toggleTableColumnIsHeader()}\n        type=\"button\"\n      >\n        <span className=\"text\">\n          {(tableCellNode.__headerState & TableCellHeaderStates.COLUMN) ===\n          TableCellHeaderStates.COLUMN\n            ? 'Remove'\n            : 'Add'}{' '}\n          column header\n        </span>\n      </button>\n    </div>,\n    document.body,\n  )\n}\n\nfunction TableCellActionMenuContainer({\n  anchorElem,\n  cellMerge,\n}: {\n  anchorElem: HTMLElement\n  cellMerge: boolean\n}): JSX.Element {\n  const [editor] = useLexicalComposerContext()\n\n  const menuButtonRef = useRef(null)\n  const menuRootRef = useRef(null)\n  const [isMenuOpen, setIsMenuOpen] = useState(false)\n\n  const [tableCellNode, setTableMenuCellNode] = useState<null | TableCellNode>(null)\n\n  const $moveMenu = useCallback(() => {\n    const menu = menuButtonRef.current\n    const selection = $getSelection()\n    const nativeSelection = window.getSelection()\n    const activeElement = document.activeElement\n\n    if (selection == null || menu == null) {\n      setTableMenuCellNode(null)\n      return\n    }\n\n    const rootElement = editor.getRootElement()\n\n    if (\n      $isRangeSelection(selection) &&\n      rootElement !== null &&\n      nativeSelection !== null &&\n      rootElement.contains(nativeSelection.anchorNode)\n    ) {\n      const tableCellNodeFromSelection = $getTableCellNodeFromLexicalNode(\n        selection.anchor.getNode(),\n      )\n\n      if (tableCellNodeFromSelection == null) {\n        setTableMenuCellNode(null)\n        return\n      }\n\n      const tableCellParentNodeDOM = editor.getElementByKey(tableCellNodeFromSelection.getKey())\n\n      if (tableCellParentNodeDOM == null) {\n        setTableMenuCellNode(null)\n        return\n      }\n\n      setTableMenuCellNode(tableCellNodeFromSelection)\n    } else if (!activeElement) {\n      setTableMenuCellNode(null)\n    }\n  }, [editor])\n\n  useEffect(() => {\n    return editor.registerUpdateListener(() => {\n      editor.getEditorState().read(() => {\n        $moveMenu()\n      })\n    })\n  })\n\n  useEffect(() => {\n    const menuButtonDOM = menuButtonRef.current as HTMLButtonElement | null\n\n    if (menuButtonDOM != null && tableCellNode != null) {\n      const tableCellNodeDOM = editor.getElementByKey(tableCellNode.getKey())\n\n      if (tableCellNodeDOM != null) {\n        const tableCellRect = tableCellNodeDOM.getBoundingClientRect()\n        const menuRect = menuButtonDOM.getBoundingClientRect()\n        const anchorRect = anchorElem.getBoundingClientRect()\n\n        const top = tableCellRect.top - anchorRect.top + 4\n        const left = tableCellRect.right - menuRect.width - 10 - anchorRect.left\n\n        menuButtonDOM.style.opacity = '1'\n        menuButtonDOM.style.transform = `translate(${left}px, ${top}px)`\n      } else {\n        menuButtonDOM.style.opacity = '0'\n        menuButtonDOM.style.transform = 'translate(-10000px, -10000px)'\n      }\n    }\n  }, [menuButtonRef, tableCellNode, editor, anchorElem])\n\n  const prevTableCellDOM = useRef(tableCellNode)\n\n  useEffect(() => {\n    if (prevTableCellDOM.current !== tableCellNode) {\n      setIsMenuOpen(false)\n    }\n\n    prevTableCellDOM.current = tableCellNode\n  }, [prevTableCellDOM, tableCellNode])\n\n  return (\n    <div className=\"table-cell-action-button-container\" ref={menuButtonRef}>\n      {tableCellNode != null && (\n        <React.Fragment>\n          <button\n            className=\"table-cell-action-button\"\n            onClick={(e) => {\n              e.stopPropagation()\n              setIsMenuOpen(!isMenuOpen)\n            }}\n            ref={menuRootRef}\n            type=\"button\"\n          >\n            <MeatballsIcon />\n          </button>\n          {isMenuOpen && (\n            <TableActionMenu\n              cellMerge={cellMerge}\n              contextRef={menuRootRef}\n              onClose={() => setIsMenuOpen(false)}\n              setIsMenuOpen={setIsMenuOpen}\n              tableCellNode={tableCellNode}\n            />\n          )}\n        </React.Fragment>\n      )}\n    </div>\n  )\n}\n\nexport const TableActionMenuPlugin: PluginComponentWithAnchor = ({ anchorElem }) => {\n  const isEditable = useLexicalEditable()\n  return createPortal(\n    isEditable ? (\n      <TableCellActionMenuContainer anchorElem={anchorElem ?? document.body} cellMerge />\n    ) : null,\n    anchorElem ?? document.body,\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useLexicalComposerContext","useLexicalEditable","$deleteTableColumn__EXPERIMENTAL","$deleteTableRow__EXPERIMENTAL","$getNodeTriplet","$getTableCellNodeFromLexicalNode","$getTableColumnIndexFromTableCellNode","$getTableNodeFromLexicalNodeOrThrow","$getTableRowIndexFromTableCellNode","$insertTableColumn__EXPERIMENTAL","$insertTableRow__EXPERIMENTAL","$isTableCellNode","$isTableRowNode","$isTableSelection","$unmergeCell","getTableObserverFromTableElement","TableCellHeaderStates","TableCellNode","useScrollInfo","$createParagraphNode","$getRoot","$getSelection","$isElementNode","$isParagraphNode","$isRangeSelection","$isTextNode","React","useCallback","useEffect","useRef","useState","createPortal","MeatballsIcon","computeSelectionCount","selection","selectionShape","getShape","columns","toX","fromX","rows","toY","fromY","$canUnmerge","isCollapsed","anchor","is","focus","cell","__colSpan","__rowSpan","$cellContainsEmptyParagraph","getChildrenSize","firstChild","getFirstChildOrThrow","isEmpty","$selectLastDescendant","node","lastDescendant","getLastDescendant","select","selectEnd","selectNext","TableActionMenu","cellMerge","contextRef","onClose","setIsMenuOpen","tableCellNode","_tableCellNode","editor","dropDownRef","updateTableCellNode","selectionCounts","updateSelectionCounts","canMergeCells","setCanMergeCells","canUnmergeCell","setCanUnmergeCell","y","registerMutationListener","nodeMutations","nodeUpdated","get","getKey","getEditorState","read","getLatest","skipInitialization","currentSelectionCounts","menuButtonElement","current","dropDownElement","rootElement","getRootElement","rootEleRect","getBoundingClientRect","menuButtonRect","style","opacity","dropDownElementRect","margin","leftPosition","right","width","window","innerWidth","position","left","pageXOffset","topPosition","top","height","innerHeight","bottom","pageYOffset","handleClickOutside","event","contains","target","addEventListener","removeEventListener","clearTableSelection","update","isAttached","tableNode","tableElement","getElementByKey","Error","tableObserver","clearHighlight","markDirty","rootNode","selectStart","mergeTableCellsAtSelection","nodes","getNodes","firstCell","i","length","setColSpan","setRowSpan","getFirstChild","remove","append","getChildren","unmergeTableCellsAtSelection","insertTableRowAtSelection","shouldInsertAfter","insertTableColumnAtSelection","deleteTableRowAtSelection","deleteTableAtSelection","deleteTableColumnAtSelection","toggleTableRowIsHeader","tableRowIndex","tableRows","tableRow","newStyle","getHeaderStyles","ROW","forEach","tableCell","setHeaderStyles","toggleTableColumnIsHeader","tableColumnIndex","maxRowsLength","Math","max","map","row","COLUMN","r","tableCells","toggleRowStriping","setRowStriping","getRowStriping","mergeCellButton","_jsx","className","onClick","type","_jsxs","e","stopPropagation","ref","Fragment","__headerState","document","body","TableCellActionMenuContainer","anchorElem","menuButtonRef","menuRootRef","isMenuOpen","setTableMenuCellNode","$moveMenu","menu","nativeSelection","getSelection","activeElement","anchorNode","tableCellNodeFromSelection","getNode","tableCellParentNodeDOM","registerUpdateListener","menuButtonDOM","tableCellNodeDOM","tableCellRect","menuRect","anchorRect","transform","prevTableCellDOM","TableActionMenuPlugin","isEditable"],"sources":["../../../../../../src/features/experimental_table/client/plugins/TableActionMenuPlugin/index.tsx"],"sourcesContent":["'use client'\n\nimport type {\n  HTMLTableElementWithWithTableSelectionState,\n  TableRowNode,\n  TableSelection,\n} from '@lexical/table'\nimport type { ElementNode } from 'lexical'\nimport type { JSX } from 'react'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport {\n  $deleteTableColumn__EXPERIMENTAL,\n  $deleteTableRow__EXPERIMENTAL,\n  $getNodeTriplet,\n  $getTableCellNodeFromLexicalNode,\n  $getTableColumnIndexFromTableCellNode,\n  $getTableNodeFromLexicalNodeOrThrow,\n  $getTableRowIndexFromTableCellNode,\n  $insertTableColumn__EXPERIMENTAL,\n  $insertTableRow__EXPERIMENTAL,\n  $isTableCellNode,\n  $isTableRowNode,\n  $isTableSelection,\n  $unmergeCell,\n  getTableObserverFromTableElement,\n  TableCellHeaderStates,\n  TableCellNode,\n} from '@lexical/table'\nimport { useScrollInfo } from '@payloadcms/ui'\nimport {\n  $createParagraphNode,\n  $getRoot,\n  $getSelection,\n  $isElementNode,\n  $isParagraphNode,\n  $isRangeSelection,\n  $isTextNode,\n} from 'lexical'\nimport * as React from 'react'\nimport { useCallback, useEffect, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\n\nimport type { PluginComponentWithAnchor } from '../../../../typesClient.js'\n\nimport { MeatballsIcon } from '../../../../../lexical/ui/icons/Meatballs/index.js'\nimport './index.scss'\n\nfunction computeSelectionCount(selection: TableSelection): {\n  columns: number\n  rows: number\n} {\n  const selectionShape = selection.getShape()\n  return {\n    columns: selectionShape.toX - selectionShape.fromX + 1,\n    rows: selectionShape.toY - selectionShape.fromY + 1,\n  }\n}\n\nfunction $canUnmerge(): boolean {\n  const selection = $getSelection()\n  if (\n    ($isRangeSelection(selection) && !selection.isCollapsed()) ||\n    ($isTableSelection(selection) && !selection.anchor.is(selection.focus)) ||\n    (!$isRangeSelection(selection) && !$isTableSelection(selection))\n  ) {\n    return false\n  }\n  const [cell] = $getNodeTriplet(selection.anchor)\n  return cell.__colSpan > 1 || cell.__rowSpan > 1\n}\n\nfunction $cellContainsEmptyParagraph(cell: TableCellNode): boolean {\n  if (cell.getChildrenSize() !== 1) {\n    return false\n  }\n  const firstChild = cell.getFirstChildOrThrow()\n  if (!$isParagraphNode(firstChild) || !firstChild.isEmpty()) {\n    return false\n  }\n  return true\n}\n\nfunction $selectLastDescendant(node: ElementNode): void {\n  const lastDescendant = node.getLastDescendant()\n  if ($isTextNode(lastDescendant)) {\n    lastDescendant.select()\n  } else if ($isElementNode(lastDescendant)) {\n    lastDescendant.selectEnd()\n  } else if (lastDescendant !== null) {\n    lastDescendant.selectNext()\n  }\n}\n\ntype TableCellActionMenuProps = Readonly<{\n  cellMerge: boolean\n  contextRef: { current: HTMLElement | null }\n  onClose: () => void\n  setIsMenuOpen: (isOpen: boolean) => void\n  tableCellNode: TableCellNode\n}>\n\nfunction TableActionMenu({\n  cellMerge,\n  contextRef,\n  onClose,\n  setIsMenuOpen,\n  tableCellNode: _tableCellNode,\n}: TableCellActionMenuProps) {\n  const [editor] = useLexicalComposerContext()\n  const dropDownRef = useRef<HTMLDivElement | null>(null)\n  const [tableCellNode, updateTableCellNode] = useState(_tableCellNode)\n  const [selectionCounts, updateSelectionCounts] = useState({\n    columns: 1,\n    rows: 1,\n  })\n  const [canMergeCells, setCanMergeCells] = useState(false)\n  const [canUnmergeCell, setCanUnmergeCell] = useState(false)\n  const { y } = useScrollInfo()\n\n  useEffect(() => {\n    return editor.registerMutationListener(\n      TableCellNode,\n      (nodeMutations) => {\n        const nodeUpdated = nodeMutations.get(tableCellNode.getKey()) === 'updated'\n\n        if (nodeUpdated) {\n          editor.getEditorState().read(() => {\n            updateTableCellNode(tableCellNode.getLatest())\n          })\n        }\n      },\n      { skipInitialization: true },\n    )\n  }, [editor, tableCellNode])\n\n  useEffect(() => {\n    editor.getEditorState().read(() => {\n      const selection = $getSelection()\n      // Merge cells\n      if ($isTableSelection(selection)) {\n        const currentSelectionCounts = computeSelectionCount(selection)\n        updateSelectionCounts(computeSelectionCount(selection))\n\n        setCanMergeCells(currentSelectionCounts.columns > 1 || currentSelectionCounts.rows > 1)\n      }\n      // Unmerge cell\n      setCanUnmergeCell($canUnmerge())\n    })\n  }, [editor])\n\n  useEffect(() => {\n    const menuButtonElement = contextRef.current\n    const dropDownElement = dropDownRef.current\n    const rootElement = editor.getRootElement()\n\n    if (menuButtonElement != null && dropDownElement != null && rootElement != null) {\n      const rootEleRect = rootElement.getBoundingClientRect()\n      const menuButtonRect = menuButtonElement.getBoundingClientRect()\n      dropDownElement.style.opacity = '1'\n      const dropDownElementRect = dropDownElement.getBoundingClientRect()\n      const margin = 5\n      let leftPosition = menuButtonRect.right + margin\n      if (\n        leftPosition + dropDownElementRect.width > window.innerWidth ||\n        leftPosition + dropDownElementRect.width > rootEleRect.right\n      ) {\n        const position = menuButtonRect.left - dropDownElementRect.width - margin\n        leftPosition = (position < 0 ? margin : position) + window.pageXOffset\n      }\n      dropDownElement.style.left = `${leftPosition + window.pageXOffset}px`\n\n      let topPosition = menuButtonRect.top\n      if (topPosition + dropDownElementRect.height > window.innerHeight) {\n        const position = menuButtonRect.bottom - dropDownElementRect.height\n        topPosition = (position < 0 ? margin : position) + window.pageYOffset\n      }\n      dropDownElement.style.top = `${topPosition}px`\n    }\n  }, [contextRef, dropDownRef, editor, y])\n\n  useEffect(() => {\n    function handleClickOutside(event: MouseEvent) {\n      if (\n        dropDownRef.current != null &&\n        contextRef.current != null &&\n        !dropDownRef.current.contains(event.target as Node) &&\n        !contextRef.current.contains(event.target as Node)\n      ) {\n        setIsMenuOpen(false)\n      }\n    }\n\n    window.addEventListener('click', handleClickOutside)\n\n    return () => window.removeEventListener('click', handleClickOutside)\n  }, [setIsMenuOpen, contextRef])\n\n  const clearTableSelection = useCallback(() => {\n    editor.update(() => {\n      if (tableCellNode.isAttached()) {\n        const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode)\n        const tableElement = editor.getElementByKey(\n          tableNode.getKey(),\n        ) as HTMLTableElementWithWithTableSelectionState\n\n        if (!tableElement) {\n          throw new Error('Expected to find tableElement in DOM')\n        }\n\n        const tableObserver = getTableObserverFromTableElement(tableElement)\n        if (tableObserver !== null) {\n          tableObserver.clearHighlight()\n        }\n\n        tableNode.markDirty()\n        updateTableCellNode(tableCellNode.getLatest())\n      }\n\n      const rootNode = $getRoot()\n      rootNode.selectStart()\n    })\n  }, [editor, tableCellNode])\n\n  const mergeTableCellsAtSelection = () => {\n    editor.update(() => {\n      const selection = $getSelection()\n      if ($isTableSelection(selection)) {\n        const { columns, rows } = computeSelectionCount(selection)\n        const nodes = selection.getNodes()\n        let firstCell: null | TableCellNode = null\n        for (let i = 0; i < nodes.length; i++) {\n          const node = nodes[i]\n          if ($isTableCellNode(node)) {\n            if (firstCell === null) {\n              node.setColSpan(columns).setRowSpan(rows)\n              firstCell = node\n              const isEmpty = $cellContainsEmptyParagraph(node)\n              let firstChild\n              if (isEmpty && $isParagraphNode((firstChild = node.getFirstChild()))) {\n                firstChild.remove()\n              }\n            } else if ($isTableCellNode(firstCell)) {\n              const isEmpty = $cellContainsEmptyParagraph(node)\n              if (!isEmpty) {\n                firstCell.append(...node.getChildren())\n              }\n              node.remove()\n            }\n          }\n        }\n        if (firstCell !== null) {\n          if (firstCell.getChildrenSize() === 0) {\n            firstCell.append($createParagraphNode())\n          }\n          $selectLastDescendant(firstCell)\n        }\n        onClose()\n      }\n    })\n  }\n\n  const unmergeTableCellsAtSelection = () => {\n    editor.update(() => {\n      $unmergeCell()\n    })\n  }\n\n  const insertTableRowAtSelection = useCallback(\n    (shouldInsertAfter: boolean) => {\n      editor.update(() => {\n        $insertTableRow__EXPERIMENTAL(shouldInsertAfter)\n        onClose()\n      })\n    },\n    [editor, onClose],\n  )\n\n  const insertTableColumnAtSelection = useCallback(\n    (shouldInsertAfter: boolean) => {\n      editor.update(() => {\n        for (let i = 0; i < selectionCounts.columns; i++) {\n          $insertTableColumn__EXPERIMENTAL(shouldInsertAfter)\n        }\n        onClose()\n      })\n    },\n    [editor, onClose, selectionCounts.columns],\n  )\n\n  const deleteTableRowAtSelection = useCallback(() => {\n    editor.update(() => {\n      $deleteTableRow__EXPERIMENTAL()\n      onClose()\n    })\n  }, [editor, onClose])\n\n  const deleteTableAtSelection = useCallback(() => {\n    editor.update(() => {\n      const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode)\n      tableNode.remove()\n\n      clearTableSelection()\n      onClose()\n    })\n  }, [editor, tableCellNode, clearTableSelection, onClose])\n\n  const deleteTableColumnAtSelection = useCallback(() => {\n    editor.update(() => {\n      $deleteTableColumn__EXPERIMENTAL()\n      onClose()\n    })\n  }, [editor, onClose])\n\n  const toggleTableRowIsHeader = useCallback(() => {\n    editor.update(() => {\n      const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode)\n\n      const tableRowIndex = $getTableRowIndexFromTableCellNode(tableCellNode)\n\n      const tableRows = tableNode.getChildren()\n\n      if (tableRowIndex >= tableRows.length || tableRowIndex < 0) {\n        throw new Error('Expected table cell to be inside of table row.')\n      }\n\n      const tableRow = tableRows[tableRowIndex]\n\n      if (!$isTableRowNode(tableRow)) {\n        throw new Error('Expected table row')\n      }\n\n      const newStyle = tableCellNode.getHeaderStyles() ^ TableCellHeaderStates.ROW\n      tableRow.getChildren().forEach((tableCell) => {\n        if (!$isTableCellNode(tableCell)) {\n          throw new Error('Expected table cell')\n        }\n\n        tableCell.setHeaderStyles(newStyle, TableCellHeaderStates.ROW)\n      })\n\n      clearTableSelection()\n      onClose()\n    })\n  }, [editor, tableCellNode, clearTableSelection, onClose])\n\n  const toggleTableColumnIsHeader = useCallback(() => {\n    editor.update(() => {\n      const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode)\n\n      const tableColumnIndex = $getTableColumnIndexFromTableCellNode(tableCellNode)\n\n      const tableRows = tableNode.getChildren<TableRowNode>()\n      const maxRowsLength = Math.max(...tableRows.map((row) => row.getChildren().length))\n\n      if (tableColumnIndex >= maxRowsLength || tableColumnIndex < 0) {\n        throw new Error('Expected table cell to be inside of table row.')\n      }\n\n      const newStyle = tableCellNode.getHeaderStyles() ^ TableCellHeaderStates.COLUMN\n      for (let r = 0; r < tableRows.length; r++) {\n        const tableRow = tableRows[r]\n\n        if (!$isTableRowNode(tableRow)) {\n          throw new Error('Expected table row')\n        }\n\n        const tableCells = tableRow.getChildren()\n        if (tableColumnIndex >= tableCells.length) {\n          // if cell is outside of bounds for the current row (for example various merge cell cases) we shouldn't highlight it\n          continue\n        }\n\n        const tableCell = tableCells[tableColumnIndex]\n\n        if (!$isTableCellNode(tableCell)) {\n          throw new Error('Expected table cell')\n        }\n\n        tableCell.setHeaderStyles(newStyle, TableCellHeaderStates.COLUMN)\n      }\n      clearTableSelection()\n      onClose()\n    })\n  }, [editor, tableCellNode, clearTableSelection, onClose])\n\n  const toggleRowStriping = useCallback(() => {\n    editor.update(() => {\n      if (tableCellNode.isAttached()) {\n        const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode)\n        if (tableNode) {\n          tableNode.setRowStriping(!tableNode.getRowStriping())\n        }\n      }\n\n      clearTableSelection()\n      onClose()\n    })\n  }, [editor, tableCellNode, clearTableSelection, onClose])\n\n  let mergeCellButton: JSX.Element | null = null\n  if (cellMerge) {\n    if (canMergeCells) {\n      mergeCellButton = (\n        <button\n          className=\"item\"\n          data-test-id=\"table-merge-cells\"\n          onClick={() => mergeTableCellsAtSelection()}\n          type=\"button\"\n        >\n          Merge cells\n        </button>\n      )\n    } else if (canUnmergeCell) {\n      mergeCellButton = (\n        <button\n          className=\"item\"\n          data-test-id=\"table-unmerge-cells\"\n          onClick={() => unmergeTableCellsAtSelection()}\n          type=\"button\"\n        >\n          Unmerge cells\n        </button>\n      )\n    }\n  }\n\n  return createPortal(\n    // eslint-disable-next-line jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events\n    <div\n      className=\"table-action-menu-dropdown\"\n      onClick={(e) => {\n        e.stopPropagation()\n      }}\n      ref={dropDownRef}\n    >\n      {mergeCellButton ? (\n        <React.Fragment>\n          {mergeCellButton}\n          <hr />\n        </React.Fragment>\n      ) : null}\n\n      <button\n        className=\"item\"\n        data-test-id=\"table-row-striping\"\n        onClick={() => toggleRowStriping()}\n        type=\"button\"\n      >\n        <span className=\"text\">Toggle Row Striping</span>\n      </button>\n      <button\n        className=\"item\"\n        data-test-id=\"table-insert-row-above\"\n        onClick={() => insertTableRowAtSelection(false)}\n        type=\"button\"\n      >\n        <span className=\"text\">\n          Insert {selectionCounts.rows === 1 ? 'row' : `${selectionCounts.rows} rows`} above\n        </span>\n      </button>\n      <button\n        className=\"item\"\n        data-test-id=\"table-insert-row-below\"\n        onClick={() => insertTableRowAtSelection(true)}\n        type=\"button\"\n      >\n        <span className=\"text\">\n          Insert {selectionCounts.rows === 1 ? 'row' : `${selectionCounts.rows} rows`} below\n        </span>\n      </button>\n      <hr />\n      <button\n        className=\"item\"\n        data-test-id=\"table-insert-column-before\"\n        onClick={() => insertTableColumnAtSelection(false)}\n        type=\"button\"\n      >\n        <span className=\"text\">\n          Insert {selectionCounts.columns === 1 ? 'column' : `${selectionCounts.columns} columns`}{' '}\n          left\n        </span>\n      </button>\n      <button\n        className=\"item\"\n        data-test-id=\"table-insert-column-after\"\n        onClick={() => insertTableColumnAtSelection(true)}\n        type=\"button\"\n      >\n        <span className=\"text\">\n          Insert {selectionCounts.columns === 1 ? 'column' : `${selectionCounts.columns} columns`}{' '}\n          right\n        </span>\n      </button>\n      <hr />\n      <button\n        className=\"item\"\n        data-test-id=\"table-delete-columns\"\n        onClick={() => deleteTableColumnAtSelection()}\n        type=\"button\"\n      >\n        <span className=\"text\">Delete column</span>\n      </button>\n      <button\n        className=\"item\"\n        data-test-id=\"table-delete-rows\"\n        onClick={() => deleteTableRowAtSelection()}\n        type=\"button\"\n      >\n        <span className=\"text\">Delete row</span>\n      </button>\n      <button\n        className=\"item\"\n        data-test-id=\"table-delete\"\n        onClick={() => deleteTableAtSelection()}\n        type=\"button\"\n      >\n        <span className=\"text\">Delete table</span>\n      </button>\n      <hr />\n      <button className=\"item\" onClick={() => toggleTableRowIsHeader()} type=\"button\">\n        <span className=\"text\">\n          {(tableCellNode.__headerState & TableCellHeaderStates.ROW) === TableCellHeaderStates.ROW\n            ? 'Remove'\n            : 'Add'}{' '}\n          row header\n        </span>\n      </button>\n      <button\n        className=\"item\"\n        data-test-id=\"table-column-header\"\n        onClick={() => toggleTableColumnIsHeader()}\n        type=\"button\"\n      >\n        <span className=\"text\">\n          {(tableCellNode.__headerState & TableCellHeaderStates.COLUMN) ===\n          TableCellHeaderStates.COLUMN\n            ? 'Remove'\n            : 'Add'}{' '}\n          column header\n        </span>\n      </button>\n    </div>,\n    document.body,\n  )\n}\n\nfunction TableCellActionMenuContainer({\n  anchorElem,\n  cellMerge,\n}: {\n  anchorElem: HTMLElement\n  cellMerge: boolean\n}): JSX.Element {\n  const [editor] = useLexicalComposerContext()\n\n  const menuButtonRef = useRef(null)\n  const menuRootRef = useRef(null)\n  const [isMenuOpen, setIsMenuOpen] = useState(false)\n\n  const [tableCellNode, setTableMenuCellNode] = useState<null | TableCellNode>(null)\n\n  const $moveMenu = useCallback(() => {\n    const menu = menuButtonRef.current\n    const selection = $getSelection()\n    const nativeSelection = window.getSelection()\n    const activeElement = document.activeElement\n\n    if (selection == null || menu == null) {\n      setTableMenuCellNode(null)\n      return\n    }\n\n    const rootElement = editor.getRootElement()\n\n    if (\n      $isRangeSelection(selection) &&\n      rootElement !== null &&\n      nativeSelection !== null &&\n      rootElement.contains(nativeSelection.anchorNode)\n    ) {\n      const tableCellNodeFromSelection = $getTableCellNodeFromLexicalNode(\n        selection.anchor.getNode(),\n      )\n\n      if (tableCellNodeFromSelection == null) {\n        setTableMenuCellNode(null)\n        return\n      }\n\n      const tableCellParentNodeDOM = editor.getElementByKey(tableCellNodeFromSelection.getKey())\n\n      if (tableCellParentNodeDOM == null) {\n        setTableMenuCellNode(null)\n        return\n      }\n\n      setTableMenuCellNode(tableCellNodeFromSelection)\n    } else if (!activeElement) {\n      setTableMenuCellNode(null)\n    }\n  }, [editor])\n\n  useEffect(() => {\n    return editor.registerUpdateListener(() => {\n      editor.getEditorState().read(() => {\n        $moveMenu()\n      })\n    })\n  })\n\n  useEffect(() => {\n    const menuButtonDOM = menuButtonRef.current as HTMLButtonElement | null\n\n    if (menuButtonDOM != null && tableCellNode != null) {\n      const tableCellNodeDOM = editor.getElementByKey(tableCellNode.getKey())\n\n      if (tableCellNodeDOM != null) {\n        const tableCellRect = tableCellNodeDOM.getBoundingClientRect()\n        const menuRect = menuButtonDOM.getBoundingClientRect()\n        const anchorRect = anchorElem.getBoundingClientRect()\n\n        const top = tableCellRect.top - anchorRect.top + 4\n        const left = tableCellRect.right - menuRect.width - 10 - anchorRect.left\n\n        menuButtonDOM.style.opacity = '1'\n        menuButtonDOM.style.transform = `translate(${left}px, ${top}px)`\n      } else {\n        menuButtonDOM.style.opacity = '0'\n        menuButtonDOM.style.transform = 'translate(-10000px, -10000px)'\n      }\n    }\n  }, [menuButtonRef, tableCellNode, editor, anchorElem])\n\n  const prevTableCellDOM = useRef(tableCellNode)\n\n  useEffect(() => {\n    if (prevTableCellDOM.current !== tableCellNode) {\n      setIsMenuOpen(false)\n    }\n\n    prevTableCellDOM.current = tableCellNode\n  }, [prevTableCellDOM, tableCellNode])\n\n  return (\n    <div className=\"table-cell-action-button-container\" ref={menuButtonRef}>\n      {tableCellNode != null && (\n        <React.Fragment>\n          <button\n            className=\"table-cell-action-button\"\n            onClick={(e) => {\n              e.stopPropagation()\n              setIsMenuOpen(!isMenuOpen)\n            }}\n            ref={menuRootRef}\n            type=\"button\"\n          >\n            <MeatballsIcon />\n          </button>\n          {isMenuOpen && (\n            <TableActionMenu\n              cellMerge={cellMerge}\n              contextRef={menuRootRef}\n              onClose={() => setIsMenuOpen(false)}\n              setIsMenuOpen={setIsMenuOpen}\n              tableCellNode={tableCellNode}\n            />\n          )}\n        </React.Fragment>\n      )}\n    </div>\n  )\n}\n\nexport const TableActionMenuPlugin: PluginComponentWithAnchor = ({ anchorElem }) => {\n  const isEditable = useLexicalEditable()\n  return createPortal(\n    isEditable ? (\n      <TableCellActionMenuContainer anchorElem={anchorElem ?? document.body} cellMerge />\n    ) : null,\n    anchorElem ?? document.body,\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/experimental_table/client/plugins/TableCellResizerPlugin/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/experimental_table/client/plugins/TableCellResizerPlugin/index.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AA0XjE,eAAO,MAAM,sBAAsB,EAAE,eAQpC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/experimental_table/client/plugins/TableCellResizerPlugin/index.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAgXjE,eAAO,MAAM,sBAAsB,EAAE,eAQpC,CAAA"}

package/dist/features/experimental_table/client/plugins/TableCellResizerPlugin/index.js

@@ -3,7 +3,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
 import { useLexicalEditable } from '@lexical/react/useLexicalEditable';
-import { $computeTableMapSkipCellCheck, $getTableNodeFromLexicalNodeOrThrow, $getTableRowIndexFromTableCellNode, $isTableCellNode, $isTableRowNode, getDOMCellFromTarget } from '@lexical/table';
+import { $computeTableMapSkipCellCheck, $getTableNodeFromLexicalNodeOrThrow, $getTableRowIndexFromTableCellNode, $isTableCellNode, $isTableRowNode, getDOMCellFromTarget, TableNode } from '@lexical/table';
 import { calculateZoomLevel } from '@lexical/utils';
 import { $getNearestNodeFromDOMNode } from 'lexical';
 import * as React from 'react';
@@ -11,7 +11,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
 import { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js';
 const MIN_ROW_HEIGHT = 33;
-const MIN_COLUMN_WIDTH = 50;
+const MIN_COLUMN_WIDTH = 92;
 function TableCellResizer({
   editor
 }) {
@@ -34,6 +34,17 @@ function TableCellResizer({
   const isMouseDownOnEvent = event => {
     return (event.buttons & 1) === 1;
   };
+  useEffect(() => {
+    return editor.registerNodeTransform(TableNode, tableNode => {
+      if (tableNode.getColWidths()) {
+        return tableNode;
+      }
+      const numColumns = tableNode.getColumnCount();
+      const columnWidth = MIN_COLUMN_WIDTH;
+      tableNode.setColWidths(Array(numColumns).fill(columnWidth));
+      return tableNode;
+    });
+  }, [editor]);
   useEffect(() => {
     const onMouseMove = event_0 => {
       setTimeout(() => {
@@ -58,8 +69,8 @@ function TableCellResizer({
               if (!tableCellNode) {
                 throw new Error('TableCellResizer: Table cell node not found.');
               }
-              const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
-              const tableElement = editor.getElementByKey(tableNode.getKey());
+              const tableNode_0 = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
+              const tableElement = editor.getElementByKey(tableNode_0.getKey());
               if (!tableElement) {
                 throw new Error('TableCellResizer: Table element not found.');
               }
@@ -84,12 +95,12 @@ function TableCellResizer({
       }, 0);
     };
     const removeRootListener = editor.registerRootListener((rootElement, prevRootElement) => {
-      rootElement?.addEventListener('mousemove', onMouseMove);
-      rootElement?.addEventListener('mousedown', onMouseDown);
-      rootElement?.addEventListener('mouseup', onMouseUp);
       prevRootElement?.removeEventListener('mousemove', onMouseMove);
       prevRootElement?.removeEventListener('mousedown', onMouseDown);
       prevRootElement?.removeEventListener('mouseup', onMouseUp);
+      rootElement?.addEventListener('mousemove', onMouseMove);
+      rootElement?.addEventListener('mousedown', onMouseDown);
+      rootElement?.addEventListener('mouseup', onMouseUp);
     });
     return () => {
       removeRootListener();
@@ -110,9 +121,9 @@ function TableCellResizer({
       if (!$isTableCellNode(tableCellNode_0)) {
         throw new Error('TableCellResizer: Table cell node not found.');
       }
-      const tableNode_0 = $getTableNodeFromLexicalNodeOrThrow(tableCellNode_0);
-      const tableRowIndex = $getTableRowIndexFromTableCellNode(tableCellNode_0);
-      const tableRows = tableNode_0.getChildren();
+      const tableNode_1 = $getTableNodeFromLexicalNodeOrThrow(tableCellNode_0);
+      const tableRowIndex = $getTableRowIndexFromTableCellNode(tableCellNode_0) + tableCellNode_0.getRowSpan() - 1;
+      const tableRows = tableNode_1.getChildren();
       if (tableRowIndex >= tableRows.length || tableRowIndex < 0) {
         throw new Error('Expected table cell to be inside of table row.');
       }
@@ -131,21 +142,9 @@ function TableCellResizer({
       tag: 'skip-scroll-into-view'
     });
   }, [activeCell, editor]);
-  const getCellNodeWidth = (cell_1, activeEditor) => {
-    const width = cell_1.getWidth();
-    if (width !== undefined) {
-      return width;
-    }
+  const getCellNodeHeight = (cell_1, activeEditor) => {
     const domCellNode = activeEditor.getElementByKey(cell_1.getKey());
-    if (domCellNode == null) {
-      return undefined;
-    }
-    const computedStyle = getComputedStyle(domCellNode);
-    return domCellNode.clientWidth - parseFloat(computedStyle.paddingLeft) - parseFloat(computedStyle.paddingRight);
-  };
-  const getCellNodeHeight = (cell_2, activeEditor_0) => {
-    const domCellNode_0 = activeEditor_0.getElementByKey(cell_2.getKey());
-    return domCellNode_0?.clientHeight;
+    return domCellNode?.clientHeight;
   };
   const getCellColumnIndex = (tableCellNode_1, tableMap) => {
     for (let row = 0; row < tableMap.length; row++) {
@@ -165,23 +164,24 @@ function TableCellResizer({
       if (!$isTableCellNode(tableCellNode_2)) {
         throw new Error('TableCellResizer: Table cell node not found.');
       }
-      const tableNode_1 = $getTableNodeFromLexicalNodeOrThrow(tableCellNode_2);
-      const [tableMap_0] = $computeTableMapSkipCellCheck(tableNode_1, null, null);
+      const tableNode_2 = $getTableNodeFromLexicalNodeOrThrow(tableCellNode_2);
+      const [tableMap_0] = $computeTableMapSkipCellCheck(tableNode_2, null, null);
       const columnIndex = getCellColumnIndex(tableCellNode_2, tableMap_0);
       if (columnIndex === undefined) {
         throw new Error('TableCellResizer: Table column not found.');
       }
-      for (let row_0 = 0; row_0 < tableMap_0.length; row_0++) {
-        const cell_3 = tableMap_0[row_0][columnIndex];
-        if (cell_3.startRow === row_0 && (columnIndex === tableMap_0[row_0].length - 1 || tableMap_0[row_0][columnIndex].cell !== tableMap_0[row_0][columnIndex + 1].cell)) {
-          const width_0 = getCellNodeWidth(cell_3.cell, editor);
-          if (width_0 === undefined) {
-            continue;
-          }
-          const newWidth = Math.max(width_0 + widthChange, MIN_COLUMN_WIDTH);
-          cell_3.cell.setWidth(newWidth);
-        }
+      const colWidths = tableNode_2.getColWidths();
+      if (!colWidths) {
+        return;
+      }
+      const width = colWidths[columnIndex];
+      if (width === undefined) {
+        return;
       }
+      const newColWidths = [...colWidths];
+      const newWidth = Math.max(width + widthChange, MIN_COLUMN_WIDTH);
+      newColWidths[columnIndex] = newWidth;
+      tableNode_2.setColWidths(newColWidths);
     }, {
       tag: 'skip-scroll-into-view'
     });
@@ -235,7 +235,7 @@ function TableCellResizer({
         height: height_0,
         left,
         top,
-        width: width_1
+        width: width_0
       } = activeCell.elem.getBoundingClientRect();
       const zoom_0 = calculateZoomLevel(activeCell.elem);
       const zoneWidth = 10 // Pixel width of the zone where you can drag the edge
@@ -247,13 +247,13 @@ function TableCellResizer({
           height: `${zoneWidth}px`,
           left: `${window.pageXOffset + left}px`,
           top: `${window.pageYOffset + top + height_0 - zoneWidth / 2}px`,
-          width: `${width_1}px`
+          width: `${width_0}px`
         },
         right: {
           backgroundColor: 'none',
           cursor: 'col-resize',
           height: `${height_0}px`,
-          left: `${window.pageXOffset + left + width_1 - zoneWidth / 2}px`,
+          left: `${window.pageXOffset + left + width_0 - zoneWidth / 2}px`,
           top: `${window.pageYOffset + top}px`,
           width: `${zoneWidth}px`
         }