npm - @payloadcms/richtext-lexical - Versions diffs - 3.0.0-beta.7 → 3.0.0-beta.71 - Mend

@payloadcms/richtext-lexical 3.0.0-beta.7 → 3.0.0-beta.71

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2293) hide show

package/dist/features/experimental_table/plugins/TableActionMenuPlugin/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../../src/features/experimental_table/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 TableCellHeaderStates,\n TableCellNode,\n getTableObserverFromTableElement,\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 { invariant } from '../../../../lexical/utils/invariant.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\n let expectedColumns = 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 invariant($isTableRowNode(row), 'Expected CellNode to have a RowNode parent')\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(TableCellNode, (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 }, [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: TableCellNode | null = 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<TableCellNode | null>(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"],"names":["useLexicalComposerContext","useLexicalEditable","$deleteTableColumn__EXPERIMENTAL","$deleteTableRow__EXPERIMENTAL","$getNodeTriplet","$getTableCellNodeFromLexicalNode","$getTableColumnIndexFromTableCellNode","$getTableNodeFromLexicalNodeOrThrow","$getTableRowIndexFromTableCellNode","$insertTableColumn__EXPERIMENTAL","$insertTableRow__EXPERIMENTAL","$isTableCellNode","$isTableRowNode","$isTableSelection","$unmergeCell","TableCellHeaderStates","TableCellNode","getTableObserverFromTableElement","useScrollInfo","$createParagraphNode","$getRoot","$getSelection","$isElementNode","$isParagraphNode","$isRangeSelection","$isTextNode","React","useCallback","useEffect","useRef","useState","createPortal","MeatballsIcon","invariant","computeSelectionCount","selection","selectionShape","getShape","columns","toX","fromX","rows","toY","fromY","isTableSelectionRectangular","nodes","getNodes","currentRows","currentRow","expectedColumns","currentColumns","i","length","node","row","getParentOrThrow","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","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","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","button","className","data-test-id","onClick","type","div","e","stopPropagation","ref","Fragment","hr","span","__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"],"mappings":"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"}

package/dist/features/experimental_table/plugins/TableCellResizerPlugin/index.d.ts ADDED Viewed

@@ -0,0 +1,4 @@
+import type { PluginComponent } from '../../../typesClient.js';
+import './index.scss';
+export declare const TableCellResizerPlugin: PluginComponent;
+//# sourceMappingURL=index.d.ts.map

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

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/experimental_table/plugins/TableCellResizerPlugin/index.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAE,eAAe,EAA6B,MAAM,yBAAyB,CAAA;AAEzF,OAAO,cAAc,CAAA;AAmXrB,eAAO,MAAM,sBAAsB,EAAE,eAQpC,CAAA"}

package/dist/features/experimental_table/plugins/TableCellResizerPlugin/index.js ADDED Viewed

@@ -0,0 +1,322 @@
+'use client';
+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 { calculateZoomLevel } from '@lexical/utils';
+import { $getNearestNodeFromDOMNode } from 'lexical';
+import * as React from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+const MIN_ROW_HEIGHT = 33;
+const MIN_COLUMN_WIDTH = 50;
+function TableCellResizer({ editor }) {
+    const targetRef = useRef(null);
+    const resizerRef = useRef(null);
+    const tableRectRef = useRef(null);
+    const mouseStartPosRef = useRef(null);
+    const [mouseCurrentPos, updateMouseCurrentPos] = useState(null);
+    const [activeCell, updateActiveCell] = useState(null);
+    const [isMouseDown, updateIsMouseDown] = useState(false);
+    const [draggingDirection, updateDraggingDirection] = useState(null);
+    const resetState = useCallback(()=>{
+        updateActiveCell(null);
+        targetRef.current = null;
+        updateDraggingDirection(null);
+        mouseStartPosRef.current = null;
+        tableRectRef.current = null;
+    }, []);
+    const isMouseDownOnEvent = (event)=>{
+        return (event.buttons & 1) === 1;
+    };
+    useEffect(()=>{
+        const onMouseMove = (event)=>{
+            setTimeout(()=>{
+                const target = event.target;
+                if (draggingDirection) {
+                    updateMouseCurrentPos({
+                        x: event.clientX,
+                        y: event.clientY
+                    });
+                    return;
+                }
+                updateIsMouseDown(isMouseDownOnEvent(event));
+                if (resizerRef.current && resizerRef.current.contains(target)) {
+                    return;
+                }
+                if (targetRef.current !== target) {
+                    targetRef.current = target;
+                    const cell = getDOMCellFromTarget(target);
+                    if (cell && activeCell !== cell) {
+                        editor.update(()=>{
+                            const tableCellNode = $getNearestNodeFromDOMNode(cell.elem);
+                            if (!tableCellNode) {
+                                throw new Error('TableCellResizer: Table cell node not found.');
+                            }
+                            const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
+                            const tableElement = editor.getElementByKey(tableNode.getKey());
+                            if (!tableElement) {
+                                throw new Error('TableCellResizer: Table element not found.');
+                            }
+                            targetRef.current = target;
+                            tableRectRef.current = tableElement.getBoundingClientRect();
+                            updateActiveCell(cell);
+                        });
+                    } else if (cell == null) {
+                        resetState();
+                    }
+                }
+            }, 0);
+        };
+        const onMouseDown = (event)=>{
+            setTimeout(()=>{
+                updateIsMouseDown(true);
+            }, 0);
+        };
+        const onMouseUp = (event)=>{
+            setTimeout(()=>{
+                updateIsMouseDown(false);
+            }, 0);
+        };
+        document.addEventListener('mousemove', onMouseMove);
+        document.addEventListener('mousedown', onMouseDown);
+        document.addEventListener('mouseup', onMouseUp);
+        return ()=>{
+            document.removeEventListener('mousemove', onMouseMove);
+            document.removeEventListener('mousedown', onMouseDown);
+            document.removeEventListener('mouseup', onMouseUp);
+        };
+    }, [
+        activeCell,
+        draggingDirection,
+        editor,
+        resetState
+    ]);
+    const isHeightChanging = (direction)=>{
+        if (direction === 'bottom') {
+            return true;
+        }
+        return false;
+    };
+    const updateRowHeight = useCallback((heightChange)=>{
+        if (!activeCell) {
+            throw new Error('TableCellResizer: Expected active cell.');
+        }
+        editor.update(()=>{
+            const tableCellNode = $getNearestNodeFromDOMNode(activeCell.elem);
+            if (!$isTableCellNode(tableCellNode)) {
+                throw new Error('TableCellResizer: Table cell node not found.');
+            }
+            const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
+            const tableRowIndex = $getTableRowIndexFromTableCellNode(tableCellNode);
+            const tableRows = tableNode.getChildren();
+            if (tableRowIndex >= tableRows.length || tableRowIndex < 0) {
+                throw new Error('Expected table cell to be inside of table row.');
+            }
+            const tableRow = tableRows[tableRowIndex];
+            if (!$isTableRowNode(tableRow)) {
+                throw new Error('Expected table row');
+            }
+            let height = tableRow.getHeight();
+            if (height === undefined) {
+                const rowCells = tableRow.getChildren();
+                height = Math.min(...rowCells.map((cell)=>getCellNodeHeight(cell, editor) ?? Infinity));
+            }
+            const newHeight = Math.max(height + heightChange, MIN_ROW_HEIGHT);
+            tableRow.setHeight(newHeight);
+        }, {
+            tag: 'skip-scroll-into-view'
+        });
+    }, [
+        activeCell,
+        editor
+    ]);
+    const getCellNodeWidth = (cell, activeEditor)=>{
+        const width = cell.getWidth();
+        if (width !== undefined) {
+            return width;
+        }
+        const domCellNode = activeEditor.getElementByKey(cell.getKey());
+        if (domCellNode == null) {
+            return undefined;
+        }
+        const computedStyle = getComputedStyle(domCellNode);
+        return domCellNode.clientWidth - parseFloat(computedStyle.paddingLeft) - parseFloat(computedStyle.paddingRight);
+    };
+    const getCellNodeHeight = (cell, activeEditor)=>{
+        const domCellNode = activeEditor.getElementByKey(cell.getKey());
+        return domCellNode?.clientHeight;
+    };
+    const getCellColumnIndex = (tableCellNode, tableMap)=>{
+        for(let row = 0; row < tableMap.length; row++){
+            for(let column = 0; column < tableMap[row].length; column++){
+                if (tableMap[row][column].cell === tableCellNode) {
+                    return column;
+                }
+            }
+        }
+    };
+    const updateColumnWidth = useCallback((widthChange)=>{
+        if (!activeCell) {
+            throw new Error('TableCellResizer: Expected active cell.');
+        }
+        editor.update(()=>{
+            const tableCellNode = $getNearestNodeFromDOMNode(activeCell.elem);
+            if (!$isTableCellNode(tableCellNode)) {
+                throw new Error('TableCellResizer: Table cell node not found.');
+            }
+            const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
+            const [tableMap] = $computeTableMapSkipCellCheck(tableNode, null, null);
+            const columnIndex = getCellColumnIndex(tableCellNode, tableMap);
+            if (columnIndex === undefined) {
+                throw new Error('TableCellResizer: Table column not found.');
+            }
+            for(let row = 0; row < tableMap.length; row++){
+                const cell = tableMap[row][columnIndex];
+                if (cell.startRow === row && (columnIndex === tableMap[row].length - 1 || tableMap[row][columnIndex].cell !== tableMap[row][columnIndex + 1].cell)) {
+                    const width = getCellNodeWidth(cell.cell, editor);
+                    if (width === undefined) {
+                        continue;
+                    }
+                    const newWidth = Math.max(width + widthChange, MIN_COLUMN_WIDTH);
+                    cell.cell.setWidth(newWidth);
+                }
+            }
+        }, {
+            tag: 'skip-scroll-into-view'
+        });
+    }, [
+        activeCell,
+        editor
+    ]);
+    const mouseUpHandler = useCallback((direction)=>{
+        const handler = (event)=>{
+            event.preventDefault();
+            event.stopPropagation();
+            if (!activeCell) {
+                throw new Error('TableCellResizer: Expected active cell.');
+            }
+            if (mouseStartPosRef.current) {
+                const { x, y } = mouseStartPosRef.current;
+                if (activeCell === null) {
+                    return;
+                }
+                const zoom = calculateZoomLevel(event.target);
+                if (isHeightChanging(direction)) {
+                    const heightChange = (event.clientY - y) / zoom;
+                    updateRowHeight(heightChange);
+                } else {
+                    const widthChange = (event.clientX - x) / zoom;
+                    updateColumnWidth(widthChange);
+                }
+                resetState();
+                document.removeEventListener('mouseup', handler);
+            }
+        };
+        return handler;
+    }, [
+        activeCell,
+        resetState,
+        updateColumnWidth,
+        updateRowHeight
+    ]);
+    const toggleResize = useCallback((direction)=>(event)=>{
+            event.preventDefault();
+            event.stopPropagation();
+            if (!activeCell) {
+                throw new Error('TableCellResizer: Expected active cell.');
+            }
+            mouseStartPosRef.current = {
+                x: event.clientX,
+                y: event.clientY
+            };
+            updateMouseCurrentPos(mouseStartPosRef.current);
+            updateDraggingDirection(direction);
+            document.addEventListener('mouseup', mouseUpHandler(direction));
+        }, [
+        activeCell,
+        mouseUpHandler
+    ]);
+    const getResizers = useCallback(()=>{
+        if (activeCell) {
+            const { height, left, top, width } = activeCell.elem.getBoundingClientRect();
+            const zoom = calculateZoomLevel(activeCell.elem);
+            const zoneWidth = 10 // Pixel width of the zone where you can drag the edge
+            ;
+            const styles = {
+                bottom: {
+                    backgroundColor: 'none',
+                    cursor: 'row-resize',
+                    height: `${zoneWidth}px`,
+                    left: `${window.pageXOffset + left}px`,
+                    top: `${window.pageYOffset + top + height - zoneWidth / 2}px`,
+                    width: `${width}px`
+                },
+                right: {
+                    backgroundColor: 'none',
+                    cursor: 'col-resize',
+                    height: `${height}px`,
+                    left: `${window.pageXOffset + left + width - zoneWidth / 2}px`,
+                    top: `${window.pageYOffset + top}px`,
+                    width: `${zoneWidth}px`
+                }
+            };
+            const tableRect = tableRectRef.current;
+            if (draggingDirection && mouseCurrentPos && tableRect) {
+                if (isHeightChanging(draggingDirection)) {
+                    styles[draggingDirection].left = `${window.pageXOffset + tableRect.left}px`;
+                    styles[draggingDirection].top = `${window.pageYOffset + mouseCurrentPos.y / zoom}px`;
+                    styles[draggingDirection].height = '3px';
+                    styles[draggingDirection].width = `${tableRect.width}px`;
+                } else {
+                    styles[draggingDirection].top = `${window.pageYOffset + tableRect.top}px`;
+                    styles[draggingDirection].left = `${window.pageXOffset + mouseCurrentPos.x / zoom}px`;
+                    styles[draggingDirection].width = '3px';
+                    styles[draggingDirection].height = `${tableRect.height}px`;
+                }
+                styles[draggingDirection].backgroundColor = '#adf';
+            }
+            return styles;
+        }
+        return {
+            bottom: null,
+            left: null,
+            right: null,
+            top: null
+        };
+    }, [
+        activeCell,
+        draggingDirection,
+        mouseCurrentPos
+    ]);
+    const resizerStyles = getResizers();
+    return /*#__PURE__*/ _jsx("div", {
+        ref: resizerRef,
+        children: activeCell != null && !isMouseDown && /*#__PURE__*/ _jsxs(React.Fragment, {
+            children: [
+                /*#__PURE__*/ _jsx("div", {
+                    className: "TableCellResizer__resizer TableCellResizer__ui",
+                    onMouseDown: toggleResize('right'),
+                    style: resizerStyles.right || undefined
+                }),
+                /*#__PURE__*/ _jsx("div", {
+                    className: "TableCellResizer__resizer TableCellResizer__ui",
+                    onMouseDown: toggleResize('bottom'),
+                    style: resizerStyles.bottom || undefined
+                })
+            ]
+        })
+    });
+}
+export const TableCellResizerPlugin = ()=>{
+    const [editor] = useLexicalComposerContext();
+    const isEditable = useLexicalEditable();
+    return useMemo(()=>isEditable ? /*#__PURE__*/ createPortal(/*#__PURE__*/ _jsx(TableCellResizer, {
+            editor: editor
+        }), document.body) : null, [
+        editor,
+        isEditable
+    ]);
+};
+//# sourceMappingURL=index.js.map

package/dist/features/experimental_table/plugins/TableCellResizerPlugin/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../../src/features/experimental_table/plugins/TableCellResizerPlugin/index.tsx"],"sourcesContent":["'use client'\n\nimport type { TableCellNode, TableDOMCell, TableMapType, TableMapValueType } from '@lexical/table'\nimport type { LexicalEditor } 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} from '@lexical/table'\nimport { calculateZoomLevel } from '@lexical/utils'\nimport { $getNearestNodeFromDOMNode } from 'lexical'\nimport * as React from 'react'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\n\nimport type { PluginComponent, PluginComponentWithAnchor } from '../../../typesClient.js'\n\nimport './index.scss'\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 = 50\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\n const mouseStartPosRef = useRef<MousePosition | null>(null)\n const [mouseCurrentPos, updateMouseCurrentPos] = useState<MousePosition | null>(null)\n\n const [activeCell, updateActiveCell] = useState<TableDOMCell | null>(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 onMouseMove = (event: MouseEvent) => {\n setTimeout(() => {\n const target = event.target\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 as Node)) {\n return\n }\n\n if (targetRef.current !== target) {\n targetRef.current = target as HTMLElement\n const cell = getDOMCellFromTarget(target as HTMLElement)\n\n if (cell && activeCell !== cell) {\n editor.update(() => {\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 = editor.getElementByKey(tableNode.getKey())\n\n if (!tableElement) {\n throw new Error('TableCellResizer: Table element not found.')\n }\n\n targetRef.current = target as HTMLElement\n tableRectRef.current = tableElement.getBoundingClientRect()\n updateActiveCell(cell)\n })\n } else if (cell == null) {\n resetState()\n }\n }\n }, 0)\n }\n\n const onMouseDown = (event: MouseEvent) => {\n setTimeout(() => {\n updateIsMouseDown(true)\n }, 0)\n }\n\n const onMouseUp = (event: MouseEvent) => {\n setTimeout(() => {\n updateIsMouseDown(false)\n }, 0)\n }\n\n document.addEventListener('mousemove', onMouseMove)\n document.addEventListener('mousedown', onMouseDown)\n document.addEventListener('mouseup', onMouseUp)\n\n return () => {\n document.removeEventListener('mousemove', onMouseMove)\n document.removeEventListener('mousedown', onMouseDown)\n document.removeEventListener('mouseup', onMouseUp)\n }\n }, [activeCell, draggingDirection, editor, 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 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 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' },\n )\n },\n [activeCell, editor],\n )\n\n const getCellNodeWidth = (\n cell: TableCellNode,\n activeEditor: LexicalEditor,\n ): number | undefined => {\n const width = cell.getWidth()\n if (width !== undefined) {\n return width\n }\n\n const domCellNode = activeEditor.getElementByKey(cell.getKey())\n if (domCellNode == null) {\n return undefined\n }\n const computedStyle = getComputedStyle(domCellNode)\n return (\n domCellNode.clientWidth -\n parseFloat(computedStyle.paddingLeft) -\n parseFloat(computedStyle.paddingRight)\n )\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 for (let row = 0; row < tableMap.length; row++) {\n for (let column = 0; column < tableMap[row].length; column++) {\n if (tableMap[row][column].cell === tableCellNode) {\n return column\n }\n }\n }\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 for (let row = 0; row < tableMap.length; row++) {\n const cell: TableMapValueType = tableMap[row][columnIndex]\n if (\n cell.startRow === row &&\n (columnIndex === tableMap[row].length - 1 ||\n tableMap[row][columnIndex].cell !== tableMap[row][columnIndex + 1].cell)\n ) {\n const width = getCellNodeWidth(cell.cell, editor)\n if (width === undefined) {\n continue\n }\n const newWidth = Math.max(width + widthChange, MIN_COLUMN_WIDTH)\n cell.cell.setWidth(newWidth)\n }\n }\n },\n { tag: 'skip-scroll-into-view' },\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 getResizers = useCallback(() => {\n if (activeCell) {\n const { height, left, top, width } = activeCell.elem.getBoundingClientRect()\n const zoom = calculateZoomLevel(activeCell.elem)\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: `${window.pageXOffset + left}px`,\n top: `${window.pageYOffset + 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: `${window.pageXOffset + left + width - zoneWidth / 2}px`,\n top: `${window.pageYOffset + 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 = `${window.pageXOffset + tableRect.left}px`\n styles[draggingDirection].top = `${window.pageYOffset + mouseCurrentPos.y / zoom}px`\n styles[draggingDirection].height = '3px'\n styles[draggingDirection].width = `${tableRect.width}px`\n } else {\n styles[draggingDirection].top = `${window.pageYOffset + tableRect.top}px`\n styles[draggingDirection].left = `${window.pageXOffset + 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 return styles\n }\n\n return {\n bottom: null,\n left: null,\n right: null,\n top: null,\n }\n }, [activeCell, draggingDirection, mouseCurrentPos])\n\n const resizerStyles = getResizers()\n\n return (\n <div ref={resizerRef}>\n {activeCell != null && !isMouseDown && (\n <React.Fragment>\n <div\n className=\"TableCellResizer__resizer TableCellResizer__ui\"\n onMouseDown={toggleResize('right')}\n style={resizerStyles.right || undefined}\n />\n <div\n className=\"TableCellResizer__resizer 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\n return useMemo(\n () => (isEditable ? createPortal(<TableCellResizer editor={editor} />, document.body) : null),\n [editor, isEditable],\n )\n}\n"],"names":["useLexicalComposerContext","useLexicalEditable","$computeTableMapSkipCellCheck","$getTableNodeFromLexicalNodeOrThrow","$getTableRowIndexFromTableCellNode","$isTableCellNode","$isTableRowNode","getDOMCellFromTarget","calculateZoomLevel","$getNearestNodeFromDOMNode","React","useCallback","useEffect","useMemo","useRef","useState","createPortal","MIN_ROW_HEIGHT","MIN_COLUMN_WIDTH","TableCellResizer","editor","targetRef","resizerRef","tableRectRef","mouseStartPosRef","mouseCurrentPos","updateMouseCurrentPos","activeCell","updateActiveCell","isMouseDown","updateIsMouseDown","draggingDirection","updateDraggingDirection","resetState","current","isMouseDownOnEvent","event","buttons","onMouseMove","setTimeout","target","x","clientX","y","clientY","contains","cell","update","tableCellNode","elem","Error","tableNode","tableElement","getElementByKey","getKey","getBoundingClientRect","onMouseDown","onMouseUp","document","addEventListener","removeEventListener","isHeightChanging","direction","updateRowHeight","heightChange","tableRowIndex","tableRows","getChildren","length","tableRow","height","getHeight","undefined","rowCells","Math","min","map","getCellNodeHeight","Infinity","newHeight","max","setHeight","tag","getCellNodeWidth","activeEditor","width","getWidth","domCellNode","computedStyle","getComputedStyle","clientWidth","parseFloat","paddingLeft","paddingRight","clientHeight","getCellColumnIndex","tableMap","row","column","updateColumnWidth","widthChange","columnIndex","startRow","newWidth","setWidth","mouseUpHandler","handler","preventDefault","stopPropagation","zoom","toggleResize","getResizers","left","top","zoneWidth","styles","bottom","backgroundColor","cursor","window","pageXOffset","pageYOffset","right","tableRect","resizerStyles","div","ref","Fragment","className","style","TableCellResizerPlugin","isEditable","body"],"mappings":"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"}

package/dist/features/experimental_table/plugins/TablePlugin/index.d.ts ADDED Viewed

@@ -0,0 +1,24 @@
+import type { EditorThemeClasses, Klass, LexicalCommand, LexicalEditor, LexicalNode } from 'lexical';
+import type { JSX } from 'react';
+import * as React from 'react';
+import type { PluginComponent } from '../../../typesClient.js';
+import './index.scss';
+export type CellContextShape = {
+    cellEditorConfig: CellEditorConfig | null;
+    cellEditorPlugins: Array<JSX.Element> | JSX.Element | null;
+    set: (cellEditorConfig: CellEditorConfig | null, cellEditorPlugins: Array<JSX.Element> | JSX.Element | null) => void;
+};
+export type CellEditorConfig = Readonly<{
+    namespace: string;
+    nodes?: ReadonlyArray<Klass<LexicalNode>>;
+    onError: (error: Error, editor: LexicalEditor) => void;
+    readOnly?: boolean;
+    theme?: EditorThemeClasses;
+}>;
+export declare const OPEN_TABLE_DRAWER_COMMAND: LexicalCommand<{}>;
+export declare const CellContext: React.Context<CellContextShape>;
+export declare function TableContext({ children }: {
+    children: JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;
+export declare const TablePlugin: PluginComponent;
+//# sourceMappingURL=index.d.ts.map

package/dist/features/experimental_table/plugins/TablePlugin/index.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/experimental_table/plugins/TablePlugin/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,kBAAkB,EAClB,KAAK,EACL,cAAc,EACd,aAAa,EACb,WAAW,EAEZ,MAAM,SAAS,CAAA;AAChB,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAShC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AAI9D,OAAO,cAAc,CAAA;AAErB,MAAM,MAAM,gBAAgB,GAAG;IAC7B,gBAAgB,EAAE,gBAAgB,GAAG,IAAI,CAAA;IACzC,iBAAiB,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAAA;IAC1D,GAAG,EAAE,CACH,gBAAgB,EAAE,gBAAgB,GAAG,IAAI,EACzC,iBAAiB,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,KACvD,IAAI,CAAA;CACV,CAAA;AAED,MAAM,MAAM,gBAAgB,GAAG,QAAQ,CAAC;IACtC,SAAS,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,aAAa,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAA;IACzC,OAAO,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,aAAa,KAAK,IAAI,CAAA;IACtD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,kBAAkB,CAAA;CAC3B,CAAC,CAAA;AAEF,eAAO,MAAM,yBAAyB,EAAE,cAAc,CAAC,EAAE,CAExD,CAAA;AAED,eAAO,MAAM,WAAW,iCAMtB,CAAA;AAGF,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAA;CAAE,2CAwBnE;AAED,eAAO,MAAM,WAAW,EAAE,eAwDzB,CAAA"}

package/dist/features/experimental_table/plugins/TablePlugin/index.js ADDED Viewed

@@ -0,0 +1,98 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { TablePlugin as LexicalReactTablePlugin } from '@lexical/react/LexicalTablePlugin';
+import { INSERT_TABLE_COMMAND, TableNode } from '@lexical/table';
+import { mergeRegister } from '@lexical/utils';
+import { useModal } from '@payloadcms/ui';
+import { $getSelection, $isRangeSelection, COMMAND_PRIORITY_EDITOR, createCommand } from 'lexical';
+import { createContext, useContext, useEffect, useMemo, useState } from 'react';
+import * as React from 'react';
+import { invariant } from '../../../../lexical/utils/invariant.js';
+import { FieldsDrawer } from '../../../../utilities/fieldsDrawer/Drawer.js';
+export const OPEN_TABLE_DRAWER_COMMAND = createCommand('OPEN_EMBED_DRAWER_COMMAND');
+export const CellContext = /*#__PURE__*/ createContext({
+    cellEditorConfig: null,
+    cellEditorPlugins: null,
+    set: ()=>{
+    // Empty
+    }
+});
+const drawerSlug = 'lexical-table-create';
+export function TableContext({ children }) {
+    const [contextValue, setContextValue] = useState({
+        cellEditorConfig: null,
+        cellEditorPlugins: null
+    });
+    return /*#__PURE__*/ _jsx(CellContext.Provider, {
+        value: useMemo(()=>({
+                cellEditorConfig: contextValue.cellEditorConfig,
+                cellEditorPlugins: contextValue.cellEditorPlugins,
+                set: (cellEditorConfig, cellEditorPlugins)=>{
+                    setContextValue({
+                        cellEditorConfig,
+                        cellEditorPlugins
+                    });
+                }
+            }), [
+            contextValue.cellEditorConfig,
+            contextValue.cellEditorPlugins
+        ]),
+        children: children
+    });
+}
+export const TablePlugin = ()=>{
+    const [editor] = useLexicalComposerContext();
+    const cellContext = useContext(CellContext);
+    const { closeModal, toggleModal } = useModal();
+    useEffect(()=>{
+        if (!editor.hasNodes([
+            TableNode
+        ])) {
+            invariant(false, 'TablePlugin: TableNode is not registered on editor');
+        }
+        return mergeRegister(editor.registerCommand(OPEN_TABLE_DRAWER_COMMAND, ()=>{
+            let rangeSelection = null;
+            editor.getEditorState().read(()=>{
+                const selection = $getSelection();
+                if ($isRangeSelection(selection)) {
+                    rangeSelection = selection;
+                }
+            });
+            if (rangeSelection) {
+                toggleModal(drawerSlug);
+            }
+            return true;
+        }, COMMAND_PRIORITY_EDITOR));
+    }, [
+        cellContext,
+        editor,
+        toggleModal
+    ]);
+    return /*#__PURE__*/ _jsxs(React.Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx(FieldsDrawer, {
+                drawerSlug: drawerSlug,
+                drawerTitle: "Create Table",
+                featureKey: "experimental_table",
+                handleDrawerSubmit: (_fields, data)=>{
+                    closeModal(drawerSlug);
+                    if (!data.columns || !data.rows) {
+                        return;
+                    }
+                    editor.dispatchCommand(INSERT_TABLE_COMMAND, {
+                        columns: String(data.columns),
+                        rows: String(data.rows)
+                    });
+                },
+                schemaPathSuffix: "fields"
+            }),
+            /*#__PURE__*/ _jsx(LexicalReactTablePlugin, {
+                hasCellBackgroundColor: false,
+                hasCellMerge: true
+            })
+        ]
+    });
+};
+//# sourceMappingURL=index.js.map

package/dist/features/experimental_table/plugins/TablePlugin/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../../src/features/experimental_table/plugins/TablePlugin/index.tsx"],"sourcesContent":["'use client'\n\nimport type {\n EditorThemeClasses,\n Klass,\n LexicalCommand,\n LexicalEditor,\n LexicalNode,\n RangeSelection,\n} from 'lexical'\nimport type { JSX } from 'react'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { TablePlugin as LexicalReactTablePlugin } from '@lexical/react/LexicalTablePlugin'\nimport { INSERT_TABLE_COMMAND, TableNode } from '@lexical/table'\nimport { mergeRegister } from '@lexical/utils'\nimport { useModal } from '@payloadcms/ui'\nimport { $getSelection, $isRangeSelection, COMMAND_PRIORITY_EDITOR, createCommand } from 'lexical'\nimport { createContext, useContext, useEffect, useMemo, useState } from 'react'\nimport * as React from 'react'\n\nimport type { PluginComponent } from '../../../typesClient.js'\n\nimport { invariant } from '../../../../lexical/utils/invariant.js'\nimport { FieldsDrawer } from '../../../../utilities/fieldsDrawer/Drawer.js'\nimport './index.scss'\n\nexport type CellContextShape = {\n cellEditorConfig: CellEditorConfig | null\n cellEditorPlugins: Array<JSX.Element> | JSX.Element | null\n set: (\n cellEditorConfig: CellEditorConfig | null,\n cellEditorPlugins: Array<JSX.Element> | JSX.Element | null,\n ) => void\n}\n\nexport type CellEditorConfig = Readonly<{\n namespace: string\n nodes?: ReadonlyArray<Klass<LexicalNode>>\n onError: (error: Error, editor: LexicalEditor) => void\n readOnly?: boolean\n theme?: EditorThemeClasses\n}>\n\nexport const OPEN_TABLE_DRAWER_COMMAND: LexicalCommand<{}> = createCommand(\n 'OPEN_EMBED_DRAWER_COMMAND',\n)\n\nexport const CellContext = createContext<CellContextShape>({\n cellEditorConfig: null,\n cellEditorPlugins: null,\n set: () => {\n // Empty\n },\n})\nconst drawerSlug = 'lexical-table-create'\n\nexport function TableContext({ children }: { children: JSX.Element }) {\n const [contextValue, setContextValue] = useState<{\n cellEditorConfig: CellEditorConfig | null\n cellEditorPlugins: Array<JSX.Element> | JSX.Element | null\n }>({\n cellEditorConfig: null,\n cellEditorPlugins: null,\n })\n return (\n <CellContext.Provider\n value={useMemo(\n () => ({\n cellEditorConfig: contextValue.cellEditorConfig,\n cellEditorPlugins: contextValue.cellEditorPlugins,\n set: (cellEditorConfig, cellEditorPlugins) => {\n setContextValue({ cellEditorConfig, cellEditorPlugins })\n },\n }),\n [contextValue.cellEditorConfig, contextValue.cellEditorPlugins],\n )}\n >\n {children}\n </CellContext.Provider>\n )\n}\n\nexport const TablePlugin: PluginComponent = () => {\n const [editor] = useLexicalComposerContext()\n const cellContext = useContext(CellContext)\n const { closeModal, toggleModal } = useModal()\n\n useEffect(() => {\n if (!editor.hasNodes([TableNode])) {\n invariant(false, 'TablePlugin: TableNode is not registered on editor')\n }\n\n return mergeRegister(\n editor.registerCommand(\n OPEN_TABLE_DRAWER_COMMAND,\n () => {\n let rangeSelection: RangeSelection | null = null\n\n editor.getEditorState().read(() => {\n const selection = $getSelection()\n if ($isRangeSelection(selection)) {\n rangeSelection = selection\n }\n })\n\n if (rangeSelection) {\n toggleModal(drawerSlug)\n }\n return true\n },\n COMMAND_PRIORITY_EDITOR,\n ),\n )\n }, [cellContext, editor, toggleModal])\n\n return (\n <React.Fragment>\n <FieldsDrawer\n drawerSlug={drawerSlug}\n drawerTitle=\"Create Table\"\n featureKey=\"experimental_table\"\n handleDrawerSubmit={(_fields, data) => {\n closeModal(drawerSlug)\n\n if (!data.columns || !data.rows) {\n return\n }\n\n editor.dispatchCommand(INSERT_TABLE_COMMAND, {\n columns: String(data.columns),\n rows: String(data.rows),\n })\n }}\n schemaPathSuffix=\"fields\"\n />\n <LexicalReactTablePlugin hasCellBackgroundColor={false} hasCellMerge />\n </React.Fragment>\n )\n}\n"],"names":["useLexicalComposerContext","TablePlugin","LexicalReactTablePlugin","INSERT_TABLE_COMMAND","TableNode","mergeRegister","useModal","$getSelection","$isRangeSelection","COMMAND_PRIORITY_EDITOR","createCommand","createContext","useContext","useEffect","useMemo","useState","React","invariant","FieldsDrawer","OPEN_TABLE_DRAWER_COMMAND","CellContext","cellEditorConfig","cellEditorPlugins","set","drawerSlug","TableContext","children","contextValue","setContextValue","Provider","value","editor","cellContext","closeModal","toggleModal","hasNodes","registerCommand","rangeSelection","getEditorState","read","selection","Fragment","drawerTitle","featureKey","handleDrawerSubmit","_fields","data","columns","rows","dispatchCommand","String","schemaPathSuffix","hasCellBackgroundColor","hasCellMerge"],"mappings":"AAAA;;AAYA,SAASA,yBAAyB,QAAQ,wCAAuC;AACjF,SAASC,eAAeC,uBAAuB,QAAQ,oCAAmC;AAC1F,SAASC,oBAAoB,EAAEC,SAAS,QAAQ,iBAAgB;AAChE,SAASC,aAAa,QAAQ,iBAAgB;AAC9C,SAASC,QAAQ,QAAQ,iBAAgB;AACzC,SAASC,aAAa,EAAEC,iBAAiB,EAAEC,uBAAuB,EAAEC,aAAa,QAAQ,UAAS;AAClG,SAASC,aAAa,EAAEC,UAAU,EAAEC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,QAAO;AAC/E,YAAYC,WAAW,QAAO;AAI9B,SAASC,SAAS,QAAQ,yCAAwC;AAClE,SAASC,YAAY,QAAQ,+CAA8C;AAoB3E,OAAO,MAAMC,4BAAgDT,cAC3D,6BACD;AAED,OAAO,MAAMU,4BAAcT,cAAgC;IACzDU,kBAAkB;IAClBC,mBAAmB;IACnBC,KAAK;IACH,QAAQ;IACV;AACF,GAAE;AACF,MAAMC,aAAa;AAEnB,OAAO,SAASC,aAAa,EAAEC,QAAQ,EAA6B;IAClE,MAAM,CAACC,cAAcC,gBAAgB,GAAGb,SAGrC;QACDM,kBAAkB;QAClBC,mBAAmB;IACrB;IACA,qBACE,KAACF,YAAYS,QAAQ;QACnBC,OAAOhB,QACL,IAAO,CAAA;gBACLO,kBAAkBM,aAAaN,gBAAgB;gBAC/CC,mBAAmBK,aAAaL,iBAAiB;gBACjDC,KAAK,CAACF,kBAAkBC;oBACtBM,gBAAgB;wBAAEP;wBAAkBC;oBAAkB;gBACxD;YACF,CAAA,GACA;YAACK,aAAaN,gBAAgB;YAAEM,aAAaL,iBAAiB;SAAC;kBAGhEI;;AAGP;AAEA,OAAO,MAAMzB,cAA+B;IAC1C,MAAM,CAAC8B,OAAO,GAAG/B;IACjB,MAAMgC,cAAcpB,WAAWQ;IAC/B,MAAM,EAAEa,UAAU,EAAEC,WAAW,EAAE,GAAG5B;IAEpCO,UAAU;QACR,IAAI,CAACkB,OAAOI,QAAQ,CAAC;YAAC/B;SAAU,GAAG;YACjCa,UAAU,OAAO;QACnB;QAEA,OAAOZ,cACL0B,OAAOK,eAAe,CACpBjB,2BACA;YACE,IAAIkB,iBAAwC;YAE5CN,OAAOO,cAAc,GAAGC,IAAI,CAAC;gBAC3B,MAAMC,YAAYjC;gBAClB,IAAIC,kBAAkBgC,YAAY;oBAChCH,iBAAiBG;gBACnB;YACF;YAEA,IAAIH,gBAAgB;gBAClBH,YAAYV;YACd;YACA,OAAO;QACT,GACAf;IAGN,GAAG;QAACuB;QAAaD;QAAQG;KAAY;IAErC,qBACE,MAAClB,MAAMyB,QAAQ;;0BACb,KAACvB;gBACCM,YAAYA;gBACZkB,aAAY;gBACZC,YAAW;gBACXC,oBAAoB,CAACC,SAASC;oBAC5Bb,WAAWT;oBAEX,IAAI,CAACsB,KAAKC,OAAO,IAAI,CAACD,KAAKE,IAAI,EAAE;wBAC/B;oBACF;oBAEAjB,OAAOkB,eAAe,CAAC9C,sBAAsB;wBAC3C4C,SAASG,OAAOJ,KAAKC,OAAO;wBAC5BC,MAAME,OAAOJ,KAAKE,IAAI;oBACxB;gBACF;gBACAG,kBAAiB;;0BAEnB,KAACjD;gBAAwBkD,wBAAwB;gBAAOC,YAAY;;;;AAG1E,EAAC"}

package/dist/features/format/bold/feature.client.d.ts ADDED Viewed

@@ -0,0 +1,5 @@
+export declare const BoldFeatureClient: import("react").FC<{
+    featureKey: string;
+    order: number;
+}>;
+//# sourceMappingURL=feature.client.d.ts.map

package/dist/features/format/bold/feature.client.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"feature.client.d.ts","sourceRoot":"","sources":["../../../../src/features/format/bold/feature.client.tsx"],"names":[],"mappings":"AAkCA,eAAO,MAAM,iBAAiB;;;EAe5B,CAAA"}