@lexical/react 0.1.9 → 0.1.12

package/LexicalCharacterLimitPlugin.js.flow

@@ -0,0 +1,12 @@
+/**
+ * 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.
+ *
+ * @flow strict
+ */
+
+declare export default function LexicalCharacterLimitPlugin(props: {
+  charset: 'UTF-8' | 'UTF-16',
+}): React$Node;

package/LexicalCharacterLimitPlugin.prod.js

@@ -4,11 +4,12 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var l=require("@lexical/react/LexicalComposerContext"),p=require("react"),q=require("lexical"),r=require("@lexical/react/withSubscriptions"),t=require("lexical/OverflowNode");function u(a,e){for(e(a);null!==a;){if(q.$isElementNode(a)&&0<a.getChildrenSize())a=a.getFirstChild();else{let f=null;for(;null===f&&null!==a;)f=a.getNextSibling(),a=null===f?a.getParent():f}null!==a&&(a=e(a))}}function w(){return q.$getRoot().getTextContent()}
-function x(a,e,f=Object.freeze({})){const {strlen:h=c=>c.length,remainingCharacters:d=()=>{}}=f;p.useEffect(()=>{if(!a.hasNodes([t.OverflowNode]))throw Error("Minified Lexical error #58; see codes.json for the full message or use the non-minified dev environment for full errors and additional helpful warnings.");},[a]);p.useEffect(()=>{let c=a.getEditorState().read(w),b=0;return r(a.addListener("textcontent",g=>{c=g}),a.addListener("update",({dirtyLeaves:g})=>{var k=a.isComposing();g=0<g.size;if(!k&&
-g){k=h(c);g=k>e||null!==b&&b>e;d(e-k);if(null===b||g){const n=y(c,e,h);a.update(()=>{z(n)},{tag:"history-merge"})}b=k}}))},[a,e,d,h])}function y(a,e,f){var h=Intl.Segmenter;let d=0;var c=0;if("function"===typeof h){a=(new h).segment(a);for(var {segment:b}of a){c+=f(b);if(c>e)break;d+=b.length}}else for(b=Array.from(a),a=b.length,h=0;h<a;h++){const g=b[h];c+=f(g);if(c>e)break;d+=g.length}return d}
-function z(a){const e=q.$getRoot();let f=0,h=e;u(e,d=>{if(t.$isOverflowNode(d)){var c=f;if(f+d.getTextContentSize()<=a){var b=d.getParent();c=d.getPreviousSibling();var g=d.getNextSibling();A(d);d=q.$getSelection();null===d||d.anchor.getNode().isAttached()&&d.focus.getNode().isAttached()||(q.$isTextNode(c)?c.select():q.$isTextNode(g)?g.select():null!==b&&b.select());return h}if(c<a&&(b=d.getFirstDescendant(),g=null!==b?b.getTextContentSize():0,c+=g,b=q.$isTextNode(b)&&b.isSimpleText(),c=c<=a,b||c))return A(d),
-h}else if(q.$isLeafNode(d)&&(c=f,f+=d.getTextContentSize(),f>a&&!t.$isOverflowNode(d.getParent())&&(b=q.$getSelection(),c<a&&q.$isTextNode(d)&&d.isSimpleText()?([,c]=d.splitText(a-c),c=B(c)):c=B(d),null!==b&&q.$setSelection(b),b=c,g=b.getPreviousSibling(),t.$isOverflowNode(g)))){var k=b.getFirstChild(),n=g.getChildren();c=n.length;if(null===k)b.append(...n);else for(var m=0;m<c;m++)k.insertBefore(n[m]);m=q.$getSelection();if(null!==m){k=m.anchor;n=k.getNode();m=m.focus;const v=k.getNode();n.is(g)?
-k.set(b.getKey(),k.offset,"element"):n.is(b)&&k.set(b.getKey(),c+k.offset,"element");v.is(g)?m.set(b.getKey(),m.offset,"element"):v.is(b)&&m.set(b.getKey(),c+m.offset,"element")}g.remove()}return h=d})}function B(a){const e=t.$createOverflowNode();a.insertBefore(e);e.append(a);return e}function A(a){const e=a.getChildren(),f=e.length;for(let h=0;h<f;h++)a.insertBefore(e[h]);a.remove();return 0<f?e[f-1]:null}let C=null;
-module.exports=function({charset:a="UTF-16"}){const [e]=l.useLexicalComposerContext(),[f,h]=p.useState(0),d=p.useMemo(()=>({remainingCharacters:h,strlen:c=>{if("UTF-8"===a){if(void 0===window.TextEncoder)var b=null;else null===C&&(C=new window.TextEncoder),b=C;null===b?(b=encodeURIComponent(c).match(/%[89ABab]/g),c=c.length+(b?b.length:0)):c=b.encode(c).length;return c}if("UTF-16"===a)return c.length;throw Error("Unrecognized charset");}}),[a]);x(e,5,d);return p.createElement("span",{className:`characters-limit ${0>
-f?"characters-limit-exceeded":""}`},f)};
+var l=require("@lexical/react/LexicalComposerContext"),w=require("react"),x=require("lexical"),B=require("@lexical/react/withSubscriptions"),C=require("lexical/OverflowNode");function D(){return x.$getRoot().getTextContent()}
+function F(b,d,p=Object.freeze({})){const {strlen:h=e=>e.length,remainingCharacters:r=()=>{}}=p;w.useEffect(()=>{if(!b.hasNodes([C.OverflowNode]))throw Error("Minified Lexical error #58; see codes.json for the full message or use the non-minified dev environment for full errors and additional helpful warnings.");},[b]);w.useEffect(()=>{let e=b.getEditorState().read(D),f=0;return B(b.addListener("textcontent",q=>{e=q}),b.addListener("update",({dirtyLeaves:q})=>{var y=b.isComposing();q=0<q.size;if(!y&&
+q){y=h(e);q=y>d||null!==f&&f>d;r(d-y);if(null===f||q){const u=G(e,d,h);b.update(()=>{const z=[];for(var c=x.$getRoot().getLatest(),A=x.$isElementNode(c)?c.getLastDescendant():c;null!==c&&!c.is(A);)if(z.push(c),x.$isElementNode(c)&&0<c.getChildrenSize())c=c.getFirstChild();else for(var t=null;null===t&&null!==c;)t=c.getNextSibling(),c=null===t?c.getParent():t;null!==c&&c.is(A)&&z.push(c);A=z.length;c=0;for(t=0;t<A;t+=1){var a=z[t];if(C.$isOverflowNode(a)){var g=c;if(c+a.getTextContentSize()<=u){var k=
+a.getParent();g=a.getPreviousSibling();var m=a.getNextSibling();H(a);a=x.$getSelection();!x.$isRangeSelection(a)||a.anchor.getNode().isAttached()&&a.focus.getNode().isAttached()||(x.$isTextNode(g)?g.select():x.$isTextNode(m)?m.select():null!==k&&k.select())}else g<u&&(k=a.getFirstDescendant(),m=null!==k?k.getTextContentSize():0,g+=m,k=x.$isTextNode(k)&&k.isSimpleText(),g=g<=u,(k||g)&&H(a))}else if(x.$isLeafNode(a)&&(g=c,c+=a.getTextContentSize(),c>u&&!C.$isOverflowNode(a.getParent())&&(k=x.$getSelection(),
+g<u&&x.$isTextNode(a)&&a.isSimpleText()?([,a]=a.splitText(u-g),a=I(a)):a=I(a),null!==k&&x.$setSelection(k),g=a.getPreviousSibling(),C.$isOverflowNode(g)))){m=a.getFirstChild();var v=g.getChildren();k=v.length;if(null===m)a.append(...v);else for(var n=0;n<k;n++)m.insertBefore(v[n]);n=x.$getSelection();if(x.$isRangeSelection(n)){m=n.anchor;v=m.getNode();n=n.focus;const E=m.getNode();v.is(g)?m.set(a.getKey(),m.offset,"element"):v.is(a)&&m.set(a.getKey(),k+m.offset,"element");E.is(g)?n.set(a.getKey(),
+n.offset,"element"):E.is(a)&&n.set(a.getKey(),k+n.offset,"element")}g.remove()}}},{tag:"history-merge"})}f=y}}))},[b,d,r,h])}function G(b,d,p){var h=Intl.Segmenter;let r=0;var e=0;if("function"===typeof h){b=(new h).segment(b);for(var {segment:f}of b){e+=p(f);if(e>d)break;r+=f.length}}else for(f=Array.from(b),b=f.length,h=0;h<b;h++){const q=f[h];e+=p(q);if(e>d)break;r+=q.length}return r}function I(b){const d=C.$createOverflowNode();b.insertBefore(d);d.append(b);return d}
+function H(b){const d=b.getChildren(),p=d.length;for(let h=0;h<p;h++)b.insertBefore(d[h]);b.remove();return 0<p?d[p-1]:null}let J=null;
+module.exports=function({charset:b="UTF-16"}){const [d]=l.useLexicalComposerContext(),[p,h]=w.useState(0),r=w.useMemo(()=>({remainingCharacters:h,strlen:e=>{if("UTF-8"===b){if(void 0===window.TextEncoder)var f=null;else null===J&&(J=new window.TextEncoder),f=J;null===f?(f=encodeURIComponent(e).match(/%[89ABab]/g),e=e.length+(f?f.length:0)):e=f.encode(e).length;return e}if("UTF-16"===b)return e.length;throw Error("Unrecognized charset");}}),[b]);F(d,5,r);return w.createElement("span",{className:`characters-limit ${0>
+p?"characters-limit-exceeded":""}`},p)};

package/LexicalClearEditorPlugin.d.ts

@@ -0,0 +1,14 @@
+/**
+ * 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.
+ *
+ * @flow strict
+ */
+
+import {$ReadOnly} from 'utility-types';
+type Props = $ReadOnly<{
+  onClear?: () => void;
+}>;
+export default function LexicalClearEditorPlugin(arg0: Props): React.ReactNode;

package/LexicalClearEditorPlugin.dev.js

@@ -0,0 +1,73 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
+var lexical = require('lexical');
+var react = require('react');
+
+/**
+ * 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.
+ *
+ * 
+ */
+const CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined';
+
+/**
+ * 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.
+ *
+ * 
+ */
+const useLayoutEffectImpl = CAN_USE_DOM ? react.useLayoutEffect : react.useEffect;
+var useLayoutEffect = useLayoutEffectImpl;
+
+/**
+ * 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.
+ *
+ * 
+ */
+function LexicalClearEditorPlugin({
+  onClear
+}) {
+  const [editor] = LexicalComposerContext.useLexicalComposerContext();
+  useLayoutEffect(() => {
+    return editor.addListener('command', (type, payload) => {
+      if (type === 'clearEditor') {
+        editor.update(() => {
+          if (onClear == null) {
+            const root = lexical.$getRoot();
+            const selection = lexical.$getSelection();
+            const paragraph = lexical.$createParagraphNode();
+            root.clear();
+            root.append(paragraph);
+
+            if (selection !== null) {
+              paragraph.select();
+            }
+          } else {
+            onClear();
+          }
+        });
+        return true;
+      }
+
+      return false;
+    }, 0);
+  }, [editor, onClear]);
+  return null;
+}
+
+module.exports = LexicalClearEditorPlugin;

package/LexicalClearEditorPlugin.js

@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict'
+const LexicalClearEditorPlugin = process.env.NODE_ENV === 'development' ? require('./LexicalClearEditorPlugin.dev.js') : require('./LexicalClearEditorPlugin.prod.js')
+module.exports = LexicalClearEditorPlugin;

package/LexicalClearEditorPlugin.js.flow

@@ -0,0 +1,14 @@
+/**
+ * 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.
+ *
+ * @flow strict
+ */
+
+type Props = $ReadOnly<{
+  onClear?: () => void,
+}>;
+
+declare export default function LexicalClearEditorPlugin(Props): React$Node;

package/LexicalClearEditorPlugin.prod.js

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var a=require("@lexical/react/LexicalComposerContext"),d=require("lexical"),g=require("react"),h="undefined"!==typeof window&&"undefined"!==typeof window.document&&"undefined"!==typeof window.document.createElement?g.useLayoutEffect:g.useEffect;
+module.exports=function({onClear:b}){const [c]=a.useLexicalComposerContext();h(()=>c.addListener("command",k=>"clearEditor"===k?(c.update(()=>{if(null==b){const e=d.$getRoot(),l=d.$getSelection(),f=d.$createParagraphNode();e.clear();e.append(f);null!==l&&f.select()}else b()}),!0):!1,0),[c,b]);return null};

package/LexicalCollaborationPlugin.d.ts

@@ -0,0 +1,49 @@
+/**
+ * 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.
+ *
+ */
+
+import type {Doc, RelativePosition} from 'yjs';
+export type UserState = {
+  anchorPos: null | RelativePosition;
+  focusPos: null | RelativePosition;
+  name: string;
+  color: string;
+  focusing: boolean;
+};
+export type ProviderAwareness = {
+  getLocalState: () => UserState;
+  setLocalState: (arg0: UserState) => void;
+  getStates: () => Array<UserState>;
+  on: (type: 'update', cb: () => void) => void;
+  off: (type: 'update', cb: () => void) => void;
+};
+export interface Provider {
+  connect(): void | Promise<void>;
+  disconnect(): void;
+  awareness: ProviderAwareness;
+  on(type: 'sync', cb: (isSynced: boolean) => void): void;
+  on(type: 'status', cb: (arg0: {status: string}) => void): void;
+  // $FlowFixMe: temp
+  on(type: 'update', cb: (arg0: any) => void): void;
+  off(type: 'sync', cb: (isSynced: boolean) => void): void;
+  // $FlowFixMe: temp
+  off(type: 'update', cb: (arg0: any) => void): void;
+  off(type: 'status', cb: (arg0: {status: string}) => void): void;
+}
+type CollaborationContextType = {
+  clientID: number;
+  color: string;
+  name: string;
+  yjsDocMap: Map<string, Doc>;
+};
+export function CollaborationPlugin(arg0: {
+  id: string;
+  providerFactory: (id: string, yjsDocMap: Map<string, Doc>) => Provider;
+  shouldBootstrap: boolean;
+}): React.ReactNode;
+export declare var CollaborationContext: React.Context<CollaborationContextType>;
+export function useCollaborationContext(): CollaborationContextType;

package/LexicalCollaborationPlugin.dev.js

@@ -9,6 +9,7 @@
 var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
 var React = require('react');
 var yjs = require('@lexical/yjs');
+var lexical = require('lexical');
 var reactDom = require('react-dom');
 
 /**
@@ -20,7 +21,6 @@ var reactDom = require('react-dom');
  * 
  */
 const EditorPriority = 0;
-const BootstrapPriority = 1;
 function useYjsCollaboration(editor, id, provider, docMap, name, color, shouldBootstrap) {
   const binding = React.useMemo(() => yjs.createBinding(editor, provider, id, docMap), [editor, provider, id, docMap]);
   const connect = React.useCallback(() => {
@@ -33,15 +33,6 @@ function useYjsCollaboration(editor, id, provider, docMap, name, color, shouldBo
     }
   }, [provider]);
   const bootstrapPropagationRef = React.useRef(true);
-  React.useLayoutEffect(() => {
-    return editor.addListener('command', type => {
-      if (type === 'bootstrapEditor') {
-        return bootstrapPropagationRef.current;
-      }
-
-      return false;
-    }, BootstrapPriority);
-  }, [editor]);
   React.useEffect(() => {
     const {
       root
@@ -59,7 +50,7 @@ function useYjsCollaboration(editor, id, provider, docMap, name, color, shouldBo
     const onSync = isSynced => {
       if (shouldBootstrap && isSynced && root.isEmpty() && root._xmlText._length === 0) {
         bootstrapPropagationRef.current = false;
-        editor.execCommand('bootstrapEditor');
+        initializeEditor(editor);
       }
     };
 
@@ -176,6 +167,25 @@ function useYjsHistory(editor, binding) {
   return clearHistory;
 }
 
+function initializeEditor(editor) {
+  editor.update(() => {
+    const root = lexical.$getRoot();
+    const firstChild = root.getFirstChild();
+
+    if (firstChild === null) {
+      const paragraph = lexical.$createParagraphNode();
+      root.append(paragraph);
+      const activeElement = document.activeElement;
+
+      if (lexical.$getSelection() !== null || activeElement !== null && activeElement === editor.getRootElement()) {
+        paragraph.select();
+      }
+    }
+  }, {
+    tag: 'history-merge'
+  });
+}
+
 /**
  * Copyright (c) Meta Platforms, Inc. and affiliates.
  *

package/LexicalCollaborationPlugin.js.flow

@@ -0,0 +1,55 @@
+/**
+ * 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.
+ *
+ * @flow strict
+ */
+
+import type {Doc, RelativePosition} from 'yjs';
+
+export type UserState = {
+  anchorPos: null | RelativePosition,
+  focusPos: null | RelativePosition,
+  name: string,
+  color: string,
+  focusing: boolean,
+};
+
+export type ProviderAwareness = {
+  getLocalState: () => UserState,
+  setLocalState: (UserState) => void,
+  getStates: () => Map<number, UserState>,
+  on: (type: 'update', cb: () => void) => void,
+  off: (type: 'update', cb: () => void) => void,
+};
+
+export interface Provider {
+  connect(): void | Promise<void>;
+  disconnect(): void;
+  awareness: ProviderAwareness;
+  on(type: 'sync', cb: (isSynced: boolean) => void): void;
+  on(type: 'status', cb: ({status: string}) => void): void;
+  // $FlowFixMe: temp
+  on(type: 'update', cb: (any) => void): void;
+  off(type: 'sync', cb: (isSynced: boolean) => void): void;
+  // $FlowFixMe: temp
+  off(type: 'update', cb: (any) => void): void;
+  off(type: 'status', cb: ({status: string}) => void): void;
+}
+
+type CollaborationContextType = {
+  clientID: number,
+  color: string,
+  name: string,
+  yjsDocMap: Map<string, Doc>,
+};
+
+declare export function CollaborationPlugin(arg0: {
+  id: string,
+  providerFactory: (id: string, yjsDocMap: Map<string, Doc>) => Provider,
+  shouldBootstrap: boolean,
+}): React$Node;
+declare export var CollaborationContext: React$Context<CollaborationContextType>;
+declare export function useCollaborationContext(): CollaborationContextType;

package/LexicalCollaborationPlugin.prod.js

@@ -4,10 +4,10 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var c=require("@lexical/react/LexicalComposerContext"),g=require("react"),z=require("@lexical/yjs"),A=require("react-dom");
-function B(b,d,a,h,n,q,r){const e=g.useMemo(()=>z.createBinding(b,a,d,h),[b,a,d,h]),k=g.useCallback(()=>{a.connect()},[a]),l=g.useCallback(()=>{try{a.disconnect()}catch(f){}},[a]),p=g.useRef(!0);g.useLayoutEffect(()=>b.addListener("command",f=>"bootstrapEditor"===f?p.current:!1,1),[b]);g.useEffect(()=>{const {root:f}=e,{awareness:t}=a,v=({status:m})=>{b.execCommand("connected","connected"===m)},w=m=>{r&&m&&f.isEmpty()&&0===f._xmlText._length&&(p.current=!1,b.execCommand("bootstrapEditor"))},x=()=>
-{z.syncCursorPositions(e,a)},y=(m,u)=>{u.origin!==e&&z.syncYjsChangesToLexical(e,a,m)};z.initLocalState(a,n,q,document.activeElement===b.getRootElement());a.on("status",v);a.on("sync",w);t.on("update",x);f.getSharedType().observeDeep(y);const K=b.addListener("update",({prevEditorState:m,editorState:u,dirtyLeaves:G,dirtyElements:H,normalizedNodes:I,tags:J})=>{z.syncLexicalUpdateToYjs(e,a,m,u,H,G,I,J)});k();return()=>{l();a.off("sync",w);a.off("status",v);t.off("update",x);f.getSharedType().unobserveDeep(y);
-K()}},[e,q,k,l,b,n,a,r]);const L=g.useMemo(()=>A.createPortal(g.createElement("div",{ref:f=>{e.cursorsContainer=f}}),document.body),[e]);g.useEffect(()=>b.addListener("command",(f,t)=>{"toggleConnect"===f&&void 0!==k&&void 0!==l&&(t?(console.log("Collaboration connected!"),k()):(console.log("Collaboration disconnected!"),l()));return!1},0),[k,l,b]);return[L,e]}
-function C(b,d){g.useEffect(()=>b.addListener("command",a=>{"focus"===a?z.setLocalStateFocus(d,!0):"blur"===a&&z.setLocalStateFocus(d,!1);return!1},0),[b,d])}function D(b,d){const a=g.useMemo(()=>z.createUndoManager(d,d.root.getSharedType()),[d]);g.useEffect(()=>b.addListener("command",h=>"undo"===h?(a.undo(),!0):"redo"===h?(a.redo(),!0):!1,0));return g.useCallback(()=>{a.clear()},[a])}
-const E=[["Cat","255,165,0"],["Dog","0,200,55"],["Rabbit","160,0,200"],["Frog","0,172,200"],["Fox","197,200,0"],["Hedgehog","31,200,0"],["Pigeon","200,0,0"],["Squirrel","200,0,148"],["Bear","255,235,0"],["Tiger","86,255,0"],["Leopard","0,255,208"],["Zebra","0,243,255"],["Wolf","0,102,255"],["Owl","147,0,255"],["Gull","255,0,153"],["Squid","0,220,255"]],F=E[Math.floor(Math.random()*(E.length-1+1))],M=g.createContext({clientID:0,color:F[1],name:F[0],yjsDocMap:new Map});
-function N(){return g.useContext(M)}exports.CollaborationContext=M;exports.CollaborationPlugin=function({id:b,providerFactory:d,shouldBootstrap:a}){const h=N(),{yjsDocMap:n,name:q,color:r}=h,[e]=c.useLexicalComposerContext(),k=g.useMemo(()=>d(b,n),[b,d,n]),[l,p]=B(e,b,k,n,q,r,a);h.clientID=p.clientID;D(e,p);C(e,k);return l};exports.useCollaborationContext=N;
+var d=require("@lexical/react/LexicalComposerContext"),g=require("react"),u=require("@lexical/yjs"),A=require("lexical"),B=require("react-dom");
+function C(b,c,a,h,n,p,q){const e=g.useMemo(()=>u.createBinding(b,a,c,h),[b,a,c,h]),k=g.useCallback(()=>{a.connect()},[a]),l=g.useCallback(()=>{try{a.disconnect()}catch(f){}},[a]),r=g.useRef(!0);g.useEffect(()=>{const {root:f}=e,{awareness:t}=a,w=({status:m})=>{b.execCommand("connected","connected"===m)},x=m=>{q&&m&&f.isEmpty()&&0===f._xmlText._length&&(r.current=!1,D(b))},y=()=>{u.syncCursorPositions(e,a)},z=(m,v)=>{v.origin!==e&&u.syncYjsChangesToLexical(e,a,m)};u.initLocalState(a,n,p,document.activeElement===
+b.getRootElement());a.on("status",w);a.on("sync",x);t.on("update",y);f.getSharedType().observeDeep(z);const M=b.addListener("update",({prevEditorState:m,editorState:v,dirtyLeaves:I,dirtyElements:J,normalizedNodes:K,tags:L})=>{u.syncLexicalUpdateToYjs(e,a,m,v,J,I,K,L)});k();return()=>{l();a.off("sync",x);a.off("status",w);t.off("update",y);f.getSharedType().unobserveDeep(z);M()}},[e,p,k,l,b,n,a,q]);const N=g.useMemo(()=>B.createPortal(g.createElement("div",{ref:f=>{e.cursorsContainer=f}}),document.body),
+[e]);g.useEffect(()=>b.addListener("command",(f,t)=>{"toggleConnect"===f&&void 0!==k&&void 0!==l&&(t?(console.log("Collaboration connected!"),k()):(console.log("Collaboration disconnected!"),l()));return!1},0),[k,l,b]);return[N,e]}function E(b,c){g.useEffect(()=>b.addListener("command",a=>{"focus"===a?u.setLocalStateFocus(c,!0):"blur"===a&&u.setLocalStateFocus(c,!1);return!1},0),[b,c])}
+function F(b,c){const a=g.useMemo(()=>u.createUndoManager(c,c.root.getSharedType()),[c]);g.useEffect(()=>b.addListener("command",h=>"undo"===h?(a.undo(),!0):"redo"===h?(a.redo(),!0):!1,0));return g.useCallback(()=>{a.clear()},[a])}function D(b){b.update(()=>{var c=A.$getRoot();if(null===c.getFirstChild()){const a=A.$createParagraphNode();c.append(a);c=document.activeElement;(null!==A.$getSelection()||null!==c&&c===b.getRootElement())&&a.select()}},{tag:"history-merge"})}
+const G=[["Cat","255,165,0"],["Dog","0,200,55"],["Rabbit","160,0,200"],["Frog","0,172,200"],["Fox","197,200,0"],["Hedgehog","31,200,0"],["Pigeon","200,0,0"],["Squirrel","200,0,148"],["Bear","255,235,0"],["Tiger","86,255,0"],["Leopard","0,255,208"],["Zebra","0,243,255"],["Wolf","0,102,255"],["Owl","147,0,255"],["Gull","255,0,153"],["Squid","0,220,255"]],H=G[Math.floor(Math.random()*(G.length-1+1))],O=g.createContext({clientID:0,color:H[1],name:H[0],yjsDocMap:new Map});
+function P(){return g.useContext(O)}exports.CollaborationContext=O;exports.CollaborationPlugin=function({id:b,providerFactory:c,shouldBootstrap:a}){const h=P(),{yjsDocMap:n,name:p,color:q}=h,[e]=d.useLexicalComposerContext(),k=g.useMemo(()=>c(b,n),[b,c,n]),[l,r]=C(e,b,k,n,p,q,a);h.clientID=r.clientID;F(e,r);E(e,k);return l};exports.useCollaborationContext=P;

package/LexicalComposer.d.ts

@@ -0,0 +1,22 @@
+/**
+ * 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.
+ *
+ */
+
+import {Class} from 'utility-types';
+import type {EditorThemeClasses, LexicalEditor, LexicalNode} from 'lexical';
+type Props = {
+  initialConfig?: {
+    editor?: LexicalEditor | null;
+    isReadOnly?: boolean;
+    namespace?: string;
+    nodes?: Array<Class<LexicalNode>>;
+    theme?: EditorThemeClasses;
+    onError: (error: Error, editor: LexicalEditor) => void;
+  };
+  children: React.ReactNode;
+};
+export default function LexicalComposer(arg0: Props): React.ReactNode;

package/LexicalComposer.dev.js

@@ -18,11 +18,27 @@ var React = require('react');
  *
  * 
  */
+const CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined';
 
-function defaultOnError(e) {
-  throw e;
-}
+/**
+ * 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.
+ *
+ * 
+ */
+const useLayoutEffectImpl = CAN_USE_DOM ? React.useLayoutEffect : React.useEffect;
+var useLayoutEffect = useLayoutEffectImpl;
 
+/**
+ * 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.
+ *
+ * 
+ */
 function LexicalComposer({
   initialConfig = {},
   children
@@ -54,20 +70,28 @@ function LexicalComposer({
     let editor = initialEditor || null;
 
     if (editor === null) {
-      editor = lexical.createEditor({
+      const newEditor = lexical.createEditor({
         context,
         namespace,
         nodes,
+        onError: error => onError(error, newEditor),
         parentEditor,
+        readOnly: true,
         theme: composerTheme
       });
-      editor.addListener('error', onError || defaultOnError);
+      editor = newEditor;
     }
 
     return [editor, context];
   }, // We only do this for init
   // eslint-disable-next-line react-hooks/exhaustive-deps
   []);
+  useLayoutEffect(() => {
+    const isReadOnly = initialConfig.readOnly;
+    const [editor] = composerContext;
+    editor.setReadOnly(isReadOnly || false); // We only do this for init
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
   return /*#__PURE__*/React.createElement(LexicalComposerContext.LexicalComposerContext.Provider, {
     value: composerContext
   }, children);

package/LexicalComposer.js.flow

@@ -0,0 +1,24 @@
+/**
+ * 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.
+ *
+ * @flow strict
+ */
+
+import type {EditorThemeClasses, LexicalEditor, LexicalNode} from 'lexical';
+
+type Props = {
+  initialConfig?: {
+    editor?: LexicalEditor | null,
+    isReadOnly?: boolean,
+    namespace?: string,
+    nodes?: Array<Class<LexicalNode>>,
+    theme?: EditorThemeClasses,
+    onError: (error: Error, editor: LexicalEditor) => void,
+  },
+  children: React$Node,
+};
+
+declare export default function LexicalComposer(Props): React$MixedElement;

package/LexicalComposer.prod.js

@@ -4,6 +4,6 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var e=require("@lexical/react/LexicalComposerContext"),f=require("lexical"),l=require("react");function m(g){throw g;}
-module.exports=function({initialConfig:g={},children:n}){const b=l.useContext(e.LexicalComposerContext),u=l.useMemo(()=>{let c,h;const {theme:k,namespace:p,editor:q,nodes:r,onError:t}=g;if(null!=k)c=k;else if(null!=b){h=b[0];var a=b[1].getTheme();null!=a&&(c=a)}a=e.createLexicalComposerContext(b,c);let d=q||null;null===d&&(d=f.createEditor({context:a,namespace:p,nodes:r,parentEditor:h,theme:c}),d.addListener("error",t||m));return[d,a]},[]);return l.createElement(e.LexicalComposerContext.Provider,
-{value:u},n)};
+var b=require("@lexical/react/LexicalComposerContext"),f=require("lexical"),n=require("react"),p="undefined"!==typeof window&&"undefined"!==typeof window.document&&"undefined"!==typeof window.document.createElement?n.useLayoutEffect:n.useEffect;
+module.exports=function({initialConfig:h={},children:q}){const d=n.useContext(b.LexicalComposerContext),m=n.useMemo(()=>{let a,e;const {theme:k,namespace:r,editor:t,nodes:u,onError:v}=h;if(null!=k)a=k;else if(null!=d){e=d[0];var c=d[1].getTheme();null!=c&&(a=c)}c=b.createLexicalComposerContext(d,a);let g=t||null;if(null===g){const l=f.createEditor({context:c,namespace:r,nodes:u,onError:w=>v(w,l),parentEditor:e,readOnly:!0,theme:a});g=l}return[g,c]},[]);p(()=>{const a=h.readOnly,[e]=m;e.setReadOnly(a||
+!1)},[]);return n.createElement(b.LexicalComposerContext.Provider,{value:m},q)};

package/LexicalComposerContext.d.ts

@@ -0,0 +1,24 @@
+/**
+ * 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.
+ *
+ */
+
+import type {EditorThemeClasses, LexicalEditor} from 'lexical';
+export type LexicalComposerContextType = {
+  getTheme: () => EditorThemeClasses | null | undefined;
+};
+export type LexicalComposerContextWithEditor = [
+  LexicalEditor,
+  LexicalComposerContextType,
+];
+export declare var LexicalComposerContext: React.Context<
+  LexicalComposerContextWithEditor | null | undefined
+>;
+export function createLexicalComposerContext(
+  parent: LexicalComposerContextWithEditor | null | undefined,
+  theme: EditorThemeClasses | null | undefined,
+): LexicalComposerContextType;
+export function useLexicalComposerContext(): LexicalComposerContextWithEditor;

package/LexicalComposerContext.js.flow

@@ -0,0 +1,27 @@
+/**
+ * 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.
+ *
+ * @flow strict
+ */
+
+import type {EditorThemeClasses, LexicalEditor} from 'lexical';
+
+export type LexicalComposerContextType = {
+  getTheme: () => ?EditorThemeClasses,
+};
+
+export type LexicalComposerContextWithEditor = [
+  LexicalEditor,
+  LexicalComposerContextType,
+];
+
+declare export var LexicalComposerContext: React$Context<?LexicalComposerContextWithEditor>;
+
+declare export function createLexicalComposerContext(
+  parent: ?LexicalComposerContextWithEditor,
+  theme: ?EditorThemeClasses,
+): LexicalComposerContextType;
+declare export function useLexicalComposerContext(): LexicalComposerContextWithEditor;

package/LexicalContentEditable.d.ts

@@ -0,0 +1,32 @@
+/**
+ * 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.
+ *
+ */
+
+import {$ReadOnly} from 'utility-types';
+export type Props = $ReadOnly<{
+  ariaActiveDescendantID?: string;
+  ariaAutoComplete?: string;
+  ariaControls?: string;
+  ariaDescribedBy?: string;
+  ariaExpanded?: boolean;
+  ariaLabel?: string;
+  ariaLabelledBy?: string;
+  ariaMultiline?: boolean;
+  ariaOwneeID?: string;
+  ariaRequired?: string;
+  autoCapitalize?: boolean;
+  autoComplete?: boolean;
+  autoCorrect?: boolean;
+  className?: string;
+  readOnly?: boolean;
+  role?: string;
+  style?: StyleSheetList;
+  spellCheck?: boolean;
+  tabIndex?: number;
+  testid?: string;
+}>;
+export default function LexicalContentEditable(props: Props): React.ReactNode;