npm - @payloadcms/richtext-lexical - Versions diffs - 3.0.0-beta.90 → 3.0.0-beta.91 - Mend

@payloadcms/richtext-lexical 3.0.0-beta.90 → 3.0.0-beta.91

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 (80) hide show

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

@@ -1,6 +1,5 @@
 'use client';
-import { c as _c } from "react/compiler-runtime";
 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';
@@ -12,32 +11,16 @@ 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(t0) {
-  const $ = _c(14);
-  const {
-    anchorElem
-  } = t0;
+function TableHoverActionsContainer({
+  anchorElem
+}) {
   const [editor] = useLexicalComposerContext();
   const editorConfig = useEditorConfigContext();
   const [isShownRow, setShownRow] = useState(false);
   const [isShownColumn, setShownColumn] = useState(false);
   const [shouldListenMouseMove, setShouldListenMouseMove] = useState(false);
-  let t1;
-  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    t1 = {};
-    $[0] = t1;
-  } else {
-    t1 = $[0];
-  }
-  const [position, setPosition] = useState(t1);
-  let t2;
-  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
-    t2 = new Set();
-    $[1] = t2;
-  } else {
-    t2 = $[1];
-  }
-  const codeSetRef = useRef(t2);
+  const [position, setPosition] = useState({});
+  const codeSetRef = useRef(new Set());
   const tableDOMNodeRef = useRef(null);
   const debouncedOnMouseMove = useDebounce(event => {
     const {
@@ -53,12 +36,9 @@ function TableHoverActionsContainer(t0) {
       return;
     }
     tableDOMNodeRef.current = tableDOMNode;
-    let hoveredRowNode;
-    hoveredRowNode = null;
-    let hoveredColumnNode;
-    hoveredColumnNode = null;
-    let tableDOMElement;
-    tableDOMElement = null;
+    let hoveredRowNode = null;
+    let hoveredColumnNode = null;
+    let tableDOMElement = null;
     editor.update(() => {
       const maybeTableCell = $getNearestNodeFromDOMNode(tableDOMNode);
       if ($isTableCellNode(maybeTableCell)) {
@@ -69,15 +49,15 @@ function TableHoverActionsContainer(t0) {
         tableDOMElement = editor.getElementByKey(table?.getKey());
         if (tableDOMElement) {
           const rowCount = table.getChildrenSize();
-          const colCount = table.getChildAtIndex(0)?.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;
-            }
+          } else if (colIndex === colCount - 1) {
+            hoveredColumnNode = maybeTableCell;
           }
         }
       }
@@ -104,80 +84,51 @@ function TableHoverActionsContainer(t0) {
           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
-          });
-        }
+      } else if (hoveredColumnNode) {
+        setShownColumn(true);
+        setShownRow(false);
+        setPosition({
+          height: tableElemHeight,
+          left: tableElemRight - editorElemLeft + 5,
+          top: tableElemY - editorElemY,
+          width: BUTTON_WIDTH_PX
+        });
       }
     }
   }, 50, 250);
-  let t3;
-  let t4;
-  if ($[2] !== shouldListenMouseMove || $[3] !== debouncedOnMouseMove) {
-    t3 = () => {
-      if (!shouldListenMouseMove) {
-        return;
-      }
-      document.addEventListener("mousemove", debouncedOnMouseMove);
-      return () => {
-        setShownRow(false);
-        setShownColumn(false);
-        document.removeEventListener("mousemove", debouncedOnMouseMove);
-      };
+  useEffect(() => {
+    if (!shouldListenMouseMove) {
+      return;
+    }
+    document.addEventListener('mousemove', debouncedOnMouseMove);
+    return () => {
+      setShownRow(false);
+      setShownColumn(false);
+      document.removeEventListener('mousemove', debouncedOnMouseMove);
     };
-    t4 = [shouldListenMouseMove, debouncedOnMouseMove];
-    $[2] = shouldListenMouseMove;
-    $[3] = debouncedOnMouseMove;
-    $[4] = t3;
-    $[5] = t4;
-  } else {
-    t3 = $[4];
-    t4 = $[5];
-  }
-  useEffect(t3, t4);
-  let t5;
-  let t6;
-  if ($[6] !== editor) {
-    t5 = () => mergeRegister(editor.registerMutationListener(TableNode, mutations => {
+  }, [shouldListenMouseMove, debouncedOnMouseMove]);
+  useEffect(() => {
+    return mergeRegister(editor.registerMutationListener(TableNode, mutations => {
       editor.getEditorState().read(() => {
         for (const [key, type] of mutations) {
-          bb61: switch (type) {
-            case "created":
-              {
-                codeSetRef.current.add(key);
-                setShouldListenMouseMove(codeSetRef.current.size > 0);
-                break bb61;
-              }
-            case "destroyed":
-              {
-                codeSetRef.current.delete(key);
-                setShouldListenMouseMove(codeSetRef.current.size > 0);
-                break bb61;
-              }
+          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
     }));
-    t6 = [editor];
-    $[6] = editor;
-    $[7] = t5;
-    $[8] = t6;
-  } else {
-    t5 = $[7];
-    t6 = $[8];
-  }
-  useEffect(t5, t6);
+  }, [editor]);
   const insertAction = insertRow => {
     editor.update(() => {
       if (tableDOMNodeRef.current) {
@@ -193,36 +144,21 @@ function TableHoverActionsContainer(t0) {
       }
     });
   };
-  const t7 = _jsxs;
-  const t8 = _Fragment;
-  const t9 = isShownRow && _jsx("button", {
-    className: editorConfig.editorConfig.lexical.theme.tableAddRows,
-    onClick: () => insertAction(true),
-    style: {
-      ...position
-    }
-  });
-  const t10 = isShownColumn && _jsx("button", {
-    className: editorConfig.editorConfig.lexical.theme.tableAddColumns,
-    onClick: () => insertAction(false),
-    style: {
-      ...position
-    }
+  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
+      }
+    })]
   });
-  let t11;
-  if ($[9] !== t9 || $[10] !== t10 || $[11] !== t7 || $[12] !== t8) {
-    t11 = t7(t8, {
-      children: [t9, t10]
-    });
-    $[9] = t9;
-    $[10] = t10;
-    $[11] = t7;
-    $[12] = t8;
-    $[13] = t11;
-  } else {
-    t11 = $[13];
-  }
-  return t11;
 }
 function getMouseInfo(event, editorConfig) {
   const target = event.target;

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","$getTableColumnIndexFromTableCellNode","$getTableRowIndexFromTableCellNode","$insertTableColumn__EXPERIMENTAL","$insertTableRow__EXPERIMENTAL","$isTableCellNode","$isTableNode","TableNode","$findMatchingParent","mergeRegister","$getNearestNodeFromDOMNode","useEffect","useRef","useState","React","createPortal","useEditorConfigContext","useDebounce","BUTTON_WIDTH_PX","TableHoverActionsContainer","t0","$","anchorElem","editor","editorConfig","isShownRow","setShownRow","isShownColumn","setShownColumn","shouldListenMouseMove","setShouldListenMouseMove","t1","Symbol","for","position","setPosition","t2","Set","codeSetRef","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","t3","t4","document","addEventListener","removeEventListener","t5","t6","registerMutationListener","mutations","getEditorState","read","key","type","bb61","add","size","delete","skipInitialization","insertAction","insertRow","maybeTableNode","selectEnd","_jsxs","_Fragment","t9","_jsx","className","theme","tableAddRows","onClick","style","t10","tableAddColumns","t11","children","target","HTMLElement","closest","tableCell","tableCellResizer","TableHoverActionsPlugin","body"],"sources":["../../../../../../src/features/experimental_table/client/plugins/TableHoverActionsPlugin/index.tsx"],"sourcesContent":["'use client'\n\nimport type { TableCellNode, TableRowNode } from '@lexical/table'\nimport type { EditorConfig, NodeKey } from 'lexical'\nimport type { JSX } from 'react'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport {\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"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"index.js","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","_jsxs","_Fragment","_jsx","className","theme","tableAddRows","onClick","style","tableAddColumns","target","HTMLElement","closest","tableCell","tableCellResizer","TableHoverActionsPlugin","body"],"sources":["../../../../../../src/features/experimental_table/client/plugins/TableHoverActionsPlugin/index.tsx"],"sourcesContent":["'use client'\n\nimport type { TableCellNode, TableRowNode } from '@lexical/table'\nimport type { EditorConfig, NodeKey } from 'lexical'\nimport type { JSX } from 'react'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport {\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"],"mappings":"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","ignoreList":[]}

package/dist/features/link/client/plugins/floatingLinkEditor/LinkEditor/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/features/link/client/plugins/floatingLinkEditor/LinkEditor/index.tsx"],"names":[],"mappings":"~~AAiBA~~,OAAO,KAAmD,MAAM,OAAO,CAAA;AAcvE,wBAAgB,UAAU,CAAC,EAAE,UAAU,EAAE,EAAE;IAAE,UAAU,EAAE,WAAW,CAAA;CAAE,GAAG,KAAK,CAAC,SAAS,~~CA2UvF~~"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/features/link/client/plugins/floatingLinkEditor/LinkEditor/index.tsx"],"names":[],"mappings":"AAyBA,OAAO,KAAmD,MAAM,OAAO,CAAA;AAcvE,wBAAgB,UAAU,CAAC,EAAE,UAAU,EAAE,EAAE;IAAE,UAAU,EAAE,WAAW,CAAA;CAAE,GAAG,KAAK,CAAC,SAAS,CA+UvF"}

package/dist/features/link/client/plugins/floatingLinkEditor/LinkEditor/index.js CHANGED Viewed

@@ -4,7 +4,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
 import { $findMatchingParent, mergeRegister } from '@lexical/utils';
 import { getTranslation } from '@payloadcms/translations';
-import { formatDrawerSlug, useConfig, useEditDepth, useModal, useTranslation } from '@payloadcms/ui';
+import { CloseMenuIcon, EditIcon, formatDrawerSlug, useConfig, useEditDepth, useModal, useTranslation } from '@payloadcms/ui';
 import { $getSelection, $isLineBreakNode, $isRangeSelection, COMMAND_PRIORITY_HIGH, COMMAND_PRIORITY_LOW, KEY_ESCAPE_COMMAND, SELECTION_CHANGE_COMMAND } from 'lexical';
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { useEditorConfigContext } from '../../../../../../lexical/config/client/EditorConfigProvider.js';
@@ -216,7 +216,8 @@ export function LinkEditor({
               event.preventDefault();
             },
             tabIndex: 0,
-            type: "button"
+            type: "button",
+            children: /*#__PURE__*/_jsx(EditIcon, {})
           }), !isAutoLink && /*#__PURE__*/_jsx("button", {
             "aria-label": "Remove link",
             className: "link-trash",
@@ -227,7 +228,8 @@ export function LinkEditor({
               event_0.preventDefault();
             },
             tabIndex: 0,
-            type: "button"
+            type: "button",
+            children: /*#__PURE__*/_jsx(CloseMenuIcon, {})
           })]
         })]
       })

package/dist/features/link/client/plugins/floatingLinkEditor/LinkEditor/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":["useLexicalComposerContext","$findMatchingParent","mergeRegister","getTranslation","formatDrawerSlug","useConfig","useEditDepth","useModal","useTranslation","$getSelection","$isLineBreakNode","$isRangeSelection","COMMAND_PRIORITY_HIGH","COMMAND_PRIORITY_LOW","KEY_ESCAPE_COMMAND","SELECTION_CHANGE_COMMAND","React","useCallback","useEffect","useRef","useState","useEditorConfigContext","getSelectedNode","setFloatingElemPositionForLinkEditor","FieldsDrawer","$isAutoLinkNode","$createLinkNode","$isLinkNode","TOGGLE_LINK_COMMAND","TOGGLE_LINK_WITH_MODAL_COMMAND","LinkEditor","anchorElem","editor","editorRef","linkUrl","setLinkUrl","linkLabel","setLinkLabel","uuid","config","i18n","t","stateData","setStateData","closeModal","toggleModal","editDepth","isLink","setIsLink","selectedNodes","setSelectedNodes","isAutoLink","setIsAutoLink","drawerSlug","slug","depth","setNotLink","current","style","opacity","transform","$updateLinkEditor","selection","selectedNodeDomRect","focusNode","getElementByKey","getKey","getBoundingClientRect","focusLinkParent","badNode","getNodes","filter","node","find","linkNode","is","data","doc","undefined","linkType","newTab","url","getFields","id","getID","text","getTextContent","relationTo","value","relatedField","collections","coll","label","String","labels","singular","replace","editorElem","nativeSelection","window","getSelection","activeElement","document","rootElement","getRootElement","contains","anchorNode","getRangeAt","y","className","registerCommand","payload","dispatchCommand","scrollerElem","parentElement","update","getEditorState","read","addEventListener","removeEventListener","registerUpdateListener","editorState","_jsxs","Fragment","_jsx","ref","length","href","rel","target","isEditable","onClick","onMouseDown","event","preventDefault","tabIndex","type","drawerTitle","featureKey","handleDrawerSubmit","fields","newLinkPayload","bareLinkFields","linkParent","getParent","schemaPathSuffix"],"sources":["../../../../../../../src/features/link/client/plugins/floatingLinkEditor/LinkEditor/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalNode } from 'lexical'\nimport type { Data, FormState } from 'payload'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { $findMatchingParent, mergeRegister } from '@lexical/utils'\nimport { getTranslation } from '@payloadcms/translations'\nimport { formatDrawerSlug, useConfig, useEditDepth, useModal, useTranslation } from '@payloadcms/ui'\nimport {\n $getSelection,\n $isLineBreakNode,\n $isRangeSelection,\n COMMAND_PRIORITY_HIGH,\n COMMAND_PRIORITY_LOW,\n KEY_ESCAPE_COMMAND,\n SELECTION_CHANGE_COMMAND,\n} from 'lexical'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\n\nimport type { LinkNode } from '../../../../nodes/LinkNode.js'\nimport type { LinkFields } from '../../../../nodes/types.js'\nimport type { LinkPayload } from '../types.js'\n\nimport { useEditorConfigContext } from '../../../../../../lexical/config/client/EditorConfigProvider.js'\nimport { getSelectedNode } from '../../../../../../lexical/utils/getSelectedNode.js'\nimport { setFloatingElemPositionForLinkEditor } from '../../../../../../lexical/utils/setFloatingElemPositionForLinkEditor.js'\nimport { FieldsDrawer } from '../../../../../../utilities/fieldsDrawer/Drawer.js'\nimport { $isAutoLinkNode } from '../../../../nodes/AutoLinkNode.js'\nimport { $createLinkNode, $isLinkNode, TOGGLE_LINK_COMMAND } from '../../../../nodes/LinkNode.js'\nimport { TOGGLE_LINK_WITH_MODAL_COMMAND } from './commands.js'\n\nexport function LinkEditor({ anchorElem }: { anchorElem: HTMLElement }): React.ReactNode {\n const [editor] = useLexicalComposerContext()\n\n const editorRef = useRef<HTMLDivElement \| null>(null)\n const [linkUrl, setLinkUrl] = useState(null)\n const [linkLabel, setLinkLabel] = useState(null)\n\n const { uuid } = useEditorConfigContext()\n\n const { config } = useConfig()\n\n const { i18n, t } = useTranslation()\n\n const [stateData, setStateData] = useState<{ id?: string; text: string } & LinkFields>(null)\n\n const { closeModal, toggleModal } = useModal()\n const editDepth = useEditDepth()\n const [isLink, setIsLink] = useState(false)\n const [selectedNodes, setSelectedNodes] = useState<LexicalNode[]>([])\n\n const [isAutoLink, setIsAutoLink] = useState(false)\n\n const drawerSlug = formatDrawerSlug({\n slug: `lexical-rich-text-link-` + uuid,\n depth: editDepth,\n })\n\n const setNotLink = useCallback(() => {\n setIsLink(false)\n if (editorRef && editorRef.current) {\n editorRef.current.style.opacity = '0'\n editorRef.current.style.transform = 'translate(-10000px, -10000px)'\n }\n setIsAutoLink(false)\n setLinkUrl(null)\n setLinkLabel(null)\n setSelectedNodes([])\n setStateData(null)\n }, [setIsLink, setLinkUrl, setLinkLabel, setSelectedNodes])\n\n const $updateLinkEditor = useCallback(() => {\n const selection = $getSelection()\n let selectedNodeDomRect: DOMRect \| undefined = null\n\n if (!$isRangeSelection(selection) \|\| !selection) {\n setNotLink()\n return\n }\n\n // Handle the data displayed in the floating link editor & drawer when you click on a link node\n\n const focusNode = getSelectedNode(selection)\n selectedNodeDomRect = editor.getElementByKey(focusNode.getKey())?.getBoundingClientRect()\n const focusLinkParent: LinkNode = $findMatchingParent(focusNode, $isLinkNode)\n\n // Prevent link modal from showing if selection spans further than the link: https://github.com/facebook/lexical/issues/4064\n const badNode = selection\n .getNodes()\n .filter((node) => !$isLineBreakNode(node))\n .find((node) => {\n const linkNode = $findMatchingParent(node, $isLinkNode)\n return (\n (focusLinkParent && !focusLinkParent.is(linkNode)) \|\|\n (linkNode && !linkNode.is(focusLinkParent))\n )\n })\n\n if (focusLinkParent == null \|\| badNode) {\n setNotLink()\n return\n }\n\n // Initial state:\n const data: { text: string } & LinkFields = {\n doc: undefined,\n linkType: undefined,\n newTab: undefined,\n url: '',\n ...focusLinkParent.getFields(),\n id: focusLinkParent.getID(),\n text: focusLinkParent.getTextContent(),\n }\n\n if (focusLinkParent.getFields()?.linkType === 'custom') {\n setLinkUrl(focusLinkParent.getFields()?.url ?? null)\n setLinkLabel(null)\n } else {\n // internal link\n setLinkUrl(\n `/admin/collections/${focusLinkParent.getFields()?.doc?.relationTo}/${\n focusLinkParent.getFields()?.doc?.value\n }`,\n )\n\n const relatedField = config.collections.find(\n (coll) => coll.slug === focusLinkParent.getFields()?.doc?.relationTo,\n )\n if (!relatedField) {\n // Usually happens if the user removed all default fields. In this case, we let them specify the label or do not display the label at all.\n // label could be a virtual field the user added. This is useful if they want to use the link feature for things other than links.\n setLinkLabel(\n focusLinkParent.getFields()?.label ? String(focusLinkParent.getFields()?.label) : null,\n )\n setLinkUrl(\n focusLinkParent.getFields()?.url ? String(focusLinkParent.getFields()?.url) : null,\n )\n } else {\n const label = t('fields:linkedTo', {\n label: getTranslation(relatedField.labels.singular, i18n),\n }).replace(/<[^>]*>?/g, '')\n setLinkLabel(label)\n }\n }\n\n setStateData(data)\n setIsLink(true)\n setSelectedNodes(selection ? selection?.getNodes() : [])\n\n if ($isAutoLinkNode(focusLinkParent)) {\n setIsAutoLink(true)\n } else {\n setIsAutoLink(false)\n }\n\n const editorElem = editorRef.current\n const nativeSelection = window.getSelection()\n const { activeElement } = document\n\n if (editorElem === null) {\n return\n }\n\n const rootElement = editor.getRootElement()\n\n if (\n nativeSelection !== null &&\n rootElement !== null &&\n rootElement.contains(nativeSelection.anchorNode)\n ) {\n if (!selectedNodeDomRect) {\n // Get the DOM rect of the selected node using the native selection. This sometimes produces the wrong\n // result, which is why we use lexical's selection preferably.\n selectedNodeDomRect = nativeSelection.getRangeAt(0).getBoundingClientRect()\n }\n\n if (selectedNodeDomRect != null) {\n selectedNodeDomRect.y += 40\n setFloatingElemPositionForLinkEditor(selectedNodeDomRect, editorElem, anchorElem)\n }\n } else if (activeElement == null \|\| activeElement.className !== 'link-input') {\n if (rootElement !== null) {\n setFloatingElemPositionForLinkEditor(null, editorElem, anchorElem)\n }\n setLinkUrl(null)\n setLinkLabel(null)\n }\n\n return true\n }, [editor, setNotLink, config.collections, t, i18n, anchorElem])\n\n useEffect(() => {\n return mergeRegister(\n editor.registerCommand(\n TOGGLE_LINK_WITH_MODAL_COMMAND,\n (payload: LinkPayload) => {\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, payload)\n\n // Now, open the modal\n $updateLinkEditor()\n toggleModal(drawerSlug)\n\n return true\n },\n COMMAND_PRIORITY_LOW,\n ),\n )\n }, [editor, $updateLinkEditor, toggleModal, drawerSlug])\n\n useEffect(() => {\n const scrollerElem = anchorElem.parentElement\n\n const update = (): void => {\n editor.getEditorState().read(() => {\n void $updateLinkEditor()\n })\n }\n\n window.addEventListener('resize', update)\n\n if (scrollerElem != null) {\n scrollerElem.addEventListener('scroll', update)\n }\n\n return () => {\n window.removeEventListener('resize', update)\n\n if (scrollerElem != null) {\n scrollerElem.removeEventListener('scroll', update)\n }\n }\n }, [anchorElem.parentElement, editor, $updateLinkEditor])\n\n useEffect(() => {\n return mergeRegister(\n editor.registerUpdateListener(({ editorState }) => {\n editorState.read(() => {\n void $updateLinkEditor()\n })\n }),\n\n editor.registerCommand(\n SELECTION_CHANGE_COMMAND,\n () => {\n void $updateLinkEditor()\n return true\n },\n COMMAND_PRIORITY_LOW,\n ),\n editor.registerCommand(\n KEY_ESCAPE_COMMAND,\n () => {\n if (isLink) {\n setNotLink()\n\n return true\n }\n return false\n },\n COMMAND_PRIORITY_HIGH,\n ),\n )\n }, [editor, $updateLinkEditor, isLink, setNotLink])\n\n useEffect(() => {\n editor.getEditorState().read(() => {\n void $updateLinkEditor()\n })\n }, [editor, $updateLinkEditor])\n\n return (\n <React.Fragment>\n <div className=\"link-editor\" ref={editorRef}>\n <div className=\"link-input\">\n {linkUrl && linkUrl.length > 0 ? (\n <a href={linkUrl} rel=\"noopener noreferrer\" target=\"_blank\">\n {linkLabel != null && linkLabel.length > 0 ? linkLabel : linkUrl}\n </a>\n ) : linkLabel != null && linkLabel.length > 0 ? (\n <span className=\"link-input__label-pure\">{linkLabel}</span>\n ) : null}\n\n {editor.isEditable() && (\n <React.Fragment>\n <button\n aria-label=\"Edit link\"\n className=\"link-edit\"\n onClick={() => {\n toggleModal(drawerSlug)\n }}\n onMouseDown={(event) => {\n event.preventDefault()\n }}\n tabIndex={0}\n type=\"button\"\n />\n {!isAutoLink && (\n <button\n aria-label=\"Remove link\"\n className=\"link-trash\"\n onClick={() => {\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, null)\n }}\n onMouseDown={(event) => {\n event.preventDefault()\n }}\n tabIndex={0}\n type=\"button\"\n />\n )}\n </React.Fragment>\n )}\n </div>\n </div>\n <FieldsDrawer\n className=\"lexical-link-edit-drawer\"\n data={stateData}\n drawerSlug={drawerSlug}\n drawerTitle={t('fields:editLink')}\n featureKey=\"link\"\n handleDrawerSubmit={(fields: FormState, data: Data) => {\n closeModal(drawerSlug)\n\n const newLinkPayload = data as { text: string } & LinkFields\n\n const bareLinkFields: LinkFields = {\n ...newLinkPayload,\n }\n delete bareLinkFields.text\n\n // See: https://github.com/facebook/lexical/pull/5536. This updates autolink nodes to link nodes whenever a change was made (which is good!).\n editor.update(() => {\n const selection = $getSelection()\n let linkParent = null\n if ($isRangeSelection(selection)) {\n linkParent = getSelectedNode(selection).getParent()\n } else {\n if (selectedNodes.length) {\n linkParent = selectedNodes[0].getParent()\n }\n }\n\n if (linkParent && $isAutoLinkNode(linkParent)) {\n const linkNode = $createLinkNode({\n fields: bareLinkFields,\n })\n linkParent.replace(linkNode, true)\n }\n })\n\n // Needs to happen AFTER a potential auto link => link node conversion, as otherwise, the updated text to display may be lost due to\n // it being applied to the auto link node instead of the link node.\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, {\n fields: bareLinkFields,\n selectedNodes,\n text: newLinkPayload.text,\n })\n }}\n schemaPathSuffix=\"fields\"\n />\n </React.Fragment>\n )\n}\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"index.js","names":["useLexicalComposerContext","$findMatchingParent","mergeRegister","getTranslation","CloseMenuIcon","EditIcon","formatDrawerSlug","useConfig","useEditDepth","useModal","useTranslation","$getSelection","$isLineBreakNode","$isRangeSelection","COMMAND_PRIORITY_HIGH","COMMAND_PRIORITY_LOW","KEY_ESCAPE_COMMAND","SELECTION_CHANGE_COMMAND","React","useCallback","useEffect","useRef","useState","useEditorConfigContext","getSelectedNode","setFloatingElemPositionForLinkEditor","FieldsDrawer","$isAutoLinkNode","$createLinkNode","$isLinkNode","TOGGLE_LINK_COMMAND","TOGGLE_LINK_WITH_MODAL_COMMAND","LinkEditor","anchorElem","editor","editorRef","linkUrl","setLinkUrl","linkLabel","setLinkLabel","uuid","config","i18n","t","stateData","setStateData","closeModal","toggleModal","editDepth","isLink","setIsLink","selectedNodes","setSelectedNodes","isAutoLink","setIsAutoLink","drawerSlug","slug","depth","setNotLink","current","style","opacity","transform","$updateLinkEditor","selection","selectedNodeDomRect","focusNode","getElementByKey","getKey","getBoundingClientRect","focusLinkParent","badNode","getNodes","filter","node","find","linkNode","is","data","doc","undefined","linkType","newTab","url","getFields","id","getID","text","getTextContent","relationTo","value","relatedField","collections","coll","label","String","labels","singular","replace","editorElem","nativeSelection","window","getSelection","activeElement","document","rootElement","getRootElement","contains","anchorNode","getRangeAt","y","className","registerCommand","payload","dispatchCommand","scrollerElem","parentElement","update","getEditorState","read","addEventListener","removeEventListener","registerUpdateListener","editorState","_jsxs","Fragment","_jsx","ref","length","href","rel","target","isEditable","onClick","onMouseDown","event","preventDefault","tabIndex","type","drawerTitle","featureKey","handleDrawerSubmit","fields","newLinkPayload","bareLinkFields","linkParent","getParent","schemaPathSuffix"],"sources":["../../../../../../../src/features/link/client/plugins/floatingLinkEditor/LinkEditor/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalNode } from 'lexical'\nimport type { Data, FormState } from 'payload'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { $findMatchingParent, mergeRegister } from '@lexical/utils'\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n CloseMenuIcon,\n EditIcon,\n formatDrawerSlug,\n useConfig,\n useEditDepth,\n useModal,\n useTranslation,\n} from '@payloadcms/ui'\nimport {\n $getSelection,\n $isLineBreakNode,\n $isRangeSelection,\n COMMAND_PRIORITY_HIGH,\n COMMAND_PRIORITY_LOW,\n KEY_ESCAPE_COMMAND,\n SELECTION_CHANGE_COMMAND,\n} from 'lexical'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\n\nimport type { LinkNode } from '../../../../nodes/LinkNode.js'\nimport type { LinkFields } from '../../../../nodes/types.js'\nimport type { LinkPayload } from '../types.js'\n\nimport { useEditorConfigContext } from '../../../../../../lexical/config/client/EditorConfigProvider.js'\nimport { getSelectedNode } from '../../../../../../lexical/utils/getSelectedNode.js'\nimport { setFloatingElemPositionForLinkEditor } from '../../../../../../lexical/utils/setFloatingElemPositionForLinkEditor.js'\nimport { FieldsDrawer } from '../../../../../../utilities/fieldsDrawer/Drawer.js'\nimport { $isAutoLinkNode } from '../../../../nodes/AutoLinkNode.js'\nimport { $createLinkNode, $isLinkNode, TOGGLE_LINK_COMMAND } from '../../../../nodes/LinkNode.js'\nimport { TOGGLE_LINK_WITH_MODAL_COMMAND } from './commands.js'\n\nexport function LinkEditor({ anchorElem }: { anchorElem: HTMLElement }): React.ReactNode {\n const [editor] = useLexicalComposerContext()\n\n const editorRef = useRef<HTMLDivElement \| null>(null)\n const [linkUrl, setLinkUrl] = useState(null)\n const [linkLabel, setLinkLabel] = useState(null)\n\n const { uuid } = useEditorConfigContext()\n\n const { config } = useConfig()\n\n const { i18n, t } = useTranslation()\n\n const [stateData, setStateData] = useState<{ id?: string; text: string } & LinkFields>(null)\n\n const { closeModal, toggleModal } = useModal()\n const editDepth = useEditDepth()\n const [isLink, setIsLink] = useState(false)\n const [selectedNodes, setSelectedNodes] = useState<LexicalNode[]>([])\n\n const [isAutoLink, setIsAutoLink] = useState(false)\n\n const drawerSlug = formatDrawerSlug({\n slug: `lexical-rich-text-link-` + uuid,\n depth: editDepth,\n })\n\n const setNotLink = useCallback(() => {\n setIsLink(false)\n if (editorRef && editorRef.current) {\n editorRef.current.style.opacity = '0'\n editorRef.current.style.transform = 'translate(-10000px, -10000px)'\n }\n setIsAutoLink(false)\n setLinkUrl(null)\n setLinkLabel(null)\n setSelectedNodes([])\n setStateData(null)\n }, [setIsLink, setLinkUrl, setLinkLabel, setSelectedNodes])\n\n const $updateLinkEditor = useCallback(() => {\n const selection = $getSelection()\n let selectedNodeDomRect: DOMRect \| undefined = null\n\n if (!$isRangeSelection(selection) \|\| !selection) {\n setNotLink()\n return\n }\n\n // Handle the data displayed in the floating link editor & drawer when you click on a link node\n\n const focusNode = getSelectedNode(selection)\n selectedNodeDomRect = editor.getElementByKey(focusNode.getKey())?.getBoundingClientRect()\n const focusLinkParent: LinkNode = $findMatchingParent(focusNode, $isLinkNode)\n\n // Prevent link modal from showing if selection spans further than the link: https://github.com/facebook/lexical/issues/4064\n const badNode = selection\n .getNodes()\n .filter((node) => !$isLineBreakNode(node))\n .find((node) => {\n const linkNode = $findMatchingParent(node, $isLinkNode)\n return (\n (focusLinkParent && !focusLinkParent.is(linkNode)) \|\|\n (linkNode && !linkNode.is(focusLinkParent))\n )\n })\n\n if (focusLinkParent == null \|\| badNode) {\n setNotLink()\n return\n }\n\n // Initial state:\n const data: { text: string } & LinkFields = {\n doc: undefined,\n linkType: undefined,\n newTab: undefined,\n url: '',\n ...focusLinkParent.getFields(),\n id: focusLinkParent.getID(),\n text: focusLinkParent.getTextContent(),\n }\n\n if (focusLinkParent.getFields()?.linkType === 'custom') {\n setLinkUrl(focusLinkParent.getFields()?.url ?? null)\n setLinkLabel(null)\n } else {\n // internal link\n setLinkUrl(\n `/admin/collections/${focusLinkParent.getFields()?.doc?.relationTo}/${\n focusLinkParent.getFields()?.doc?.value\n }`,\n )\n\n const relatedField = config.collections.find(\n (coll) => coll.slug === focusLinkParent.getFields()?.doc?.relationTo,\n )\n if (!relatedField) {\n // Usually happens if the user removed all default fields. In this case, we let them specify the label or do not display the label at all.\n // label could be a virtual field the user added. This is useful if they want to use the link feature for things other than links.\n setLinkLabel(\n focusLinkParent.getFields()?.label ? String(focusLinkParent.getFields()?.label) : null,\n )\n setLinkUrl(\n focusLinkParent.getFields()?.url ? String(focusLinkParent.getFields()?.url) : null,\n )\n } else {\n const label = t('fields:linkedTo', {\n label: getTranslation(relatedField.labels.singular, i18n),\n }).replace(/<[^>]*>?/g, '')\n setLinkLabel(label)\n }\n }\n\n setStateData(data)\n setIsLink(true)\n setSelectedNodes(selection ? selection?.getNodes() : [])\n\n if ($isAutoLinkNode(focusLinkParent)) {\n setIsAutoLink(true)\n } else {\n setIsAutoLink(false)\n }\n\n const editorElem = editorRef.current\n const nativeSelection = window.getSelection()\n const { activeElement } = document\n\n if (editorElem === null) {\n return\n }\n\n const rootElement = editor.getRootElement()\n\n if (\n nativeSelection !== null &&\n rootElement !== null &&\n rootElement.contains(nativeSelection.anchorNode)\n ) {\n if (!selectedNodeDomRect) {\n // Get the DOM rect of the selected node using the native selection. This sometimes produces the wrong\n // result, which is why we use lexical's selection preferably.\n selectedNodeDomRect = nativeSelection.getRangeAt(0).getBoundingClientRect()\n }\n\n if (selectedNodeDomRect != null) {\n selectedNodeDomRect.y += 40\n setFloatingElemPositionForLinkEditor(selectedNodeDomRect, editorElem, anchorElem)\n }\n } else if (activeElement == null \|\| activeElement.className !== 'link-input') {\n if (rootElement !== null) {\n setFloatingElemPositionForLinkEditor(null, editorElem, anchorElem)\n }\n setLinkUrl(null)\n setLinkLabel(null)\n }\n\n return true\n }, [editor, setNotLink, config.collections, t, i18n, anchorElem])\n\n useEffect(() => {\n return mergeRegister(\n editor.registerCommand(\n TOGGLE_LINK_WITH_MODAL_COMMAND,\n (payload: LinkPayload) => {\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, payload)\n\n // Now, open the modal\n $updateLinkEditor()\n toggleModal(drawerSlug)\n\n return true\n },\n COMMAND_PRIORITY_LOW,\n ),\n )\n }, [editor, $updateLinkEditor, toggleModal, drawerSlug])\n\n useEffect(() => {\n const scrollerElem = anchorElem.parentElement\n\n const update = (): void => {\n editor.getEditorState().read(() => {\n void $updateLinkEditor()\n })\n }\n\n window.addEventListener('resize', update)\n\n if (scrollerElem != null) {\n scrollerElem.addEventListener('scroll', update)\n }\n\n return () => {\n window.removeEventListener('resize', update)\n\n if (scrollerElem != null) {\n scrollerElem.removeEventListener('scroll', update)\n }\n }\n }, [anchorElem.parentElement, editor, $updateLinkEditor])\n\n useEffect(() => {\n return mergeRegister(\n editor.registerUpdateListener(({ editorState }) => {\n editorState.read(() => {\n void $updateLinkEditor()\n })\n }),\n\n editor.registerCommand(\n SELECTION_CHANGE_COMMAND,\n () => {\n void $updateLinkEditor()\n return true\n },\n COMMAND_PRIORITY_LOW,\n ),\n editor.registerCommand(\n KEY_ESCAPE_COMMAND,\n () => {\n if (isLink) {\n setNotLink()\n\n return true\n }\n return false\n },\n COMMAND_PRIORITY_HIGH,\n ),\n )\n }, [editor, $updateLinkEditor, isLink, setNotLink])\n\n useEffect(() => {\n editor.getEditorState().read(() => {\n void $updateLinkEditor()\n })\n }, [editor, $updateLinkEditor])\n\n return (\n <React.Fragment>\n <div className=\"link-editor\" ref={editorRef}>\n <div className=\"link-input\">\n {linkUrl && linkUrl.length > 0 ? (\n <a href={linkUrl} rel=\"noopener noreferrer\" target=\"_blank\">\n {linkLabel != null && linkLabel.length > 0 ? linkLabel : linkUrl}\n </a>\n ) : linkLabel != null && linkLabel.length > 0 ? (\n <span className=\"link-input__label-pure\">{linkLabel}</span>\n ) : null}\n\n {editor.isEditable() && (\n <React.Fragment>\n <button\n aria-label=\"Edit link\"\n className=\"link-edit\"\n onClick={() => {\n toggleModal(drawerSlug)\n }}\n onMouseDown={(event) => {\n event.preventDefault()\n }}\n tabIndex={0}\n type=\"button\"\n >\n <EditIcon />\n </button>\n {!isAutoLink && (\n <button\n aria-label=\"Remove link\"\n className=\"link-trash\"\n onClick={() => {\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, null)\n }}\n onMouseDown={(event) => {\n event.preventDefault()\n }}\n tabIndex={0}\n type=\"button\"\n >\n <CloseMenuIcon />\n </button>\n )}\n </React.Fragment>\n )}\n </div>\n </div>\n <FieldsDrawer\n className=\"lexical-link-edit-drawer\"\n data={stateData}\n drawerSlug={drawerSlug}\n drawerTitle={t('fields:editLink')}\n featureKey=\"link\"\n handleDrawerSubmit={(fields: FormState, data: Data) => {\n closeModal(drawerSlug)\n\n const newLinkPayload = data as { text: string } & LinkFields\n\n const bareLinkFields: LinkFields = {\n ...newLinkPayload,\n }\n delete bareLinkFields.text\n\n // See: https://github.com/facebook/lexical/pull/5536. This updates autolink nodes to link nodes whenever a change was made (which is good!).\n editor.update(() => {\n const selection = $getSelection()\n let linkParent = null\n if ($isRangeSelection(selection)) {\n linkParent = getSelectedNode(selection).getParent()\n } else {\n if (selectedNodes.length) {\n linkParent = selectedNodes[0].getParent()\n }\n }\n\n if (linkParent && $isAutoLinkNode(linkParent)) {\n const linkNode = $createLinkNode({\n fields: bareLinkFields,\n })\n linkParent.replace(linkNode, true)\n }\n })\n\n // Needs to happen AFTER a potential auto link => link node conversion, as otherwise, the updated text to display may be lost due to\n // it being applied to the auto link node instead of the link node.\n editor.dispatchCommand(TOGGLE_LINK_COMMAND, {\n fields: bareLinkFields,\n selectedNodes,\n text: newLinkPayload.text,\n })\n }}\n schemaPathSuffix=\"fields\"\n />\n </React.Fragment>\n )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/migrations/slateToLexical/converter/converters/link/converter.js CHANGED Viewed

@@ -18,7 +18,7 @@ export const SlateLinkConverter = {
         doc: slateNode.doc || null,
         linkType: slateNode.linkType || 'custom',
         newTab: slateNode.newTab || false,
-        url: slateNode.url || undefined
+        url: (slateNode.linkType || 'custom') === 'custom' ? slateNode.url || 'https' : undefined
       },
       format: '',
       indent: 0,

package/dist/features/migrations/slateToLexical/converter/converters/link/converter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"converter.js","names":["convertSlateNodesToLexical","SlateLinkConverter","converter","converters","slateNode","type","children","canContainParagraphs","parentNodeType","slateNodes","direction","fields","doc","linkType","newTab","url","undefined","format","indent","version","nodeTypes"],"sources":["../../../../../../../src/features/migrations/slateToLexical/converter/converters/link/converter.ts"],"sourcesContent":["import type { SerializedLinkNode } from '../../../../../link/nodes/types.js'\nimport type { SlateNodeConverter } from '../../types.js'\n\nimport { convertSlateNodesToLexical } from '../../index.js'\n\nexport const SlateLinkConverter: SlateNodeConverter = {\n converter({ converters, slateNode }) {\n return {\n type: 'link',\n children: convertSlateNodesToLexical({\n canContainParagraphs: false,\n converters,\n parentNodeType: 'link',\n slateNodes: slateNode.children,\n }),\n direction: 'ltr',\n fields: {\n ...(slateNode.fields \|\| {}),\n doc: slateNode.doc \|\| null,\n linkType: slateNode.linkType \|\| 'custom',\n newTab: slateNode.newTab \|\| false,\n url: slateNode.url \|\| undefined,\n },\n format: '',\n indent: 0,\n version: 2,\n } as const as SerializedLinkNode\n },\n nodeTypes: ['link'],\n}\n"],"mappings":"AAGA,SAASA,0BAA0B,QAAQ;AAE3C,OAAO,MAAMC,kBAAA,GAAyC;EACpDC,UAAU;IAAEC,UAAU;IAAEC;EAAS,CAAE;IACjC,OAAO;MACLC,IAAA,EAAM;MACNC,QAAA,EAAUN,0BAAA,CAA2B;QACnCO,oBAAA,EAAsB;QACtBJ,UAAA;QACAK,cAAA,EAAgB;QAChBC,UAAA,EAAYL,SAAA,CAAUE;MACxB;MACAI,SAAA,EAAW;MACXC,MAAA,EAAQ;QACN,IAAIP,SAAA,CAAUO,MAAM,IAAI,CAAC,CAAC;QAC1BC,GAAA,EAAKR,SAAA,CAAUQ,GAAG,IAAI;QACtBC,QAAA,EAAUT,SAAA,CAAUS,QAAQ,IAAI;QAChCC,MAAA,EAAQV,SAAA,CAAUU,MAAM,IAAI;QAC5BC,GAAA,~~EAAKX~~,SAAA,CAAUW,GAAG,~~IAAIC~~;~~MACxB~~;MACAC,MAAA,EAAQ;MACRC,MAAA,EAAQ;MACRC,OAAA,EAAS;IACX;EACF;EACAC,SAAA,EAAW,CAAC;AACd","ignoreList":[]}
1	+ {"version":3,"file":"converter.js","names":["convertSlateNodesToLexical","SlateLinkConverter","converter","converters","slateNode","type","children","canContainParagraphs","parentNodeType","slateNodes","direction","fields","doc","linkType","newTab","url","undefined","format","indent","version","nodeTypes"],"sources":["../../../../../../../src/features/migrations/slateToLexical/converter/converters/link/converter.ts"],"sourcesContent":["import type { SerializedLinkNode } from '../../../../../link/nodes/types.js'\nimport type { SlateNodeConverter } from '../../types.js'\n\nimport { convertSlateNodesToLexical } from '../../index.js'\n\nexport const SlateLinkConverter: SlateNodeConverter = {\n converter({ converters, slateNode }) {\n return {\n type: 'link',\n children: convertSlateNodesToLexical({\n canContainParagraphs: false,\n converters,\n parentNodeType: 'link',\n slateNodes: slateNode.children,\n }),\n direction: 'ltr',\n fields: {\n ...(slateNode.fields \|\| {}),\n doc: slateNode.doc \|\| null,\n linkType: slateNode.linkType \|\| 'custom',\n newTab: slateNode.newTab \|\| false,\n url: (slateNode.linkType \|\| 'custom') === 'custom' ? slateNode.url \|\| 'https' : undefined, // can be undefined only if linkType is not custom, otherwise: validation error\n },\n format: '',\n indent: 0,\n version: 2,\n } as const as SerializedLinkNode\n },\n nodeTypes: ['link'],\n}\n"],"mappings":"AAGA,SAASA,0BAA0B,QAAQ;AAE3C,OAAO,MAAMC,kBAAA,GAAyC;EACpDC,UAAU;IAAEC,UAAU;IAAEC;EAAS,CAAE;IACjC,OAAO;MACLC,IAAA,EAAM;MACNC,QAAA,EAAUN,0BAAA,CAA2B;QACnCO,oBAAA,EAAsB;QACtBJ,UAAA;QACAK,cAAA,EAAgB;QAChBC,UAAA,EAAYL,SAAA,CAAUE;MACxB;MACAI,SAAA,EAAW;MACXC,MAAA,EAAQ;QACN,IAAIP,SAAA,CAAUO,MAAM,IAAI,CAAC,CAAC;QAC1BC,GAAA,EAAKR,SAAA,CAAUQ,GAAG,IAAI;QACtBC,QAAA,EAAUT,SAAA,CAAUS,QAAQ,IAAI;QAChCC,MAAA,EAAQV,SAAA,CAAUU,MAAM,IAAI;QAC5BC,GAAA,EAAK,CAACX,SAAA,CAAUS,QAAQ,IAAI,QAAO,MAAO,WAAWT,SAAA,CAAUW,GAAG,IAAI,UAAUC;MAClF;MACAC,MAAA,EAAQ;MACRC,MAAA,EAAQ;MACRC,OAAA,EAAS;IACX;EACF;EACAC,SAAA,EAAW,CAAC;AACd","ignoreList":[]}

package/dist/features/relationship/client/components/RelationshipComponent.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RelationshipComponent.d.ts","sourceRoot":"","sources":["../../../../../src/features/relationship/client/components/RelationshipComponent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAgBhD,OAAO,KAA+D,MAAM,OAAO,CAAA;AAEnF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAA;AAK9E,OAAO,cAAc,CAAA;AAQrB,KAAK,KAAK,GAAG;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,gBAAgB,CAAA;IACtB,MAAM,CAAC,EAAE,iBAAiB,CAAA;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAA;~~AA8JD~~,eAAO,MAAM,qBAAqB,UAAW,KAAK,KAAG,KAAK,CAAC,SAE1D,CAAA"}
1	+ {"version":3,"file":"RelationshipComponent.d.ts","sourceRoot":"","sources":["../../../../../src/features/relationship/client/components/RelationshipComponent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAgBhD,OAAO,KAA+D,MAAM,OAAO,CAAA;AAEnF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAA;AAK9E,OAAO,cAAc,CAAA;AAQrB,KAAK,KAAK,GAAG;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,gBAAgB,CAAA;IACtB,MAAM,CAAC,EAAE,iBAAiB,CAAA;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAA;AAoKD,eAAO,MAAM,qBAAqB,UAAW,KAAK,KAAG,KAAK,CAAC,SAE1D,CAAA"}

package/dist/features/relationship/client/components/RelationshipComponent.js CHANGED Viewed

@@ -19,10 +19,13 @@ const Component = props => {
   const {
     data: {
       relationTo,
-      value: id
+      value
     },
     nodeKey
   } = props;
+  if (typeof value === 'object') {
+    throw new Error('Relationship value should be a string or number. The Lexical Relationship component should not receive the populated value object.');
+  }
   const relationshipElemRef = useRef(null);
   const [editor] = useLexicalComposerContext();
   const [isSelected, setSelected, clearSelection] = useLexicalNodeSelection(nodeKey);
@@ -48,13 +51,13 @@ const Component = props => {
     data
   }, {
     setParams
-  }] = usePayloadAPI(`${serverURL}${api}/${relatedCollection.slug}/${id}`, {
+  }] = usePayloadAPI(`${serverURL}${api}/${relatedCollection.slug}/${value}`, {
     initialParams
   });
   const [DocumentDrawer, DocumentDrawerToggler, {
     closeDrawer
   }] = useDocumentDrawer({
-    id,
+    id: value,
     collectionSlug: relatedCollection.slug
   });
   const removeRelationship = useCallback(() => {
@@ -118,7 +121,7 @@ const Component = props => {
         className: `${baseClass}__doc-drawer-toggler`,
         children: /*#__PURE__*/_jsx("p", {
           className: `${baseClass}__title`,
-          children: data ? data[relatedCollection?.admin?.useAsTitle || 'id'] : id
+          children: data ? data[relatedCollection?.admin?.useAsTitle || 'id'] : value
         })
       })]
     }), editor.isEditable() && /*#__PURE__*/_jsxs("div", {
@@ -150,7 +153,7 @@ const Component = props => {
         round: true,
         tooltip: t('fields:removeRelationship')
       })]
-    }), id && /*#__PURE__*/_jsx(DocumentDrawer, {
+    }), !!value && /*#__PURE__*/_jsx(DocumentDrawer, {
       onSave: updateRelationship
     })]
   });

package/dist/features/relationship/client/components/RelationshipComponent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RelationshipComponent.js","names":["useLexicalComposerContext","useLexicalNodeSelection","mergeRegister","getTranslation","Button","useConfig","useDocumentDrawer","usePayloadAPI","useTranslation","$getNodeByKey","$getSelection","$isNodeSelection","CLICK_COMMAND","COMMAND_PRIORITY_LOW","KEY_BACKSPACE_COMMAND","KEY_DELETE_COMMAND","React","useCallback","useEffect","useReducer","useRef","useState","useEditorConfigContext","INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND","$isRelationshipNode","baseClass","initialParams","depth","Component","props","data","relationTo","value","id","nodeKey","relationshipElemRef","editor","isSelected","setSelected","clearSelection","field","config","collections","routes","api","serverURL","relatedCollection","setRelatedCollection","find","coll","slug","i18n","t","cacheBust","dispatchCacheBust","state","setParams","DocumentDrawer","DocumentDrawerToggler","closeDrawer","collectionSlug","removeRelationship","update","remove","updateRelationship","doc","$onDelete","payload","event","preventDefault","node","onClick","target","current","contains","shiftKey","registerCommand","_jsxs","className","filter","Boolean","join","contentEditable","ref","_jsx","label","labels","singular","admin","useAsTitle","isEditable","buttonStyle","disabled","readOnly","el","icon","dispatchCommand","replace","round","tooltip","e","onSave","RelationshipComponent"],"sources":["../../../../../src/features/relationship/client/components/RelationshipComponent.tsx"],"sourcesContent":["'use client'\nimport type { ElementFormatType } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { useLexicalNodeSelection } from '@lexical/react/useLexicalNodeSelection.js'\nimport { mergeRegister } from '@lexical/utils'\nimport { getTranslation } from '@payloadcms/translations'\nimport { Button, useConfig, useDocumentDrawer, usePayloadAPI, useTranslation } from '@payloadcms/ui'\nimport {\n $getNodeByKey,\n $getSelection,\n $isNodeSelection,\n CLICK_COMMAND,\n COMMAND_PRIORITY_LOW,\n KEY_BACKSPACE_COMMAND,\n KEY_DELETE_COMMAND,\n} from 'lexical'\nimport React, { useCallback, useEffect, useReducer, useRef, useState } from 'react'\n\nimport type { RelationshipData } from '../../server/nodes/RelationshipNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND } from '../drawer/commands.js'\nimport { $isRelationshipNode } from '../nodes/RelationshipNode.js'\nimport './index.scss'\n\nconst baseClass = 'lexical-relationship'\n\nconst initialParams = {\n depth: 0,\n}\n\ntype Props = {\n className?: string\n data: RelationshipData\n format?: ElementFormatType\n nodeKey?: string\n}\n\nconst Component: React.FC<Props> = (props) => {\n const {\n data: { relationTo, value: id },\n nodeKey,\n } = props\n\n const relationshipElemRef = useRef<HTMLDivElement \| null>(null)\n\n const [editor] = useLexicalComposerContext()\n const [isSelected, setSelected, clearSelection] = useLexicalNodeSelection(nodeKey)\n const { field } = useEditorConfigContext()\n const {\n config: {\n collections,\n routes: { api },\n serverURL,\n },\n } = useConfig()\n\n const [relatedCollection, setRelatedCollection] = useState(() =>\n collections.find((coll) => coll.slug === relationTo),\n )\n\n const { i18n, t } = useTranslation()\n const [cacheBust, dispatchCacheBust] = useReducer((state) => state + 1, 0)\n const [{ data }, { setParams }] = usePayloadAPI(\n `${serverURL}${api}/${relatedCollection.slug}/${id}`,\n { initialParams },\n )\n\n const [DocumentDrawer, DocumentDrawerToggler, { closeDrawer }] = useDocumentDrawer({\n id,\n collectionSlug: relatedCollection.slug,\n })\n\n const removeRelationship = useCallback(() => {\n editor.update(() => {\n $getNodeByKey(nodeKey).remove()\n })\n }, [editor, nodeKey])\n\n const updateRelationship = React.useCallback(\n ({ doc }) => {\n setParams({\n ...initialParams,\n cacheBust, // do this to get the usePayloadAPI to re-fetch the data even though the URL string hasn't changed\n })\n\n closeDrawer()\n dispatchCacheBust()\n },\n [cacheBust, setParams, closeDrawer],\n )\n\n const $onDelete = useCallback(\n (payload: KeyboardEvent) => {\n if (isSelected && $isNodeSelection($getSelection())) {\n const event: KeyboardEvent = payload\n event.preventDefault()\n const node = $getNodeByKey(nodeKey)\n if ($isRelationshipNode(node)) {\n node.remove()\n return true\n }\n }\n return false\n },\n [isSelected, nodeKey],\n )\n const onClick = useCallback(\n (payload: MouseEvent) => {\n const event = payload\n // Check if relationshipElemRef.target or anything WITHIN relationshipElemRef.target was clicked\n if (\n event.target === relationshipElemRef.current \|\|\n relationshipElemRef.current?.contains(event.target as Node)\n ) {\n if (event.shiftKey) {\n setSelected(!isSelected)\n } else {\n if (!isSelected) {\n clearSelection()\n setSelected(true)\n }\n }\n return true\n }\n\n return false\n },\n [isSelected, setSelected, clearSelection],\n )\n\n useEffect(() => {\n return mergeRegister(\n editor.registerCommand<MouseEvent>(CLICK_COMMAND, onClick, COMMAND_PRIORITY_LOW),\n\n editor.registerCommand(KEY_DELETE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n editor.registerCommand(KEY_BACKSPACE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n )\n }, [clearSelection, editor, isSelected, nodeKey, $onDelete, setSelected, onClick])\n\n return (\n <div\n className={[baseClass, isSelected && `${baseClass}--selected`].filter(Boolean).join(' ')}\n contentEditable={false}\n ref={relationshipElemRef}\n >\n <div className={`${baseClass}__wrap`}>\n <p className={`${baseClass}__label`}>\n {t('fields:labelRelationship', {\n label: getTranslation(relatedCollection.labels.singular, i18n),\n })}\n </p>\n <DocumentDrawerToggler className={`${baseClass}__doc-drawer-toggler`}>\n <p className={`${baseClass}__title`}>\n {data ? data[relatedCollection?.admin?.useAsTitle \|\| 'id'] : id}\n </p>\n </DocumentDrawerToggler>\n </div>\n {editor.isEditable() && (\n <div className={`${baseClass}__actions`}>\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__swapButton`}\n disabled={field?.admin?.readOnly}\n el=\"div\"\n icon=\"swap\"\n onClick={() => {\n editor.dispatchCommand(INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND, {\n replace: { nodeKey },\n })\n }}\n round\n tooltip={t('fields:swapRelationship')}\n />\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__removeButton`}\n disabled={field?.admin?.readOnly}\n icon=\"x\"\n onClick={(e) => {\n e.preventDefault()\n removeRelationship()\n }}\n round\n tooltip={t('fields:removeRelationship')}\n />\n </div>\n )}\n\n {id && <DocumentDrawer onSave={updateRelationship} />}\n </div>\n )\n}\n\nexport const RelationshipComponent = (props: Props): React.ReactNode => {\n return <Component {...props} />\n}\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"RelationshipComponent.js","names":["useLexicalComposerContext","useLexicalNodeSelection","mergeRegister","getTranslation","Button","useConfig","useDocumentDrawer","usePayloadAPI","useTranslation","$getNodeByKey","$getSelection","$isNodeSelection","CLICK_COMMAND","COMMAND_PRIORITY_LOW","KEY_BACKSPACE_COMMAND","KEY_DELETE_COMMAND","React","useCallback","useEffect","useReducer","useRef","useState","useEditorConfigContext","INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND","$isRelationshipNode","baseClass","initialParams","depth","Component","props","data","relationTo","value","nodeKey","Error","relationshipElemRef","editor","isSelected","setSelected","clearSelection","field","config","collections","routes","api","serverURL","relatedCollection","setRelatedCollection","find","coll","slug","i18n","t","cacheBust","dispatchCacheBust","state","setParams","DocumentDrawer","DocumentDrawerToggler","closeDrawer","id","collectionSlug","removeRelationship","update","remove","updateRelationship","doc","$onDelete","payload","event","preventDefault","node","onClick","target","current","contains","shiftKey","registerCommand","_jsxs","className","filter","Boolean","join","contentEditable","ref","_jsx","label","labels","singular","admin","useAsTitle","isEditable","buttonStyle","disabled","readOnly","el","icon","dispatchCommand","replace","round","tooltip","e","onSave","RelationshipComponent"],"sources":["../../../../../src/features/relationship/client/components/RelationshipComponent.tsx"],"sourcesContent":["'use client'\nimport type { ElementFormatType } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { useLexicalNodeSelection } from '@lexical/react/useLexicalNodeSelection.js'\nimport { mergeRegister } from '@lexical/utils'\nimport { getTranslation } from '@payloadcms/translations'\nimport { Button, useConfig, useDocumentDrawer, usePayloadAPI, useTranslation } from '@payloadcms/ui'\nimport {\n $getNodeByKey,\n $getSelection,\n $isNodeSelection,\n CLICK_COMMAND,\n COMMAND_PRIORITY_LOW,\n KEY_BACKSPACE_COMMAND,\n KEY_DELETE_COMMAND,\n} from 'lexical'\nimport React, { useCallback, useEffect, useReducer, useRef, useState } from 'react'\n\nimport type { RelationshipData } from '../../server/nodes/RelationshipNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND } from '../drawer/commands.js'\nimport { $isRelationshipNode } from '../nodes/RelationshipNode.js'\nimport './index.scss'\n\nconst baseClass = 'lexical-relationship'\n\nconst initialParams = {\n depth: 0,\n}\n\ntype Props = {\n className?: string\n data: RelationshipData\n format?: ElementFormatType\n nodeKey?: string\n}\n\nconst Component: React.FC<Props> = (props) => {\n const {\n data: { relationTo, value },\n nodeKey,\n } = props\n\n if (typeof value === 'object') {\n throw new Error(\n 'Relationship value should be a string or number. The Lexical Relationship component should not receive the populated value object.',\n )\n }\n\n const relationshipElemRef = useRef<HTMLDivElement \| null>(null)\n\n const [editor] = useLexicalComposerContext()\n const [isSelected, setSelected, clearSelection] = useLexicalNodeSelection(nodeKey)\n const { field } = useEditorConfigContext()\n const {\n config: {\n collections,\n routes: { api },\n serverURL,\n },\n } = useConfig()\n\n const [relatedCollection, setRelatedCollection] = useState(() =>\n collections.find((coll) => coll.slug === relationTo),\n )\n\n const { i18n, t } = useTranslation()\n const [cacheBust, dispatchCacheBust] = useReducer((state) => state + 1, 0)\n const [{ data }, { setParams }] = usePayloadAPI(\n `${serverURL}${api}/${relatedCollection.slug}/${value}`,\n { initialParams },\n )\n\n const [DocumentDrawer, DocumentDrawerToggler, { closeDrawer }] = useDocumentDrawer({\n id: value,\n collectionSlug: relatedCollection.slug,\n })\n\n const removeRelationship = useCallback(() => {\n editor.update(() => {\n $getNodeByKey(nodeKey).remove()\n })\n }, [editor, nodeKey])\n\n const updateRelationship = React.useCallback(\n ({ doc }) => {\n setParams({\n ...initialParams,\n cacheBust, // do this to get the usePayloadAPI to re-fetch the data even though the URL string hasn't changed\n })\n\n closeDrawer()\n dispatchCacheBust()\n },\n [cacheBust, setParams, closeDrawer],\n )\n\n const $onDelete = useCallback(\n (payload: KeyboardEvent) => {\n if (isSelected && $isNodeSelection($getSelection())) {\n const event: KeyboardEvent = payload\n event.preventDefault()\n const node = $getNodeByKey(nodeKey)\n if ($isRelationshipNode(node)) {\n node.remove()\n return true\n }\n }\n return false\n },\n [isSelected, nodeKey],\n )\n const onClick = useCallback(\n (payload: MouseEvent) => {\n const event = payload\n // Check if relationshipElemRef.target or anything WITHIN relationshipElemRef.target was clicked\n if (\n event.target === relationshipElemRef.current \|\|\n relationshipElemRef.current?.contains(event.target as Node)\n ) {\n if (event.shiftKey) {\n setSelected(!isSelected)\n } else {\n if (!isSelected) {\n clearSelection()\n setSelected(true)\n }\n }\n return true\n }\n\n return false\n },\n [isSelected, setSelected, clearSelection],\n )\n\n useEffect(() => {\n return mergeRegister(\n editor.registerCommand<MouseEvent>(CLICK_COMMAND, onClick, COMMAND_PRIORITY_LOW),\n\n editor.registerCommand(KEY_DELETE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n editor.registerCommand(KEY_BACKSPACE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n )\n }, [clearSelection, editor, isSelected, nodeKey, $onDelete, setSelected, onClick])\n\n return (\n <div\n className={[baseClass, isSelected && `${baseClass}--selected`].filter(Boolean).join(' ')}\n contentEditable={false}\n ref={relationshipElemRef}\n >\n <div className={`${baseClass}__wrap`}>\n <p className={`${baseClass}__label`}>\n {t('fields:labelRelationship', {\n label: getTranslation(relatedCollection.labels.singular, i18n),\n })}\n </p>\n <DocumentDrawerToggler className={`${baseClass}__doc-drawer-toggler`}>\n <p className={`${baseClass}__title`}>\n {data ? data[relatedCollection?.admin?.useAsTitle \|\| 'id'] : value}\n </p>\n </DocumentDrawerToggler>\n </div>\n {editor.isEditable() && (\n <div className={`${baseClass}__actions`}>\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__swapButton`}\n disabled={field?.admin?.readOnly}\n el=\"div\"\n icon=\"swap\"\n onClick={() => {\n editor.dispatchCommand(INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND, {\n replace: { nodeKey },\n })\n }}\n round\n tooltip={t('fields:swapRelationship')}\n />\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__removeButton`}\n disabled={field?.admin?.readOnly}\n icon=\"x\"\n onClick={(e) => {\n e.preventDefault()\n removeRelationship()\n }}\n round\n tooltip={t('fields:removeRelationship')}\n />\n </div>\n )}\n\n {!!value && <DocumentDrawer onSave={updateRelationship} />}\n </div>\n )\n}\n\nexport const RelationshipComponent = (props: Props): React.ReactNode => {\n return <Component {...props} />\n}\n"],"mappings":"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","ignoreList":[]}