@payloadcms/richtext-lexical 3.41.0-canary.1 → 3.41.0-internal.72eae46

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

@@ -20,7 +20,7 @@ export const BlocksPlugin = () => {
     uuid
   } = useEditorConfigContext();
   const editDepth = useEditDepth();
-  const t0 = `lexical-inlineBlocks-create-` + uuid;
+  const t0 = "lexical-inlineBlocks-create-" + uuid;
   let t1;
   if ($[0] !== editDepth || $[1] !== t0) {
     t1 = formatDrawerSlug({

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

@@ -78,8 +78,7 @@ export const TablePlugin = () => {
         throw new Error("TablePlugin: TableNode, TableRowNode, or TableCellNode is not registered on editor");
       }
       return mergeRegister(editor.registerCommand(OPEN_TABLE_DRAWER_COMMAND, () => {
-        let rangeSelection;
-        rangeSelection = null;
+        let rangeSelection = null;
         editor.getEditorState().read(() => {
           const selection = $getSelection();
           if ($isRangeSelection(selection)) {

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","TablePlugin","LexicalReactTablePlugin","INSERT_TABLE_COMMAND","TableCellNode","TableNode","TableRowNode","mergeRegister","formatDrawerSlug","useEditDepth","$getSelection","$isRangeSelection","COMMAND_PRIORITY_EDITOR","createCommand","createContext","use","useEffect","useMemo","useState","React","useEditorConfigContext","FieldsDrawer","useLexicalDrawer","OPEN_TABLE_DRAWER_COMMAND","CellContext","cellEditorConfig","cellEditorPlugins","set","TableContext","children","contextValue","setContextValue","_jsx","value","$","editor","cellContext","editDepth","fieldProps","t0","uuid","schemaPath","t1","t2","slug","depth","drawerSlug","toggleDrawer","t3","hasNodes","Error","registerCommand","rangeSelection","getEditorState","read","selection","t4","t5","_fields","data","columns","rows","dispatchCommand","String","t6","_jsxs","Fragment","drawerTitle","featureKey","handleDrawerSubmit","schemaPathSuffix","hasCellBackgroundColor","hasCellMerge","hasHorizontalScroll"],"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, TableCellNode, TableNode, TableRowNode } from '@lexical/table'\nimport { mergeRegister } from '@lexical/utils'\nimport { formatDrawerSlug, useEditDepth } from '@payloadcms/ui'\nimport { $getSelection, $isRangeSelection, COMMAND_PRIORITY_EDITOR, createCommand } from 'lexical'\nimport { createContext, use, 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 { useLexicalDrawer } from '../../../../../utilities/fieldsDrawer/useLexicalDrawer.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\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>\n  )\n}\n\nexport const TablePlugin: PluginComponent = () => {\n  const [editor] = useLexicalComposerContext()\n  const cellContext = use(CellContext)\n  const editDepth = useEditDepth()\n  const {\n    fieldProps: { schemaPath },\n    uuid,\n  } = useEditorConfigContext()\n\n  const drawerSlug = formatDrawerSlug({\n    slug: 'lexical-table-create-' + uuid,\n    depth: editDepth,\n  })\n  const { toggleDrawer } = useLexicalDrawer(drawerSlug, true)\n\n  useEffect(() => {\n    if (!editor.hasNodes([TableNode, TableRowNode, TableCellNode])) {\n      throw new Error(\n        'TablePlugin: TableNode, TableRowNode, or TableCellNode is not registered on editor',\n      )\n    }\n\n    return mergeRegister(\n      editor.registerCommand(\n        OPEN_TABLE_DRAWER_COMMAND,\n        () => {\n          let rangeSelection: null | RangeSelection = null\n\n          editor.getEditorState().read(() => {\n            const selection = $getSelection()\n            if ($isRangeSelection(selection)) {\n              rangeSelection = selection\n            }\n          })\n\n          if (rangeSelection) {\n            toggleDrawer()\n          }\n          return true\n        },\n        COMMAND_PRIORITY_EDITOR,\n      ),\n    )\n  }, [cellContext, editor, toggleDrawer])\n\n  return (\n    <React.Fragment>\n      <FieldsDrawer\n        drawerSlug={drawerSlug}\n        drawerTitle=\"Create Table\"\n        featureKey=\"experimental_table\"\n        handleDrawerSubmit={(_fields, data) => {\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        schemaPath={schemaPath}\n        schemaPathSuffix=\"fields\"\n      />\n      <LexicalReactTablePlugin\n        hasCellBackgroundColor={false}\n        hasCellMerge\n        hasHorizontalScroll={true}\n      />\n    </React.Fragment>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","TablePlugin","LexicalReactTablePlugin","INSERT_TABLE_COMMAND","TableCellNode","TableNode","TableRowNode","mergeRegister","formatDrawerSlug","useEditDepth","$getSelection","$isRangeSelection","COMMAND_PRIORITY_EDITOR","createCommand","createContext","use","useEffect","useMemo","useState","React","useEditorConfigContext","FieldsDrawer","useLexicalDrawer","OPEN_TABLE_DRAWER_COMMAND","CellContext","cellEditorConfig","cellEditorPlugins","set","TableContext","children","contextValue","setContextValue","_jsx","value","$","editor","cellContext","editDepth","fieldProps","t0","uuid","schemaPath","t1","t2","slug","depth","drawerSlug","toggleDrawer","t3","hasNodes","Error","registerCommand","rangeSelection","getEditorState","read","selection","t4","t5","_fields","data","columns","rows","dispatchCommand","String","t6","_jsxs","Fragment","drawerTitle","featureKey","handleDrawerSubmit","schemaPathSuffix","hasCellBackgroundColor","hasCellMerge","hasHorizontalScroll"],"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, TableCellNode, TableNode, TableRowNode } from '@lexical/table'\nimport { mergeRegister } from '@lexical/utils'\nimport { formatDrawerSlug, useEditDepth } from '@payloadcms/ui'\nimport { $getSelection, $isRangeSelection, COMMAND_PRIORITY_EDITOR, createCommand } from 'lexical'\nimport { createContext, use, 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 { useLexicalDrawer } from '../../../../../utilities/fieldsDrawer/useLexicalDrawer.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\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>\n  )\n}\n\nexport const TablePlugin: PluginComponent = () => {\n  const [editor] = useLexicalComposerContext()\n  const cellContext = use(CellContext)\n  const editDepth = useEditDepth()\n  const {\n    fieldProps: { schemaPath },\n    uuid,\n  } = useEditorConfigContext()\n\n  const drawerSlug = formatDrawerSlug({\n    slug: 'lexical-table-create-' + uuid,\n    depth: editDepth,\n  })\n  const { toggleDrawer } = useLexicalDrawer(drawerSlug, true)\n\n  useEffect(() => {\n    if (!editor.hasNodes([TableNode, TableRowNode, TableCellNode])) {\n      throw new Error(\n        'TablePlugin: TableNode, TableRowNode, or TableCellNode is not registered on editor',\n      )\n    }\n\n    return mergeRegister(\n      editor.registerCommand(\n        OPEN_TABLE_DRAWER_COMMAND,\n        () => {\n          let rangeSelection: null | RangeSelection = null\n\n          editor.getEditorState().read(() => {\n            const selection = $getSelection()\n            if ($isRangeSelection(selection)) {\n              rangeSelection = selection\n            }\n          })\n\n          if (rangeSelection) {\n            toggleDrawer()\n          }\n          return true\n        },\n        COMMAND_PRIORITY_EDITOR,\n      ),\n    )\n  }, [cellContext, editor, toggleDrawer])\n\n  return (\n    <React.Fragment>\n      <FieldsDrawer\n        drawerSlug={drawerSlug}\n        drawerTitle=\"Create Table\"\n        featureKey=\"experimental_table\"\n        handleDrawerSubmit={(_fields, data) => {\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        schemaPath={schemaPath}\n        schemaPathSuffix=\"fields\"\n      />\n      <LexicalReactTablePlugin\n        hasCellBackgroundColor={false}\n        hasCellMerge\n        hasHorizontalScroll={true}\n      />\n    </React.Fragment>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/toolbars/shared/ToolbarButton/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/toolbars/shared/ToolbarButton/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAI5C,OAAO,KAA2C,MAAM,OAAO,CAAA;AAE/D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAGtD,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,aAAa,gCAIvB;IACD,QAAQ,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAA;IAC3B,MAAM,EAAE,aAAa,CAAA;IACrB,IAAI,EAAE,gBAAgB,CAAA;CACvB,sBAyFA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/toolbars/shared/ToolbarButton/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAI5C,OAAO,KAAsE,MAAM,OAAO,CAAA;AAE1F,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAGtD,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,aAAa,gCAIvB;IACD,QAAQ,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAA;IAC3B,MAAM,EAAE,aAAa,CAAA;IACrB,IAAI,EAAE,gBAAgB,CAAA;CACvB,sBA+EA,CAAA"}

package/dist/features/toolbars/shared/ToolbarButton/index.js

@@ -4,170 +4,142 @@ import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { mergeRegister } from '@lexical/utils';
 import { $addUpdateTag, $getSelection } from 'lexical';
-import React, { useCallback, useEffect, useState } from 'react';
+import React, { useCallback, useDeferredValue, useEffect, useMemo, useState } from 'react';
 import { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js';
 const baseClass = 'toolbar-popup__button';
 export const ToolbarButton = t0 => {
-  const $ = _c(34);
+  const $ = _c(21);
   const {
     children,
     editor,
     item
   } = t0;
-  const [enabled, setEnabled] = useState(true);
-  const [active, setActive] = useState(false);
-  const [className, setClassName] = useState(baseClass);
-  const editorConfigContext = useEditorConfigContext();
   let t1;
-  if ($[0] !== active || $[1] !== editor || $[2] !== editorConfigContext || $[3] !== enabled || $[4] !== item) {
-    t1 = () => {
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = {
+      active: false,
+      enabled: true
+    };
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  const [_state, setState] = useState(t1);
+  const deferredState = useDeferredValue(_state);
+  const editorConfigContext = useEditorConfigContext();
+  let t2;
+  const t3 = !deferredState.enabled ? "disabled" : "";
+  const t4 = deferredState.active ? "active" : "";
+  const t5 = item.key ? `${baseClass}-${item.key}` : "";
+  let t6;
+  if ($[1] !== t3 || $[2] !== t4 || $[3] !== t5) {
+    t6 = [baseClass, t3, t4, t5].filter(Boolean);
+    $[1] = t3;
+    $[2] = t4;
+    $[3] = t5;
+    $[4] = t6;
+  } else {
+    t6 = $[4];
+  }
+  t2 = t6.join(" ");
+  const className = t2;
+  let t7;
+  if ($[5] !== editor || $[6] !== editorConfigContext || $[7] !== item) {
+    t7 = () => {
       editor.getEditorState().read(() => {
         const selection = $getSelection();
         if (!selection) {
           return;
         }
-        if (item.isActive) {
-          const isActive = item.isActive({
-            editor,
-            editorConfigContext,
-            selection
-          });
-          if (active !== isActive) {
-            setActive(isActive);
-          }
-        }
-        if (item.isEnabled) {
-          const isEnabled = item.isEnabled({
-            editor,
-            editorConfigContext,
-            selection
-          });
-          if (enabled !== isEnabled) {
-            setEnabled(isEnabled);
+        const newActive = item.isActive ? item.isActive({
+          editor,
+          editorConfigContext,
+          selection
+        }) : false;
+        const newEnabled = item.isEnabled ? item.isEnabled({
+          editor,
+          editorConfigContext,
+          selection
+        }) : true;
+        setState(prev => {
+          if (prev.active === newActive && prev.enabled === newEnabled) {
+            return prev;
           }
-        }
+          return {
+            active: newActive,
+            enabled: newEnabled
+          };
+        });
       });
     };
-    $[0] = active;
-    $[1] = editor;
-    $[2] = editorConfigContext;
-    $[3] = enabled;
-    $[4] = item;
-    $[5] = t1;
-  } else {
-    t1 = $[5];
-  }
-  const updateStates = t1;
-  let t2;
-  let t3;
-  if ($[6] !== updateStates) {
-    t2 = () => {
-      updateStates();
-    };
-    t3 = [updateStates];
-    $[6] = updateStates;
-    $[7] = t2;
-    $[8] = t3;
+    $[5] = editor;
+    $[6] = editorConfigContext;
+    $[7] = item;
+    $[8] = t7;
   } else {
-    t2 = $[7];
-    t3 = $[8];
+    t7 = $[8];
   }
-  useEffect(t2, t3);
-  let t4;
-  let t5;
-  if ($[9] !== updateStates) {
-    t4 = () => {
+  const updateStates = t7;
+  let t8;
+  let t9;
+  if ($[9] !== editor || $[10] !== updateStates) {
+    t8 = () => {
+      const listener = () => requestIdleCallback(updateStates);
+      const cleanup = mergeRegister(editor.registerUpdateListener(listener));
       document.addEventListener("mouseup", updateStates);
       return () => {
+        cleanup();
         document.removeEventListener("mouseup", updateStates);
       };
     };
-    t5 = [updateStates];
-    $[9] = updateStates;
-    $[10] = t4;
-    $[11] = t5;
-  } else {
-    t4 = $[10];
-    t5 = $[11];
-  }
-  useEffect(t4, t5);
-  let t6;
-  let t7;
-  if ($[12] !== editor || $[13] !== updateStates) {
-    t6 = () => mergeRegister(editor.registerUpdateListener(() => {
-      updateStates();
-    }));
-    t7 = [editor, updateStates];
-    $[12] = editor;
-    $[13] = updateStates;
-    $[14] = t6;
-    $[15] = t7;
-  } else {
-    t6 = $[14];
-    t7 = $[15];
-  }
-  useEffect(t6, t7);
-  let t8;
-  if ($[16] !== active || $[17] !== enabled || $[18] !== item.key) {
-    t8 = () => {
-      setClassName([baseClass, enabled === false ? "disabled" : "", active ? "active" : "", item?.key ? `${baseClass}-` + item.key : ""].filter(Boolean).join(" "));
-    };
-    $[16] = active;
-    $[17] = enabled;
-    $[18] = item.key;
-    $[19] = t8;
+    t9 = [editor, updateStates];
+    $[9] = editor;
+    $[10] = updateStates;
+    $[11] = t8;
+    $[12] = t9;
   } else {
-    t8 = $[19];
-  }
-  let t9;
-  if ($[20] !== active || $[21] !== className || $[22] !== enabled || $[23] !== item.key) {
-    t9 = [enabled, active, className, item.key];
-    $[20] = active;
-    $[21] = className;
-    $[22] = enabled;
-    $[23] = item.key;
-    $[24] = t9;
-  } else {
-    t9 = $[24];
+    t8 = $[11];
+    t9 = $[12];
   }
   useEffect(t8, t9);
   let t10;
-  if ($[25] !== active || $[26] !== editor || $[27] !== enabled || $[28] !== item) {
+  if ($[13] !== _state || $[14] !== editor || $[15] !== item) {
     t10 = () => {
-      if (enabled !== false) {
-        editor.focus(() => {
-          editor.update(_temp);
-          item.onSelect?.({
-            editor,
-            isActive: active
-          });
-        });
-        return true;
+      if (!_state.enabled) {
+        return;
       }
+      editor.focus(() => {
+        editor.update(_temp);
+        item.onSelect?.({
+          editor,
+          isActive: _state.active
+        });
+      });
     };
-    $[25] = active;
-    $[26] = editor;
-    $[27] = enabled;
-    $[28] = item;
-    $[29] = t10;
+    $[13] = _state;
+    $[14] = editor;
+    $[15] = item;
+    $[16] = t10;
   } else {
-    t10 = $[29];
+    t10 = $[16];
   }
+  const handleClick = t10;
+  const handleMouseDown = _temp2;
   let t11;
-  if ($[30] !== children || $[31] !== className || $[32] !== t10) {
+  if ($[17] !== children || $[18] !== className || $[19] !== handleClick) {
     t11 = _jsx("button", {
       className,
-      onClick: t10,
-      onMouseDown: _temp2,
+      onClick: handleClick,
+      onMouseDown: handleMouseDown,
       type: "button",
       children
     });
-    $[30] = children;
-    $[31] = className;
-    $[32] = t10;
-    $[33] = t11;
+    $[17] = children;
+    $[18] = className;
+    $[19] = handleClick;
+    $[20] = t11;
   } else {
-    t11 = $[33];
+    t11 = $[20];
   }
   return t11;
 };

package/dist/features/toolbars/shared/ToolbarButton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","mergeRegister","$addUpdateTag","$getSelection","React","useCallback","useEffect","useState","useEditorConfigContext","baseClass","ToolbarButton","t0","$","children","editor","item","enabled","setEnabled","active","setActive","className","setClassName","editorConfigContext","t1","getEditorState","read","selection","isActive","isEnabled","updateStates","t2","t3","t4","t5","document","addEventListener","removeEventListener","t6","t7","registerUpdateListener","t8","key","filter","Boolean","join","t9","t10","focus","update","_temp","onSelect","t11","_jsx","onClick","onMouseDown","_temp2","type","e","preventDefault"],"sources":["../../../../../src/features/toolbars/shared/ToolbarButton/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { mergeRegister } from '@lexical/utils'\nimport { $addUpdateTag, $getSelection } from 'lexical'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport type { ToolbarGroupItem } from '../../types.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport './index.scss'\n\nconst baseClass = 'toolbar-popup__button'\n\nexport const ToolbarButton = ({\n  children,\n  editor,\n  item,\n}: {\n  children: React.JSX.Element\n  editor: LexicalEditor\n  item: ToolbarGroupItem\n}) => {\n  const [enabled, setEnabled] = useState<boolean>(true)\n  const [active, setActive] = useState<boolean>(false)\n  const [className, setClassName] = useState<string>(baseClass)\n  const editorConfigContext = useEditorConfigContext()\n\n  const updateStates = useCallback(() => {\n    editor.getEditorState().read(() => {\n      const selection = $getSelection()\n      if (!selection) {\n        return\n      }\n      if (item.isActive) {\n        const isActive = item.isActive({ editor, editorConfigContext, selection })\n        if (active !== isActive) {\n          setActive(isActive)\n        }\n      }\n      if (item.isEnabled) {\n        const isEnabled = item.isEnabled({ editor, editorConfigContext, selection })\n        if (enabled !== isEnabled) {\n          setEnabled(isEnabled)\n        }\n      }\n    })\n  }, [active, editor, editorConfigContext, enabled, item])\n\n  useEffect(() => {\n    updateStates()\n  }, [updateStates])\n\n  useEffect(() => {\n    document.addEventListener('mouseup', updateStates)\n    return () => {\n      document.removeEventListener('mouseup', updateStates)\n    }\n  }, [updateStates])\n\n  useEffect(() => {\n    return mergeRegister(\n      editor.registerUpdateListener(() => {\n        updateStates()\n      }),\n    )\n  }, [editor, updateStates])\n\n  useEffect(() => {\n    setClassName(\n      [\n        baseClass,\n        enabled === false ? 'disabled' : '',\n        active ? 'active' : '',\n        item?.key ? `${baseClass}-` + item.key : '',\n      ]\n        .filter(Boolean)\n        .join(' '),\n    )\n  }, [enabled, active, className, item.key])\n\n  return (\n    <button\n      className={className}\n      onClick={() => {\n        if (enabled !== false) {\n          editor.focus(() => {\n            editor.update(() => {\n              $addUpdateTag('toolbar')\n            })\n            // We need to wrap the onSelect in the callback, so the editor is properly focused before the onSelect is called.\n            item.onSelect?.({\n              editor,\n              isActive: active,\n            })\n          })\n\n          return true\n        }\n      }}\n      onMouseDown={(e) => {\n        // This fixes a bug where you are unable to click the button if you are in a NESTED editor (editor in blocks field in editor).\n        // Thus only happens if you click on the SVG of the button. Clicking on the outside works. Related issue: https://github.com/payloadcms/payload/issues/4025\n        // TODO: Find out why exactly it happens and why e.preventDefault() on the mouseDown fixes it. Write that down here, or potentially fix a root cause, if there is any.\n        e.preventDefault()\n      }}\n      type=\"button\"\n    >\n      {children}\n    </button>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","mergeRegister","$addUpdateTag","$getSelection","React","useCallback","useDeferredValue","useEffect","useMemo","useState","useEditorConfigContext","baseClass","ToolbarButton","t0","$","children","editor","item","t1","Symbol","for","active","enabled","_state","setState","deferredState","editorConfigContext","t2","t3","t4","t5","key","t6","filter","Boolean","join","className","t7","getEditorState","read","selection","newActive","isActive","newEnabled","isEnabled","prev","updateStates","t8","t9","listener","requestIdleCallback","cleanup","registerUpdateListener","document","addEventListener","removeEventListener","t10","focus","update","_temp","onSelect","handleClick","handleMouseDown","_temp2","t11","_jsx","onClick","onMouseDown","type","e","preventDefault"],"sources":["../../../../../src/features/toolbars/shared/ToolbarButton/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { mergeRegister } from '@lexical/utils'\nimport { $addUpdateTag, $getSelection } from 'lexical'\nimport React, { useCallback, useDeferredValue, useEffect, useMemo, useState } from 'react'\n\nimport type { ToolbarGroupItem } from '../../types.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport './index.scss'\n\nconst baseClass = 'toolbar-popup__button'\n\nexport const ToolbarButton = ({\n  children,\n  editor,\n  item,\n}: {\n  children: React.JSX.Element\n  editor: LexicalEditor\n  item: ToolbarGroupItem\n}) => {\n  const [_state, setState] = useState({ active: false, enabled: true })\n  const deferredState = useDeferredValue(_state)\n\n  const editorConfigContext = useEditorConfigContext()\n\n  const className = useMemo(() => {\n    return [\n      baseClass,\n      !deferredState.enabled ? 'disabled' : '',\n      deferredState.active ? 'active' : '',\n      item.key ? `${baseClass}-${item.key}` : '',\n    ]\n      .filter(Boolean)\n      .join(' ')\n  }, [deferredState, item.key])\n  const updateStates = useCallback(() => {\n    editor.getEditorState().read(() => {\n      const selection = $getSelection()\n      if (!selection) {\n        return\n      }\n      const newActive = item.isActive\n        ? item.isActive({ editor, editorConfigContext, selection })\n        : false\n\n      const newEnabled = item.isEnabled\n        ? item.isEnabled({ editor, editorConfigContext, selection })\n        : true\n\n      setState((prev) => {\n        if (prev.active === newActive && prev.enabled === newEnabled) {\n          return prev\n        }\n        return { active: newActive, enabled: newEnabled }\n      })\n    })\n  }, [editor, editorConfigContext, item])\n\n  useEffect(() => {\n    const listener = () => requestIdleCallback(updateStates)\n    const cleanup = mergeRegister(editor.registerUpdateListener(listener))\n    document.addEventListener('mouseup', updateStates)\n\n    return () => {\n      cleanup()\n      document.removeEventListener('mouseup', updateStates)\n    }\n  }, [editor, updateStates])\n\n  const handleClick = useCallback(() => {\n    if (!_state.enabled) {\n      return\n    }\n\n    editor.focus(() => {\n      editor.update(() => {\n        $addUpdateTag('toolbar')\n      })\n      // We need to wrap the onSelect in the callback, so the editor is properly focused before the onSelect is called.\n      item.onSelect?.({\n        editor,\n        isActive: _state.active,\n      })\n    })\n  }, [editor, item, _state])\n\n  const handleMouseDown = useCallback((e: React.MouseEvent) => {\n    // This fixes a bug where you are unable to click the button if you are in a NESTED editor (editor in blocks field in editor).\n    // Thus only happens if you click on the SVG of the button. Clicking on the outside works. Related issue: https://github.com/payloadcms/payload/issues/4025\n    // TODO: Find out why exactly it happens and why e.preventDefault() on the mouseDown fixes it. Write that down here, or potentially fix a root cause, if there is any.\n    e.preventDefault()\n  }, [])\n\n  return (\n    <button className={className} onClick={handleClick} onMouseDown={handleMouseDown} type=\"button\">\n      {children}\n    </button>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/toolbars/shared/ToolbarDropdown/DropDown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropDown.d.ts","sourceRoot":"","sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/DropDown.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA4B,KAAK,aAAa,EAAE,MAAM,SAAS,CAAA;AACtE,OAAO,KAAK,EAAE,EAAE,KAAK,SAAS,EAAqD,MAAM,OAAO,CAAA;AAGhG,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAUtD,wBAAgB,YAAY,CAAC,EAC3B,MAAM,EACN,QAAQ,EACR,MAAM,EACN,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,OAAO,GACR,EAAE;IACD,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,MAAM,EAAE,aAAa,CAAA;IACrB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAA;IACrB,IAAI,EAAE,gBAAgB,CAAA;IACtB,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,GAAG,KAAK,CAAC,SAAS,CAmElB;AAqFD,wBAAgB,QAAQ,CAAC,EACvB,eAAe,EACf,eAAe,EACf,QAAQ,EACR,QAAgB,EAChB,IAAI,EACJ,wBAAwB,EACxB,KAAK,EACL,oBAAoB,GACrB,EAAE;IACD,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,eAAe,EAAE,MAAM,CAAA;IACvB,QAAQ,EAAE,SAAS,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;IACf,wBAAwB,CAAC,EAAE,MAAM,EAAE,CAAA;IACnC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oBAAoB,CAAC,EAAE,OAAO,CAAA;CAC/B,GAAG,KAAK,CAAC,SAAS,CAwFlB"}
+{"version":3,"file":"DropDown.d.ts","sourceRoot":"","sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/DropDown.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA4B,KAAK,aAAa,EAAE,MAAM,SAAS,CAAA;AACtE,OAAO,KAAK,EAAE,EAAE,KAAK,SAAS,EAAqD,MAAM,OAAO,CAAA;AAGhG,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAUtD,wBAAgB,YAAY,CAAC,EAC3B,MAAM,EACN,QAAQ,EACR,MAAM,EACN,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,OAAO,GACR,EAAE;IACD,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,MAAM,EAAE,aAAa,CAAA;IACrB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAA;IACrB,IAAI,EAAE,gBAAgB,CAAA;IACtB,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,GAAG,KAAK,CAAC,SAAS,CA+DlB;AAqFD,wBAAgB,QAAQ,CAAC,EACvB,eAAe,EACf,eAAe,EACf,QAAQ,EACR,QAAgB,EAChB,IAAI,EACJ,wBAAwB,EACxB,KAAK,EACL,oBAAoB,GACrB,EAAE;IACD,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,eAAe,EAAE,MAAM,CAAA;IACvB,QAAQ,EAAE,SAAS,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;IACf,wBAAwB,CAAC,EAAE,MAAM,EAAE,CAAA;IACnC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oBAAoB,CAAC,EAAE,OAAO,CAAA;CAC/B,GAAG,KAAK,CAAC,SAAS,CAwFlB"}

package/dist/features/toolbars/shared/ToolbarDropdown/DropDown.js

@@ -16,10 +16,9 @@ export function DropDownItem({
   item,
   tooltip
 }) {
-  const [className, setClassName] = useState(baseClass);
-  useEffect(() => {
-    setClassName([baseClass, enabled === false ? 'disabled' : '', active ? 'active' : '', item?.key ? `${baseClass}-${item.key}` : ''].filter(Boolean).join(' '));
-  }, [enabled, active, className, item.key]);
+  const className = useMemo(() => {
+    return [baseClass, enabled === false ? 'disabled' : '', active ? 'active' : '', item?.key ? `${baseClass}-${item.key}` : ''].filter(Boolean).join(' ');
+  }, [enabled, active, item.key]);
   const ref = useRef(null);
   const dropDownContext = React.use(DropDownContext);
   if (dropDownContext === null) {

package/dist/features/toolbars/shared/ToolbarDropdown/DropDown.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropDown.js","names":["Button","$addUpdateTag","isDOMNode","React","useCallback","useEffect","useMemo","useRef","useState","createPortal","baseClass","DropDownContext","createContext","DropDownItem","active","children","editor","enabled","Icon","item","tooltip","className","setClassName","key","filter","Boolean","join","ref","dropDownContext","use","Error","registerItem","current","_jsx","buttonStyle","disabled","icon","iconPosition","iconStyle","onClick","focus","update","onSelect","isActive","onMouseDown","e","preventDefault","type","DropDownItems","dropDownRef","itemsContainerClassNames","onClose","items","setItems","highlightedItem","setHighlightedItem","itemRef","prev","handleKeyDown","event","includes","index","indexOf","length","contextValue","value","onKeyDown","DropDown","buttonAriaLabel","buttonClassName","label","stopCloseOnClickSelf","buttonRef","showDropDown","setShowDropDown","handleClose","button","dropDown","left","top","getBoundingClientRect","scrollTopOffset","window","scrollY","document","documentElement","scrollTop","style","offsetHeight","Math","min","innerWidth","offsetWidth","handle","target","contains","addEventListener","removeEventListener","portal","body","_jsxs","Fragment"],"sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/DropDown.tsx"],"sourcesContent":["'use client'\nimport { Button } from '@payloadcms/ui'\nimport { $addUpdateTag, isDOMNode, type LexicalEditor } from 'lexical'\nimport React, { type ReactNode, useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\n\nimport type { ToolbarGroupItem } from '../../types.js'\n\nconst baseClass = 'toolbar-popup__dropdown-item'\n\ninterface DropDownContextType {\n  registerItem: (ref: React.RefObject<HTMLButtonElement | null>) => void\n}\n\nconst DropDownContext = React.createContext<DropDownContextType | null>(null)\n\nexport function DropDownItem({\n  active,\n  children,\n  editor,\n  enabled,\n  Icon,\n  item,\n  tooltip,\n}: {\n  active?: boolean\n  children: React.ReactNode\n  editor: LexicalEditor\n  enabled?: boolean\n  Icon: React.ReactNode\n  item: ToolbarGroupItem\n  tooltip?: string\n}): React.ReactNode {\n  const [className, setClassName] = useState<string>(baseClass)\n\n  useEffect(() => {\n    setClassName(\n      [\n        baseClass,\n        enabled === false ? 'disabled' : '',\n        active ? 'active' : '',\n        item?.key ? `${baseClass}-${item.key}` : '',\n      ]\n        .filter(Boolean)\n        .join(' '),\n    )\n  }, [enabled, active, className, item.key])\n\n  const ref = useRef<HTMLButtonElement>(null)\n\n  const dropDownContext = React.use(DropDownContext)\n\n  if (dropDownContext === null) {\n    throw new Error('DropDownItem must be used within a DropDown')\n  }\n\n  const { registerItem } = dropDownContext\n\n  useEffect(() => {\n    if (ref?.current != null) {\n      registerItem(ref)\n    }\n  }, [ref, registerItem])\n\n  return (\n    <Button\n      aria-label={tooltip}\n      buttonStyle=\"none\"\n      className={className}\n      disabled={enabled === false}\n      icon={Icon}\n      iconPosition=\"left\"\n      iconStyle=\"none\"\n      onClick={() => {\n        if (enabled !== false) {\n          editor.focus(() => {\n            editor.update(() => {\n              $addUpdateTag('toolbar')\n            })\n            // We need to wrap the onSelect in the callback, so the editor is properly focused before the onSelect is called.\n            item.onSelect?.({\n              editor,\n              isActive: active!,\n            })\n          })\n        }\n      }}\n      onMouseDown={(e) => {\n        // This is required for Firefox compatibility. Without it, the dropdown will disappear without the onClick being called.\n        // This only happens in Firefox. Must be something about how Firefox handles focus events differently.\n        e.preventDefault()\n      }}\n      ref={ref}\n      tooltip={tooltip}\n      type=\"button\"\n    >\n      {children}\n    </Button>\n  )\n}\n\nfunction DropDownItems({\n  children,\n  dropDownRef,\n  itemsContainerClassNames,\n  onClose,\n}: {\n  children: React.ReactNode\n  dropDownRef: React.Ref<HTMLDivElement>\n  itemsContainerClassNames?: string[]\n  onClose: () => void\n}): React.ReactElement {\n  const [items, setItems] = useState<Array<React.RefObject<HTMLButtonElement | null>>>()\n  const [highlightedItem, setHighlightedItem] =\n    useState<React.RefObject<HTMLButtonElement | null>>()\n\n  const registerItem = useCallback(\n    (itemRef: React.RefObject<HTMLButtonElement | null>) => {\n      setItems((prev) => (prev != null ? [...prev, itemRef] : [itemRef]))\n    },\n    [setItems],\n  )\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>): void => {\n    if (items == null) {\n      return\n    }\n\n    const { key } = event\n\n    if (['ArrowDown', 'ArrowUp', 'Escape', 'Tab'].includes(key)) {\n      event.preventDefault()\n    }\n\n    if (key === 'Escape' || key === 'Tab') {\n      onClose()\n    } else if (key === 'ArrowUp') {\n      setHighlightedItem((prev) => {\n        if (prev == null) {\n          return items[0]\n        }\n        const index = items.indexOf(prev) - 1\n        return items[index === -1 ? items.length - 1 : index]\n      })\n    } else if (key === 'ArrowDown') {\n      setHighlightedItem((prev) => {\n        if (prev == null) {\n          return items[0]\n        }\n        return items[items.indexOf(prev) + 1]\n      })\n    }\n  }\n\n  const contextValue = useMemo(\n    () => ({\n      registerItem,\n    }),\n    [registerItem],\n  )\n\n  useEffect(() => {\n    if (items != null && highlightedItem == null) {\n      setHighlightedItem(items[0])\n    }\n\n    if (highlightedItem != null && highlightedItem?.current != null) {\n      highlightedItem.current.focus()\n    }\n  }, [items, highlightedItem])\n\n  return (\n    <DropDownContext value={contextValue}>\n      <div\n        className={(itemsContainerClassNames ?? ['toolbar-popup__dropdown-items']).join(' ')}\n        onKeyDown={handleKeyDown}\n        ref={dropDownRef}\n      >\n        {children}\n      </div>\n    </DropDownContext>\n  )\n}\n\nexport function DropDown({\n  buttonAriaLabel,\n  buttonClassName,\n  children,\n  disabled = false,\n  Icon,\n  itemsContainerClassNames,\n  label,\n  stopCloseOnClickSelf,\n}: {\n  buttonAriaLabel?: string\n  buttonClassName: string\n  children: ReactNode\n  disabled?: boolean\n  Icon?: React.FC\n  itemsContainerClassNames?: string[]\n  label?: string\n  stopCloseOnClickSelf?: boolean\n}): React.ReactNode {\n  const dropDownRef = useRef<HTMLDivElement>(null)\n  const buttonRef = useRef<HTMLButtonElement>(null)\n  const [showDropDown, setShowDropDown] = useState(false)\n\n  const handleClose = (): void => {\n    setShowDropDown(false)\n    if (buttonRef?.current != null) {\n      buttonRef.current.focus()\n    }\n  }\n\n  useEffect(() => {\n    const button = buttonRef.current\n    const dropDown = dropDownRef.current\n\n    if (showDropDown && button !== null && dropDown !== null) {\n      const { left, top } = button.getBoundingClientRect()\n      const scrollTopOffset = window.scrollY || document.documentElement.scrollTop\n      dropDown.style.top = `${top + scrollTopOffset + button.offsetHeight + 5}px`\n      dropDown.style.left = `${Math.min(left - 5, window.innerWidth - dropDown.offsetWidth - 20)}px`\n    }\n  }, [dropDownRef, buttonRef, showDropDown])\n\n  useEffect(() => {\n    const button = buttonRef.current\n\n    if (button !== null && showDropDown) {\n      const handle = (event: MouseEvent): void => {\n        const target = event.target\n        if (!isDOMNode(target)) {\n          return\n        }\n        if (stopCloseOnClickSelf) {\n          if (dropDownRef.current && dropDownRef.current.contains(target)) {\n            return\n          }\n        }\n        if (!button.contains(target)) {\n          setShowDropDown(false)\n        }\n      }\n      document.addEventListener('click', handle)\n\n      return () => {\n        document.removeEventListener('click', handle)\n      }\n    }\n  }, [dropDownRef, buttonRef, showDropDown, stopCloseOnClickSelf])\n\n  const portal = createPortal(\n    <DropDownItems\n      dropDownRef={dropDownRef}\n      itemsContainerClassNames={itemsContainerClassNames}\n      onClose={handleClose}\n    >\n      {children}\n    </DropDownItems>,\n    document.body,\n  )\n\n  return (\n    <React.Fragment>\n      <button\n        aria-label={buttonAriaLabel}\n        className={buttonClassName + (showDropDown ? ' active' : '')}\n        disabled={disabled}\n        onClick={(event) => {\n          event.preventDefault()\n          setShowDropDown(!showDropDown)\n        }}\n        onMouseDown={(e) => {\n          // This fixes a bug where you are unable to click the button if you are in a NESTED editor (editor in blocks field in editor).\n          // Thus only happens if you click on the SVG of the button. Clicking on the outside works. Related issue: https://github.com/payloadcms/payload/issues/4025\n          // TODO: Find out why exactly it happens and why e.preventDefault() on the mouseDown fixes it. Write that down here, or potentially fix a root cause, if there is any.\n          e.preventDefault()\n        }}\n        ref={buttonRef}\n        type=\"button\"\n      >\n        {Icon && <Icon />}\n        {label && <span className=\"toolbar-popup__dropdown-label\">{label}</span>}\n        <i className=\"toolbar-popup__dropdown-caret\" />\n      </button>\n\n      {showDropDown && <React.Fragment>{portal}</React.Fragment>}\n    </React.Fragment>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"DropDown.js","names":["Button","$addUpdateTag","isDOMNode","React","useCallback","useEffect","useMemo","useRef","useState","createPortal","baseClass","DropDownContext","createContext","DropDownItem","active","children","editor","enabled","Icon","item","tooltip","className","key","filter","Boolean","join","ref","dropDownContext","use","Error","registerItem","current","_jsx","buttonStyle","disabled","icon","iconPosition","iconStyle","onClick","focus","update","onSelect","isActive","onMouseDown","e","preventDefault","type","DropDownItems","dropDownRef","itemsContainerClassNames","onClose","items","setItems","highlightedItem","setHighlightedItem","itemRef","prev","handleKeyDown","event","includes","index","indexOf","length","contextValue","value","onKeyDown","DropDown","buttonAriaLabel","buttonClassName","label","stopCloseOnClickSelf","buttonRef","showDropDown","setShowDropDown","handleClose","button","dropDown","left","top","getBoundingClientRect","scrollTopOffset","window","scrollY","document","documentElement","scrollTop","style","offsetHeight","Math","min","innerWidth","offsetWidth","handle","target","contains","addEventListener","removeEventListener","portal","body","_jsxs","Fragment"],"sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/DropDown.tsx"],"sourcesContent":["'use client'\nimport { Button } from '@payloadcms/ui'\nimport { $addUpdateTag, isDOMNode, type LexicalEditor } from 'lexical'\nimport React, { type ReactNode, useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\n\nimport type { ToolbarGroupItem } from '../../types.js'\n\nconst baseClass = 'toolbar-popup__dropdown-item'\n\ninterface DropDownContextType {\n  registerItem: (ref: React.RefObject<HTMLButtonElement | null>) => void\n}\n\nconst DropDownContext = React.createContext<DropDownContextType | null>(null)\n\nexport function DropDownItem({\n  active,\n  children,\n  editor,\n  enabled,\n  Icon,\n  item,\n  tooltip,\n}: {\n  active?: boolean\n  children: React.ReactNode\n  editor: LexicalEditor\n  enabled?: boolean\n  Icon: React.ReactNode\n  item: ToolbarGroupItem\n  tooltip?: string\n}): React.ReactNode {\n  const className = useMemo(() => {\n    return [\n      baseClass,\n      enabled === false ? 'disabled' : '',\n      active ? 'active' : '',\n      item?.key ? `${baseClass}-${item.key}` : '',\n    ]\n      .filter(Boolean)\n      .join(' ')\n  }, [enabled, active, item.key])\n\n  const ref = useRef<HTMLButtonElement>(null)\n\n  const dropDownContext = React.use(DropDownContext)\n\n  if (dropDownContext === null) {\n    throw new Error('DropDownItem must be used within a DropDown')\n  }\n\n  const { registerItem } = dropDownContext\n\n  useEffect(() => {\n    if (ref?.current != null) {\n      registerItem(ref)\n    }\n  }, [ref, registerItem])\n\n  return (\n    <Button\n      aria-label={tooltip}\n      buttonStyle=\"none\"\n      className={className}\n      disabled={enabled === false}\n      icon={Icon}\n      iconPosition=\"left\"\n      iconStyle=\"none\"\n      onClick={() => {\n        if (enabled !== false) {\n          editor.focus(() => {\n            editor.update(() => {\n              $addUpdateTag('toolbar')\n            })\n            // We need to wrap the onSelect in the callback, so the editor is properly focused before the onSelect is called.\n            item.onSelect?.({\n              editor,\n              isActive: active!,\n            })\n          })\n        }\n      }}\n      onMouseDown={(e) => {\n        // This is required for Firefox compatibility. Without it, the dropdown will disappear without the onClick being called.\n        // This only happens in Firefox. Must be something about how Firefox handles focus events differently.\n        e.preventDefault()\n      }}\n      ref={ref}\n      tooltip={tooltip}\n      type=\"button\"\n    >\n      {children}\n    </Button>\n  )\n}\n\nfunction DropDownItems({\n  children,\n  dropDownRef,\n  itemsContainerClassNames,\n  onClose,\n}: {\n  children: React.ReactNode\n  dropDownRef: React.Ref<HTMLDivElement>\n  itemsContainerClassNames?: string[]\n  onClose: () => void\n}): React.ReactElement {\n  const [items, setItems] = useState<Array<React.RefObject<HTMLButtonElement | null>>>()\n  const [highlightedItem, setHighlightedItem] =\n    useState<React.RefObject<HTMLButtonElement | null>>()\n\n  const registerItem = useCallback(\n    (itemRef: React.RefObject<HTMLButtonElement | null>) => {\n      setItems((prev) => (prev != null ? [...prev, itemRef] : [itemRef]))\n    },\n    [setItems],\n  )\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>): void => {\n    if (items == null) {\n      return\n    }\n\n    const { key } = event\n\n    if (['ArrowDown', 'ArrowUp', 'Escape', 'Tab'].includes(key)) {\n      event.preventDefault()\n    }\n\n    if (key === 'Escape' || key === 'Tab') {\n      onClose()\n    } else if (key === 'ArrowUp') {\n      setHighlightedItem((prev) => {\n        if (prev == null) {\n          return items[0]\n        }\n        const index = items.indexOf(prev) - 1\n        return items[index === -1 ? items.length - 1 : index]\n      })\n    } else if (key === 'ArrowDown') {\n      setHighlightedItem((prev) => {\n        if (prev == null) {\n          return items[0]\n        }\n        return items[items.indexOf(prev) + 1]\n      })\n    }\n  }\n\n  const contextValue = useMemo(\n    () => ({\n      registerItem,\n    }),\n    [registerItem],\n  )\n\n  useEffect(() => {\n    if (items != null && highlightedItem == null) {\n      setHighlightedItem(items[0])\n    }\n\n    if (highlightedItem != null && highlightedItem?.current != null) {\n      highlightedItem.current.focus()\n    }\n  }, [items, highlightedItem])\n\n  return (\n    <DropDownContext value={contextValue}>\n      <div\n        className={(itemsContainerClassNames ?? ['toolbar-popup__dropdown-items']).join(' ')}\n        onKeyDown={handleKeyDown}\n        ref={dropDownRef}\n      >\n        {children}\n      </div>\n    </DropDownContext>\n  )\n}\n\nexport function DropDown({\n  buttonAriaLabel,\n  buttonClassName,\n  children,\n  disabled = false,\n  Icon,\n  itemsContainerClassNames,\n  label,\n  stopCloseOnClickSelf,\n}: {\n  buttonAriaLabel?: string\n  buttonClassName: string\n  children: ReactNode\n  disabled?: boolean\n  Icon?: React.FC\n  itemsContainerClassNames?: string[]\n  label?: string\n  stopCloseOnClickSelf?: boolean\n}): React.ReactNode {\n  const dropDownRef = useRef<HTMLDivElement>(null)\n  const buttonRef = useRef<HTMLButtonElement>(null)\n  const [showDropDown, setShowDropDown] = useState(false)\n\n  const handleClose = (): void => {\n    setShowDropDown(false)\n    if (buttonRef?.current != null) {\n      buttonRef.current.focus()\n    }\n  }\n\n  useEffect(() => {\n    const button = buttonRef.current\n    const dropDown = dropDownRef.current\n\n    if (showDropDown && button !== null && dropDown !== null) {\n      const { left, top } = button.getBoundingClientRect()\n      const scrollTopOffset = window.scrollY || document.documentElement.scrollTop\n      dropDown.style.top = `${top + scrollTopOffset + button.offsetHeight + 5}px`\n      dropDown.style.left = `${Math.min(left - 5, window.innerWidth - dropDown.offsetWidth - 20)}px`\n    }\n  }, [dropDownRef, buttonRef, showDropDown])\n\n  useEffect(() => {\n    const button = buttonRef.current\n\n    if (button !== null && showDropDown) {\n      const handle = (event: MouseEvent): void => {\n        const target = event.target\n        if (!isDOMNode(target)) {\n          return\n        }\n        if (stopCloseOnClickSelf) {\n          if (dropDownRef.current && dropDownRef.current.contains(target)) {\n            return\n          }\n        }\n        if (!button.contains(target)) {\n          setShowDropDown(false)\n        }\n      }\n      document.addEventListener('click', handle)\n\n      return () => {\n        document.removeEventListener('click', handle)\n      }\n    }\n  }, [dropDownRef, buttonRef, showDropDown, stopCloseOnClickSelf])\n\n  const portal = createPortal(\n    <DropDownItems\n      dropDownRef={dropDownRef}\n      itemsContainerClassNames={itemsContainerClassNames}\n      onClose={handleClose}\n    >\n      {children}\n    </DropDownItems>,\n    document.body,\n  )\n\n  return (\n    <React.Fragment>\n      <button\n        aria-label={buttonAriaLabel}\n        className={buttonClassName + (showDropDown ? ' active' : '')}\n        disabled={disabled}\n        onClick={(event) => {\n          event.preventDefault()\n          setShowDropDown(!showDropDown)\n        }}\n        onMouseDown={(e) => {\n          // This fixes a bug where you are unable to click the button if you are in a NESTED editor (editor in blocks field in editor).\n          // Thus only happens if you click on the SVG of the button. Clicking on the outside works. Related issue: https://github.com/payloadcms/payload/issues/4025\n          // TODO: Find out why exactly it happens and why e.preventDefault() on the mouseDown fixes it. Write that down here, or potentially fix a root cause, if there is any.\n          e.preventDefault()\n        }}\n        ref={buttonRef}\n        type=\"button\"\n      >\n        {Icon && <Icon />}\n        {label && <span className=\"toolbar-popup__dropdown-label\">{label}</span>}\n        <i className=\"toolbar-popup__dropdown-caret\" />\n      </button>\n\n      {showDropDown && <React.Fragment>{portal}</React.Fragment>}\n    </React.Fragment>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/toolbars/shared/ToolbarDropdown/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAiC,MAAM,OAAO,CAAA;AAIrD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAM5C,OAAO,KAAK,EAAE,oBAAoB,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAI5E,OAAO,cAAc,CAAA;AAiErB,eAAO,MAAM,eAAe,sHAUzB;IACD,UAAU,EAAE,WAAW,CAAA;IACvB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,MAAM,EAAE,aAAa,CAAA;IACrB,KAAK,EAAE,oBAAoB,CAAA;IAC3B,IAAI,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;IACf,wBAAwB,CAAC,EAAE,MAAM,EAAE,CAAA;IACnC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,CAAC,EAAE,WAAW,EAAE,EAAE;QAAE,WAAW,EAAE,gBAAgB,EAAE,CAAA;KAAE,KAAK,IAAI,CAAA;CAChF,sBAuFA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4D,MAAM,OAAO,CAAA;AAIhF,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAM5C,OAAO,KAAK,EAAE,oBAAoB,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAI5E,OAAO,cAAc,CAAA;AAmErB,eAAO,MAAM,eAAe,sHAUzB;IACD,UAAU,EAAE,WAAW,CAAA;IACvB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,MAAM,EAAE,aAAa,CAAA;IACrB,KAAK,EAAE,oBAAoB,CAAA;IAC3B,IAAI,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;IACf,wBAAwB,CAAC,EAAE,MAAM,EAAE,CAAA;IACnC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,CAAC,EAAE,WAAW,EAAE,EAAE;QAAE,WAAW,EAAE,gBAAgB,EAAE,CAAA;KAAE,KAAK,IAAI,CAAA;CAChF,sBAkGA,CAAA"}