@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&&n.top<l.bottom}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,t){let n=getComputedStyle(e);const l="absolute"===n.position,o=/(auto|scroll)/;if("fixed"===n.position)return document.body;for(let t=e;t=t.parentElement;)if(n=getComputedStyle(t),(!l||"static"!==n.position)&&o.test(n.overflow+n.overflowY+n.overflowX))return t;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=n.useRef(i?document.createElement("div"):null),d=n.useCallback((()=>{if(null===c.current||void 0===r)return;c.current.style.top=c.current.style.bottom;const e=s.getRootElement(),n=c.current,l=n.firstChild;if(null!==e&&null!==t){const{left:i,top:s,width:a,height:d}=t.getRect(),m=c.current.offsetHeight;if(n.style.top=`${s+m+3+(u?window.pageYOffset:0)}px`,n.style.left=`${i+window.pageXOffset}px`,n.style.height=`${d}px`,n.style.width=`${a}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+d&&(n.style.top=`${s-o-d+(u?window.pageYOffset:0)}px`)}n.isConnected||(f(n,o),r.append(n)),n.setAttribute("id","typeahead-menu"),c.current=n,e.setAttribute("aria-controls","typeahead-menu")}}),[s,t,u,o,r]);n.useEffect((()=>{const e=s.getRootElement();return null!==t&&d(),()=>{null!==e&&e.removeAttribute("aria-controls");const t=c.current;null!==t&&t.isConnected&&(t.remove(),t.removeAttribute("id"))}}),[s,d,t]);const m=n.useCallback((e=>{null!==t&&(e||l(null))}),[t,l]);a(t,c.current,d,m);const p=c.current;return null!=p&&(f(p,o),null!=r&&r.append(p)),c}(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{constructor(e){this.key=e,this.ref={current:null},this.setRefElement=this.setRefElement.bind(this)}setRefElement(e){this.ref={current:e}}};