@lexical/react 0.45.1-nightly.20260618.0 → 0.45.1-nightly.20260622.0

package/dist/LexicalAutoEmbedPlugin.d.ts

@@ -9,18 +9,43 @@ import type { CommandListenerPriority, LexicalNode } from 'lexical';
 import type { JSX } from 'react';
 import { MenuOption, type MenuRenderFn } from '@lexical/react/LexicalNodeMenuPlugin';
 import { LexicalCommand, LexicalEditor } from 'lexical';
+/**
+ * The result of matching a URL for an embed: the matched `url`, an `id`
+ * identifying the embedded resource, and optional provider-specific `data`.
+ */
 export type EmbedMatchResult<TEmbedMatchResult = unknown> = {
     url: string;
     id: string;
     data?: TEmbedMatchResult;
 };
+/**
+ * Describes a kind of embed (for example YouTube, a tweet, or Google Maps) that
+ * {@link LexicalAutoEmbedPlugin} can detect and insert. Each config has a `type`
+ * identifier, a `parseUrl` function that decides whether a URL matches and
+ * extracts its data, and an `insertNode` function that inserts the corresponding
+ * Lexical node.
+ */
 export interface EmbedConfig<TEmbedMatchResultData = unknown, TEmbedMatchResult = EmbedMatchResult<TEmbedMatchResultData>> {
     type: string;
     parseUrl: (text: string) => Promise<TEmbedMatchResult | null> | TEmbedMatchResult | null;
     insertNode: (editor: LexicalEditor, result: TEmbedMatchResult) => void;
 }
+/**
+ * A general-purpose regular expression for detecting URLs, provided as a
+ * convenience for implementing an {@link EmbedConfig}'s `parseUrl`.
+ */
 export declare const URL_MATCHER: RegExp;
+/**
+ * Command dispatched to start inserting an embed. Its payload is the `type` of
+ * the {@link EmbedConfig} to use; {@link LexicalAutoEmbedPlugin} listens for it
+ * and runs that config's URL detection flow.
+ */
 export declare const INSERT_EMBED_COMMAND: LexicalCommand<EmbedConfig['type']>;
+/**
+ * A {@link MenuOption} for the auto-embed menu, pairing a display `title` with
+ * an `onSelect` callback invoked when the user chooses to embed the detected
+ * URL.
+ */
 export declare class AutoEmbedOption extends MenuOption {
     title: string;
     onSelect: (targetNode: LexicalNode | null) => void;

package/dist/LexicalAutoEmbedPlugin.dev.js

@@ -11,7 +11,6 @@
 var link = require('@lexical/link');
 var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
 var LexicalNodeMenuPlugin = require('@lexical/react/LexicalNodeMenuPlugin');
-var utils = require('@lexical/utils');
 var lexical = require('lexical');
 var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
@@ -24,8 +23,24 @@ var jsxRuntime = require('react/jsx-runtime');
  *
  */
 
+/**
+ * A general-purpose regular expression for detecting URLs, provided as a
+ * convenience for implementing an {@link EmbedConfig}'s `parseUrl`.
+ */
 const URL_MATCHER = /((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;
+
+/**
+ * Command dispatched to start inserting an embed. Its payload is the `type` of
+ * the {@link EmbedConfig} to use; {@link LexicalAutoEmbedPlugin} listens for it
+ * and runs that config's URL detection flow.
+ */
 const INSERT_EMBED_COMMAND = /* @__PURE__ */lexical.createCommand('INSERT_EMBED_COMMAND');
+
+/**
+ * A {@link MenuOption} for the auto-embed menu, pairing a display `title` with
+ * an `onSelect` callback invoked when the user chooses to embed the detected
+ * URL.
+ */
 class AutoEmbedOption extends LexicalNodeMenuPlugin.MenuOption {
   title;
   onSelect;
@@ -78,7 +93,7 @@ function LexicalAutoEmbedPlugin({
     setActiveEmbedConfig(null);
   }, []);
   const checkIfLinkNodeIsEmbeddable = react.useCallback(async key => {
-    const url = editor.getEditorState().read(function () {
+    const url = editor.read('latest', function () {
       const linkNode = lexical.$getNodeByKey(key);
       if (link.$isLinkNode(linkNode)) {
         return linkNode.getURL();
@@ -108,7 +123,7 @@ function LexicalAutoEmbedPlugin({
         }
       }
     };
-    return utils.mergeRegister(...[link.LinkNode, link.AutoLinkNode].map(Klass => editor.registerMutationListener(Klass, (...args) => listener(...args), {
+    return lexical.mergeRegister(...[link.LinkNode, link.AutoLinkNode].map(Klass => editor.registerMutationListener(Klass, (...args) => listener(...args), {
       skipInitialization: true
     })));
   }, [checkIfLinkNodeIsEmbeddable, editor, nodeKey, reset]);
@@ -127,7 +142,7 @@ function LexicalAutoEmbedPlugin({
   }, [editor, embedConfigs, onOpenEmbedModalForConfig]);
   const embedLinkViaActiveEmbedConfig = react.useCallback(async function () {
     if (activeEmbedConfig != null && nodeKey != null) {
-      const linkNode = editor.getEditorState().read(() => {
+      const linkNode = editor.read('latest', () => {
         const node = lexical.$getNodeByKey(nodeKey);
         if (link.$isLinkNode(node)) {
           return node;

package/dist/LexicalAutoEmbedPlugin.dev.mjs

@@ -9,8 +9,7 @@
 import { $isLinkNode, LinkNode, AutoLinkNode } from '@lexical/link';
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
 import { MenuOption, LexicalNodeMenuPlugin } from '@lexical/react/LexicalNodeMenuPlugin';
-import { mergeRegister } from '@lexical/utils';
-import { createCommand, $getNodeByKey, COMMAND_PRIORITY_EDITOR, $getSelection, COMMAND_PRIORITY_LOW, PASTE_TAG } from 'lexical';
+import { createCommand, $getNodeByKey, mergeRegister, COMMAND_PRIORITY_EDITOR, $getSelection, COMMAND_PRIORITY_LOW, PASTE_TAG } from 'lexical';
 import { useState, useCallback, useEffect, useMemo } from 'react';
 import { jsx } from 'react/jsx-runtime';
 
@@ -22,8 +21,24 @@ import { jsx } from 'react/jsx-runtime';
  *
  */
 
+/**
+ * A general-purpose regular expression for detecting URLs, provided as a
+ * convenience for implementing an {@link EmbedConfig}'s `parseUrl`.
+ */
 const URL_MATCHER = /((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;
+
+/**
+ * Command dispatched to start inserting an embed. Its payload is the `type` of
+ * the {@link EmbedConfig} to use; {@link LexicalAutoEmbedPlugin} listens for it
+ * and runs that config's URL detection flow.
+ */
 const INSERT_EMBED_COMMAND = /* @__PURE__ */createCommand('INSERT_EMBED_COMMAND');
+
+/**
+ * A {@link MenuOption} for the auto-embed menu, pairing a display `title` with
+ * an `onSelect` callback invoked when the user chooses to embed the detected
+ * URL.
+ */
 class AutoEmbedOption extends MenuOption {
   title;
   onSelect;
@@ -76,7 +91,7 @@ function LexicalAutoEmbedPlugin({
     setActiveEmbedConfig(null);
   }, []);
   const checkIfLinkNodeIsEmbeddable = useCallback(async key => {
-    const url = editor.getEditorState().read(function () {
+    const url = editor.read('latest', function () {
       const linkNode = $getNodeByKey(key);
       if ($isLinkNode(linkNode)) {
         return linkNode.getURL();
@@ -125,7 +140,7 @@ function LexicalAutoEmbedPlugin({
   }, [editor, embedConfigs, onOpenEmbedModalForConfig]);
   const embedLinkViaActiveEmbedConfig = useCallback(async function () {
     if (activeEmbedConfig != null && nodeKey != null) {
-      const linkNode = editor.getEditorState().read(() => {
+      const linkNode = editor.read('latest', () => {
         const node = $getNodeByKey(nodeKey);
         if ($isLinkNode(node)) {
           return node;

package/dist/LexicalAutoEmbedPlugin.prod.js

@@ -6,4 +6,4 @@
  *
  */
 
-"use strict";var e=require("@lexical/link"),t=require("@lexical/react/LexicalComposerContext"),n=require("@lexical/react/LexicalNodeMenuPlugin"),i=require("@lexical/utils"),o=require("lexical"),r=require("react"),l=require("react/jsx-runtime");const s=/* @__PURE__ */o.createCommand("INSERT_EMBED_COMMAND");class u extends n.MenuOption{title;onSelect;constructor(e,t){super(e),this.title=e,this.onSelect=t.onSelect.bind(this)}}exports.AutoEmbedOption=u,exports.INSERT_EMBED_COMMAND=s,exports.LexicalAutoEmbedPlugin=function({embedConfigs:u,onOpenEmbedModalForConfig:a,getMenuOptions:c,menuRenderFn:d,menuCommandPriority:m=o.COMMAND_PRIORITY_LOW}){const[p]=t.useLexicalComposerContext(),[f,x]=r.useState(null),[C,M]=r.useState(null),g=r.useCallback(()=>{x(null),M(null)},[]),E=r.useCallback(async t=>{const n=p.getEditorState().read(function(){const n=o.$getNodeByKey(t);if(e.$isLinkNode(n))return n.getURL()});if(void 0!==n)for(const e of u){null!=await Promise.resolve(e.parseUrl(n))&&(M(e),x(t))}},[p,u]);r.useEffect(()=>i.mergeRegister(...[e.LinkNode,e.AutoLinkNode].map(e=>p.registerMutationListener(e,(...e)=>((e,{updateTags:t,dirtyLeaves:n})=>{for(const[i,r]of e)"created"===r&&t.has(o.PASTE_TAG)&&n.size<=3?E(i):i===f&&g()})(...e),{skipInitialization:!0}))),[E,p,f,g]),r.useEffect(()=>{if(a)return p.registerCommand(s,e=>{const t=u.find(({type:t})=>t===e);return!!t&&(a(t),!0)},o.COMMAND_PRIORITY_EDITOR)},[p,u,a]);const N=r.useCallback(async function(){if(null!=C&&null!=f){const t=p.getEditorState().read(()=>{const t=o.$getNodeByKey(f);return e.$isLinkNode(t)?t:null});if(e.$isLinkNode(t)){const e=await Promise.resolve(C.parseUrl(t.__url));null!=e&&p.update(()=>{o.$getSelection()||t.selectEnd(),C.insertNode(p,e),t.isAttached()&&t.remove()})}}},[C,p,f]),L=r.useMemo(()=>null!=C&&null!=f?c(C,N,g):[],[C,N,c,f,g]),A=r.useCallback((e,t,n)=>{p.update(()=>{e.onSelect(t),n()})},[p]);return null!=f?/*#__PURE__*/l.jsx(n.LexicalNodeMenuPlugin,{nodeKey:f,onClose:g,onSelectOption:A,options:L,menuRenderFn:d,commandPriority:m}):null},exports.URL_MATCHER=/((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;
+"use strict";var e=require("@lexical/link"),t=require("@lexical/react/LexicalComposerContext"),n=require("@lexical/react/LexicalNodeMenuPlugin"),o=require("lexical"),i=require("react"),l=require("react/jsx-runtime");const r=/* @__PURE__ */o.createCommand("INSERT_EMBED_COMMAND");class s extends n.MenuOption{title;onSelect;constructor(e,t){super(e),this.title=e,this.onSelect=t.onSelect.bind(this)}}exports.AutoEmbedOption=s,exports.INSERT_EMBED_COMMAND=r,exports.LexicalAutoEmbedPlugin=function({embedConfigs:s,onOpenEmbedModalForConfig:u,getMenuOptions:a,menuRenderFn:c,menuCommandPriority:d=o.COMMAND_PRIORITY_LOW}){const[m]=t.useLexicalComposerContext(),[p,f]=i.useState(null),[C,x]=i.useState(null),M=i.useCallback(()=>{f(null),x(null)},[]),N=i.useCallback(async t=>{const n=m.read("latest",function(){const n=o.$getNodeByKey(t);if(e.$isLinkNode(n))return n.getURL()});if(void 0!==n)for(const e of s){null!=await Promise.resolve(e.parseUrl(n))&&(x(e),f(t))}},[m,s]);i.useEffect(()=>o.mergeRegister(...[e.LinkNode,e.AutoLinkNode].map(e=>m.registerMutationListener(e,(...e)=>((e,{updateTags:t,dirtyLeaves:n})=>{for(const[i,l]of e)"created"===l&&t.has(o.PASTE_TAG)&&n.size<=3?N(i):i===p&&M()})(...e),{skipInitialization:!0}))),[N,m,p,M]),i.useEffect(()=>{if(u)return m.registerCommand(r,e=>{const t=s.find(({type:t})=>t===e);return!!t&&(u(t),!0)},o.COMMAND_PRIORITY_EDITOR)},[m,s,u]);const g=i.useCallback(async function(){if(null!=C&&null!=p){const t=m.read("latest",()=>{const t=o.$getNodeByKey(p);return e.$isLinkNode(t)?t:null});if(e.$isLinkNode(t)){const e=await Promise.resolve(C.parseUrl(t.__url));null!=e&&m.update(()=>{o.$getSelection()||t.selectEnd(),C.insertNode(m,e),t.isAttached()&&t.remove()})}}},[C,m,p]),E=i.useMemo(()=>null!=C&&null!=p?a(C,g,M):[],[C,g,a,p,M]),L=i.useCallback((e,t,n)=>{m.update(()=>{e.onSelect(t),n()})},[m]);return null!=p?/*#__PURE__*/l.jsx(n.LexicalNodeMenuPlugin,{nodeKey:p,onClose:M,onSelectOption:L,options:E,menuRenderFn:c,commandPriority:d}):null},exports.URL_MATCHER=/((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;

package/dist/LexicalAutoEmbedPlugin.prod.mjs

@@ -6,4 +6,4 @@
  *
  */
 
-import{$isLinkNode as e,LinkNode as t,AutoLinkNode as n}from"@lexical/link";import{useLexicalComposerContext as o}from"@lexical/react/LexicalComposerContext";import{MenuOption as r,LexicalNodeMenuPlugin as i}from"@lexical/react/LexicalNodeMenuPlugin";import{mergeRegister as l}from"@lexical/utils";import{createCommand as s,$getNodeByKey as a,COMMAND_PRIORITY_EDITOR as c,$getSelection as u,COMMAND_PRIORITY_LOW as m,PASTE_TAG as d}from"lexical";import{useState as p,useCallback as f,useEffect as x,useMemo as g}from"react";import{jsx as w}from"react/jsx-runtime";const C=/((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/,S=/* @__PURE__ */s("INSERT_EMBED_COMMAND");class y extends r{title;onSelect;constructor(e,t){super(e),this.title=e,this.onSelect=t.onSelect.bind(this)}}function E({embedConfigs:r,onOpenEmbedModalForConfig:s,getMenuOptions:C,menuRenderFn:y,menuCommandPriority:E=m}){const[M]=o(),[h,_]=p(null),[v,z]=p(null),A=f(()=>{_(null),z(null)},[]),L=f(async t=>{const n=M.getEditorState().read(function(){const n=a(t);if(e(n))return n.getURL()});if(void 0!==n)for(const e of r){null!=await Promise.resolve(e.parseUrl(n))&&(z(e),_(t))}},[M,r]);x(()=>l(...[t,n].map(e=>M.registerMutationListener(e,(...e)=>((e,{updateTags:t,dirtyLeaves:n})=>{for(const[o,r]of e)"created"===r&&t.has(d)&&n.size<=3?L(o):o===h&&A()})(...e),{skipInitialization:!0}))),[L,M,h,A]),x(()=>{if(s)return M.registerCommand(S,e=>{const t=r.find(({type:t})=>t===e);return!!t&&(s(t),!0)},c)},[M,r,s]);const P=f(async function(){if(null!=v&&null!=h){const t=M.getEditorState().read(()=>{const t=a(h);return e(t)?t:null});if(e(t)){const e=await Promise.resolve(v.parseUrl(t.__url));null!=e&&M.update(()=>{u()||t.selectEnd(),v.insertNode(M,e),t.isAttached()&&t.remove()})}}},[v,M,h]),b=g(()=>null!=v&&null!=h?C(v,P,A):[],[v,P,C,h,A]),N=f((e,t,n)=>{M.update(()=>{e.onSelect(t),n()})},[M]);return null!=h?/*#__PURE__*/w(i,{nodeKey:h,onClose:A,onSelectOption:N,options:b,menuRenderFn:y,commandPriority:E}):null}export{y as AutoEmbedOption,S as INSERT_EMBED_COMMAND,E as LexicalAutoEmbedPlugin,C as URL_MATCHER};
+import{$isLinkNode as e,LinkNode as t,AutoLinkNode as n}from"@lexical/link";import{useLexicalComposerContext as o}from"@lexical/react/LexicalComposerContext";import{MenuOption as r,LexicalNodeMenuPlugin as i}from"@lexical/react/LexicalNodeMenuPlugin";import{createCommand as l,$getNodeByKey as s,mergeRegister as a,COMMAND_PRIORITY_EDITOR as c,$getSelection as u,COMMAND_PRIORITY_LOW as m,PASTE_TAG as d}from"lexical";import{useState as p,useCallback as f,useEffect as x,useMemo as g}from"react";import{jsx as w}from"react/jsx-runtime";const C=/((https?:\/\/(www\.)?)|(www\.))[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/,y=/* @__PURE__ */l("INSERT_EMBED_COMMAND");class M extends r{title;onSelect;constructor(e,t){super(e),this.title=e,this.onSelect=t.onSelect.bind(this)}}function h({embedConfigs:r,onOpenEmbedModalForConfig:l,getMenuOptions:C,menuRenderFn:M,menuCommandPriority:h=m}){const[S]=o(),[_,v]=p(null),[z,A]=p(null),E=f(()=>{v(null),A(null)},[]),L=f(async t=>{const n=S.read("latest",function(){const n=s(t);if(e(n))return n.getURL()});if(void 0!==n)for(const e of r){null!=await Promise.resolve(e.parseUrl(n))&&(A(e),v(t))}},[S,r]);x(()=>a(...[t,n].map(e=>S.registerMutationListener(e,(...e)=>((e,{updateTags:t,dirtyLeaves:n})=>{for(const[o,r]of e)"created"===r&&t.has(d)&&n.size<=3?L(o):o===_&&E()})(...e),{skipInitialization:!0}))),[L,S,_,E]),x(()=>{if(l)return S.registerCommand(y,e=>{const t=r.find(({type:t})=>t===e);return!!t&&(l(t),!0)},c)},[S,r,l]);const P=f(async function(){if(null!=z&&null!=_){const t=S.read("latest",()=>{const t=s(_);return e(t)?t:null});if(e(t)){const e=await Promise.resolve(z.parseUrl(t.__url));null!=e&&S.update(()=>{u()||t.selectEnd(),z.insertNode(S,e),t.isAttached()&&t.remove()})}}},[z,S,_]),b=g(()=>null!=z&&null!=_?C(z,P,E):[],[z,P,C,_,E]),N=f((e,t,n)=>{S.update(()=>{e.onSelect(t),n()})},[S]);return null!=_?/*#__PURE__*/w(i,{nodeKey:_,onClose:E,onSelectOption:N,options:b,menuRenderFn:M,commandPriority:h}):null}export{M as AutoEmbedOption,y as INSERT_EMBED_COMMAND,h as LexicalAutoEmbedPlugin,C as URL_MATCHER};

package/dist/LexicalAutoFocusPlugin.d.ts

@@ -8,5 +8,15 @@
 type Props = {
     defaultSelection?: 'rootStart' | 'rootEnd';
 };
+/**
+ * Focuses the editor when the component is mounted. Pass `defaultSelection`
+ * to control whether the selection is placed at the start (`'rootStart'`) or
+ * end (`'rootEnd'`) of the root when there is no existing selection to restore.
+ *
+ * This is a legacy plugin. When building an editor with the extension API,
+ * configure {@link AutoFocusExtension} instead.
+ *
+ * @returns `null`, this plugin renders no DOM of its own.
+ */
 export declare function AutoFocusPlugin({ defaultSelection }: Props): null;
 export {};

package/dist/LexicalAutoFocusPlugin.dev.js

@@ -9,6 +9,7 @@
 'use strict';
 
 var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
+var lexical = require('lexical');
 var react = require('react');
 
 /**
@@ -19,6 +20,16 @@ var react = require('react');
  *
  */
 
+/**
+ * Focuses the editor when the component is mounted. Pass `defaultSelection`
+ * to control whether the selection is placed at the start (`'rootStart'`) or
+ * end (`'rootEnd'`) of the root when there is no existing selection to restore.
+ *
+ * This is a legacy plugin. When building an editor with the extension API,
+ * configure {@link AutoFocusExtension} instead.
+ *
+ * @returns `null`, this plugin renders no DOM of its own.
+ */
 function AutoFocusPlugin({
   defaultSelection
 }) {
@@ -29,8 +40,10 @@ function AutoFocusPlugin({
       // trigger a re-focus on the element. So in the case this occurs, we'll need to correct it.
       // Normally this is fine, Selection API !== Focus API, but fore the intents of the naming
       // of this plugin, which should preserve focus too.
-      const activeElement = document.activeElement;
       const rootElement = editor.getRootElement();
+      // getActiveElement rather than document.activeElement, which reports
+      // the shadow host when the editor is in a shadow root.
+      const activeElement = rootElement !== null ? lexical.getActiveElement(rootElement) : null;
       if (rootElement !== null && (activeElement === null || !rootElement.contains(activeElement))) {
         // Note: preventScroll won't work in Webkit.
         rootElement.focus({

package/dist/LexicalAutoFocusPlugin.dev.mjs

@@ -7,6 +7,7 @@
  */
 
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { getActiveElement } from 'lexical';
 import { useEffect } from 'react';
 
 /**
@@ -17,6 +18,16 @@ import { useEffect } from 'react';
  *
  */
 
+/**
+ * Focuses the editor when the component is mounted. Pass `defaultSelection`
+ * to control whether the selection is placed at the start (`'rootStart'`) or
+ * end (`'rootEnd'`) of the root when there is no existing selection to restore.
+ *
+ * This is a legacy plugin. When building an editor with the extension API,
+ * configure {@link AutoFocusExtension} instead.
+ *
+ * @returns `null`, this plugin renders no DOM of its own.
+ */
 function AutoFocusPlugin({
   defaultSelection
 }) {
@@ -27,8 +38,10 @@ function AutoFocusPlugin({
       // trigger a re-focus on the element. So in the case this occurs, we'll need to correct it.
       // Normally this is fine, Selection API !== Focus API, but fore the intents of the naming
       // of this plugin, which should preserve focus too.
-      const activeElement = document.activeElement;
       const rootElement = editor.getRootElement();
+      // getActiveElement rather than document.activeElement, which reports
+      // the shadow host when the editor is in a shadow root.
+      const activeElement = rootElement !== null ? getActiveElement(rootElement) : null;
       if (rootElement !== null && (activeElement === null || !rootElement.contains(activeElement))) {
         // Note: preventScroll won't work in Webkit.
         rootElement.focus({

package/dist/LexicalAutoFocusPlugin.prod.js

@@ -6,4 +6,4 @@
  *
  */
 
-"use strict";var e=require("@lexical/react/LexicalComposerContext"),t=require("react");exports.AutoFocusPlugin=function({defaultSelection:o}){const[c]=e.useLexicalComposerContext();return t.useEffect(()=>{c.focus(()=>{const e=document.activeElement,t=c.getRootElement();null===t||null!==e&&t.contains(e)||t.focus({preventScroll:!0})},{defaultSelection:o})},[o,c]),null};
+"use strict";var e=require("@lexical/react/LexicalComposerContext"),t=require("lexical"),l=require("react");exports.AutoFocusPlugin=function({defaultSelection:n}){const[o]=e.useLexicalComposerContext();return l.useEffect(()=>{o.focus(()=>{const e=o.getRootElement(),l=null!==e?t.getActiveElement(e):null;null===e||null!==l&&e.contains(l)||e.focus({preventScroll:!0})},{defaultSelection:n})},[n,o]),null};

package/dist/LexicalAutoFocusPlugin.prod.mjs

@@ -6,4 +6,4 @@
  *
  */
 
-import{useLexicalComposerContext as e}from"@lexical/react/LexicalComposerContext";import{useEffect as t}from"react";function o({defaultSelection:o}){const[l]=e();return t(()=>{l.focus(()=>{const e=document.activeElement,t=l.getRootElement();null===t||null!==e&&t.contains(e)||t.focus({preventScroll:!0})},{defaultSelection:o})},[o,l]),null}export{o as AutoFocusPlugin};
+import{useLexicalComposerContext as l}from"@lexical/react/LexicalComposerContext";import{getActiveElement as o}from"lexical";import{useEffect as t}from"react";function e({defaultSelection:e}){const[n]=l();return t(()=>{n.focus(()=>{const l=n.getRootElement(),t=null!==l?o(l):null;null===l||null!==t&&l.contains(t)||l.focus({preventScroll:!0})},{defaultSelection:e})},[e,n]),null}export{e as AutoFocusPlugin};

package/dist/LexicalAutoLinkPlugin.d.ts

@@ -9,6 +9,19 @@ import type { ChangeHandler, LinkMatcher } from '@lexical/link';
 import type { ElementNode } from 'lexical';
 import type { JSX } from 'react';
 export { type ChangeHandler, createLinkMatcherWithRegExp, type LinkMatcher, } from '@lexical/link';
+/**
+ * Automatically converts text that matches one of the provided `matchers` into
+ * {@link AutoLinkNode}s as the user types, and reverts them back to plain text
+ * when they no longer match. Provide `onChange` to react to links being
+ * created, updated, or removed, and `excludeParents` to skip matching inside
+ * particular ancestor nodes. The editor must have the {@link AutoLinkNode}
+ * registered.
+ *
+ * This is a legacy plugin. When building an editor with the extension API,
+ * configure {@link AutoLinkExtension} instead.
+ *
+ * @returns `null`, this plugin renders no DOM of its own.
+ */
 export declare function AutoLinkPlugin({ matchers, onChange, excludeParents, }: {
     matchers: LinkMatcher[];
     onChange?: ChangeHandler;

package/dist/LexicalAutoLinkPlugin.dev.js

@@ -42,6 +42,20 @@ function useAutoLink(editor, matchers, onChange, excludeParents) {
     });
   }, [editor, matchers, onChange, excludeParents]);
 }
+
+/**
+ * Automatically converts text that matches one of the provided `matchers` into
+ * {@link AutoLinkNode}s as the user types, and reverts them back to plain text
+ * when they no longer match. Provide `onChange` to react to links being
+ * created, updated, or removed, and `excludeParents` to skip matching inside
+ * particular ancestor nodes. The editor must have the {@link AutoLinkNode}
+ * registered.
+ *
+ * This is a legacy plugin. When building an editor with the extension API,
+ * configure {@link AutoLinkExtension} instead.
+ *
+ * @returns `null`, this plugin renders no DOM of its own.
+ */
 function AutoLinkPlugin({
   matchers,
   onChange,

package/dist/LexicalAutoLinkPlugin.dev.mjs

@@ -41,6 +41,20 @@ function useAutoLink(editor, matchers, onChange, excludeParents) {
     });
   }, [editor, matchers, onChange, excludeParents]);
 }
+
+/**
+ * Automatically converts text that matches one of the provided `matchers` into
+ * {@link AutoLinkNode}s as the user types, and reverts them back to plain text
+ * when they no longer match. Provide `onChange` to react to links being
+ * created, updated, or removed, and `excludeParents` to skip matching inside
+ * particular ancestor nodes. The editor must have the {@link AutoLinkNode}
+ * registered.
+ *
+ * This is a legacy plugin. When building an editor with the extension API,
+ * configure {@link AutoLinkExtension} instead.
+ *
+ * @returns `null`, this plugin renders no DOM of its own.
+ */
 function AutoLinkPlugin({
   matchers,
   onChange,

package/dist/LexicalBlockWithAlignableContents.d.ts

@@ -17,5 +17,14 @@ type Props = Readonly<{
         focus: string;
     }>;
 }>;
+/**
+ * A wrapper component for the contents of a {@link DecoratorBlockNode} that
+ * keeps the block in sync with node selection and element alignment. It renders
+ * its `children` inside a container that reflects the node's `format`
+ * alignment, responds to `FORMAT_ELEMENT_COMMAND` to update that alignment, and
+ * toggles the node's selection when the container is clicked.
+ *
+ * @returns The element to render for the decorator block.
+ */
 export declare function BlockWithAlignableContents({ children, format, nodeKey, className, }: Props): JSX.Element;
 export {};

package/dist/LexicalBlockWithAlignableContents.dev.js

@@ -24,6 +24,15 @@ var jsxRuntime = require('react/jsx-runtime');
  *
  */
 
+/**
+ * A wrapper component for the contents of a {@link DecoratorBlockNode} that
+ * keeps the block in sync with node selection and element alignment. It renders
+ * its `children` inside a container that reflects the node's `format`
+ * alignment, responds to `FORMAT_ELEMENT_COMMAND` to update that alignment, and
+ * toggles the node's selection when the container is clicked.
+ *
+ * @returns The element to render for the decorator block.
+ */
 function BlockWithAlignableContents({
   children,
   format,
@@ -34,7 +43,7 @@ function BlockWithAlignableContents({
   const [isSelected, setSelected, clearSelection] = useLexicalNodeSelection.useLexicalNodeSelection(nodeKey);
   const ref = react.useRef(null);
   react.useEffect(() => {
-    return utils.mergeRegister(editor.registerCommand(lexical.FORMAT_ELEMENT_COMMAND, formatType => {
+    return lexical.mergeRegister(editor.registerCommand(lexical.FORMAT_ELEMENT_COMMAND, formatType => {
       if (isSelected) {
         const selection = lexical.$getSelection();
         if (lexical.$isNodeSelection(selection)) {
@@ -57,7 +66,7 @@ function BlockWithAlignableContents({
       }
       return false;
     }, lexical.COMMAND_PRIORITY_LOW), editor.registerCommand(lexical.CLICK_COMMAND, event => {
-      if (event.target === ref.current) {
+      if (lexical.getComposedEventTarget(event) === ref.current) {
         event.preventDefault();
         if (!event.shiftKey) {
           clearSelection();

package/dist/LexicalBlockWithAlignableContents.dev.mjs

@@ -9,8 +9,8 @@
 import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
 import { $isDecoratorBlockNode } from '@lexical/react/LexicalDecoratorBlockNode';
 import { useLexicalNodeSelection } from '@lexical/react/useLexicalNodeSelection';
-import { mergeRegister, $getNearestBlockElementAncestorOrThrow } from '@lexical/utils';
-import { FORMAT_ELEMENT_COMMAND, $getSelection, $isNodeSelection, $getNodeByKey, $isRangeSelection, COMMAND_PRIORITY_LOW, CLICK_COMMAND } from 'lexical';
+import { $getNearestBlockElementAncestorOrThrow } from '@lexical/utils';
+import { mergeRegister, FORMAT_ELEMENT_COMMAND, $getSelection, $isNodeSelection, $getNodeByKey, $isRangeSelection, COMMAND_PRIORITY_LOW, CLICK_COMMAND, getComposedEventTarget } from 'lexical';
 import { useRef, useEffect } from 'react';
 import { jsx } from 'react/jsx-runtime';
 
@@ -22,6 +22,15 @@ import { jsx } from 'react/jsx-runtime';
  *
  */
 
+/**
+ * A wrapper component for the contents of a {@link DecoratorBlockNode} that
+ * keeps the block in sync with node selection and element alignment. It renders
+ * its `children` inside a container that reflects the node's `format`
+ * alignment, responds to `FORMAT_ELEMENT_COMMAND` to update that alignment, and
+ * toggles the node's selection when the container is clicked.
+ *
+ * @returns The element to render for the decorator block.
+ */
 function BlockWithAlignableContents({
   children,
   format,
@@ -55,7 +64,7 @@ function BlockWithAlignableContents({
       }
       return false;
     }, COMMAND_PRIORITY_LOW), editor.registerCommand(CLICK_COMMAND, event => {
-      if (event.target === ref.current) {
+      if (getComposedEventTarget(event) === ref.current) {
         event.preventDefault();
         if (!event.shiftKey) {
           clearSelection();

package/dist/LexicalBlockWithAlignableContents.prod.js

@@ -6,4 +6,4 @@
  *
  */
 
-"use strict";var e=require("@lexical/react/LexicalComposerContext"),t=require("@lexical/react/LexicalDecoratorBlockNode"),r=require("@lexical/react/useLexicalNodeSelection"),o=require("@lexical/utils"),i=require("lexical"),l=require("react"),c=require("react/jsx-runtime");exports.BlockWithAlignableContents=function({children:s,format:a,nodeKey:n,className:u}){const[f]=e.useLexicalComposerContext(),[x,N,d]=r.useLexicalNodeSelection(n),m=l.useRef(null);return l.useEffect(()=>o.mergeRegister(f.registerCommand(i.FORMAT_ELEMENT_COMMAND,e=>{if(x){const r=i.$getSelection();if(i.$isNodeSelection(r)){const r=i.$getNodeByKey(n);t.$isDecoratorBlockNode(r)&&r.setFormat(e)}else if(i.$isRangeSelection(r)){const i=r.getNodes();for(const r of i)if(t.$isDecoratorBlockNode(r))r.setFormat(e);else{o.$getNearestBlockElementAncestorOrThrow(r).setFormat(e)}}return!0}return!1},i.COMMAND_PRIORITY_LOW),f.registerCommand(i.CLICK_COMMAND,e=>e.target===m.current&&(e.preventDefault(),e.shiftKey||d(),N(!x),!0),i.COMMAND_PRIORITY_LOW)),[d,f,x,n,N]),/*#__PURE__*/c.jsx("div",{className:[u.base,x?u.focus:null].filter(Boolean).join(" "),ref:m,style:{textAlign:a||void 0},children:s})};
+"use strict";var e=require("@lexical/react/LexicalComposerContext"),t=require("@lexical/react/LexicalDecoratorBlockNode"),r=require("@lexical/react/useLexicalNodeSelection"),o=require("@lexical/utils"),i=require("lexical"),l=require("react"),c=require("react/jsx-runtime");exports.BlockWithAlignableContents=function({children:s,format:n,nodeKey:a,className:u}){const[d]=e.useLexicalComposerContext(),[f,m,x]=r.useLexicalNodeSelection(a),N=l.useRef(null);return l.useEffect(()=>i.mergeRegister(d.registerCommand(i.FORMAT_ELEMENT_COMMAND,e=>{if(f){const r=i.$getSelection();if(i.$isNodeSelection(r)){const r=i.$getNodeByKey(a);t.$isDecoratorBlockNode(r)&&r.setFormat(e)}else if(i.$isRangeSelection(r)){const i=r.getNodes();for(const r of i)if(t.$isDecoratorBlockNode(r))r.setFormat(e);else{o.$getNearestBlockElementAncestorOrThrow(r).setFormat(e)}}return!0}return!1},i.COMMAND_PRIORITY_LOW),d.registerCommand(i.CLICK_COMMAND,e=>i.getComposedEventTarget(e)===N.current&&(e.preventDefault(),e.shiftKey||x(),m(!f),!0),i.COMMAND_PRIORITY_LOW)),[x,d,f,a,m]),/*#__PURE__*/c.jsx("div",{className:[u.base,f?u.focus:null].filter(Boolean).join(" "),ref:N,style:{textAlign:n||void 0},children:s})};

package/dist/LexicalBlockWithAlignableContents.prod.mjs

@@ -6,4 +6,4 @@
  *
  */
 
-import{useLexicalComposerContext as e}from"@lexical/react/LexicalComposerContext";import{$isDecoratorBlockNode as t}from"@lexical/react/LexicalDecoratorBlockNode";import{useLexicalNodeSelection as r}from"@lexical/react/useLexicalNodeSelection";import{mergeRegister as o,$getNearestBlockElementAncestorOrThrow as i}from"@lexical/utils";import{FORMAT_ELEMENT_COMMAND as l,$getSelection as a,$isNodeSelection as c,$getNodeByKey as m,$isRangeSelection as n,COMMAND_PRIORITY_LOW as s,CLICK_COMMAND as f}from"lexical";import{useRef as u,useEffect as x}from"react";import{jsx as d}from"react/jsx-runtime";function p({children:p,format:g,nodeKey:N,className:C}){const[h]=e(),[v,y,F]=r(N),L=u(null);return x(()=>o(h.registerCommand(l,e=>{if(v){const r=a();if(c(r)){const r=m(N);t(r)&&r.setFormat(e)}else if(n(r)){const o=r.getNodes();for(const r of o)if(t(r))r.setFormat(e);else{i(r).setFormat(e)}}return!0}return!1},s),h.registerCommand(f,e=>e.target===L.current&&(e.preventDefault(),e.shiftKey||F(),y(!v),!0),s)),[F,h,v,N,y]),/*#__PURE__*/d("div",{className:[C.base,v?C.focus:null].filter(Boolean).join(" "),ref:L,style:{textAlign:g||void 0},children:p})}export{p as BlockWithAlignableContents};
+import{useLexicalComposerContext as e}from"@lexical/react/LexicalComposerContext";import{$isDecoratorBlockNode as r}from"@lexical/react/LexicalDecoratorBlockNode";import{useLexicalNodeSelection as t}from"@lexical/react/useLexicalNodeSelection";import{$getNearestBlockElementAncestorOrThrow as o}from"@lexical/utils";import{mergeRegister as i,FORMAT_ELEMENT_COMMAND as l,$getSelection as c,$isNodeSelection as a,$getNodeByKey as m,$isRangeSelection as n,COMMAND_PRIORITY_LOW as s,CLICK_COMMAND as f,getComposedEventTarget as u}from"lexical";import{useRef as x,useEffect as d}from"react";import{jsx as p}from"react/jsx-runtime";function N({children:N,format:g,nodeKey:C,className:h}){const[v]=e(),[y,F,L]=t(C),j=x(null);return d(()=>i(v.registerCommand(l,e=>{if(y){const t=c();if(a(t)){const t=m(C);r(t)&&t.setFormat(e)}else if(n(t)){const i=t.getNodes();for(const t of i)if(r(t))t.setFormat(e);else{o(t).setFormat(e)}}return!0}return!1},s),v.registerCommand(f,e=>u(e)===j.current&&(e.preventDefault(),e.shiftKey||L(),F(!y),!0),s)),[L,v,y,C,F]),/*#__PURE__*/p("div",{className:[h.base,y?h.focus:null].filter(Boolean).join(" "),ref:j,style:{textAlign:g||void 0},children:N})}export{N as BlockWithAlignableContents};

package/dist/LexicalCharacterLimitPlugin.d.ts

@@ -6,6 +6,16 @@
  *
  */
 import type { JSX } from 'react';
+/**
+ * Tracks the length of the editor's text content against `maxLength` and
+ * renders the number of remaining characters, marking any overflowing text so
+ * it can be styled. Length is measured in either `'UTF-8'` or `'UTF-16'`
+ * (default) code units via the `charset` prop, and the display can be
+ * customized with the `renderer` prop.
+ *
+ * @returns The element produced by `renderer` (by default a `<span>` showing
+ * the number of remaining characters).
+ */
 export declare function CharacterLimitPlugin({ charset, maxLength, renderer, }: {
     charset: 'UTF-8' | 'UTF-16';
     maxLength: number;

package/dist/LexicalCharacterLimitPlugin.dev.js

@@ -46,11 +46,9 @@ function useCharacterLimit(editor, maxCharacters, optional = Object.freeze({}))
     }
   }, [editor]);
   react.useEffect(() => {
-    let text$1 = editor.getEditorState().read(text.$rootTextContent, {
-      editor
-    });
+    let text$1 = editor.read('latest', text.$rootTextContent);
     let lastComputedTextLength = 0;
-    return utils.mergeRegister(editor.registerTextContentListener(currentText => {
+    return lexical.mergeRegister(editor.registerTextContentListener(currentText => {
       text$1 = currentText;
     }), editor.registerUpdateListener(({
       dirtyLeaves,
@@ -145,7 +143,7 @@ function $wrapOverflowedNodes(offset) {
     // below. Element slot values need no special case: their interior is
     // counted leaf-by-leaf like any other subtree.
     const isSlotValueLeaf = lexical.$isLeafNode(node) && lexical.$getSlotHost(node) !== null;
-    const needsOverflowParent = lexical.$isLeafNode(node) && !isSlotValueLeaf && !utils.$findMatchingParent(node, overflow.$isOverflowNode);
+    const needsOverflowParent = lexical.$isLeafNode(node) && !isSlotValueLeaf && !lexical.$findMatchingParent(node, overflow.$isOverflowNode);
     if (overflow.$isOverflowNode(node)) {
       const previousLength = accumulatedLength;
       const nextLength = accumulatedLength + node.getTextContentSize();
@@ -282,6 +280,17 @@ function DefaultRenderer({
     children: remainingCharacters
   });
 }
+
+/**
+ * Tracks the length of the editor's text content against `maxLength` and
+ * renders the number of remaining characters, marking any overflowing text so
+ * it can be styled. Length is measured in either `'UTF-8'` or `'UTF-16'`
+ * (default) code units via the `charset` prop, and the display can be
+ * customized with the `renderer` prop.
+ *
+ * @returns The element produced by `renderer` (by default a `<span>` showing
+ * the number of remaining characters).
+ */
 function CharacterLimitPlugin({
   charset = 'UTF-16',
   maxLength = CHARACTER_LIMIT,

package/dist/LexicalCharacterLimitPlugin.dev.mjs

@@ -10,8 +10,8 @@ import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext
 import { useEffect, useState, useMemo } from 'react';
 import { OverflowNode, $isOverflowNode, $createOverflowNode } from '@lexical/overflow';
 import { $rootTextContent } from '@lexical/text';
-import { mergeRegister, $dfsWithSlots, $findMatchingParent, $unwrapNode } from '@lexical/utils';
-import { HISTORY_MERGE_TAG, DELETE_CHARACTER_COMMAND, $getSelection, $isRangeSelection, $isElementNode, COMMAND_PRIORITY_LOW, $isLeafNode, $getSlotHost, $isTextNode, $setSelection } from 'lexical';
+import { $dfsWithSlots, $unwrapNode } from '@lexical/utils';
+import { mergeRegister, HISTORY_MERGE_TAG, DELETE_CHARACTER_COMMAND, $getSelection, $isRangeSelection, $isElementNode, COMMAND_PRIORITY_LOW, $isLeafNode, $getSlotHost, $findMatchingParent, $isTextNode, $setSelection } from 'lexical';
 import { jsx } from 'react/jsx-runtime';
 
 /**
@@ -44,9 +44,7 @@ function useCharacterLimit(editor, maxCharacters, optional = Object.freeze({}))
     }
   }, [editor]);
   useEffect(() => {
-    let text = editor.getEditorState().read($rootTextContent, {
-      editor
-    });
+    let text = editor.read('latest', $rootTextContent);
     let lastComputedTextLength = 0;
     return mergeRegister(editor.registerTextContentListener(currentText => {
       text = currentText;
@@ -280,6 +278,17 @@ function DefaultRenderer({
     children: remainingCharacters
   });
 }
+
+/**
+ * Tracks the length of the editor's text content against `maxLength` and
+ * renders the number of remaining characters, marking any overflowing text so
+ * it can be styled. Length is measured in either `'UTF-8'` or `'UTF-16'`
+ * (default) code units via the `charset` prop, and the display can be
+ * customized with the `renderer` prop.
+ *
+ * @returns The element produced by `renderer` (by default a `<span>` showing
+ * the number of remaining characters).
+ */
 function CharacterLimitPlugin({
   charset = 'UTF-16',
   maxLength = CHARACTER_LIMIT,

package/dist/LexicalCharacterLimitPlugin.prod.js

@@ -6,5 +6,5 @@
  *
  */
 
-"use strict";var e=require("@lexical/react/LexicalComposerContext"),t=require("react"),n=require("@lexical/overflow"),r=require("@lexical/text"),i=require("@lexical/utils"),o=require("lexical"),s=require("react/jsx-runtime");function l(e,s,l=Object.freeze({})){const{strlen:f=e=>e.length,remainingCharacters:g=()=>{}}=l;t.useEffect(()=>{e.hasNodes([n.OverflowNode])||function(e,...t){const n=new URL("https://lexical.dev/docs/error"),r=new URLSearchParams;r.append("code",e);for(const e of t)r.append("v",e);throw n.search=r.toString(),Error(`Minified Lexical error #${e}; visit ${n.toString()} for the full message or use the non-minified dev environment for full errors and additional helpful warnings.`)}(57)},[e]),t.useEffect(()=>{let t=e.getEditorState().read(r.$rootTextContent,{editor:e}),l=0;return i.mergeRegister(e.registerTextContentListener(e=>{t=e}),e.registerUpdateListener(({dirtyLeaves:r,dirtyElements:d})=>{const u=e.isComposing(),h=r.size>0||d.size>0;if(u||!h)return;const m=f(t),x=m>s||null!==l&&l>s;if(g(s-m),null===l||x){const r=function(e,t,n){let r=0,i=0;if("function"==typeof Intl.Segmenter){const o=(new Intl.Segmenter).segment(e);for(const{segment:e}of o){const o=i+n(e);if(o>t)break;i=o,r+=e.length}}else{const o=Array.from(e),s=o.length;for(let e=0;e<s;e++){const s=o[e],l=i+n(s);if(l>t)break;i=l,r+=s.length}}return r}(t,s,f);e.update(()=>{!function(e){const t=i.$dfsWithSlots(),r=t.length;let s=0;for(let l=0;l<r;l+=1){const{node:r}=t[l],f=o.$isLeafNode(r)&&null!==o.$getSlotHost(r),g=o.$isLeafNode(r)&&!f&&!i.$findMatchingParent(r,n.$isOverflowNode);if(n.$isOverflowNode(r)){const t=s;if(s+r.getTextContentSize()<=e){const e=r.getParent(),t=r.getPreviousSibling(),n=r.getNextSibling();i.$unwrapNode(r);const s=o.$getSelection();!o.$isRangeSelection(s)||s.anchor.getNode().isAttached()&&s.focus.getNode().isAttached()||(o.$isTextNode(t)?t.select():o.$isTextNode(n)?n.select():null!==e&&e.select())}else if(t<e){const n=r.getFirstDescendant(),s=t+(null!==n?n.getTextContentSize():0);(o.$isTextNode(n)&&n.isSimpleText()||s<=e)&&i.$unwrapNode(r)}}else if(f)s+=r.getTextContentSize();else if(g){const t=s;if(s+=r.getTextContentSize(),s>e&&!n.$isOverflowNode(r.getParent())){const n=o.$getSelection();let i;if(t<e&&o.$isTextNode(r)&&r.isSimpleText()){const[,n]=r.splitText(e-t);i=c(n)}else i=c(r);null!==n&&o.$setSelection(n),a(i)}}}}(r)},{tag:o.HISTORY_MERGE_TAG})}l=m}),e.registerCommand(o.DELETE_CHARACTER_COMMAND,e=>{const t=o.$getSelection();if(!o.$isRangeSelection(t))return!1;const n=t.anchor.getNode().getParent(),r=n?n.getParent():null,i=r?r.getNextSibling():null;return t.deleteCharacter(e),r&&r.isEmpty()?r.remove():o.$isElementNode(i)&&i.isEmpty()&&i.remove(),!0},o.COMMAND_PRIORITY_LOW))},[e,s,g,f])}function c(e){const t=n.$createOverflowNode();return e.replace(t),t.append(e),t}function a(e){const t=e.getPreviousSibling();if(!n.$isOverflowNode(t))return;const r=e.getFirstChild(),i=t.getChildren(),s=i.length;if(null===r)e.append(...i);else for(let e=0;e<s;e++)r.insertBefore(i[e]);const l=o.$getSelection();if(o.$isRangeSelection(l)){const n=l.anchor,r=n.getNode(),i=l.focus,o=n.getNode();r.is(t)?n.set(e.getKey(),n.offset,"element"):r.is(e)&&n.set(e.getKey(),s+n.offset,"element"),o.is(t)?i.set(e.getKey(),i.offset,"element"):o.is(e)&&i.set(e.getKey(),s+i.offset,"element")}t.remove()}let f=null;function g(e){const t=void 0===window.TextEncoder?null:(null===f&&(f=new window.TextEncoder),f);if(null===t){const t=encodeURIComponent(e).match(/%[89ABab]/g);return e.length+(t?t.length:0)}return t.encode(e).length}function d({remainingCharacters:e}){/*#__PURE__*/
-return s.jsx("span",{className:"characters-limit "+(e<0?"characters-limit-exceeded":""),children:e})}exports.CharacterLimitPlugin=function({charset:n="UTF-16",maxLength:r=5,renderer:i=d}){const[o]=e.useLexicalComposerContext(),[s,c]=t.useState(r),a=t.useMemo(()=>({remainingCharacters:c,strlen:e=>{if("UTF-8"===n)return g(e);if("UTF-16"===n)return e.length;throw new Error("Unrecognized charset")}}),[n]);return l(o,r,a),i({remainingCharacters:s})};
+"use strict";var e=require("@lexical/react/LexicalComposerContext"),t=require("react"),n=require("@lexical/overflow"),r=require("@lexical/text"),i=require("@lexical/utils"),o=require("lexical"),s=require("react/jsx-runtime");function l(e,s,l=Object.freeze({})){const{strlen:f=e=>e.length,remainingCharacters:g=()=>{}}=l;t.useEffect(()=>{e.hasNodes([n.OverflowNode])||function(e,...t){const n=new URL("https://lexical.dev/docs/error"),r=new URLSearchParams;r.append("code",e);for(const e of t)r.append("v",e);throw n.search=r.toString(),Error(`Minified Lexical error #${e}; visit ${n.toString()} for the full message or use the non-minified dev environment for full errors and additional helpful warnings.`)}(57)},[e]),t.useEffect(()=>{let t=e.read("latest",r.$rootTextContent),l=0;return o.mergeRegister(e.registerTextContentListener(e=>{t=e}),e.registerUpdateListener(({dirtyLeaves:r,dirtyElements:u})=>{const d=e.isComposing(),h=r.size>0||u.size>0;if(d||!h)return;const m=f(t),x=m>s||null!==l&&l>s;if(g(s-m),null===l||x){const r=function(e,t,n){let r=0,i=0;if("function"==typeof Intl.Segmenter){const o=(new Intl.Segmenter).segment(e);for(const{segment:e}of o){const o=i+n(e);if(o>t)break;i=o,r+=e.length}}else{const o=Array.from(e),s=o.length;for(let e=0;e<s;e++){const s=o[e],l=i+n(s);if(l>t)break;i=l,r+=s.length}}return r}(t,s,f);e.update(()=>{!function(e){const t=i.$dfsWithSlots(),r=t.length;let s=0;for(let l=0;l<r;l+=1){const{node:r}=t[l],f=o.$isLeafNode(r)&&null!==o.$getSlotHost(r),g=o.$isLeafNode(r)&&!f&&!o.$findMatchingParent(r,n.$isOverflowNode);if(n.$isOverflowNode(r)){const t=s;if(s+r.getTextContentSize()<=e){const e=r.getParent(),t=r.getPreviousSibling(),n=r.getNextSibling();i.$unwrapNode(r);const s=o.$getSelection();!o.$isRangeSelection(s)||s.anchor.getNode().isAttached()&&s.focus.getNode().isAttached()||(o.$isTextNode(t)?t.select():o.$isTextNode(n)?n.select():null!==e&&e.select())}else if(t<e){const n=r.getFirstDescendant(),s=t+(null!==n?n.getTextContentSize():0);(o.$isTextNode(n)&&n.isSimpleText()||s<=e)&&i.$unwrapNode(r)}}else if(f)s+=r.getTextContentSize();else if(g){const t=s;if(s+=r.getTextContentSize(),s>e&&!n.$isOverflowNode(r.getParent())){const n=o.$getSelection();let i;if(t<e&&o.$isTextNode(r)&&r.isSimpleText()){const[,n]=r.splitText(e-t);i=c(n)}else i=c(r);null!==n&&o.$setSelection(n),a(i)}}}}(r)},{tag:o.HISTORY_MERGE_TAG})}l=m}),e.registerCommand(o.DELETE_CHARACTER_COMMAND,e=>{const t=o.$getSelection();if(!o.$isRangeSelection(t))return!1;const n=t.anchor.getNode().getParent(),r=n?n.getParent():null,i=r?r.getNextSibling():null;return t.deleteCharacter(e),r&&r.isEmpty()?r.remove():o.$isElementNode(i)&&i.isEmpty()&&i.remove(),!0},o.COMMAND_PRIORITY_LOW))},[e,s,g,f])}function c(e){const t=n.$createOverflowNode();return e.replace(t),t.append(e),t}function a(e){const t=e.getPreviousSibling();if(!n.$isOverflowNode(t))return;const r=e.getFirstChild(),i=t.getChildren(),s=i.length;if(null===r)e.append(...i);else for(let e=0;e<s;e++)r.insertBefore(i[e]);const l=o.$getSelection();if(o.$isRangeSelection(l)){const n=l.anchor,r=n.getNode(),i=l.focus,o=n.getNode();r.is(t)?n.set(e.getKey(),n.offset,"element"):r.is(e)&&n.set(e.getKey(),s+n.offset,"element"),o.is(t)?i.set(e.getKey(),i.offset,"element"):o.is(e)&&i.set(e.getKey(),s+i.offset,"element")}t.remove()}let f=null;function g(e){const t=void 0===window.TextEncoder?null:(null===f&&(f=new window.TextEncoder),f);if(null===t){const t=encodeURIComponent(e).match(/%[89ABab]/g);return e.length+(t?t.length:0)}return t.encode(e).length}function u({remainingCharacters:e}){/*#__PURE__*/
+return s.jsx("span",{className:"characters-limit "+(e<0?"characters-limit-exceeded":""),children:e})}exports.CharacterLimitPlugin=function({charset:n="UTF-16",maxLength:r=5,renderer:i=u}){const[o]=e.useLexicalComposerContext(),[s,c]=t.useState(r),a=t.useMemo(()=>({remainingCharacters:c,strlen:e=>{if("UTF-8"===n)return g(e);if("UTF-16"===n)return e.length;throw new Error("Unrecognized charset")}}),[n]);return l(o,r,a),i({remainingCharacters:s})};