@payloadcms/richtext-lexical 4.0.0-internal.5b1e7cd → 4.0.0-internal.5e065b3

package/dist/features/{experimental_table → table}/client/plugins/TableCellResizerPlugin/index.js

@@ -10,6 +10,7 @@ import { $getNearestNodeFromDOMNode, isHTMLElement, SKIP_SCROLL_INTO_VIEW_TAG }
 import * as React from 'react';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
+import './index.css';
 import { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js';
 const MIN_ROW_HEIGHT = 33;
 const MIN_COLUMN_WIDTH = 92;
@@ -264,6 +265,10 @@ function TableCellResizer({
         width: width_0
       } = activeCell.elem.getBoundingClientRect();
       const zoom_0 = calculateZoomLevel(activeCell.elem);
+      const isInModal = Boolean(editor.getRootElement()?.closest('dialog, [role="dialog"]'));
+      const scrollX = isInModal ? 0 : window.scrollX;
+      const scrollY = isInModal ? 0 : window.scrollY;
+      const position = isInModal ? 'fixed' : 'absolute';
       const zoneWidth = 10 // Pixel width of the zone where you can drag the edge
 ;
       const styles = {
@@ -271,29 +276,31 @@ function TableCellResizer({
           backgroundColor: 'none',
           cursor: 'row-resize',
           height: `${zoneWidth}px`,
-          left: `${window.scrollX + left}px`,
-          top: `${window.scrollY + top + height_0 - zoneWidth / 2}px`,
+          left: `${scrollX + left}px`,
+          position,
+          top: `${scrollY + top + height_0 - zoneWidth / 2}px`,
           width: `${width_0}px`
         },
         right: {
           backgroundColor: 'none',
           cursor: 'col-resize',
           height: `${height_0}px`,
-          left: `${window.scrollX + left + width_0 - zoneWidth / 2}px`,
-          top: `${window.scrollY + top}px`,
+          left: `${scrollX + left + width_0 - zoneWidth / 2}px`,
+          position,
+          top: `${scrollY + top}px`,
           width: `${zoneWidth}px`
         }
       };
       const tableRect = tableRectRef.current;
       if (draggingDirection && mouseCurrentPos && tableRect) {
         if (isHeightChanging(draggingDirection)) {
-          styles[draggingDirection].left = `${window.scrollX + tableRect.left}px`;
-          styles[draggingDirection].top = `${window.scrollY + mouseCurrentPos.y / zoom_0}px`;
+          styles[draggingDirection].left = `${scrollX + tableRect.left}px`;
+          styles[draggingDirection].top = `${scrollY + mouseCurrentPos.y / zoom_0}px`;
           styles[draggingDirection].height = '3px';
           styles[draggingDirection].width = `${tableRect.width}px`;
         } else {
-          styles[draggingDirection].top = `${window.scrollY + tableRect.top}px`;
-          styles[draggingDirection].left = `${window.scrollX + mouseCurrentPos.x / zoom_0}px`;
+          styles[draggingDirection].top = `${scrollY + tableRect.top}px`;
+          styles[draggingDirection].left = `${scrollX + mouseCurrentPos.x / zoom_0}px`;
           styles[draggingDirection].width = '3px';
           styles[draggingDirection].height = `${tableRect.height}px`;
         }
@@ -308,7 +315,7 @@ function TableCellResizer({
         top: null
       });
     }
-  }, [activeCell, draggingDirection, mouseCurrentPos]);
+  }, [activeCell, draggingDirection, editor, mouseCurrentPos]);
   return /*#__PURE__*/_jsx("div", {
     ref: resizerRef,
     children: activeCell != null && !isMouseDown && /*#__PURE__*/_jsxs(React.Fragment, {
@@ -325,20 +332,37 @@ function TableCellResizer({
   });
 }
 export const TableCellResizerPlugin = () => {
-  const $ = _c(3);
+  const $ = _c(7);
   const [editor] = useLexicalComposerContext();
   const isEditable = useLexicalEditable();
+  const [portalTarget, setPortalTarget] = useState(null);
   let t0;
-  if ($[0] !== editor || $[1] !== isEditable) {
-    t0 = isEditable ? createPortal(_jsx(TableCellResizer, {
-      editor
-    }), document.body) : null;
+  let t1;
+  if ($[0] !== editor) {
+    t0 = () => editor.registerRootListener(root => {
+      setPortalTarget(root?.closest("dialog, [role=\"dialog\"]") ?? document.body);
+    });
+    t1 = [editor];
     $[0] = editor;
-    $[1] = isEditable;
-    $[2] = t0;
+    $[1] = t0;
+    $[2] = t1;
+  } else {
+    t0 = $[1];
+    t1 = $[2];
+  }
+  useEffect(t0, t1);
+  let t2;
+  if ($[3] !== editor || $[4] !== isEditable || $[5] !== portalTarget) {
+    t2 = isEditable && portalTarget ? createPortal(_jsx(TableCellResizer, {
+      editor
+    }), portalTarget) : null;
+    $[3] = editor;
+    $[4] = isEditable;
+    $[5] = portalTarget;
+    $[6] = t2;
   } else {
-    t0 = $[2];
+    t2 = $[6];
   }
-  return t0;
+  return t2;
 };
 //# sourceMappingURL=index.js.map

package/dist/features/table/client/plugins/TableCellResizerPlugin/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","useLexicalEditable","$computeTableMapSkipCellCheck","$getTableNodeFromLexicalNodeOrThrow","$getTableRowIndexFromTableCellNode","$isTableCellNode","$isTableRowNode","getDOMCellFromTarget","getTableElement","TableNode","calculateZoomLevel","mergeRegister","$getNearestNodeFromDOMNode","isHTMLElement","SKIP_SCROLL_INTO_VIEW_TAG","React","useCallback","useEffect","useMemo","useRef","useState","createPortal","useEditorConfigContext","MIN_ROW_HEIGHT","MIN_COLUMN_WIDTH","TableCellResizer","editor","targetRef","resizerRef","tableRectRef","hasTable","setHasTable","editorConfig","mouseStartPosRef","mouseCurrentPos","updateMouseCurrentPos","activeCell","updateActiveCell","isMouseDown","updateIsMouseDown","draggingDirection","updateDraggingDirection","resetState","current","isMouseDownOnEvent","event","buttons","tableKeys","Set","registerMutationListener","nodeMutations","nodeKey","mutation","delete","add","size","registerNodeTransform","tableNode","getColWidths","numColumns","getColumnCount","columnWidth","setColWidths","Array","fill","onMouseMove","target","x","clientX","y","clientY","contains","cell","getEditorState","read","tableCellNode","elem","Error","tableElement","getElementByKey","getKey","getBoundingClientRect","onMouseDown","onMouseUp","removeRootListener","registerRootListener","rootElement","prevRootElement","removeEventListener","addEventListener","isHeightChanging","direction","updateRowHeight","heightChange","update","baseRowIndex","tableRows","getChildren","isFullRowMerge","getColSpan","tableRowIndex","getRowSpan","length","tableRow","height","getHeight","undefined","rowCells","Math","min","map","getCellNodeHeight","Infinity","newHeight","max","setHeight","tag","activeEditor","domCellNode","clientHeight","getCellColumnIndex","tableMap","columnIndex","forEach","row","columnIndexInner","updateColumnWidth","widthChange","colWidths","width","newColWidths","newWidth","mouseUpHandler","handler","preventDefault","stopPropagation","zoom","document","toggleResize","resizerStyles","setResizerStyles","bottom","left","right","top","isInModal","Boolean","getRootElement","closest","scrollX","window","scrollY","position","zoneWidth","styles","backgroundColor","cursor","tableRect","_jsx","ref","_jsxs","Fragment","className","lexical","theme","tableCellResizer","style","TableCellResizerPlugin","$","isEditable","portalTarget","setPortalTarget","t0","t1","root","body","t2"],"sources":["../../../../../../src/features/table/client/plugins/TableCellResizerPlugin/index.tsx"],"sourcesContent":["'use client'\n\nimport type { TableCellNode, TableDOMCell, TableMapType } from '@lexical/table'\nimport type { LexicalEditor, NodeKey } from 'lexical'\nimport type { JSX, MouseEventHandler } from 'react'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport {\n  $computeTableMapSkipCellCheck,\n  $getTableNodeFromLexicalNodeOrThrow,\n  $getTableRowIndexFromTableCellNode,\n  $isTableCellNode,\n  $isTableRowNode,\n  getDOMCellFromTarget,\n  getTableElement,\n  TableNode,\n} from '@lexical/table'\nimport { calculateZoomLevel, mergeRegister } from '@lexical/utils'\nimport { $getNearestNodeFromDOMNode, isHTMLElement, SKIP_SCROLL_INTO_VIEW_TAG } from 'lexical'\nimport * as React from 'react'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\n\nimport type { PluginComponent } from '../../../../typesClient.js'\n\nimport './index.css'\nimport { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js'\n\ntype MousePosition = {\n  x: number\n  y: number\n}\n\ntype MouseDraggingDirection = 'bottom' | 'right'\n\nconst MIN_ROW_HEIGHT = 33\nconst MIN_COLUMN_WIDTH = 92\n\nfunction TableCellResizer({ editor }: { editor: LexicalEditor }): JSX.Element {\n  const targetRef = useRef<HTMLElement | null>(null)\n  const resizerRef = useRef<HTMLDivElement | null>(null)\n  const tableRectRef = useRef<ClientRect | null>(null)\n  const [hasTable, setHasTable] = useState(false)\n  const editorConfig = useEditorConfigContext()\n\n  const mouseStartPosRef = useRef<MousePosition | null>(null)\n  const [mouseCurrentPos, updateMouseCurrentPos] = useState<MousePosition | null>(null)\n\n  const [activeCell, updateActiveCell] = useState<null | TableDOMCell>(null)\n  const [isMouseDown, updateIsMouseDown] = useState<boolean>(false)\n  const [draggingDirection, updateDraggingDirection] = useState<MouseDraggingDirection | null>(null)\n\n  const resetState = useCallback(() => {\n    updateActiveCell(null)\n    targetRef.current = null\n    updateDraggingDirection(null)\n    mouseStartPosRef.current = null\n    tableRectRef.current = null\n  }, [])\n\n  const isMouseDownOnEvent = (event: MouseEvent) => {\n    return (event.buttons & 1) === 1\n  }\n\n  useEffect(() => {\n    const tableKeys = new Set<NodeKey>()\n    return mergeRegister(\n      editor.registerMutationListener(TableNode, (nodeMutations) => {\n        for (const [nodeKey, mutation] of nodeMutations) {\n          if (mutation === 'destroyed') {\n            tableKeys.delete(nodeKey)\n          } else {\n            tableKeys.add(nodeKey)\n          }\n        }\n        setHasTable(tableKeys.size > 0)\n      }),\n      editor.registerNodeTransform(TableNode, (tableNode) => {\n        if (tableNode.getColWidths()) {\n          return tableNode\n        }\n\n        const numColumns = tableNode.getColumnCount()\n        const columnWidth = MIN_COLUMN_WIDTH\n\n        tableNode.setColWidths(Array(numColumns).fill(columnWidth))\n        return tableNode\n      }),\n    )\n  }, [editor])\n\n  useEffect(() => {\n    if (!hasTable) {\n      return\n    }\n\n    const onMouseMove = (event: MouseEvent) => {\n      const target = event.target\n      if (!isHTMLElement(target)) {\n        return\n      }\n\n      if (draggingDirection) {\n        updateMouseCurrentPos({\n          x: event.clientX,\n          y: event.clientY,\n        })\n        return\n      }\n      updateIsMouseDown(isMouseDownOnEvent(event))\n      if (resizerRef.current && resizerRef.current.contains(target)) {\n        return\n      }\n\n      if (targetRef.current !== target) {\n        targetRef.current = target\n        const cell = getDOMCellFromTarget(target)\n\n        if (cell && activeCell !== cell) {\n          editor.getEditorState().read(\n            () => {\n              const tableCellNode = $getNearestNodeFromDOMNode(cell.elem)\n\n              if (!tableCellNode) {\n                throw new Error('TableCellResizer: Table cell node not found.')\n              }\n\n              const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode)\n              const tableElement = getTableElement(\n                tableNode,\n                editor.getElementByKey(tableNode.getKey()),\n              )\n              if (!tableElement) {\n                throw new Error('TableCellResizer: Table element not found.')\n              }\n\n              targetRef.current = target\n              tableRectRef.current = tableElement.getBoundingClientRect()\n              updateActiveCell(cell)\n            },\n            { editor },\n          )\n        } else if (cell == null) {\n          resetState()\n        }\n      }\n    }\n\n    const onMouseDown = (event: MouseEvent) => {\n      updateIsMouseDown(true)\n    }\n\n    const onMouseUp = (event: MouseEvent) => {\n      updateIsMouseDown(false)\n    }\n\n    const removeRootListener = editor.registerRootListener((rootElement, prevRootElement) => {\n      prevRootElement?.removeEventListener('mousemove', onMouseMove)\n      prevRootElement?.removeEventListener('mousedown', onMouseDown)\n      prevRootElement?.removeEventListener('mouseup', onMouseUp)\n      rootElement?.addEventListener('mousemove', onMouseMove)\n      rootElement?.addEventListener('mousedown', onMouseDown)\n      rootElement?.addEventListener('mouseup', onMouseUp)\n    })\n\n    return () => {\n      removeRootListener()\n    }\n  }, [activeCell, draggingDirection, editor, hasTable, resetState])\n\n  const isHeightChanging = (direction: MouseDraggingDirection) => {\n    if (direction === 'bottom') {\n      return true\n    }\n    return false\n  }\n\n  const updateRowHeight = useCallback(\n    (heightChange: number) => {\n      if (!activeCell) {\n        throw new Error('TableCellResizer: Expected active cell.')\n      }\n\n      editor.update(\n        () => {\n          const tableCellNode = $getNearestNodeFromDOMNode(activeCell.elem)\n          if (!$isTableCellNode(tableCellNode)) {\n            throw new Error('TableCellResizer: Table cell node not found.')\n          }\n\n          const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode)\n\n          const baseRowIndex = $getTableRowIndexFromTableCellNode(tableCellNode)\n          const tableRows = tableNode.getChildren()\n\n          // Determine if this is a full row merge by checking colspan\n          const isFullRowMerge = tableCellNode.getColSpan() === tableNode.getColumnCount()\n\n          // For full row merges, apply to first row. For partial merges, apply to last row\n          const tableRowIndex = isFullRowMerge\n            ? baseRowIndex\n            : baseRowIndex + tableCellNode.getRowSpan() - 1\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          let height = tableRow.getHeight()\n          if (height === undefined) {\n            const rowCells = tableRow.getChildren<TableCellNode>()\n            height = Math.min(\n              ...rowCells.map((cell) => getCellNodeHeight(cell, editor) ?? Infinity),\n            )\n          }\n\n          const newHeight = Math.max(height + heightChange, MIN_ROW_HEIGHT)\n          tableRow.setHeight(newHeight)\n        },\n        { tag: SKIP_SCROLL_INTO_VIEW_TAG },\n      )\n    },\n    [activeCell, editor],\n  )\n\n  const getCellNodeHeight = (\n    cell: TableCellNode,\n    activeEditor: LexicalEditor,\n  ): number | undefined => {\n    const domCellNode = activeEditor.getElementByKey(cell.getKey())\n    return domCellNode?.clientHeight\n  }\n\n  const getCellColumnIndex = (tableCellNode: TableCellNode, tableMap: TableMapType) => {\n    let columnIndex: number | undefined\n    tableMap.forEach((row) => {\n      row.forEach((cell, columnIndexInner) => {\n        if (cell.cell === tableCellNode) {\n          columnIndex = columnIndexInner\n        }\n      })\n    })\n    return columnIndex\n  }\n\n  const updateColumnWidth = useCallback(\n    (widthChange: number) => {\n      if (!activeCell) {\n        throw new Error('TableCellResizer: Expected active cell.')\n      }\n      editor.update(\n        () => {\n          const tableCellNode = $getNearestNodeFromDOMNode(activeCell.elem)\n          if (!$isTableCellNode(tableCellNode)) {\n            throw new Error('TableCellResizer: Table cell node not found.')\n          }\n\n          const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode)\n          const [tableMap] = $computeTableMapSkipCellCheck(tableNode, null, null)\n          const columnIndex = getCellColumnIndex(tableCellNode, tableMap)\n          if (columnIndex === undefined) {\n            throw new Error('TableCellResizer: Table column not found.')\n          }\n\n          const colWidths = tableNode.getColWidths()\n          if (!colWidths) {\n            return\n          }\n          const width = colWidths[columnIndex]\n          if (width === undefined) {\n            return\n          }\n          const newColWidths = [...colWidths]\n          const newWidth = Math.max(width + widthChange, MIN_COLUMN_WIDTH)\n          newColWidths[columnIndex] = newWidth\n          tableNode.setColWidths(newColWidths)\n        },\n        { tag: SKIP_SCROLL_INTO_VIEW_TAG },\n      )\n    },\n    [activeCell, editor],\n  )\n\n  const mouseUpHandler = useCallback(\n    (direction: MouseDraggingDirection) => {\n      const handler = (event: MouseEvent) => {\n        event.preventDefault()\n        event.stopPropagation()\n\n        if (!activeCell) {\n          throw new Error('TableCellResizer: Expected active cell.')\n        }\n\n        if (mouseStartPosRef.current) {\n          const { x, y } = mouseStartPosRef.current\n\n          if (activeCell === null) {\n            return\n          }\n          const zoom = calculateZoomLevel(event.target as Element)\n\n          if (isHeightChanging(direction)) {\n            const heightChange = (event.clientY - y) / zoom\n            updateRowHeight(heightChange)\n          } else {\n            const widthChange = (event.clientX - x) / zoom\n            updateColumnWidth(widthChange)\n          }\n\n          resetState()\n          document.removeEventListener('mouseup', handler)\n        }\n      }\n      return handler\n    },\n    [activeCell, resetState, updateColumnWidth, updateRowHeight],\n  )\n\n  const toggleResize = useCallback(\n    (direction: MouseDraggingDirection): MouseEventHandler<HTMLDivElement> =>\n      (event) => {\n        event.preventDefault()\n        event.stopPropagation()\n\n        if (!activeCell) {\n          throw new Error('TableCellResizer: Expected active cell.')\n        }\n\n        mouseStartPosRef.current = {\n          x: event.clientX,\n          y: event.clientY,\n        }\n        updateMouseCurrentPos(mouseStartPosRef.current)\n        updateDraggingDirection(direction)\n\n        document.addEventListener('mouseup', mouseUpHandler(direction))\n      },\n    [activeCell, mouseUpHandler],\n  )\n\n  const [resizerStyles, setResizerStyles] = useState<{\n    bottom?: null | React.CSSProperties\n    left?: null | React.CSSProperties\n    right?: null | React.CSSProperties\n    top?: null | React.CSSProperties\n  }>({\n    bottom: null,\n    left: null,\n    right: null,\n    top: null,\n  })\n\n  useEffect(() => {\n    if (activeCell) {\n      const { height, left, top, width } = activeCell.elem.getBoundingClientRect()\n      const zoom = calculateZoomLevel(activeCell.elem)\n      const isInModal = Boolean(editor.getRootElement()?.closest('dialog, [role=\"dialog\"]'))\n      const scrollX = isInModal ? 0 : window.scrollX\n      const scrollY = isInModal ? 0 : window.scrollY\n      const position = isInModal ? ('fixed' as const) : ('absolute' as const)\n      const zoneWidth = 10 // Pixel width of the zone where you can drag the edge\n      const styles = {\n        bottom: {\n          backgroundColor: 'none',\n          cursor: 'row-resize',\n          height: `${zoneWidth}px`,\n          left: `${scrollX + left}px`,\n          position,\n          top: `${scrollY + top + height - zoneWidth / 2}px`,\n          width: `${width}px`,\n        },\n        right: {\n          backgroundColor: 'none',\n          cursor: 'col-resize',\n          height: `${height}px`,\n          left: `${scrollX + left + width - zoneWidth / 2}px`,\n          position,\n          top: `${scrollY + top}px`,\n          width: `${zoneWidth}px`,\n        },\n      }\n\n      const tableRect = tableRectRef.current\n\n      if (draggingDirection && mouseCurrentPos && tableRect) {\n        if (isHeightChanging(draggingDirection)) {\n          styles[draggingDirection].left = `${scrollX + tableRect.left}px`\n          styles[draggingDirection].top = `${scrollY + mouseCurrentPos.y / zoom}px`\n          styles[draggingDirection].height = '3px'\n          styles[draggingDirection].width = `${tableRect.width}px`\n        } else {\n          styles[draggingDirection].top = `${scrollY + tableRect.top}px`\n          styles[draggingDirection].left = `${scrollX + mouseCurrentPos.x / zoom}px`\n          styles[draggingDirection].width = '3px'\n          styles[draggingDirection].height = `${tableRect.height}px`\n        }\n\n        styles[draggingDirection].backgroundColor = '#adf'\n      }\n\n      setResizerStyles(styles)\n    } else {\n      setResizerStyles({\n        bottom: null,\n        left: null,\n        right: null,\n        top: null,\n      })\n    }\n  }, [activeCell, draggingDirection, editor, mouseCurrentPos])\n\n  return (\n    <div ref={resizerRef}>\n      {activeCell != null && !isMouseDown && (\n        <React.Fragment>\n          <div\n            className={`${editorConfig.editorConfig.lexical.theme.tableCellResizer} TableCellResizer__ui`}\n            onMouseDown={toggleResize('right')}\n            style={resizerStyles.right || undefined}\n          />\n          <div\n            className={`${editorConfig.editorConfig.lexical.theme.tableCellResizer} TableCellResizer__ui`}\n            onMouseDown={toggleResize('bottom')}\n            style={resizerStyles.bottom || undefined}\n          />\n        </React.Fragment>\n      )}\n    </div>\n  )\n}\n\nexport const TableCellResizerPlugin: PluginComponent = () => {\n  const [editor] = useLexicalComposerContext()\n  const isEditable = useLexicalEditable()\n  const [portalTarget, setPortalTarget] = useState<Element | null>(null)\n\n  useEffect(\n    () =>\n      editor.registerRootListener((root) => {\n        setPortalTarget(root?.closest('dialog, [role=\"dialog\"]') ?? document.body)\n      }),\n    [editor],\n  )\n\n  return useMemo(\n    () =>\n      isEditable && portalTarget\n        ? createPortal(<TableCellResizer editor={editor} />, portalTarget)\n        : null,\n    [editor, isEditable, portalTarget],\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/table/client/plugins/TableHoverActionsPlugin/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/table/client/plugins/TableHoverActionsPlugin/index.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AA+Q9B,wBAAgB,uBAAuB,CAAC,EACtC,UAA0B,GAC3B,EAAE;IACD,UAAU,CAAC,EAAE,WAAW,CAAA;CACzB,GAAG,IAAI,GAAG,KAAK,CAAC,WAAW,CAQ3B"}

package/dist/features/{experimental_table → table}/client/plugins/TableHoverActionsPlugin/index.js

@@ -12,7 +12,7 @@ import * as React from 'react';
 import { createPortal } from 'react-dom';
 import { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js';
 import { useDebounce } from '../../utils/useDebounce.js';
-const BUTTON_WIDTH_PX = 20;
+const BUTTON_WIDTH_PX = 16;
 function TableHoverActionsContainer({
   anchorElem
 }) {

package/dist/features/table/client/plugins/TableHoverActionsPlugin/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","useLexicalEditable","$getTableAndElementByKey","$getTableColumnIndexFromTableCellNode","$getTableRowIndexFromTableCellNode","$insertTableColumnAtSelection","$insertTableRowAtSelection","$isTableCellNode","$isTableNode","getTableElement","TableNode","$findMatchingParent","mergeRegister","$getNearestNodeFromDOMNode","isHTMLElement","useEffect","useMemo","useRef","useState","React","createPortal","useEditorConfigContext","useDebounce","BUTTON_WIDTH_PX","TableHoverActionsContainer","anchorElem","editor","isEditable","editorConfig","isShownRow","setShownRow","isShownColumn","setShownColumn","shouldListenMouseMove","setShouldListenMouseMove","position","setPosition","tableSetRef","Set","tableCellDOMNodeRef","debouncedOnMouseMove","event","isOutside","tableDOMNode","getMouseInfo","lexical","current","hoveredRowNode","hoveredColumnNode","tableDOMElement","getEditorState","read","maybeTableCell","table","node","getElementByKey","getKey","rowCount","getChildrenSize","colCount","getChildAtIndex","rowIndex","colIndex","tableContainerElement","parentElement","bottom","tableElemBottom","height","tableElemHeight","left","tableElemLeft","right","tableElemRight","width","tableElemWidth","y","tableElemY","getBoundingClientRect","tableHasScroll","classList","contains","scrollWidth","clientWidth","editorElemLeft","editorElemY","offsetLeft","top","offsetWidth","tableResizeObserver","ResizeObserver","document","addEventListener","removeEventListener","registerMutationListener","mutations","resetObserver","key","type","add","delete","disconnect","tableKey","tableElement","observe","size","skipInitialization","insertAction","insertRow","update","maybeTableNode","selectEnd","_jsxs","_Fragment","_jsx","className","theme","tableAddRows","onClick","style","tableAddColumns","target","closest","tableCell","tableCellResizer","TableHoverActionsPlugin","t0","$","t1","undefined","body","t2"],"sources":["../../../../../../src/features/table/client/plugins/TableHoverActionsPlugin/index.tsx"],"sourcesContent":["'use client'\n\nimport type { TableCellNode, TableRowNode } from '@lexical/table'\nimport type { EditorConfig, NodeKey } from 'lexical'\nimport type { JSX } from 'react'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport {\n  $getTableAndElementByKey,\n  $getTableColumnIndexFromTableCellNode,\n  $getTableRowIndexFromTableCellNode,\n  $insertTableColumnAtSelection,\n  $insertTableRowAtSelection,\n  $isTableCellNode,\n  $isTableNode,\n  getTableElement,\n  TableNode,\n} from '@lexical/table'\nimport { $findMatchingParent, mergeRegister } from '@lexical/utils'\nimport { $getNearestNodeFromDOMNode, isHTMLElement } from 'lexical'\nimport { useEffect, useMemo, useRef, useState } from 'react'\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\n\nimport { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport { useDebounce } from '../../utils/useDebounce.js'\n\nconst BUTTON_WIDTH_PX = 16\n\nfunction TableHoverActionsContainer({\n  anchorElem,\n}: {\n  anchorElem: HTMLElement\n}): JSX.Element | null {\n  const [editor] = useLexicalComposerContext()\n  const isEditable = useLexicalEditable()\n\n  const editorConfig = useEditorConfigContext()\n  const [isShownRow, setShownRow] = useState<boolean>(false)\n  const [isShownColumn, setShownColumn] = useState<boolean>(false)\n  const [shouldListenMouseMove, setShouldListenMouseMove] = useState<boolean>(false)\n  const [position, setPosition] = useState({})\n  const tableSetRef = useRef<Set<NodeKey>>(new Set())\n  const tableCellDOMNodeRef = useRef<HTMLElement | null>(null)\n\n  const debouncedOnMouseMove = useDebounce(\n    (event: MouseEvent) => {\n      const { isOutside, tableDOMNode } = getMouseInfo(event, editorConfig.editorConfig?.lexical)\n\n      if (isOutside) {\n        setShownRow(false)\n        setShownColumn(false)\n        return\n      }\n\n      if (!tableDOMNode) {\n        return\n      }\n\n      tableCellDOMNodeRef.current = tableDOMNode\n\n      let hoveredRowNode: null | TableCellNode = null\n      let hoveredColumnNode: null | TableCellNode = null\n      let tableDOMElement: HTMLElement | null = null\n\n      editor.getEditorState().read(\n        () => {\n          const maybeTableCell = $getNearestNodeFromDOMNode(tableDOMNode)\n\n          if ($isTableCellNode(maybeTableCell)) {\n            const table = $findMatchingParent(maybeTableCell, (node) => $isTableNode(node))\n            if (!$isTableNode(table)) {\n              return\n            }\n\n            tableDOMElement = getTableElement(table, editor.getElementByKey(table.getKey()))\n\n            if (tableDOMElement) {\n              const rowCount = table.getChildrenSize()\n              const colCount = (table.getChildAtIndex(0) as TableRowNode)?.getChildrenSize()\n\n              const rowIndex = $getTableRowIndexFromTableCellNode(maybeTableCell)\n              const colIndex = $getTableColumnIndexFromTableCellNode(maybeTableCell)\n\n              if (rowIndex === rowCount - 1) {\n                hoveredRowNode = maybeTableCell\n              } else if (colIndex === colCount - 1) {\n                hoveredColumnNode = maybeTableCell\n              }\n            }\n          }\n        },\n        { editor },\n      )\n\n      if (!tableDOMElement) {\n        return\n      }\n\n      // this is the scrollable div container of the table (in case of overflow)\n      const tableContainerElement = (tableDOMElement as HTMLTableElement).parentElement\n\n      if (!tableContainerElement) {\n        return\n      }\n\n      const {\n        bottom: tableElemBottom,\n        height: tableElemHeight,\n        left: tableElemLeft,\n        right: tableElemRight,\n        width: tableElemWidth,\n        y: tableElemY,\n      } = (tableDOMElement as HTMLTableElement).getBoundingClientRect()\n\n      let tableHasScroll = false\n      if (\n        tableContainerElement &&\n        tableContainerElement.classList.contains('LexicalEditorTheme__tableScrollableWrapper')\n      ) {\n        tableHasScroll = tableContainerElement.scrollWidth > tableContainerElement.clientWidth\n      }\n\n      const { left: editorElemLeft, y: editorElemY } = anchorElem.getBoundingClientRect()\n\n      if (hoveredRowNode) {\n        setShownColumn(false)\n        setShownRow(true)\n        setPosition({\n          height: BUTTON_WIDTH_PX,\n          left:\n            tableHasScroll && tableContainerElement\n              ? tableContainerElement.offsetLeft\n              : tableElemLeft - editorElemLeft,\n          top: tableElemBottom - editorElemY + 5,\n          width:\n            tableHasScroll && tableContainerElement\n              ? tableContainerElement.offsetWidth\n              : tableElemWidth,\n        })\n      } else if (hoveredColumnNode) {\n        setShownColumn(true)\n        setShownRow(false)\n        setPosition({\n          height: tableElemHeight,\n          left: tableElemRight - editorElemLeft + 5,\n          top: tableElemY - editorElemY,\n          width: BUTTON_WIDTH_PX,\n        })\n      }\n    },\n    50,\n    250,\n  )\n\n  // Hide the buttons on any table dimensions change to prevent last row cells\n  // overlap behind the 'Add Row' button when text entry changes cell height\n  const tableResizeObserver = useMemo(() => {\n    return new ResizeObserver(() => {\n      setShownRow(false)\n      setShownColumn(false)\n    })\n  }, [])\n\n  useEffect(() => {\n    if (!shouldListenMouseMove) {\n      return\n    }\n\n    document.addEventListener('mousemove', debouncedOnMouseMove)\n\n    return () => {\n      setShownRow(false)\n      setShownColumn(false)\n\n      document.removeEventListener('mousemove', debouncedOnMouseMove)\n    }\n  }, [shouldListenMouseMove, debouncedOnMouseMove])\n\n  useEffect(() => {\n    return mergeRegister(\n      editor.registerMutationListener(\n        TableNode,\n        (mutations) => {\n          editor.getEditorState().read(\n            () => {\n              let resetObserver = false\n              for (const [key, type] of mutations) {\n                switch (type) {\n                  case 'created': {\n                    tableSetRef.current.add(key)\n                    resetObserver = true\n                    break\n                  }\n                  case 'destroyed': {\n                    tableSetRef.current.delete(key)\n                    resetObserver = true\n                    break\n                  }\n                  default:\n                    break\n                }\n              }\n              if (resetObserver) {\n                // Reset resize observers\n                tableResizeObserver.disconnect()\n                for (const tableKey of tableSetRef.current) {\n                  const { tableElement } = $getTableAndElementByKey(tableKey)\n                  tableResizeObserver.observe(tableElement)\n                }\n                setShouldListenMouseMove(tableSetRef.current.size > 0)\n              }\n            },\n            { editor },\n          )\n        },\n        { skipInitialization: false },\n      ),\n    )\n  }, [editor, tableResizeObserver])\n\n  const insertAction = (insertRow: boolean) => {\n    editor.update(() => {\n      if (tableCellDOMNodeRef.current) {\n        const maybeTableNode = $getNearestNodeFromDOMNode(tableCellDOMNodeRef.current)\n        maybeTableNode?.selectEnd()\n        if (insertRow) {\n          $insertTableRowAtSelection()\n          setShownRow(false)\n        } else {\n          $insertTableColumnAtSelection()\n          setShownColumn(false)\n        }\n      }\n    })\n  }\n\n  if (!isEditable) {\n    return null\n  }\n\n  return (\n    <>\n      {isShownRow && (\n        <button\n          aria-label=\"Add Row\"\n          className={editorConfig.editorConfig.lexical.theme.tableAddRows}\n          onClick={() => insertAction(true)}\n          style={{ ...position }}\n          type=\"button\"\n        />\n      )}\n      {isShownColumn && (\n        <button\n          aria-label=\"Add Column\"\n          className={editorConfig.editorConfig.lexical.theme.tableAddColumns}\n          onClick={() => insertAction(false)}\n          style={{ ...position }}\n          type=\"button\"\n        />\n      )}\n    </>\n  )\n}\n\nfunction getMouseInfo(\n  event: MouseEvent,\n  editorConfig: EditorConfig,\n): {\n  isOutside: boolean\n  tableDOMNode: HTMLElement | null\n} {\n  const target = event.target\n\n  if (isHTMLElement(target)) {\n    const tableDOMNode = target.closest<HTMLElement>(\n      `td.${editorConfig.theme.tableCell}, th.${editorConfig.theme.tableCell}`,\n    )\n\n    const isOutside = !(\n      tableDOMNode ||\n      target.closest<HTMLElement>(`button.${editorConfig.theme.tableAddRows}`) ||\n      target.closest<HTMLElement>(`button.${editorConfig.theme.tableAddColumns}`) ||\n      target.closest<HTMLElement>(`div.${editorConfig.theme.tableCellResizer}`)\n    )\n\n    return { isOutside, tableDOMNode }\n  } else {\n    return { isOutside: true, tableDOMNode: null }\n  }\n}\n\nexport function TableHoverActionsPlugin({\n  anchorElem = document.body,\n}: {\n  anchorElem?: HTMLElement\n}): null | React.ReactPortal {\n  const isEditable = useLexicalEditable()\n\n  if (!isEditable) {\n    return null\n  }\n\n  return createPortal(<TableHoverActionsContainer anchorElem={anchorElem} />, anchorElem)\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/table/client/plugins/TablePlugin/TableGridPopup/index.css

@@ -0,0 +1,163 @@
+@layer payload-default {
+  .table-grid-popup {
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 100;
+  }
+
+  .table-grid-popup__content {
+    width: 13rem;
+    background: var(--color-bg);
+    border-radius: var(--radius-large);
+    padding: var(--spacer-2);
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacer-2);
+    box-shadow:
+      0px 0px 0.5px 0px rgba(0, 0, 0, 0.15),
+      0px 5px 12px 0px rgba(0, 0, 0, 0.13),
+      0px 1px 3px 0px rgba(0, 0, 0, 0.1);
+  }
+
+  .table-grid-popup__header {
+    display: flex;
+    align-items: center;
+    gap: var(--spacer-2);
+    justify-content: center;
+  }
+
+  .table-grid-popup__input-group {
+    flex: 1 0 0;
+    display: flex;
+    align-items: center;
+    height: var(--spacer-4);
+    background: var(--color-bg-secondary);
+    border-radius: var(--radius-medium);
+    overflow: clip;
+    min-width: 0;
+    border: var(--stroke-width-small) solid transparent;
+  }
+
+  .table-grid-popup__input-group:hover {
+    background: var(--color-bg-secondary-hover);
+  }
+
+  .table-grid-popup__input-group--focused {
+    border-color: var(--color-border-selected);
+  }
+
+  .table-grid-popup__input-icon {
+    width: var(--spacer-4);
+    height: var(--spacer-4);
+    flex-shrink: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: var(--color-text-secondary);
+  }
+
+  .table-grid-popup__input-icon svg {
+    width: var(--spacer-2-5);
+    height: var(--spacer-2-5);
+  }
+
+  .table-grid-popup__input {
+    flex: 1 0 0;
+    min-width: 0;
+    border: none;
+    background: transparent;
+    font-size: var(--text-body-medium-font-size);
+    font-weight: var(--text-body-medium-font-weight);
+    line-height: var(--text-body-medium-line-height);
+    color: var(--color-text-secondary);
+    padding: 0;
+    padding-right: var(--spacer-2);
+    outline: none;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    width: 100%;
+  }
+
+  .table-grid-popup__input::-webkit-inner-spin-button,
+  .table-grid-popup__input::-webkit-outer-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
+  }
+
+  .table-grid-popup__input[type='number'] {
+    -moz-appearance: textfield;
+  }
+
+  .table-grid-popup__separator {
+    font-size: var(--text-body-medium-font-size);
+    font-weight: var(--text-body-medium-font-weight);
+    color: var(--color-text-secondary);
+    flex-shrink: 0;
+    line-height: 1;
+  }
+
+  .table-grid-popup__grid {
+    display: grid;
+    grid-template-columns: repeat(10, 1fr);
+    grid-template-rows: repeat(7, 1fr);
+    row-gap: calc(var(--spacer-1) / 2);
+    column-gap: calc(var(--spacer-1) / 2);
+    flex-shrink: 0;
+    align-self: stretch;
+    position: relative;
+  }
+
+  .table-grid-popup__cell {
+    aspect-ratio: 1;
+    background: var(--color-bg-secondary);
+    border-radius: var(--radius-small);
+    cursor: pointer;
+    border: var(--stroke-width-small) solid transparent;
+  }
+
+  .table-grid-popup__cell--selected {
+    background: var(--color-bg-selected);
+    border-color: var(--color-blue-400);
+  }
+
+  .table-grid-popup__cell--hover {
+    background: var(--color-bg-selected-hover);
+    border-color: var(--color-blue-400);
+  }
+
+  .table-grid-popup__tooltip {
+    position: absolute;
+    background: var(--color-bg-menu);
+    color: var(--ramp-white-800);
+    font-size: var(--text-body-medium-font-size);
+    font-weight: var(--text-body-medium-font-weight);
+    line-height: var(--text-body-medium-line-height);
+    padding: var(--spacer-1) var(--spacer-2);
+    border-radius: var(--radius-medium);
+    white-space: nowrap;
+    pointer-events: none;
+    transform: translate(-50%, calc(-100% - 6px));
+    z-index: 1;
+  }
+
+  /* .table-grid-popup__tooltip::after {
+    content: '';
+    position: absolute;
+    bottom: calc(var(--spacer-1) * -1);
+    left: 50%;
+    transform: translateX(-50%);
+    width: 0;
+    height: 0;
+    border-left: 5px solid transparent;
+    border-right: 5px solid transparent;
+    border-top: 4px solid var(--color-bg-menu);
+  } */
+
+  .table-grid-popup__backdrop {
+    position: fixed;
+    inset: 0;
+    z-index: 99;
+  }
+}

package/dist/features/table/client/plugins/TablePlugin/TableGridPopup/index.d.ts

@@ -0,0 +1,17 @@
+import type { LexicalEditor } from 'lexical';
+import * as React from 'react';
+import './index.css';
+type TableGridPopupProps = {
+    anchorElem: HTMLElement | null;
+    editor: LexicalEditor;
+    isOpen: boolean;
+    onClose: () => void;
+    onInsert: (cols: number, rows: number) => void;
+    position: {
+        left: number;
+        top: number;
+    } | null;
+};
+export declare function TableGridPopup({ anchorElem, editor: _editor, isOpen, onClose, onInsert, position, }: TableGridPopupProps): React.ReactPortal | null;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/features/table/client/plugins/TablePlugin/TableGridPopup/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/features/table/client/plugins/TablePlugin/TableGridPopup/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAG5C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,aAAa,CAAA;AAuBpB,KAAK,mBAAmB,GAAG;IACzB,UAAU,EAAE,WAAW,GAAG,IAAI,CAAA;IAC9B,MAAM,EAAE,aAAa,CAAA;IACrB,MAAM,EAAE,OAAO,CAAA;IACf,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAC9C,QAAQ,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAA;CAC/C,CAAA;AAED,wBAAgB,cAAc,CAAC,EAC7B,UAAU,EACV,MAAM,EAAE,OAAO,EACf,MAAM,EACN,OAAO,EACP,QAAQ,EACR,QAAQ,GACT,EAAE,mBAAmB,4BAgLrB"}

package/dist/features/table/client/plugins/TablePlugin/TableGridPopup/index.js

@@ -0,0 +1,219 @@
+'use client';
+
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef, useState } from 'react';
+import * as React from 'react';
+import { createPortal } from 'react-dom';
+import './index.css';
+const GRID_COLUMNS = 10;
+const GRID_ROWS = 7;
+function ColumnsIcon() {
+  return /*#__PURE__*/_jsxs("svg", {
+    fill: "none",
+    height: "12",
+    viewBox: "0 0 12 12",
+    width: "12",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [/*#__PURE__*/_jsx("rect", {
+      height: "9",
+      rx: "1",
+      stroke: "currentColor",
+      width: "3",
+      x: "1.5",
+      y: "1.5"
+    }), /*#__PURE__*/_jsx("rect", {
+      height: "9",
+      rx: "1",
+      stroke: "currentColor",
+      width: "3",
+      x: "7.5",
+      y: "1.5"
+    })]
+  });
+}
+function RowsIcon() {
+  return /*#__PURE__*/_jsxs("svg", {
+    fill: "none",
+    height: "12",
+    viewBox: "0 0 12 12",
+    width: "12",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [/*#__PURE__*/_jsx("rect", {
+      height: "3",
+      rx: "1",
+      stroke: "currentColor",
+      width: "9",
+      x: "1.5",
+      y: "1.5"
+    }), /*#__PURE__*/_jsx("rect", {
+      height: "3",
+      rx: "1",
+      stroke: "currentColor",
+      width: "9",
+      x: "1.5",
+      y: "7.5"
+    })]
+  });
+}
+export function TableGridPopup({
+  anchorElem,
+  editor: _editor,
+  isOpen,
+  onClose,
+  onInsert,
+  position
+}) {
+  const [hoverCol, setHoverCol] = useState(0);
+  const [hoverRow, setHoverRow] = useState(0);
+  const [inputCols, setInputCols] = useState('');
+  const [inputRows, setInputRows] = useState('');
+  const [focusedInput, setFocusedInput] = useState(null);
+  const popupRef = useRef(null);
+  const colsInputRef = useRef(null);
+  const rowsInputRef = useRef(null);
+  const effectiveCols = hoverCol > 0 ? hoverCol : inputCols ? parseInt(inputCols, 10) || 0 : 5;
+  const effectiveRows = hoverRow > 0 ? hoverRow : inputRows ? parseInt(inputRows, 10) || 0 : 5;
+  useEffect(() => {
+    if (!isOpen) {
+      setHoverCol(0);
+      setHoverRow(0);
+      setInputCols('');
+      setInputRows('');
+      setFocusedInput(null);
+    }
+  }, [isOpen]);
+  useEffect(() => {
+    if (!isOpen) {
+      return;
+    }
+    const handleKeyDown = e => {
+      if (e.key === 'Escape') {
+        e.preventDefault();
+        e.stopPropagation();
+        onClose();
+      }
+      if (e.key === 'Enter' && focusedInput) {
+        e.preventDefault();
+        const cols = parseInt(inputCols, 10);
+        const rows = parseInt(inputRows, 10);
+        if (cols > 0 && rows > 0) {
+          onInsert(cols, rows);
+        }
+      }
+    };
+    document.addEventListener('keydown', handleKeyDown, true);
+    return () => document.removeEventListener('keydown', handleKeyDown, true);
+  }, [isOpen, onClose, onInsert, focusedInput, inputCols, inputRows]);
+  const handleCellClick = useCallback((col, row) => {
+    if (col > 0 && row > 0) {
+      onInsert(col, row);
+    }
+  }, [onInsert]);
+  const handleCellMouseEnter = useCallback((col_0, row_0) => {
+    setHoverCol(col_0);
+    setHoverRow(row_0);
+  }, []);
+  const handleGridMouseLeave = useCallback(() => {
+    setHoverCol(0);
+    setHoverRow(0);
+  }, []);
+  if (!isOpen || !position || !anchorElem) {
+    return null;
+  }
+  const cells = [];
+  for (let row_1 = 1; row_1 <= GRID_ROWS; row_1++) {
+    for (let col_1 = 1; col_1 <= GRID_COLUMNS; col_1++) {
+      const isInSelection = col_1 <= effectiveCols && row_1 <= effectiveRows;
+      const isHovered = col_1 <= hoverCol && row_1 <= hoverRow;
+      let className = 'table-grid-popup__cell';
+      if (isInSelection && isHovered) {
+        className += ' table-grid-popup__cell--hover';
+      } else if (isInSelection) {
+        className += ' table-grid-popup__cell--selected';
+      }
+      cells.push(/*#__PURE__*/_jsx("div", {
+        "aria-label": `${col_1} columns, ${row_1} rows`,
+        className: className,
+        onClick: () => handleCellClick(col_1, row_1),
+        onKeyDown: e_0 => {
+          if (e_0.key === 'Enter' || e_0.key === ' ') {
+            e_0.preventDefault();
+            handleCellClick(col_1, row_1);
+          }
+        },
+        onMouseEnter: () => handleCellMouseEnter(col_1, row_1),
+        role: "button",
+        tabIndex: -1
+      }, `${row_1}-${col_1}`));
+    }
+  }
+  const showTooltip = hoverCol > 0 && hoverRow > 0;
+  return /*#__PURE__*/createPortal(/*#__PURE__*/_jsxs(React.Fragment, {
+    children: [/*#__PURE__*/_jsx("div", {
+      className: "table-grid-popup__backdrop",
+      onClick: onClose
+    }), /*#__PURE__*/_jsx("div", {
+      className: "table-grid-popup",
+      ref: popupRef,
+      style: {
+        transform: `translate(${position.left}px, ${position.top}px)`
+      },
+      children: /*#__PURE__*/_jsxs("div", {
+        className: "table-grid-popup__content",
+        children: [/*#__PURE__*/_jsxs("div", {
+          className: "table-grid-popup__header",
+          children: [/*#__PURE__*/_jsxs("div", {
+            className: `table-grid-popup__input-group${focusedInput === 'cols' ? ' table-grid-popup__input-group--focused' : ''}`,
+            children: [/*#__PURE__*/_jsx("div", {
+              className: "table-grid-popup__input-icon",
+              children: /*#__PURE__*/_jsx(ColumnsIcon, {})
+            }), /*#__PURE__*/_jsx("input", {
+              "aria-label": "Columns",
+              className: "table-grid-popup__input",
+              min: 1,
+              onBlur: () => setFocusedInput(null),
+              onChange: e_1 => setInputCols(e_1.target.value),
+              onFocus: () => setFocusedInput('cols'),
+              placeholder: hoverCol > 0 ? String(hoverCol) : '5',
+              ref: colsInputRef,
+              type: "number",
+              value: inputCols
+            })]
+          }), /*#__PURE__*/_jsx("span", {
+            className: "table-grid-popup__separator",
+            children: "×"
+          }), /*#__PURE__*/_jsxs("div", {
+            className: `table-grid-popup__input-group${focusedInput === 'rows' ? ' table-grid-popup__input-group--focused' : ''}`,
+            children: [/*#__PURE__*/_jsx("div", {
+              className: "table-grid-popup__input-icon",
+              children: /*#__PURE__*/_jsx(RowsIcon, {})
+            }), /*#__PURE__*/_jsx("input", {
+              "aria-label": "Rows",
+              className: "table-grid-popup__input",
+              min: 1,
+              onBlur: () => setFocusedInput(null),
+              onChange: e_2 => setInputRows(e_2.target.value),
+              onFocus: () => setFocusedInput('rows'),
+              placeholder: hoverRow > 0 ? String(hoverRow) : '5',
+              ref: rowsInputRef,
+              type: "number",
+              value: inputRows
+            })]
+          })]
+        }), /*#__PURE__*/_jsxs("div", {
+          className: "table-grid-popup__grid",
+          onMouseLeave: handleGridMouseLeave,
+          children: [cells, showTooltip && /*#__PURE__*/_jsxs("div", {
+            className: "table-grid-popup__tooltip",
+            style: {
+              left: `calc(${(hoverCol - 0.5) / GRID_COLUMNS * 100}%)`,
+              top: `calc(${(hoverRow - 1) / GRID_ROWS * 100}%)`
+            },
+            children: [effectiveCols, " × ", effectiveRows]
+          })]
+        })]
+      })
+    })]
+  }), anchorElem);
+}
+//# sourceMappingURL=index.js.map