@lexical/react 0.1.10 → 0.1.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (86) hide show
  1. package/DEPRECATED_useLexical.dev.js +3 -7
  2. package/DEPRECATED_useLexical.prod.js +1 -1
  3. package/DEPRECATED_useLexicalAutoFormatter.dev.js +83 -37
  4. package/DEPRECATED_useLexicalAutoFormatter.prod.js +20 -19
  5. package/DEPRECATED_useLexicalCharacterLimit.dev.js +20 -17
  6. package/DEPRECATED_useLexicalCharacterLimit.prod.js +8 -8
  7. package/DEPRECATED_useLexicalList.dev.js +6 -0
  8. package/DEPRECATED_useLexicalList.prod.js +1 -1
  9. package/DEPRECATED_useLexicalPlainText.dev.js +84 -75
  10. package/DEPRECATED_useLexicalPlainText.prod.js +15 -15
  11. package/DEPRECATED_useLexicalRichText.dev.js +96 -438
  12. package/DEPRECATED_useLexicalRichText.prod.js +17 -26
  13. package/LexicalAutoFormatterPlugin.d.ts +9 -0
  14. package/LexicalAutoFormatterPlugin.dev.js +83 -37
  15. package/LexicalAutoFormatterPlugin.js.flow +10 -0
  16. package/LexicalAutoFormatterPlugin.prod.js +21 -20
  17. package/LexicalAutoLinkPlugin.d.ts +20 -0
  18. package/LexicalAutoLinkPlugin.js.flow +23 -0
  19. package/LexicalCharacterLimitPlugin.d.ts +11 -0
  20. package/LexicalCharacterLimitPlugin.dev.js +20 -17
  21. package/LexicalCharacterLimitPlugin.js.flow +12 -0
  22. package/LexicalCharacterLimitPlugin.prod.js +9 -8
  23. package/LexicalClearEditorPlugin.d.ts +14 -0
  24. package/LexicalClearEditorPlugin.dev.js +73 -0
  25. package/LexicalClearEditorPlugin.js +9 -0
  26. package/LexicalClearEditorPlugin.js.flow +14 -0
  27. package/LexicalClearEditorPlugin.prod.js +8 -0
  28. package/LexicalCollaborationPlugin.d.ts +49 -0
  29. package/LexicalCollaborationPlugin.dev.js +21 -13
  30. package/LexicalCollaborationPlugin.js.flow +55 -0
  31. package/LexicalCollaborationPlugin.prod.js +7 -7
  32. package/LexicalComposer.d.ts +22 -0
  33. package/LexicalComposer.dev.js +32 -3
  34. package/LexicalComposer.js.flow +24 -0
  35. package/LexicalComposer.prod.js +3 -2
  36. package/LexicalComposerContext.d.ts +24 -0
  37. package/LexicalComposerContext.js.flow +27 -0
  38. package/LexicalContentEditable.d.ts +32 -0
  39. package/LexicalContentEditable.dev.js +35 -8
  40. package/LexicalContentEditable.js.flow +35 -0
  41. package/LexicalContentEditable.prod.js +3 -3
  42. package/LexicalHashtagPlugin.d.ts +9 -0
  43. package/LexicalHashtagPlugin.js.flow +10 -0
  44. package/LexicalHistoryPlugin.d.ts +29 -0
  45. package/LexicalHistoryPlugin.js.flow +34 -0
  46. package/LexicalHorizontalRuleNode.d.ts +23 -0
  47. package/LexicalHorizontalRuleNode.js.flow +25 -0
  48. package/LexicalLinkPlugin.d.ts +9 -0
  49. package/LexicalLinkPlugin.js.flow +10 -0
  50. package/LexicalListPlugin.d.ts +9 -0
  51. package/LexicalListPlugin.dev.js +6 -0
  52. package/LexicalListPlugin.js.flow +10 -0
  53. package/LexicalListPlugin.prod.js +2 -2
  54. package/LexicalNestedComposer.d.ts +17 -0
  55. package/LexicalNestedComposer.dev.js +21 -11
  56. package/LexicalNestedComposer.js.flow +18 -0
  57. package/LexicalNestedComposer.prod.js +3 -2
  58. package/LexicalOnChangePlugin.d.ts +12 -0
  59. package/LexicalOnChangePlugin.js.flow +14 -0
  60. package/LexicalPlainTextPlugin.d.ts +15 -0
  61. package/LexicalPlainTextPlugin.dev.js +73 -84
  62. package/LexicalPlainTextPlugin.js.flow +18 -0
  63. package/LexicalPlainTextPlugin.prod.js +12 -12
  64. package/LexicalRichTextPlugin.d.ts +15 -0
  65. package/LexicalRichTextPlugin.dev.js +85 -447
  66. package/LexicalRichTextPlugin.js.flow +18 -0
  67. package/LexicalRichTextPlugin.prod.js +13 -22
  68. package/LexicalTablePlugin.d.ts +9 -0
  69. package/LexicalTablePlugin.dev.js +22 -0
  70. package/LexicalTablePlugin.js.flow +10 -0
  71. package/LexicalTablePlugin.prod.js +4 -3
  72. package/LexicalTreeView.d.ts +17 -0
  73. package/LexicalTreeView.js.flow +19 -0
  74. package/README.md +0 -1
  75. package/package.json +9 -5
  76. package/useLexicalDecoratorMap.d.ts +14 -0
  77. package/useLexicalDecoratorMap.js.flow +16 -0
  78. package/useLexicalIsTextContentEmpty.d.ts +13 -0
  79. package/useLexicalIsTextContentEmpty.js.flow +15 -0
  80. package/useLexicalNodeSelection.d.ts +12 -0
  81. package/useLexicalNodeSelection.js.flow +14 -0
  82. package/withSubscriptions.d.ts +12 -0
  83. package/withSubscriptions.js.flow +13 -0
  84. package/LexicalBootstrapPlugin.dev.js +0 -122
  85. package/LexicalBootstrapPlugin.js +0 -9
  86. package/LexicalBootstrapPlugin.prod.js +0 -8
@@ -4,11 +4,12 @@
4
4
  * This source code is licensed under the MIT license found in the
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
- 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()}
8
- 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&&
9
- 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}
10
- 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();!q.$isRangeSelection(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(),
11
- 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(q.$isRangeSelection(m)){k=m.anchor;n=k.getNode();
12
- 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;
13
- 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>
14
- f?"characters-limit-exceeded":""}`},f)};
7
+ 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()}
8
+ 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&&
9
+ 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=
10
+ 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(),
11
+ 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(),
12
+ 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}
13
+ 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;
14
+ 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>
15
+ p?"characters-limit-exceeded":""}`},p)};
@@ -0,0 +1,14 @@
1
+ /**
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ *
7
+ * @flow strict
8
+ */
9
+
10
+ import {$ReadOnly} from 'utility-types';
11
+ type Props = $ReadOnly<{
12
+ onClear?: () => void;
13
+ }>;
14
+ export default function LexicalClearEditorPlugin(arg0: Props): React.ReactNode;
@@ -0,0 +1,73 @@
1
+ /**
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ 'use strict';
8
+
9
+ var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
10
+ var lexical = require('lexical');
11
+ var react = require('react');
12
+
13
+ /**
14
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
15
+ *
16
+ * This source code is licensed under the MIT license found in the
17
+ * LICENSE file in the root directory of this source tree.
18
+ *
19
+ *
20
+ */
21
+ const CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined';
22
+
23
+ /**
24
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
25
+ *
26
+ * This source code is licensed under the MIT license found in the
27
+ * LICENSE file in the root directory of this source tree.
28
+ *
29
+ *
30
+ */
31
+ const useLayoutEffectImpl = CAN_USE_DOM ? react.useLayoutEffect : react.useEffect;
32
+ var useLayoutEffect = useLayoutEffectImpl;
33
+
34
+ /**
35
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
36
+ *
37
+ * This source code is licensed under the MIT license found in the
38
+ * LICENSE file in the root directory of this source tree.
39
+ *
40
+ *
41
+ */
42
+ function LexicalClearEditorPlugin({
43
+ onClear
44
+ }) {
45
+ const [editor] = LexicalComposerContext.useLexicalComposerContext();
46
+ useLayoutEffect(() => {
47
+ return editor.addListener('command', (type, payload) => {
48
+ if (type === 'clearEditor') {
49
+ editor.update(() => {
50
+ if (onClear == null) {
51
+ const root = lexical.$getRoot();
52
+ const selection = lexical.$getSelection();
53
+ const paragraph = lexical.$createParagraphNode();
54
+ root.clear();
55
+ root.append(paragraph);
56
+
57
+ if (selection !== null) {
58
+ paragraph.select();
59
+ }
60
+ } else {
61
+ onClear();
62
+ }
63
+ });
64
+ return true;
65
+ }
66
+
67
+ return false;
68
+ }, 0);
69
+ }, [editor, onClear]);
70
+ return null;
71
+ }
72
+
73
+ module.exports = LexicalClearEditorPlugin;
@@ -0,0 +1,9 @@
1
+ /**
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ 'use strict'
8
+ const LexicalClearEditorPlugin = process.env.NODE_ENV === 'development' ? require('./LexicalClearEditorPlugin.dev.js') : require('./LexicalClearEditorPlugin.prod.js')
9
+ module.exports = LexicalClearEditorPlugin;
@@ -0,0 +1,14 @@
1
+ /**
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ *
7
+ * @flow strict
8
+ */
9
+
10
+ type Props = $ReadOnly<{
11
+ onClear?: () => void,
12
+ }>;
13
+
14
+ declare export default function LexicalClearEditorPlugin(Props): React$Node;
@@ -0,0 +1,8 @@
1
+ /**
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ 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;
8
+ 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};
@@ -0,0 +1,49 @@
1
+ /**
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ *
7
+ */
8
+
9
+ import type {Doc, RelativePosition} from 'yjs';
10
+ export type UserState = {
11
+ anchorPos: null | RelativePosition;
12
+ focusPos: null | RelativePosition;
13
+ name: string;
14
+ color: string;
15
+ focusing: boolean;
16
+ };
17
+ export type ProviderAwareness = {
18
+ getLocalState: () => UserState;
19
+ setLocalState: (arg0: UserState) => void;
20
+ getStates: () => Array<UserState>;
21
+ on: (type: 'update', cb: () => void) => void;
22
+ off: (type: 'update', cb: () => void) => void;
23
+ };
24
+ export interface Provider {
25
+ connect(): void | Promise<void>;
26
+ disconnect(): void;
27
+ awareness: ProviderAwareness;
28
+ on(type: 'sync', cb: (isSynced: boolean) => void): void;
29
+ on(type: 'status', cb: (arg0: {status: string}) => void): void;
30
+ // $FlowFixMe: temp
31
+ on(type: 'update', cb: (arg0: any) => void): void;
32
+ off(type: 'sync', cb: (isSynced: boolean) => void): void;
33
+ // $FlowFixMe: temp
34
+ off(type: 'update', cb: (arg0: any) => void): void;
35
+ off(type: 'status', cb: (arg0: {status: string}) => void): void;
36
+ }
37
+ type CollaborationContextType = {
38
+ clientID: number;
39
+ color: string;
40
+ name: string;
41
+ yjsDocMap: Map<string, Doc>;
42
+ };
43
+ export function CollaborationPlugin(arg0: {
44
+ id: string;
45
+ providerFactory: (id: string, yjsDocMap: Map<string, Doc>) => Provider;
46
+ shouldBootstrap: boolean;
47
+ }): React.ReactNode;
48
+ export declare var CollaborationContext: React.Context<CollaborationContextType>;
49
+ export function useCollaborationContext(): CollaborationContextType;
@@ -9,6 +9,7 @@
9
9
  var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
10
10
  var React = require('react');
11
11
  var yjs = require('@lexical/yjs');
12
+ var lexical = require('lexical');
12
13
  var reactDom = require('react-dom');
13
14
 
14
15
  /**
@@ -20,7 +21,6 @@ var reactDom = require('react-dom');
20
21
  *
21
22
  */
22
23
  const EditorPriority = 0;
23
- const BootstrapPriority = 1;
24
24
  function useYjsCollaboration(editor, id, provider, docMap, name, color, shouldBootstrap) {
25
25
  const binding = React.useMemo(() => yjs.createBinding(editor, provider, id, docMap), [editor, provider, id, docMap]);
26
26
  const connect = React.useCallback(() => {
@@ -32,16 +32,6 @@ function useYjsCollaboration(editor, id, provider, docMap, name, color, shouldBo
32
32
  } catch (e) {// Do nothing
33
33
  }
34
34
  }, [provider]);
35
- const bootstrapPropagationRef = React.useRef(true);
36
- React.useLayoutEffect(() => {
37
- return editor.addListener('command', type => {
38
- if (type === 'bootstrapEditor') {
39
- return bootstrapPropagationRef.current;
40
- }
41
-
42
- return false;
43
- }, BootstrapPriority);
44
- }, [editor]);
45
35
  React.useEffect(() => {
46
36
  const {
47
37
  root
@@ -58,8 +48,7 @@ function useYjsCollaboration(editor, id, provider, docMap, name, color, shouldBo
58
48
 
59
49
  const onSync = isSynced => {
60
50
  if (shouldBootstrap && isSynced && root.isEmpty() && root._xmlText._length === 0) {
61
- bootstrapPropagationRef.current = false;
62
- editor.execCommand('bootstrapEditor');
51
+ initializeEditor(editor);
63
52
  }
64
53
  };
65
54
 
@@ -176,6 +165,25 @@ function useYjsHistory(editor, binding) {
176
165
  return clearHistory;
177
166
  }
178
167
 
168
+ function initializeEditor(editor) {
169
+ editor.update(() => {
170
+ const root = lexical.$getRoot();
171
+ const firstChild = root.getFirstChild();
172
+
173
+ if (firstChild === null) {
174
+ const paragraph = lexical.$createParagraphNode();
175
+ root.append(paragraph);
176
+ const activeElement = document.activeElement;
177
+
178
+ if (lexical.$getSelection() !== null || activeElement !== null && activeElement === editor.getRootElement()) {
179
+ paragraph.select();
180
+ }
181
+ }
182
+ }, {
183
+ tag: 'history-merge'
184
+ });
185
+ }
186
+
179
187
  /**
180
188
  * Copyright (c) Meta Platforms, Inc. and affiliates.
181
189
  *
@@ -0,0 +1,55 @@
1
+ /**
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ *
7
+ * @flow strict
8
+ */
9
+
10
+ import type {Doc, RelativePosition} from 'yjs';
11
+
12
+ export type UserState = {
13
+ anchorPos: null | RelativePosition,
14
+ focusPos: null | RelativePosition,
15
+ name: string,
16
+ color: string,
17
+ focusing: boolean,
18
+ };
19
+
20
+ export type ProviderAwareness = {
21
+ getLocalState: () => UserState,
22
+ setLocalState: (UserState) => void,
23
+ getStates: () => Map<number, UserState>,
24
+ on: (type: 'update', cb: () => void) => void,
25
+ off: (type: 'update', cb: () => void) => void,
26
+ };
27
+
28
+ export interface Provider {
29
+ connect(): void | Promise<void>;
30
+ disconnect(): void;
31
+ awareness: ProviderAwareness;
32
+ on(type: 'sync', cb: (isSynced: boolean) => void): void;
33
+ on(type: 'status', cb: ({status: string}) => void): void;
34
+ // $FlowFixMe: temp
35
+ on(type: 'update', cb: (any) => void): void;
36
+ off(type: 'sync', cb: (isSynced: boolean) => void): void;
37
+ // $FlowFixMe: temp
38
+ off(type: 'update', cb: (any) => void): void;
39
+ off(type: 'status', cb: ({status: string}) => void): void;
40
+ }
41
+
42
+ type CollaborationContextType = {
43
+ clientID: number,
44
+ color: string,
45
+ name: string,
46
+ yjsDocMap: Map<string, Doc>,
47
+ };
48
+
49
+ declare export function CollaborationPlugin(arg0: {
50
+ id: string,
51
+ providerFactory: (id: string, yjsDocMap: Map<string, Doc>) => Provider,
52
+ shouldBootstrap: boolean,
53
+ }): React$Node;
54
+ declare export var CollaborationContext: React$Context<CollaborationContextType>;
55
+ declare export function useCollaborationContext(): CollaborationContextType;
@@ -4,10 +4,10 @@
4
4
  * This source code is licensed under the MIT license found in the
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
- var c=require("@lexical/react/LexicalComposerContext"),g=require("react"),z=require("@lexical/yjs"),A=require("react-dom");
8
- 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=()=>
9
- {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);
10
- 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]}
11
- 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])}
12
- 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});
13
- 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;
7
+ var d=require("@lexical/react/LexicalComposerContext"),g=require("react"),u=require("@lexical/yjs"),A=require("lexical"),B=require("react-dom");
8
+ 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]);g.useEffect(()=>{const {root:f}=e,{awareness:r}=a,w=({status:m})=>{b.execCommand("connected","connected"===m)},x=m=>{q&&m&&f.isEmpty()&&0===f._xmlText._length&&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());
9
+ a.on("status",w);a.on("sync",x);r.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);r.off("update",y);f.getSharedType().unobserveDeep(z);M()}},[e,p,k,l,b,n,a,q]);const t=g.useMemo(()=>B.createPortal(g.createElement("div",{ref:f=>{e.cursorsContainer=f}}),document.body),[e]);g.useEffect(()=>
10
+ b.addListener("command",(f,r)=>{"toggleConnect"===f&&void 0!==k&&void 0!==l&&(r?(console.log("Collaboration connected!"),k()):(console.log("Collaboration disconnected!"),l()));return!1},0),[k,l,b]);return[t,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])}
11
+ 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"})}
12
+ 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))],N=g.createContext({clientID:0,color:H[1],name:H[0],yjsDocMap:new Map});
13
+ function O(){return g.useContext(N)}exports.CollaborationContext=N;exports.CollaborationPlugin=function({id:b,providerFactory:c,shouldBootstrap:a}){const h=O(),{yjsDocMap:n,name:p,color:q}=h,[e]=d.useLexicalComposerContext(),k=g.useMemo(()=>c(b,n),[b,c,n]),[l,t]=C(e,b,k,n,p,q,a);h.clientID=t.clientID;F(e,t);E(e,k);return l};exports.useCollaborationContext=O;
@@ -0,0 +1,22 @@
1
+ /**
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ *
7
+ */
8
+
9
+ import {Class} from 'utility-types';
10
+ import type {EditorThemeClasses, LexicalEditor, LexicalNode} from 'lexical';
11
+ type Props = {
12
+ initialConfig: {
13
+ editor?: LexicalEditor | null;
14
+ isReadOnly?: boolean;
15
+ namespace?: string;
16
+ nodes?: Array<Class<LexicalNode>>;
17
+ theme?: EditorThemeClasses;
18
+ onError: (error: Error, editor: LexicalEditor) => void;
19
+ };
20
+ children: React.ReactNode;
21
+ };
22
+ export default function LexicalComposer(arg0: Props): React.ReactNode;
@@ -10,6 +10,27 @@ var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
10
10
  var lexical = require('lexical');
11
11
  var React = require('react');
12
12
 
13
+ /**
14
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
15
+ *
16
+ * This source code is licensed under the MIT license found in the
17
+ * LICENSE file in the root directory of this source tree.
18
+ *
19
+ *
20
+ */
21
+ const CAN_USE_DOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined';
22
+
23
+ /**
24
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
25
+ *
26
+ * This source code is licensed under the MIT license found in the
27
+ * LICENSE file in the root directory of this source tree.
28
+ *
29
+ *
30
+ */
31
+ const useLayoutEffectImpl = CAN_USE_DOM ? React.useLayoutEffect : React.useEffect;
32
+ var useLayoutEffect = useLayoutEffectImpl;
33
+
13
34
  /**
14
35
  * Copyright (c) Meta Platforms, Inc. and affiliates.
15
36
  *
@@ -19,7 +40,7 @@ var React = require('react');
19
40
  *
20
41
  */
21
42
  function LexicalComposer({
22
- initialConfig = {},
43
+ initialConfig,
23
44
  children
24
45
  }) {
25
46
  const parentContext = React.useContext(LexicalComposerContext.LexicalComposerContext);
@@ -49,20 +70,28 @@ function LexicalComposer({
49
70
  let editor = initialEditor || null;
50
71
 
51
72
  if (editor === null) {
52
- editor = lexical.createEditor({
73
+ const newEditor = lexical.createEditor({
53
74
  context,
54
75
  namespace,
55
76
  nodes,
56
- onError,
77
+ onError: error => onError(error, newEditor),
57
78
  parentEditor,
79
+ readOnly: true,
58
80
  theme: composerTheme
59
81
  });
82
+ editor = newEditor;
60
83
  }
61
84
 
62
85
  return [editor, context];
63
86
  }, // We only do this for init
64
87
  // eslint-disable-next-line react-hooks/exhaustive-deps
65
88
  []);
89
+ useLayoutEffect(() => {
90
+ const isReadOnly = initialConfig.readOnly;
91
+ const [editor] = composerContext;
92
+ editor.setReadOnly(isReadOnly || false); // We only do this for init
93
+ // eslint-disable-next-line react-hooks/exhaustive-deps
94
+ }, []);
66
95
  return /*#__PURE__*/React.createElement(LexicalComposerContext.LexicalComposerContext.Provider, {
67
96
  value: composerContext
68
97
  }, children);
@@ -0,0 +1,24 @@
1
+ /**
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ *
7
+ * @flow strict
8
+ */
9
+
10
+ import type {EditorThemeClasses, LexicalEditor, LexicalNode} from 'lexical';
11
+
12
+ type Props = {
13
+ initialConfig: $ReadOnly<{
14
+ editor?: LexicalEditor | null,
15
+ isReadOnly?: boolean,
16
+ namespace?: string,
17
+ nodes?: $ReadOnlyArray<Class<LexicalNode>>,
18
+ theme?: EditorThemeClasses,
19
+ onError: (error: Error, editor: LexicalEditor) => void,
20
+ }>,
21
+ children: React$Node,
22
+ };
23
+
24
+ declare export default function LexicalComposer(Props): React$MixedElement;
@@ -4,5 +4,6 @@
4
4
  * This source code is licensed under the MIT license found in the
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
- var d=require("@lexical/react/LexicalComposerContext"),e=require("lexical"),k=require("react");
8
- module.exports=function({initialConfig:l={},children:m}){const b=k.useContext(d.LexicalComposerContext),t=k.useMemo(()=>{let c,g;const {theme:h,namespace:n,editor:p,nodes:q,onError:r}=l;if(null!=h)c=h;else if(null!=b){g=b[0];var a=b[1].getTheme();null!=a&&(c=a)}a=d.createLexicalComposerContext(b,c);let f=p||null;null===f&&(f=e.createEditor({context:a,namespace:n,nodes:q,onError:r,parentEditor:g,theme:c}));return[f,a]},[]);return k.createElement(d.LexicalComposerContext.Provider,{value:t},m)};
7
+ 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;
8
+ 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||
9
+ !1)},[]);return n.createElement(b.LexicalComposerContext.Provider,{value:m},q)};
@@ -0,0 +1,24 @@
1
+ /**
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ *
7
+ */
8
+
9
+ import type {EditorThemeClasses, LexicalEditor} from 'lexical';
10
+ export type LexicalComposerContextType = {
11
+ getTheme: () => EditorThemeClasses | null | undefined;
12
+ };
13
+ export type LexicalComposerContextWithEditor = [
14
+ LexicalEditor,
15
+ LexicalComposerContextType,
16
+ ];
17
+ export declare var LexicalComposerContext: React.Context<
18
+ LexicalComposerContextWithEditor | null | undefined
19
+ >;
20
+ export function createLexicalComposerContext(
21
+ parent: LexicalComposerContextWithEditor | null | undefined,
22
+ theme: EditorThemeClasses | null | undefined,
23
+ ): LexicalComposerContextType;
24
+ export function useLexicalComposerContext(): LexicalComposerContextWithEditor;
@@ -0,0 +1,27 @@
1
+ /**
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ *
7
+ * @flow strict
8
+ */
9
+
10
+ import type {EditorThemeClasses, LexicalEditor} from 'lexical';
11
+
12
+ export type LexicalComposerContextType = {
13
+ getTheme: () => ?EditorThemeClasses,
14
+ };
15
+
16
+ export type LexicalComposerContextWithEditor = [
17
+ LexicalEditor,
18
+ LexicalComposerContextType,
19
+ ];
20
+
21
+ declare export var LexicalComposerContext: React$Context<?LexicalComposerContextWithEditor>;
22
+
23
+ declare export function createLexicalComposerContext(
24
+ parent: ?LexicalComposerContextWithEditor,
25
+ theme: ?EditorThemeClasses,
26
+ ): LexicalComposerContextType;
27
+ declare export function useLexicalComposerContext(): LexicalComposerContextWithEditor;
@@ -0,0 +1,32 @@
1
+ /**
2
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ *
7
+ */
8
+
9
+ import {$ReadOnly} from 'utility-types';
10
+ export type Props = $ReadOnly<{
11
+ ariaActiveDescendantID?: string;
12
+ ariaAutoComplete?: string;
13
+ ariaControls?: string;
14
+ ariaDescribedBy?: string;
15
+ ariaExpanded?: boolean;
16
+ ariaLabel?: string;
17
+ ariaLabelledBy?: string;
18
+ ariaMultiline?: boolean;
19
+ ariaOwneeID?: string;
20
+ ariaRequired?: string;
21
+ autoCapitalize?: boolean;
22
+ autoComplete?: boolean;
23
+ autoCorrect?: boolean;
24
+ className?: string;
25
+ readOnly?: boolean;
26
+ role?: string;
27
+ style?: StyleSheetList;
28
+ spellCheck?: boolean;
29
+ tabIndex?: number;
30
+ testid?: string;
31
+ }>;
32
+ export default function LexicalContentEditable(props: Props): React.ReactNode;