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