@lexical/react/LexicalNodeMenuPlugin.prod.js

This package provides Lexical components and hooks for React applications.

/**
 * Copyright (c) Meta Platforms, Inc. and affiliates.
 *
 * 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"),t=require("lexical"),n=require("react"),l=require("@lexical/utils"),o=require("react/jsx-runtime");const r="startTransition";const i="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement,u=i?n.useLayoutEffect:n.useEffect;const s=e=>{const t=document.getElementById("typeahead-menu");if(!t)return;const n=t.getBoundingClientRect();n.top+n.height>window.innerHeight&&t.scrollIntoView({block:"center"}),n.top<0&&t.scrollIntoView({block:"center"}),e.scrollIntoView({block:"nearest"})};function c(e,t){const n=e.getBoundingClientRect(),l=t.getBoundingClientRect();return n.top>=l.top-6&&n.top<=l.bottom+6}function a(t,l,o,r){const[i]=e.useLexicalComposerContext();n.useEffect(()=>{if(null!=l&&null!=t){const e=i.getRootElement(),t=null!=e?function(e){let t=getComputedStyle(e);const n="absolute"===t.position,l=/(auto|scroll)/;if("fixed"===t.position)return document.body;for(let o=e;o=o.parentElement;)if(t=getComputedStyle(o),(!n||"static"!==t.position)&&l.test(t.overflow+t.overflowY+t.overflowX))return o;return document.body}(e):document.body;let n=!1,u=c(l,t);const s=function(){n||(window.requestAnimationFrame(function(){o(),n=!1}),n=!0);const e=c(l,t);e!==u&&(u=e,null!=r&&r(e))},a=new ResizeObserver(o);return window.addEventListener("resize",o),document.addEventListener("scroll",s,{capture:!0,passive:!0}),a.observe(l),()=>{a.unobserve(l),window.removeEventListener("resize",o),document.removeEventListener("scroll",s,!0)}}},[l,i,r,o,t])}const d=t.createCommand("SCROLL_TYPEAHEAD_OPTION_INTO_VIEW_COMMAND");function m({close:e,editor:o,anchorElementRef:r,resolution:i,options:c,menuRenderFn:a,onSelectOption:m,shouldSplitNodeWithQuery:f=!1,commandPriority:p=t.COMMAND_PRIORITY_LOW,preselectFirstItem:g=!0}){const[h,C]=n.useState(null),E=i.match&&i.match.matchingString;n.useEffect(()=>{g&&C(0)},[E,g]);const y=n.useCallback(n=>{o.update(()=>{const l=null!=i.match&&f?function(e){const n=t.$getSelection();if(!t.$isRangeSelection(n)||!n.isCollapsed())return null;const l=n.anchor;if("text"!==l.type)return null;const o=l.getNode();if(!o.isSimpleText())return null;const r=l.offset,i=o.getTextContent().slice(0,r),u=e.replaceableString.length,s=r-function(e,t,n){let l=n;for(let n=l;n<=t.length;n++)e.slice(-n)===t.substring(0,n)&&(l=n);return l}(i,e.matchingString,u);if(s<0)return null;let c;return 0===s?[c]=o.splitText(r):[,c]=o.splitText(s,r),c}(i.match):null;m(n,l,e,i.match?i.match.matchingString:"")})},[o,f,i.match,m,e]),b=n.useCallback(e=>{const t=o.getRootElement();null!==t&&(t.setAttribute("aria-activedescendant","typeahead-item-"+e),C(e))},[o]);n.useEffect(()=>()=>{const e=o.getRootElement();null!==e&&e.removeAttribute("aria-activedescendant")},[o]),u(()=>{null===c?C(null):null===h&&g&&b(0)},[c,h,b,g]),n.useEffect(()=>l.mergeRegister(o.registerCommand(d,({option:e})=>!(!e.ref||null==e.ref.current)&&(s(e.ref.current),!0),p)),[o,b,p]),n.useEffect(()=>l.mergeRegister(o.registerCommand(t.KEY_ARROW_DOWN_COMMAND,e=>{const t=e;if(null!==c&&c.length){const e=null===h?0:h!==c.length-1?h+1:0;b(e);const n=c[e];null!=n.ref&&n.ref.current&&o.dispatchCommand(d,{index:e,option:n}),t.preventDefault(),t.stopImmediatePropagation()}return!0},p),o.registerCommand(t.KEY_ARROW_UP_COMMAND,e=>{const t=e;if(null!==c&&c.length){const e=null===h?c.length-1:0!==h?h-1:c.length-1;b(e);const n=c[e];null!=n.ref&&n.ref.current&&s(n.ref.current),t.preventDefault(),t.stopImmediatePropagation()}return!0},p),o.registerCommand(t.KEY_ESCAPE_COMMAND,t=>{const n=t;return n.preventDefault(),n.stopImmediatePropagation(),e(),!0},p),o.registerCommand(t.KEY_TAB_COMMAND,e=>{const t=e;return null!==c&&null!==h&&null!=c[h]&&(t.preventDefault(),t.stopImmediatePropagation(),y(c[h]),!0)},p),o.registerCommand(t.KEY_ENTER_COMMAND,e=>null!==c&&null!==h&&null!=c[h]&&(null!==e&&(e.preventDefault(),e.stopImmediatePropagation()),y(c[h]),!0),p)),[y,e,o,c,h,b,p]);return a(r,n.useMemo(()=>({options:c,selectOptionAndCleanUp:y,selectedIndex:h,setHighlightedIndex:C}),[y,h,c]),i.match?i.match.matchingString:"")}function f(e,t){null!=t&&(e.className=t),e.setAttribute("aria-label","Typeahead menu"),e.setAttribute("role","listbox"),e.style.display="block",e.style.position="absolute"}exports.LexicalNodeMenuPlugin=function({options:l,nodeKey:u,onClose:s,onOpen:c,onSelectOption:d,menuRenderFn:p,anchorClassName:g,commandPriority:h=t.COMMAND_PRIORITY_LOW,parent:C}){const[E]=e.useLexicalComposerContext(),[y,b]=n.useState(null),R=function(t,l,o,r=(i?document.body:void 0),u=!0){const[s]=e.useLexicalComposerContext(),c=i?document.createElement("div"):null,d=n.useRef(c),m=n.useCallback(()=>{if(null===d.current||void 0===r)return;d.current.style.top=d.current.style.bottom;const e=s.getRootElement(),n=d.current,l=n.firstChild;if(null!==e&&null!==t){const{left:i,top:s,width:c,height:a}=t.getRect(),m=d.current.offsetHeight;if(n.style.top=`${s+m+3+(u?window.pageYOffset:0)}px`,n.style.left=`${i+window.pageXOffset}px`,n.style.height=`${a}px`,n.style.width=`${c}px`,null!==l){l.style.top=`${s}`;const t=l.getBoundingClientRect(),o=t.height,r=t.width,c=e.getBoundingClientRect();i+r>c.right&&(n.style.left=`${c.right-r+window.pageXOffset}px`),(s+o>window.innerHeight||s+o>c.bottom)&&s-c.top>o+a&&(n.style.top=`${s-o-a+(u?window.pageYOffset:0)}px`)}n.isConnected||(f(n,o),r.append(n)),n.setAttribute("id","typeahead-menu"),e.setAttribute("aria-controls","typeahead-menu")}},[s,t,u,o,r]);n.useEffect(()=>{const e=s.getRootElement();return null!==t&&m(),()=>{null!==e&&e.removeAttribute("aria-controls");const t=d.current;null!==t&&t.isConnected&&(t.remove(),t.removeAttribute("id"))}},[s,m,t]);const p=n.useCallback(e=>{null!==t&&(e||l(null))},[t,l]);return a(t,d.current,m,p),null!=c&&c===d.current&&(f(c,o),null!=r&&r.append(c)),d}(y,b,g,C),w=n.useCallback(()=>{b(null),null!=s&&null!==y&&s()},[s,y]),x=n.useCallback(e=>{b(e),null!=c&&null===y&&c(e)},[c,y]),v=n.useCallback(()=>{u?E.update(()=>{const e=t.$getNodeByKey(u),l=E.getElementByKey(u);var o;null!=e&&null!=l&&null==y&&(o=()=>x({getRect:()=>l.getBoundingClientRect()}),r in n?n[r](o):o())}):null==u&&null!=y&&w()},[w,E,u,x,y]);return n.useEffect(()=>{v()},[v,u]),n.useEffect(()=>{if(null!=u)return E.registerUpdateListener(({dirtyElements:e})=>{e.get(u)&&v()})},[E,v,u]),null===R.current||null===y||null===E?null:o.jsx(m,{close:w,resolution:y,editor:E,anchorElementRef:R,options:l,menuRenderFn:p,onSelectOption:d,commandPriority:h})},exports.MenuOption=class{key;ref;constructor(e){this.key=e,this.ref={current:null},this.setRefElement=this.setRefElement.bind(this)}setRefElement(e){this.ref={current:e}}};