npm - @payloadcms/richtext-lexical - Versions diffs - 3.54.0-canary.0 → 3.54.0-canary.2 - Mend

@payloadcms/richtext-lexical 3.54.0-canary.0 → 3.54.0-canary.2

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

Files changed (19) hide show

package/dist/features/toolbars/fixed/client/Toolbar/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/index.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAEjE,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAA;AAKrE,OAAO,cAAc,CAAA;~~AAgQrB~~,eAAO,MAAM,kBAAkB,EAAE,eAAe,CAAC,wBAAwB,CAkCxE,CAAA"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/index.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAEjE,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAA;AAKrE,OAAO,cAAc,CAAA;AAoQrB,eAAO,MAAM,kBAAkB,EAAE,eAAe,CAAC,wBAAwB,CAkCxE,CAAA"}

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

@@ -134,6 +134,7 @@ function ToolbarGroupComponent(t0) {
   if ($[13] !== DropdownIcon || $[14] !== anchorElem || $[15] !== dropdownLabel || $[16] !== editor || $[17] !== editorConfig.features.toolbarFixed?.groups.length || $[18] !== group || $[19] !== index || $[20] !== onActiveChange || $[21] !== t5) {
     t6 = _jsxs("div", {
       className: t5,
+      "data-toolbar-group-key": group.key,
       children: [group.type === "dropdown" && group.items.length ? DropdownIcon ? _jsx(ToolbarDropdown, {
         anchorElem,
         editor,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","useScrollInfo","useThrottledEffect","useTranslation","React","useMemo","useEditorConfigContext","ToolbarButton","ToolbarDropdown","ButtonGroupItem","anchorElem","editor","item","Component","_jsx","key","ChildComponent","ToolbarGroupComponent","t0","$","editorConfig","group","index","i18n","fieldProps","t1","featureClientSchemaMap","schemaPath","dropdownLabel","setDropdownLabel","useState","undefined","DropdownIcon","setDropdownIcon","t2","items","type","length","t3","useEffect","t4","t5","activeItems","label","substring","t","count","onActiveChange","t6","features","toolbarFixed","groups","_jsxs","className","children","Icon","itemsContainerClassNames","maxActiveItems","map","item_0","FixedToolbar","clientProps","parentWithFixedToolbar","currentToolbarRef","useRef","y","parentToolbarElem","disableIfParentHasFixedToolbar","parentEditorElem","editorContainerRef","current","sibling","previousElementSibling","classList","contains","currentToolbarElem","currentRect","getBoundingClientRect","parentRect","overlapping","bottom","top","remove","add","onFocus","event","stopPropagation","ref","isEditable","Fragment","i","getParentEditorWithFixedToolbar","editorConfigContext","parentEditor","resolvedFeatureMap","has","FixedToolbarPlugin","currentEditor","currentEditorConfig","applyToFocusedEditor","focusedEditor","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 { 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 { 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 './index.scss'\n\nfunction ButtonGroupItem({\n anchorElem,\n editor,\n item,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\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 editor={editor} 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}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n editorConfig: SanitizedClientEditorConfig\n group: ToolbarGroup\n index: number\n}): React.ReactNode {\n const { i18n } = useTranslation<{}, string>()\n const {\n fieldProps: { featureClientSchemaMap, schemaPath },\n } = useEditorConfigContext()\n const [dropdownLabel, setDropdownLabel] = React.useState<string \| undefined>(undefined)\n const [DropdownIcon, setDropdownIcon] = React.useState<React.FC \| undefined>(undefined)\n\n React.useEffect(() => {\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent!)\n } else {\n setDropdownIcon(undefined)\n }\n }, [group])\n\n const onActiveChange = React.useCallback(\n ({ activeItems }: { activeItems: ToolbarGroupItem[] }) => {\n if (!activeItems.length) {\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent!)\n setDropdownLabel(undefined)\n } else {\n setDropdownIcon(undefined)\n setDropdownLabel(undefined)\n }\n return\n }\n const item = activeItems[0]!\n\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 // Crop title to max. 25 characters\n if (label.length > 25) {\n label = label.substring(0, 25) + '...'\n }\n if (activeItems.length === 1) {\n setDropdownLabel(label)\n setDropdownIcon(() => item.ChildComponent)\n } else {\n setDropdownLabel(\n i18n.t('lexical:general:toolbarItemsActive', { count: activeItems.length }),\n )\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent!)\n } else {\n setDropdownIcon(undefined)\n }\n }\n },\n [group, i18n, featureClientSchemaMap, schemaPath],\n )\n\n return (\n <div className={`fixed-toolbar__group fixed-toolbar__group-${group.key}`} key={group.key}>\n {group.type === 'dropdown' && group.items.length ? (\n DropdownIcon ? (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n Icon={DropdownIcon}\n itemsContainerClassNames={['fixed-toolbar__dropdown-items']}\n label={dropdownLabel}\n maxActiveItems={group.maxActiveItems ?? 1}\n onActiveChange={onActiveChange}\n />\n ) : (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n itemsContainerClassNames={['fixed-toolbar__dropdown-items']}\n label={dropdownLabel}\n maxActiveItems={group.maxActiveItems ?? 1}\n onActiveChange={onActiveChange}\n />\n )\n ) : null}\n {group.type === 'buttons' && group.items.length\n ? group.items.map((item) => {\n return (\n <ButtonGroupItem anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\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\n const { y } = useScrollInfo()\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 {editor.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 />\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\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 editor={editor}\n editorConfig={editorConfig}\n parentWithFixedToolbar={parentWithFixedToolbar}\n />\n )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SAASC,yBAAyB,QAAQ;AAC1C,SAASC,aAAa,EAAEC,kBAAkB,EAAEC,cAAc,QAAQ;AAClE,YAAYC,KAAA,MAAW;AACvB,SAASC,OAAO,QAAQ;AAQxB,SAASC,sBAAsB,QAAQ;AACvC,SAASC,aAAa,QAAQ;AAC9B,SAASC,eAAe,QAAQ;AAGhC,SAASC,gBAAgB;EACvBC,UAAU;EACVC,MAAM;EACNC;AAAI,CAKL;EACC,IAAIA,IAAA,CAAKC,SAAS,EAAE;IAClB,OACED,IAAA,EAAMC,SAAA,iBACJC,IAAA,CAACF,IAAA,CAAKC,SAAS;MAACH,UAAA,EAAYA,UAAA;MAAYC,MAAA,EAAQA,MAAA;MAAQC,IAAA,EAAMA;OAAWA,IAAA,CAAKG,GAAG;EAGvF;EAEA,IAAI,CAACH,IAAA,CAAKI,cAAc,EAAE;IACxB,OAAO;EACT;EAEA,oBACEF,IAAA,CAACP,aAAA;IAAcI,MAAA,EAAQA,MAAA;IAAQC,IAAA,EAAMA,IAAA;cACnC,aAAAE,IAAA,CAACF,IAAA,CAAKI,cAAc;KAD0BJ,IAAA,CAAKG,GAAG;AAI5D;AAEA,SAAAE,sBAAAC,EAAA;EAAA,MAAAC,CAAA,GAAApB,EAAA;EAA+B;IAAAW,UAAA;IAAAC,MAAA;IAAAS,YAAA;IAAAC,KAAA;IAAAC;EAAA,IAAAJ,EAY9B;EACC;IAAAK;EAAA,IAAiBpB,cAAA;EACjB;IAAAqB,UAAA,EAAAC;EAAA,IAEInB,sBAAA;EADU;IAAAoB,sBAAA;IAAAC;EAAA,IAAAF,EAAsC;EAEpD,OAAAG,aAAA,EAAAC,gBAAA,IAA0CzB,KAAA,CAAA0B,QAAA,CAAAC,SAAmC;EAC7E,OAAAC,YAAA,EAAAC,eAAA,IAAwC7B,KAAA,CAAA0B,QAAA,CAAAC,SAAqC;EAAA,IAAAG,EAAA;EAAA,IAAAf,CAAA,QAAAE,KAAA,CAAAL,cAAA,IAAAG,CAAA,QAAAE,KAAA,CAAAc,KAAA,IAAAhB,CAAA,QAAAE,KAAA,CAAAe,IAAA;IAE7DF,EAAA,GAAAA,CAAA;MAAA,IACVb,KAAA,EAAAe,IAAA,KAAgB,cAAcf,KAAA,CAAAc,KAAA,CAAAE,MAAkB,IAAIhB,KAAA,CAAAL,cAAoB;QAC1EiB,eAAA,OAAsBZ,KAAA,CAAAL,cAAoB;MAAA;QAE1CiB,eAAA,CAAAF,SAAgB;MAAA;IAAA;IAEpBZ,CAAA,MAAAE,KAAA,CAAAL,cAAA;IAAAG,CAAA,MAAAE,KAAA,CAAAc,KAAA;IAAAhB,CAAA,MAAAE,KAAA,CAAAe,IAAA;IAAAjB,CAAA,MAAAe,EAAA;EAAA;IAAAA,EAAA,GAAAf,CAAA;EAAA;EAAA,IAAAmB,EAAA;EAAA,IAAAnB,CAAA,QAAAE,KAAA;IAAGiB,EAAA,IAACjB,KAAA;IAAMF,CAAA,MAAAE,KAAA;IAAAF,CAAA,MAAAmB,EAAA;EAAA;IAAAA,EAAA,GAAAnB,CAAA;EAAA;EANVf,KAAA,CAAAmC,SAAA,CAAgBL,EAMhB,EAAGI,EAAO;EAAA,IAAAE,EAAA;EAAA,IAAArB,CAAA,QAAAO,sBAAA,IAAAP,CAAA,QAAAE,KAAA,CAAAL,cAAA,IAAAG,CAAA,QAAAE,KAAA,CAAAc,KAAA,IAAAhB,CAAA,QAAAE,KAAA,CAAAe,IAAA,IAAAjB,CAAA,SAAAI,IAAA,IAAAJ,CAAA,SAAAQ,UAAA;IAGRa,EAAA,GAAAC,EAAA;MAAC;QAAAC;MAAA,IAAAD,EAAoD;MAAA,KAC9CC,WAAA,CAAAL,MAAA;QAAA,IACChB,KAAA,EAAAe,IAAA,KAAgB,cAAcf,KAAA,CAAAc,KAAA,CAAAE,MAAkB,IAAIhB,KAAA,CAAAL,cAAoB;UAC1EiB,eAAA,OAAsBZ,KAAA,CAAAL,cAAoB;UAC1Ca,gBAAA,CAAAE,SAAiB;QAAA;UAEjBE,eAAA,CAAAF,SAAgB;UAChBF,gBAAA,CAAAE,SAAiB;QAAA;QAAA;MAAA;MAIrB,MAAAnB,IAAA,GAAa8B,WAAW;MAExB,IAAAC,KAAA,GAAY/B,IAAA,CAAAG,GAAA;MAAQ,IAChBH,IAAA,CAAA+B,KAAA;QACFA,KAAA,CAAAA,CAAA,CACEA,MAAA,CAAO/B,IAAA,CAAA+B,KAAA,KAAe,aAClB/B,IAAA,CAAA+B,KAAA;UAAAjB,sBAAA;UAAAH,IAAA;UAAAI;QAAA,CAAsD,IACtDf,IAAA,CAAA+B,KAAU;MAHhB;MAAA,IAMEA,KAAA,CAAAN,MAAA,KAAe;QACjBM,KAAA,CAAAA,CAAA,CAAQA,KAAA,CAAAC,SAAA,MAAmB,IAAM;MAAjC;MAAA,IAEEF,WAAA,CAAAL,MAAA,MAAuB;QACzBR,gBAAA,CAAiBc,KAAA;QACjBV,eAAA,OAAsBrB,IAAA,CAAAI,cAAmB;MAAA;QAEzCa,gBAAA,CACEN,IAAA,CAAAsB,CAAA,CAAO;UAAAC,KAAA,EAA+CJ,WAAA,CAAAL;QAAA,CAAmB;QAAA,IAEvEhB,KAAA,EAAAe,IAAA,KAAgB,cAAcf,KAAA,CAAAc,KAAA,CAAAE,MAAkB,IAAIhB,KAAA,CAAAL,cAAoB;UAC1EiB,eAAA,OAAsBZ,KAAA,CAAAL,cAAoB;QAAA;UAE1CiB,eAAA,CAAAF,SAAgB;QAAA;MAAA;IAAA;IAGtBZ,CAAA,MAAAO,sBAAA;IAAAP,CAAA,MAAAE,KAAA,CAAAL,cAAA;IAAAG,CAAA,MAAAE,KAAA,CAAAc,KAAA;IAAAhB,CAAA,MAAAE,KAAA,CAAAe,IAAA;IAAAjB,CAAA,OAAAI,IAAA;IAAAJ,CAAA,OAAAQ,UAAA;IAAAR,CAAA,OAAAqB,EAAA;EAAA;IAAAA,EAAA,GAAArB,CAAA;EAAA;EAtCF,MAAA4B,cAAA,GAAuBP,EAuC4B;EAIjC,MAAAC,EAAA,gDAA6CpB,KAAA,CAAAN,GAAA,EAAW;EAAA,IAAAiC,EAAA;EAAA,IAAA7B,CAAA,SAAAa,YAAA,IAAAb,CAAA,SAAAT,UAAA,IAAAS,CAAA,SAAAS,aAAA,IAAAT,CAAA,SAAAR,MAAA,IAAAQ,CAAA,SAAAC,YAAA,CAAA6B,QAAA,CAAAC,YAAA,EAAAC,MAAA,CAAAd,MAAA,IAAAlB,CAAA,SAAAE,KAAA,IAAAF,CAAA,SAAAG,KAAA,IAAAH,CAAA,SAAA4B,cAAA,IAAA5B,CAAA,SAAAsB,EAAA;IAAxEO,EAAA,GAAAI,KAAA,CAAC;MAAAC,SAAA,EAAeZ,EAAwD;MAAAa,QAAA,GACrEjC,KAAA,CAAAe,IAAA,KAAe,cAAcf,KAAA,CAAAc,KAAA,CAAAE,MAAkB,GAC9CL,YAAA,GACElB,IAAA,CAAAN,eAAA;QAAAE,UAAA;QAAAC,MAAA;QAAAU,KAAA;QAAAkC,IAAA,EAIQvB,YAAA;QAAAwB,wBAAA,GACqB;QAAAb,KAAA,EACpBf,aAAA;QAAA6B,cAAA,EACSpC,KAAA,CAAAoC,cAAA,KAAwB;QAAAV;MAAA,C,IAI1CjC,IAAA,CAAAN,eAAA;QAAAE,UAAA;QAAAC,MAAA;QAAAU,KAAA;QAAAmC,wBAAA,GAI6B;QAAAb,KAAA,EACpBf,aAAA;QAAA6B,cAAA,EACSpC,KAAA,CAAAoC,cAAA,KAAwB;QAAAV;MAAA,C,QAI1C,EACH1B,KAAA,CAAAe,IAAA,KAAe,aAAaf,KAAA,CAAAc,KAAA,CAAAE,MAAkB,GAC3ChB,KAAA,CAAAc,KAAA,CAAAuB,GAAA,CAAAC,MAAA,IAEI7C,IAAA,CAAAL,eAAA;QAAAC,UAAA;QAAAC,MAAA;QAAAC,IAAA,EAA+DA;MAAA,GAAWA,MAAA,CAAAG,GAAQ,CAEtF,QACA,EACHO,KAAA,GAAQF,YAAA,CAAA6B,QAAA,CAAAC,YAAA,EAAAC,MAAA,CAAAd,MAAA,IAAoD,IAAKvB,IAAA,CAAC;QAAAuC,SAAA,EAAc;MAAA,C;OAhCJhC,KAAA,CAAAN,GAAS;IAAAI,CAAA,OAAAa,YAAA;IAAAb,CAAA,OAAAT,UAAA;IAAAS,CAAA,OAAAS,aAAA;IAAAT,CAAA,OAAAR,MAAA;IAAAQ,CAAA,OAAAC,YAAA,CAAA6B,QAAA,CAAAC,YAAA,EAAAC,MAAA,CAAAd,MAAA;IAAAlB,CAAA,OAAAE,KAAA;IAAAF,CAAA,OAAAG,KAAA;IAAAH,CAAA,OAAA4B,cAAA;IAAA5B,CAAA,OAAAsB,EAAA;IAAAtB,CAAA,OAAA6B,EAAA;EAAA;IAAAA,EAAA,GAAA7B,CAAA;EAAA;EAAA,OAAxF6B,EAAwF;AAAA;AAqC5F,SAASY,aAAa;EACpBlD,UAAU;EACVmD,WAAW;EACXlD,MAAM;EACNS,YAAY;EACZ0C;AAAsB,CAOvB;EACC,MAAMC,iBAAA,GAAoB3D,KAAA,CAAM4D,MAAM,CAAiB;EAEvD,MAAM;IAAEC;EAAC,CAAE,GAAGhE,aAAA;EAEd;EACA,MAAMiE,iBAAA,GAAoB7D,OAAA,CAAQ;IAChC,IAAI,CAACyD,sBAAA,IAA0BD,WAAA,EAAaM,8BAAA,EAAgC;MAC1E,OAAO;IACT;IAEA,MAAMC,gBAAA,GAAmBN,sBAAA,CAAuBO,kBAAkB,CAACC,OAAO;IAC1E,IAAIC,OAAA,GAAUH,gBAAA,CAAiBI,sBAAsB;IACrD,OAAOD,OAAA,EAAS;MACd,IAAIA,OAAA,CAAQE,SAAS,CAACC,QAAQ,CAAC,kBAAkB;QAC/C,OAAOH,OAAA;MACT;MACAA,OAAA,GAAUA,OAAA,CAAQC,sBAAsB;IAC1C;IACA,OAAO;EACT,GAAG,CAACX,WAAA,EAAaM,8BAAA,EAAgCL,sBAAA,CAAuB;EAExE5D,kBAAA,CACE;IACE,IAAI,CAACgE,iBAAA,EAAmB;MACtB;MACA;IACF;IACA,MAAMS,kBAAA,GAAqBZ,iBAAA,CAAkBO,OAAO;IACpD,IAAI,CAACK,kBAAA,EAAoB;MACvB;IACF;IAEA,MAAMC,WAAA,GAAcD,kBAAA,CAAmBE,qBAAqB;IAC5D,MAAMC,UAAA,GAAaZ,iBAAA,CAAkBW,qBAAqB;IAE1D;IACA,MAAME,WAAA,GAAc,EAClBH,WAAA,CAAYI,MAAM,GAAGF,UAAA,CAAWG,GAAG,IAAIL,WAAA,CAAYK,GAAG,GAAGH,UAAA,CAAWE,MAAM,CAAD;IAG3E,IAAID,WAAA,EAAa;MACfJ,kBAAA,CAAmBF,SAAS,CAACS,MAAM,CAAC;MACpCP,kBAAA,CAAmBF,SAAS,CAACU,GAAG,CAAC,iBAAiB;MAClDjB,iBAAA,CAAkBO,SAAS,CAACS,MAAM,CAAC;MACnChB,iBAAA,CAAkBO,SAAS,CAACU,GAAG,CAAC,iBAAiB;IACnD,OAAO;MACL,IAAI,CAACR,kBAAA,CAAmBF,SAAS,CAACC,QAAQ,CAAC,+BAA+B;QACxE;MACF;MACAC,kBAAA,CAAmBF,SAAS,CAACS,MAAM,CAAC;MACpCP,kBAAA,CAAmBF,SAAS,CAACU,GAAG,CAAC;MACjCjB,iBAAA,CAAkBO,SAAS,CAACS,MAAM,CAAC;MACnChB,iBAAA,CAAkBO,SAAS,CAACU,GAAG,CAAC;IAClC;EACF,GACA,IACA,CAACpB,iBAAA,EAAmBG,iBAAA,EAAmBD,CAAA,CAAE;EAG3C,oBACEnD,IAAA,CAAC;IACCuC,SAAA,EAAU;IACV+B,OAAA,EAAUC,KAAA;MACR;MACA;MACAA,KAAA,CAAMC,eAAe;IACvB;IACAC,GAAA,EAAKxB,iBAAA;cAEJpD,MAAA,CAAO6E,UAAU,mBAChB1E,IAAA,CAACV,KAAA,CAAMqF,QAAQ;gBACZrE,YAAA,EAAc6B,QAAA,IACb7B,YAAA,CAAa6B,QAAQ,EAAEC,YAAA,EAAcC,MAAA,CAAOO,GAAA,CAAI,CAACrC,KAAA,EAAOqE,CAAA;QACtD,oBACE5E,IAAA,CAACG,qBAAA;UACCP,UAAA,EAAYA,UAAA;UACZC,MAAA,EAAQA,MAAA;UACRS,YAAA,EAAcA,YAAA;UACdC,KAAA,EAAOA,KAAA;UACPC,KAAA,EAAOoE;WACFrE,KAAA,CAAMN,GAAG;MAGpB;;;AAKZ;AAEA,MAAM4E,+BAAA,GACJC,mBAAA;EAEA,IAAIA,mBAAA,CAAoBC,YAAY,EAAEzE,YAAA,EAAc;IAClD,IAAIwE,mBAAA,CAAoBC,YAAY,EAAEzE,YAAA,CAAa0E,kBAAA,CAAmBC,GAAA,CAAI,iBAAiB;MACzF,OAAOH,mBAAA,CAAoBC,YAAY;IACzC,OAAO;MACL,IAAID,mBAAA,CAAoBC,YAAY,EAAE;QACpC,OAAOF,+BAAA,CAAgCC,mBAAA,CAAoBC,YAAY;MACzE;IACF;EACF;EACA,OAAO;AACT;AAEA,OAAO,MAAMG,kBAAA,GAAgE9E,EAAA;EAAA,MAAAC,CAAA,GAAApB,EAAA;EAAC;IAAA8D;EAAA,IAAA3C,EAAe;EAC3F,OAAA+E,aAAA,IAAwBjG,yBAAA;EACxB,MAAA4F,mBAAA,GAA4BtF,sBAAA;EAE5B;IAAAc,YAAA,EAAA8E;EAAA,IAA8CN,mBAAA;EAE9C,MAAAjF,MAAA,GAAekD,WAAA,CAAAsC,oBAAA,GACXP,mBAAA,CAAAQ,aAAA,EAAAzF,MAAA,IAA6CsF,aAAA,GAC7CA,aAAA;EAEJ,MAAA7E,YAAA,GAAqByC,WAAA,CAAAsC,oBAAA,GACjBP,mBAAA,CAAAQ,aAAA,EAAAhF,YAAA,IAAmD8E,mBAAA,GACnDA,mBAAA;EAAA,IAAAzE,EAAA;EAAA,IAAAS,EAAA;EAAA,IAAAf,CAAA,QAAA0C,WAAA,CAAAM,8BAAA,IAAAhD,CAAA,QAAAR,MAAA,IAAAQ,CAAA,QAAAC,YAAA,IAAAD,CAAA,QAAAyE,mBAAA;IAMO1D,EAAA,GAAAmE,MAAA,CAAAC,GAAA;IAAAC,GAAA;MAJX,MAAAzC,sBAAA,GAA+B6B,+BAAA,CAAgCC,mBAAA;MAAA,IAE3D/B,WAAA,EAAAM,8BAAA;QAAA,IACEL,sBAAA;UACK5B,EAAA;UAAA,MAAAqE,GAAA;QAAA;MAAA;MAAA,KAINnF,YAAA,EAAA6B,QAAA,EAAAC,YAAA,EAAAC,MAAA,EAAAd,MAAA;QACIH,EAAA;QAAA,MAAAqE,GAAA;MAAA;MAIP9E,EAAA,GAAAX,IAAA,CAAA8C,YAAA;QAAAlD,UAAA,EAAA8F,QAAA,CAAAC,IAAA;QAAA9F,MAAA;QAAAS,YAAA;QAAA0C;MAAA,C;;;;;;;;;;;;;;;SAAArC,E;CAOJ","ignoreList":[]}
1	+ {"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","useScrollInfo","useThrottledEffect","useTranslation","React","useMemo","useEditorConfigContext","ToolbarButton","ToolbarDropdown","ButtonGroupItem","anchorElem","editor","item","Component","_jsx","key","ChildComponent","ToolbarGroupComponent","t0","$","editorConfig","group","index","i18n","fieldProps","t1","featureClientSchemaMap","schemaPath","dropdownLabel","setDropdownLabel","useState","undefined","DropdownIcon","setDropdownIcon","t2","items","type","length","t3","useEffect","t4","t5","activeItems","label","substring","t","count","onActiveChange","t6","features","toolbarFixed","groups","_jsxs","className","children","Icon","itemsContainerClassNames","maxActiveItems","map","item_0","FixedToolbar","clientProps","parentWithFixedToolbar","currentToolbarRef","useRef","y","parentToolbarElem","disableIfParentHasFixedToolbar","parentEditorElem","editorContainerRef","current","sibling","previousElementSibling","classList","contains","currentToolbarElem","currentRect","getBoundingClientRect","parentRect","overlapping","bottom","top","remove","add","onFocus","event","stopPropagation","ref","isEditable","Fragment","i","getParentEditorWithFixedToolbar","editorConfigContext","parentEditor","resolvedFeatureMap","has","FixedToolbarPlugin","currentEditor","currentEditorConfig","applyToFocusedEditor","focusedEditor","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 { 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 { 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 './index.scss'\n\nfunction ButtonGroupItem({\n anchorElem,\n editor,\n item,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\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 editor={editor} 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}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n editorConfig: SanitizedClientEditorConfig\n group: ToolbarGroup\n index: number\n}): React.ReactNode {\n const { i18n } = useTranslation<{}, string>()\n const {\n fieldProps: { featureClientSchemaMap, schemaPath },\n } = useEditorConfigContext()\n const [dropdownLabel, setDropdownLabel] = React.useState<string \| undefined>(undefined)\n const [DropdownIcon, setDropdownIcon] = React.useState<React.FC \| undefined>(undefined)\n\n React.useEffect(() => {\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent!)\n } else {\n setDropdownIcon(undefined)\n }\n }, [group])\n\n const onActiveChange = React.useCallback(\n ({ activeItems }: { activeItems: ToolbarGroupItem[] }) => {\n if (!activeItems.length) {\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent!)\n setDropdownLabel(undefined)\n } else {\n setDropdownIcon(undefined)\n setDropdownLabel(undefined)\n }\n return\n }\n const item = activeItems[0]!\n\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 // Crop title to max. 25 characters\n if (label.length > 25) {\n label = label.substring(0, 25) + '...'\n }\n if (activeItems.length === 1) {\n setDropdownLabel(label)\n setDropdownIcon(() => item.ChildComponent)\n } else {\n setDropdownLabel(\n i18n.t('lexical:general:toolbarItemsActive', { count: activeItems.length }),\n )\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent!)\n } else {\n setDropdownIcon(undefined)\n }\n }\n },\n [group, i18n, featureClientSchemaMap, schemaPath],\n )\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 ? (\n DropdownIcon ? (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n Icon={DropdownIcon}\n itemsContainerClassNames={['fixed-toolbar__dropdown-items']}\n label={dropdownLabel}\n maxActiveItems={group.maxActiveItems ?? 1}\n onActiveChange={onActiveChange}\n />\n ) : (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n itemsContainerClassNames={['fixed-toolbar__dropdown-items']}\n label={dropdownLabel}\n maxActiveItems={group.maxActiveItems ?? 1}\n onActiveChange={onActiveChange}\n />\n )\n ) : null}\n {group.type === 'buttons' && group.items.length\n ? group.items.map((item) => {\n return (\n <ButtonGroupItem anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\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\n const { y } = useScrollInfo()\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 {editor.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 />\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\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 editor={editor}\n editorConfig={editorConfig}\n parentWithFixedToolbar={parentWithFixedToolbar}\n />\n )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/toolbars/inline/client/Toolbar/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/toolbars/inline/client/Toolbar/index.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAA;AAQ3E,OAAO,cAAc,CAAA;~~AAqXrB~~,eAAO,MAAM,mBAAmB,EAAE,yBAAyB,CAAC,SAAS,CAIpE,CAAA"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/toolbars/inline/client/Toolbar/index.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAA;AAQ3E,OAAO,cAAc,CAAA;AAsXrB,eAAO,MAAM,mBAAmB,EAAE,yBAAyB,CAAC,SAAS,CAIpE,CAAA"}

package/dist/features/toolbars/inline/client/Toolbar/index.js CHANGED Viewed

@@ -101,6 +101,7 @@ function ToolbarGroupComponent(t0) {
   if ($[10] !== DropdownIcon || $[11] !== anchorElem || $[12] !== editor || $[13] !== editorConfig.features.toolbarInline?.groups.length || $[14] !== group || $[15] !== index || $[16] !== onActiveChange || $[17] !== t4) {
     t5 = _jsxs("div", {
       className: t4,
+      "data-toolbar-group-key": group.key,
       children: [group.type === "dropdown" && group.items.length ? DropdownIcon ? _jsx(ToolbarDropdown, {
         anchorElem,
         editor,

package/dist/features/toolbars/inline/client/Toolbar/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","mergeRegister","$getSelection","$isRangeSelection","$isTextNode","COMMAND_PRIORITY_LOW","getDOMSelection","SELECTION_CHANGE_COMMAND","useCallback","useEffect","useRef","useState","React","createPortal","useEditorConfigContext","getDOMRangeRect","setFloatingElemPosition","ToolbarButton","ToolbarDropdown","ButtonGroupItem","anchorElem","editor","item","Component","_jsx","key","ChildComponent","ToolbarGroupComponent","t0","$","group","index","editorConfig","DropdownIcon","setDropdownIcon","t1","items","type","length","undefined","t2","t3","t4","activeItems","onActiveChange","t5","features","toolbarInline","groups","_jsxs","className","children","Icon","maxActiveItems","map","item_0","InlineToolbar","floatingToolbarRef","caretRef","closeFloatingToolbar","current","isOpacityZero","style","opacity","isPointerEventsNone","pointerEvents","mouseMoveListener","e","buttons","x","clientX","y","clientY","elementUnderMouse","document","elementFromPoint","contains","mouseUpListener","addEventListener","removeEventListener","$updateTextFormatFloatingToolbar","selection","nativeSelection","_window","possibleLinkEditor","querySelector","isLinkEditorVisible","rootElement","getRootElement","isCollapsed","anchorNode","rangeRect","offsetIfFlipped","alwaysDisplayOnTop","floatingElem","horizontalPosition","targetRect","anchorFlippedOffset","horizontalOffset","specialHandlingForCaret","verticalGap","scrollerElem","parentElement","update","getEditorState","read","window","registerUpdateListener","editorState","registerCommand","ref","i","useInlineToolbar","isText","setIsText","isComposing","getTextContent","nodes","getNodes","foundNodeWithText","node","rawTextContent","replace","updatePopup","registerRootListener","isEditable","InlineToolbarPlugin"],"sources":["../../../../../../src/features/toolbars/inline/client/Toolbar/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { mergeRegister } from '@lexical/utils'\nimport {\n $getSelection,\n $isRangeSelection,\n $isTextNode,\n COMMAND_PRIORITY_LOW,\n getDOMSelection,\n SELECTION_CHANGE_COMMAND,\n} from 'lexical'\nimport { useCallback, useEffect, useRef, useState } from 'react'\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\n\nimport type { PluginComponentWithAnchor } from '../../../../typesClient.js'\nimport type { ToolbarGroup, ToolbarGroupItem } from '../../../types.js'\n\nimport { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport { getDOMRangeRect } from '../../../../../lexical/utils/getDOMRangeRect.js'\nimport { setFloatingElemPosition } from '../../../../../lexical/utils/setFloatingElemPosition.js'\nimport { ToolbarButton } from '../../../shared/ToolbarButton/index.js'\nimport { ToolbarDropdown } from '../../../shared/ToolbarDropdown/index.js'\nimport './index.scss'\n\nfunction ButtonGroupItem({\n anchorElem,\n editor,\n item,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\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 if (!item.ChildComponent) {\n return null\n }\n\n return (\n <ToolbarButton editor={editor} item={item} key={item.key}>\n <item.ChildComponent />\n </ToolbarButton>\n )\n}\n\nfunction ToolbarGroupComponent({\n anchorElem,\n editor,\n group,\n index,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n group: ToolbarGroup\n index: number\n}): React.ReactNode {\n const { editorConfig } = useEditorConfigContext()\n\n const [DropdownIcon, setDropdownIcon] = React.useState<React.FC \| undefined>()\n\n React.useEffect(() => {\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent)\n } else {\n setDropdownIcon(undefined)\n }\n }, [group])\n\n const onActiveChange = useCallback(\n ({ activeItems }: { activeItems: ToolbarGroupItem[] }) => {\n if (!activeItems.length) {\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent)\n } else {\n setDropdownIcon(undefined)\n }\n return\n }\n const item = activeItems[0]\n setDropdownIcon(() => item?.ChildComponent)\n },\n [group],\n )\n\n return (\n <div\n className={`inline-toolbar-popup__group inline-toolbar-popup__group-${group.key}`}\n key={group.key}\n >\n {group.type === 'dropdown' && group.items.length ? (\n DropdownIcon ? (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n Icon={DropdownIcon}\n maxActiveItems={group.maxActiveItems ?? 1}\n onActiveChange={onActiveChange}\n />\n ) : (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n maxActiveItems={group.maxActiveItems ?? 1}\n onActiveChange={onActiveChange}\n />\n )\n ) : null}\n {group.type === 'buttons' && group.items.length\n ? group.items.map((item) => {\n return (\n <ButtonGroupItem anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n )\n })\n : null}\n {index < editorConfig.features.toolbarInline?.groups.length - 1 && (\n <div className=\"divider\" />\n )}\n </div>\n )\n}\n\nfunction InlineToolbar({\n anchorElem,\n editor,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n}): React.ReactNode {\n const floatingToolbarRef = useRef<HTMLDivElement \| null>(null)\n const caretRef = useRef<HTMLDivElement \| null>(null)\n\n const { editorConfig } = useEditorConfigContext()\n\n const closeFloatingToolbar = useCallback(() => {\n if (floatingToolbarRef?.current) {\n const isOpacityZero = floatingToolbarRef.current.style.opacity === '0'\n const isPointerEventsNone = floatingToolbarRef.current.style.pointerEvents === 'none'\n\n if (!isOpacityZero) {\n floatingToolbarRef.current.style.opacity = '0'\n }\n if (!isPointerEventsNone) {\n floatingToolbarRef.current.style.pointerEvents = 'none'\n }\n }\n }, [floatingToolbarRef])\n\n const mouseMoveListener = useCallback(\n (e: MouseEvent) => {\n if (floatingToolbarRef?.current && (e.buttons === 1 \|\| e.buttons === 3)) {\n const isOpacityZero = floatingToolbarRef.current.style.opacity === '0'\n const isPointerEventsNone = floatingToolbarRef.current.style.pointerEvents === 'none'\n if (!isOpacityZero \|\| !isPointerEventsNone) {\n // Check if the mouse is not over the popup\n const x = e.clientX\n const y = e.clientY\n const elementUnderMouse = document.elementFromPoint(x, y)\n if (!floatingToolbarRef.current.contains(elementUnderMouse)) {\n // Mouse is not over the target element => not a normal click, but probably a drag\n closeFloatingToolbar()\n }\n }\n }\n },\n [closeFloatingToolbar],\n )\n\n const mouseUpListener = useCallback(() => {\n if (floatingToolbarRef?.current) {\n if (floatingToolbarRef.current.style.opacity !== '1') {\n floatingToolbarRef.current.style.opacity = '1'\n }\n if (floatingToolbarRef.current.style.pointerEvents !== 'auto') {\n floatingToolbarRef.current.style.pointerEvents = 'auto'\n }\n }\n }, [])\n\n useEffect(() => {\n document.addEventListener('mousemove', mouseMoveListener)\n document.addEventListener('mouseup', mouseUpListener)\n\n return () => {\n document.removeEventListener('mousemove', mouseMoveListener)\n document.removeEventListener('mouseup', mouseUpListener)\n }\n }, [floatingToolbarRef, mouseMoveListener, mouseUpListener])\n\n const $updateTextFormatFloatingToolbar = useCallback(() => {\n const selection = $getSelection()\n\n const nativeSelection = getDOMSelection(editor._window)\n\n if (floatingToolbarRef.current === null) {\n return\n }\n\n const possibleLinkEditor = anchorElem.querySelector(':scope > .link-editor')\n const isLinkEditorVisible =\n possibleLinkEditor !== null &&\n 'style' in possibleLinkEditor &&\n possibleLinkEditor?.style?.['opacity' as keyof typeof possibleLinkEditor.style] === '1'\n\n const rootElement = editor.getRootElement()\n if (\n selection !== null &&\n nativeSelection !== null &&\n !nativeSelection.isCollapsed &&\n rootElement !== null &&\n rootElement.contains(nativeSelection.anchorNode)\n ) {\n const rangeRect = getDOMRangeRect(nativeSelection, rootElement)\n\n // Position floating toolbar\n const offsetIfFlipped = setFloatingElemPosition({\n alwaysDisplayOnTop: isLinkEditorVisible,\n anchorElem,\n floatingElem: floatingToolbarRef.current,\n horizontalPosition: 'center',\n targetRect: rangeRect,\n })\n\n // Position caret\n if (caretRef.current) {\n setFloatingElemPosition({\n anchorElem: floatingToolbarRef.current,\n anchorFlippedOffset: offsetIfFlipped,\n floatingElem: caretRef.current,\n horizontalOffset: 5,\n horizontalPosition: 'center',\n specialHandlingForCaret: true,\n targetRect: rangeRect,\n verticalGap: 8,\n })\n }\n } else {\n closeFloatingToolbar()\n }\n }, [editor, closeFloatingToolbar, anchorElem])\n\n useEffect(() => {\n const scrollerElem = anchorElem.parentElement\n\n const update = () => {\n editor.getEditorState().read(() => {\n $updateTextFormatFloatingToolbar()\n })\n }\n\n window.addEventListener('resize', update)\n if (scrollerElem) {\n scrollerElem.addEventListener('scroll', update)\n }\n\n return () => {\n window.removeEventListener('resize', update)\n if (scrollerElem) {\n scrollerElem.removeEventListener('scroll', update)\n }\n }\n }, [editor, $updateTextFormatFloatingToolbar, anchorElem])\n\n useEffect(() => {\n editor.getEditorState().read(() => {\n $updateTextFormatFloatingToolbar()\n })\n return mergeRegister(\n editor.registerUpdateListener(({ editorState }) => {\n editorState.read(() => {\n $updateTextFormatFloatingToolbar()\n })\n }),\n\n editor.registerCommand(\n SELECTION_CHANGE_COMMAND,\n () => {\n $updateTextFormatFloatingToolbar()\n return false\n },\n COMMAND_PRIORITY_LOW,\n ),\n )\n }, [editor, $updateTextFormatFloatingToolbar])\n\n return (\n <div className=\"inline-toolbar-popup\" ref={floatingToolbarRef}>\n <div className=\"caret\" ref={caretRef} />\n {editorConfig?.features &&\n editorConfig.features?.toolbarInline?.groups.map((group, i) => {\n return (\n <ToolbarGroupComponent\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n index={i}\n key={group.key}\n />\n )\n })}\n </div>\n )\n}\n\nfunction useInlineToolbar(\n editor: LexicalEditor,\n anchorElem: HTMLElement,\n): null \| React.ReactElement {\n const [isText, setIsText] = useState(false)\n\n const updatePopup = useCallback(() => {\n editor.getEditorState().read(() => {\n // Should not to pop up the floating toolbar when using IME input\n if (editor.isComposing()) {\n return\n }\n const selection = $getSelection()\n const nativeSelection = getDOMSelection(editor._window)\n const rootElement = editor.getRootElement()\n\n if (\n nativeSelection !== null &&\n (!$isRangeSelection(selection) \|\|\n rootElement === null \|\|\n !rootElement.contains(nativeSelection.anchorNode))\n ) {\n setIsText(false)\n return\n }\n\n if (!$isRangeSelection(selection)) {\n return\n }\n\n if (selection.getTextContent() !== '') {\n const nodes = selection.getNodes()\n let foundNodeWithText = false\n for (const node of nodes) {\n if ($isTextNode(node)) {\n setIsText(true)\n foundNodeWithText = true\n break\n }\n }\n if (!foundNodeWithText) {\n setIsText(false)\n }\n } else {\n setIsText(false)\n }\n\n const rawTextContent = selection.getTextContent().replace(/\\n/g, '')\n if (!selection.isCollapsed() && rawTextContent === '') {\n setIsText(false)\n return\n }\n })\n }, [editor])\n\n useEffect(() => {\n document.addEventListener('selectionchange', updatePopup)\n document.addEventListener('mouseup', updatePopup)\n return () => {\n document.removeEventListener('selectionchange', updatePopup)\n document.removeEventListener('mouseup', updatePopup)\n }\n }, [updatePopup])\n\n useEffect(() => {\n return mergeRegister(\n editor.registerUpdateListener(() => {\n updatePopup()\n }),\n editor.registerRootListener(() => {\n if (editor.getRootElement() === null) {\n setIsText(false)\n }\n }),\n )\n }, [editor, updatePopup])\n\n if (!isText \|\| !editor.isEditable()) {\n return null\n }\n\n return createPortal(<InlineToolbar anchorElem={anchorElem} editor={editor} />, anchorElem)\n}\n\nexport const InlineToolbarPlugin: PluginComponentWithAnchor<undefined> = ({ anchorElem }) => {\n const [editor] = useLexicalComposerContext()\n\n return useInlineToolbar(editor, anchorElem)\n}\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","mergeRegister","$getSelection","$isRangeSelection","$isTextNode","COMMAND_PRIORITY_LOW","getDOMSelection","SELECTION_CHANGE_COMMAND","useCallback","useEffect","useRef","useState","React","createPortal","useEditorConfigContext","getDOMRangeRect","setFloatingElemPosition","ToolbarButton","ToolbarDropdown","ButtonGroupItem","anchorElem","editor","item","Component","_jsx","key","ChildComponent","ToolbarGroupComponent","t0","$","group","index","editorConfig","DropdownIcon","setDropdownIcon","t1","items","type","length","undefined","t2","t3","t4","activeItems","onActiveChange","t5","features","toolbarInline","groups","_jsxs","className","children","Icon","maxActiveItems","map","item_0","InlineToolbar","floatingToolbarRef","caretRef","closeFloatingToolbar","current","isOpacityZero","style","opacity","isPointerEventsNone","pointerEvents","mouseMoveListener","e","buttons","x","clientX","y","clientY","elementUnderMouse","document","elementFromPoint","contains","mouseUpListener","addEventListener","removeEventListener","$updateTextFormatFloatingToolbar","selection","nativeSelection","_window","possibleLinkEditor","querySelector","isLinkEditorVisible","rootElement","getRootElement","isCollapsed","anchorNode","rangeRect","offsetIfFlipped","alwaysDisplayOnTop","floatingElem","horizontalPosition","targetRect","anchorFlippedOffset","horizontalOffset","specialHandlingForCaret","verticalGap","scrollerElem","parentElement","update","getEditorState","read","window","registerUpdateListener","editorState","registerCommand","ref","i","useInlineToolbar","isText","setIsText","isComposing","getTextContent","nodes","getNodes","foundNodeWithText","node","rawTextContent","replace","updatePopup","registerRootListener","isEditable","InlineToolbarPlugin"],"sources":["../../../../../../src/features/toolbars/inline/client/Toolbar/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { mergeRegister } from '@lexical/utils'\nimport {\n $getSelection,\n $isRangeSelection,\n $isTextNode,\n COMMAND_PRIORITY_LOW,\n getDOMSelection,\n SELECTION_CHANGE_COMMAND,\n} from 'lexical'\nimport { useCallback, useEffect, useRef, useState } from 'react'\nimport * as React from 'react'\nimport { createPortal } from 'react-dom'\n\nimport type { PluginComponentWithAnchor } from '../../../../typesClient.js'\nimport type { ToolbarGroup, ToolbarGroupItem } from '../../../types.js'\n\nimport { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport { getDOMRangeRect } from '../../../../../lexical/utils/getDOMRangeRect.js'\nimport { setFloatingElemPosition } from '../../../../../lexical/utils/setFloatingElemPosition.js'\nimport { ToolbarButton } from '../../../shared/ToolbarButton/index.js'\nimport { ToolbarDropdown } from '../../../shared/ToolbarDropdown/index.js'\nimport './index.scss'\n\nfunction ButtonGroupItem({\n anchorElem,\n editor,\n item,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\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 if (!item.ChildComponent) {\n return null\n }\n\n return (\n <ToolbarButton editor={editor} item={item} key={item.key}>\n <item.ChildComponent />\n </ToolbarButton>\n )\n}\n\nfunction ToolbarGroupComponent({\n anchorElem,\n editor,\n group,\n index,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n group: ToolbarGroup\n index: number\n}): React.ReactNode {\n const { editorConfig } = useEditorConfigContext()\n\n const [DropdownIcon, setDropdownIcon] = React.useState<React.FC \| undefined>()\n\n React.useEffect(() => {\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent)\n } else {\n setDropdownIcon(undefined)\n }\n }, [group])\n\n const onActiveChange = useCallback(\n ({ activeItems }: { activeItems: ToolbarGroupItem[] }) => {\n if (!activeItems.length) {\n if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n setDropdownIcon(() => group.ChildComponent)\n } else {\n setDropdownIcon(undefined)\n }\n return\n }\n const item = activeItems[0]\n setDropdownIcon(() => item?.ChildComponent)\n },\n [group],\n )\n\n return (\n <div\n className={`inline-toolbar-popup__group inline-toolbar-popup__group-${group.key}`}\n data-toolbar-group-key={group.key}\n key={group.key}\n >\n {group.type === 'dropdown' && group.items.length ? (\n DropdownIcon ? (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n Icon={DropdownIcon}\n maxActiveItems={group.maxActiveItems ?? 1}\n onActiveChange={onActiveChange}\n />\n ) : (\n <ToolbarDropdown\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n maxActiveItems={group.maxActiveItems ?? 1}\n onActiveChange={onActiveChange}\n />\n )\n ) : null}\n {group.type === 'buttons' && group.items.length\n ? group.items.map((item) => {\n return (\n <ButtonGroupItem anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n )\n })\n : null}\n {index < editorConfig.features.toolbarInline?.groups.length - 1 && (\n <div className=\"divider\" />\n )}\n </div>\n )\n}\n\nfunction InlineToolbar({\n anchorElem,\n editor,\n}: {\n anchorElem: HTMLElement\n editor: LexicalEditor\n}): React.ReactNode {\n const floatingToolbarRef = useRef<HTMLDivElement \| null>(null)\n const caretRef = useRef<HTMLDivElement \| null>(null)\n\n const { editorConfig } = useEditorConfigContext()\n\n const closeFloatingToolbar = useCallback(() => {\n if (floatingToolbarRef?.current) {\n const isOpacityZero = floatingToolbarRef.current.style.opacity === '0'\n const isPointerEventsNone = floatingToolbarRef.current.style.pointerEvents === 'none'\n\n if (!isOpacityZero) {\n floatingToolbarRef.current.style.opacity = '0'\n }\n if (!isPointerEventsNone) {\n floatingToolbarRef.current.style.pointerEvents = 'none'\n }\n }\n }, [floatingToolbarRef])\n\n const mouseMoveListener = useCallback(\n (e: MouseEvent) => {\n if (floatingToolbarRef?.current && (e.buttons === 1 \|\| e.buttons === 3)) {\n const isOpacityZero = floatingToolbarRef.current.style.opacity === '0'\n const isPointerEventsNone = floatingToolbarRef.current.style.pointerEvents === 'none'\n if (!isOpacityZero \|\| !isPointerEventsNone) {\n // Check if the mouse is not over the popup\n const x = e.clientX\n const y = e.clientY\n const elementUnderMouse = document.elementFromPoint(x, y)\n if (!floatingToolbarRef.current.contains(elementUnderMouse)) {\n // Mouse is not over the target element => not a normal click, but probably a drag\n closeFloatingToolbar()\n }\n }\n }\n },\n [closeFloatingToolbar],\n )\n\n const mouseUpListener = useCallback(() => {\n if (floatingToolbarRef?.current) {\n if (floatingToolbarRef.current.style.opacity !== '1') {\n floatingToolbarRef.current.style.opacity = '1'\n }\n if (floatingToolbarRef.current.style.pointerEvents !== 'auto') {\n floatingToolbarRef.current.style.pointerEvents = 'auto'\n }\n }\n }, [])\n\n useEffect(() => {\n document.addEventListener('mousemove', mouseMoveListener)\n document.addEventListener('mouseup', mouseUpListener)\n\n return () => {\n document.removeEventListener('mousemove', mouseMoveListener)\n document.removeEventListener('mouseup', mouseUpListener)\n }\n }, [floatingToolbarRef, mouseMoveListener, mouseUpListener])\n\n const $updateTextFormatFloatingToolbar = useCallback(() => {\n const selection = $getSelection()\n\n const nativeSelection = getDOMSelection(editor._window)\n\n if (floatingToolbarRef.current === null) {\n return\n }\n\n const possibleLinkEditor = anchorElem.querySelector(':scope > .link-editor')\n const isLinkEditorVisible =\n possibleLinkEditor !== null &&\n 'style' in possibleLinkEditor &&\n possibleLinkEditor?.style?.['opacity' as keyof typeof possibleLinkEditor.style] === '1'\n\n const rootElement = editor.getRootElement()\n if (\n selection !== null &&\n nativeSelection !== null &&\n !nativeSelection.isCollapsed &&\n rootElement !== null &&\n rootElement.contains(nativeSelection.anchorNode)\n ) {\n const rangeRect = getDOMRangeRect(nativeSelection, rootElement)\n\n // Position floating toolbar\n const offsetIfFlipped = setFloatingElemPosition({\n alwaysDisplayOnTop: isLinkEditorVisible,\n anchorElem,\n floatingElem: floatingToolbarRef.current,\n horizontalPosition: 'center',\n targetRect: rangeRect,\n })\n\n // Position caret\n if (caretRef.current) {\n setFloatingElemPosition({\n anchorElem: floatingToolbarRef.current,\n anchorFlippedOffset: offsetIfFlipped,\n floatingElem: caretRef.current,\n horizontalOffset: 5,\n horizontalPosition: 'center',\n specialHandlingForCaret: true,\n targetRect: rangeRect,\n verticalGap: 8,\n })\n }\n } else {\n closeFloatingToolbar()\n }\n }, [editor, closeFloatingToolbar, anchorElem])\n\n useEffect(() => {\n const scrollerElem = anchorElem.parentElement\n\n const update = () => {\n editor.getEditorState().read(() => {\n $updateTextFormatFloatingToolbar()\n })\n }\n\n window.addEventListener('resize', update)\n if (scrollerElem) {\n scrollerElem.addEventListener('scroll', update)\n }\n\n return () => {\n window.removeEventListener('resize', update)\n if (scrollerElem) {\n scrollerElem.removeEventListener('scroll', update)\n }\n }\n }, [editor, $updateTextFormatFloatingToolbar, anchorElem])\n\n useEffect(() => {\n editor.getEditorState().read(() => {\n $updateTextFormatFloatingToolbar()\n })\n return mergeRegister(\n editor.registerUpdateListener(({ editorState }) => {\n editorState.read(() => {\n $updateTextFormatFloatingToolbar()\n })\n }),\n\n editor.registerCommand(\n SELECTION_CHANGE_COMMAND,\n () => {\n $updateTextFormatFloatingToolbar()\n return false\n },\n COMMAND_PRIORITY_LOW,\n ),\n )\n }, [editor, $updateTextFormatFloatingToolbar])\n\n return (\n <div className=\"inline-toolbar-popup\" ref={floatingToolbarRef}>\n <div className=\"caret\" ref={caretRef} />\n {editorConfig?.features &&\n editorConfig.features?.toolbarInline?.groups.map((group, i) => {\n return (\n <ToolbarGroupComponent\n anchorElem={anchorElem}\n editor={editor}\n group={group}\n index={i}\n key={group.key}\n />\n )\n })}\n </div>\n )\n}\n\nfunction useInlineToolbar(\n editor: LexicalEditor,\n anchorElem: HTMLElement,\n): null \| React.ReactElement {\n const [isText, setIsText] = useState(false)\n\n const updatePopup = useCallback(() => {\n editor.getEditorState().read(() => {\n // Should not to pop up the floating toolbar when using IME input\n if (editor.isComposing()) {\n return\n }\n const selection = $getSelection()\n const nativeSelection = getDOMSelection(editor._window)\n const rootElement = editor.getRootElement()\n\n if (\n nativeSelection !== null &&\n (!$isRangeSelection(selection) \|\|\n rootElement === null \|\|\n !rootElement.contains(nativeSelection.anchorNode))\n ) {\n setIsText(false)\n return\n }\n\n if (!$isRangeSelection(selection)) {\n return\n }\n\n if (selection.getTextContent() !== '') {\n const nodes = selection.getNodes()\n let foundNodeWithText = false\n for (const node of nodes) {\n if ($isTextNode(node)) {\n setIsText(true)\n foundNodeWithText = true\n break\n }\n }\n if (!foundNodeWithText) {\n setIsText(false)\n }\n } else {\n setIsText(false)\n }\n\n const rawTextContent = selection.getTextContent().replace(/\\n/g, '')\n if (!selection.isCollapsed() && rawTextContent === '') {\n setIsText(false)\n return\n }\n })\n }, [editor])\n\n useEffect(() => {\n document.addEventListener('selectionchange', updatePopup)\n document.addEventListener('mouseup', updatePopup)\n return () => {\n document.removeEventListener('selectionchange', updatePopup)\n document.removeEventListener('mouseup', updatePopup)\n }\n }, [updatePopup])\n\n useEffect(() => {\n return mergeRegister(\n editor.registerUpdateListener(() => {\n updatePopup()\n }),\n editor.registerRootListener(() => {\n if (editor.getRootElement() === null) {\n setIsText(false)\n }\n }),\n )\n }, [editor, updatePopup])\n\n if (!isText \|\| !editor.isEditable()) {\n return null\n }\n\n return createPortal(<InlineToolbar anchorElem={anchorElem} editor={editor} />, anchorElem)\n}\n\nexport const InlineToolbarPlugin: PluginComponentWithAnchor<undefined> = ({ anchorElem }) => {\n const [editor] = useLexicalComposerContext()\n\n return useInlineToolbar(editor, anchorElem)\n}\n"],"mappings":"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","ignoreList":[]}

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

	@@ -1 +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,KAAsE,MAAM,OAAO,CAAA;AAE1F,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAGtD,OAAO,cAAc,CAAA;AAKrB,eAAO,MAAM,aAAa,gCAIvB;IACD,QAAQ,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAA;IAC3B,MAAM,EAAE,aAAa,CAAA;IACrB,IAAI,EAAE,gBAAgB,CAAA;CACvB,~~sBAkFA~~,CAAA"}
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,KAAsE,MAAM,OAAO,CAAA;AAE1F,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAGtD,OAAO,cAAc,CAAA;AAKrB,eAAO,MAAM,aAAa,gCAIvB;IACD,QAAQ,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAA;IAC3B,MAAM,EAAE,aAAa,CAAA;IACrB,IAAI,EAAE,gBAAgB,CAAA;CACvB,sBA2FA,CAAA"}

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

@@ -9,7 +9,7 @@ import { useEditorConfigContext } from '../../../../lexical/config/client/Editor
 import { useRunDeprioritized } from '../../../../utilities/useRunDeprioritized.js';
 const baseClass = 'toolbar-popup__button';
 export const ToolbarButton = t0 => {
-  const $ = _c(22);
+  const $ = _c(23);
   const {
     children,
     editor,
@@ -86,6 +86,7 @@ export const ToolbarButton = t0 => {
   let t9;
   if ($[9] !== editor || $[10] !== runDeprioritized || $[11] !== updateStates) {
     t8 = () => {
+      runDeprioritized(updateStates);
       const listener = () => runDeprioritized(updateStates);
       const cleanup = mergeRegister(editor.registerUpdateListener(listener));
       document.addEventListener("mouseup", listener);
@@ -129,9 +130,10 @@ export const ToolbarButton = t0 => {
   const handleClick = t10;
   const handleMouseDown = _temp2;
   let t11;
-  if ($[18] !== children || $[19] !== className || $[20] !== handleClick) {
+  if ($[18] !== children || $[19] !== className || $[20] !== handleClick || $[21] !== item.key) {
     t11 = _jsx("button", {
       className,
+      "data-button-key": item.key,
       onClick: handleClick,
       onMouseDown: handleMouseDown,
       type: "button",
@@ -140,9 +142,10 @@ export const ToolbarButton = t0 => {
     $[18] = children;
     $[19] = className;
     $[20] = handleClick;
-    $[21] = t11;
+    $[21] = item.key;
+    $[22] = t11;
   } else {
-    t11 = $[21];
+    t11 = $[22];
   }
   return t11;
 };

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

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":["c","_c","mergeRegister","$addUpdateTag","$getSelection","React","useCallback","useDeferredValue","useEffect","useMemo","useState","useEditorConfigContext","useRunDeprioritized","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","runDeprioritized","t8","t9","listener","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'\nimport { useRunDeprioritized } from '../../../../utilities/useRunDeprioritized.js'\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 const runDeprioritized = useRunDeprioritized()\n\n useEffect(() => {\n const listener = () => runDeprioritized(updateStates)\n\n const cleanup = mergeRegister(editor.registerUpdateListener(listener))\n document.addEventListener('mouseup', listener)\n\n return () => {\n cleanup()\n document.removeEventListener('mouseup', listener)\n }\n }, [editor, runDeprioritized, 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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~~MACR~~,~~MAAAE~~,QAAA,GAAAA,CAAA,KAAuBH,gBAAA,CAAiBD,YAAA;MAExC,MAAAK,OAAA,GAAgBnD,aAAA,CAAcgB,MAAA,CAAAoC,sBAAA,CAA8BF,QAAA;MAC5DG,QAAA,CAAAC,gBAAA,CAA0B,WAAWJ,QAAA;MAAA;QAGnCC,OAAA;QACAE,QAAA,CAAAE,mBAAA,CAA6B,WAAWL,QAAA;MAAA;IAAA;IAEzCD,EAAA,IAACjC,MAAA,EAAQ+B,gBAAA,EAAkBD,YAAA;IAAahC,CAAA,MAAAE,MAAA;IAAAF,CAAA,OAAAiC,gBAAA;IAAAjC,CAAA,OAAAgC,YAAA;IAAAhC,CAAA,OAAAkC,EAAA;IAAAlC,CAAA,OAAAmC,EAAA;EAAA;IAAAD,EAAA,GAAAlC,CAAA;IAAAmC,EAAA,GAAAnC,CAAA;EAAA;~~EAV3CR~~,SAAA,CAAU0C,~~EAUV~~,EAAGC,EAAwC;EAAA,IAAAO,GAAA;EAAA,IAAA1C,CAAA,SAAAS,MAAA,IAAAT,CAAA,SAAAE,MAAA,IAAAF,CAAA,SAAAG,IAAA;IAEXuC,GAAA,GAAAA,CAAA;MAAA,KACzBjC,MAAA,CAAAD,OAAA;QAAA;MAAA;MAILN,MAAA,CAAAyC,KAAA;QACEzC,MAAA,CAAA0C,MAAA,CAAAC,KAEA;QAEA1C,IAAA,CAAA2C,QAAA;UAAA5C,MAAA;UAAA0B,QAAA,EAEYnB,MAAA,CAAAF;QAAA;MAAA,CAEd;IAAA;IACFP,CAAA,OAAAS,MAAA;IAAAT,CAAA,OAAAE,MAAA;IAAAF,CAAA,OAAAG,IAAA;IAAAH,CAAA,OAAA0C,GAAA;EAAA;IAAAA,GAAA,GAAA1C,CAAA;EAAA;EAfA,MAAA+C,WAAA,GAAoBL,GAeK;EAEzB,MAAAM,eAAA,GAAAC,MAAA;EAKK,IAAAC,GAAA;EAAA,IAAAlD,CAAA,SAAAC,QAAA,IAAAD,CAAA,SAAAsB,SAAA,IAAAtB,CAAA,SAAA+C,WAAA;~~IAGHG~~,GAAA,GAAAC,IAAA,CAAC;MAAA7B,SAAA;~~MAAA8B~~,OAAA,~~EAAsCL~~,WAAA;MAAAM,WAAA,~~EAA0BL~~,eAAA;MAAAM,IAAA,~~EAAsB~~;MAAArD;IAAA,C~~;;;;;;;;SAAvFiD~~,G;~~CAIJ~~;~~AA1F6B~~,SAAAL,MAAA;~~EAoErB1D~~,aAAA,CAAc;AAAA;~~AApEO~~,SAAA8D,OAAAM,CAAA;~~EAkFzBA~~,CAAA,CAAAC,cAAA,CAAgB;AAAA","ignoreList":[]}
1	+ {"version":3,"file":"index.js","names":["c","_c","mergeRegister","$addUpdateTag","$getSelection","React","useCallback","useDeferredValue","useEffect","useMemo","useState","useEditorConfigContext","useRunDeprioritized","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","runDeprioritized","t8","t9","listener","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'\nimport { useRunDeprioritized } from '../../../../utilities/useRunDeprioritized.js'\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 const runDeprioritized = useRunDeprioritized()\n\n useEffect(() => {\n // Run on mount\n void runDeprioritized(updateStates)\n\n const listener = () => runDeprioritized(updateStates)\n\n const cleanup = mergeRegister(editor.registerUpdateListener(listener))\n document.addEventListener('mouseup', listener)\n\n return () => {\n cleanup()\n document.removeEventListener('mouseup', listener)\n }\n }, [editor, runDeprioritized, 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\n className={className}\n data-button-key={item.key}\n onClick={handleClick}\n onMouseDown={handleMouseDown}\n type=\"button\"\n >\n {children}\n </button>\n )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/toolbars/shared/ToolbarDropdown/DropDown.d.ts CHANGED Viewed

@@ -1,20 +1,22 @@
 import { type LexicalEditor } from 'lexical';
 import React, { type ReactNode } from 'react';
 import type { ToolbarGroupItem } from '../../types.js';
-export declare function DropDownItem({ active, children, editor, enabled, Icon, item, tooltip, }: {
+export declare function DropDownItem({ active, children, editor, enabled, Icon, item, itemKey, tooltip, }: {
     active?: boolean;
     children: React.ReactNode;
     editor: LexicalEditor;
     enabled?: boolean;
     Icon: React.ReactNode;
     item: ToolbarGroupItem;
+    itemKey: string;
     tooltip?: string;
 }): React.ReactNode;
-export declare function DropDown({ buttonAriaLabel, buttonClassName, children, disabled, Icon, itemsContainerClassNames, label, stopCloseOnClickSelf, }: {
+export declare function DropDown({ buttonAriaLabel, buttonClassName, children, disabled, dropdownKey, Icon, itemsContainerClassNames, label, stopCloseOnClickSelf, }: {
     buttonAriaLabel?: string;
     buttonClassName: string;
     children: ReactNode;
     disabled?: boolean;
+    dropdownKey: string;
     Icon?: React.FC;
     itemsContainerClassNames?: string[];
     label?: string;

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

	@@ -1 +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,~~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~~"}
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,EACP,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,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,GAAG,KAAK,CAAC,SAAS,CAkElB;AAqFD,wBAAgB,QAAQ,CAAC,EACvB,eAAe,EACf,eAAe,EACf,QAAQ,EACR,QAAgB,EAChB,WAAW,EACX,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,WAAW,EAAE,MAAM,CAAA;IACnB,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,CAyFlB"}

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

@@ -14,6 +14,7 @@ export function DropDownItem({
   enabled,
   Icon,
   item,
+  itemKey,
   tooltip
 }) {
   const className = useMemo(() => {
@@ -37,6 +38,9 @@ export function DropDownItem({
     buttonStyle: "none",
     className: className,
     disabled: enabled === false,
+    extraButtonProps: {
+      'data-item-key': itemKey
+    },
     icon: Icon,
     iconPosition: "left",
     iconStyle: "none",
@@ -131,6 +135,7 @@ export function DropDown({
   buttonClassName,
   children,
   disabled = false,
+  dropdownKey,
   Icon,
   itemsContainerClassNames,
   label,
@@ -191,6 +196,7 @@ export function DropDown({
     children: [/*#__PURE__*/_jsxs("button", {
       "aria-label": buttonAriaLabel,
       className: buttonClassName + (showDropDown ? ' active' : ''),
+      "data-dropdown-key": dropdownKey,
       disabled: disabled,
       onClick: event_0 => {
         event_0.preventDefault();

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

	@@ -1 +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","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":[]}
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","itemKey","tooltip","className","key","filter","Boolean","join","ref","dropDownContext","use","Error","registerItem","current","_jsx","buttonStyle","disabled","extraButtonProps","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","dropdownKey","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 itemKey,\n tooltip,\n}: {\n active?: boolean\n children: React.ReactNode\n editor: LexicalEditor\n enabled?: boolean\n Icon: React.ReactNode\n item: ToolbarGroupItem\n itemKey: string\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 extraButtonProps={{\n 'data-item-key': itemKey,\n }}\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 dropdownKey,\n Icon,\n itemsContainerClassNames,\n label,\n stopCloseOnClickSelf,\n}: {\n buttonAriaLabel?: string\n buttonClassName: string\n children: ReactNode\n disabled?: boolean\n dropdownKey: string\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 data-dropdown-key={dropdownKey}\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 CHANGED Viewed

	@@ -1 +1 @@
1	- {"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;~~AAoErB~~,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"}
1	+ {"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;AAqErB,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,sBAsGA,CAAA"}

package/dist/features/toolbars/shared/ToolbarDropdown/index.js CHANGED Viewed

@@ -83,6 +83,7 @@ const ToolbarItem = t0 => {
       enabled,
       Icon: item?.ChildComponent ? _jsx(item.ChildComponent, {}) : undefined,
       item,
+      itemKey: item.key,
       tooltip: title,
       children: _jsx("span", {
         className: "text",
@@ -176,6 +177,8 @@ export const ToolbarDropdown = ({
     });
   }, [editor, editorConfigContext, group, items, maxActiveItems, onActiveChange]);
   useEffect(() => {
+    // Run on mount in order to update states when dropdown is opened
+    void runDeprioritized(updateStates);
     return mergeRegister(editor.registerUpdateListener(async () => {
       await runDeprioritized(updateStates);
     }));
@@ -193,6 +196,7 @@ export const ToolbarDropdown = ({
     buttonAriaLabel: `${groupKey} dropdown`,
     buttonClassName: [baseClass, `${baseClass}-${groupKey}`, ...(classNames || [])].filter(Boolean).join(' '),
     disabled: !deferredToolbarState.enabledGroup,
+    dropdownKey: groupKey,
     Icon: Icon,
     itemsContainerClassNames: [`${baseClass}-items`, ...(itemsContainerClassNames || [])],
     label: label,

package/dist/features/toolbars/shared/ToolbarDropdown/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":["c","_c","React","useCallback","useDeferredValue","useEffect","useMemo","baseClass","mergeRegister","useTranslation","$getSelection","useEditorConfigContext","useRunDeprioritized","DropDown","DropDownItem","ToolbarItem","t0","$","active","anchorElem","editor","enabled","item","i18n","fieldProps","t1","featureClientSchemaMap","schemaPath","Component","t2","_jsx","key","title","croppedTitle","label","length","substring","Icon","ChildComponent","undefined","tooltip","children","className","MemoToolbarItem","memo","ToolbarDropdown","classNames","group","itemsContainerClassNames","maxActiveItems","onActiveChange","toolbarState","setToolbarState","useState","activeItemKeys","enabledGroup","enabledItemKeys","deferredToolbarState","editorConfigContext","items","groupKey","runDeprioritized","updateStates","getEditorState","read","selection","_activeItemKeys","_activeItems","_enabledItemKeys","isActive","push","isEnabled","activeItems","registerUpdateListener","renderedItems","map","includes","buttonAriaLabel","buttonClassName","filter","Boolean","join","disabled"],"sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback, useDeferredValue, useEffect, useMemo } from 'react'\n\nconst baseClass = 'toolbar-popup__dropdown'\n\nimport type { LexicalEditor } from 'lexical'\n\nimport { mergeRegister } from '@lexical/utils'\nimport { useTranslation } from '@payloadcms/ui'\nimport { $getSelection } from 'lexical'\n\nimport type { ToolbarDropdownGroup, ToolbarGroupItem } from '../../types.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { useRunDeprioritized } from '../../../../utilities/useRunDeprioritized.js'\nimport './index.scss'\nimport { DropDown, DropDownItem } from './DropDown.js'\n\nconst ToolbarItem = ({\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}) => {\n const { i18n } = useTranslation<{}, string>()\n const {\n fieldProps: { featureClientSchemaMap, schemaPath },\n } = useEditorConfigContext()\n\n if (item.Component) {\n return (\n item?.Component && (\n <item.Component\n active={active}\n anchorElem={anchorElem}\n editor={editor}\n enabled={enabled}\n item={item}\n key={item.key}\n />\n )\n )\n }\n\n let title = item.key\n let croppedTitle = item.key\n if (item.label) {\n title =\n typeof item.label === 'function'\n ? item.label({ featureClientSchemaMap, i18n, schemaPath })\n : item.label\n }\n // Crop title to max. 25 characters\n if (title.length > 25) {\n croppedTitle = title.substring(0, 25) + '...'\n } else {\n croppedTitle = title\n }\n\n return (\n <DropDownItem\n active={active}\n editor={editor}\n enabled={enabled}\n Icon={item?.ChildComponent ? <item.ChildComponent /> : undefined}\n item={item}\n key={item.key}\n tooltip={title}\n >\n <span className=\"text\">{croppedTitle}</span>\n </DropDownItem>\n )\n}\n\nconst MemoToolbarItem = React.memo(ToolbarItem)\n\nexport const ToolbarDropdown = ({\n anchorElem,\n classNames,\n editor,\n group,\n Icon,\n itemsContainerClassNames,\n label,\n maxActiveItems,\n onActiveChange,\n}: {\n anchorElem: HTMLElement\n classNames?: string[]\n editor: LexicalEditor\n group: ToolbarDropdownGroup\n Icon?: React.FC\n itemsContainerClassNames?: string[]\n label?: string\n /*\n Maximum number of active items allowed. This is a performance optimization to prevent\n * unnecessary item active checks when the maximum number of active items is reached.\n */\n maxActiveItems?: number\n onActiveChange?: ({ activeItems }: { activeItems: ToolbarGroupItem[] }) => void\n}) => {\n const [toolbarState, setToolbarState] = React.useState<{\n activeItemKeys: string[]\n enabledGroup: boolean\n enabledItemKeys: string[]\n }>({\n activeItemKeys: [],\n enabledGroup: true,\n enabledItemKeys: [],\n })\n const deferredToolbarState = useDeferredValue(toolbarState)\n\n const editorConfigContext = useEditorConfigContext()\n const { items, key: groupKey } = group\n\n const runDeprioritized = useRunDeprioritized()\n\n const updateStates = useCallback(() => {\n editor.getEditorState().read(() => {\n const selection = $getSelection()\n if (!selection) {\n return\n }\n\n const _activeItemKeys: string[] = []\n const _activeItems: ToolbarGroupItem[] = []\n const _enabledItemKeys: string[] = []\n\n for (const item of items) {\n if (item.isActive && (!maxActiveItems \|\| _activeItemKeys.length < maxActiveItems)) {\n const isActive = item.isActive({ editor, editorConfigContext, selection })\n if (isActive) {\n _activeItemKeys.push(item.key)\n _activeItems.push(item)\n }\n }\n if (item.isEnabled) {\n const isEnabled = item.isEnabled({ editor, editorConfigContext, selection })\n if (isEnabled) {\n _enabledItemKeys.push(item.key)\n }\n } else {\n _enabledItemKeys.push(item.key)\n }\n }\n\n setToolbarState({\n activeItemKeys: _activeItemKeys,\n enabledGroup: group.isEnabled\n ? group.isEnabled({ editor, editorConfigContext, selection })\n : true,\n enabledItemKeys: _enabledItemKeys,\n })\n\n if (onActiveChange) {\n onActiveChange({ activeItems: _activeItems })\n }\n })\n }, [editor, editorConfigContext, group, items, maxActiveItems, onActiveChange])\n\n useEffect(() => {\n return mergeRegister(\n editor.registerUpdateListener(async () => {\n await runDeprioritized(updateStates)\n }),\n )\n }, [editor, runDeprioritized, updateStates])\n\n const renderedItems = useMemo(() => {\n return items?.length\n ? items.map((item) => (\n <MemoToolbarItem\n active={deferredToolbarState.activeItemKeys.includes(item.key)}\n anchorElem={anchorElem}\n editor={editor}\n enabled={deferredToolbarState.enabledItemKeys.includes(item.key)}\n item={item}\n key={item.key}\n />\n ))\n : null\n }, [items, deferredToolbarState, anchorElem, editor])\n\n return (\n <DropDown\n buttonAriaLabel={`${groupKey} dropdown`}\n buttonClassName={[baseClass, `${baseClass}-${groupKey}`, ...(classNames \|\| [])]\n .filter(Boolean)\n .join(' ')}\n disabled={!deferredToolbarState.enabledGroup}\n Icon={Icon}\n itemsContainerClassNames={[`${baseClass}-items`, ...(itemsContainerClassNames \|\| [])]}\n key={groupKey}\n label={label}\n >\n {renderedItems}\n </DropDown>\n )\n}\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"index.js","names":["c","_c","React","useCallback","useDeferredValue","useEffect","useMemo","baseClass","mergeRegister","useTranslation","$getSelection","useEditorConfigContext","useRunDeprioritized","DropDown","DropDownItem","ToolbarItem","t0","$","active","anchorElem","editor","enabled","item","i18n","fieldProps","t1","featureClientSchemaMap","schemaPath","Component","t2","_jsx","key","title","croppedTitle","label","length","substring","Icon","ChildComponent","undefined","itemKey","tooltip","children","className","MemoToolbarItem","memo","ToolbarDropdown","classNames","group","itemsContainerClassNames","maxActiveItems","onActiveChange","toolbarState","setToolbarState","useState","activeItemKeys","enabledGroup","enabledItemKeys","deferredToolbarState","editorConfigContext","items","groupKey","runDeprioritized","updateStates","getEditorState","read","selection","_activeItemKeys","_activeItems","_enabledItemKeys","isActive","push","isEnabled","activeItems","registerUpdateListener","renderedItems","map","includes","buttonAriaLabel","buttonClassName","filter","Boolean","join","disabled","dropdownKey"],"sources":["../../../../../src/features/toolbars/shared/ToolbarDropdown/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback, useDeferredValue, useEffect, useMemo } from 'react'\n\nconst baseClass = 'toolbar-popup__dropdown'\n\nimport type { LexicalEditor } from 'lexical'\n\nimport { mergeRegister } from '@lexical/utils'\nimport { useTranslation } from '@payloadcms/ui'\nimport { $getSelection } from 'lexical'\n\nimport type { ToolbarDropdownGroup, ToolbarGroupItem } from '../../types.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { useRunDeprioritized } from '../../../../utilities/useRunDeprioritized.js'\nimport './index.scss'\nimport { DropDown, DropDownItem } from './DropDown.js'\n\nconst ToolbarItem = ({\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}) => {\n const { i18n } = useTranslation<{}, string>()\n const {\n fieldProps: { featureClientSchemaMap, schemaPath },\n } = useEditorConfigContext()\n\n if (item.Component) {\n return (\n item?.Component && (\n <item.Component\n active={active}\n anchorElem={anchorElem}\n editor={editor}\n enabled={enabled}\n item={item}\n key={item.key}\n />\n )\n )\n }\n\n let title = item.key\n let croppedTitle = item.key\n if (item.label) {\n title =\n typeof item.label === 'function'\n ? item.label({ featureClientSchemaMap, i18n, schemaPath })\n : item.label\n }\n // Crop title to max. 25 characters\n if (title.length > 25) {\n croppedTitle = title.substring(0, 25) + '...'\n } else {\n croppedTitle = title\n }\n\n return (\n <DropDownItem\n active={active}\n editor={editor}\n enabled={enabled}\n Icon={item?.ChildComponent ? <item.ChildComponent /> : undefined}\n item={item}\n itemKey={item.key}\n key={item.key}\n tooltip={title}\n >\n <span className=\"text\">{croppedTitle}</span>\n </DropDownItem>\n )\n}\n\nconst MemoToolbarItem = React.memo(ToolbarItem)\n\nexport const ToolbarDropdown = ({\n anchorElem,\n classNames,\n editor,\n group,\n Icon,\n itemsContainerClassNames,\n label,\n maxActiveItems,\n onActiveChange,\n}: {\n anchorElem: HTMLElement\n classNames?: string[]\n editor: LexicalEditor\n group: ToolbarDropdownGroup\n Icon?: React.FC\n itemsContainerClassNames?: string[]\n label?: string\n /*\n Maximum number of active items allowed. This is a performance optimization to prevent\n * unnecessary item active checks when the maximum number of active items is reached.\n */\n maxActiveItems?: number\n onActiveChange?: ({ activeItems }: { activeItems: ToolbarGroupItem[] }) => void\n}) => {\n const [toolbarState, setToolbarState] = React.useState<{\n activeItemKeys: string[]\n enabledGroup: boolean\n enabledItemKeys: string[]\n }>({\n activeItemKeys: [],\n enabledGroup: true,\n enabledItemKeys: [],\n })\n const deferredToolbarState = useDeferredValue(toolbarState)\n\n const editorConfigContext = useEditorConfigContext()\n const { items, key: groupKey } = group\n\n const runDeprioritized = useRunDeprioritized()\n\n const updateStates = useCallback(() => {\n editor.getEditorState().read(() => {\n const selection = $getSelection()\n if (!selection) {\n return\n }\n\n const _activeItemKeys: string[] = []\n const _activeItems: ToolbarGroupItem[] = []\n const _enabledItemKeys: string[] = []\n\n for (const item of items) {\n if (item.isActive && (!maxActiveItems \|\| _activeItemKeys.length < maxActiveItems)) {\n const isActive = item.isActive({ editor, editorConfigContext, selection })\n if (isActive) {\n _activeItemKeys.push(item.key)\n _activeItems.push(item)\n }\n }\n if (item.isEnabled) {\n const isEnabled = item.isEnabled({ editor, editorConfigContext, selection })\n if (isEnabled) {\n _enabledItemKeys.push(item.key)\n }\n } else {\n _enabledItemKeys.push(item.key)\n }\n }\n\n setToolbarState({\n activeItemKeys: _activeItemKeys,\n enabledGroup: group.isEnabled\n ? group.isEnabled({ editor, editorConfigContext, selection })\n : true,\n enabledItemKeys: _enabledItemKeys,\n })\n\n if (onActiveChange) {\n onActiveChange({ activeItems: _activeItems })\n }\n })\n }, [editor, editorConfigContext, group, items, maxActiveItems, onActiveChange])\n\n useEffect(() => {\n // Run on mount in order to update states when dropdown is opened\n void runDeprioritized(updateStates)\n\n return mergeRegister(\n editor.registerUpdateListener(async () => {\n await runDeprioritized(updateStates)\n }),\n )\n }, [editor, runDeprioritized, updateStates])\n\n const renderedItems = useMemo(() => {\n return items?.length\n ? items.map((item) => (\n <MemoToolbarItem\n active={deferredToolbarState.activeItemKeys.includes(item.key)}\n anchorElem={anchorElem}\n editor={editor}\n enabled={deferredToolbarState.enabledItemKeys.includes(item.key)}\n item={item}\n key={item.key}\n />\n ))\n : null\n }, [items, deferredToolbarState, anchorElem, editor])\n\n return (\n <DropDown\n buttonAriaLabel={`${groupKey} dropdown`}\n buttonClassName={[baseClass, `${baseClass}-${groupKey}`, ...(classNames \|\| [])]\n .filter(Boolean)\n .join(' ')}\n disabled={!deferredToolbarState.enabledGroup}\n dropdownKey={groupKey}\n Icon={Icon}\n itemsContainerClassNames={[`${baseClass}-items`, ...(itemsContainerClassNames \|\| [])]}\n key={groupKey}\n label={label}\n >\n {renderedItems}\n </DropDown>\n )\n}\n"],"mappings":"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","ignoreList":[]}