@payloadcms/richtext-lexical 3.80.0-canary.3 → 3.80.0-internal-debug.daef79f

package/dist/features/toolbars/fixed/client/Toolbar/index.js

@@ -1,7 +1,5 @@
 'use client';
-
-import { c as _c } from "react/compiler-runtime";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
 import { useLexicalEditable } from '@lexical/react/useLexicalEditable';
 import { useScrollInfo, useThrottledEffect, useTranslation } from '@payloadcms/ui';
@@ -11,254 +9,266 @@ import { useEditorConfigContext } from '../../../../../lexical/config/client/Edi
 import { ToolbarButton } from '../../../shared/ToolbarButton/index.js';
 import { ToolbarDropdown } from '../../../shared/ToolbarDropdown/index.js';
 import { useToolbarStates } from '../../../shared/useToolbarStates.js';
-function ButtonGroupItem({
-  active,
-  anchorElem,
-  editor,
-  enabled,
-  item
-}) {
-  if (item.Component) {
-    return item?.Component && /*#__PURE__*/_jsx(item.Component, {
-      anchorElem: anchorElem,
-      editor: editor,
-      item: item
-    }, item.key);
-  }
-  if (!item.ChildComponent) {
-    return null;
-  }
-  return /*#__PURE__*/_jsx(ToolbarButton, {
-    active: active,
-    editor: editor,
-    enabled: enabled,
-    item: item,
-    children: /*#__PURE__*/_jsx(item.ChildComponent, {})
-  }, item.key);
-}
-function ToolbarGroupComponent({
-  anchorElem,
-  editor,
-  editorConfig,
-  group,
-  index,
-  toolbarStates
-}) {
-  const {
-    i18n
-  } = useTranslation();
-  const {
-    fieldProps: {
-      featureClientSchemaMap,
-      schemaPath
-    }
-  } = useEditorConfigContext();
-  const groupState = toolbarStates.groupStates.get(group.key);
-  const DropdownIcon = useMemo(() => {
-    if (group.type !== 'dropdown') {
-      return undefined;
-    }
-    const activeItem = groupState?.activeItems?.[0];
-    if (activeItem) {
-      return activeItem.ChildComponent;
-    }
-    return group.ChildComponent;
-  }, [group, groupState?.activeItems]);
-  const dropdownLabel = useMemo(() => {
-    if (group.type !== 'dropdown') {
-      return undefined;
+import './index.scss';
+function ButtonGroupItem({ active, anchorElem, editor, enabled, item }) {
+    if (item.Component) {
+        return item?.Component && /*#__PURE__*/ _jsxDEV(item.Component, {
+            anchorElem: anchorElem,
+            editor: editor,
+            item: item
+        }, item.key, false, {
+            fileName: "src/features/toolbars/fixed/client/Toolbar/index.tsx",
+            lineNumber: 39,
+            columnNumber: 9
+        }, this);
     }
-    const activeItems = groupState?.activeItems;
-    if (!activeItems?.length) {
-      return undefined;
+    if (!item.ChildComponent) {
+        return null;
     }
-    if (activeItems.length > 1) {
-      return i18n.t('lexical:general:toolbarItemsActive', {
-        count: activeItems.length
-      });
-    }
-    const item = activeItems[0];
-    let label = item.key;
-    if (item.label) {
-      label = typeof item.label === 'function' ? item.label({
-        featureClientSchemaMap,
+    return /*#__PURE__*/ _jsxDEV(ToolbarButton, {
+        active: active,
+        editor: editor,
+        enabled: enabled,
+        item: item,
+        children: /*#__PURE__*/ _jsxDEV(item.ChildComponent, {}, void 0, false, {
+            fileName: "src/features/toolbars/fixed/client/Toolbar/index.tsx",
+            lineNumber: 50,
+            columnNumber: 7
+        }, this)
+    }, item.key, false, {
+        fileName: "src/features/toolbars/fixed/client/Toolbar/index.tsx",
+        lineNumber: 49,
+        columnNumber: 5
+    }, this);
+}
+function ToolbarGroupComponent({ anchorElem, editor, editorConfig, group, index, toolbarStates }) {
+    const { i18n } = useTranslation();
+    const { fieldProps: { featureClientSchemaMap, schemaPath } } = useEditorConfigContext();
+    const groupState = toolbarStates.groupStates.get(group.key);
+    const DropdownIcon = useMemo(()=>{
+        if (group.type !== 'dropdown') {
+            return undefined;
+        }
+        const activeItem = groupState?.activeItems?.[0];
+        if (activeItem) {
+            return activeItem.ChildComponent;
+        }
+        return group.ChildComponent;
+    }, [
+        group,
+        groupState?.activeItems
+    ]);
+    const dropdownLabel = useMemo(()=>{
+        if (group.type !== 'dropdown') {
+            return undefined;
+        }
+        const activeItems = groupState?.activeItems;
+        if (!activeItems?.length) {
+            return undefined;
+        }
+        if (activeItems.length > 1) {
+            return i18n.t('lexical:general:toolbarItemsActive', {
+                count: activeItems.length
+            });
+        }
+        const item = activeItems[0];
+        let label = item.key;
+        if (item.label) {
+            label = typeof item.label === 'function' ? item.label({
+                featureClientSchemaMap,
+                i18n,
+                schemaPath
+            }) : item.label;
+        }
+        if (label.length > 25) {
+            label = label.substring(0, 25) + '...';
+        }
+        return label;
+    }, [
+        group,
+        groupState?.activeItems,
         i18n,
+        featureClientSchemaMap,
         schemaPath
-      }) : item.label;
-    }
-    if (label.length > 25) {
-      label = label.substring(0, 25) + '...';
-    }
-    return label;
-  }, [group, groupState?.activeItems, i18n, featureClientSchemaMap, schemaPath]);
-  return /*#__PURE__*/_jsxs("div", {
-    className: `fixed-toolbar__group fixed-toolbar__group-${group.key}`,
-    "data-toolbar-group-key": group.key,
-    children: [group.type === 'dropdown' && group.items.length && groupState ? /*#__PURE__*/_jsx(ToolbarDropdown, {
-      anchorElem: anchorElem,
-      editor: editor,
-      group: group,
-      groupState: groupState,
-      Icon: DropdownIcon,
-      itemsContainerClassNames: ['fixed-toolbar__dropdown-items'],
-      label: dropdownLabel
-    }) : null, group.type === 'buttons' && group.items.length ? group.items.map(item_0 => {
-      const itemState = toolbarStates.itemStates.get(item_0.key);
-      return /*#__PURE__*/_jsx(ButtonGroupItem, {
-        active: itemState?.active ?? false,
-        anchorElem: anchorElem,
-        editor: editor,
-        enabled: itemState?.enabled ?? true,
-        item: item_0
-      }, item_0.key);
-    }) : null, index < editorConfig.features.toolbarFixed?.groups.length - 1 && /*#__PURE__*/_jsx("div", {
-      className: "divider"
-    })]
-  }, group.key);
+    ]);
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: `fixed-toolbar__group fixed-toolbar__group-${group.key}`,
+        "data-toolbar-group-key": group.key,
+        children: [
+            group.type === 'dropdown' && group.items.length && groupState ? /*#__PURE__*/ _jsxDEV(ToolbarDropdown, {
+                anchorElem: anchorElem,
+                editor: editor,
+                group: group,
+                groupState: groupState,
+                Icon: DropdownIcon,
+                itemsContainerClassNames: [
+                    'fixed-toolbar__dropdown-items'
+                ],
+                label: dropdownLabel
+            }, void 0, false, {
+                fileName: "src/features/toolbars/fixed/client/Toolbar/index.tsx",
+                lineNumber: 120,
+                columnNumber: 9
+            }, this) : null,
+            group.type === 'buttons' && group.items.length ? group.items.map((item)=>{
+                const itemState = toolbarStates.itemStates.get(item.key);
+                return /*#__PURE__*/ _jsxDEV(ButtonGroupItem, {
+                    active: itemState?.active ?? false,
+                    anchorElem: anchorElem,
+                    editor: editor,
+                    enabled: itemState?.enabled ?? true,
+                    item: item
+                }, item.key, false, {
+                    fileName: "src/features/toolbars/fixed/client/Toolbar/index.tsx",
+                    lineNumber: 134,
+                    columnNumber: 15
+                }, this);
+            }) : null,
+            index < editorConfig.features.toolbarFixed?.groups.length - 1 && /*#__PURE__*/ _jsxDEV("div", {
+                className: "divider"
+            }, void 0, false, {
+                fileName: "src/features/toolbars/fixed/client/Toolbar/index.tsx",
+                lineNumber: 145,
+                columnNumber: 73
+            }, this)
+        ]
+    }, group.key, true, {
+        fileName: "src/features/toolbars/fixed/client/Toolbar/index.tsx",
+        lineNumber: 114,
+        columnNumber: 5
+    }, this);
 }
-function FixedToolbar({
-  anchorElem,
-  clientProps,
-  editor,
-  editorConfig,
-  parentWithFixedToolbar
-}) {
-  const currentToolbarRef = React.useRef(null);
-  const isEditable = useLexicalEditable();
-  const {
-    y
-  } = useScrollInfo();
-  const toolbarStates = useToolbarStates(editor, editorConfig?.features?.toolbarFixed?.groups);
-  // Memoize the parent toolbar element
-  const parentToolbarElem = useMemo(() => {
-    if (!parentWithFixedToolbar || clientProps?.disableIfParentHasFixedToolbar) {
-      return null;
-    }
-    const parentEditorElem = parentWithFixedToolbar.editorContainerRef.current;
-    let sibling = parentEditorElem.previousElementSibling;
-    while (sibling) {
-      if (sibling.classList.contains('fixed-toolbar')) {
-        return sibling;
-      }
-      sibling = sibling.previousElementSibling;
-    }
-    return null;
-  }, [clientProps?.disableIfParentHasFixedToolbar, parentWithFixedToolbar]);
-  useThrottledEffect(() => {
-    if (!parentToolbarElem) {
-      // this also checks for clientProps?.disableIfParentHasFixedToolbar indirectly, see the parentToolbarElem useMemo
-      return;
-    }
-    const currentToolbarElem = currentToolbarRef.current;
-    if (!currentToolbarElem) {
-      return;
-    }
-    const currentRect = currentToolbarElem.getBoundingClientRect();
-    const parentRect = parentToolbarElem.getBoundingClientRect();
-    // we only need to check for vertical overlap
-    const overlapping = !(currentRect.bottom < parentRect.top || currentRect.top > parentRect.bottom);
-    if (overlapping) {
-      currentToolbarElem.classList.remove('fixed-toolbar');
-      currentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--overlapping');
-      parentToolbarElem.classList.remove('fixed-toolbar');
-      parentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--hide');
-    } else {
-      if (!currentToolbarElem.classList.contains('fixed-toolbar--overlapping')) {
-        return;
-      }
-      currentToolbarElem.classList.remove('fixed-toolbar--overlapping');
-      currentToolbarElem.classList.add('fixed-toolbar');
-      parentToolbarElem.classList.remove('fixed-toolbar--hide');
-      parentToolbarElem.classList.add('fixed-toolbar');
-    }
-  }, 50, [currentToolbarRef, parentToolbarElem, y]);
-  return /*#__PURE__*/_jsx("div", {
-    className: "fixed-toolbar",
-    onFocus: event => {
-      // Prevent other focus events being triggered. Otherwise, if this was to be clicked while in a child editor,
-      // the parent editor will be focused, and the child editor will lose focus.
-      event.stopPropagation();
-    },
-    ref: currentToolbarRef,
-    children: isEditable && /*#__PURE__*/_jsx(React.Fragment, {
-      children: editorConfig?.features && editorConfig.features?.toolbarFixed?.groups.map((group, i) => {
-        return /*#__PURE__*/_jsx(ToolbarGroupComponent, {
-          anchorElem: anchorElem,
-          editor: editor,
-          editorConfig: editorConfig,
-          group: group,
-          index: i,
-          toolbarStates: toolbarStates
-        }, group.key);
-      })
-    })
-  });
+function FixedToolbar({ anchorElem, clientProps, editor, editorConfig, parentWithFixedToolbar }) {
+    const currentToolbarRef = React.useRef(null);
+    const isEditable = useLexicalEditable();
+    const { y } = useScrollInfo();
+    const toolbarStates = useToolbarStates(editor, editorConfig?.features?.toolbarFixed?.groups);
+    // Memoize the parent toolbar element
+    const parentToolbarElem = useMemo(()=>{
+        if (!parentWithFixedToolbar || clientProps?.disableIfParentHasFixedToolbar) {
+            return null;
+        }
+        const parentEditorElem = parentWithFixedToolbar.editorContainerRef.current;
+        let sibling = parentEditorElem.previousElementSibling;
+        while(sibling){
+            if (sibling.classList.contains('fixed-toolbar')) {
+                return sibling;
+            }
+            sibling = sibling.previousElementSibling;
+        }
+        return null;
+    }, [
+        clientProps?.disableIfParentHasFixedToolbar,
+        parentWithFixedToolbar
+    ]);
+    useThrottledEffect(()=>{
+        if (!parentToolbarElem) {
+            // this also checks for clientProps?.disableIfParentHasFixedToolbar indirectly, see the parentToolbarElem useMemo
+            return;
+        }
+        const currentToolbarElem = currentToolbarRef.current;
+        if (!currentToolbarElem) {
+            return;
+        }
+        const currentRect = currentToolbarElem.getBoundingClientRect();
+        const parentRect = parentToolbarElem.getBoundingClientRect();
+        // we only need to check for vertical overlap
+        const overlapping = !(currentRect.bottom < parentRect.top || currentRect.top > parentRect.bottom);
+        if (overlapping) {
+            currentToolbarElem.classList.remove('fixed-toolbar');
+            currentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--overlapping');
+            parentToolbarElem.classList.remove('fixed-toolbar');
+            parentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--hide');
+        } else {
+            if (!currentToolbarElem.classList.contains('fixed-toolbar--overlapping')) {
+                return;
+            }
+            currentToolbarElem.classList.remove('fixed-toolbar--overlapping');
+            currentToolbarElem.classList.add('fixed-toolbar');
+            parentToolbarElem.classList.remove('fixed-toolbar--hide');
+            parentToolbarElem.classList.add('fixed-toolbar');
+        }
+    }, 50, [
+        currentToolbarRef,
+        parentToolbarElem,
+        y
+    ]);
+    return /*#__PURE__*/ _jsxDEV("div", {
+        className: "fixed-toolbar",
+        onFocus: (event)=>{
+            // Prevent other focus events being triggered. Otherwise, if this was to be clicked while in a child editor,
+            // the parent editor will be focused, and the child editor will lose focus.
+            event.stopPropagation();
+        },
+        ref: currentToolbarRef,
+        children: isEditable && /*#__PURE__*/ _jsxDEV(React.Fragment, {
+            children: editorConfig?.features && editorConfig.features?.toolbarFixed?.groups.map((group, i)=>{
+                return /*#__PURE__*/ _jsxDEV(ToolbarGroupComponent, {
+                    anchorElem: anchorElem,
+                    editor: editor,
+                    editorConfig: editorConfig,
+                    group: group,
+                    index: i,
+                    toolbarStates: toolbarStates
+                }, group.key, false, {
+                    fileName: "src/features/toolbars/fixed/client/Toolbar/index.tsx",
+                    lineNumber: 240,
+                    columnNumber: 17
+                }, this);
+            })
+        }, void 0, false, {
+            fileName: "src/features/toolbars/fixed/client/Toolbar/index.tsx",
+            lineNumber: 236,
+            columnNumber: 9
+        }, this)
+    }, void 0, false, {
+        fileName: "src/features/toolbars/fixed/client/Toolbar/index.tsx",
+        lineNumber: 226,
+        columnNumber: 5
+    }, this);
 }
-const getParentEditorWithFixedToolbar = editorConfigContext => {
-  if (editorConfigContext.parentEditor?.editorConfig) {
-    if (editorConfigContext.parentEditor?.editorConfig.resolvedFeatureMap.has('toolbarFixed')) {
-      return editorConfigContext.parentEditor;
-    } else {
-      if (editorConfigContext.parentEditor) {
-        return getParentEditorWithFixedToolbar(editorConfigContext.parentEditor);
-      }
+const getParentEditorWithFixedToolbar = (editorConfigContext)=>{
+    if (editorConfigContext.parentEditor?.editorConfig) {
+        if (editorConfigContext.parentEditor?.editorConfig.resolvedFeatureMap.has('toolbarFixed')) {
+            return editorConfigContext.parentEditor;
+        } else {
+            if (editorConfigContext.parentEditor) {
+                return getParentEditorWithFixedToolbar(editorConfigContext.parentEditor);
+            }
+        }
     }
-  }
-  return false;
+    return false;
 };
-export const FixedToolbarPlugin = t0 => {
-  const $ = _c(6);
-  const {
-    clientProps
-  } = t0;
-  const [currentEditor] = useLexicalComposerContext();
-  const editorConfigContext = useEditorConfigContext();
-  const isEditable = useLexicalEditable();
-  if (!isEditable) {
-    return null;
-  }
-  const {
-    editorConfig: currentEditorConfig
-  } = editorConfigContext;
-  const editor = clientProps.applyToFocusedEditor ? editorConfigContext.focusedEditor?.editor || currentEditor : currentEditor;
-  const editorConfig = clientProps.applyToFocusedEditor ? editorConfigContext.focusedEditor?.editorConfig || currentEditorConfig : currentEditorConfig;
-  let t1;
-  let t2;
-  if ($[0] !== clientProps || $[1] !== editor || $[2] !== editorConfig || $[3] !== editorConfigContext) {
-    t2 = Symbol.for("react.early_return_sentinel");
-    bb0: {
-      const parentWithFixedToolbar = getParentEditorWithFixedToolbar(editorConfigContext);
-      if (clientProps?.disableIfParentHasFixedToolbar) {
+export const FixedToolbarPlugin = ({ clientProps })=>{
+    const [currentEditor] = useLexicalComposerContext();
+    const editorConfigContext = useEditorConfigContext();
+    const isEditable = useLexicalEditable();
+    if (!isEditable) {
+        return null;
+    }
+    const { editorConfig: currentEditorConfig } = editorConfigContext;
+    const editor = clientProps.applyToFocusedEditor ? editorConfigContext.focusedEditor?.editor || currentEditor : currentEditor;
+    const editorConfig = clientProps.applyToFocusedEditor ? editorConfigContext.focusedEditor?.editorConfig || currentEditorConfig : currentEditorConfig;
+    const parentWithFixedToolbar = getParentEditorWithFixedToolbar(editorConfigContext);
+    if (clientProps?.disableIfParentHasFixedToolbar) {
         if (parentWithFixedToolbar) {
-          t2 = null;
-          break bb0;
+            return null;
         }
-      }
-      if (!editorConfig?.features?.toolbarFixed?.groups?.length) {
-        t2 = null;
-        break bb0;
-      }
-      t1 = _jsx(FixedToolbar, {
-        anchorElem: document.body,
-        clientProps,
-        editor,
-        editorConfig,
-        parentWithFixedToolbar
-      });
     }
-    $[0] = clientProps;
-    $[1] = editor;
-    $[2] = editorConfig;
-    $[3] = editorConfigContext;
-    $[4] = t1;
-    $[5] = t2;
-  } else {
-    t1 = $[4];
-    t2 = $[5];
-  }
-  if (t2 !== Symbol.for("react.early_return_sentinel")) {
-    return t2;
-  }
-  return t1;
+    if (!editorConfig?.features?.toolbarFixed?.groups?.length) {
+        return null;
+    }
+    return /*#__PURE__*/ _jsxDEV(FixedToolbar, {
+        anchorElem: document.body,
+        clientProps: clientProps,
+        editor: editor,
+        editorConfig: editorConfig,
+        parentWithFixedToolbar: parentWithFixedToolbar
+    }, void 0, false, {
+        fileName: "src/features/toolbars/fixed/client/Toolbar/index.tsx",
+        lineNumber: 303,
+        columnNumber: 5
+    }, this);
 };
+
 //# sourceMappingURL=index.js.map

package/dist/features/toolbars/fixed/client/Toolbar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","useLexicalEditable","useScrollInfo","useThrottledEffect","useTranslation","React","useMemo","useEditorConfigContext","ToolbarButton","ToolbarDropdown","useToolbarStates","ButtonGroupItem","active","anchorElem","editor","enabled","item","Component","_jsx","key","ChildComponent","ToolbarGroupComponent","editorConfig","group","index","toolbarStates","i18n","fieldProps","featureClientSchemaMap","schemaPath","groupState","groupStates","get","DropdownIcon","type","undefined","activeItem","activeItems","dropdownLabel","length","t","count","label","substring","_jsxs","className","items","Icon","itemsContainerClassNames","map","itemState","itemStates","features","toolbarFixed","groups","FixedToolbar","clientProps","parentWithFixedToolbar","currentToolbarRef","useRef","isEditable","y","parentToolbarElem","disableIfParentHasFixedToolbar","parentEditorElem","editorContainerRef","current","sibling","previousElementSibling","classList","contains","currentToolbarElem","currentRect","getBoundingClientRect","parentRect","overlapping","bottom","top","remove","add","onFocus","event","stopPropagation","ref","Fragment","i","getParentEditorWithFixedToolbar","editorConfigContext","parentEditor","resolvedFeatureMap","has","FixedToolbarPlugin","t0","$","currentEditor","currentEditorConfig","applyToFocusedEditor","focusedEditor","t1","t2","Symbol","for","bb0","document","body"],"sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport { useScrollInfo, useThrottledEffect, useTranslation } from '@payloadcms/ui'\nimport * as React from 'react'\nimport { useMemo } from 'react'\n\nimport type { EditorConfigContextType } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport type { SanitizedClientEditorConfig } from '../../../../../lexical/config/types.js'\nimport type { PluginComponent } from '../../../../typesClient.js'\nimport type { ToolbarStates } from '../../../shared/useToolbarStates.js'\nimport type { ToolbarGroup, ToolbarGroupItem } from '../../../types.js'\nimport type { FixedToolbarFeatureProps } from '../../server/index.js'\n\nimport { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport { ToolbarButton } from '../../../shared/ToolbarButton/index.js'\nimport { ToolbarDropdown } from '../../../shared/ToolbarDropdown/index.js'\nimport { useToolbarStates } from '../../../shared/useToolbarStates.js'\nimport './index.scss'\n\nfunction ButtonGroupItem({\n  active,\n  anchorElem,\n  editor,\n  enabled,\n  item,\n}: {\n  active: boolean\n  anchorElem: HTMLElement\n  editor: LexicalEditor\n  enabled: boolean\n  item: ToolbarGroupItem\n}): React.ReactNode {\n  if (item.Component) {\n    return (\n      item?.Component && (\n        <item.Component anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n      )\n    )\n  }\n\n  if (!item.ChildComponent) {\n    return null\n  }\n\n  return (\n    <ToolbarButton active={active} editor={editor} enabled={enabled} item={item} key={item.key}>\n      <item.ChildComponent />\n    </ToolbarButton>\n  )\n}\n\nfunction ToolbarGroupComponent({\n  anchorElem,\n  editor,\n  editorConfig,\n  group,\n  index,\n  toolbarStates,\n}: {\n  anchorElem: HTMLElement\n  editor: LexicalEditor\n  editorConfig: SanitizedClientEditorConfig\n  group: ToolbarGroup\n  index: number\n  toolbarStates: ToolbarStates\n}): React.ReactNode {\n  const { i18n } = useTranslation<{}, string>()\n  const {\n    fieldProps: { featureClientSchemaMap, schemaPath },\n  } = useEditorConfigContext()\n\n  const groupState = toolbarStates.groupStates.get(group.key)\n\n  const DropdownIcon = useMemo(() => {\n    if (group.type !== 'dropdown') {\n      return undefined\n    }\n    const activeItem = groupState?.activeItems?.[0]\n    if (activeItem) {\n      return activeItem.ChildComponent\n    }\n    return group.ChildComponent\n  }, [group, groupState?.activeItems])\n\n  const dropdownLabel = useMemo(() => {\n    if (group.type !== 'dropdown') {\n      return undefined\n    }\n    const activeItems = groupState?.activeItems\n    if (!activeItems?.length) {\n      return undefined\n    }\n    if (activeItems.length > 1) {\n      return i18n.t('lexical:general:toolbarItemsActive', { count: activeItems.length })\n    }\n    const item = activeItems[0]!\n    let label = item.key\n    if (item.label) {\n      label =\n        typeof item.label === 'function'\n          ? item.label({ featureClientSchemaMap, i18n, schemaPath })\n          : item.label\n    }\n    if (label.length > 25) {\n      label = label.substring(0, 25) + '...'\n    }\n    return label\n  }, [group, groupState?.activeItems, i18n, featureClientSchemaMap, schemaPath])\n\n  return (\n    <div\n      className={`fixed-toolbar__group fixed-toolbar__group-${group.key}`}\n      data-toolbar-group-key={group.key}\n      key={group.key}\n    >\n      {group.type === 'dropdown' && group.items.length && groupState ? (\n        <ToolbarDropdown\n          anchorElem={anchorElem}\n          editor={editor}\n          group={group}\n          groupState={groupState}\n          Icon={DropdownIcon}\n          itemsContainerClassNames={['fixed-toolbar__dropdown-items']}\n          label={dropdownLabel}\n        />\n      ) : null}\n      {group.type === 'buttons' && group.items.length\n        ? group.items.map((item) => {\n            const itemState = toolbarStates.itemStates.get(item.key)\n            return (\n              <ButtonGroupItem\n                active={itemState?.active ?? false}\n                anchorElem={anchorElem}\n                editor={editor}\n                enabled={itemState?.enabled ?? true}\n                item={item}\n                key={item.key}\n              />\n            )\n          })\n        : null}\n      {index < editorConfig.features.toolbarFixed?.groups.length - 1 && <div className=\"divider\" />}\n    </div>\n  )\n}\n\nfunction FixedToolbar({\n  anchorElem,\n  clientProps,\n  editor,\n  editorConfig,\n  parentWithFixedToolbar,\n}: {\n  anchorElem: HTMLElement\n  clientProps?: FixedToolbarFeatureProps\n  editor: LexicalEditor\n  editorConfig: SanitizedClientEditorConfig\n  parentWithFixedToolbar: EditorConfigContextType | false\n}): React.ReactNode {\n  const currentToolbarRef = React.useRef<HTMLDivElement>(null)\n  const isEditable = useLexicalEditable()\n\n  const { y } = useScrollInfo()\n\n  const toolbarStates = useToolbarStates(editor, editorConfig?.features?.toolbarFixed?.groups)\n\n  // Memoize the parent toolbar element\n  const parentToolbarElem = useMemo(() => {\n    if (!parentWithFixedToolbar || clientProps?.disableIfParentHasFixedToolbar) {\n      return null\n    }\n\n    const parentEditorElem = parentWithFixedToolbar.editorContainerRef.current\n    let sibling = parentEditorElem.previousElementSibling\n    while (sibling) {\n      if (sibling.classList.contains('fixed-toolbar')) {\n        return sibling\n      }\n      sibling = sibling.previousElementSibling\n    }\n    return null\n  }, [clientProps?.disableIfParentHasFixedToolbar, parentWithFixedToolbar])\n\n  useThrottledEffect(\n    () => {\n      if (!parentToolbarElem) {\n        // this also checks for clientProps?.disableIfParentHasFixedToolbar indirectly, see the parentToolbarElem useMemo\n        return\n      }\n      const currentToolbarElem = currentToolbarRef.current\n      if (!currentToolbarElem) {\n        return\n      }\n\n      const currentRect = currentToolbarElem.getBoundingClientRect()\n      const parentRect = parentToolbarElem.getBoundingClientRect()\n\n      // we only need to check for vertical overlap\n      const overlapping = !(\n        currentRect.bottom < parentRect.top || currentRect.top > parentRect.bottom\n      )\n\n      if (overlapping) {\n        currentToolbarElem.classList.remove('fixed-toolbar')\n        currentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--overlapping')\n        parentToolbarElem.classList.remove('fixed-toolbar')\n        parentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--hide')\n      } else {\n        if (!currentToolbarElem.classList.contains('fixed-toolbar--overlapping')) {\n          return\n        }\n        currentToolbarElem.classList.remove('fixed-toolbar--overlapping')\n        currentToolbarElem.classList.add('fixed-toolbar')\n        parentToolbarElem.classList.remove('fixed-toolbar--hide')\n        parentToolbarElem.classList.add('fixed-toolbar')\n      }\n    },\n    50,\n    [currentToolbarRef, parentToolbarElem, y],\n  )\n\n  return (\n    <div\n      className=\"fixed-toolbar\"\n      onFocus={(event) => {\n        // Prevent other focus events being triggered. Otherwise, if this was to be clicked while in a child editor,\n        // the parent editor will be focused, and the child editor will lose focus.\n        event.stopPropagation()\n      }}\n      ref={currentToolbarRef}\n    >\n      {isEditable && (\n        <React.Fragment>\n          {editorConfig?.features &&\n            editorConfig.features?.toolbarFixed?.groups.map((group, i) => {\n              return (\n                <ToolbarGroupComponent\n                  anchorElem={anchorElem}\n                  editor={editor}\n                  editorConfig={editorConfig}\n                  group={group}\n                  index={i}\n                  key={group.key}\n                  toolbarStates={toolbarStates}\n                />\n              )\n            })}\n        </React.Fragment>\n      )}\n    </div>\n  )\n}\n\nconst getParentEditorWithFixedToolbar = (\n  editorConfigContext: EditorConfigContextType,\n): EditorConfigContextType | false => {\n  if (editorConfigContext.parentEditor?.editorConfig) {\n    if (editorConfigContext.parentEditor?.editorConfig.resolvedFeatureMap.has('toolbarFixed')) {\n      return editorConfigContext.parentEditor\n    } else {\n      if (editorConfigContext.parentEditor) {\n        return getParentEditorWithFixedToolbar(editorConfigContext.parentEditor)\n      }\n    }\n  }\n  return false\n}\n\nexport const FixedToolbarPlugin: PluginComponent<FixedToolbarFeatureProps> = ({ clientProps }) => {\n  const [currentEditor] = useLexicalComposerContext()\n  const editorConfigContext = useEditorConfigContext()\n  const isEditable = useLexicalEditable()\n  if (!isEditable) {\n    return null\n  }\n\n  const { editorConfig: currentEditorConfig } = editorConfigContext\n\n  const editor = clientProps.applyToFocusedEditor\n    ? editorConfigContext.focusedEditor?.editor || currentEditor\n    : currentEditor\n\n  const editorConfig = clientProps.applyToFocusedEditor\n    ? editorConfigContext.focusedEditor?.editorConfig || currentEditorConfig\n    : currentEditorConfig\n\n  const parentWithFixedToolbar = getParentEditorWithFixedToolbar(editorConfigContext)\n\n  if (clientProps?.disableIfParentHasFixedToolbar) {\n    if (parentWithFixedToolbar) {\n      return null\n    }\n  }\n\n  if (!editorConfig?.features?.toolbarFixed?.groups?.length) {\n    return null\n  }\n\n  return (\n    <FixedToolbar\n      anchorElem={document.body}\n      clientProps={clientProps}\n      editor={editor}\n      editorConfig={editorConfig}\n      parentWithFixedToolbar={parentWithFixedToolbar}\n    />\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport { useScrollInfo, useThrottledEffect, useTranslation } from '@payloadcms/ui'\nimport * as React from 'react'\nimport { useMemo } from 'react'\n\nimport type { EditorConfigContextType } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport type { SanitizedClientEditorConfig } from '../../../../../lexical/config/types.js'\nimport type { PluginComponent } from '../../../../typesClient.js'\nimport type { ToolbarStates } from '../../../shared/useToolbarStates.js'\nimport type { ToolbarGroup, ToolbarGroupItem } from '../../../types.js'\nimport type { FixedToolbarFeatureProps } from '../../server/index.js'\n\nimport { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport { ToolbarButton } from '../../../shared/ToolbarButton/index.js'\nimport { ToolbarDropdown } from '../../../shared/ToolbarDropdown/index.js'\nimport { useToolbarStates } from '../../../shared/useToolbarStates.js'\nimport './index.scss'\n\nfunction ButtonGroupItem({\n  active,\n  anchorElem,\n  editor,\n  enabled,\n  item,\n}: {\n  active: boolean\n  anchorElem: HTMLElement\n  editor: LexicalEditor\n  enabled: boolean\n  item: ToolbarGroupItem\n}): React.ReactNode {\n  if (item.Component) {\n    return (\n      item?.Component && (\n        <item.Component anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n      )\n    )\n  }\n\n  if (!item.ChildComponent) {\n    return null\n  }\n\n  return (\n    <ToolbarButton active={active} editor={editor} enabled={enabled} item={item} key={item.key}>\n      <item.ChildComponent />\n    </ToolbarButton>\n  )\n}\n\nfunction ToolbarGroupComponent({\n  anchorElem,\n  editor,\n  editorConfig,\n  group,\n  index,\n  toolbarStates,\n}: {\n  anchorElem: HTMLElement\n  editor: LexicalEditor\n  editorConfig: SanitizedClientEditorConfig\n  group: ToolbarGroup\n  index: number\n  toolbarStates: ToolbarStates\n}): React.ReactNode {\n  const { i18n } = useTranslation<{}, string>()\n  const {\n    fieldProps: { featureClientSchemaMap, schemaPath },\n  } = useEditorConfigContext()\n\n  const groupState = toolbarStates.groupStates.get(group.key)\n\n  const DropdownIcon = useMemo(() => {\n    if (group.type !== 'dropdown') {\n      return undefined\n    }\n    const activeItem = groupState?.activeItems?.[0]\n    if (activeItem) {\n      return activeItem.ChildComponent\n    }\n    return group.ChildComponent\n  }, [group, groupState?.activeItems])\n\n  const dropdownLabel = useMemo(() => {\n    if (group.type !== 'dropdown') {\n      return undefined\n    }\n    const activeItems = groupState?.activeItems\n    if (!activeItems?.length) {\n      return undefined\n    }\n    if (activeItems.length > 1) {\n      return i18n.t('lexical:general:toolbarItemsActive', { count: activeItems.length })\n    }\n    const item = activeItems[0]!\n    let label = item.key\n    if (item.label) {\n      label =\n        typeof item.label === 'function'\n          ? item.label({ featureClientSchemaMap, i18n, schemaPath })\n          : item.label\n    }\n    if (label.length > 25) {\n      label = label.substring(0, 25) + '...'\n    }\n    return label\n  }, [group, groupState?.activeItems, i18n, featureClientSchemaMap, schemaPath])\n\n  return (\n    <div\n      className={`fixed-toolbar__group fixed-toolbar__group-${group.key}`}\n      data-toolbar-group-key={group.key}\n      key={group.key}\n    >\n      {group.type === 'dropdown' && group.items.length && groupState ? (\n        <ToolbarDropdown\n          anchorElem={anchorElem}\n          editor={editor}\n          group={group}\n          groupState={groupState}\n          Icon={DropdownIcon}\n          itemsContainerClassNames={['fixed-toolbar__dropdown-items']}\n          label={dropdownLabel}\n        />\n      ) : null}\n      {group.type === 'buttons' && group.items.length\n        ? group.items.map((item) => {\n            const itemState = toolbarStates.itemStates.get(item.key)\n            return (\n              <ButtonGroupItem\n                active={itemState?.active ?? false}\n                anchorElem={anchorElem}\n                editor={editor}\n                enabled={itemState?.enabled ?? true}\n                item={item}\n                key={item.key}\n              />\n            )\n          })\n        : null}\n      {index < editorConfig.features.toolbarFixed?.groups.length - 1 && <div className=\"divider\" />}\n    </div>\n  )\n}\n\nfunction FixedToolbar({\n  anchorElem,\n  clientProps,\n  editor,\n  editorConfig,\n  parentWithFixedToolbar,\n}: {\n  anchorElem: HTMLElement\n  clientProps?: FixedToolbarFeatureProps\n  editor: LexicalEditor\n  editorConfig: SanitizedClientEditorConfig\n  parentWithFixedToolbar: EditorConfigContextType | false\n}): React.ReactNode {\n  const currentToolbarRef = React.useRef<HTMLDivElement>(null)\n  const isEditable = useLexicalEditable()\n\n  const { y } = useScrollInfo()\n\n  const toolbarStates = useToolbarStates(editor, editorConfig?.features?.toolbarFixed?.groups)\n\n  // Memoize the parent toolbar element\n  const parentToolbarElem = useMemo(() => {\n    if (!parentWithFixedToolbar || clientProps?.disableIfParentHasFixedToolbar) {\n      return null\n    }\n\n    const parentEditorElem = parentWithFixedToolbar.editorContainerRef.current\n    let sibling = parentEditorElem.previousElementSibling\n    while (sibling) {\n      if (sibling.classList.contains('fixed-toolbar')) {\n        return sibling\n      }\n      sibling = sibling.previousElementSibling\n    }\n    return null\n  }, [clientProps?.disableIfParentHasFixedToolbar, parentWithFixedToolbar])\n\n  useThrottledEffect(\n    () => {\n      if (!parentToolbarElem) {\n        // this also checks for clientProps?.disableIfParentHasFixedToolbar indirectly, see the parentToolbarElem useMemo\n        return\n      }\n      const currentToolbarElem = currentToolbarRef.current\n      if (!currentToolbarElem) {\n        return\n      }\n\n      const currentRect = currentToolbarElem.getBoundingClientRect()\n      const parentRect = parentToolbarElem.getBoundingClientRect()\n\n      // we only need to check for vertical overlap\n      const overlapping = !(\n        currentRect.bottom < parentRect.top || currentRect.top > parentRect.bottom\n      )\n\n      if (overlapping) {\n        currentToolbarElem.classList.remove('fixed-toolbar')\n        currentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--overlapping')\n        parentToolbarElem.classList.remove('fixed-toolbar')\n        parentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--hide')\n      } else {\n        if (!currentToolbarElem.classList.contains('fixed-toolbar--overlapping')) {\n          return\n        }\n        currentToolbarElem.classList.remove('fixed-toolbar--overlapping')\n        currentToolbarElem.classList.add('fixed-toolbar')\n        parentToolbarElem.classList.remove('fixed-toolbar--hide')\n        parentToolbarElem.classList.add('fixed-toolbar')\n      }\n    },\n    50,\n    [currentToolbarRef, parentToolbarElem, y],\n  )\n\n  return (\n    <div\n      className=\"fixed-toolbar\"\n      onFocus={(event) => {\n        // Prevent other focus events being triggered. Otherwise, if this was to be clicked while in a child editor,\n        // the parent editor will be focused, and the child editor will lose focus.\n        event.stopPropagation()\n      }}\n      ref={currentToolbarRef}\n    >\n      {isEditable && (\n        <React.Fragment>\n          {editorConfig?.features &&\n            editorConfig.features?.toolbarFixed?.groups.map((group, i) => {\n              return (\n                <ToolbarGroupComponent\n                  anchorElem={anchorElem}\n                  editor={editor}\n                  editorConfig={editorConfig}\n                  group={group}\n                  index={i}\n                  key={group.key}\n                  toolbarStates={toolbarStates}\n                />\n              )\n            })}\n        </React.Fragment>\n      )}\n    </div>\n  )\n}\n\nconst getParentEditorWithFixedToolbar = (\n  editorConfigContext: EditorConfigContextType,\n): EditorConfigContextType | false => {\n  if (editorConfigContext.parentEditor?.editorConfig) {\n    if (editorConfigContext.parentEditor?.editorConfig.resolvedFeatureMap.has('toolbarFixed')) {\n      return editorConfigContext.parentEditor\n    } else {\n      if (editorConfigContext.parentEditor) {\n        return getParentEditorWithFixedToolbar(editorConfigContext.parentEditor)\n      }\n    }\n  }\n  return false\n}\n\nexport const FixedToolbarPlugin: PluginComponent<FixedToolbarFeatureProps> = ({ clientProps }) => {\n  const [currentEditor] = useLexicalComposerContext()\n  const editorConfigContext = useEditorConfigContext()\n  const isEditable = useLexicalEditable()\n  if (!isEditable) {\n    return null\n  }\n\n  const { editorConfig: currentEditorConfig } = editorConfigContext\n\n  const editor = clientProps.applyToFocusedEditor\n    ? editorConfigContext.focusedEditor?.editor || currentEditor\n    : currentEditor\n\n  const editorConfig = clientProps.applyToFocusedEditor\n    ? editorConfigContext.focusedEditor?.editorConfig || currentEditorConfig\n    : currentEditorConfig\n\n  const parentWithFixedToolbar = getParentEditorWithFixedToolbar(editorConfigContext)\n\n  if (clientProps?.disableIfParentHasFixedToolbar) {\n    if (parentWithFixedToolbar) {\n      return null\n    }\n  }\n\n  if (!editorConfig?.features?.toolbarFixed?.groups?.length) {\n    return null\n  }\n\n  return (\n    <FixedToolbar\n      anchorElem={document.body}\n      clientProps={clientProps}\n      editor={editor}\n      editorConfig={editorConfig}\n      parentWithFixedToolbar={parentWithFixedToolbar}\n    />\n  )\n}\n"],"names":["useLexicalComposerContext","useLexicalEditable","useScrollInfo","useThrottledEffect","useTranslation","React","useMemo","useEditorConfigContext","ToolbarButton","ToolbarDropdown","useToolbarStates","ButtonGroupItem","active","anchorElem","editor","enabled","item","Component","key","ChildComponent","ToolbarGroupComponent","editorConfig","group","index","toolbarStates","i18n","fieldProps","featureClientSchemaMap","schemaPath","groupState","groupStates","get","DropdownIcon","type","undefined","activeItem","activeItems","dropdownLabel","length","t","count","label","substring","div","className","data-toolbar-group-key","items","Icon","itemsContainerClassNames","map","itemState","itemStates","features","toolbarFixed","groups","FixedToolbar","clientProps","parentWithFixedToolbar","currentToolbarRef","useRef","isEditable","y","parentToolbarElem","disableIfParentHasFixedToolbar","parentEditorElem","editorContainerRef","current","sibling","previousElementSibling","classList","contains","currentToolbarElem","currentRect","getBoundingClientRect","parentRect","overlapping","bottom","top","remove","add","onFocus","event","stopPropagation","ref","Fragment","i","getParentEditorWithFixedToolbar","editorConfigContext","parentEditor","resolvedFeatureMap","has","FixedToolbarPlugin","currentEditor","currentEditorConfig","applyToFocusedEditor","focusedEditor","document","body"],"mappings":"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"}