@lexical/react 0.14.3 → 0.14.5

package/LexicalTreeView.dev.mjs

@@ -4,14 +4,10 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import { $generateHtmlFromNodes } from '@lexical/html';
-import { $isLinkNode } from '@lexical/link';
-import { $isMarkNode } from '@lexical/mark';
-import { $isTableSelection } from '@lexical/table';
+import { useLexicalCommandsLog, TreeView as TreeView$1, generateContent } from '@lexical/devtools-core';
 import { mergeRegister } from '@lexical/utils';
-import { COMMAND_PRIORITY_HIGH, $getSelection, $getRoot, $isRangeSelection, $isElementNode, $isNodeSelection, $isTextNode } from 'lexical';
 import * as React from 'react';
-import { useState, useRef, useMemo, useCallback, useEffect } from 'react';
+import { useState, useEffect } from 'react';
 
 /**
  * Copyright (c) Meta Platforms, Inc. and affiliates.
@@ -20,19 +16,6 @@ import { useState, useRef, useMemo, useCallback, useEffect } from 'react';
  * LICENSE file in the root directory of this source tree.
  *
  */
-const NON_SINGLE_WIDTH_CHARS_REPLACEMENT = Object.freeze({
-  '\t': '\\t',
-  '\n': '\\n'
-});
-const NON_SINGLE_WIDTH_CHARS_REGEX = new RegExp(Object.keys(NON_SINGLE_WIDTH_CHARS_REPLACEMENT).join('|'), 'g');
-const SYMBOLS = Object.freeze({
-  ancestorHasNextSibling: '|',
-  ancestorIsLastChild: ' ',
-  hasNextSibling: '├',
-  isLastChild: '└',
-  selectedChar: '^',
-  selectedLine: '>'
-});
 function TreeView({
   treeTypeButtonClassName,
   timeTravelButtonClassName,
@@ -42,78 +25,18 @@ function TreeView({
   timeTravelPanelClassName,
   editor
 }) {
-  const [timeStampedEditorStates, setTimeStampedEditorStates] = useState([]);
-  const [content, setContent] = useState('');
-  const [timeTravelEnabled, setTimeTravelEnabled] = useState(false);
-  const [showExportDOM, setShowExportDOM] = useState(false);
-  const playingIndexRef = useRef(0);
-  const treeElementRef = useRef(null);
-  const inputRef = useRef(null);
-  const [isPlaying, setIsPlaying] = useState(false);
-  const [isLimited, setIsLimited] = useState(false);
-  const [showLimited, setShowLimited] = useState(false);
-  const lastEditorStateRef = useRef(null);
+  const treeElementRef = /*#__PURE__*/React.createRef();
+  const [editorCurrentState, setEditorCurrentState] = useState(editor.getEditorState());
   const commandsLog = useLexicalCommandsLog(editor);
-  const generateTree = useCallback(editorState => {
-    const treeText = generateContent(editor, commandsLog, showExportDOM);
-    setContent(treeText);
-    if (!timeTravelEnabled) {
-      setTimeStampedEditorStates(currentEditorStates => [...currentEditorStates, [Date.now(), editorState]]);
-    }
-  }, [commandsLog, editor, timeTravelEnabled, showExportDOM]);
-  useEffect(() => {
-    const editorState = editor.getEditorState();
-    if (!showLimited && editorState._nodeMap.size < 1000) {
-      setContent(generateContent(editor, commandsLog, showExportDOM));
-    }
-  }, [commandsLog, editor, showLimited, showExportDOM]);
   useEffect(() => {
     return mergeRegister(editor.registerUpdateListener(({
       editorState
     }) => {
-      if (!showLimited && editorState._nodeMap.size > 1000) {
-        lastEditorStateRef.current = editorState;
-        setIsLimited(true);
-        if (!showLimited) {
-          return;
-        }
-      }
-      generateTree(editorState);
+      setEditorCurrentState(editorState);
     }), editor.registerEditableListener(() => {
-      const treeText = generateContent(editor, commandsLog, showExportDOM);
-      setContent(treeText);
+      setEditorCurrentState(editor.getEditorState());
     }));
-  }, [commandsLog, editor, showExportDOM, isLimited, generateTree, showLimited]);
-  const totalEditorStates = timeStampedEditorStates.length;
-  useEffect(() => {
-    if (isPlaying) {
-      let timeoutId;
-      const play = () => {
-        const currentIndex = playingIndexRef.current;
-        if (currentIndex === totalEditorStates - 1) {
-          setIsPlaying(false);
-          return;
-        }
-        const currentTime = timeStampedEditorStates[currentIndex][0];
-        const nextTime = timeStampedEditorStates[currentIndex + 1][0];
-        const timeDiff = nextTime - currentTime;
-        timeoutId = setTimeout(() => {
-          playingIndexRef.current++;
-          const index = playingIndexRef.current;
-          const input = inputRef.current;
-          if (input !== null) {
-            input.value = String(index);
-          }
-          editor.setEditorState(timeStampedEditorStates[index][1]);
-          play();
-        }, timeDiff);
-      };
-      play();
-      return () => {
-        clearTimeout(timeoutId);
-      };
-    }
-  }, [timeStampedEditorStates, isPlaying, editor, totalEditorStates]);
+  }, [editor]);
   useEffect(() => {
     const element = treeElementRef.current;
     if (element !== null) {
@@ -124,360 +47,29 @@ function TreeView({
         element.__lexicalEditor = null;
       };
     }
-  }, [editor]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: viewClassName
-  }, !showLimited && isLimited ? /*#__PURE__*/React.createElement("div", {
-    style: {
-      padding: 20
-    }
-  }, /*#__PURE__*/React.createElement("span", {
-    style: {
-      marginRight: 20
-    }
-  }, "Detected large EditorState, this can impact debugging performance."), /*#__PURE__*/React.createElement("button", {
-    onClick: () => {
-      setShowLimited(true);
-      const editorState = lastEditorStateRef.current;
-      if (editorState !== null) {
-        lastEditorStateRef.current = null;
-        generateTree(editorState);
-      }
-    },
-    style: {
-      background: 'transparent',
-      border: '1px solid white',
-      color: 'white',
-      cursor: 'pointer',
-      padding: 5
+  }, [editor, treeElementRef]);
+  const handleEditorReadOnly = isReadonly => {
+    const rootElement = editor.getRootElement();
+    if (rootElement == null) {
+      return;
     }
-  }, "Show full tree")) : null, !showLimited ? /*#__PURE__*/React.createElement("button", {
-    onClick: () => setShowExportDOM(!showExportDOM),
-    className: treeTypeButtonClassName,
-    type: "button"
-  }, showExportDOM ? 'Tree' : 'Export DOM') : null, !timeTravelEnabled && (showLimited || !isLimited) && totalEditorStates > 2 && /*#__PURE__*/React.createElement("button", {
-    onClick: () => {
-      const rootElement = editor.getRootElement();
-      if (rootElement !== null) {
-        rootElement.contentEditable = 'false';
-        playingIndexRef.current = totalEditorStates - 1;
-        setTimeTravelEnabled(true);
-      }
+    rootElement.contentEditable = isReadonly ? 'false' : 'true';
+  };
+  return /*#__PURE__*/React.createElement(TreeView$1, {
+    treeTypeButtonClassName: treeTypeButtonClassName,
+    timeTravelButtonClassName: timeTravelButtonClassName,
+    timeTravelPanelSliderClassName: timeTravelPanelSliderClassName,
+    timeTravelPanelButtonClassName: timeTravelPanelButtonClassName,
+    viewClassName: viewClassName,
+    timeTravelPanelClassName: timeTravelPanelClassName,
+    setEditorReadOnly: handleEditorReadOnly,
+    editorState: editorCurrentState,
+    setEditorState: state => editor.setEditorState(state),
+    generateContent: async function (exportDOM) {
+      return generateContent(editor, commandsLog, exportDOM);
     },
-    className: timeTravelButtonClassName,
-    type: "button"
-  }, "Time Travel"), (showLimited || !isLimited) && /*#__PURE__*/React.createElement("pre", {
     ref: treeElementRef
-  }, content), timeTravelEnabled && (showLimited || !isLimited) && /*#__PURE__*/React.createElement("div", {
-    className: timeTravelPanelClassName
-  }, /*#__PURE__*/React.createElement("button", {
-    className: timeTravelPanelButtonClassName,
-    onClick: () => {
-      if (playingIndexRef.current === totalEditorStates - 1) {
-        playingIndexRef.current = 1;
-      }
-      setIsPlaying(!isPlaying);
-    },
-    type: "button"
-  }, isPlaying ? 'Pause' : 'Play'), /*#__PURE__*/React.createElement("input", {
-    className: timeTravelPanelSliderClassName,
-    ref: inputRef,
-    onChange: event => {
-      const editorStateIndex = Number(event.target.value);
-      const timeStampedEditorState = timeStampedEditorStates[editorStateIndex];
-      if (timeStampedEditorState) {
-        playingIndexRef.current = editorStateIndex;
-        editor.setEditorState(timeStampedEditorState[1]);
-      }
-    },
-    type: "range",
-    min: "1",
-    max: totalEditorStates - 1
-  }), /*#__PURE__*/React.createElement("button", {
-    className: timeTravelPanelButtonClassName,
-    onClick: () => {
-      const rootElement = editor.getRootElement();
-      if (rootElement !== null) {
-        rootElement.contentEditable = 'true';
-        const index = timeStampedEditorStates.length - 1;
-        const timeStampedEditorState = timeStampedEditorStates[index];
-        editor.setEditorState(timeStampedEditorState[1]);
-        const input = inputRef.current;
-        if (input !== null) {
-          input.value = String(index);
-        }
-        setTimeTravelEnabled(false);
-        setIsPlaying(false);
-      }
-    },
-    type: "button"
-  }, "Exit")));
-}
-function useLexicalCommandsLog(editor) {
-  const [loggedCommands, setLoggedCommands] = useState([]);
-  useEffect(() => {
-    const unregisterCommandListeners = new Set();
-    for (const [command] of editor._commands) {
-      unregisterCommandListeners.add(editor.registerCommand(command, payload => {
-        setLoggedCommands(state => {
-          const newState = [...state];
-          newState.push({
-            payload,
-            type: command.type ? command.type : 'UNKNOWN'
-          });
-          if (newState.length > 10) {
-            newState.shift();
-          }
-          return newState;
-        });
-        return false;
-      }, COMMAND_PRIORITY_HIGH));
-    }
-    return () => unregisterCommandListeners.forEach(unregister => unregister());
-  }, [editor]);
-  return useMemo(() => loggedCommands, [loggedCommands]);
-}
-function printRangeSelection(selection) {
-  let res = '';
-  const formatText = printFormatProperties(selection);
-  res += `: range ${formatText !== '' ? `{ ${formatText} }` : ''} ${selection.style !== '' ? `{ style: ${selection.style} } ` : ''}`;
-  const anchor = selection.anchor;
-  const focus = selection.focus;
-  const anchorOffset = anchor.offset;
-  const focusOffset = focus.offset;
-  res += `\n  ├ anchor { key: ${anchor.key}, offset: ${anchorOffset === null ? 'null' : anchorOffset}, type: ${anchor.type} }`;
-  res += `\n  └ focus { key: ${focus.key}, offset: ${focusOffset === null ? 'null' : focusOffset}, type: ${focus.type} }`;
-  return res;
-}
-function printNodeSelection(selection) {
-  if (!$isNodeSelection(selection)) {
-    return '';
-  }
-  return `: node\n  └ [${Array.from(selection._nodes).join(', ')}]`;
-}
-function printTableSelection(selection) {
-  return `: table\n  └ { table: ${selection.tableKey}, anchorCell: ${selection.anchor.key}, focusCell: ${selection.focus.key} }`;
-}
-function generateContent(editor, commandsLog, exportDOM) {
-  const editorState = editor.getEditorState();
-  const editorConfig = editor._config;
-  const compositionKey = editor._compositionKey;
-  const editable = editor._editable;
-  if (exportDOM) {
-    let htmlString = '';
-    editorState.read(() => {
-      htmlString = printPrettyHTML($generateHtmlFromNodes(editor));
-    });
-    return htmlString;
-  }
-  let res = ' root\n';
-  const selectionString = editorState.read(() => {
-    const selection = $getSelection();
-    visitTree($getRoot(), (node, indent) => {
-      const nodeKey = node.getKey();
-      const nodeKeyDisplay = `(${nodeKey})`;
-      const typeDisplay = node.getType() || '';
-      const isSelected = node.isSelected();
-      const idsDisplay = $isMarkNode(node) ? ` id: [ ${node.getIDs().join(', ')} ] ` : '';
-      res += `${isSelected ? SYMBOLS.selectedLine : ' '} ${indent.join(' ')} ${nodeKeyDisplay} ${typeDisplay} ${idsDisplay} ${printNode(node)}\n`;
-      res += printSelectedCharsLine({
-        indent,
-        isSelected,
-        node,
-        nodeKeyDisplay,
-        selection,
-        typeDisplay
-      });
-    });
-    return selection === null ? ': null' : $isRangeSelection(selection) ? printRangeSelection(selection) : $isTableSelection(selection) ? printTableSelection(selection) : printNodeSelection(selection);
-  });
-  res += '\n selection' + selectionString;
-  res += '\n\n commands:';
-  if (commandsLog.length) {
-    for (const {
-      type,
-      payload
-    } of commandsLog) {
-      res += `\n  └ { type: ${type}, payload: ${payload instanceof Event ? payload.constructor.name : payload} }`;
-    }
-  } else {
-    res += '\n  └ None dispatched.';
-  }
-  res += '\n\n editor:';
-  res += `\n  └ namespace ${editorConfig.namespace}`;
-  if (compositionKey !== null) {
-    res += `\n  └ compositionKey ${compositionKey}`;
-  }
-  res += `\n  └ editable ${String(editable)}`;
-  return res;
-}
-function visitTree(currentNode, visitor, indent = []) {
-  const childNodes = currentNode.getChildren();
-  const childNodesLength = childNodes.length;
-  childNodes.forEach((childNode, i) => {
-    visitor(childNode, indent.concat(i === childNodesLength - 1 ? SYMBOLS.isLastChild : SYMBOLS.hasNextSibling));
-    if ($isElementNode(childNode)) {
-      visitTree(childNode, visitor, indent.concat(i === childNodesLength - 1 ? SYMBOLS.ancestorIsLastChild : SYMBOLS.ancestorHasNextSibling));
-    }
   });
 }
-function normalize(text) {
-  return Object.entries(NON_SINGLE_WIDTH_CHARS_REPLACEMENT).reduce((acc, [key, value]) => acc.replace(new RegExp(key, 'g'), String(value)), text);
-}
-
-// TODO Pass via props to allow customizability
-function printNode(node) {
-  if ($isTextNode(node)) {
-    const text = node.getTextContent();
-    const title = text.length === 0 ? '(empty)' : `"${normalize(text)}"`;
-    const properties = printAllTextNodeProperties(node);
-    return [title, properties.length !== 0 ? `{ ${properties} }` : null].filter(Boolean).join(' ').trim();
-  } else if ($isLinkNode(node)) {
-    const link = node.getURL();
-    const title = link.length === 0 ? '(empty)' : `"${normalize(link)}"`;
-    const properties = printAllLinkNodeProperties(node);
-    return [title, properties.length !== 0 ? `{ ${properties} }` : null].filter(Boolean).join(' ').trim();
-  } else {
-    return '';
-  }
-}
-const FORMAT_PREDICATES = [node => node.hasFormat('bold') && 'Bold', node => node.hasFormat('code') && 'Code', node => node.hasFormat('italic') && 'Italic', node => node.hasFormat('strikethrough') && 'Strikethrough', node => node.hasFormat('subscript') && 'Subscript', node => node.hasFormat('superscript') && 'Superscript', node => node.hasFormat('underline') && 'Underline'];
-const DETAIL_PREDICATES = [node => node.isDirectionless() && 'Directionless', node => node.isUnmergeable() && 'Unmergeable'];
-const MODE_PREDICATES = [node => node.isToken() && 'Token', node => node.isSegmented() && 'Segmented'];
-function printAllTextNodeProperties(node) {
-  return [printFormatProperties(node), printDetailProperties(node), printModeProperties(node)].filter(Boolean).join(', ');
-}
-function printAllLinkNodeProperties(node) {
-  return [printTargetProperties(node), printRelProperties(node), printTitleProperties(node)].filter(Boolean).join(', ');
-}
-function printDetailProperties(nodeOrSelection) {
-  let str = DETAIL_PREDICATES.map(predicate => predicate(nodeOrSelection)).filter(Boolean).join(', ').toLocaleLowerCase();
-  if (str !== '') {
-    str = 'detail: ' + str;
-  }
-  return str;
-}
-function printModeProperties(nodeOrSelection) {
-  let str = MODE_PREDICATES.map(predicate => predicate(nodeOrSelection)).filter(Boolean).join(', ').toLocaleLowerCase();
-  if (str !== '') {
-    str = 'mode: ' + str;
-  }
-  return str;
-}
-function printFormatProperties(nodeOrSelection) {
-  let str = FORMAT_PREDICATES.map(predicate => predicate(nodeOrSelection)).filter(Boolean).join(', ').toLocaleLowerCase();
-  if (str !== '') {
-    str = 'format: ' + str;
-  }
-  return str;
-}
-function printTargetProperties(node) {
-  let str = node.getTarget();
-  // TODO Fix nullish on LinkNode
-  if (str != null) {
-    str = 'target: ' + str;
-  }
-  return str;
-}
-function printRelProperties(node) {
-  let str = node.getRel();
-  // TODO Fix nullish on LinkNode
-  if (str != null) {
-    str = 'rel: ' + str;
-  }
-  return str;
-}
-function printTitleProperties(node) {
-  let str = node.getTitle();
-  // TODO Fix nullish on LinkNode
-  if (str != null) {
-    str = 'title: ' + str;
-  }
-  return str;
-}
-function printSelectedCharsLine({
-  indent,
-  isSelected,
-  node,
-  nodeKeyDisplay,
-  selection,
-  typeDisplay
-}) {
-  // No selection or node is not selected.
-  if (!$isTextNode(node) || !$isRangeSelection(selection) || !isSelected || $isElementNode(node)) {
-    return '';
-  }
-
-  // No selected characters.
-  const anchor = selection.anchor;
-  const focus = selection.focus;
-  if (node.getTextContent() === '' || anchor.getNode() === selection.focus.getNode() && anchor.offset === focus.offset) {
-    return '';
-  }
-  const [start, end] = $getSelectionStartEnd(node, selection);
-  if (start === end) {
-    return '';
-  }
-  const selectionLastIndent = indent[indent.length - 1] === SYMBOLS.hasNextSibling ? SYMBOLS.ancestorHasNextSibling : SYMBOLS.ancestorIsLastChild;
-  const indentionChars = [...indent.slice(0, indent.length - 1), selectionLastIndent];
-  const unselectedChars = Array(start + 1).fill(' ');
-  const selectedChars = Array(end - start).fill(SYMBOLS.selectedChar);
-  const paddingLength = typeDisplay.length + 3; // 2 for the spaces around + 1 for the double quote.
-
-  const nodePrintSpaces = Array(nodeKeyDisplay.length + paddingLength).fill(' ');
-  return [SYMBOLS.selectedLine, indentionChars.join(' '), [...nodePrintSpaces, ...unselectedChars, ...selectedChars].join('')].join(' ') + '\n';
-}
-function printPrettyHTML(str) {
-  const div = document.createElement('div');
-  div.innerHTML = str.trim();
-  return prettifyHTML(div, 0).innerHTML;
-}
-function prettifyHTML(node, level) {
-  const indentBefore = new Array(level++ + 1).join('  ');
-  const indentAfter = new Array(level - 1).join('  ');
-  let textNode;
-  for (let i = 0; i < node.children.length; i++) {
-    textNode = document.createTextNode('\n' + indentBefore);
-    node.insertBefore(textNode, node.children[i]);
-    prettifyHTML(node.children[i], level);
-    if (node.lastElementChild === node.children[i]) {
-      textNode = document.createTextNode('\n' + indentAfter);
-      node.appendChild(textNode);
-    }
-  }
-  return node;
-}
-function $getSelectionStartEnd(node, selection) {
-  const anchorAndFocus = selection.getStartEndPoints();
-  if ($isNodeSelection(selection) || anchorAndFocus === null) {
-    return [-1, -1];
-  }
-  const [anchor, focus] = anchorAndFocus;
-  const textContent = node.getTextContent();
-  const textLength = textContent.length;
-  let start = -1;
-  let end = -1;
-
-  // Only one node is being selected.
-  if (anchor.type === 'text' && focus.type === 'text') {
-    const anchorNode = anchor.getNode();
-    const focusNode = focus.getNode();
-    if (anchorNode === focusNode && node === anchorNode && anchor.offset !== focus.offset) {
-      [start, end] = anchor.offset < focus.offset ? [anchor.offset, focus.offset] : [focus.offset, anchor.offset];
-    } else if (node === anchorNode) {
-      [start, end] = anchorNode.isBefore(focusNode) ? [anchor.offset, textLength] : [0, anchor.offset];
-    } else if (node === focusNode) {
-      [start, end] = focusNode.isBefore(anchorNode) ? [focus.offset, textLength] : [0, focus.offset];
-    } else {
-      // Node is within selection but not the anchor nor focus.
-      [start, end] = [0, textLength];
-    }
-  }
-
-  // Account for non-single width characters.
-  const numNonSingleWidthCharBeforeSelection = (textContent.slice(0, start).match(NON_SINGLE_WIDTH_CHARS_REGEX) || []).length;
-  const numNonSingleWidthCharInSelection = (textContent.slice(start, end).match(NON_SINGLE_WIDTH_CHARS_REGEX) || []).length;
-  return [start + numNonSingleWidthCharBeforeSelection, end + numNonSingleWidthCharBeforeSelection + numNonSingleWidthCharInSelection];
-}
 
 export { TreeView };

package/LexicalTreeView.prod.js

@@ -4,20 +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 g=require("@lexical/html"),v=require("@lexical/link"),x=require("@lexical/mark"),I=require("@lexical/table"),M=require("@lexical/utils"),N=require("lexical"),O=require("react");let P=Object.freeze({"\t":"\\t","\n":"\\n"}),Q=new RegExp(Object.keys(P).join("|"),"g"),R=Object.freeze({ancestorHasNextSibling:"|",ancestorIsLastChild:" ",hasNextSibling:"\u251c",isLastChild:"\u2514",selectedChar:"^",selectedLine:">"});
-function U(a){let [b,c]=O.useState([]);O.useEffect(()=>{let m=new Set;for(let [d]of a._commands)m.add(a.registerCommand(d,p=>{c(e=>{e=[...e];e.push({payload:p,type:d.type?d.type:"UNKNOWN"});10<e.length&&e.shift();return e});return!1},N.COMMAND_PRIORITY_HIGH));return()=>m.forEach(d=>d())},[a]);return O.useMemo(()=>b,[b])}
-function aa(a){let b="";var c=V(a);b+=`: range ${""!==c?`{ ${c} }`:""} ${""!==a.style?`{ style: ${a.style} } `:""}`;c=a.anchor;a=a.focus;let m=c.offset,d=a.offset;b+=`\n  \u251c anchor { key: ${c.key}, offset: ${null===m?"null":m}, type: ${c.type} }`;return b+=`\n  \u2514 focus { key: ${a.key}, offset: ${null===d?"null":d}, type: ${a.type} }`}function ba(a){return N.$isNodeSelection(a)?`: node\n  \u2514 [${Array.from(a._nodes).join(", ")}]`:""}
-function W(a,b,c){let m=a.getEditorState(),d=a._config,p=a._compositionKey,e=a._editable;if(c){let l="";m.read(()=>{var k=g.$generateHtmlFromNodes(a);let t=document.createElement("div");t.innerHTML=k.trim();l=X(t,0).innerHTML});return l}let h=" root\n";c=m.read(()=>{const l=N.$getSelection();Y(N.$getRoot(),(k,t)=>{const y=`(${k.getKey()})`,w=k.getType()||"",q=k.isSelected(),J=x.$isMarkNode(k)?` id: [ ${k.getIDs().join(", ")} ] `:"";var A=h,H=q?R.selectedLine:" ",F=t.join(" ");if(N.$isTextNode(k)){var n=
-k.getTextContent();var u=0===n.length?"(empty)":`"${Z(n)}"`;n=[V(k),ca(k),da(k)].filter(Boolean).join(", ");n=[u,0!==n.length?`{ ${n} }`:null].filter(Boolean).join(" ").trim()}else if(v.$isLinkNode(k)){n=k.getURL();n=0===n.length?"(empty)":`"${Z(n)}"`;u=k.getTarget();null!=u&&(u="target: "+u);var B=Boolean;var C=k.getRel();null!=C&&(C="rel: "+C);let r=k.getTitle();null!=r&&(r="title: "+r);u=[u,C,r].filter(B).join(", ");n=[n,0!==u.length?`{ ${u} }`:null].filter(Boolean).join(" ").trim()}else n="";
-h=A+`${H} ${F} ${y} ${w} ${J} ${n}\n`;h+=ea({indent:t,isSelected:q,node:k,nodeKeyDisplay:y,selection:l,typeDisplay:w})});return null===l?": null":N.$isRangeSelection(l)?aa(l):I.$isTableSelection(l)?`: table\n  \u2514 { table: ${l.tableKey}, anchorCell: ${l.anchor.key}, focusCell: ${l.focus.key} }`:ba(l)});h+="\n selection"+c;h+="\n\n commands:";if(b.length)for(let {type:l,payload:k}of b)h+=`\n  \u2514 { type: ${l}, payload: ${k instanceof Event?k.constructor.name:k} }`;else h+="\n  \u2514 None dispatched.";
-h+="\n\n editor:";h+=`\n  \u2514 namespace ${d.namespace}`;null!==p&&(h+=`\n  \u2514 compositionKey ${p}`);return h+=`\n  \u2514 editable ${String(e)}`}function Y(a,b,c=[]){a=a.getChildren();let m=a.length;a.forEach((d,p)=>{b(d,c.concat(p===m-1?R.isLastChild:R.hasNextSibling));N.$isElementNode(d)&&Y(d,b,c.concat(p===m-1?R.ancestorIsLastChild:R.ancestorHasNextSibling))})}function Z(a){return Object.entries(P).reduce((b,[c,m])=>b.replace(new RegExp(c,"g"),String(m)),a)}
-let fa=[a=>a.hasFormat("bold")&&"Bold",a=>a.hasFormat("code")&&"Code",a=>a.hasFormat("italic")&&"Italic",a=>a.hasFormat("strikethrough")&&"Strikethrough",a=>a.hasFormat("subscript")&&"Subscript",a=>a.hasFormat("superscript")&&"Superscript",a=>a.hasFormat("underline")&&"Underline"],ha=[a=>a.isDirectionless()&&"Directionless",a=>a.isUnmergeable()&&"Unmergeable"],ia=[a=>a.isToken()&&"Token",a=>a.isSegmented()&&"Segmented"];
-function ca(a){let b=ha.map(c=>c(a)).filter(Boolean).join(", ").toLocaleLowerCase();""!==b&&(b="detail: "+b);return b}function da(a){let b=ia.map(c=>c(a)).filter(Boolean).join(", ").toLocaleLowerCase();""!==b&&(b="mode: "+b);return b}function V(a){let b=fa.map(c=>c(a)).filter(Boolean).join(", ").toLocaleLowerCase();""!==b&&(b="format: "+b);return b}
-function ea({indent:a,isSelected:b,node:c,nodeKeyDisplay:m,selection:d,typeDisplay:p}){if(!N.$isTextNode(c)||!N.$isRangeSelection(d)||!b||N.$isElementNode(c))return"";b=d.anchor;var e=d.focus;if(""===c.getTextContent()||b.getNode()===d.focus.getNode()&&b.offset===e.offset)return"";b=d.getStartEndPoints();if(N.$isNodeSelection(d)||null===b)c=[-1,-1];else{var [h,l]=b;e=c.getTextContent();var k=e.length;b=d=-1;if("text"===h.type&&"text"===l.type){let w=h.getNode(),q=l.getNode();w===q&&c===w&&h.offset!==
-l.offset?[d,b]=h.offset<l.offset?[h.offset,l.offset]:[l.offset,h.offset]:c===w?[d,b]=w.isBefore(q)?[h.offset,k]:[0,h.offset]:c===q?[d,b]=q.isBefore(w)?[l.offset,k]:[0,l.offset]:[d,b]=[0,k]}c=(e.slice(0,d).match(Q)||[]).length;e=(e.slice(d,b).match(Q)||[]).length;c=[d+c,b+c+e]}let [t,y]=c;if(t===y)return"";c=a[a.length-1]===R.hasNextSibling?R.ancestorHasNextSibling:R.ancestorIsLastChild;a=[...a.slice(0,a.length-1),c];c=Array(t+1).fill(" ");d=Array(y-t).fill(R.selectedChar);m=Array(m.length+(p.length+
-3)).fill(" ");return[R.selectedLine,a.join(" "),[...m,...c,...d].join("")].join(" ")+"\n"}function X(a,b){let c=Array(b++ +1).join("  "),m=Array(b-1).join("  "),d;for(let p=0;p<a.children.length;p++)d=document.createTextNode("\n"+c),a.insertBefore(d,a.children[p]),X(a.children[p],b),a.lastElementChild===a.children[p]&&(d=document.createTextNode("\n"+m),a.appendChild(d));return a}
-exports.TreeView=function({treeTypeButtonClassName:a,timeTravelButtonClassName:b,timeTravelPanelSliderClassName:c,timeTravelPanelButtonClassName:m,viewClassName:d,timeTravelPanelClassName:p,editor:e}){let [h,l]=O.useState([]),[k,t]=O.useState(""),[y,w]=O.useState(!1),[q,J]=O.useState(!1),A=O.useRef(0),H=O.useRef(null),F=O.useRef(null),[n,u]=O.useState(!1),[B,C]=O.useState(!1),[r,ja]=O.useState(!1),K=O.useRef(null),D=U(e),L=O.useCallback(f=>{const z=W(e,D,q);t(z);y||l(G=>[...G,[Date.now(),f]])},[D,
-e,y,q]);O.useEffect(()=>{let f=e.getEditorState();!r&&1E3>f._nodeMap.size&&t(W(e,D,q))},[D,e,r,q]);O.useEffect(()=>M.mergeRegister(e.registerUpdateListener(({editorState:f})=>{if(!r&&1E3<f._nodeMap.size&&(K.current=f,C(!0),!r))return;L(f)}),e.registerEditableListener(()=>{let f=W(e,D,q);t(f)})),[D,e,q,B,L,r]);let E=h.length;O.useEffect(()=>{if(n){let f,z=()=>{const G=A.current;G===E-1?u(!1):f=setTimeout(()=>{A.current++;const S=A.current,T=F.current;null!==T&&(T.value=String(S));e.setEditorState(h[S][1]);
-z()},h[G+1][0]-h[G][0])};z();return()=>{clearTimeout(f)}}},[h,n,e,E]);O.useEffect(()=>{let f=H.current;if(null!==f)return f.__lexicalEditor=e,()=>{f.__lexicalEditor=null}},[e]);return O.createElement("div",{className:d},!r&&B?O.createElement("div",{style:{padding:20}},O.createElement("span",{style:{marginRight:20}},"Detected large EditorState, this can impact debugging performance."),O.createElement("button",{onClick:()=>{ja(!0);let f=K.current;null!==f&&(K.current=null,L(f))},style:{background:"transparent",
-border:"1px solid white",color:"white",cursor:"pointer",padding:5}},"Show full tree")):null,r?null:O.createElement("button",{onClick:()=>J(!q),className:a,type:"button"},q?"Tree":"Export DOM"),!y&&(r||!B)&&2<E&&O.createElement("button",{onClick:()=>{let f=e.getRootElement();null!==f&&(f.contentEditable="false",A.current=E-1,w(!0))},className:b,type:"button"},"Time Travel"),(r||!B)&&O.createElement("pre",{ref:H},k),y&&(r||!B)&&O.createElement("div",{className:p},O.createElement("button",{className:m,
-onClick:()=>{A.current===E-1&&(A.current=1);u(!n)},type:"button"},n?"Pause":"Play"),O.createElement("input",{className:c,ref:F,onChange:f=>{f=Number(f.target.value);let z=h[f];z&&(A.current=f,e.setEditorState(z[1]))},type:"range",min:"1",max:E-1}),O.createElement("button",{className:m,onClick:()=>{var f=e.getRootElement();if(null!==f){f.contentEditable="true";f=h.length-1;e.setEditorState(h[f][1]);let z=F.current;null!==z&&(z.value=String(f));w(!1);u(!1)}},type:"button"},"Exit")))}
+'use strict';var c=require("@lexical/devtools-core"),d=require("@lexical/utils"),h=require("react");
+exports.TreeView=function({treeTypeButtonClassName:k,timeTravelButtonClassName:l,timeTravelPanelSliderClassName:m,timeTravelPanelButtonClassName:n,viewClassName:p,timeTravelPanelClassName:q,editor:a}){let e=h.createRef(),[r,f]=h.useState(a.getEditorState()),t=c.useLexicalCommandsLog(a);h.useEffect(()=>d.mergeRegister(a.registerUpdateListener(({editorState:b})=>{f(b)}),a.registerEditableListener(()=>{f(a.getEditorState())})),[a]);h.useEffect(()=>{let b=e.current;if(null!==b)return b.__lexicalEditor=
+a,()=>{b.__lexicalEditor=null}},[a,e]);return h.createElement(c.TreeView,{treeTypeButtonClassName:k,timeTravelButtonClassName:l,timeTravelPanelSliderClassName:m,timeTravelPanelButtonClassName:n,viewClassName:p,timeTravelPanelClassName:q,setEditorReadOnly:b=>{const g=a.getRootElement();null!=g&&(g.contentEditable=b?"false":"true")},editorState:r,setEditorState:b=>a.setEditorState(b),generateContent:async function(b){return c.generateContent(a,t,b)},ref:e})}

package/LexicalTreeView.prod.mjs

@@ -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.
  */
-import{$generateHtmlFromNodes as e}from"@lexical/html";import{$isLinkNode as t}from"@lexical/link";import{$isMarkNode as n}from"@lexical/mark";import{$isTableSelection as o}from"@lexical/table";import{mergeRegister as r}from"@lexical/utils";import{COMMAND_PRIORITY_HIGH as l,$getSelection as i,$getRoot as a,$isRangeSelection as s,$isElementNode as c,$isNodeSelection as u,$isTextNode as f}from"lexical";import*as d from"react";import{useState as m,useRef as g,useMemo as p,useCallback as h,useEffect as y}from"react";const b=Object.freeze({"\t":"\\t","\n":"\\n"}),E=new RegExp(Object.keys(b).join("|"),"g"),C=Object.freeze({ancestorHasNextSibling:"|",ancestorIsLastChild:" ",hasNextSibling:"├",isLastChild:"└",selectedChar:"^",selectedLine:">"});function $({treeTypeButtonClassName:e,timeTravelButtonClassName:t,timeTravelPanelSliderClassName:n,timeTravelPanelButtonClassName:o,viewClassName:i,timeTravelPanelClassName:a,editor:s}){const[c,u]=m([]),[f,b]=m(""),[E,C]=m(!1),[$,S]=m(!1),x=g(0),T=g(null),j=g(null),[k,L]=m(!1),[v,B]=m(!1),[w,_]=m(!1),D=g(null),F=function(e){const[t,n]=m([]);return y((()=>{const t=new Set;for(const[o]of e._commands)t.add(e.registerCommand(o,(e=>(n((t=>{const n=[...t];return n.push({payload:e,type:o.type?o.type:"UNKNOWN"}),n.length>10&&n.shift(),n})),!1)),l));return()=>t.forEach((e=>e()))}),[e]),p((()=>t),[t])}(s),K=h((e=>{const t=N(s,F,$);b(t),E||u((t=>[...t,[Date.now(),e]]))}),[F,s,E,$]);y((()=>{const e=s.getEditorState();!w&&e._nodeMap.size<1e3&&b(N(s,F,$))}),[F,s,w,$]),y((()=>r(s.registerUpdateListener((({editorState:e})=>{!w&&e._nodeMap.size>1e3&&(D.current=e,B(!0),!w)||K(e)})),s.registerEditableListener((()=>{const e=N(s,F,$);b(e)})))),[F,s,$,v,K,w]);const R=c.length;return y((()=>{if(k){let e;const t=()=>{const n=x.current;if(n===R-1)return void L(!1);const o=c[n][0],r=c[n+1][0];e=setTimeout((()=>{x.current++;const e=x.current,n=j.current;null!==n&&(n.value=String(e)),s.setEditorState(c[e][1]),t()}),r-o)};return t(),()=>{clearTimeout(e)}}}),[c,k,s,R]),y((()=>{const e=T.current;if(null!==e)return e.__lexicalEditor=s,()=>{e.__lexicalEditor=null}}),[s]),d.createElement("div",{className:i},!w&&v?d.createElement("div",{style:{padding:20}},d.createElement("span",{style:{marginRight:20}},"Detected large EditorState, this can impact debugging performance."),d.createElement("button",{onClick:()=>{_(!0);const e=D.current;null!==e&&(D.current=null,K(e))},style:{background:"transparent",border:"1px solid white",color:"white",cursor:"pointer",padding:5}},"Show full tree")):null,w?null:d.createElement("button",{onClick:()=>S(!$),className:e,type:"button"},$?"Tree":"Export DOM"),!E&&(w||!v)&&R>2&&d.createElement("button",{onClick:()=>{const e=s.getRootElement();null!==e&&(e.contentEditable="false",x.current=R-1,C(!0))},className:t,type:"button"},"Time Travel"),(w||!v)&&d.createElement("pre",{ref:T},f),E&&(w||!v)&&d.createElement("div",{className:a},d.createElement("button",{className:o,onClick:()=>{x.current===R-1&&(x.current=1),L(!k)},type:"button"},k?"Pause":"Play"),d.createElement("input",{className:n,ref:j,onChange:e=>{const t=Number(e.target.value),n=c[t];n&&(x.current=t,s.setEditorState(n[1]))},type:"range",min:"1",max:R-1}),d.createElement("button",{className:o,onClick:()=>{const e=s.getRootElement();if(null!==e){e.contentEditable="true";const t=c.length-1,n=c[t];s.setEditorState(n[1]);const o=j.current;null!==o&&(o.value=String(t)),C(!1),L(!1)}},type:"button"},"Exit")))}function N(r,l,d){const m=r.getEditorState(),g=r._config,p=r._compositionKey,h=r._editable;if(d){let t="";return m.read((()=>{t=function(e){const t=document.createElement("div");return t.innerHTML=e.trim(),F(t,0).innerHTML}(e(r))})),t}let y=" root\n";const b=m.read((()=>{const e=i();return S(a(),((o,r)=>{const l=`(${o.getKey()})`,i=o.getType()||"",a=o.isSelected(),d=n(o)?` id: [ ${o.getIDs().join(", ")} ] `:"";y+=`${a?C.selectedLine:" "} ${r.join(" ")} ${l} ${i} ${d} ${function(e){if(f(e)){const t=e.getTextContent(),n=0===t.length?"(empty)":`"${x(t)}"`,o=function(e){return[B(e),L(e),v(e)].filter(Boolean).join(", ")}(e);return[n,0!==o.length?`{ ${o} }`:null].filter(Boolean).join(" ").trim()}if(t(e)){const t=e.getURL(),n=0===t.length?"(empty)":`"${x(t)}"`,o=function(e){return[w(e),_(e),D(e)].filter(Boolean).join(", ")}(e);return[n,0!==o.length?`{ ${o} }`:null].filter(Boolean).join(" ").trim()}return""}(o)}\n`,y+=function({indent:e,isSelected:t,node:n,nodeKeyDisplay:o,selection:r,typeDisplay:l}){if(!f(n)||!s(r)||!t||c(n))return"";const i=r.anchor,a=r.focus;if(""===n.getTextContent()||i.getNode()===r.focus.getNode()&&i.offset===a.offset)return"";const[d,m]=function(e,t){const n=t.getStartEndPoints();if(u(t)||null===n)return[-1,-1];const[o,r]=n,l=e.getTextContent(),i=l.length;let a=-1,s=-1;if("text"===o.type&&"text"===r.type){const t=o.getNode(),n=r.getNode();t===n&&e===t&&o.offset!==r.offset?[a,s]=o.offset<r.offset?[o.offset,r.offset]:[r.offset,o.offset]:[a,s]=e===t?t.isBefore(n)?[o.offset,i]:[0,o.offset]:e===n?n.isBefore(t)?[r.offset,i]:[0,r.offset]:[0,i]}const c=(l.slice(0,a).match(E)||[]).length,f=(l.slice(a,s).match(E)||[]).length;return[a+c,s+c+f]}(n,r);if(d===m)return"";const g=e[e.length-1]===C.hasNextSibling?C.ancestorHasNextSibling:C.ancestorIsLastChild,p=[...e.slice(0,e.length-1),g],h=Array(d+1).fill(" "),y=Array(m-d).fill(C.selectedChar),b=l.length+3,$=Array(o.length+b).fill(" ");return[C.selectedLine,p.join(" "),[...$,...h,...y].join("")].join(" ")+"\n"}({indent:r,isSelected:a,node:o,nodeKeyDisplay:l,selection:e,typeDisplay:i})})),null===e?": null":s(e)?function(e){let t="";const n=B(e);t+=`: range ${""!==n?`{ ${n} }`:""} ${""!==e.style?`{ style: ${e.style} } `:""}`;const o=e.anchor,r=e.focus,l=o.offset,i=r.offset;return t+=`\n  ├ anchor { key: ${o.key}, offset: ${null===l?"null":l}, type: ${o.type} }`,t+=`\n  └ focus { key: ${r.key}, offset: ${null===i?"null":i}, type: ${r.type} }`,t}(e):o(e)?function(e){return`: table\n  └ { table: ${e.tableKey}, anchorCell: ${e.anchor.key}, focusCell: ${e.focus.key} }`}(e):function(e){return u(e)?`: node\n  └ [${Array.from(e._nodes).join(", ")}]`:""}(e)}));if(y+="\n selection"+b,y+="\n\n commands:",l.length)for(const{type:e,payload:t}of l)y+=`\n  └ { type: ${e}, payload: ${t instanceof Event?t.constructor.name:t} }`;else y+="\n  └ None dispatched.";return y+="\n\n editor:",y+=`\n  └ namespace ${g.namespace}`,null!==p&&(y+=`\n  └ compositionKey ${p}`),y+=`\n  └ editable ${String(h)}`,y}function S(e,t,n=[]){const o=e.getChildren(),r=o.length;o.forEach(((e,o)=>{t(e,n.concat(o===r-1?C.isLastChild:C.hasNextSibling)),c(e)&&S(e,t,n.concat(o===r-1?C.ancestorIsLastChild:C.ancestorHasNextSibling))}))}function x(e){return Object.entries(b).reduce(((e,[t,n])=>e.replace(new RegExp(t,"g"),String(n))),e)}const T=[e=>e.hasFormat("bold")&&"Bold",e=>e.hasFormat("code")&&"Code",e=>e.hasFormat("italic")&&"Italic",e=>e.hasFormat("strikethrough")&&"Strikethrough",e=>e.hasFormat("subscript")&&"Subscript",e=>e.hasFormat("superscript")&&"Superscript",e=>e.hasFormat("underline")&&"Underline"],j=[e=>e.isDirectionless()&&"Directionless",e=>e.isUnmergeable()&&"Unmergeable"],k=[e=>e.isToken()&&"Token",e=>e.isSegmented()&&"Segmented"];function L(e){let t=j.map((t=>t(e))).filter(Boolean).join(", ").toLocaleLowerCase();return""!==t&&(t="detail: "+t),t}function v(e){let t=k.map((t=>t(e))).filter(Boolean).join(", ").toLocaleLowerCase();return""!==t&&(t="mode: "+t),t}function B(e){let t=T.map((t=>t(e))).filter(Boolean).join(", ").toLocaleLowerCase();return""!==t&&(t="format: "+t),t}function w(e){let t=e.getTarget();return null!=t&&(t="target: "+t),t}function _(e){let t=e.getRel();return null!=t&&(t="rel: "+t),t}function D(e){let t=e.getTitle();return null!=t&&(t="title: "+t),t}function F(e,t){const n=new Array(1+t++).join("  "),o=new Array(t-1).join("  ");let r;for(let l=0;l<e.children.length;l++)r=document.createTextNode("\n"+n),e.insertBefore(r,e.children[l]),F(e.children[l],t),e.lastElementChild===e.children[l]&&(r=document.createTextNode("\n"+o),e.appendChild(r));return e}export{$ as TreeView};
+import{useLexicalCommandsLog as e,TreeView as t,generateContent as a}from"@lexical/devtools-core";import{mergeRegister as r}from"@lexical/utils";import*as l from"react";import{useState as i,useEffect as s}from"react";function n({treeTypeButtonClassName:n,timeTravelButtonClassName:o,timeTravelPanelSliderClassName:m,timeTravelPanelButtonClassName:c,viewClassName:d,timeTravelPanelClassName:u,editor:C}){const N=l.createRef(),[v,E]=i(C.getEditorState()),T=e(C);s((()=>r(C.registerUpdateListener((({editorState:e})=>{E(e)})),C.registerEditableListener((()=>{E(C.getEditorState())})))),[C]),s((()=>{const e=N.current;if(null!==e)return e.__lexicalEditor=C,()=>{e.__lexicalEditor=null}}),[C,N]);return l.createElement(t,{treeTypeButtonClassName:n,timeTravelButtonClassName:o,timeTravelPanelSliderClassName:m,timeTravelPanelButtonClassName:c,viewClassName:d,timeTravelPanelClassName:u,setEditorReadOnly:e=>{const t=C.getRootElement();null!=t&&(t.contentEditable=e?"false":"true")},editorState:v,setEditorState:e=>C.setEditorState(e),generateContent:async function(e){return a(C,T,e)},ref:N})}export{n as TreeView};

package/LexicalTypeaheadMenuPlugin.dev.js

@@ -323,7 +323,7 @@ function useMenuAnchorRef(resolution, setResolution, className, parent = documen
         height
       } = resolution.getRect();
       const anchorHeight = anchorElementRef.current.offsetHeight; // use to position under anchor
-      containerDiv.style.top = `${top + anchorHeight + 3}px`;
+      containerDiv.style.top = `${top + window.pageYOffset + anchorHeight + 3}px`;
       containerDiv.style.left = `${left + window.pageXOffset}px`;
       containerDiv.style.height = `${height}px`;
       containerDiv.style.width = `${width}px`;

package/LexicalTypeaheadMenuPlugin.dev.mjs

@@ -322,7 +322,7 @@ function useMenuAnchorRef(resolution, setResolution, className, parent = documen
         height
       } = resolution.getRect();
       const anchorHeight = anchorElementRef.current.offsetHeight; // use to position under anchor
-      containerDiv.style.top = `${top + anchorHeight + 3}px`;
+      containerDiv.style.top = `${top + window.pageYOffset + anchorHeight + 3}px`;
       containerDiv.style.left = `${left + window.pageXOffset}px`;
       containerDiv.style.height = `${height}px`;
       containerDiv.style.width = `${width}px`;

package/LexicalTypeaheadMenuPlugin.prod.js

@@ -14,7 +14,7 @@ function L({close:b,editor:a,anchorElementRef:c,resolution:d,options:f,menuRende
 "typeahead-item-"+g),h(g))},[a]);y.useEffect(()=>()=>{let g=a.getRootElement();null!==g&&g.removeAttribute("aria-activedescendant")},[a]);B(()=>{null===f?h(null):null===e&&t(0)},[f,e,t]);y.useEffect(()=>A.mergeRegister(a.registerCommand(K,({option:g})=>g.ref&&null!=g.ref.current?(D(g.ref.current),!0):!1,p)),[a,t,p]);y.useEffect(()=>A.mergeRegister(a.registerCommand(q.KEY_ARROW_DOWN_COMMAND,g=>{if(null!==f&&f.length&&null!==e){let m=e!==f.length-1?e+1:0;t(m);let w=f[m];null!=w.ref&&w.ref.current&&
 a.dispatchCommand(K,{index:m,option:w});g.preventDefault();g.stopImmediatePropagation()}return!0},p),a.registerCommand(q.KEY_ARROW_UP_COMMAND,g=>{if(null!==f&&f.length&&null!==e){var m=0!==e?e-1:f.length-1;t(m);m=f[m];null!=m.ref&&m.ref.current&&D(m.ref.current);g.preventDefault();g.stopImmediatePropagation()}return!0},p),a.registerCommand(q.KEY_ESCAPE_COMMAND,g=>{g.preventDefault();g.stopImmediatePropagation();b();return!0},p),a.registerCommand(q.KEY_TAB_COMMAND,g=>{if(null===f||null===e||null==
 f[e])return!1;g.preventDefault();g.stopImmediatePropagation();k(f[e]);return!0},p),a.registerCommand(q.KEY_ENTER_COMMAND,g=>{if(null===f||null===e||null==f[e])return!1;null!==g&&(g.preventDefault(),g.stopImmediatePropagation());k(f[e]);return!0},p)),[k,b,a,f,e,t,p]);let u=y.useMemo(()=>({options:f,selectOptionAndCleanUp:k,selectedIndex:e,setHighlightedIndex:h}),[k,e,f]);return n(c,u,d.match?d.match.matchingString:"")}
-function M(b,a,c,d=document.body){let [f]=l.useLexicalComposerContext(),n=y.useRef(document.createElement("div")),r=y.useCallback(()=>{n.current.style.top=n.current.style.bottom;const p=f.getRootElement(),e=n.current;var h=e.firstChild;if(null!==p&&null!==b){const {left:t,top:u,width:g,height:m}=b.getRect();e.style.top=`${u+n.current.offsetHeight+3}px`;e.style.left=`${t+window.pageXOffset}px`;e.style.height=`${m}px`;e.style.width=`${g}px`;if(null!==h){h.style.top=`${u}`;var k=h.getBoundingClientRect();
+function M(b,a,c,d=document.body){let [f]=l.useLexicalComposerContext(),n=y.useRef(document.createElement("div")),r=y.useCallback(()=>{n.current.style.top=n.current.style.bottom;const p=f.getRootElement(),e=n.current;var h=e.firstChild;if(null!==p&&null!==b){const {left:t,top:u,width:g,height:m}=b.getRect();e.style.top=`${u+window.pageYOffset+n.current.offsetHeight+3}px`;e.style.left=`${t+window.pageXOffset}px`;e.style.height=`${m}px`;e.style.width=`${g}px`;if(null!==h){h.style.top=`${u}`;var k=h.getBoundingClientRect();
 h=k.height;k=k.width;const w=p.getBoundingClientRect();t+k>w.right&&(e.style.left=`${w.right-k+window.pageXOffset}px`);(u+h>window.innerHeight||u+h>w.bottom)&&u-w.top>h&&(e.style.top=`${u-h+window.pageYOffset-m}px`)}e.isConnected||(null!=c&&(e.className=c),e.setAttribute("aria-label","Typeahead menu"),e.setAttribute("id","typeahead-menu"),e.setAttribute("role","listbox"),e.style.display="block",e.style.position="absolute",d.append(e));n.current=e;p.setAttribute("aria-controls","typeahead-menu")}},
 [f,b,c,d]);y.useEffect(()=>{let p=f.getRootElement();if(null!==b)return r(),()=>{null!==p&&p.removeAttribute("aria-controls");let e=n.current;null!==e&&e.isConnected&&e.remove()}},[f,r,b]);let v=y.useCallback(p=>{null!==b&&(p||a(null))},[b,a]);J(b,n.current,r,v);return n}function N(b,a,c){var d=c.getSelection();if(null===d||!d.isCollapsed)return!1;c=d.anchorNode;d=d.anchorOffset;if(null==c||null==d)return!1;try{a.setStart(c,b),a.setEnd(c,d)}catch(f){return!1}return!0}
 function O(b){let a=null;b.getEditorState().read(()=>{var c=q.$getSelection();if(q.$isRangeSelection(c)){var d=c.anchor;"text"!==d.type?a=null:(c=d.getNode(),c.isSimpleText()?(d=d.offset,a=c.getTextContent().slice(0,d)):a=null)}});return a}function P(b,a){return 0!==a?!1:b.getEditorState().read(()=>{var c=q.$getSelection();return q.$isRangeSelection(c)?(c=c.anchor.getNode().getPreviousSibling(),q.$isTextNode(c)&&c.isTextEntity()):!1})}function Q(b){y.startTransition?y.startTransition(b):b()}