@payloadcms/richtext-lexical 4.0.0-internal.fa345ef → 4.0.0-internal.ff27d6e

package/dist/lexical/plugins/NodeViewOverridePlugin/index.js

@@ -2,9 +2,29 @@
 
 import { c as _c } from "react/compiler-runtime";
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
+import { $getRoot } from 'lexical';
 import { useEffect } from 'react';
 import { useRichTextView } from '../../../field/RichTextViewProvider.js';
 import { clearEditorNodeViews, registerEditorNodeViews } from '../../nodes/index.js';
+// `LexicalComposer` re-mounts with a new `editor` whenever `currentView` changes,
+// so decorator nodes run their initial `decorate()` before this effect registers the view's overrides.
+// Mark existing block decorators dirty after registering so they re-decorate with the resolved custom `Block` component.
+function refreshBlockDecorators(editor) {
+  editor.update(() => {
+    const walk = node => {
+      const type = node.getType();
+      if (type === 'block' || type === 'inlineBlock') {
+        node.markDirty();
+      }
+      if ('getChildren' in node && typeof node.getChildren === 'function') {
+        for (const child of node.getChildren()) {
+          walk(child);
+        }
+      }
+    };
+    walk($getRoot());
+  });
+}
 export function NodeViewOverridePlugin() {
   const $ = _c(5);
   const [editor] = useLexicalComposerContext();
@@ -31,6 +51,7 @@ export function NodeViewOverridePlugin() {
           registerEditorNodeViews(editor, views[currentView]?.nodes);
         }
       }
+      refreshBlockDecorators(editor);
     };
     t1 = [editor, views, currentView];
     $[0] = currentView;

package/dist/lexical/plugins/NodeViewOverridePlugin/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","useEffect","useRichTextView","clearEditorNodeViews","registerEditorNodeViews","NodeViewOverridePlugin","$","editor","currentView","views","t0","t1","default","nodes"],"sources":["../../../../src/lexical/plugins/NodeViewOverridePlugin/index.tsx"],"sourcesContent":["'use client'\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { useEffect } from 'react'\n\nimport { useRichTextView } from '../../../field/RichTextViewProvider.js'\nimport { clearEditorNodeViews, registerEditorNodeViews } from '../../nodes/index.js'\n\nexport function NodeViewOverridePlugin(): null {\n  const [editor] = useLexicalComposerContext()\n  const { currentView, views } = useRichTextView()\n\n  useEffect(() => {\n    if (!views) {\n      return\n    }\n\n    if (currentView === 'default') {\n      if (views.default) {\n        registerEditorNodeViews(editor, views.default?.nodes)\n      } else {\n        clearEditorNodeViews(editor)\n      }\n    } else if (views[currentView]) {\n      clearEditorNodeViews(editor)\n      registerEditorNodeViews(editor, views[currentView]?.nodes)\n    }\n  }, [editor, views, currentView])\n\n  return null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;AACA,SAASC,yBAAyB,QAAQ;AAC1C,SAASC,SAAS,QAAQ;AAE1B,SAASC,eAAe,QAAQ;AAChC,SAASC,oBAAoB,EAAEC,uBAAuB,QAAQ;AAE9D,OAAO,SAAAC,uBAAA;EAAA,MAAAC,CAAA,GAAAP,EAAA;EACL,OAAAQ,MAAA,IAAiBP,yBAAA;EACjB;IAAAQ,WAAA;IAAAC;EAAA,IAA+BP,eAAA;EAAA,IAAAQ,EAAA;EAAA,IAAAC,EAAA;EAAA,IAAAL,CAAA,QAAAE,WAAA,IAAAF,CAAA,QAAAC,MAAA,IAAAD,CAAA,QAAAG,KAAA;IAErBC,EAAA,GAAAA,CAAA;MAAA,KACHD,KAAA;QAAA;MAAA;MAAA,IAIDD,WAAA,KAAgB;QAAA,IACdC,KAAA,CAAAG,OAAA;UACFR,uBAAA,CAAwBG,MAAA,EAAQE,KAAA,CAAAG,OAAA,EAAAC,KAAe;QAAA;UAE/CV,oBAAA,CAAqBI,MAAA;QAAA;MAAA;QAAA,IAEdE,KAAK,CAACD,WAAA;UACfL,oBAAA,CAAqBI,MAAA;UACrBH,uBAAA,CAAwBG,MAAA,EAAQE,KAAK,CAACD,WAAA,GAAAK,KAAc;QAAA;MAAA;IAAA;IAErDF,EAAA,IAACJ,MAAA,EAAQE,KAAA,EAAOD,WAAA;IAAYF,CAAA,MAAAE,WAAA;IAAAF,CAAA,MAAAC,MAAA;IAAAD,CAAA,MAAAG,KAAA;IAAAH,CAAA,MAAAI,EAAA;IAAAJ,CAAA,MAAAK,EAAA;EAAA;IAAAD,EAAA,GAAAJ,CAAA;IAAAK,EAAA,GAAAL,CAAA;EAAA;EAf/BL,SAAA,CAAUS,EAeV,EAAGC,EAA4B;EAAA;AAAA","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","$getRoot","useEffect","useRichTextView","clearEditorNodeViews","registerEditorNodeViews","refreshBlockDecorators","editor","update","walk","node","type","getType","markDirty","getChildren","child","NodeViewOverridePlugin","$","currentView","views","t0","t1","default","nodes"],"sources":["../../../../src/lexical/plugins/NodeViewOverridePlugin/index.tsx"],"sourcesContent":["'use client'\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { $getRoot, type LexicalNode } from 'lexical'\nimport { useEffect } from 'react'\n\nimport { useRichTextView } from '../../../field/RichTextViewProvider.js'\nimport { clearEditorNodeViews, registerEditorNodeViews } from '../../nodes/index.js'\n\n// `LexicalComposer` re-mounts with a new `editor` whenever `currentView` changes,\n// so decorator nodes run their initial `decorate()` before this effect registers the view's overrides.\n// Mark existing block decorators dirty after registering so they re-decorate with the resolved custom `Block` component.\nfunction refreshBlockDecorators(editor: ReturnType<typeof useLexicalComposerContext>[0]): void {\n  editor.update(() => {\n    const walk = (node: LexicalNode): void => {\n      const type = node.getType()\n      if (type === 'block' || type === 'inlineBlock') {\n        node.markDirty()\n      }\n      if ('getChildren' in node && typeof node.getChildren === 'function') {\n        for (const child of node.getChildren() as LexicalNode[]) {\n          walk(child)\n        }\n      }\n    }\n    walk($getRoot())\n  })\n}\n\nexport function NodeViewOverridePlugin(): null {\n  const [editor] = useLexicalComposerContext()\n  const { currentView, views } = useRichTextView()\n\n  useEffect(() => {\n    if (!views) {\n      return\n    }\n\n    if (currentView === 'default') {\n      if (views.default) {\n        registerEditorNodeViews(editor, views.default?.nodes)\n      } else {\n        clearEditorNodeViews(editor)\n      }\n    } else if (views[currentView]) {\n      clearEditorNodeViews(editor)\n      registerEditorNodeViews(editor, views[currentView]?.nodes)\n    }\n\n    refreshBlockDecorators(editor)\n  }, [editor, views, currentView])\n\n  return null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;AACA,SAASC,yBAAyB,QAAQ;AAC1C,SAASC,QAAQ,QAA0B;AAC3C,SAASC,SAAS,QAAQ;AAE1B,SAASC,eAAe,QAAQ;AAChC,SAASC,oBAAoB,EAAEC,uBAAuB,QAAQ;AAE9D;AACA;AACA;AACA,SAASC,uBAAuBC,MAAuD;EACrFA,MAAA,CAAOC,MAAM,CAAC;IACZ,MAAMC,IAAA,GAAQC,IAAA;MACZ,MAAMC,IAAA,GAAOD,IAAA,CAAKE,OAAO;MACzB,IAAID,IAAA,KAAS,WAAWA,IAAA,KAAS,eAAe;QAC9CD,IAAA,CAAKG,SAAS;MAChB;MACA,IAAI,iBAAiBH,IAAA,IAAQ,OAAOA,IAAA,CAAKI,WAAW,KAAK,YAAY;QACnE,KAAK,MAAMC,KAAA,IAASL,IAAA,CAAKI,WAAW,IAAqB;UACvDL,IAAA,CAAKM,KAAA;QACP;MACF;IACF;IACAN,IAAA,CAAKR,QAAA;EACP;AACF;AAEA,OAAO,SAAAe,uBAAA;EAAA,MAAAC,CAAA,GAAAlB,EAAA;EACL,OAAAQ,MAAA,IAAiBP,yBAAA;EACjB;IAAAkB,WAAA;IAAAC;EAAA,IAA+BhB,eAAA;EAAA,IAAAiB,EAAA;EAAA,IAAAC,EAAA;EAAA,IAAAJ,CAAA,QAAAC,WAAA,IAAAD,CAAA,QAAAV,MAAA,IAAAU,CAAA,QAAAE,KAAA;IAErBC,EAAA,GAAAA,CAAA;MACR,IAAI,CAACD,KAAA;QAAA;MAAA;MAIL,IAAID,WAAA,KAAgB;QAClB,IAAIC,KAAA,CAAAG,OAAa;UACfjB,uBAAA,CAAwBE,MAAA,EAAQY,KAAA,CAAAG,OAAe,EAAAC,KAAA;QAAA;UAE/CnB,oBAAA,CAAqBG,MAAA;QAAA;MACvB;QACK,IAAIY,KAAK,CAACD,WAAA,CAAY;UAC3Bd,oBAAA,CAAqBG,MAAA;UACrBF,uBAAA,CAAwBE,MAAA,EAAQY,KAAK,CAACD,WAAA,CAAc,EAAAK,KAAA;QAAA;MACtD;MAEAjB,sBAAA,CAAuBC,MAAA;IAAA,CACzB;IAAGc,EAAA,IAACd,MAAA,EAAQY,KAAA,EAAOD,WAAA,CAAY;IAAAD,CAAA,MAAAC,WAAA;IAAAD,CAAA,MAAAV,MAAA;IAAAU,CAAA,MAAAE,KAAA;IAAAF,CAAA,MAAAG,EAAA;IAAAH,CAAA,MAAAI,EAAA;EAAA;IAAAD,EAAA,GAAAH,CAAA;IAAAI,EAAA,GAAAJ,CAAA;EAAA;EAjB/Bf,SAAA,CAAUkB,EAiBV,EAAGC,EAA4B;EAAA,OAExB;AAAA","ignoreList":[]}

package/dist/lexical/plugins/SlashMenu/LexicalTypeaheadMenuPlugin/LexicalMenu.d.ts

@@ -12,7 +12,6 @@ export type MenuRenderFn = (anchorElementRef: RefObject<HTMLElement | null>, ite
     selectItemAndCleanUp: (selectedItem: SlashMenuItem) => void;
     setSelectedItemKey: (itemKey: string) => void;
 }, matchingString: null | string) => JSX.Element | null | ReactPortal;
-export declare function getScrollParent(element: HTMLElement, includeHidden: boolean): HTMLBodyElement | HTMLElement;
 export declare function useDynamicPositioning(resolution: MenuResolution | null, targetElementRef: RefObject<HTMLElement | null>, onReposition: () => void, onVisibilityChange?: (isInView: boolean) => void): void;
 export declare const SCROLL_TYPEAHEAD_OPTION_INTO_VIEW_COMMAND: LexicalCommand<{
     index: number;

package/dist/lexical/plugins/SlashMenu/LexicalTypeaheadMenuPlugin/LexicalMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LexicalMenu.d.ts","sourceRoot":"","sources":["../../../../../src/lexical/plugins/SlashMenu/LexicalTypeaheadMenuPlugin/LexicalMenu.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAiB,cAAc,EAAE,aAAa,EAAY,MAAM,SAAS,CAAA;AACrF,OAAO,KAAK,EAAE,GAAG,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAmBxD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAA;AAC9D,OAAO,KAAK,EAAE,sBAAsB,EAAE,aAAa,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAI9F,MAAM,MAAM,cAAc,GAAG;IAC3B,OAAO,EAAE,MAAM,OAAO,CAAA;IACtB,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,CAAA;AAID,MAAM,MAAM,YAAY,GAAG,CACzB,gBAAgB,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EAC/C,SAAS,EAAE;IACT,MAAM,EAAE,KAAK,CAAC,sBAAsB,CAAC,CAAA;IACrC,eAAe,EAAE,IAAI,GAAG,MAAM,CAAA;IAC9B,oBAAoB,EAAE,CAAC,YAAY,EAAE,aAAa,KAAK,IAAI,CAAA;IAC3D,kBAAkB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9C,EACD,cAAc,EAAE,IAAI,GAAG,MAAM,KAC1B,GAAG,CAAC,OAAO,GAAG,IAAI,GAAG,WAAW,CAAA;AA2ErC,wBAAgB,eAAe,CAC7B,OAAO,EAAE,WAAW,EACpB,aAAa,EAAE,OAAO,GACrB,eAAe,GAAG,WAAW,CAiB/B;AAYD,wBAAgB,qBAAqB,CACnC,UAAU,EAAE,cAAc,GAAG,IAAI,EACjC,gBAAgB,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EAC/C,YAAY,EAAE,MAAM,IAAI,EACxB,kBAAkB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,QA4CjD;AAED,eAAO,MAAM,yCAAyC,EAAE,cAAc,CAAC;IACrE,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,qBAAqB,CAAA;CAC5B,CAA8D,CAAA;AAE/D,wBAAgB,WAAW,CAAC,EAC1B,gBAAgB,EAChB,KAAK,EACL,MAAM,EAEN,MAAM,EACN,YAAY,EACZ,UAAU,EACV,wBAAgC,GACjC,EAAE;IACD,gBAAgB,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAC/C,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,MAAM,EAAE,aAAa,CAAA;IACrB,MAAM,EAAE,KAAK,CAAC,sBAAsB,CAAC,CAAA;IACrC,YAAY,EAAE,YAAY,CAAA;IAC1B,UAAU,EAAE,cAAc,CAAA;IAC1B,wBAAwB,CAAC,EAAE,OAAO,CAAA;CACnC,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAuOrB;AAYD,wBAAgB,gBAAgB,CAC9B,UAAU,EAAE,WAAW,EACvB,UAAU,EAAE,cAAc,GAAG,IAAI,EACjC,aAAa,EAAE,CAAC,CAAC,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,EACjD,SAAS,CAAC,EAAE,MAAM,GACjB,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAoG/B"}
+{"version":3,"file":"LexicalMenu.d.ts","sourceRoot":"","sources":["../../../../../src/lexical/plugins/SlashMenu/LexicalTypeaheadMenuPlugin/LexicalMenu.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAiB,cAAc,EAAE,aAAa,EAAY,MAAM,SAAS,CAAA;AACrF,OAAO,KAAK,EAAE,GAAG,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAmBxD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAA;AAC9D,OAAO,KAAK,EAAE,sBAAsB,EAAE,aAAa,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAA;AAI9F,MAAM,MAAM,cAAc,GAAG;IAC3B,OAAO,EAAE,MAAM,OAAO,CAAA;IACtB,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,CAAA;AAID,MAAM,MAAM,YAAY,GAAG,CACzB,gBAAgB,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EAC/C,SAAS,EAAE;IACT,MAAM,EAAE,KAAK,CAAC,sBAAsB,CAAC,CAAA;IACrC,eAAe,EAAE,IAAI,GAAG,MAAM,CAAA;IAC9B,oBAAoB,EAAE,CAAC,YAAY,EAAE,aAAa,KAAK,IAAI,CAAA;IAC3D,kBAAkB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9C,EACD,cAAc,EAAE,IAAI,GAAG,MAAM,KAC1B,GAAG,CAAC,OAAO,GAAG,IAAI,GAAG,WAAW,CAAA;AAoFrC,wBAAgB,qBAAqB,CACnC,UAAU,EAAE,cAAc,GAAG,IAAI,EACjC,gBAAgB,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,EAC/C,YAAY,EAAE,MAAM,IAAI,EACxB,kBAAkB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,QA4CjD;AAED,eAAO,MAAM,yCAAyC,EAAE,cAAc,CAAC;IACrE,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,qBAAqB,CAAA;CAC5B,CAA8D,CAAA;AAE/D,wBAAgB,WAAW,CAAC,EAC1B,gBAAgB,EAChB,KAAK,EACL,MAAM,EAEN,MAAM,EACN,YAAY,EACZ,UAAU,EACV,wBAAgC,GACjC,EAAE;IACD,gBAAgB,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAC/C,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,MAAM,EAAE,aAAa,CAAA;IACrB,MAAM,EAAE,KAAK,CAAC,sBAAsB,CAAC,CAAA;IACrC,YAAY,EAAE,YAAY,CAAA;IAC1B,UAAU,EAAE,cAAc,CAAA;IAC1B,wBAAwB,CAAC,EAAE,OAAO,CAAA;CACnC,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAuOrB;AAYD,wBAAgB,gBAAgB,CAC9B,UAAU,EAAE,WAAW,EACvB,UAAU,EAAE,cAAc,GAAG,IAAI,EACjC,aAAa,EAAE,CAAC,CAAC,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,EACjD,SAAS,CAAC,EAAE,MAAM,GACjB,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAoG/B"}

package/dist/lexical/plugins/SlashMenu/LexicalTypeaheadMenuPlugin/LexicalMenu.js

@@ -2,7 +2,7 @@
 
 import { c as _c } from "react/compiler-runtime";
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js';
-import { mergeRegister } from '@lexical/utils';
+import { getScrollParent, mergeRegister } from '@lexical/utils';
 import { $getSelection, $isRangeSelection, $setSelection, COMMAND_PRIORITY_LOW, COMMAND_PRIORITY_NORMAL, createCommand, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND, KEY_ENTER_COMMAND, KEY_ESCAPE_COMMAND, KEY_TAB_COMMAND } from 'lexical';
 import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { CAN_USE_DOM } from '../../../utils/canUseDOM.js';
@@ -73,25 +73,6 @@ function $splitNodeContainingQuery(match) {
   }
   return newNode;
 }
-// Got from https://stackoverflow.com/a/42543908/2013580
-export function getScrollParent(element, includeHidden) {
-  let style = getComputedStyle(element);
-  const excludeStaticParent = style.position === 'absolute';
-  const overflowRegex = includeHidden ? /(auto|scroll|hidden)/ : /(auto|scroll)/;
-  if (style.position === 'fixed') {
-    return document.body;
-  }
-  for (let parent1 = element; parent1 = parent1.parentElement;) {
-    style = getComputedStyle(parent1);
-    if (excludeStaticParent && style.position === 'static') {
-      continue;
-    }
-    if (overflowRegex.test(style.overflow + style.overflowY + style.overflowX)) {
-      return parent1;
-    }
-  }
-  return document.body;
-}
 function isTriggerVisibleInNearestScrollContainer(targetElement, containerElement) {
   const tRect = targetElement.getBoundingClientRect();
   const cRect = containerElement.getBoundingClientRect();
@@ -156,95 +137,182 @@ export function useDynamicPositioning(resolution, targetElementRef, onReposition
   useEffect(t0, t1);
 }
 export const SCROLL_TYPEAHEAD_OPTION_INTO_VIEW_COMMAND = createCommand('SCROLL_TYPEAHEAD_OPTION_INTO_VIEW_COMMAND');
-export function LexicalMenu({
-  anchorElementRef,
-  close,
-  editor,
-  // groups filtering is already handled in SlashMenu/index.tsx. Thus, groups always contains the matching items.
-  groups,
-  menuRenderFn,
-  resolution,
-  shouldSplitNodeWithQuery = false
-}) {
+export function LexicalMenu(t0) {
+  const $ = _c(50);
+  const {
+    anchorElementRef,
+    close,
+    editor,
+    groups,
+    menuRenderFn,
+    resolution,
+    shouldSplitNodeWithQuery: t1
+  } = t0;
+  const shouldSplitNodeWithQuery = t1 === undefined ? false : t1;
   const [selectedItemKey, setSelectedItemKey] = useState(null);
-  const matchingString = resolution.match && resolution.match.matchingString || '';
-  const updateSelectedItem = useCallback(item => {
-    const rootElem = editor.getRootElement();
-    if (rootElem !== null) {
-      rootElem.setAttribute('aria-activedescendant', `${baseClass}__item-${item.key}`);
-      setSelectedItemKey(item.key);
-    }
-  }, [editor]);
-  const setSelectedItemKeyToFirstMatchingItem = useCallback(() => {
-    // set selected item to the first of the matching ones
-    if (groups !== null && matchingString != null) {
-      // groups filtering is already handled in SlashMenu/index.tsx. Thus, groups always contains the matching items.
-      const allItems = groups.flatMap(group => group.items);
-      if (allItems.length) {
-        const firstMatchingItem = allItems[0];
-        updateSelectedItem(firstMatchingItem);
+  const matchingString = resolution.match && resolution.match.matchingString || "";
+  let t2;
+  if ($[0] !== editor) {
+    t2 = item => {
+      const rootElem = editor.getRootElement();
+      if (rootElem !== null) {
+        rootElem.setAttribute("aria-activedescendant", `${baseClass}__item-${item.key}`);
+        setSelectedItemKey(item.key);
       }
-    }
-  }, [groups, updateSelectedItem, matchingString]);
-  useEffect(() => {
-    setSelectedItemKeyToFirstMatchingItem();
-  }, [matchingString, setSelectedItemKeyToFirstMatchingItem]);
-  const selectItemAndCleanUp = useCallback(selectedItem => {
-    close();
-    editor.update(() => {
-      const textNodeContainingQuery = resolution.match != null && shouldSplitNodeWithQuery ? $splitNodeContainingQuery(resolution.match) : null;
-      if (textNodeContainingQuery) {
-        textNodeContainingQuery.remove();
+    };
+    $[0] = editor;
+    $[1] = t2;
+  } else {
+    t2 = $[1];
+  }
+  const updateSelectedItem = t2;
+  let t3;
+  if ($[2] !== groups || $[3] !== matchingString || $[4] !== updateSelectedItem) {
+    t3 = () => {
+      if (groups !== null && matchingString != null) {
+        const allItems = groups.flatMap(_temp);
+        if (allItems.length) {
+          const firstMatchingItem = allItems[0];
+          updateSelectedItem(firstMatchingItem);
+        }
       }
-    });
-    setTimeout(() => {
-      // Needed in Firefox. See https://github.com/payloadcms/payload/issues/10724
-      let selection;
-      editor.read(() => {
-        selection = $getSelection()?.clone();
-      });
+    };
+    $[2] = groups;
+    $[3] = matchingString;
+    $[4] = updateSelectedItem;
+    $[5] = t3;
+  } else {
+    t3 = $[5];
+  }
+  const setSelectedItemKeyToFirstMatchingItem = t3;
+  let t4;
+  if ($[6] !== setSelectedItemKeyToFirstMatchingItem) {
+    t4 = () => {
+      setSelectedItemKeyToFirstMatchingItem();
+    };
+    $[6] = setSelectedItemKeyToFirstMatchingItem;
+    $[7] = t4;
+  } else {
+    t4 = $[7];
+  }
+  let t5;
+  if ($[8] !== matchingString || $[9] !== setSelectedItemKeyToFirstMatchingItem) {
+    t5 = [matchingString, setSelectedItemKeyToFirstMatchingItem];
+    $[8] = matchingString;
+    $[9] = setSelectedItemKeyToFirstMatchingItem;
+    $[10] = t5;
+  } else {
+    t5 = $[10];
+  }
+  useEffect(t4, t5);
+  let t6;
+  if ($[11] !== close || $[12] !== editor || $[13] !== resolution.match || $[14] !== shouldSplitNodeWithQuery) {
+    t6 = selectedItem => {
+      close();
       editor.update(() => {
-        if (selection) {
-          $setSelection(selection);
+        const textNodeContainingQuery = resolution.match != null && shouldSplitNodeWithQuery ? $splitNodeContainingQuery(resolution.match) : null;
+        if (textNodeContainingQuery) {
+          textNodeContainingQuery.remove();
         }
       });
-      selectedItem.onSelect({
-        editor,
-        queryString: resolution.match ? resolution.match.matchingString : ''
-      });
-    }, 0);
-  }, [editor, shouldSplitNodeWithQuery, resolution.match, close]);
-  useEffect(() => {
-    return () => {
+      setTimeout(() => {
+        let selection;
+        editor.read(() => {
+          selection = $getSelection()?.clone();
+        });
+        editor.update(() => {
+          if (selection) {
+            $setSelection(selection);
+          }
+        });
+        selectedItem.onSelect({
+          editor,
+          queryString: resolution.match ? resolution.match.matchingString : ""
+        });
+      }, 0);
+    };
+    $[11] = close;
+    $[12] = editor;
+    $[13] = resolution.match;
+    $[14] = shouldSplitNodeWithQuery;
+    $[15] = t6;
+  } else {
+    t6 = $[15];
+  }
+  const selectItemAndCleanUp = t6;
+  let t7;
+  let t8;
+  if ($[16] !== editor) {
+    t7 = () => () => {
       const rootElem_0 = editor.getRootElement();
       if (rootElem_0 !== null) {
-        rootElem_0.removeAttribute('aria-activedescendant');
+        rootElem_0.removeAttribute("aria-activedescendant");
       }
     };
-  }, [editor]);
-  useLayoutEffect(() => {
-    if (groups === null) {
-      setSelectedItemKey(null);
-    } else if (selectedItemKey === null) {
-      setSelectedItemKeyToFirstMatchingItem();
-    }
-  }, [groups, selectedItemKey, updateSelectedItem, setSelectedItemKeyToFirstMatchingItem]);
-  useEffect(() => {
-    return mergeRegister(editor.registerCommand(SCROLL_TYPEAHEAD_OPTION_INTO_VIEW_COMMAND, ({
-      item: item_0
-    }) => {
-      if (item_0.ref && item_0.ref.current != null) {
-        scrollIntoViewIfNeeded(item_0.ref.current);
-        return true;
+    t8 = [editor];
+    $[16] = editor;
+    $[17] = t7;
+    $[18] = t8;
+  } else {
+    t7 = $[17];
+    t8 = $[18];
+  }
+  useEffect(t7, t8);
+  let t9;
+  if ($[19] !== groups || $[20] !== selectedItemKey || $[21] !== setSelectedItemKeyToFirstMatchingItem) {
+    t9 = () => {
+      if (groups === null) {
+        setSelectedItemKey(null);
+      } else {
+        if (selectedItemKey === null) {
+          setSelectedItemKeyToFirstMatchingItem();
+        }
       }
-      return false;
-    }, COMMAND_PRIORITY_LOW));
-  }, [editor, updateSelectedItem]);
-  useEffect(() => {
-    return mergeRegister(editor.registerCommand(KEY_ARROW_DOWN_COMMAND, payload => {
+    };
+    $[19] = groups;
+    $[20] = selectedItemKey;
+    $[21] = setSelectedItemKeyToFirstMatchingItem;
+    $[22] = t9;
+  } else {
+    t9 = $[22];
+  }
+  let t10;
+  if ($[23] !== groups || $[24] !== selectedItemKey || $[25] !== setSelectedItemKeyToFirstMatchingItem || $[26] !== updateSelectedItem) {
+    t10 = [groups, selectedItemKey, updateSelectedItem, setSelectedItemKeyToFirstMatchingItem];
+    $[23] = groups;
+    $[24] = selectedItemKey;
+    $[25] = setSelectedItemKeyToFirstMatchingItem;
+    $[26] = updateSelectedItem;
+    $[27] = t10;
+  } else {
+    t10 = $[27];
+  }
+  useLayoutEffect(t9, t10);
+  let t11;
+  if ($[28] !== editor) {
+    t11 = () => mergeRegister(editor.registerCommand(SCROLL_TYPEAHEAD_OPTION_INTO_VIEW_COMMAND, _temp2, COMMAND_PRIORITY_LOW));
+    $[28] = editor;
+    $[29] = t11;
+  } else {
+    t11 = $[29];
+  }
+  let t12;
+  if ($[30] !== editor || $[31] !== updateSelectedItem) {
+    t12 = [editor, updateSelectedItem];
+    $[30] = editor;
+    $[31] = updateSelectedItem;
+    $[32] = t12;
+  } else {
+    t12 = $[32];
+  }
+  useEffect(t11, t12);
+  let t13;
+  let t14;
+  if ($[33] !== close || $[34] !== editor || $[35] !== groups || $[36] !== selectItemAndCleanUp || $[37] !== selectedItemKey || $[38] !== updateSelectedItem) {
+    t13 = () => mergeRegister(editor.registerCommand(KEY_ARROW_DOWN_COMMAND, payload => {
       const event = payload;
       if (groups !== null && groups.length && selectedItemKey !== null) {
-        const allItems_0 = groups.flatMap(group_0 => group_0.items);
+        const allItems_0 = groups.flatMap(_temp3);
         const selectedIndex = allItems_0.findIndex(item_1 => item_1.key === selectedItemKey);
         const newSelectedIndex = selectedIndex !== allItems_0.length - 1 ? selectedIndex + 1 : 0;
         const newSelectedItem = allItems_0[newSelectedIndex];
@@ -265,7 +333,7 @@ export function LexicalMenu({
     }, COMMAND_PRIORITY_NORMAL), editor.registerCommand(KEY_ARROW_UP_COMMAND, payload_0 => {
       const event_0 = payload_0;
       if (groups !== null && groups.length && selectedItemKey !== null) {
-        const allItems_1 = groups.flatMap(group_1 => group_1.items);
+        const allItems_1 = groups.flatMap(_temp4);
         const selectedIndex_0 = allItems_1.findIndex(item_2 => item_2.key === selectedItemKey);
         const newSelectedIndex_0 = selectedIndex_0 !== 0 ? selectedIndex_0 - 1 : allItems_1.length - 1;
         const newSelectedItem_0 = allItems_1[newSelectedIndex_0];
@@ -286,12 +354,12 @@ export function LexicalMenu({
       event_1.stopImmediatePropagation();
       close();
       return true;
-    }, COMMAND_PRIORITY_LOW), editor.registerCommand(KEY_TAB_COMMAND, payload_2 => {
+    }, COMMAND_PRIORITY_NORMAL), editor.registerCommand(KEY_TAB_COMMAND, payload_2 => {
       const event_2 = payload_2;
       if (groups === null || selectedItemKey === null) {
         return false;
       }
-      const allItems_2 = groups.flatMap(group_2 => group_2.items);
+      const allItems_2 = groups.flatMap(_temp5);
       const selectedItem_0 = allItems_2.find(item_3 => item_3.key === selectedItemKey);
       if (!selectedItem_0) {
         return false;
@@ -304,7 +372,7 @@ export function LexicalMenu({
       if (groups === null || selectedItemKey === null) {
         return false;
       }
-      const allItems_3 = groups.flatMap(group_3 => group_3.items);
+      const allItems_3 = groups.flatMap(_temp6);
       const selectedItem_1 = allItems_3.find(item_4 => item_4.key === selectedItemKey);
       if (!selectedItem_1) {
         return false;
@@ -316,14 +384,74 @@ export function LexicalMenu({
       selectItemAndCleanUp(selectedItem_1);
       return true;
     }, COMMAND_PRIORITY_NORMAL));
-  }, [selectItemAndCleanUp, close, editor, groups, selectedItemKey, updateSelectedItem]);
-  const listItemProps = useMemo(() => ({
-    groups,
-    selectedItemKey,
-    selectItemAndCleanUp,
-    setSelectedItemKey
-  }), [selectItemAndCleanUp, selectedItemKey, groups]);
-  return menuRenderFn(anchorElementRef, listItemProps, resolution.match ? resolution.match.matchingString : '');
+    t14 = [selectItemAndCleanUp, close, editor, groups, selectedItemKey, updateSelectedItem];
+    $[33] = close;
+    $[34] = editor;
+    $[35] = groups;
+    $[36] = selectItemAndCleanUp;
+    $[37] = selectedItemKey;
+    $[38] = updateSelectedItem;
+    $[39] = t13;
+    $[40] = t14;
+  } else {
+    t13 = $[39];
+    t14 = $[40];
+  }
+  useEffect(t13, t14);
+  let t15;
+  if ($[41] !== groups || $[42] !== selectItemAndCleanUp || $[43] !== selectedItemKey) {
+    t15 = {
+      groups,
+      selectedItemKey,
+      selectItemAndCleanUp,
+      setSelectedItemKey
+    };
+    $[41] = groups;
+    $[42] = selectItemAndCleanUp;
+    $[43] = selectedItemKey;
+    $[44] = t15;
+  } else {
+    t15 = $[44];
+  }
+  const listItemProps = t15;
+  const t16 = resolution.match ? resolution.match.matchingString : "";
+  let t17;
+  if ($[45] !== anchorElementRef || $[46] !== listItemProps || $[47] !== menuRenderFn || $[48] !== t16) {
+    t17 = menuRenderFn(anchorElementRef, listItemProps, t16);
+    $[45] = anchorElementRef;
+    $[46] = listItemProps;
+    $[47] = menuRenderFn;
+    $[48] = t16;
+    $[49] = t17;
+  } else {
+    t17 = $[49];
+  }
+  return t17;
+}
+function _temp6(group_3) {
+  return group_3.items;
+}
+function _temp5(group_2) {
+  return group_2.items;
+}
+function _temp4(group_1) {
+  return group_1.items;
+}
+function _temp3(group_0) {
+  return group_0.items;
+}
+function _temp2(t0) {
+  const {
+    item: item_0
+  } = t0;
+  if (item_0.ref && item_0.ref.current != null) {
+    scrollIntoViewIfNeeded(item_0.ref.current);
+    return true;
+  }
+  return false;
+}
+function _temp(group) {
+  return group.items;
 }
 function setContainerDivAttributes(containerDiv, className) {
   if (className != null) {