@lexical/react 0.14.5 → 0.16.0

package/LexicalRichTextPlugin.dev.js

@@ -3,15 +3,18 @@
  *
  * 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 LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
 var useLexicalEditable = require('@lexical/react/useLexicalEditable');
-var React = require('react');
 var text = require('@lexical/text');
 var utils = require('@lexical/utils');
+var react = require('react');
 var reactDom = require('react-dom');
+var jsxRuntime = require('react/jsx-runtime');
 var dragon = require('@lexical/dragon');
 var richText = require('@lexical/rich-text');
 
@@ -32,8 +35,12 @@ const CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !==
  * LICENSE file in the root directory of this source tree.
  *
  */
-const useLayoutEffectImpl = CAN_USE_DOM ? React.useLayoutEffect : React.useEffect;
-var useLayoutEffect = useLayoutEffectImpl;
+
+
+// This workaround is no longer necessary in React 19,
+// but we currently support React >=17.x
+// https://github.com/facebook/react/pull/26395
+const useLayoutEffectImpl = CAN_USE_DOM ? react.useLayoutEffect : react.useEffect;
 
 /**
  * Copyright (c) Meta Platforms, Inc. and affiliates.
@@ -42,13 +49,14 @@ var useLayoutEffect = useLayoutEffectImpl;
  * LICENSE file in the root directory of this source tree.
  *
  */
+
 function canShowPlaceholderFromCurrentEditorState(editor) {
   const currentCanShowPlaceholder = editor.getEditorState().read(text.$canShowPlaceholderCurry(editor.isComposing()));
   return currentCanShowPlaceholder;
 }
 function useCanShowPlaceholder(editor) {
-  const [canShowPlaceholder, setCanShowPlaceholder] = React.useState(() => canShowPlaceholderFromCurrentEditorState(editor));
-  useLayoutEffect(() => {
+  const [canShowPlaceholder, setCanShowPlaceholder] = react.useState(() => canShowPlaceholderFromCurrentEditorState(editor));
+  useLayoutEffectImpl(() => {
     function resetCanShowPlaceholder() {
       const currentCanShowPlaceholder = canShowPlaceholderFromCurrentEditorState(editor);
       setCanShowPlaceholder(currentCanShowPlaceholder);
@@ -70,18 +78,19 @@ function useCanShowPlaceholder(editor) {
  * LICENSE file in the root directory of this source tree.
  *
  */
+
 function useDecorators(editor, ErrorBoundary) {
-  const [decorators, setDecorators] = React.useState(() => editor.getDecorators());
+  const [decorators, setDecorators] = react.useState(() => editor.getDecorators());
 
   // Subscribe to changes
-  useLayoutEffect(() => {
+  useLayoutEffectImpl(() => {
     return editor.registerDecoratorListener(nextDecorators => {
       reactDom.flushSync(() => {
         setDecorators(nextDecorators);
       });
     });
   }, [editor]);
-  React.useEffect(() => {
+  react.useEffect(() => {
     // If the content editable mounts before the subscription is added, then
     // nothing will be rendered on initial pass. We can get around that by
     // ensuring that we set the value.
@@ -89,16 +98,18 @@ function useDecorators(editor, ErrorBoundary) {
   }, [editor]);
 
   // Return decorators defined as React Portals
-  return React.useMemo(() => {
+  return react.useMemo(() => {
     const decoratedPortals = [];
     const decoratorKeys = Object.keys(decorators);
     for (let i = 0; i < decoratorKeys.length; i++) {
       const nodeKey = decoratorKeys[i];
-      const reactDecorator = /*#__PURE__*/React.createElement(ErrorBoundary, {
-        onError: e => editor._onError(e)
-      }, /*#__PURE__*/React.createElement(React.Suspense, {
-        fallback: null
-      }, decorators[nodeKey]));
+      const reactDecorator = /*#__PURE__*/jsxRuntime.jsx(ErrorBoundary, {
+        onError: e => editor._onError(e),
+        children: /*#__PURE__*/jsxRuntime.jsx(react.Suspense, {
+          fallback: null,
+          children: decorators[nodeKey]
+        })
+      });
       const element = editor.getElementByKey(nodeKey);
       if (element !== null) {
         decoratedPortals.push( /*#__PURE__*/reactDom.createPortal(reactDecorator, element, nodeKey));
@@ -115,8 +126,9 @@ function useDecorators(editor, ErrorBoundary) {
  * LICENSE file in the root directory of this source tree.
  *
  */
+
 function useRichTextSetup(editor) {
-  useLayoutEffect(() => {
+  useLayoutEffectImpl(() => {
     return utils.mergeRegister(richText.registerRichText(editor), dragon.registerDragonSupport(editor));
 
     // We only do this for init
@@ -131,6 +143,7 @@ function useRichTextSetup(editor) {
  * LICENSE file in the root directory of this source tree.
  *
  */
+
 function RichTextPlugin({
   contentEditable,
   placeholder,
@@ -139,16 +152,18 @@ function RichTextPlugin({
   const [editor] = LexicalComposerContext.useLexicalComposerContext();
   const decorators = useDecorators(editor, ErrorBoundary);
   useRichTextSetup(editor);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, contentEditable, /*#__PURE__*/React.createElement(Placeholder, {
-    content: placeholder
-  }), decorators);
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [contentEditable, /*#__PURE__*/jsxRuntime.jsx(Placeholder, {
+      content: placeholder
+    }), decorators]
+  });
 }
 function Placeholder({
   content
 }) {
   const [editor] = LexicalComposerContext.useLexicalComposerContext();
   const showPlaceholder = useCanShowPlaceholder(editor);
-  const editable = useLexicalEditable();
+  const editable = useLexicalEditable.useLexicalEditable();
   if (!showPlaceholder) {
     return null;
   }

package/LexicalRichTextPlugin.dev.mjs

@@ -3,14 +3,16 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
+ *
  */
+
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
-import useLexicalEditable from '@lexical/react/useLexicalEditable';
-import * as React from 'react';
-import { useLayoutEffect as useLayoutEffect$1, useEffect, useState, useMemo, Suspense } from 'react';
+import { useLexicalEditable } from '@lexical/react/useLexicalEditable';
 import { $canShowPlaceholderCurry } from '@lexical/text';
 import { mergeRegister } from '@lexical/utils';
-import { createPortal, flushSync } from 'react-dom';
+import { useLayoutEffect, useEffect, useState, useMemo, Suspense } from 'react';
+import { flushSync, createPortal } from 'react-dom';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { registerDragonSupport } from '@lexical/dragon';
 import { registerRichText } from '@lexical/rich-text';
 
@@ -31,8 +33,12 @@ const CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !==
  * LICENSE file in the root directory of this source tree.
  *
  */
-const useLayoutEffectImpl = CAN_USE_DOM ? useLayoutEffect$1 : useEffect;
-var useLayoutEffect = useLayoutEffectImpl;
+
+
+// This workaround is no longer necessary in React 19,
+// but we currently support React >=17.x
+// https://github.com/facebook/react/pull/26395
+const useLayoutEffectImpl = CAN_USE_DOM ? useLayoutEffect : useEffect;
 
 /**
  * Copyright (c) Meta Platforms, Inc. and affiliates.
@@ -41,13 +47,14 @@ var useLayoutEffect = useLayoutEffectImpl;
  * LICENSE file in the root directory of this source tree.
  *
  */
+
 function canShowPlaceholderFromCurrentEditorState(editor) {
   const currentCanShowPlaceholder = editor.getEditorState().read($canShowPlaceholderCurry(editor.isComposing()));
   return currentCanShowPlaceholder;
 }
 function useCanShowPlaceholder(editor) {
   const [canShowPlaceholder, setCanShowPlaceholder] = useState(() => canShowPlaceholderFromCurrentEditorState(editor));
-  useLayoutEffect(() => {
+  useLayoutEffectImpl(() => {
     function resetCanShowPlaceholder() {
       const currentCanShowPlaceholder = canShowPlaceholderFromCurrentEditorState(editor);
       setCanShowPlaceholder(currentCanShowPlaceholder);
@@ -69,11 +76,12 @@ function useCanShowPlaceholder(editor) {
  * LICENSE file in the root directory of this source tree.
  *
  */
+
 function useDecorators(editor, ErrorBoundary) {
   const [decorators, setDecorators] = useState(() => editor.getDecorators());
 
   // Subscribe to changes
-  useLayoutEffect(() => {
+  useLayoutEffectImpl(() => {
     return editor.registerDecoratorListener(nextDecorators => {
       flushSync(() => {
         setDecorators(nextDecorators);
@@ -93,11 +101,13 @@ function useDecorators(editor, ErrorBoundary) {
     const decoratorKeys = Object.keys(decorators);
     for (let i = 0; i < decoratorKeys.length; i++) {
       const nodeKey = decoratorKeys[i];
-      const reactDecorator = /*#__PURE__*/React.createElement(ErrorBoundary, {
-        onError: e => editor._onError(e)
-      }, /*#__PURE__*/React.createElement(Suspense, {
-        fallback: null
-      }, decorators[nodeKey]));
+      const reactDecorator = /*#__PURE__*/jsx(ErrorBoundary, {
+        onError: e => editor._onError(e),
+        children: /*#__PURE__*/jsx(Suspense, {
+          fallback: null,
+          children: decorators[nodeKey]
+        })
+      });
       const element = editor.getElementByKey(nodeKey);
       if (element !== null) {
         decoratedPortals.push( /*#__PURE__*/createPortal(reactDecorator, element, nodeKey));
@@ -114,8 +124,9 @@ function useDecorators(editor, ErrorBoundary) {
  * LICENSE file in the root directory of this source tree.
  *
  */
+
 function useRichTextSetup(editor) {
-  useLayoutEffect(() => {
+  useLayoutEffectImpl(() => {
     return mergeRegister(registerRichText(editor), registerDragonSupport(editor));
 
     // We only do this for init
@@ -130,6 +141,7 @@ function useRichTextSetup(editor) {
  * LICENSE file in the root directory of this source tree.
  *
  */
+
 function RichTextPlugin({
   contentEditable,
   placeholder,
@@ -138,9 +150,11 @@ function RichTextPlugin({
   const [editor] = useLexicalComposerContext();
   const decorators = useDecorators(editor, ErrorBoundary);
   useRichTextSetup(editor);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, contentEditable, /*#__PURE__*/React.createElement(Placeholder, {
-    content: placeholder
-  }), decorators);
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [contentEditable, /*#__PURE__*/jsx(Placeholder, {
+      content: placeholder
+    }), decorators]
+  });
 }
 function Placeholder({
   content

package/LexicalRichTextPlugin.js

@@ -3,7 +3,9 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
+ *
  */
+
 'use strict'
 const LexicalRichTextPlugin = process.env.NODE_ENV === 'development' ? require('./LexicalRichTextPlugin.dev.js') : require('./LexicalRichTextPlugin.prod.js');
 module.exports = LexicalRichTextPlugin;

package/LexicalRichTextPlugin.js.flow

@@ -9,7 +9,7 @@
 
 import type {EditorState, LexicalEditor} from 'lexical';
 
-import typeof LexicalErrorBoundary from '@lexical/react/LexicalErrorBoundary';
+import {typeof LexicalErrorBoundary} from '@lexical/react/LexicalErrorBoundary';
 
 import * as React from 'react';
 

package/LexicalRichTextPlugin.mjs

@@ -3,7 +3,9 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
+ *
  */
+
 import * as modDev from './LexicalRichTextPlugin.dev.mjs';
 import * as modProd from './LexicalRichTextPlugin.prod.mjs';
 const mod = process.env.NODE_ENV === 'development' ? modDev : modProd;

package/LexicalRichTextPlugin.node.mjs

@@ -3,6 +3,8 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
+ *
  */
+
 const mod = await (process.env.NODE_ENV === 'development' ? import('./LexicalRichTextPlugin.dev.mjs') : import('./LexicalRichTextPlugin.prod.mjs'));
 export const RichTextPlugin = mod.RichTextPlugin;

package/LexicalRichTextPlugin.prod.js

@@ -3,8 +3,10 @@
  *
  * 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"),g=require("@lexical/react/useLexicalEditable"),l=require("react"),m=require("@lexical/text"),n=require("@lexical/utils"),p=require("react-dom"),t=require("@lexical/dragon"),u=require("@lexical/rich-text"),v="undefined"!==typeof window&&"undefined"!==typeof window.document&&"undefined"!==typeof window.document.createElement?l.useLayoutEffect:l.useEffect;
-function w(a){return a.getEditorState().read(m.$canShowPlaceholderCurry(a.isComposing()))}function x(a){let [d,c]=l.useState(()=>w(a));v(()=>{function e(){let f=w(a);c(f)}e();return n.mergeRegister(a.registerUpdateListener(()=>{e()}),a.registerEditableListener(()=>{e()}))},[a]);return d}
-function y(a,d){let [c,e]=l.useState(()=>a.getDecorators());v(()=>a.registerDecoratorListener(f=>{p.flushSync(()=>{e(f)})}),[a]);l.useEffect(()=>{e(a.getDecorators())},[a]);return l.useMemo(()=>{let f=[],q=Object.keys(c);for(let h=0;h<q.length;h++){let k=q[h],A=l.createElement(d,{onError:z=>a._onError(z)},l.createElement(l.Suspense,{fallback:null},c[k])),r=a.getElementByKey(k);null!==r&&f.push(p.createPortal(A,r,k))}return f},[d,c,a])}
-function B(a){v(()=>n.mergeRegister(u.registerRichText(a),t.registerDragonSupport(a)),[a])}function C({content:a}){var [d]=b.useLexicalComposerContext();d=x(d);let c=g();return d?"function"===typeof a?a(c):a:null}exports.RichTextPlugin=function({contentEditable:a,placeholder:d,ErrorBoundary:c}){let [e]=b.useLexicalComposerContext();c=y(e,c);B(e);return l.createElement(l.Fragment,null,a,l.createElement(C,{content:d}),c)}
+
+'use strict';var e=require("@lexical/react/LexicalComposerContext"),g=require("@lexical/react/useLexicalEditable"),h=require("@lexical/text"),m=require("@lexical/utils"),n=require("react"),p=require("react-dom"),q=require("react/jsx-runtime"),u=require("@lexical/dragon"),v=require("@lexical/rich-text");let w="undefined"!==typeof window&&"undefined"!==typeof window.document&&"undefined"!==typeof window.document.createElement?n.useLayoutEffect:n.useEffect;
+function x(a){return a.getEditorState().read(h.$canShowPlaceholderCurry(a.isComposing()))}function y(a){let [c,b]=n.useState(()=>x(a));w(()=>{function d(){let f=x(a);b(f)}d();return m.mergeRegister(a.registerUpdateListener(()=>{d()}),a.registerEditableListener(()=>{d()}))},[a]);return c}
+function z(a,c){let [b,d]=n.useState(()=>a.getDecorators());w(()=>a.registerDecoratorListener(f=>{p.flushSync(()=>{d(f)})}),[a]);n.useEffect(()=>{d(a.getDecorators())},[a]);return n.useMemo(()=>{let f=[],r=Object.keys(b);for(let k=0;k<r.length;k++){let l=r[k],B=q.jsx(c,{onError:A=>a._onError(A),children:q.jsx(n.Suspense,{fallback:null,children:b[l]})}),t=a.getElementByKey(l);null!==t&&f.push(p.createPortal(B,t,l))}return f},[c,b,a])}
+function C(a){w(()=>m.mergeRegister(v.registerRichText(a),u.registerDragonSupport(a)),[a])}function D({content:a}){var [c]=e.useLexicalComposerContext();c=y(c);let b=g.useLexicalEditable();return c?"function"===typeof a?a(b):a:null}exports.RichTextPlugin=function({contentEditable:a,placeholder:c,ErrorBoundary:b}){let [d]=e.useLexicalComposerContext();b=z(d,b);C(d);return q.jsxs(q.Fragment,{children:[a,q.jsx(D,{content:c}),b]})}

package/LexicalRichTextPlugin.prod.mjs

@@ -3,5 +3,7 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
+ *
  */
-import{useLexicalComposerContext as e}from"@lexical/react/LexicalComposerContext";import t from"@lexical/react/useLexicalEditable";import*as r from"react";import{useLayoutEffect as o,useEffect as n,useState as c,useMemo as i,Suspense as l}from"react";import{$canShowPlaceholderCurry as a}from"@lexical/text";import{mergeRegister as m}from"@lexical/utils";import{createPortal as u,flushSync as s}from"react-dom";import{registerDragonSupport as f}from"@lexical/dragon";import{registerRichText as d}from"@lexical/rich-text";var p="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement?o:n;function E(e){return e.getEditorState().read(a(e.isComposing()))}function x({contentEditable:t,placeholder:o,ErrorBoundary:a}){const[E]=e(),x=function(e,t){const[o,a]=c((()=>e.getDecorators()));return p((()=>e.registerDecoratorListener((e=>{s((()=>{a(e)}))}))),[e]),n((()=>{a(e.getDecorators())}),[e]),i((()=>{const n=[],c=Object.keys(o);for(let i=0;i<c.length;i++){const a=c[i],m=r.createElement(t,{onError:t=>e._onError(t)},r.createElement(l,{fallback:null},o[a])),s=e.getElementByKey(a);null!==s&&n.push(u(m,s,a))}return n}),[t,o,e])}(E,a);return function(e){p((()=>m(d(e),f(e))),[e])}(E),r.createElement(r.Fragment,null,t,r.createElement(g,{content:o}),x)}function g({content:r}){const[o]=e(),n=function(e){const[t,r]=c((()=>E(e)));return p((()=>{function t(){const t=E(e);r(t)}return t(),m(e.registerUpdateListener((()=>{t()})),e.registerEditableListener((()=>{t()})))}),[e]),t}(o),i=t();return n?"function"==typeof r?r(i):r:null}export{x as RichTextPlugin};
+
+import{useLexicalComposerContext as t}from"@lexical/react/LexicalComposerContext";import{useLexicalEditable as e}from"@lexical/react/useLexicalEditable";import{$canShowPlaceholderCurry as r}from"@lexical/text";import{mergeRegister as o}from"@lexical/utils";import{useLayoutEffect as n,useEffect as i,useState as c,useMemo as l,Suspense as a}from"react";import{flushSync as m,createPortal as u}from"react-dom";import{jsx as s,jsxs as d,Fragment as f}from"react/jsx-runtime";import{registerDragonSupport as p}from"@lexical/dragon";import{registerRichText as x}from"@lexical/rich-text";const g="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement?n:i;function E(t){return t.getEditorState().read(r(t.isComposing()))}function h({contentEditable:e,placeholder:r,ErrorBoundary:n}){const[E]=t(),h=function(t,e){const[r,o]=c((()=>t.getDecorators()));return g((()=>t.registerDecoratorListener((t=>{m((()=>{o(t)}))}))),[t]),i((()=>{o(t.getDecorators())}),[t]),l((()=>{const o=[],n=Object.keys(r);for(let i=0;i<n.length;i++){const c=n[i],l=s(e,{onError:e=>t._onError(e),children:s(a,{fallback:null,children:r[c]})}),m=t.getElementByKey(c);null!==m&&o.push(u(l,m,c))}return o}),[e,r,t])}(E,n);return function(t){g((()=>o(x(t),p(t))),[t])}(E),d(f,{children:[e,s(w,{content:r}),h]})}function w({content:r}){const[n]=t(),i=function(t){const[e,r]=c((()=>E(t)));return g((()=>{function e(){const e=E(t);r(e)}return e(),o(t.registerUpdateListener((()=>{e()})),t.registerEditableListener((()=>{e()})))}),[t]),e}(n),l=e();return i?"function"==typeof r?r(l):r:null}export{h as RichTextPlugin};

package/LexicalTabIndentationPlugin.dev.js

@@ -3,7 +3,9 @@
  *
  * 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 LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
@@ -18,7 +20,8 @@ var react = require('react');
  * LICENSE file in the root directory of this source tree.
  *
  */
-function indentOverTab(selection) {
+
+function $indentOverTab(selection) {
   // const handled = new Set();
   const nodes = selection.getNodes();
   const canIndentBlockNodes = utils.$filter(nodes, node => {
@@ -57,7 +60,7 @@ function registerTabIndentation(editor) {
       return false;
     }
     event.preventDefault();
-    const command = indentOverTab(selection) ? event.shiftKey ? lexical.OUTDENT_CONTENT_COMMAND : lexical.INDENT_CONTENT_COMMAND : lexical.INSERT_TAB_COMMAND;
+    const command = $indentOverTab(selection) ? event.shiftKey ? lexical.OUTDENT_CONTENT_COMMAND : lexical.INDENT_CONTENT_COMMAND : lexical.INSERT_TAB_COMMAND;
     return editor.dispatchCommand(command, undefined);
   }, lexical.COMMAND_PRIORITY_EDITOR);
 }

package/LexicalTabIndentationPlugin.dev.mjs

@@ -3,7 +3,9 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
+ *
  */
+
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
 import { $filter, $getNearestBlockElementAncestorOrThrow } from '@lexical/utils';
 import { KEY_TAB_COMMAND, $getSelection, $isRangeSelection, OUTDENT_CONTENT_COMMAND, INDENT_CONTENT_COMMAND, INSERT_TAB_COMMAND, COMMAND_PRIORITY_EDITOR, $isBlockElementNode, $createRangeSelection, $normalizeSelection__EXPERIMENTAL } from 'lexical';
@@ -16,7 +18,8 @@ import { useEffect } from 'react';
  * LICENSE file in the root directory of this source tree.
  *
  */
-function indentOverTab(selection) {
+
+function $indentOverTab(selection) {
   // const handled = new Set();
   const nodes = selection.getNodes();
   const canIndentBlockNodes = $filter(nodes, node => {
@@ -55,7 +58,7 @@ function registerTabIndentation(editor) {
       return false;
     }
     event.preventDefault();
-    const command = indentOverTab(selection) ? event.shiftKey ? OUTDENT_CONTENT_COMMAND : INDENT_CONTENT_COMMAND : INSERT_TAB_COMMAND;
+    const command = $indentOverTab(selection) ? event.shiftKey ? OUTDENT_CONTENT_COMMAND : INDENT_CONTENT_COMMAND : INSERT_TAB_COMMAND;
     return editor.dispatchCommand(command, undefined);
   }, COMMAND_PRIORITY_EDITOR);
 }

package/LexicalTabIndentationPlugin.js

@@ -3,7 +3,9 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
+ *
  */
+
 'use strict'
 const LexicalTabIndentationPlugin = process.env.NODE_ENV === 'development' ? require('./LexicalTabIndentationPlugin.dev.js') : require('./LexicalTabIndentationPlugin.prod.js');
 module.exports = LexicalTabIndentationPlugin;

package/LexicalTabIndentationPlugin.mjs

@@ -3,7 +3,9 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
+ *
  */
+
 import * as modDev from './LexicalTabIndentationPlugin.dev.mjs';
 import * as modProd from './LexicalTabIndentationPlugin.prod.mjs';
 const mod = process.env.NODE_ENV === 'development' ? modDev : modProd;

package/LexicalTabIndentationPlugin.node.mjs

@@ -3,7 +3,9 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
+ *
  */
+
 const mod = await (process.env.NODE_ENV === 'development' ? import('./LexicalTabIndentationPlugin.dev.mjs') : import('./LexicalTabIndentationPlugin.prod.mjs'));
 export const TabIndentationPlugin = mod.TabIndentationPlugin;
 export const registerTabIndentation = mod.registerTabIndentation;

package/LexicalTabIndentationPlugin.prod.js

@@ -3,7 +3,9 @@
  *
  * 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 d=require("@lexical/react/LexicalComposerContext"),e=require("@lexical/utils"),f=require("lexical"),g=require("react");
 function h(b){var a=b.getNodes();if(0<e.$filter(a,c=>f.$isBlockElementNode(c)&&c.canIndent()?c:null).length)return!0;a=b.anchor;b=b.focus;b=b.isBefore(a)?b:a;a=b.getNode();a=e.$getNearestBlockElementAncestorOrThrow(a);if(a.canIndent()){a=a.getKey();let c=f.$createRangeSelection();c.anchor.set(a,0,"element");c.focus.set(a,0,"element");c=f.$normalizeSelection__EXPERIMENTAL(c);if(c.anchor.is(b))return!0}return!1}
 function k(b){return b.registerCommand(f.KEY_TAB_COMMAND,a=>{let c=f.$getSelection();if(!f.$isRangeSelection(c))return!1;a.preventDefault();a=h(c)?a.shiftKey?f.OUTDENT_CONTENT_COMMAND:f.INDENT_CONTENT_COMMAND:f.INSERT_TAB_COMMAND;return b.dispatchCommand(a,void 0)},f.COMMAND_PRIORITY_EDITOR)}exports.TabIndentationPlugin=function(){let [b]=d.useLexicalComposerContext();g.useEffect(()=>k(b));return null};exports.registerTabIndentation=k

package/LexicalTabIndentationPlugin.prod.mjs

@@ -3,5 +3,7 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
+ *
  */
+
 import{useLexicalComposerContext as e}from"@lexical/react/LexicalComposerContext";import{$filter as t,$getNearestBlockElementAncestorOrThrow as n}from"@lexical/utils";import{KEY_TAB_COMMAND as r,$getSelection as o,$isRangeSelection as c,OUTDENT_CONTENT_COMMAND as i,INDENT_CONTENT_COMMAND as s,INSERT_TAB_COMMAND as l,COMMAND_PRIORITY_EDITOR as f,$isBlockElementNode as u,$createRangeSelection as a,$normalizeSelection__EXPERIMENTAL as m}from"lexical";import{useEffect as d}from"react";function p(e){return e.registerCommand(r,(r=>{const f=o();if(!c(f))return!1;r.preventDefault();const d=function(e){const r=e.getNodes();if(t(r,(e=>u(e)&&e.canIndent()?e:null)).length>0)return!0;const o=e.anchor,c=e.focus,i=c.isBefore(o)?c:o,s=i.getNode(),l=n(s);if(l.canIndent()){const e=l.getKey();let t=a();if(t.anchor.set(e,0,"element"),t.focus.set(e,0,"element"),t=m(t),t.anchor.is(i))return!0}return!1}(f)?r.shiftKey?i:s:l;return e.dispatchCommand(d,void 0)}),f)}function h(){const[t]=e();return d((()=>p(t))),null}export{h as TabIndentationPlugin,p as registerTabIndentation};

package/LexicalTableOfContents.d.ts

@@ -5,16 +5,9 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-/// <reference types="react" />
-import type { LexicalEditor, NodeKey } from 'lexical';
-import { HeadingTagType } from '@lexical/rich-text';
-export type TableOfContentsEntry = [
-    key: NodeKey,
-    text: string,
-    tag: HeadingTagType
-];
-type Props = {
-    children: (values: Array<TableOfContentsEntry>, editor: LexicalEditor) => JSX.Element;
-};
-export default function LexicalTableOfContentsPlugin({ children, }: Props): JSX.Element;
-export {};
+/** @deprecated moved to @lexical/react/LexicalTableOfContentsPlugin */
+import { type TableOfContentsEntry, TableOfContentsPlugin } from './LexicalTableOfContentsPlugin';
+/** @deprecated use the module @lexical/react/LexicalTableOfContentsPlugin */
+export { type TableOfContentsEntry };
+/** @deprecated use module @lexical/react/LexicalTableOfContentsPlugin */
+export default TableOfContentsPlugin;

package/LexicalTableOfContents.dev.js

@@ -3,11 +3,14 @@
  *
  * 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 LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
 var richText = require('@lexical/rich-text');
+var utils = require('@lexical/utils');
 var lexical = require('lexical');
 var react = require('react');
 
@@ -18,6 +21,7 @@ var react = require('react');
  * LICENSE file in the root directory of this source tree.
  *
  */
+
 function toEntry(heading) {
   return [heading.getKey(), heading.getTextContent(), heading.getTag()];
 }
@@ -28,12 +32,20 @@ function $insertHeadingIntoTableOfContents(prevHeading, newHeading, currentTable
   const newEntry = toEntry(newHeading);
   let newTableOfContents = [];
   if (prevHeading === null) {
+    // check if key already exists
+    if (currentTableOfContents.length > 0 && currentTableOfContents[0][0] === newHeading.__key) {
+      return currentTableOfContents;
+    }
     newTableOfContents = [newEntry, ...currentTableOfContents];
   } else {
     for (let i = 0; i < currentTableOfContents.length; i++) {
       const key = currentTableOfContents[i][0];
       newTableOfContents.push(currentTableOfContents[i]);
       if (key === prevHeading.getKey() && key !== newHeading.getKey()) {
+        // check if key already exists
+        if (i + 1 < currentTableOfContents.length && currentTableOfContents[i + 1][0] === newHeading.__key) {
+          return currentTableOfContents;
+        }
         newTableOfContents.push(newEntry);
       }
     }
@@ -82,7 +94,14 @@ function $updateHeadingPosition(prevHeading, heading, currentTableOfContents) {
   }
   return newTableOfContents;
 }
-function LexicalTableOfContentsPlugin({
+function $getPreviousHeading(node) {
+  let prevHeading = utils.$getNextRightPreorderNode(node);
+  while (prevHeading !== null && !richText.$isHeadingNode(prevHeading)) {
+    prevHeading = utils.$getNextRightPreorderNode(prevHeading);
+  }
+  return prevHeading;
+}
+function TableOfContentsPlugin({
   children
 }) {
   const [tableOfContents, setTableOfContents] = react.useState([]);
@@ -100,6 +119,31 @@ function LexicalTableOfContentsPlugin({
       }
       setTableOfContents(currentTableOfContents);
     });
+    const removeRootUpdateListener = editor.registerUpdateListener(({
+      editorState,
+      dirtyElements
+    }) => {
+      editorState.read(() => {
+        const updateChildHeadings = node => {
+          for (const child of node.getChildren()) {
+            if (richText.$isHeadingNode(child)) {
+              const prevHeading = $getPreviousHeading(child);
+              currentTableOfContents = $updateHeadingPosition(prevHeading, child, currentTableOfContents);
+              setTableOfContents(currentTableOfContents);
+            } else if (lexical.$isElementNode(child)) {
+              updateChildHeadings(child);
+            }
+          }
+        };
+
+        // If a node is changes, all child heading positions need to be updated
+        lexical.$getRoot().getChildren().forEach(node => {
+          if (lexical.$isElementNode(node) && dirtyElements.get(node.__key)) {
+            updateChildHeadings(node);
+          }
+        });
+      });
+    });
 
     // Listen to updates to heading mutations and update state
     const removeHeaderMutationListener = editor.registerMutationListener(richText.HeadingNode, mutatedNodes => {
@@ -108,10 +152,7 @@ function LexicalTableOfContentsPlugin({
           if (mutation === 'created') {
             const newHeading = lexical.$getNodeByKey(nodeKey);
             if (newHeading !== null) {
-              let prevHeading = newHeading.getPreviousSibling();
-              while (prevHeading !== null && !richText.$isHeadingNode(prevHeading)) {
-                prevHeading = prevHeading.getPreviousSibling();
-              }
+              const prevHeading = $getPreviousHeading(newHeading);
               currentTableOfContents = $insertHeadingIntoTableOfContents(prevHeading, newHeading, currentTableOfContents);
             }
           } else if (mutation === 'destroyed') {
@@ -119,10 +160,7 @@ function LexicalTableOfContentsPlugin({
           } else if (mutation === 'updated') {
             const newHeading = lexical.$getNodeByKey(nodeKey);
             if (newHeading !== null) {
-              let prevHeading = newHeading.getPreviousSibling();
-              while (prevHeading !== null && !richText.$isHeadingNode(prevHeading)) {
-                prevHeading = prevHeading.getPreviousSibling();
-              }
+              const prevHeading = $getPreviousHeading(newHeading);
               currentTableOfContents = $updateHeadingPosition(prevHeading, newHeading, currentTableOfContents);
             }
           }
@@ -151,9 +189,18 @@ function LexicalTableOfContentsPlugin({
     return () => {
       removeHeaderMutationListener();
       removeTextNodeMutationListener();
+      removeRootUpdateListener();
     };
   }, [editor]);
   return children(tableOfContents, editor);
 }
 
-module.exports = LexicalTableOfContentsPlugin;
+/**
+ * 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.
+ *
+ */
+
+exports.default = TableOfContentsPlugin;