@lexical/react 0.6.3 → 0.6.5

package/LexicalAutoFocusPlugin.dev.js

@@ -29,7 +29,7 @@ function AutoFocusPlugin({
       const activeElement = document.activeElement;
       const rootElement = editor.getRootElement();
 
-      if (!rootElement.contains(activeElement) || rootElement !== null || activeElement === null) {
+      if (rootElement !== null && (activeElement === null || !rootElement.contains(activeElement))) {
         // Note: preventScroll won't work in Webkit.
         rootElement.focus({
           preventScroll: true

package/LexicalAutoFocusPlugin.prod.js

@@ -4,4 +4,4 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-'use strict';var e=require("@lexical/react/LexicalComposerContext"),f=require("react");exports.AutoFocusPlugin=function({defaultSelection:c}){let [a]=e.useLexicalComposerContext();f.useEffect(()=>{a.focus(()=>{let d=document.activeElement,b=a.getRootElement();b.contains(d)&&null===b&&null!==d||b.focus({preventScroll:!0})},{defaultSelection:c})},[c,a]);return null}
+'use strict';var e=require("@lexical/react/LexicalComposerContext"),f=require("react");exports.AutoFocusPlugin=function({defaultSelection:c}){let [a]=e.useLexicalComposerContext();f.useEffect(()=>{a.focus(()=>{let d=document.activeElement,b=a.getRootElement();null===b||null!==d&&b.contains(d)||b.focus({preventScroll:!0})},{defaultSelection:c})},[c,a]);return null}

package/LexicalComposer.d.ts

@@ -7,22 +7,23 @@
  */
 import { EditorState, EditorThemeClasses, Klass, LexicalEditor, LexicalNode } from 'lexical';
 export declare type InitialEditorStateType = null | string | EditorState | ((editor: LexicalEditor) => void);
+export declare type InitialConfigType = Readonly<{
+    editor__DEPRECATED?: LexicalEditor | null;
+    namespace: string;
+    nodes?: ReadonlyArray<Klass<LexicalNode> | {
+        replace: Klass<LexicalNode>;
+        with: <T extends {
+            new (...args: any): any;
+        }>(node: InstanceType<T>) => LexicalNode;
+    }>;
+    onError: (error: Error, editor: LexicalEditor) => void;
+    editable?: boolean;
+    theme?: EditorThemeClasses;
+    editorState?: InitialEditorStateType;
+}>;
 declare type Props = {
     children: JSX.Element | string | (JSX.Element | string)[];
-    initialConfig: Readonly<{
-        editor__DEPRECATED?: LexicalEditor | null;
-        namespace: string;
-        nodes?: ReadonlyArray<Klass<LexicalNode> | {
-            replace: Klass<LexicalNode>;
-            with: <T extends {
-                new (...args: any): any;
-            }>(node: InstanceType<T>) => LexicalNode;
-        }>;
-        onError: (error: Error, editor: LexicalEditor) => void;
-        editable?: boolean;
-        theme?: EditorThemeClasses;
-        editorState?: InitialEditorStateType;
-    }>;
+    initialConfig: InitialConfigType;
 };
 export declare function LexicalComposer({ initialConfig, children }: Props): JSX.Element;
 export {};

package/LexicalComposer.dev.js

@@ -92,7 +92,7 @@ function initializeEditor(editor, initialEditorState) {
       if (root.isEmpty()) {
         const paragraph = lexical.$createParagraphNode();
         root.append(paragraph);
-        const activeElement = document.activeElement;
+        const activeElement = CAN_USE_DOM ? document.activeElement : null;
 
         if (lexical.$getSelection() !== null || activeElement !== null && activeElement === editor.getRootElement()) {
           paragraph.select();

package/LexicalComposer.js.flow

@@ -20,19 +20,21 @@ export type InitialEditorStateType =
   | EditorState
   | ((editor: LexicalEditor) => void);
 
+export type InitialConfigType = $ReadOnly<{
+  editor__DEPRECATED?: LexicalEditor | null,
+  editable?: boolean,
+  namespace: string,
+  nodes?: $ReadOnlyArray<
+    | Class<LexicalNode>
+    | {replace: Class<LexicalNode>, with: (node: LexicalNode) => LexicalNode},
+  >,
+  theme?: EditorThemeClasses,
+  editorState?: InitialEditorStateType,
+  onError: (error: Error, editor: LexicalEditor) => void,
+}>;
+
 type Props = {
-  initialConfig: $ReadOnly<{
-    editor__DEPRECATED?: LexicalEditor | null,
-    editable?: boolean,
-    namespace: string,
-    nodes?: $ReadOnlyArray<
-      | Class<LexicalNode>
-      | {replace: Class<LexicalNode>, with: (node: LexicalNode) => LexicalNode},
-    >,
-    theme?: EditorThemeClasses,
-    editorState?: InitialEditorStateType,
-    onError: (error: Error, editor: LexicalEditor) => void,
-  }>,
+  initialConfig: InitialConfigType,
   children: React$Node,
 };
 

package/LexicalComposer.prod.js

@@ -4,6 +4,6 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-'use strict';var e=require("@lexical/react/LexicalComposerContext"),f=require("lexical"),g=require("react"),m="undefined"!==typeof window&&"undefined"!==typeof window.document&&"undefined"!==typeof window.document.createElement?g.useLayoutEffect:g.useEffect;let n={tag:"history-merge"};
-function p(a,c){if(null!==c)if(void 0===c)a.update(()=>{var b=f.$getRoot();if(b.isEmpty()){let d=f.$createParagraphNode();b.append(d);b=document.activeElement;(null!==f.$getSelection()||null!==b&&b===a.getRootElement())&&d.select()}},n);else if(null!==c)switch(typeof c){case "string":let b=a.parseEditorState(c);a.setEditorState(b,n);break;case "object":a.setEditorState(c,n);break;case "function":a.update(()=>{f.$getRoot().isEmpty()&&c(a)},n)}}
-exports.LexicalComposer=function({initialConfig:a,children:c}){let b=g.useMemo(()=>{const {theme:d,namespace:h,editor__DEPRECATED:q,nodes:r,onError:t,editorState:u}=a,v=e.createLexicalComposerContext(null,d);let k=q||null;if(null===k){const l=f.createEditor({editable:!1,namespace:h,nodes:r,onError:w=>t(w,l),theme:d});p(l,u);k=l}return[k,v]},[]);m(()=>{let d=a.editable,[h]=b;h.setEditable(void 0!==d?d:!0)},[]);return g.createElement(e.LexicalComposerContext.Provider,{value:b},c)}
+'use strict';var e=require("@lexical/react/LexicalComposerContext"),f=require("lexical"),g=require("react");let m="undefined"!==typeof window&&"undefined"!==typeof window.document&&"undefined"!==typeof window.document.createElement;var n=m?g.useLayoutEffect:g.useEffect;let p={tag:"history-merge"};
+function q(a,c){if(null!==c)if(void 0===c)a.update(()=>{var b=f.$getRoot();if(b.isEmpty()){let d=f.$createParagraphNode();b.append(d);b=m?document.activeElement:null;(null!==f.$getSelection()||null!==b&&b===a.getRootElement())&&d.select()}},p);else if(null!==c)switch(typeof c){case "string":let b=a.parseEditorState(c);a.setEditorState(b,p);break;case "object":a.setEditorState(c,p);break;case "function":a.update(()=>{f.$getRoot().isEmpty()&&c(a)},p)}}
+exports.LexicalComposer=function({initialConfig:a,children:c}){let b=g.useMemo(()=>{const {theme:d,namespace:h,editor__DEPRECATED:r,nodes:t,onError:u,editorState:v}=a,w=e.createLexicalComposerContext(null,d);let k=r||null;if(null===k){const l=f.createEditor({editable:!1,namespace:h,nodes:t,onError:x=>u(x,l),theme:d});q(l,v);k=l}return[k,w]},[]);n(()=>{let d=a.editable,[h]=b;h.setEditable(void 0!==d?d:!0)},[]);return g.createElement(e.LexicalComposerContext.Provider,{value:b},c)}

package/LexicalHorizontalRuleNode.dev.js

@@ -25,7 +25,6 @@ function HorizontalRuleComponent({
   nodeKey
 }) {
   const [editor] = LexicalComposerContext.useLexicalComposerContext();
-  const hrRef = React.useRef(null);
   const [isSelected, setSelected, clearSelection] = useLexicalNodeSelection.useLexicalNodeSelection(nodeKey);
   const onDelete = React.useCallback(payload => {
     if (isSelected && lexical.$isNodeSelection(lexical.$getSelection())) {
@@ -44,7 +43,7 @@ function HorizontalRuleComponent({
   }, [isSelected, nodeKey, setSelected]);
   React.useEffect(() => {
     return utils.mergeRegister(editor.registerCommand(lexical.CLICK_COMMAND, event => {
-      const hrElem = hrRef.current;
+      const hrElem = editor.getElementByKey(nodeKey);
 
       if (event.target === hrElem) {
         if (!event.shiftKey) {
@@ -57,11 +56,15 @@ function HorizontalRuleComponent({
 
       return false;
     }, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.KEY_DELETE_COMMAND, onDelete, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.KEY_BACKSPACE_COMMAND, onDelete, lexical.COMMAND_PRIORITY_LOW));
-  }, [clearSelection, editor, isSelected, onDelete, setSelected]);
-  return /*#__PURE__*/React.createElement("hr", {
-    ref: hrRef,
-    className: isSelected ? 'selected' : undefined
-  });
+  }, [clearSelection, editor, isSelected, nodeKey, onDelete, setSelected]);
+  React.useEffect(() => {
+    const hrElem = editor.getElementByKey(nodeKey);
+
+    if (hrElem !== null) {
+      hrElem.className = isSelected ? 'selected' : '';
+    }
+  }, [editor, isSelected, nodeKey]);
+  return null;
 }
 
 class HorizontalRuleNode extends lexical.DecoratorNode {
@@ -100,9 +103,7 @@ class HorizontalRuleNode extends lexical.DecoratorNode {
   }
 
   createDOM() {
-    const div = document.createElement('div');
-    div.style.display = 'contents';
-    return div;
+    return document.createElement('hr');
   }
 
   getTextContent() {

package/LexicalHorizontalRuleNode.prod.js

@@ -4,8 +4,8 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-'use strict';var a=require("@lexical/react/LexicalComposerContext"),d=require("@lexical/react/useLexicalNodeSelection"),h=require("@lexical/utils"),l=require("lexical"),p=require("react");let q=l.createCommand("INSERT_HORIZONTAL_RULE_COMMAND");
-function r({nodeKey:b}){let [f]=a.useLexicalComposerContext(),m=p.useRef(null),[e,g,n]=d.useLexicalNodeSelection(b),k=p.useCallback(c=>{e&&l.$isNodeSelection(l.$getSelection())&&(c.preventDefault(),c=l.$getNodeByKey(b),t(c)&&c.remove(),g(!1));return!1},[e,b,g]);p.useEffect(()=>h.mergeRegister(f.registerCommand(l.CLICK_COMMAND,c=>c.target===m.current?(c.shiftKey||n(),g(!e),!0):!1,l.COMMAND_PRIORITY_LOW),f.registerCommand(l.KEY_DELETE_COMMAND,k,l.COMMAND_PRIORITY_LOW),f.registerCommand(l.KEY_BACKSPACE_COMMAND,
-k,l.COMMAND_PRIORITY_LOW)),[n,f,e,k,g]);return p.createElement("hr",{ref:m,className:e?"selected":void 0})}
-class u extends l.DecoratorNode{static getType(){return"horizontalrule"}static clone(b){return new u(b.__key)}static importJSON(){return v()}static importDOM(){return{hr:()=>({conversion:w,priority:0})}}exportJSON(){return{type:"horizontalrule",version:1}}exportDOM(){return{element:document.createElement("hr")}}createDOM(){let b=document.createElement("div");b.style.display="contents";return b}getTextContent(){return"\n"}isInline(){return!1}updateDOM(){return!1}decorate(){return p.createElement(r,{nodeKey:this.__key})}}
-function w(){return{node:v()}}function v(){return l.$applyNodeReplacement(new u)}function t(b){return b instanceof u}exports.$createHorizontalRuleNode=v;exports.$isHorizontalRuleNode=t;exports.HorizontalRuleNode=u;exports.INSERT_HORIZONTAL_RULE_COMMAND=q
+'use strict';var a=require("@lexical/react/LexicalComposerContext"),f=require("@lexical/react/useLexicalNodeSelection"),h=require("@lexical/utils"),l=require("lexical"),n=require("react");let p=l.createCommand("INSERT_HORIZONTAL_RULE_COMMAND");
+function q({nodeKey:b}){let [d]=a.useLexicalComposerContext(),[e,g,m]=f.useLexicalNodeSelection(b),k=n.useCallback(c=>{e&&l.$isNodeSelection(l.$getSelection())&&(c.preventDefault(),c=l.$getNodeByKey(b),r(c)&&c.remove(),g(!1));return!1},[e,b,g]);n.useEffect(()=>h.mergeRegister(d.registerCommand(l.CLICK_COMMAND,c=>{let v=d.getElementByKey(b);return c.target===v?(c.shiftKey||m(),g(!e),!0):!1},l.COMMAND_PRIORITY_LOW),d.registerCommand(l.KEY_DELETE_COMMAND,k,l.COMMAND_PRIORITY_LOW),d.registerCommand(l.KEY_BACKSPACE_COMMAND,
+k,l.COMMAND_PRIORITY_LOW)),[m,d,e,b,k,g]);n.useEffect(()=>{let c=d.getElementByKey(b);null!==c&&(c.className=e?"selected":"")},[d,e,b]);return null}
+class t extends l.DecoratorNode{static getType(){return"horizontalrule"}static clone(b){return new t(b.__key)}static importJSON(){return u()}static importDOM(){return{hr:()=>({conversion:w,priority:0})}}exportJSON(){return{type:"horizontalrule",version:1}}exportDOM(){return{element:document.createElement("hr")}}createDOM(){return document.createElement("hr")}getTextContent(){return"\n"}isInline(){return!1}updateDOM(){return!1}decorate(){return n.createElement(q,{nodeKey:this.__key})}}
+function w(){return{node:u()}}function u(){return l.$applyNodeReplacement(new t)}function r(b){return b instanceof t}exports.$createHorizontalRuleNode=u;exports.$isHorizontalRuleNode=r;exports.HorizontalRuleNode=t;exports.INSERT_HORIZONTAL_RULE_COMMAND=p

package/LexicalNestedComposer.d.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-import type { EditorThemeClasses, Klass, LexicalEditor, LexicalNode } from 'lexical';
+import { EditorThemeClasses, Klass, LexicalEditor, LexicalNode } from 'lexical';
 import { ReactNode } from 'react';
 export declare function LexicalNestedComposer({ initialEditor, children, initialNodes, initialTheme, skipCollabChecks, }: {
     children: ReactNode;

package/LexicalNestedComposer.dev.js

@@ -33,9 +33,11 @@ function LexicalNestedComposer({
     }
   }
 
+  const [parentEditor, {
+    getTheme: getParentTheme
+  }] = parentContext;
   const composerContext = React.useMemo(() => {
-    const [parentEditor, parentContextContext] = parentContext;
-    const composerTheme = initialTheme || parentContextContext.getTheme() || undefined;
+    const composerTheme = initialTheme || getParentTheme() || undefined;
     const context = LexicalComposerContext.createLexicalComposerContext(parentContext, composerTheme);
 
     if (composerTheme !== undefined) {
@@ -70,8 +72,7 @@ function LexicalNestedComposer({
     return [initialEditor, context];
   }, // We only do this for init
   // eslint-disable-next-line react-hooks/exhaustive-deps
-  []); // If collaboration is enabled, make sure we don't render the children
-  // until the collaboration subdocument is ready.
+  []); // If collaboration is enabled, make sure we don't render the children until the collaboration subdocument is ready.
 
   const {
     isCollabActive,
@@ -82,7 +83,13 @@ function LexicalNestedComposer({
     if (isCollabReady) {
       wasCollabPreviouslyReadyRef.current = true;
     }
-  }, [isCollabReady]);
+  }, [isCollabReady]); // Update `isEditable` state of nested editor in response to the same change on parent editor.
+
+  React.useEffect(() => {
+    return parentEditor.registerEditableListener(editable => {
+      initialEditor.setEditable(editable);
+    });
+  }, [initialEditor, parentEditor]);
   return /*#__PURE__*/React.createElement(LexicalComposerContext.LexicalComposerContext.Provider, {
     value: composerContext
   }, !isCollabActive || isCollabReady ? children : null);

package/LexicalNestedComposer.prod.js

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-'use strict';var b=require("@lexical/react/LexicalCollaborationContext"),e=require("@lexical/react/LexicalComposerContext"),n=require("react");
-exports.LexicalNestedComposer=function({initialEditor:a,children:p,initialNodes:k,initialTheme:q,skipCollabChecks:r}){let l=n.useRef(!1),f=n.useContext(e.LexicalComposerContext);if(null==f)throw Error("Minified Lexical error #9; visit https://lexical.dev/docs/error?code=9 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.");let w=n.useMemo(()=>{const [g,t]=f;var c=q||t.getTheme()||void 0;const u=e.createLexicalComposerContext(f,c);void 0!==
-c&&(a._config.theme=c);a._parentEditor=g;if(k)for(var d of k)c=d.getType(),a._nodes.set(c,{klass:d,replace:null,transforms:new Set});else{d=a._nodes=new Map(g._nodes);for(const [v,m]of d)a._nodes.set(v,{klass:m.klass,replace:m.replace,transforms:new Set})}a._config.namespace=g._config.namespace;return[a,u]},[]),{isCollabActive:x,yjsDocMap:y}=b.useCollaborationContext(),h=r||l.current||y.has(a.getKey());n.useEffect(()=>{h&&(l.current=!0)},[h]);return n.createElement(e.LexicalComposerContext.Provider,
-{value:w},!x||h?p:null)}
+'use strict';var c=require("@lexical/react/LexicalCollaborationContext"),f=require("@lexical/react/LexicalComposerContext"),n=require("react");
+exports.LexicalNestedComposer=function({initialEditor:a,children:p,initialNodes:k,initialTheme:q,skipCollabChecks:r}){let l=n.useRef(!1),g=n.useContext(f.LexicalComposerContext);if(null==g)throw Error("Minified Lexical error #9; visit https://lexical.dev/docs/error?code=9 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.");let [d,{getTheme:t}]=g,w=n.useMemo(()=>{var b=q||t()||void 0;const u=f.createLexicalComposerContext(g,b);void 0!==b&&
+(a._config.theme=b);a._parentEditor=d;if(k)for(var e of k)b=e.getType(),a._nodes.set(b,{klass:e,replace:null,transforms:new Set});else{e=a._nodes=new Map(d._nodes);for(const [v,m]of e)a._nodes.set(v,{klass:m.klass,replace:m.replace,transforms:new Set})}a._config.namespace=d._config.namespace;return[a,u]},[]),{isCollabActive:x,yjsDocMap:y}=c.useCollaborationContext(),h=r||l.current||y.has(a.getKey());n.useEffect(()=>{h&&(l.current=!0)},[h]);n.useEffect(()=>d.registerEditableListener(b=>{a.setEditable(b)}),
+[a,d]);return n.createElement(f.LexicalComposerContext.Provider,{value:w},!x||h?p:null)}

package/LexicalNodeEventPlugin.dev.js

@@ -45,11 +45,15 @@ function NodeEventPlugin({
   listenerRef.current = eventListener;
   useLayoutEffect(() => {
     return editor.registerMutationListener(nodeType, mutations => {
+      const registedElements = new WeakSet();
       editor.getEditorState().read(() => {
         for (const [key, mutation] of mutations) {
           const element = editor.getElementByKey(key);
 
-          if (mutation === 'created' && element !== null) {
+          if ( // Updated might be a move, so that might mean a new DOM element
+          // is created. In this case, we need to add and event listener too.
+          (mutation === 'created' || mutation === 'updated') && element !== null && !registedElements.has(element)) {
+            registedElements.add(element);
             element.addEventListener(eventType, event => {
               listenerRef.current(event, editor, key);
             });

package/LexicalNodeEventPlugin.prod.js

@@ -4,5 +4,5 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-'use strict';var b=require("@lexical/react/LexicalComposerContext"),h=require("react"),k="undefined"!==typeof window&&"undefined"!==typeof window.document&&"undefined"!==typeof window.document.createElement?h.useLayoutEffect:h.useEffect;
-exports.NodeEventPlugin=function({nodeType:c,eventType:l,eventListener:d}){let [a]=b.useLexicalComposerContext(),e=h.useRef(d);e.current=d;k(()=>a.registerMutationListener(c,m=>{a.getEditorState().read(()=>{for(let [f,n]of m){let g=a.getElementByKey(f);"created"===n&&null!==g&&g.addEventListener(l,p=>{e.current(p,a,f)})}})}),[a,c]);return null}
+'use strict';var c=require("@lexical/react/LexicalComposerContext"),l=require("react"),m="undefined"!==typeof window&&"undefined"!==typeof window.document&&"undefined"!==typeof window.document.createElement?l.useLayoutEffect:l.useEffect;
+exports.NodeEventPlugin=function({nodeType:d,eventType:n,eventListener:e}){let [a]=c.useLexicalComposerContext(),f=l.useRef(e);f.current=e;m(()=>a.registerMutationListener(d,p=>{let g=new WeakSet;a.getEditorState().read(()=>{for(let [h,k]of p){let b=a.getElementByKey(h);"created"!==k&&"updated"!==k||null===b||g.has(b)||(g.add(b),b.addEventListener(n,q=>{f.current(q,a,h)}))}})}),[a,d]);return null}

package/LexicalTypeaheadMenuPlugin.dev.js

@@ -369,7 +369,7 @@ function LexicalPopoverMenu({
       }
 
       return true;
-    }, lexical.COMMAND_PRIORITY_CRITICAL), editor.registerCommand(lexical.KEY_ARROW_UP_COMMAND, payload => {
+    }, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.KEY_ARROW_UP_COMMAND, payload => {
       const event = payload;
 
       if (options !== null && options.length && selectedIndex !== null) {
@@ -386,13 +386,13 @@ function LexicalPopoverMenu({
       }
 
       return true;
-    }, lexical.COMMAND_PRIORITY_CRITICAL), editor.registerCommand(lexical.KEY_ESCAPE_COMMAND, payload => {
+    }, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.KEY_ESCAPE_COMMAND, payload => {
       const event = payload;
       event.preventDefault();
       event.stopImmediatePropagation();
       close();
       return true;
-    }, lexical.COMMAND_PRIORITY_CRITICAL), editor.registerCommand(lexical.KEY_TAB_COMMAND, payload => {
+    }, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.KEY_TAB_COMMAND, payload => {
       const event = payload;
 
       if (options === null || selectedIndex === null || options[selectedIndex] == null) {
@@ -403,7 +403,7 @@ function LexicalPopoverMenu({
       event.stopImmediatePropagation();
       selectOptionAndCleanUp(options[selectedIndex]);
       return true;
-    }, lexical.COMMAND_PRIORITY_CRITICAL), editor.registerCommand(lexical.KEY_ENTER_COMMAND, event => {
+    }, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.KEY_ENTER_COMMAND, event => {
       if (options === null || selectedIndex === null || options[selectedIndex] == null) {
         return false;
       }
@@ -415,7 +415,7 @@ function LexicalPopoverMenu({
 
       selectOptionAndCleanUp(options[selectedIndex]);
       return true;
-    }, lexical.COMMAND_PRIORITY_CRITICAL));
+    }, lexical.COMMAND_PRIORITY_LOW));
   }, [selectOptionAndCleanUp, close, editor, options, selectedIndex, updateSelectedIndex]);
   const listItemProps = React.useMemo(() => ({
     options,

package/LexicalTypeaheadMenuPlugin.prod.js

@@ -13,9 +13,9 @@ function I(b,a){let c=getComputedStyle(b),e="absolute"===c.position;a=a?/(auto|s
 function K(b,a,c,e){let [f]=k.useLexicalComposerContext();x.useEffect(()=>{if(null!=a&&null!=b){let q=f.getRootElement(),p=null!=q?I(q,!1):document.body,g=!1,d=J(a,p),l=function(){g||(window.requestAnimationFrame(function(){c();g=!1}),g=!0);const t=J(a,p);t!==d&&(d=t,null!=e&&e(t))},r=new ResizeObserver(c);window.addEventListener("resize",c);document.addEventListener("scroll",l,{capture:!0,passive:!0});r.observe(a);return()=>{r.unobserve(a);window.removeEventListener("resize",c);document.removeEventListener("scroll",
 l)}}},[a,f,e,c,b])}let L=w.createCommand("SCROLL_TYPEAHEAD_OPTION_INTO_VIEW_COMMAND");
 function M({close:b,editor:a,anchorElementRef:c,resolution:e,options:f,menuRenderFn:q,onSelectOption:p}){let [g,d]=x.useState(null);x.useEffect(()=>{d(0)},[e.match.matchingString]);let l=x.useCallback(h=>{a.update(()=>{const m=D(a,e.match);p(h,m,b,e.match.matchingString)})},[b,a,e.match,p]),r=x.useCallback(h=>{const m=a.getRootElement();null!==m&&(m.setAttribute("aria-activedescendant","typeahead-item-"+h),d(h))},[a]);x.useEffect(()=>()=>{let h=a.getRootElement();null!==h&&h.removeAttribute("aria-activedescendant")},
-[a]);y(()=>{null===f?d(null):null===g&&r(0)},[f,g,r]);x.useEffect(()=>n.mergeRegister(a.registerCommand(L,({option:h})=>h.ref&&null!=h.ref.current?(A(h.ref.current),!0):!1,w.COMMAND_PRIORITY_LOW)),[a,r]);x.useEffect(()=>n.mergeRegister(a.registerCommand(w.KEY_ARROW_DOWN_COMMAND,h=>{if(null!==f&&f.length&&null!==g){let m=g!==f.length-1?g+1:0;r(m);let u=f[m];null!=u.ref&&u.ref.current&&a.dispatchCommand(L,{index:m,option:u});h.preventDefault();h.stopImmediatePropagation()}return!0},w.COMMAND_PRIORITY_CRITICAL),
-a.registerCommand(w.KEY_ARROW_UP_COMMAND,h=>{if(null!==f&&f.length&&null!==g){var m=0!==g?g-1:f.length-1;r(m);m=f[m];null!=m.ref&&m.ref.current&&A(m.ref.current);h.preventDefault();h.stopImmediatePropagation()}return!0},w.COMMAND_PRIORITY_CRITICAL),a.registerCommand(w.KEY_ESCAPE_COMMAND,h=>{h.preventDefault();h.stopImmediatePropagation();b();return!0},w.COMMAND_PRIORITY_CRITICAL),a.registerCommand(w.KEY_TAB_COMMAND,h=>{if(null===f||null===g||null==f[g])return!1;h.preventDefault();h.stopImmediatePropagation();
-l(f[g]);return!0},w.COMMAND_PRIORITY_CRITICAL),a.registerCommand(w.KEY_ENTER_COMMAND,h=>{if(null===f||null===g||null==f[g])return!1;null!==h&&(h.preventDefault(),h.stopImmediatePropagation());l(f[g]);return!0},w.COMMAND_PRIORITY_CRITICAL)),[l,b,a,f,g,r]);let t=x.useMemo(()=>({options:f,selectOptionAndCleanUp:l,selectedIndex:g,setHighlightedIndex:d}),[l,g,f]);return q(c,t,e.match.matchingString)}
+[a]);y(()=>{null===f?d(null):null===g&&r(0)},[f,g,r]);x.useEffect(()=>n.mergeRegister(a.registerCommand(L,({option:h})=>h.ref&&null!=h.ref.current?(A(h.ref.current),!0):!1,w.COMMAND_PRIORITY_LOW)),[a,r]);x.useEffect(()=>n.mergeRegister(a.registerCommand(w.KEY_ARROW_DOWN_COMMAND,h=>{if(null!==f&&f.length&&null!==g){let m=g!==f.length-1?g+1:0;r(m);let u=f[m];null!=u.ref&&u.ref.current&&a.dispatchCommand(L,{index:m,option:u});h.preventDefault();h.stopImmediatePropagation()}return!0},w.COMMAND_PRIORITY_LOW),
+a.registerCommand(w.KEY_ARROW_UP_COMMAND,h=>{if(null!==f&&f.length&&null!==g){var m=0!==g?g-1:f.length-1;r(m);m=f[m];null!=m.ref&&m.ref.current&&A(m.ref.current);h.preventDefault();h.stopImmediatePropagation()}return!0},w.COMMAND_PRIORITY_LOW),a.registerCommand(w.KEY_ESCAPE_COMMAND,h=>{h.preventDefault();h.stopImmediatePropagation();b();return!0},w.COMMAND_PRIORITY_LOW),a.registerCommand(w.KEY_TAB_COMMAND,h=>{if(null===f||null===g||null==f[g])return!1;h.preventDefault();h.stopImmediatePropagation();
+l(f[g]);return!0},w.COMMAND_PRIORITY_LOW),a.registerCommand(w.KEY_ENTER_COMMAND,h=>{if(null===f||null===g||null==f[g])return!1;null!==h&&(h.preventDefault(),h.stopImmediatePropagation());l(f[g]);return!0},w.COMMAND_PRIORITY_LOW)),[l,b,a,f,g,r]);let t=x.useMemo(()=>({options:f,selectOptionAndCleanUp:l,selectedIndex:g,setHighlightedIndex:d}),[l,g,f]);return q(c,t,e.match.matchingString)}
 function N(b,a,c){let [e]=k.useLexicalComposerContext(),f=x.useRef(document.createElement("div")),q=x.useCallback(()=>{const g=e.getRootElement(),d=f.current;if(null!==g&&null!==b){const {left:l,top:r,width:t,height:h}=b.getRect();d.style.top=`${r+window.pageYOffset}px`;d.style.left=`${l+window.pageXOffset}px`;d.style.height=`${h}px`;d.style.width=`${t}px`;d.isConnected||(null!=c&&(d.className=c),d.setAttribute("aria-label","Typeahead menu"),d.setAttribute("id","typeahead-menu"),d.setAttribute("role",
 "listbox"),d.style.display="block",d.style.position="absolute",document.body.append(d));f.current=d;g.setAttribute("aria-controls","typeahead-menu")}},[e,b,c]);x.useEffect(()=>{let g=e.getRootElement();if(null!==b)return q(),()=>{null!==g&&g.removeAttribute("aria-controls");let d=f.current;null!==d&&d.isConnected&&d.remove()}},[e,q,b]);let p=x.useCallback(g=>{null!==b&&(g||a(null))},[b,a]);K(b,f.current,q,p);return f}
 exports.LexicalNodeMenuPlugin=function({options:b,nodeKey:a,onClose:c,onOpen:e,onSelectOption:f,menuRenderFn:q,anchorClassName:p}){let [g]=k.useLexicalComposerContext(),[d,l]=x.useState(null);p=N(d,l,p);let r=x.useCallback(()=>{l(null);null!=c&&null!==d&&c()},[c,d]),t=x.useCallback(h=>{l(h);null!=e&&null===d&&e(h)},[e,d]);x.useEffect(()=>{a&&null==d?g.update(()=>{let h=w.$getNodeByKey(a),m=g.getElementByKey(a);if(null!=h&&null!=m){let u=h.getTextContent();F(()=>t({getRect:()=>m.getBoundingClientRect(),

package/package.json

@@ -8,29 +8,29 @@
     "rich-text"
   ],
   "license": "MIT",
-  "version": "0.6.3",
+  "version": "0.6.5",
   "dependencies": {
-    "@lexical/clipboard": "0.6.3",
-    "@lexical/code": "0.6.3",
-    "@lexical/dragon": "0.6.3",
-    "@lexical/hashtag": "0.6.3",
-    "@lexical/history": "0.6.3",
-    "@lexical/link": "0.6.3",
-    "@lexical/list": "0.6.3",
-    "@lexical/mark": "0.6.3",
-    "@lexical/markdown": "0.6.3",
-    "@lexical/overflow": "0.6.3",
-    "@lexical/plain-text": "0.6.3",
-    "@lexical/rich-text": "0.6.3",
-    "@lexical/selection": "0.6.3",
-    "@lexical/table": "0.6.3",
-    "@lexical/text": "0.6.3",
-    "@lexical/utils": "0.6.3",
-    "@lexical/yjs": "0.6.3",
+    "@lexical/clipboard": "0.6.5",
+    "@lexical/code": "0.6.5",
+    "@lexical/dragon": "0.6.5",
+    "@lexical/hashtag": "0.6.5",
+    "@lexical/history": "0.6.5",
+    "@lexical/link": "0.6.5",
+    "@lexical/list": "0.6.5",
+    "@lexical/mark": "0.6.5",
+    "@lexical/markdown": "0.6.5",
+    "@lexical/overflow": "0.6.5",
+    "@lexical/plain-text": "0.6.5",
+    "@lexical/rich-text": "0.6.5",
+    "@lexical/selection": "0.6.5",
+    "@lexical/table": "0.6.5",
+    "@lexical/text": "0.6.5",
+    "@lexical/utils": "0.6.5",
+    "@lexical/yjs": "0.6.5",
     "react-error-boundary": "^3.1.4"
   },
   "peerDependencies": {
-    "lexical": "0.6.3",
+    "lexical": "0.6.5",
     "react": ">=17.x",
     "react-dom": ">=17.x"
   },