@payloadcms/richtext-lexical 3.0.0-canary.95fcd13 → 3.0.0-canary.98cbdb9

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

@@ -0,0 +1,181 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { $getTableColumnIndexFromTableCellNode, $getTableRowIndexFromTableCellNode, $insertTableColumn__EXPERIMENTAL, $insertTableRow__EXPERIMENTAL, $isTableCellNode, $isTableNode, TableNode } from '@lexical/table';
+import { $findMatchingParent, mergeRegister } from '@lexical/utils';
+import { $getNearestNodeFromDOMNode } from 'lexical';
+import { useEffect, useRef, useState } from 'react';
+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;
+function TableHoverActionsContainer({ anchorElem }) {
+    const [editor] = useLexicalComposerContext();
+    const editorConfig = useEditorConfigContext();
+    const [isShownRow, setShownRow] = useState(false);
+    const [isShownColumn, setShownColumn] = useState(false);
+    const [shouldListenMouseMove, setShouldListenMouseMove] = useState(false);
+    const [position, setPosition] = useState({});
+    const codeSetRef = useRef(new Set());
+    const tableDOMNodeRef = useRef(null);
+    const debouncedOnMouseMove = useDebounce((event)=>{
+        const { isOutside, tableDOMNode } = getMouseInfo(event, editorConfig.editorConfig?.lexical);
+        if (isOutside) {
+            setShownRow(false);
+            setShownColumn(false);
+            return;
+        }
+        if (!tableDOMNode) {
+            return;
+        }
+        tableDOMNodeRef.current = tableDOMNode;
+        let hoveredRowNode = null;
+        let hoveredColumnNode = null;
+        let tableDOMElement = null;
+        editor.update(()=>{
+            const maybeTableCell = $getNearestNodeFromDOMNode(tableDOMNode);
+            if ($isTableCellNode(maybeTableCell)) {
+                const table = $findMatchingParent(maybeTableCell, (node)=>$isTableNode(node));
+                if (!$isTableNode(table)) {
+                    return;
+                }
+                tableDOMElement = editor.getElementByKey(table?.getKey());
+                if (tableDOMElement) {
+                    const rowCount = table.getChildrenSize();
+                    const colCount = // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
+                    table.getChildAtIndex(0)?.getChildrenSize();
+                    const rowIndex = $getTableRowIndexFromTableCellNode(maybeTableCell);
+                    const colIndex = $getTableColumnIndexFromTableCellNode(maybeTableCell);
+                    if (rowIndex === rowCount - 1) {
+                        hoveredRowNode = maybeTableCell;
+                    } else if (colIndex === colCount - 1) {
+                        hoveredColumnNode = maybeTableCell;
+                    }
+                }
+            }
+        });
+        if (tableDOMElement) {
+            const { bottom: tableElemBottom, height: tableElemHeight, right: tableElemRight, width: tableElemWidth, x: tableElemX, y: tableElemY } = tableDOMElement.getBoundingClientRect();
+            const { left: editorElemLeft, y: editorElemY } = anchorElem.getBoundingClientRect();
+            if (hoveredRowNode) {
+                setShownColumn(false);
+                setShownRow(true);
+                setPosition({
+                    height: BUTTON_WIDTH_PX,
+                    left: tableElemX - editorElemLeft,
+                    top: tableElemBottom - editorElemY + 5,
+                    width: tableElemWidth
+                });
+            } else if (hoveredColumnNode) {
+                setShownColumn(true);
+                setShownRow(false);
+                setPosition({
+                    height: tableElemHeight,
+                    left: tableElemRight - editorElemLeft + 5,
+                    top: tableElemY - editorElemY,
+                    width: BUTTON_WIDTH_PX
+                });
+            }
+        }
+    }, 50, 250);
+    useEffect(()=>{
+        if (!shouldListenMouseMove) {
+            return;
+        }
+        document.addEventListener('mousemove', debouncedOnMouseMove);
+        return ()=>{
+            setShownRow(false);
+            setShownColumn(false);
+            document.removeEventListener('mousemove', debouncedOnMouseMove);
+        };
+    }, [
+        shouldListenMouseMove,
+        debouncedOnMouseMove
+    ]);
+    useEffect(()=>{
+        return mergeRegister(editor.registerMutationListener(TableNode, (mutations)=>{
+            editor.getEditorState().read(()=>{
+                for (const [key, type] of mutations){
+                    switch(type){
+                        case 'created':
+                            codeSetRef.current.add(key);
+                            setShouldListenMouseMove(codeSetRef.current.size > 0);
+                            break;
+                        case 'destroyed':
+                            codeSetRef.current.delete(key);
+                            setShouldListenMouseMove(codeSetRef.current.size > 0);
+                            break;
+                        default:
+                            break;
+                    }
+                }
+            });
+        }, {
+            skipInitialization: false
+        }));
+    }, [
+        editor
+    ]);
+    const insertAction = (insertRow)=>{
+        editor.update(()=>{
+            if (tableDOMNodeRef.current) {
+                const maybeTableNode = $getNearestNodeFromDOMNode(tableDOMNodeRef.current);
+                maybeTableNode?.selectEnd();
+                if (insertRow) {
+                    $insertTableRow__EXPERIMENTAL();
+                    setShownRow(false);
+                } else {
+                    $insertTableColumn__EXPERIMENTAL();
+                    setShownColumn(false);
+                }
+            }
+        });
+    };
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            isShownRow && /*#__PURE__*/ _jsx("button", {
+                className: editorConfig.editorConfig.lexical.theme.tableAddRows,
+                onClick: ()=>insertAction(true),
+                style: {
+                    ...position
+                }
+            }),
+            isShownColumn && /*#__PURE__*/ _jsx("button", {
+                className: editorConfig.editorConfig.lexical.theme.tableAddColumns,
+                onClick: ()=>insertAction(false),
+                style: {
+                    ...position
+                }
+            })
+        ]
+    });
+}
+function getMouseInfo(event, editorConfig) {
+    const target = event.target;
+    if (target && target instanceof HTMLElement) {
+        const tableDOMNode = target.closest(`td.${editorConfig.theme.tableCell}, th.${editorConfig.theme.tableCell}`);
+        const isOutside = !(tableDOMNode || target.closest(`button.${editorConfig.theme.tableAddRows}`) || target.closest(`button.${editorConfig.theme.tableAddColumns}`) || target.closest(`div.${editorConfig.theme.tableCellResizer}`));
+        return {
+            isOutside,
+            tableDOMNode
+        };
+    } else {
+        return {
+            isOutside: true,
+            tableDOMNode: null
+        };
+    }
+}
+export function TableHoverActionsPlugin({ anchorElem = document.body }) {
+    return /*#__PURE__*/ createPortal(/*#__PURE__*/ _jsx(TableHoverActionsContainer, {
+        anchorElem: anchorElem
+    }), anchorElem);
+}
+
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/features/experimental_table/client/plugins/TableHoverActionsPlugin/index.tsx"],"sourcesContent":["/**\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\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 {\n  $getTableColumnIndexFromTableCellNode,\n  $getTableRowIndexFromTableCellNode,\n  $insertTableColumn__EXPERIMENTAL,\n  $insertTableRow__EXPERIMENTAL,\n  $isTableCellNode,\n  $isTableNode,\n  TableNode,\n} from '@lexical/table'\nimport { $findMatchingParent, mergeRegister } from '@lexical/utils'\nimport { $getNearestNodeFromDOMNode } from 'lexical'\nimport { useEffect, 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 = 20\n\nfunction TableHoverActionsContainer({ anchorElem }: { anchorElem: HTMLElement }): JSX.Element {\n  const [editor] = useLexicalComposerContext()\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 codeSetRef = useRef<Set<NodeKey>>(new Set())\n  const tableDOMNodeRef = 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      tableDOMNodeRef.current = tableDOMNode\n\n      let hoveredRowNode: TableCellNode | null = null\n      let hoveredColumnNode: TableCellNode | null = null\n      let tableDOMElement: HTMLElement | null = null\n\n      editor.update(() => {\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 = editor.getElementByKey(table?.getKey())\n\n          if (tableDOMElement) {\n            const rowCount = table.getChildrenSize()\n            const colCount =\n              // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion\n              ((table as TableNode).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\n      if (tableDOMElement) {\n        const {\n          bottom: tableElemBottom,\n          height: tableElemHeight,\n          right: tableElemRight,\n          width: tableElemWidth,\n          x: tableElemX,\n          y: tableElemY,\n        } = (tableDOMElement as HTMLTableElement).getBoundingClientRect()\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: tableElemX - editorElemLeft,\n            top: tableElemBottom - editorElemY + 5,\n            width: 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    },\n    50,\n    250,\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            for (const [key, type] of mutations) {\n              switch (type) {\n                case 'created':\n                  codeSetRef.current.add(key)\n                  setShouldListenMouseMove(codeSetRef.current.size > 0)\n                  break\n\n                case 'destroyed':\n                  codeSetRef.current.delete(key)\n                  setShouldListenMouseMove(codeSetRef.current.size > 0)\n                  break\n\n                default:\n                  break\n              }\n            }\n          })\n        },\n        { skipInitialization: false },\n      ),\n    )\n  }, [editor])\n\n  const insertAction = (insertRow: boolean) => {\n    editor.update(() => {\n      if (tableDOMNodeRef.current) {\n        const maybeTableNode = $getNearestNodeFromDOMNode(tableDOMNodeRef.current)\n        maybeTableNode?.selectEnd()\n        if (insertRow) {\n          $insertTableRow__EXPERIMENTAL()\n          setShownRow(false)\n        } else {\n          $insertTableColumn__EXPERIMENTAL()\n          setShownColumn(false)\n        }\n      }\n    })\n  }\n\n  return (\n    <>\n      {isShownRow && (\n        <button\n          className={editorConfig.editorConfig.lexical.theme.tableAddRows}\n          onClick={() => insertAction(true)}\n          style={{ ...position }}\n        />\n      )}\n      {isShownColumn && (\n        <button\n          className={editorConfig.editorConfig.lexical.theme.tableAddColumns}\n          onClick={() => insertAction(false)}\n          style={{ ...position }}\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 (target && target instanceof HTMLElement) {\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}): React.ReactPortal | null {\n  return createPortal(<TableHoverActionsContainer anchorElem={anchorElem} />, anchorElem)\n}\n"],"names":["useLexicalComposerContext","$getTableColumnIndexFromTableCellNode","$getTableRowIndexFromTableCellNode","$insertTableColumn__EXPERIMENTAL","$insertTableRow__EXPERIMENTAL","$isTableCellNode","$isTableNode","TableNode","$findMatchingParent","mergeRegister","$getNearestNodeFromDOMNode","useEffect","useRef","useState","React","createPortal","useEditorConfigContext","useDebounce","BUTTON_WIDTH_PX","TableHoverActionsContainer","anchorElem","editor","editorConfig","isShownRow","setShownRow","isShownColumn","setShownColumn","shouldListenMouseMove","setShouldListenMouseMove","position","setPosition","codeSetRef","Set","tableDOMNodeRef","debouncedOnMouseMove","event","isOutside","tableDOMNode","getMouseInfo","lexical","current","hoveredRowNode","hoveredColumnNode","tableDOMElement","update","maybeTableCell","table","node","getElementByKey","getKey","rowCount","getChildrenSize","colCount","getChildAtIndex","rowIndex","colIndex","bottom","tableElemBottom","height","tableElemHeight","right","tableElemRight","width","tableElemWidth","x","tableElemX","y","tableElemY","getBoundingClientRect","left","editorElemLeft","editorElemY","top","document","addEventListener","removeEventListener","registerMutationListener","mutations","getEditorState","read","key","type","add","size","delete","skipInitialization","insertAction","insertRow","maybeTableNode","selectEnd","button","className","theme","tableAddRows","onClick","style","tableAddColumns","target","HTMLElement","closest","tableCell","tableCellResizer","TableHoverActionsPlugin","body"],"mappings":"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"}

package/dist/features/experimental_table/client/plugins/TablePlugin/index.d.ts

@@ -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/client/plugins/TablePlugin/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/experimental_table/client/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,4BAA4B,CAAA;AAIjE,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;AAEF,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAA;CAAE,2CAwBnE;AAED,eAAO,MAAM,WAAW,EAAE,eA+DzB,CAAA"}

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

@@ -0,0 +1,103 @@
+'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 { formatDrawerSlug, useEditDepth, 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 { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.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
+    }
+});
+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();
+    const editDepth = useEditDepth();
+    const { uuid } = useEditorConfigContext();
+    const drawerSlug = formatDrawerSlug({
+        slug: 'lexical-table-create-' + uuid,
+        depth: editDepth
+    });
+    useEffect(()=>{
+        if (!editor.hasNodes([
+            TableNode
+        ])) {
+            throw new Error('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/client/plugins/TablePlugin/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/features/experimental_table/client/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 { formatDrawerSlug, useEditDepth, 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 { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.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})\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  const editDepth = useEditDepth()\n  const { uuid } = useEditorConfigContext()\n\n  const drawerSlug = formatDrawerSlug({\n    slug: 'lexical-table-create-' + uuid,\n    depth: editDepth,\n  })\n\n  useEffect(() => {\n    if (!editor.hasNodes([TableNode])) {\n      throw new Error('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","formatDrawerSlug","useEditDepth","useModal","$getSelection","$isRangeSelection","COMMAND_PRIORITY_EDITOR","createCommand","createContext","useContext","useEffect","useMemo","useState","React","useEditorConfigContext","FieldsDrawer","OPEN_TABLE_DRAWER_COMMAND","CellContext","cellEditorConfig","cellEditorPlugins","set","TableContext","children","contextValue","setContextValue","Provider","value","editor","cellContext","closeModal","toggleModal","editDepth","uuid","drawerSlug","slug","depth","hasNodes","Error","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,gBAAgB,EAAEC,YAAY,EAAEC,QAAQ,QAAQ,iBAAgB;AACzE,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,sBAAsB,QAAQ,+DAA8D;AACrG,SAASC,YAAY,QAAQ,kDAAiD;AAoB9E,OAAO,MAAMC,4BAAgDT,cAC3D,6BACD;AAED,OAAO,MAAMU,4BAAcT,cAAgC;IACzDU,kBAAkB;IAClBC,mBAAmB;IACnBC,KAAK;IACH,QAAQ;IACV;AACF,GAAE;AAEF,OAAO,SAASC,aAAa,EAAEC,QAAQ,EAA6B;IAClE,MAAM,CAACC,cAAcC,gBAAgB,GAAGZ,SAGrC;QACDM,kBAAkB;QAClBC,mBAAmB;IACrB;IACA,qBACE,KAACF,YAAYQ,QAAQ;QACnBC,OAAOf,QACL,IAAO,CAAA;gBACLO,kBAAkBK,aAAaL,gBAAgB;gBAC/CC,mBAAmBI,aAAaJ,iBAAiB;gBACjDC,KAAK,CAACF,kBAAkBC;oBACtBK,gBAAgB;wBAAEN;wBAAkBC;oBAAkB;gBACxD;YACF,CAAA,GACA;YAACI,aAAaL,gBAAgB;YAAEK,aAAaJ,iBAAiB;SAAC;kBAGhEG;;AAGP;AAEA,OAAO,MAAM1B,cAA+B;IAC1C,MAAM,CAAC+B,OAAO,GAAGhC;IACjB,MAAMiC,cAAcnB,WAAWQ;IAC/B,MAAM,EAAEY,UAAU,EAAEC,WAAW,EAAE,GAAG3B;IACpC,MAAM4B,YAAY7B;IAClB,MAAM,EAAE8B,IAAI,EAAE,GAAGlB;IAEjB,MAAMmB,aAAahC,iBAAiB;QAClCiC,MAAM,0BAA0BF;QAChCG,OAAOJ;IACT;IAEArB,UAAU;QACR,IAAI,CAACiB,OAAOS,QAAQ,CAAC;YAACrC;SAAU,GAAG;YACjC,MAAM,IAAIsC,MAAM;QAClB;QAEA,OAAOrC,cACL2B,OAAOW,eAAe,CACpBtB,2BACA;YACE,IAAIuB,iBAAwC;YAE5CZ,OAAOa,cAAc,GAAGC,IAAI,CAAC;gBAC3B,MAAMC,YAAYtC;gBAClB,IAAIC,kBAAkBqC,YAAY;oBAChCH,iBAAiBG;gBACnB;YACF;YAEA,IAAIH,gBAAgB;gBAClBT,YAAYG;YACd;YACA,OAAO;QACT,GACA3B;IAGN,GAAG;QAACsB;QAAaD;QAAQG;KAAY;IAErC,qBACE,MAACjB,MAAM8B,QAAQ;;0BACb,KAAC5B;gBACCkB,YAAYA;gBACZW,aAAY;gBACZC,YAAW;gBACXC,oBAAoB,CAACC,SAASC;oBAC5BnB,WAAWI;oBAEX,IAAI,CAACe,KAAKC,OAAO,IAAI,CAACD,KAAKE,IAAI,EAAE;wBAC/B;oBACF;oBAEAvB,OAAOwB,eAAe,CAACrD,sBAAsB;wBAC3CmD,SAASG,OAAOJ,KAAKC,OAAO;wBAC5BC,MAAME,OAAOJ,KAAKE,IAAI;oBACxB;gBACF;gBACAG,kBAAiB;;0BAEnB,KAACxD;gBAAwByD,wBAAwB;gBAAOC,YAAY;;;;AAG1E,EAAC"}

package/dist/features/experimental_table/client/utils/debounce.d.ts

@@ -0,0 +1,61 @@
+/**
+ * Creates a debounced function that delays invoking `func` until after `wait`
+ * milliseconds have elapsed since the last time the debounced function was
+ * invoked. The debounced function comes with a `cancel` method to cancel
+ * delayed `func` invocations and a `flush` method to immediately invoke them.
+ * Provide `options` to indicate whether `func` should be invoked on the
+ * leading and/or trailing edge of the `wait` timeout. The `func` is invoked
+ * with the last arguments provided to the debounced function. Subsequent
+ * calls to the debounced function return the result of the last `func`
+ * invocation.
+ *
+ * **Note:** If `leading` and `trailing` options are `true`, `func` is
+ * invoked on the trailing edge of the timeout only if the debounced function
+ * is invoked more than once during the `wait` timeout.
+ *
+ * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
+ * until to the next tick, similar to `setTimeout` with a timeout of `0`.
+ *
+ * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
+ * for details over the differences between `_.debounce` and `_.throttle`.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Function
+ * @param {Function} func The function to debounce.
+ * @param {number} [wait=0] The number of milliseconds to delay.
+ * @param {Object} [options={}] The options object.
+ * @param {boolean} [options.leading=false]
+ *  Specify invoking on the leading edge of the timeout.
+ * @param {number} [options.maxWait]
+ *  The maximum time `func` is allowed to be delayed before it's invoked.
+ * @param {boolean} [options.trailing=true]
+ *  Specify invoking on the trailing edge of the timeout.
+ * @returns {Function} Returns the new debounced function.
+ * @example
+ *
+ * // Avoid costly calculations while the window size is in flux.
+ * jQuery(window).on('resize', _.debounce(calculateLayout, 150));
+ *
+ * // Invoke `sendMail` when clicked, debouncing subsequent calls.
+ * jQuery(element).on('click', _.debounce(sendMail, 300, {
+ *   'leading': true,
+ *   'trailing': false
+ * }));
+ *
+ * // Ensure `batchLog` is invoked once after 1 second of debounced calls.
+ * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
+ * var source = new EventSource('/stream');
+ * jQuery(source).on('message', debounced);
+ *
+ * // Cancel the trailing debounced invocation.
+ * jQuery(window).on('popstate', debounced.cancel);
+ */
+declare function debounce(func: any, wait: any, options: any): {
+    (): any;
+    cancel: () => void;
+    flush: () => any;
+};
+export default debounce;
+//# sourceMappingURL=debounce.d.ts.map

package/dist/features/experimental_table/client/utils/debounce.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"debounce.d.ts","sourceRoot":"","sources":["../../../../../src/features/experimental_table/client/utils/debounce.ts"],"names":[],"mappings":"AA4DA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqDG;AACH,iBAAS,QAAQ,CAAC,IAAI,KAAA,EAAE,IAAI,KAAA,EAAE,OAAO,KAAA;;;;EA+HpC;AAED,eAAe,QAAQ,CAAA"}

package/dist/features/experimental_table/client/utils/debounce.js

@@ -0,0 +1,202 @@
+// Copied & modified from https://github.com/lodash/lodash/blob/main/src/debounce.ts
+/*
+The MIT License
+
+Copyright JS Foundation and other contributors <https://js.foundation/>
+
+Based on Underscore.js, copyright Jeremy Ashkenas,
+DocumentCloud and Investigative Reporters & Editors <http://underscorejs.org/>
+
+This software consists of voluntary contributions made by many
+individuals. For exact contribution history, see the revision history
+available at https://github.com/lodash/lodash
+
+The following license applies to all parts of this software except as
+documented below:
+
+====
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+====
+
+Copyright and related rights for sample code are waived via CC0. Sample
+code is defined as all source code displayed within the prose of the
+documentation.
+
+CC0: http://creativecommons.org/publicdomain/zero/1.0/
+
+====
+
+Files located in the node_modules and vendor directories are externally
+maintained libraries used by this software which have their own
+licenses; we recommend you read them, as their terms may differ from the
+terms above.
+ */ /** Error message constants. */ const FUNC_ERROR_TEXT = 'Expected a function';
+/* Built-in method references for those with the same name as other `lodash` methods. */ const nativeMax = Math.max, nativeMin = Math.min;
+/**
+ * Creates a debounced function that delays invoking `func` until after `wait`
+ * milliseconds have elapsed since the last time the debounced function was
+ * invoked. The debounced function comes with a `cancel` method to cancel
+ * delayed `func` invocations and a `flush` method to immediately invoke them.
+ * Provide `options` to indicate whether `func` should be invoked on the
+ * leading and/or trailing edge of the `wait` timeout. The `func` is invoked
+ * with the last arguments provided to the debounced function. Subsequent
+ * calls to the debounced function return the result of the last `func`
+ * invocation.
+ *
+ * **Note:** If `leading` and `trailing` options are `true`, `func` is
+ * invoked on the trailing edge of the timeout only if the debounced function
+ * is invoked more than once during the `wait` timeout.
+ *
+ * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
+ * until to the next tick, similar to `setTimeout` with a timeout of `0`.
+ *
+ * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
+ * for details over the differences between `_.debounce` and `_.throttle`.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Function
+ * @param {Function} func The function to debounce.
+ * @param {number} [wait=0] The number of milliseconds to delay.
+ * @param {Object} [options={}] The options object.
+ * @param {boolean} [options.leading=false]
+ *  Specify invoking on the leading edge of the timeout.
+ * @param {number} [options.maxWait]
+ *  The maximum time `func` is allowed to be delayed before it's invoked.
+ * @param {boolean} [options.trailing=true]
+ *  Specify invoking on the trailing edge of the timeout.
+ * @returns {Function} Returns the new debounced function.
+ * @example
+ *
+ * // Avoid costly calculations while the window size is in flux.
+ * jQuery(window).on('resize', _.debounce(calculateLayout, 150));
+ *
+ * // Invoke `sendMail` when clicked, debouncing subsequent calls.
+ * jQuery(element).on('click', _.debounce(sendMail, 300, {
+ *   'leading': true,
+ *   'trailing': false
+ * }));
+ *
+ * // Ensure `batchLog` is invoked once after 1 second of debounced calls.
+ * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
+ * var source = new EventSource('/stream');
+ * jQuery(source).on('message', debounced);
+ *
+ * // Cancel the trailing debounced invocation.
+ * jQuery(window).on('popstate', debounced.cancel);
+ */ function debounce(func, wait, options) {
+    let lastArgs, lastThis, maxWait, result, timerId, lastCallTime, lastInvokeTime = 0, leading = false, maxing = false, trailing = true;
+    if (typeof func != 'function') {
+        throw new TypeError(FUNC_ERROR_TEXT);
+    }
+    wait = wait || 0;
+    if (typeof options === 'object') {
+        leading = !!options.leading;
+        maxing = 'maxWait' in options;
+        maxWait = maxing ? nativeMax(options.maxWait || 0, wait) : maxWait;
+        trailing = 'trailing' in options ? !!options.trailing : trailing;
+    }
+    function invokeFunc(time) {
+        const args = lastArgs, thisArg = lastThis;
+        lastArgs = lastThis = undefined;
+        lastInvokeTime = time;
+        result = func.apply(thisArg, args);
+        return result;
+    }
+    function leadingEdge(time) {
+        // Reset any `maxWait` timer.
+        lastInvokeTime = time;
+        // Start the timer for the trailing edge.
+        timerId = setTimeout(timerExpired, wait);
+        // Invoke the leading edge.
+        return leading ? invokeFunc(time) : result;
+    }
+    function remainingWait(time) {
+        const timeSinceLastCall = time - lastCallTime, timeSinceLastInvoke = time - lastInvokeTime, timeWaiting = wait - timeSinceLastCall;
+        return maxing ? nativeMin(timeWaiting, maxWait - timeSinceLastInvoke) : timeWaiting;
+    }
+    function shouldInvoke(time) {
+        const timeSinceLastCall = time - lastCallTime, timeSinceLastInvoke = time - lastInvokeTime;
+        // Either this is the first call, activity has stopped and we're at the
+        // trailing edge, the system time has gone backwards and we're treating
+        // it as the trailing edge, or we've hit the `maxWait` limit.
+        return lastCallTime === undefined || timeSinceLastCall >= wait || timeSinceLastCall < 0 || maxing && timeSinceLastInvoke >= maxWait;
+    }
+    function timerExpired() {
+        const time = Date.now();
+        if (shouldInvoke(time)) {
+            return trailingEdge(time);
+        }
+        // Restart the timer.
+        timerId = setTimeout(timerExpired, remainingWait(time));
+    }
+    function trailingEdge(time) {
+        timerId = undefined;
+        // Only invoke if we have `lastArgs` which means `func` has been
+        // debounced at least once.
+        if (trailing && lastArgs) {
+            return invokeFunc(time);
+        }
+        lastArgs = lastThis = undefined;
+        return result;
+    }
+    function cancel() {
+        if (timerId !== undefined) {
+            clearTimeout(timerId);
+        }
+        lastInvokeTime = 0;
+        lastArgs = lastCallTime = lastThis = timerId = undefined;
+    }
+    function flush() {
+        return timerId === undefined ? result : trailingEdge(Date.now());
+    }
+    function debounced() {
+        const time = Date.now(), isInvoking = shouldInvoke(time);
+        // eslint-disable-next-line prefer-rest-params
+        lastArgs = arguments;
+        // eslint-disable-next-line @typescript-eslint/no-this-alias
+        lastThis = this;
+        lastCallTime = time;
+        if (isInvoking) {
+            if (timerId === undefined) {
+                return leadingEdge(lastCallTime);
+            }
+            if (maxing) {
+                // Handle invocations in a tight loop.
+                clearTimeout(timerId);
+                timerId = setTimeout(timerExpired, wait);
+                return invokeFunc(lastCallTime);
+            }
+        }
+        if (timerId === undefined) {
+            timerId = setTimeout(timerExpired, wait);
+        }
+        return result;
+    }
+    debounced.cancel = cancel;
+    debounced.flush = flush;
+    return debounced;
+}
+export default debounce;
+
+//# sourceMappingURL=debounce.js.map