@liveblocks/react-lexical 2.14.0-v2encoding → 2.15.0-debug1

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 (55) hide show
  1. package/dist/comments/anchored-threads.js +52 -50
  2. package/dist/comments/anchored-threads.js.map +1 -1
  3. package/dist/comments/anchored-threads.mjs +36 -34
  4. package/dist/comments/anchored-threads.mjs.map +1 -1
  5. package/dist/comments/comment-plugin-provider.js +46 -63
  6. package/dist/comments/comment-plugin-provider.js.map +1 -1
  7. package/dist/comments/comment-plugin-provider.mjs +29 -28
  8. package/dist/comments/comment-plugin-provider.mjs.map +1 -1
  9. package/dist/comments/floating-composer.js +66 -56
  10. package/dist/comments/floating-composer.js.map +1 -1
  11. package/dist/comments/floating-composer.mjs +54 -44
  12. package/dist/comments/floating-composer.mjs.map +1 -1
  13. package/dist/comments/floating-threads.js +29 -28
  14. package/dist/comments/floating-threads.js.map +1 -1
  15. package/dist/comments/floating-threads.mjs +16 -15
  16. package/dist/comments/floating-threads.mjs.map +1 -1
  17. package/dist/index.d.mts +8 -6
  18. package/dist/index.d.ts +8 -6
  19. package/dist/liveblocks-plugin-provider.js +46 -38
  20. package/dist/liveblocks-plugin-provider.js.map +1 -1
  21. package/dist/liveblocks-plugin-provider.mjs +28 -20
  22. package/dist/liveblocks-plugin-provider.mjs.map +1 -1
  23. package/dist/mentions/avatar.js +24 -17
  24. package/dist/mentions/avatar.js.map +1 -1
  25. package/dist/mentions/avatar.mjs +21 -14
  26. package/dist/mentions/avatar.mjs.map +1 -1
  27. package/dist/mentions/mention-component.js +9 -8
  28. package/dist/mentions/mention-component.js.map +1 -1
  29. package/dist/mentions/mention-component.mjs +6 -5
  30. package/dist/mentions/mention-component.mjs.map +1 -1
  31. package/dist/mentions/mention-node.js +10 -25
  32. package/dist/mentions/mention-node.js.map +1 -1
  33. package/dist/mentions/mention-node.mjs +10 -6
  34. package/dist/mentions/mention-node.mjs.map +1 -1
  35. package/dist/mentions/mention-plugin.js +42 -33
  36. package/dist/mentions/mention-plugin.js.map +1 -1
  37. package/dist/mentions/mention-plugin.mjs +36 -27
  38. package/dist/mentions/mention-plugin.mjs.map +1 -1
  39. package/dist/mentions/suggestions.js +34 -30
  40. package/dist/mentions/suggestions.js.map +1 -1
  41. package/dist/mentions/suggestions.mjs +16 -12
  42. package/dist/mentions/suggestions.mjs.map +1 -1
  43. package/dist/mentions/user.js +9 -7
  44. package/dist/mentions/user.js.map +1 -1
  45. package/dist/mentions/user.mjs +6 -4
  46. package/dist/mentions/user.mjs.map +1 -1
  47. package/dist/version-history/history-version-preview.js +77 -54
  48. package/dist/version-history/history-version-preview.js.map +1 -1
  49. package/dist/version-history/history-version-preview.mjs +70 -47
  50. package/dist/version-history/history-version-preview.mjs.map +1 -1
  51. package/dist/version.js +1 -1
  52. package/dist/version.js.map +1 -1
  53. package/dist/version.mjs +1 -1
  54. package/dist/version.mjs.map +1 -1
  55. package/package.json +8 -10
@@ -1,14 +1,14 @@
1
1
  'use strict';
2
2
 
3
+ var jsxRuntime = require('react/jsx-runtime');
3
4
  var reactDom = require('@floating-ui/react-dom');
4
5
  var LexicalCollaborationPlugin = require('@lexical/react/LexicalCollaborationPlugin');
5
6
  var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
6
7
  var core = require('@liveblocks/core');
7
- var react = require('@liveblocks/react');
8
+ var react$1 = require('@liveblocks/react');
8
9
  var _private = require('@liveblocks/react/_private');
9
10
  var yjs$1 = require('@liveblocks/yjs');
10
- var React = require('react');
11
- var index_js = require('use-sync-external-store/shim/index.js');
11
+ var react = require('react');
12
12
  var yjs = require('yjs');
13
13
  var commentPluginProvider = require('./comments/comment-plugin-provider.js');
14
14
  var threadMarkNode = require('./comments/thread-mark-node.js');
@@ -18,7 +18,7 @@ var mentionPlugin = require('./mentions/mention-plugin.js');
18
18
  const providersMap = /* @__PURE__ */ new Map();
19
19
  function useEditorStatus() {
20
20
  const provider = _private.useYjsProvider();
21
- const subscribe = React.useCallback(
21
+ const subscribe = react.useCallback(
22
22
  (onStoreChange) => {
23
23
  if (provider === void 0)
24
24
  return () => {
@@ -30,21 +30,21 @@ function useEditorStatus() {
30
30
  },
31
31
  [provider]
32
32
  );
33
- const getSnapshot = React.useCallback(() => {
33
+ const getSnapshot = react.useCallback(() => {
34
34
  if (provider === void 0) {
35
35
  return "not-loaded";
36
36
  }
37
37
  return provider.getStatus();
38
38
  }, [provider]);
39
- return index_js.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
39
+ return react.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
40
40
  }
41
41
  function useIsEditorReady() {
42
42
  const yjsProvider = _private.useYjsProvider();
43
- const getSnapshot = React.useCallback(() => {
43
+ const getSnapshot = react.useCallback(() => {
44
44
  const status = yjsProvider?.getStatus();
45
45
  return status === "synchronizing" || status === "synchronized";
46
46
  }, [yjsProvider]);
47
- const subscribe = React.useCallback(
47
+ const subscribe = react.useCallback(
48
48
  (callback) => {
49
49
  if (yjsProvider === void 0)
50
50
  return () => {
@@ -56,21 +56,21 @@ function useIsEditorReady() {
56
56
  },
57
57
  [yjsProvider]
58
58
  );
59
- return index_js.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
59
+ return react.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
60
60
  }
61
61
  const LiveblocksPlugin = ({
62
62
  children
63
63
  }) => {
64
64
  const isResolveMentionSuggestionsDefined = _private.useResolveMentionSuggestions() !== void 0;
65
65
  const [editor] = LexicalComposerContext.useLexicalComposerContext();
66
- const room = react.useRoom();
67
- const previousRoomIdRef = React.useRef(null);
66
+ const room = react$1.useRoom();
67
+ const previousRoomIdRef = react.useRef(null);
68
68
  if (!editor.hasNodes([threadMarkNode.ThreadMarkNode, mentionNode.MentionNode])) {
69
69
  throw new Error(
70
70
  "LiveblocksPlugin requires Lexical configuration to be wrapped in the `liveblocksConfig(options)` function. For more information: https://liveblocks.io/docs/api-reference/liveblocks-react-lexical#liveblocksConfig"
71
71
  );
72
72
  }
73
- const [containerRef, setContainerRef] = React.useState(void 0);
73
+ const [containerRef, setContainerRef] = react.useState(void 0);
74
74
  const {
75
75
  refs: { setReference, setFloating },
76
76
  strategy,
@@ -85,7 +85,7 @@ const LiveblocksPlugin = ({
85
85
  });
86
86
  }
87
87
  });
88
- React.useEffect(() => {
88
+ react.useEffect(() => {
89
89
  if (process.env.NODE_ENV !== "production") {
90
90
  if (!editor.getEditorState().isEmpty()) {
91
91
  console.warn(
@@ -95,8 +95,8 @@ const LiveblocksPlugin = ({
95
95
  }
96
96
  }, []);
97
97
  _private.useReportTextEditor(core.TextEditorType.Lexical, "root");
98
- const self = react.useSelf();
99
- const providerFactory = React.useCallback(
98
+ const self = react$1.useSelf();
99
+ const providerFactory = react.useCallback(
100
100
  (id, yjsDocMap) => {
101
101
  if (previousRoomIdRef.current !== null && previousRoomIdRef.current !== id) {
102
102
  const previousProvider = providersMap.get(id);
@@ -119,51 +119,59 @@ const LiveblocksPlugin = ({
119
119
  [room]
120
120
  );
121
121
  const root = useRootElement();
122
- React.useLayoutEffect(() => {
122
+ react.useLayoutEffect(() => {
123
123
  if (root === null)
124
124
  return;
125
125
  setReference({
126
126
  getBoundingClientRect: () => root.getBoundingClientRect()
127
127
  });
128
128
  }, [setReference, root]);
129
- const handleFloatingRef = React.useCallback(
129
+ const handleFloatingRef = react.useCallback(
130
130
  (node) => {
131
131
  setFloating(node);
132
132
  setContainerRef({ current: node });
133
133
  },
134
134
  [setFloating, setContainerRef]
135
135
  );
136
- return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", {
137
- ref: handleFloatingRef,
138
- style: {
139
- position: strategy,
140
- top: 0,
141
- left: 0,
142
- transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,
143
- minWidth: "max-content"
144
- }
145
- }), self && /* @__PURE__ */ React.createElement(LexicalCollaborationPlugin.CollaborationPlugin, {
146
- key: room.id,
147
- id: room.id,
148
- providerFactory,
149
- username: self.info?.name ?? "",
150
- cursorColor: self.info?.color,
151
- cursorsContainerRef: containerRef,
152
- shouldBootstrap: true
153
- }), isResolveMentionSuggestionsDefined && /* @__PURE__ */ React.createElement(mentionPlugin.MentionPlugin, null), /* @__PURE__ */ React.createElement(commentPluginProvider.CommentPluginProvider, null, children));
136
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
137
+ children: [
138
+ /* @__PURE__ */ jsxRuntime.jsx("div", {
139
+ ref: handleFloatingRef,
140
+ style: {
141
+ position: strategy,
142
+ top: 0,
143
+ left: 0,
144
+ transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,
145
+ minWidth: "max-content"
146
+ }
147
+ }),
148
+ self && /* @__PURE__ */ jsxRuntime.jsx(LexicalCollaborationPlugin.CollaborationPlugin, {
149
+ id: room.id,
150
+ providerFactory,
151
+ username: self.info?.name ?? "",
152
+ cursorColor: self.info?.color,
153
+ cursorsContainerRef: containerRef,
154
+ shouldBootstrap: true
155
+ }, room.id),
156
+ isResolveMentionSuggestionsDefined && /* @__PURE__ */ jsxRuntime.jsx(mentionPlugin.MentionPlugin, {}),
157
+ /* @__PURE__ */ jsxRuntime.jsx(commentPluginProvider.CommentPluginProvider, {
158
+ children
159
+ })
160
+ ]
161
+ });
154
162
  };
155
163
  function useRootElement() {
156
164
  const [editor] = LexicalComposerContext.useLexicalComposerContext();
157
- const subscribe = React.useCallback(
165
+ const subscribe = react.useCallback(
158
166
  (onStoreChange) => {
159
167
  return editor.registerRootListener(onStoreChange);
160
168
  },
161
169
  [editor]
162
170
  );
163
- const getSnapshot = React.useCallback(() => {
171
+ const getSnapshot = react.useCallback(() => {
164
172
  return editor.getRootElement();
165
173
  }, [editor]);
166
- return index_js.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
174
+ return react.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
167
175
  }
168
176
 
169
177
  exports.LiveblocksPlugin = LiveblocksPlugin;
@@ -1 +1 @@
1
- {"version":3,"file":"liveblocks-plugin-provider.js","sources":["../src/liveblocks-plugin-provider.tsx"],"sourcesContent":["import { autoUpdate, useFloating } from \"@floating-ui/react-dom\";\nimport { CollaborationPlugin } from \"@lexical/react/LexicalCollaborationPlugin\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport type { Provider } from \"@lexical/yjs\";\nimport { nn, TextEditorType } from \"@liveblocks/core\";\nimport { useRoom, useSelf } from \"@liveblocks/react\";\nimport {\n useReportTextEditor,\n useResolveMentionSuggestions,\n useYjsProvider,\n} from \"@liveblocks/react/_private\";\nimport { LiveblocksYjsProvider } from \"@liveblocks/yjs\";\nimport type { MutableRefObject } from \"react\";\nimport React, {\n useCallback,\n useEffect,\n useLayoutEffect,\n useRef,\n useState,\n} from \"react\";\nimport { useSyncExternalStore } from \"use-sync-external-store/shim/index.js\";\nimport { Doc } from \"yjs\";\n\nimport { CommentPluginProvider } from \"./comments/comment-plugin-provider\";\nimport { ThreadMarkNode } from \"./comments/thread-mark-node\";\nimport { MentionNode } from \"./mentions/mention-node\";\nimport { MentionPlugin } from \"./mentions/mention-plugin\";\n\n// TODO: Replace by ref once I understand why useRef is not stable (?!)\nconst providersMap = new Map<\n string,\n LiveblocksYjsProvider<never, never, never, never, never>\n>();\n\nexport type EditorStatus =\n /* The editor state is not loaded and has not been requested. */\n | \"not-loaded\"\n /* The editor state is loading from Liveblocks servers */\n | \"loading\"\n /**\n * Not working yet! Will be available in a future release.\n * Some editor state modifications has not been acknowledged yet by the server\n */\n | \"synchronizing\"\n /* The editor state is sync with Liveblocks servers */\n | \"synchronized\";\n\n/**\n * Get the storage status.\n *\n * - `not-loaded`: Initial state when entering the room.\n * - `loading`: Once the editor state has been requested by LiveblocksPlugin.\n * - `synchronizing`: Not working yet! Will be available in a future release.\n * - `synchronized`: The editor state is sync with Liveblocks servers.\n *\n * @deprecated Prefer `useIsEditorReady` or `useSyncStatus` (from @liveblocks/react)\n */\nexport function useEditorStatus(): EditorStatus {\n const provider = useYjsProvider();\n\n const subscribe = useCallback(\n (onStoreChange: () => void) => {\n if (provider === undefined) return () => {};\n provider.on(\"status\", onStoreChange);\n return () => {\n provider.off(\"status\", onStoreChange);\n };\n },\n [provider]\n );\n\n const getSnapshot = useCallback(() => {\n if (provider === undefined) {\n return \"not-loaded\";\n }\n return provider.getStatus();\n }, [provider]);\n\n return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\n/**\n * Returns whether the editor has loaded the initial text contents from the\n * server and is ready to be used.\n */\nexport function useIsEditorReady(): boolean {\n const yjsProvider = useYjsProvider();\n\n const getSnapshot = useCallback(() => {\n const status = yjsProvider?.getStatus();\n return status === \"synchronizing\" || status === \"synchronized\";\n }, [yjsProvider]);\n\n const subscribe = useCallback(\n (callback: () => void) => {\n if (yjsProvider === undefined) return () => {};\n yjsProvider.on(\"status\", callback);\n return () => {\n yjsProvider.off(\"status\", callback);\n };\n },\n [yjsProvider]\n );\n\n return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\nexport type LiveblocksPluginProps = {\n children?: React.ReactNode;\n};\n\n/**\n * Liveblocks plugin for Lexical that adds collaboration to your editor.\n *\n * `LiveblocksPlugin` should always be nested inside `LexicalComposer`.\n *\n * @example\n *\n * import { LexicalComposer } from \"@lexical/react/LexicalComposer\";\n * import { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\n * import { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\n * import { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\n * import { liveblocksConfig, LiveblocksPlugin } from \"@liveblocks/react-lexical\";\n *\n * const initialConfig = liveblocksConfig({\n * namespace: \"MyEditor\",\n * theme: {},\n * nodes: [],\n * onError: (err) => console.error(err),\n * });\n *\n * function Editor() {\n * return (\n * <LexicalComposer initialConfig={initialConfig}>\n * <LiveblocksPlugin />\n * <RichTextPlugin\n * contentEditable={<ContentEditable />}\n * placeholder={<div>Enter some text...</div>}\n * ErrorBoundary={LexicalErrorBoundary}\n * />\n * </LexicalComposer>\n * );\n * }\n */\nexport const LiveblocksPlugin = ({\n children,\n}: LiveblocksPluginProps): JSX.Element => {\n const isResolveMentionSuggestionsDefined =\n useResolveMentionSuggestions() !== undefined;\n const [editor] = useLexicalComposerContext();\n const room = useRoom();\n const previousRoomIdRef = useRef<string | null>(null);\n\n if (!editor.hasNodes([ThreadMarkNode, MentionNode])) {\n throw new Error(\n \"LiveblocksPlugin requires Lexical configuration to be wrapped in the `liveblocksConfig(options)` function. For more information: https://liveblocks.io/docs/api-reference/liveblocks-react-lexical#liveblocksConfig\"\n );\n }\n\n const [containerRef, setContainerRef] = useState<\n MutableRefObject<HTMLDivElement | null> | undefined\n >(undefined);\n\n const {\n refs: { setReference, setFloating },\n strategy,\n x,\n y,\n } = useFloating({\n strategy: \"fixed\",\n placement: \"bottom\",\n whileElementsMounted: (...args) => {\n return autoUpdate(...args, {\n animationFrame: true,\n });\n },\n });\n\n // Warn users if initialConfig.editorState, set on the composer, is not null\n useEffect(() => {\n // only in dev mode\n if (process.env.NODE_ENV !== \"production\") {\n // A user should not even be set an emptyState, but when passing null, getEditorState still has initial empty state\n if (!editor.getEditorState().isEmpty()) {\n console.warn(\n \"Warning: LiveblocksPlugin: editorState in initialConfig detected, but must be null.\"\n );\n }\n }\n\n // we know editor is already defined as we're inside LexicalComposer, and we only want this running the first time\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useReportTextEditor(TextEditorType.Lexical, \"root\");\n\n // Get user info or allow override from props\n const self = useSelf();\n\n const providerFactory = useCallback(\n (id: string, yjsDocMap: Map<string, Doc>): Provider => {\n // Destroy previously used provider to avoid memory leaks\n // TODO: Find a way to destroy the last used provider on unmount (while working with StrictMode)\n if (\n previousRoomIdRef.current !== null &&\n previousRoomIdRef.current !== id\n ) {\n const previousProvider = providersMap.get(id);\n if (previousProvider !== undefined) {\n previousProvider.destroy();\n }\n }\n\n let doc = yjsDocMap.get(id);\n\n if (doc === undefined) {\n doc = new Doc();\n const provider = new LiveblocksYjsProvider(room, doc);\n yjsDocMap.set(id, doc);\n providersMap.set(id, provider);\n }\n\n return nn(\n providersMap.get(id),\n \"Internal error. Should never happen\"\n ) as Provider;\n },\n [room]\n );\n\n const root = useRootElement();\n\n useLayoutEffect(() => {\n if (root === null) return;\n setReference({\n getBoundingClientRect: () => root.getBoundingClientRect(),\n });\n }, [setReference, root]);\n\n const handleFloatingRef = useCallback(\n (node: HTMLDivElement) => {\n setFloating(node);\n setContainerRef({ current: node });\n },\n [setFloating, setContainerRef]\n );\n\n return (\n <>\n <div\n ref={handleFloatingRef}\n style={{\n position: strategy,\n top: 0,\n left: 0,\n transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,\n minWidth: \"max-content\",\n }}\n />\n\n {self && (\n <CollaborationPlugin\n // Setting the key allows us to reset the internal Y.doc used by useYjsCollaboration\n // without implementing `reload` event\n key={room.id}\n id={room.id}\n providerFactory={providerFactory}\n username={self.info?.name ?? \"\"} // use empty string to prevent random name\n cursorColor={self.info?.color as string | undefined}\n cursorsContainerRef={containerRef}\n shouldBootstrap={true}\n />\n )}\n\n {isResolveMentionSuggestionsDefined && <MentionPlugin />}\n <CommentPluginProvider>{children}</CommentPluginProvider>\n </>\n );\n};\n\nexport function useRootElement(): HTMLElement | null {\n const [editor] = useLexicalComposerContext();\n\n const subscribe = useCallback(\n (onStoreChange: () => void) => {\n return editor.registerRootListener(onStoreChange);\n },\n [editor]\n );\n\n const getSnapshot = useCallback(() => {\n return editor.getRootElement();\n }, [editor]);\n\n return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"],"names":["useYjsProvider","useCallback","useSyncExternalStore","useResolveMentionSuggestions","useLexicalComposerContext","useRoom","useRef","ThreadMarkNode","MentionNode","useState","useFloating","autoUpdate","useEffect","useReportTextEditor","TextEditorType","useSelf","Doc","LiveblocksYjsProvider","nn","useLayoutEffect","CollaborationPlugin","MentionPlugin","CommentPluginProvider"],"mappings":"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"}
1
+ {"version":3,"file":"liveblocks-plugin-provider.js","sources":["../src/liveblocks-plugin-provider.tsx"],"sourcesContent":["import { autoUpdate, useFloating } from \"@floating-ui/react-dom\";\nimport { CollaborationPlugin } from \"@lexical/react/LexicalCollaborationPlugin\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport type { Provider } from \"@lexical/yjs\";\nimport { nn, TextEditorType } from \"@liveblocks/core\";\nimport { useRoom, useSelf } from \"@liveblocks/react\";\nimport {\n useReportTextEditor,\n useResolveMentionSuggestions,\n useYjsProvider,\n} from \"@liveblocks/react/_private\";\nimport { LiveblocksYjsProvider } from \"@liveblocks/yjs\";\nimport type { MutableRefObject, ReactNode } from \"react\";\nimport {\n useCallback,\n useEffect,\n useLayoutEffect,\n useRef,\n useState,\n useSyncExternalStore,\n} from \"react\";\nimport { Doc } from \"yjs\";\n\nimport { CommentPluginProvider } from \"./comments/comment-plugin-provider\";\nimport { ThreadMarkNode } from \"./comments/thread-mark-node\";\nimport { MentionNode } from \"./mentions/mention-node\";\nimport { MentionPlugin } from \"./mentions/mention-plugin\";\n\n// TODO: Replace by ref once I understand why useRef is not stable (?!)\nconst providersMap = new Map<\n string,\n LiveblocksYjsProvider<never, never, never, never, never>\n>();\n\nexport type EditorStatus =\n /* The editor state is not loaded and has not been requested. */\n | \"not-loaded\"\n /* The editor state is loading from Liveblocks servers */\n | \"loading\"\n /**\n * Not working yet! Will be available in a future release.\n * Some editor state modifications has not been acknowledged yet by the server\n */\n | \"synchronizing\"\n /* The editor state is sync with Liveblocks servers */\n | \"synchronized\";\n\n/**\n * Get the storage status.\n *\n * - `not-loaded`: Initial state when entering the room.\n * - `loading`: Once the editor state has been requested by LiveblocksPlugin.\n * - `synchronizing`: Not working yet! Will be available in a future release.\n * - `synchronized`: The editor state is sync with Liveblocks servers.\n *\n * @deprecated Prefer `useIsEditorReady` or `useSyncStatus` (from @liveblocks/react)\n */\nexport function useEditorStatus(): EditorStatus {\n const provider = useYjsProvider();\n\n const subscribe = useCallback(\n (onStoreChange: () => void) => {\n if (provider === undefined) return () => {};\n provider.on(\"status\", onStoreChange);\n return () => {\n provider.off(\"status\", onStoreChange);\n };\n },\n [provider]\n );\n\n const getSnapshot = useCallback(() => {\n if (provider === undefined) {\n return \"not-loaded\";\n }\n return provider.getStatus();\n }, [provider]);\n\n return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\n/**\n * Returns whether the editor has loaded the initial text contents from the\n * server and is ready to be used.\n */\nexport function useIsEditorReady(): boolean {\n const yjsProvider = useYjsProvider();\n\n const getSnapshot = useCallback(() => {\n const status = yjsProvider?.getStatus();\n return status === \"synchronizing\" || status === \"synchronized\";\n }, [yjsProvider]);\n\n const subscribe = useCallback(\n (callback: () => void) => {\n if (yjsProvider === undefined) return () => {};\n yjsProvider.on(\"status\", callback);\n return () => {\n yjsProvider.off(\"status\", callback);\n };\n },\n [yjsProvider]\n );\n\n return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\nexport type LiveblocksPluginProps = {\n children?: ReactNode;\n};\n\n/**\n * Liveblocks plugin for Lexical that adds collaboration to your editor.\n *\n * `LiveblocksPlugin` should always be nested inside `LexicalComposer`.\n *\n * @example\n *\n * import { LexicalComposer } from \"@lexical/react/LexicalComposer\";\n * import { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\n * import { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\n * import { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\n * import { liveblocksConfig, LiveblocksPlugin } from \"@liveblocks/react-lexical\";\n *\n * const initialConfig = liveblocksConfig({\n * namespace: \"MyEditor\",\n * theme: {},\n * nodes: [],\n * onError: (err) => console.error(err),\n * });\n *\n * function Editor() {\n * return (\n * <LexicalComposer initialConfig={initialConfig}>\n * <LiveblocksPlugin />\n * <RichTextPlugin\n * contentEditable={<ContentEditable />}\n * placeholder={<div>Enter some text...</div>}\n * ErrorBoundary={LexicalErrorBoundary}\n * />\n * </LexicalComposer>\n * );\n * }\n */\nexport const LiveblocksPlugin = ({\n children,\n}: LiveblocksPluginProps): JSX.Element => {\n const isResolveMentionSuggestionsDefined =\n useResolveMentionSuggestions() !== undefined;\n const [editor] = useLexicalComposerContext();\n const room = useRoom();\n const previousRoomIdRef = useRef<string | null>(null);\n\n if (!editor.hasNodes([ThreadMarkNode, MentionNode])) {\n throw new Error(\n \"LiveblocksPlugin requires Lexical configuration to be wrapped in the `liveblocksConfig(options)` function. For more information: https://liveblocks.io/docs/api-reference/liveblocks-react-lexical#liveblocksConfig\"\n );\n }\n\n const [containerRef, setContainerRef] = useState<\n MutableRefObject<HTMLDivElement | null> | undefined\n >(undefined);\n\n const {\n refs: { setReference, setFloating },\n strategy,\n x,\n y,\n } = useFloating({\n strategy: \"fixed\",\n placement: \"bottom\",\n whileElementsMounted: (...args) => {\n return autoUpdate(...args, {\n animationFrame: true,\n });\n },\n });\n\n // Warn users if initialConfig.editorState, set on the composer, is not null\n useEffect(() => {\n // only in dev mode\n if (process.env.NODE_ENV !== \"production\") {\n // A user should not even be set an emptyState, but when passing null, getEditorState still has initial empty state\n if (!editor.getEditorState().isEmpty()) {\n console.warn(\n \"Warning: LiveblocksPlugin: editorState in initialConfig detected, but must be null.\"\n );\n }\n }\n\n // we know editor is already defined as we're inside LexicalComposer, and we only want this running the first time\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useReportTextEditor(TextEditorType.Lexical, \"root\");\n\n // Get user info or allow override from props\n const self = useSelf();\n\n const providerFactory = useCallback(\n (id: string, yjsDocMap: Map<string, Doc>): Provider => {\n // Destroy previously used provider to avoid memory leaks\n // TODO: Find a way to destroy the last used provider on unmount (while working with StrictMode)\n if (\n previousRoomIdRef.current !== null &&\n previousRoomIdRef.current !== id\n ) {\n const previousProvider = providersMap.get(id);\n if (previousProvider !== undefined) {\n previousProvider.destroy();\n }\n }\n\n let doc = yjsDocMap.get(id);\n\n if (doc === undefined) {\n doc = new Doc();\n const provider = new LiveblocksYjsProvider(room, doc);\n yjsDocMap.set(id, doc);\n providersMap.set(id, provider);\n }\n\n return nn(\n providersMap.get(id),\n \"Internal error. Should never happen\"\n ) as Provider;\n },\n [room]\n );\n\n const root = useRootElement();\n\n useLayoutEffect(() => {\n if (root === null) return;\n setReference({\n getBoundingClientRect: () => root.getBoundingClientRect(),\n });\n }, [setReference, root]);\n\n const handleFloatingRef = useCallback(\n (node: HTMLDivElement) => {\n setFloating(node);\n setContainerRef({ current: node });\n },\n [setFloating, setContainerRef]\n );\n\n return (\n <>\n <div\n ref={handleFloatingRef}\n style={{\n position: strategy,\n top: 0,\n left: 0,\n transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,\n minWidth: \"max-content\",\n }}\n />\n\n {self && (\n <CollaborationPlugin\n // Setting the key allows us to reset the internal Y.doc used by useYjsCollaboration\n // without implementing `reload` event\n key={room.id}\n id={room.id}\n providerFactory={providerFactory}\n username={self.info?.name ?? \"\"} // use empty string to prevent random name\n cursorColor={self.info?.color as string | undefined}\n cursorsContainerRef={containerRef}\n shouldBootstrap={true}\n />\n )}\n\n {isResolveMentionSuggestionsDefined && <MentionPlugin />}\n <CommentPluginProvider>{children}</CommentPluginProvider>\n </>\n );\n};\n\nexport function useRootElement(): HTMLElement | null {\n const [editor] = useLexicalComposerContext();\n\n const subscribe = useCallback(\n (onStoreChange: () => void) => {\n return editor.registerRootListener(onStoreChange);\n },\n [editor]\n );\n\n const getSnapshot = useCallback(() => {\n return editor.getRootElement();\n }, [editor]);\n\n return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"],"names":["useYjsProvider","useCallback","useSyncExternalStore","useResolveMentionSuggestions","useLexicalComposerContext","useRoom","useRef","ThreadMarkNode","MentionNode","useState","useFloating","autoUpdate","useEffect","useReportTextEditor","TextEditorType","useSelf","Doc","LiveblocksYjsProvider","nn","useLayoutEffect","jsxs","Fragment","jsx","CollaborationPlugin","MentionPlugin","CommentPluginProvider"],"mappings":"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"}
@@ -1,3 +1,4 @@
1
+ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
1
2
  import { useFloating, autoUpdate } from '@floating-ui/react-dom';
2
3
  import { CollaborationPlugin } from '@lexical/react/LexicalCollaborationPlugin';
3
4
  import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
@@ -5,8 +6,7 @@ import { TextEditorType, nn } from '@liveblocks/core';
5
6
  import { useRoom, useSelf } from '@liveblocks/react';
6
7
  import { useYjsProvider, useResolveMentionSuggestions, useReportTextEditor } from '@liveblocks/react/_private';
7
8
  import { LiveblocksYjsProvider } from '@liveblocks/yjs';
8
- import React__default, { useCallback, useRef, useState, useEffect, useLayoutEffect } from 'react';
9
- import { useSyncExternalStore } from 'use-sync-external-store/shim/index.js';
9
+ import { useCallback, useSyncExternalStore, useRef, useState, useEffect, useLayoutEffect } from 'react';
10
10
  import { Doc } from 'yjs';
11
11
  import { CommentPluginProvider } from './comments/comment-plugin-provider.mjs';
12
12
  import { ThreadMarkNode } from './comments/thread-mark-node.mjs';
@@ -131,24 +131,32 @@ const LiveblocksPlugin = ({
131
131
  },
132
132
  [setFloating, setContainerRef]
133
133
  );
134
- return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("div", {
135
- ref: handleFloatingRef,
136
- style: {
137
- position: strategy,
138
- top: 0,
139
- left: 0,
140
- transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,
141
- minWidth: "max-content"
142
- }
143
- }), self && /* @__PURE__ */ React__default.createElement(CollaborationPlugin, {
144
- key: room.id,
145
- id: room.id,
146
- providerFactory,
147
- username: self.info?.name ?? "",
148
- cursorColor: self.info?.color,
149
- cursorsContainerRef: containerRef,
150
- shouldBootstrap: true
151
- }), isResolveMentionSuggestionsDefined && /* @__PURE__ */ React__default.createElement(MentionPlugin, null), /* @__PURE__ */ React__default.createElement(CommentPluginProvider, null, children));
134
+ return /* @__PURE__ */ jsxs(Fragment, {
135
+ children: [
136
+ /* @__PURE__ */ jsx("div", {
137
+ ref: handleFloatingRef,
138
+ style: {
139
+ position: strategy,
140
+ top: 0,
141
+ left: 0,
142
+ transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,
143
+ minWidth: "max-content"
144
+ }
145
+ }),
146
+ self && /* @__PURE__ */ jsx(CollaborationPlugin, {
147
+ id: room.id,
148
+ providerFactory,
149
+ username: self.info?.name ?? "",
150
+ cursorColor: self.info?.color,
151
+ cursorsContainerRef: containerRef,
152
+ shouldBootstrap: true
153
+ }, room.id),
154
+ isResolveMentionSuggestionsDefined && /* @__PURE__ */ jsx(MentionPlugin, {}),
155
+ /* @__PURE__ */ jsx(CommentPluginProvider, {
156
+ children
157
+ })
158
+ ]
159
+ });
152
160
  };
153
161
  function useRootElement() {
154
162
  const [editor] = useLexicalComposerContext();
@@ -1 +1 @@
1
- {"version":3,"file":"liveblocks-plugin-provider.mjs","sources":["../src/liveblocks-plugin-provider.tsx"],"sourcesContent":["import { autoUpdate, useFloating } from \"@floating-ui/react-dom\";\nimport { CollaborationPlugin } from \"@lexical/react/LexicalCollaborationPlugin\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport type { Provider } from \"@lexical/yjs\";\nimport { nn, TextEditorType } from \"@liveblocks/core\";\nimport { useRoom, useSelf } from \"@liveblocks/react\";\nimport {\n useReportTextEditor,\n useResolveMentionSuggestions,\n useYjsProvider,\n} from \"@liveblocks/react/_private\";\nimport { LiveblocksYjsProvider } from \"@liveblocks/yjs\";\nimport type { MutableRefObject } from \"react\";\nimport React, {\n useCallback,\n useEffect,\n useLayoutEffect,\n useRef,\n useState,\n} from \"react\";\nimport { useSyncExternalStore } from \"use-sync-external-store/shim/index.js\";\nimport { Doc } from \"yjs\";\n\nimport { CommentPluginProvider } from \"./comments/comment-plugin-provider\";\nimport { ThreadMarkNode } from \"./comments/thread-mark-node\";\nimport { MentionNode } from \"./mentions/mention-node\";\nimport { MentionPlugin } from \"./mentions/mention-plugin\";\n\n// TODO: Replace by ref once I understand why useRef is not stable (?!)\nconst providersMap = new Map<\n string,\n LiveblocksYjsProvider<never, never, never, never, never>\n>();\n\nexport type EditorStatus =\n /* The editor state is not loaded and has not been requested. */\n | \"not-loaded\"\n /* The editor state is loading from Liveblocks servers */\n | \"loading\"\n /**\n * Not working yet! Will be available in a future release.\n * Some editor state modifications has not been acknowledged yet by the server\n */\n | \"synchronizing\"\n /* The editor state is sync with Liveblocks servers */\n | \"synchronized\";\n\n/**\n * Get the storage status.\n *\n * - `not-loaded`: Initial state when entering the room.\n * - `loading`: Once the editor state has been requested by LiveblocksPlugin.\n * - `synchronizing`: Not working yet! Will be available in a future release.\n * - `synchronized`: The editor state is sync with Liveblocks servers.\n *\n * @deprecated Prefer `useIsEditorReady` or `useSyncStatus` (from @liveblocks/react)\n */\nexport function useEditorStatus(): EditorStatus {\n const provider = useYjsProvider();\n\n const subscribe = useCallback(\n (onStoreChange: () => void) => {\n if (provider === undefined) return () => {};\n provider.on(\"status\", onStoreChange);\n return () => {\n provider.off(\"status\", onStoreChange);\n };\n },\n [provider]\n );\n\n const getSnapshot = useCallback(() => {\n if (provider === undefined) {\n return \"not-loaded\";\n }\n return provider.getStatus();\n }, [provider]);\n\n return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\n/**\n * Returns whether the editor has loaded the initial text contents from the\n * server and is ready to be used.\n */\nexport function useIsEditorReady(): boolean {\n const yjsProvider = useYjsProvider();\n\n const getSnapshot = useCallback(() => {\n const status = yjsProvider?.getStatus();\n return status === \"synchronizing\" || status === \"synchronized\";\n }, [yjsProvider]);\n\n const subscribe = useCallback(\n (callback: () => void) => {\n if (yjsProvider === undefined) return () => {};\n yjsProvider.on(\"status\", callback);\n return () => {\n yjsProvider.off(\"status\", callback);\n };\n },\n [yjsProvider]\n );\n\n return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\nexport type LiveblocksPluginProps = {\n children?: React.ReactNode;\n};\n\n/**\n * Liveblocks plugin for Lexical that adds collaboration to your editor.\n *\n * `LiveblocksPlugin` should always be nested inside `LexicalComposer`.\n *\n * @example\n *\n * import { LexicalComposer } from \"@lexical/react/LexicalComposer\";\n * import { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\n * import { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\n * import { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\n * import { liveblocksConfig, LiveblocksPlugin } from \"@liveblocks/react-lexical\";\n *\n * const initialConfig = liveblocksConfig({\n * namespace: \"MyEditor\",\n * theme: {},\n * nodes: [],\n * onError: (err) => console.error(err),\n * });\n *\n * function Editor() {\n * return (\n * <LexicalComposer initialConfig={initialConfig}>\n * <LiveblocksPlugin />\n * <RichTextPlugin\n * contentEditable={<ContentEditable />}\n * placeholder={<div>Enter some text...</div>}\n * ErrorBoundary={LexicalErrorBoundary}\n * />\n * </LexicalComposer>\n * );\n * }\n */\nexport const LiveblocksPlugin = ({\n children,\n}: LiveblocksPluginProps): JSX.Element => {\n const isResolveMentionSuggestionsDefined =\n useResolveMentionSuggestions() !== undefined;\n const [editor] = useLexicalComposerContext();\n const room = useRoom();\n const previousRoomIdRef = useRef<string | null>(null);\n\n if (!editor.hasNodes([ThreadMarkNode, MentionNode])) {\n throw new Error(\n \"LiveblocksPlugin requires Lexical configuration to be wrapped in the `liveblocksConfig(options)` function. For more information: https://liveblocks.io/docs/api-reference/liveblocks-react-lexical#liveblocksConfig\"\n );\n }\n\n const [containerRef, setContainerRef] = useState<\n MutableRefObject<HTMLDivElement | null> | undefined\n >(undefined);\n\n const {\n refs: { setReference, setFloating },\n strategy,\n x,\n y,\n } = useFloating({\n strategy: \"fixed\",\n placement: \"bottom\",\n whileElementsMounted: (...args) => {\n return autoUpdate(...args, {\n animationFrame: true,\n });\n },\n });\n\n // Warn users if initialConfig.editorState, set on the composer, is not null\n useEffect(() => {\n // only in dev mode\n if (process.env.NODE_ENV !== \"production\") {\n // A user should not even be set an emptyState, but when passing null, getEditorState still has initial empty state\n if (!editor.getEditorState().isEmpty()) {\n console.warn(\n \"Warning: LiveblocksPlugin: editorState in initialConfig detected, but must be null.\"\n );\n }\n }\n\n // we know editor is already defined as we're inside LexicalComposer, and we only want this running the first time\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useReportTextEditor(TextEditorType.Lexical, \"root\");\n\n // Get user info or allow override from props\n const self = useSelf();\n\n const providerFactory = useCallback(\n (id: string, yjsDocMap: Map<string, Doc>): Provider => {\n // Destroy previously used provider to avoid memory leaks\n // TODO: Find a way to destroy the last used provider on unmount (while working with StrictMode)\n if (\n previousRoomIdRef.current !== null &&\n previousRoomIdRef.current !== id\n ) {\n const previousProvider = providersMap.get(id);\n if (previousProvider !== undefined) {\n previousProvider.destroy();\n }\n }\n\n let doc = yjsDocMap.get(id);\n\n if (doc === undefined) {\n doc = new Doc();\n const provider = new LiveblocksYjsProvider(room, doc);\n yjsDocMap.set(id, doc);\n providersMap.set(id, provider);\n }\n\n return nn(\n providersMap.get(id),\n \"Internal error. Should never happen\"\n ) as Provider;\n },\n [room]\n );\n\n const root = useRootElement();\n\n useLayoutEffect(() => {\n if (root === null) return;\n setReference({\n getBoundingClientRect: () => root.getBoundingClientRect(),\n });\n }, [setReference, root]);\n\n const handleFloatingRef = useCallback(\n (node: HTMLDivElement) => {\n setFloating(node);\n setContainerRef({ current: node });\n },\n [setFloating, setContainerRef]\n );\n\n return (\n <>\n <div\n ref={handleFloatingRef}\n style={{\n position: strategy,\n top: 0,\n left: 0,\n transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,\n minWidth: \"max-content\",\n }}\n />\n\n {self && (\n <CollaborationPlugin\n // Setting the key allows us to reset the internal Y.doc used by useYjsCollaboration\n // without implementing `reload` event\n key={room.id}\n id={room.id}\n providerFactory={providerFactory}\n username={self.info?.name ?? \"\"} // use empty string to prevent random name\n cursorColor={self.info?.color as string | undefined}\n cursorsContainerRef={containerRef}\n shouldBootstrap={true}\n />\n )}\n\n {isResolveMentionSuggestionsDefined && <MentionPlugin />}\n <CommentPluginProvider>{children}</CommentPluginProvider>\n </>\n );\n};\n\nexport function useRootElement(): HTMLElement | null {\n const [editor] = useLexicalComposerContext();\n\n const subscribe = useCallback(\n (onStoreChange: () => void) => {\n return editor.registerRootListener(onStoreChange);\n },\n [editor]\n );\n\n const getSnapshot = useCallback(() => {\n return editor.getRootElement();\n }, [editor]);\n\n return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"],"names":["React"],"mappings":"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"}
1
+ {"version":3,"file":"liveblocks-plugin-provider.mjs","sources":["../src/liveblocks-plugin-provider.tsx"],"sourcesContent":["import { autoUpdate, useFloating } from \"@floating-ui/react-dom\";\nimport { CollaborationPlugin } from \"@lexical/react/LexicalCollaborationPlugin\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport type { Provider } from \"@lexical/yjs\";\nimport { nn, TextEditorType } from \"@liveblocks/core\";\nimport { useRoom, useSelf } from \"@liveblocks/react\";\nimport {\n useReportTextEditor,\n useResolveMentionSuggestions,\n useYjsProvider,\n} from \"@liveblocks/react/_private\";\nimport { LiveblocksYjsProvider } from \"@liveblocks/yjs\";\nimport type { MutableRefObject, ReactNode } from \"react\";\nimport {\n useCallback,\n useEffect,\n useLayoutEffect,\n useRef,\n useState,\n useSyncExternalStore,\n} from \"react\";\nimport { Doc } from \"yjs\";\n\nimport { CommentPluginProvider } from \"./comments/comment-plugin-provider\";\nimport { ThreadMarkNode } from \"./comments/thread-mark-node\";\nimport { MentionNode } from \"./mentions/mention-node\";\nimport { MentionPlugin } from \"./mentions/mention-plugin\";\n\n// TODO: Replace by ref once I understand why useRef is not stable (?!)\nconst providersMap = new Map<\n string,\n LiveblocksYjsProvider<never, never, never, never, never>\n>();\n\nexport type EditorStatus =\n /* The editor state is not loaded and has not been requested. */\n | \"not-loaded\"\n /* The editor state is loading from Liveblocks servers */\n | \"loading\"\n /**\n * Not working yet! Will be available in a future release.\n * Some editor state modifications has not been acknowledged yet by the server\n */\n | \"synchronizing\"\n /* The editor state is sync with Liveblocks servers */\n | \"synchronized\";\n\n/**\n * Get the storage status.\n *\n * - `not-loaded`: Initial state when entering the room.\n * - `loading`: Once the editor state has been requested by LiveblocksPlugin.\n * - `synchronizing`: Not working yet! Will be available in a future release.\n * - `synchronized`: The editor state is sync with Liveblocks servers.\n *\n * @deprecated Prefer `useIsEditorReady` or `useSyncStatus` (from @liveblocks/react)\n */\nexport function useEditorStatus(): EditorStatus {\n const provider = useYjsProvider();\n\n const subscribe = useCallback(\n (onStoreChange: () => void) => {\n if (provider === undefined) return () => {};\n provider.on(\"status\", onStoreChange);\n return () => {\n provider.off(\"status\", onStoreChange);\n };\n },\n [provider]\n );\n\n const getSnapshot = useCallback(() => {\n if (provider === undefined) {\n return \"not-loaded\";\n }\n return provider.getStatus();\n }, [provider]);\n\n return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\n/**\n * Returns whether the editor has loaded the initial text contents from the\n * server and is ready to be used.\n */\nexport function useIsEditorReady(): boolean {\n const yjsProvider = useYjsProvider();\n\n const getSnapshot = useCallback(() => {\n const status = yjsProvider?.getStatus();\n return status === \"synchronizing\" || status === \"synchronized\";\n }, [yjsProvider]);\n\n const subscribe = useCallback(\n (callback: () => void) => {\n if (yjsProvider === undefined) return () => {};\n yjsProvider.on(\"status\", callback);\n return () => {\n yjsProvider.off(\"status\", callback);\n };\n },\n [yjsProvider]\n );\n\n return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\nexport type LiveblocksPluginProps = {\n children?: ReactNode;\n};\n\n/**\n * Liveblocks plugin for Lexical that adds collaboration to your editor.\n *\n * `LiveblocksPlugin` should always be nested inside `LexicalComposer`.\n *\n * @example\n *\n * import { LexicalComposer } from \"@lexical/react/LexicalComposer\";\n * import { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\n * import { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\n * import { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\n * import { liveblocksConfig, LiveblocksPlugin } from \"@liveblocks/react-lexical\";\n *\n * const initialConfig = liveblocksConfig({\n * namespace: \"MyEditor\",\n * theme: {},\n * nodes: [],\n * onError: (err) => console.error(err),\n * });\n *\n * function Editor() {\n * return (\n * <LexicalComposer initialConfig={initialConfig}>\n * <LiveblocksPlugin />\n * <RichTextPlugin\n * contentEditable={<ContentEditable />}\n * placeholder={<div>Enter some text...</div>}\n * ErrorBoundary={LexicalErrorBoundary}\n * />\n * </LexicalComposer>\n * );\n * }\n */\nexport const LiveblocksPlugin = ({\n children,\n}: LiveblocksPluginProps): JSX.Element => {\n const isResolveMentionSuggestionsDefined =\n useResolveMentionSuggestions() !== undefined;\n const [editor] = useLexicalComposerContext();\n const room = useRoom();\n const previousRoomIdRef = useRef<string | null>(null);\n\n if (!editor.hasNodes([ThreadMarkNode, MentionNode])) {\n throw new Error(\n \"LiveblocksPlugin requires Lexical configuration to be wrapped in the `liveblocksConfig(options)` function. For more information: https://liveblocks.io/docs/api-reference/liveblocks-react-lexical#liveblocksConfig\"\n );\n }\n\n const [containerRef, setContainerRef] = useState<\n MutableRefObject<HTMLDivElement | null> | undefined\n >(undefined);\n\n const {\n refs: { setReference, setFloating },\n strategy,\n x,\n y,\n } = useFloating({\n strategy: \"fixed\",\n placement: \"bottom\",\n whileElementsMounted: (...args) => {\n return autoUpdate(...args, {\n animationFrame: true,\n });\n },\n });\n\n // Warn users if initialConfig.editorState, set on the composer, is not null\n useEffect(() => {\n // only in dev mode\n if (process.env.NODE_ENV !== \"production\") {\n // A user should not even be set an emptyState, but when passing null, getEditorState still has initial empty state\n if (!editor.getEditorState().isEmpty()) {\n console.warn(\n \"Warning: LiveblocksPlugin: editorState in initialConfig detected, but must be null.\"\n );\n }\n }\n\n // we know editor is already defined as we're inside LexicalComposer, and we only want this running the first time\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useReportTextEditor(TextEditorType.Lexical, \"root\");\n\n // Get user info or allow override from props\n const self = useSelf();\n\n const providerFactory = useCallback(\n (id: string, yjsDocMap: Map<string, Doc>): Provider => {\n // Destroy previously used provider to avoid memory leaks\n // TODO: Find a way to destroy the last used provider on unmount (while working with StrictMode)\n if (\n previousRoomIdRef.current !== null &&\n previousRoomIdRef.current !== id\n ) {\n const previousProvider = providersMap.get(id);\n if (previousProvider !== undefined) {\n previousProvider.destroy();\n }\n }\n\n let doc = yjsDocMap.get(id);\n\n if (doc === undefined) {\n doc = new Doc();\n const provider = new LiveblocksYjsProvider(room, doc);\n yjsDocMap.set(id, doc);\n providersMap.set(id, provider);\n }\n\n return nn(\n providersMap.get(id),\n \"Internal error. Should never happen\"\n ) as Provider;\n },\n [room]\n );\n\n const root = useRootElement();\n\n useLayoutEffect(() => {\n if (root === null) return;\n setReference({\n getBoundingClientRect: () => root.getBoundingClientRect(),\n });\n }, [setReference, root]);\n\n const handleFloatingRef = useCallback(\n (node: HTMLDivElement) => {\n setFloating(node);\n setContainerRef({ current: node });\n },\n [setFloating, setContainerRef]\n );\n\n return (\n <>\n <div\n ref={handleFloatingRef}\n style={{\n position: strategy,\n top: 0,\n left: 0,\n transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,\n minWidth: \"max-content\",\n }}\n />\n\n {self && (\n <CollaborationPlugin\n // Setting the key allows us to reset the internal Y.doc used by useYjsCollaboration\n // without implementing `reload` event\n key={room.id}\n id={room.id}\n providerFactory={providerFactory}\n username={self.info?.name ?? \"\"} // use empty string to prevent random name\n cursorColor={self.info?.color as string | undefined}\n cursorsContainerRef={containerRef}\n shouldBootstrap={true}\n />\n )}\n\n {isResolveMentionSuggestionsDefined && <MentionPlugin />}\n <CommentPluginProvider>{children}</CommentPluginProvider>\n </>\n );\n};\n\nexport function useRootElement(): HTMLElement | null {\n const [editor] = useLexicalComposerContext();\n\n const subscribe = useCallback(\n (onStoreChange: () => void) => {\n return editor.registerRootListener(onStoreChange);\n },\n [editor]\n );\n\n const getSnapshot = useCallback(() => {\n return editor.getRootElement();\n }, [editor]);\n\n return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"],"names":[],"mappings":"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"}
@@ -1,43 +1,50 @@
1
1
  'use strict';
2
2
 
3
- var react = require('@liveblocks/react');
4
- var React = require('react');
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var react$1 = require('@liveblocks/react');
5
+ var react = require('react');
5
6
  var classnames = require('../classnames.js');
6
7
 
7
- const Avatar = React.forwardRef(
8
+ const Avatar = react.forwardRef(
8
9
  function Avatar2(props, forwardedRef) {
9
10
  const { userId, className, ...spanProps } = props;
10
- const { user, isLoading } = react.useUser(userId);
11
+ const { user, isLoading } = react$1.useUser(userId);
11
12
  const avatar = user ? user.avatar : void 0;
12
13
  const name = user ? user.name : void 0;
13
14
  function Initials() {
14
15
  const initials = name ? getInitials(name) : void 0;
15
16
  if (initials) {
16
- return /* @__PURE__ */ React.createElement("span", {
17
+ return /* @__PURE__ */ jsxRuntime.jsx("span", {
17
18
  "aria-hidden": true,
18
- className: "lb-avatar-fallback"
19
- }, initials);
19
+ className: "lb-avatar-fallback",
20
+ children: initials
21
+ });
20
22
  }
21
23
  if (isLoading)
22
24
  return null;
23
25
  if (user === void 0)
24
26
  return null;
25
- return /* @__PURE__ */ React.createElement("span", {
27
+ return /* @__PURE__ */ jsxRuntime.jsx("span", {
26
28
  "aria-label": userId,
27
29
  title: userId,
28
- className: "lb-avatar-fallback"
29
- }, getInitials(userId));
30
+ className: "lb-avatar-fallback",
31
+ children: getInitials(userId)
32
+ });
30
33
  }
31
- return /* @__PURE__ */ React.createElement("span", {
34
+ return /* @__PURE__ */ jsxRuntime.jsxs("span", {
32
35
  "data-loading": isLoading ? "" : void 0,
33
36
  ...spanProps,
34
37
  className: classnames.classNames("lb-avatar", className),
35
- ref: forwardedRef
36
- }, avatar && /* @__PURE__ */ React.createElement("img", {
37
- src: avatar,
38
- alt: name,
39
- className: "lb-avatar-image"
40
- }), /* @__PURE__ */ React.createElement(Initials, null));
38
+ ref: forwardedRef,
39
+ children: [
40
+ avatar && /* @__PURE__ */ jsxRuntime.jsx("img", {
41
+ src: avatar,
42
+ alt: name,
43
+ className: "lb-avatar-image"
44
+ }),
45
+ /* @__PURE__ */ jsxRuntime.jsx(Initials, {})
46
+ ]
47
+ });
41
48
  }
42
49
  );
43
50
  function getInitials(name) {
@@ -1 +1 @@
1
- {"version":3,"file":"avatar.js","sources":["../../src/mentions/avatar.tsx"],"sourcesContent":["import { useUser } from \"@liveblocks/react\";\nimport type { HTMLAttributes } from \"react\";\nimport React, { forwardRef } from \"react\";\n\nimport { classNames } from \"../classnames\";\n\nexport interface AvatarProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n userId: string;\n}\n\nexport const Avatar = forwardRef<HTMLSpanElement, AvatarProps>(\n function Avatar(props, forwardedRef) {\n const { userId, className, ...spanProps } = props;\n\n const { user, isLoading } = useUser(userId);\n\n const avatar = user ? user.avatar : undefined;\n\n const name = user ? user.name : undefined;\n\n function Initials() {\n const initials = name ? getInitials(name) : undefined;\n if (initials) {\n return (\n <span aria-hidden className=\"lb-avatar-fallback\">\n {initials}\n </span>\n );\n }\n\n if (isLoading) return null;\n\n if (user === undefined) return null;\n\n return (\n <span aria-label={userId} title={userId} className=\"lb-avatar-fallback\">\n {getInitials(userId)}\n </span>\n );\n }\n\n return (\n <span\n data-loading={isLoading ? \"\" : undefined}\n {...spanProps}\n className={classNames(\"lb-avatar\", className)}\n ref={forwardedRef}\n >\n {avatar && <img src={avatar} alt={name} className=\"lb-avatar-image\" />}\n\n <Initials />\n </span>\n );\n }\n);\n\nfunction getInitials(name: string) {\n return name\n .trim()\n .split(\" \")\n .reduce((initials, name, index, array) => {\n if (index === 0 || index === array.length - 1) {\n initials += name.charAt(0).toLocaleUpperCase();\n }\n\n return initials;\n }, \"\");\n}\n"],"names":["forwardRef","Avatar","useUser","classNames","name"],"mappings":";;;;;;AAWO,MAAM,MAAS,GAAAA,gBAAA;AAAA,EACpB,SAASC,OAAO,CAAA,KAAA,EAAO,YAAc,EAAA;AACnC,IAAA,MAAM,EAAE,MAAA,EAAQ,SAAc,EAAA,GAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AAE5C,IAAA,MAAM,EAAE,IAAA,EAAM,SAAU,EAAA,GAAIC,cAAQ,MAAM,CAAA,CAAA;AAE1C,IAAM,MAAA,MAAA,GAAS,IAAO,GAAA,IAAA,CAAK,MAAS,GAAA,KAAA,CAAA,CAAA;AAEpC,IAAM,MAAA,IAAA,GAAO,IAAO,GAAA,IAAA,CAAK,IAAO,GAAA,KAAA,CAAA,CAAA;AAEhC,IAAA,SAAS,QAAW,GAAA;AAClB,MAAA,MAAM,QAAW,GAAA,IAAA,GAAO,WAAY,CAAA,IAAI,CAAI,GAAA,KAAA,CAAA,CAAA;AAC5C,MAAA,IAAI,QAAU,EAAA;AACZ,QAAA,uBACG,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,UAAK,aAAW,EAAA,IAAA;AAAA,UAAC,SAAU,EAAA,oBAAA;AAAA,SAAA,EACzB,QACH,CAAA,CAAA;AAAA,OAEJ;AAEA,MAAI,IAAA,SAAA;AAAW,QAAO,OAAA,IAAA,CAAA;AAEtB,MAAA,IAAI,IAAS,KAAA,KAAA,CAAA;AAAW,QAAO,OAAA,IAAA,CAAA;AAE/B,MAAA,uBACG,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,QAAK,YAAY,EAAA,MAAA;AAAA,QAAQ,KAAO,EAAA,MAAA;AAAA,QAAQ,SAAU,EAAA,oBAAA;AAAA,OAChD,EAAA,WAAA,CAAY,MAAM,CACrB,CAAA,CAAA;AAAA,KAEJ;AAEA,IAAA,uBACG,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,MACC,cAAA,EAAc,YAAY,EAAK,GAAA,KAAA,CAAA;AAAA,MAC9B,GAAG,SAAA;AAAA,MACJ,SAAA,EAAWC,qBAAW,CAAA,WAAA,EAAa,SAAS,CAAA;AAAA,MAC5C,GAAK,EAAA,YAAA;AAAA,KAAA,EAEJ,0BAAW,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,MAAI,GAAK,EAAA,MAAA;AAAA,MAAQ,GAAK,EAAA,IAAA;AAAA,MAAM,SAAU,EAAA,iBAAA;AAAA,KAAkB,CAAA,kBAEnE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,IAAS,CACZ,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAEA,SAAS,YAAY,IAAc,EAAA;AACjC,EAAO,OAAA,IAAA,CACJ,IAAK,EAAA,CACL,KAAM,CAAA,GAAG,CACT,CAAA,MAAA,CAAO,CAAC,QAAA,EAAUC,KAAM,EAAA,KAAA,EAAO,KAAU,KAAA;AACxC,IAAA,IAAI,KAAU,KAAA,CAAA,IAAK,KAAU,KAAA,KAAA,CAAM,SAAS,CAAG,EAAA;AAC7C,MAAA,QAAA,IAAYA,KAAK,CAAA,MAAA,CAAO,CAAC,CAAA,CAAE,iBAAkB,EAAA,CAAA;AAAA,KAC/C;AAEA,IAAO,OAAA,QAAA,CAAA;AAAA,KACN,EAAE,CAAA,CAAA;AACT;;;;"}
1
+ {"version":3,"file":"avatar.js","sources":["../../src/mentions/avatar.tsx"],"sourcesContent":["import { useUser } from \"@liveblocks/react\";\nimport type { HTMLAttributes } from \"react\";\nimport { forwardRef } from \"react\";\n\nimport { classNames } from \"../classnames\";\n\nexport interface AvatarProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n userId: string;\n}\n\nexport const Avatar = forwardRef<HTMLSpanElement, AvatarProps>(\n function Avatar(props, forwardedRef) {\n const { userId, className, ...spanProps } = props;\n\n const { user, isLoading } = useUser(userId);\n\n const avatar = user ? user.avatar : undefined;\n\n const name = user ? user.name : undefined;\n\n function Initials() {\n const initials = name ? getInitials(name) : undefined;\n if (initials) {\n return (\n <span aria-hidden className=\"lb-avatar-fallback\">\n {initials}\n </span>\n );\n }\n\n if (isLoading) return null;\n\n if (user === undefined) return null;\n\n return (\n <span aria-label={userId} title={userId} className=\"lb-avatar-fallback\">\n {getInitials(userId)}\n </span>\n );\n }\n\n return (\n <span\n data-loading={isLoading ? \"\" : undefined}\n {...spanProps}\n className={classNames(\"lb-avatar\", className)}\n ref={forwardedRef}\n >\n {avatar && <img src={avatar} alt={name} className=\"lb-avatar-image\" />}\n\n <Initials />\n </span>\n );\n }\n);\n\nfunction getInitials(name: string) {\n return name\n .trim()\n .split(\" \")\n .reduce((initials, name, index, array) => {\n if (index === 0 || index === array.length - 1) {\n initials += name.charAt(0).toLocaleUpperCase();\n }\n\n return initials;\n }, \"\");\n}\n"],"names":["forwardRef","Avatar","useUser","jsx","jsxs","classNames","name"],"mappings":";;;;;;;AAWO,MAAM,MAAS,GAAAA,gBAAA;AAAA,EACpB,SAASC,OAAO,CAAA,KAAA,EAAO,YAAc,EAAA;AACnC,IAAA,MAAM,EAAE,MAAA,EAAQ,SAAc,EAAA,GAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AAE5C,IAAA,MAAM,EAAE,IAAA,EAAM,SAAU,EAAA,GAAIC,gBAAQ,MAAM,CAAA,CAAA;AAE1C,IAAM,MAAA,MAAA,GAAS,IAAO,GAAA,IAAA,CAAK,MAAS,GAAA,KAAA,CAAA,CAAA;AAEpC,IAAM,MAAA,IAAA,GAAO,IAAO,GAAA,IAAA,CAAK,IAAO,GAAA,KAAA,CAAA,CAAA;AAEhC,IAAA,SAAS,QAAW,GAAA;AAClB,MAAA,MAAM,QAAW,GAAA,IAAA,GAAO,WAAY,CAAA,IAAI,CAAI,GAAA,KAAA,CAAA,CAAA;AAC5C,MAAA,IAAI,QAAU,EAAA;AACZ,QAAA,uBACGC,cAAA,CAAA,MAAA,EAAA;AAAA,UAAK,aAAW,EAAA,IAAA;AAAA,UAAC,SAAU,EAAA,oBAAA;AAAA,UACzB,QAAA,EAAA,QAAA;AAAA,SACH,CAAA,CAAA;AAAA,OAEJ;AAEA,MAAI,IAAA,SAAA;AAAW,QAAO,OAAA,IAAA,CAAA;AAEtB,MAAA,IAAI,IAAS,KAAA,KAAA,CAAA;AAAW,QAAO,OAAA,IAAA,CAAA;AAE/B,MAAA,uBACGA,cAAA,CAAA,MAAA,EAAA;AAAA,QAAK,YAAY,EAAA,MAAA;AAAA,QAAQ,KAAO,EAAA,MAAA;AAAA,QAAQ,SAAU,EAAA,oBAAA;AAAA,QAChD,sBAAY,MAAM,CAAA;AAAA,OACrB,CAAA,CAAA;AAAA,KAEJ;AAEA,IAAA,uBACGC,eAAA,CAAA,MAAA,EAAA;AAAA,MACC,cAAA,EAAc,YAAY,EAAK,GAAA,KAAA,CAAA;AAAA,MAC9B,GAAG,SAAA;AAAA,MACJ,SAAA,EAAWC,qBAAW,CAAA,WAAA,EAAa,SAAS,CAAA;AAAA,MAC5C,GAAK,EAAA,YAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,QAAA,MAAA,oBAAWF,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,GAAK,EAAA,MAAA;AAAA,UAAQ,GAAK,EAAA,IAAA;AAAA,UAAM,SAAU,EAAA,iBAAA;AAAA,SAAkB,CAAA;AAAA,uCAEnE,QAAS,EAAA,EAAA,CAAA;AAAA,OAAA;AAAA,KACZ,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAEA,SAAS,YAAY,IAAc,EAAA;AACjC,EAAO,OAAA,IAAA,CACJ,IAAK,EAAA,CACL,KAAM,CAAA,GAAG,CACT,CAAA,MAAA,CAAO,CAAC,QAAA,EAAUG,KAAM,EAAA,KAAA,EAAO,KAAU,KAAA;AACxC,IAAA,IAAI,KAAU,KAAA,CAAA,IAAK,KAAU,KAAA,KAAA,CAAM,SAAS,CAAG,EAAA;AAC7C,MAAA,QAAA,IAAYA,KAAK,CAAA,MAAA,CAAO,CAAC,CAAA,CAAE,iBAAkB,EAAA,CAAA;AAAA,KAC/C;AAEA,IAAO,OAAA,QAAA,CAAA;AAAA,KACN,EAAE,CAAA,CAAA;AACT;;;;"}
@@ -1,5 +1,6 @@
1
+ import { jsx, jsxs } from 'react/jsx-runtime';
1
2
  import { useUser } from '@liveblocks/react';
2
- import React__default, { forwardRef } from 'react';
3
+ import { forwardRef } from 'react';
3
4
  import { classNames } from '../classnames.mjs';
4
5
 
5
6
  const Avatar = forwardRef(
@@ -11,31 +12,37 @@ const Avatar = forwardRef(
11
12
  function Initials() {
12
13
  const initials = name ? getInitials(name) : void 0;
13
14
  if (initials) {
14
- return /* @__PURE__ */ React__default.createElement("span", {
15
+ return /* @__PURE__ */ jsx("span", {
15
16
  "aria-hidden": true,
16
- className: "lb-avatar-fallback"
17
- }, initials);
17
+ className: "lb-avatar-fallback",
18
+ children: initials
19
+ });
18
20
  }
19
21
  if (isLoading)
20
22
  return null;
21
23
  if (user === void 0)
22
24
  return null;
23
- return /* @__PURE__ */ React__default.createElement("span", {
25
+ return /* @__PURE__ */ jsx("span", {
24
26
  "aria-label": userId,
25
27
  title: userId,
26
- className: "lb-avatar-fallback"
27
- }, getInitials(userId));
28
+ className: "lb-avatar-fallback",
29
+ children: getInitials(userId)
30
+ });
28
31
  }
29
- return /* @__PURE__ */ React__default.createElement("span", {
32
+ return /* @__PURE__ */ jsxs("span", {
30
33
  "data-loading": isLoading ? "" : void 0,
31
34
  ...spanProps,
32
35
  className: classNames("lb-avatar", className),
33
- ref: forwardedRef
34
- }, avatar && /* @__PURE__ */ React__default.createElement("img", {
35
- src: avatar,
36
- alt: name,
37
- className: "lb-avatar-image"
38
- }), /* @__PURE__ */ React__default.createElement(Initials, null));
36
+ ref: forwardedRef,
37
+ children: [
38
+ avatar && /* @__PURE__ */ jsx("img", {
39
+ src: avatar,
40
+ alt: name,
41
+ className: "lb-avatar-image"
42
+ }),
43
+ /* @__PURE__ */ jsx(Initials, {})
44
+ ]
45
+ });
39
46
  }
40
47
  );
41
48
  function getInitials(name) {
@@ -1 +1 @@
1
- {"version":3,"file":"avatar.mjs","sources":["../../src/mentions/avatar.tsx"],"sourcesContent":["import { useUser } from \"@liveblocks/react\";\nimport type { HTMLAttributes } from \"react\";\nimport React, { forwardRef } from \"react\";\n\nimport { classNames } from \"../classnames\";\n\nexport interface AvatarProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n userId: string;\n}\n\nexport const Avatar = forwardRef<HTMLSpanElement, AvatarProps>(\n function Avatar(props, forwardedRef) {\n const { userId, className, ...spanProps } = props;\n\n const { user, isLoading } = useUser(userId);\n\n const avatar = user ? user.avatar : undefined;\n\n const name = user ? user.name : undefined;\n\n function Initials() {\n const initials = name ? getInitials(name) : undefined;\n if (initials) {\n return (\n <span aria-hidden className=\"lb-avatar-fallback\">\n {initials}\n </span>\n );\n }\n\n if (isLoading) return null;\n\n if (user === undefined) return null;\n\n return (\n <span aria-label={userId} title={userId} className=\"lb-avatar-fallback\">\n {getInitials(userId)}\n </span>\n );\n }\n\n return (\n <span\n data-loading={isLoading ? \"\" : undefined}\n {...spanProps}\n className={classNames(\"lb-avatar\", className)}\n ref={forwardedRef}\n >\n {avatar && <img src={avatar} alt={name} className=\"lb-avatar-image\" />}\n\n <Initials />\n </span>\n );\n }\n);\n\nfunction getInitials(name: string) {\n return name\n .trim()\n .split(\" \")\n .reduce((initials, name, index, array) => {\n if (index === 0 || index === array.length - 1) {\n initials += name.charAt(0).toLocaleUpperCase();\n }\n\n return initials;\n }, \"\");\n}\n"],"names":["Avatar","React","name"],"mappings":";;;;AAWO,MAAM,MAAS,GAAA,UAAA;AAAA,EACpB,SAASA,OAAO,CAAA,KAAA,EAAO,YAAc,EAAA;AACnC,IAAA,MAAM,EAAE,MAAA,EAAQ,SAAc,EAAA,GAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AAE5C,IAAA,MAAM,EAAE,IAAA,EAAM,SAAU,EAAA,GAAI,QAAQ,MAAM,CAAA,CAAA;AAE1C,IAAM,MAAA,MAAA,GAAS,IAAO,GAAA,IAAA,CAAK,MAAS,GAAA,KAAA,CAAA,CAAA;AAEpC,IAAM,MAAA,IAAA,GAAO,IAAO,GAAA,IAAA,CAAK,IAAO,GAAA,KAAA,CAAA,CAAA;AAEhC,IAAA,SAAS,QAAW,GAAA;AAClB,MAAA,MAAM,QAAW,GAAA,IAAA,GAAO,WAAY,CAAA,IAAI,CAAI,GAAA,KAAA,CAAA,CAAA;AAC5C,MAAA,IAAI,QAAU,EAAA;AACZ,QAAA,uBACGC,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,UAAK,aAAW,EAAA,IAAA;AAAA,UAAC,SAAU,EAAA,oBAAA;AAAA,SAAA,EACzB,QACH,CAAA,CAAA;AAAA,OAEJ;AAEA,MAAI,IAAA,SAAA;AAAW,QAAO,OAAA,IAAA,CAAA;AAEtB,MAAA,IAAI,IAAS,KAAA,KAAA,CAAA;AAAW,QAAO,OAAA,IAAA,CAAA;AAE/B,MAAA,uBACGA,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,QAAK,YAAY,EAAA,MAAA;AAAA,QAAQ,KAAO,EAAA,MAAA;AAAA,QAAQ,SAAU,EAAA,oBAAA;AAAA,OAChD,EAAA,WAAA,CAAY,MAAM,CACrB,CAAA,CAAA;AAAA,KAEJ;AAEA,IAAA,uBACGA,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,MACC,cAAA,EAAc,YAAY,EAAK,GAAA,KAAA,CAAA;AAAA,MAC9B,GAAG,SAAA;AAAA,MACJ,SAAA,EAAW,UAAW,CAAA,WAAA,EAAa,SAAS,CAAA;AAAA,MAC5C,GAAK,EAAA,YAAA;AAAA,KAAA,EAEJ,0BAAWA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAA,MAAI,GAAK,EAAA,MAAA;AAAA,MAAQ,GAAK,EAAA,IAAA;AAAA,MAAM,SAAU,EAAA,iBAAA;AAAA,KAAkB,CAAA,kBAEnEA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,IAAS,CACZ,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAEA,SAAS,YAAY,IAAc,EAAA;AACjC,EAAO,OAAA,IAAA,CACJ,IAAK,EAAA,CACL,KAAM,CAAA,GAAG,CACT,CAAA,MAAA,CAAO,CAAC,QAAA,EAAUC,KAAM,EAAA,KAAA,EAAO,KAAU,KAAA;AACxC,IAAA,IAAI,KAAU,KAAA,CAAA,IAAK,KAAU,KAAA,KAAA,CAAM,SAAS,CAAG,EAAA;AAC7C,MAAA,QAAA,IAAYA,KAAK,CAAA,MAAA,CAAO,CAAC,CAAA,CAAE,iBAAkB,EAAA,CAAA;AAAA,KAC/C;AAEA,IAAO,OAAA,QAAA,CAAA;AAAA,KACN,EAAE,CAAA,CAAA;AACT;;;;"}
1
+ {"version":3,"file":"avatar.mjs","sources":["../../src/mentions/avatar.tsx"],"sourcesContent":["import { useUser } from \"@liveblocks/react\";\nimport type { HTMLAttributes } from \"react\";\nimport { forwardRef } from \"react\";\n\nimport { classNames } from \"../classnames\";\n\nexport interface AvatarProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n userId: string;\n}\n\nexport const Avatar = forwardRef<HTMLSpanElement, AvatarProps>(\n function Avatar(props, forwardedRef) {\n const { userId, className, ...spanProps } = props;\n\n const { user, isLoading } = useUser(userId);\n\n const avatar = user ? user.avatar : undefined;\n\n const name = user ? user.name : undefined;\n\n function Initials() {\n const initials = name ? getInitials(name) : undefined;\n if (initials) {\n return (\n <span aria-hidden className=\"lb-avatar-fallback\">\n {initials}\n </span>\n );\n }\n\n if (isLoading) return null;\n\n if (user === undefined) return null;\n\n return (\n <span aria-label={userId} title={userId} className=\"lb-avatar-fallback\">\n {getInitials(userId)}\n </span>\n );\n }\n\n return (\n <span\n data-loading={isLoading ? \"\" : undefined}\n {...spanProps}\n className={classNames(\"lb-avatar\", className)}\n ref={forwardedRef}\n >\n {avatar && <img src={avatar} alt={name} className=\"lb-avatar-image\" />}\n\n <Initials />\n </span>\n );\n }\n);\n\nfunction getInitials(name: string) {\n return name\n .trim()\n .split(\" \")\n .reduce((initials, name, index, array) => {\n if (index === 0 || index === array.length - 1) {\n initials += name.charAt(0).toLocaleUpperCase();\n }\n\n return initials;\n }, \"\");\n}\n"],"names":["Avatar","name"],"mappings":";;;;;AAWO,MAAM,MAAS,GAAA,UAAA;AAAA,EACpB,SAASA,OAAO,CAAA,KAAA,EAAO,YAAc,EAAA;AACnC,IAAA,MAAM,EAAE,MAAA,EAAQ,SAAc,EAAA,GAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AAE5C,IAAA,MAAM,EAAE,IAAA,EAAM,SAAU,EAAA,GAAI,QAAQ,MAAM,CAAA,CAAA;AAE1C,IAAM,MAAA,MAAA,GAAS,IAAO,GAAA,IAAA,CAAK,MAAS,GAAA,KAAA,CAAA,CAAA;AAEpC,IAAM,MAAA,IAAA,GAAO,IAAO,GAAA,IAAA,CAAK,IAAO,GAAA,KAAA,CAAA,CAAA;AAEhC,IAAA,SAAS,QAAW,GAAA;AAClB,MAAA,MAAM,QAAW,GAAA,IAAA,GAAO,WAAY,CAAA,IAAI,CAAI,GAAA,KAAA,CAAA,CAAA;AAC5C,MAAA,IAAI,QAAU,EAAA;AACZ,QAAA,uBACG,GAAA,CAAA,MAAA,EAAA;AAAA,UAAK,aAAW,EAAA,IAAA;AAAA,UAAC,SAAU,EAAA,oBAAA;AAAA,UACzB,QAAA,EAAA,QAAA;AAAA,SACH,CAAA,CAAA;AAAA,OAEJ;AAEA,MAAI,IAAA,SAAA;AAAW,QAAO,OAAA,IAAA,CAAA;AAEtB,MAAA,IAAI,IAAS,KAAA,KAAA,CAAA;AAAW,QAAO,OAAA,IAAA,CAAA;AAE/B,MAAA,uBACG,GAAA,CAAA,MAAA,EAAA;AAAA,QAAK,YAAY,EAAA,MAAA;AAAA,QAAQ,KAAO,EAAA,MAAA;AAAA,QAAQ,SAAU,EAAA,oBAAA;AAAA,QAChD,sBAAY,MAAM,CAAA;AAAA,OACrB,CAAA,CAAA;AAAA,KAEJ;AAEA,IAAA,uBACG,IAAA,CAAA,MAAA,EAAA;AAAA,MACC,cAAA,EAAc,YAAY,EAAK,GAAA,KAAA,CAAA;AAAA,MAC9B,GAAG,SAAA;AAAA,MACJ,SAAA,EAAW,UAAW,CAAA,WAAA,EAAa,SAAS,CAAA;AAAA,MAC5C,GAAK,EAAA,YAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,QAAA,MAAA,oBAAW,GAAA,CAAA,KAAA,EAAA;AAAA,UAAI,GAAK,EAAA,MAAA;AAAA,UAAQ,GAAK,EAAA,IAAA;AAAA,UAAM,SAAU,EAAA,iBAAA;AAAA,SAAkB,CAAA;AAAA,4BAEnE,QAAS,EAAA,EAAA,CAAA;AAAA,OAAA;AAAA,KACZ,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAEA,SAAS,YAAY,IAAc,EAAA;AACjC,EAAO,OAAA,IAAA,CACJ,IAAK,EAAA,CACL,KAAM,CAAA,GAAG,CACT,CAAA,MAAA,CAAO,CAAC,QAAA,EAAUC,KAAM,EAAA,KAAA,EAAO,KAAU,KAAA;AACxC,IAAA,IAAI,KAAU,KAAA,CAAA,IAAK,KAAU,KAAA,KAAA,CAAM,SAAS,CAAG,EAAA;AAC7C,MAAA,QAAA,IAAYA,KAAK,CAAA,MAAA,CAAO,CAAC,CAAA,CAAE,iBAAkB,EAAA,CAAA;AAAA,KAC/C;AAEA,IAAO,OAAA,QAAA,CAAA;AAAA,KACN,EAAE,CAAA,CAAA;AACT;;;;"}
@@ -1,9 +1,9 @@
1
1
  'use strict';
2
2
 
3
+ var jsxRuntime = require('react/jsx-runtime');
3
4
  var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
4
5
  var lexical = require('lexical');
5
- var React = require('react');
6
- var index_js = require('use-sync-external-store/shim/index.js');
6
+ var react = require('react');
7
7
 
8
8
  function Mention({
9
9
  nodeKey,
@@ -20,11 +20,12 @@ function Mention({
20
20
  lexical.$setSelection(selection);
21
21
  });
22
22
  }
23
- return /* @__PURE__ */ React.createElement("span", {
23
+ return /* @__PURE__ */ jsxRuntime.jsx("span", {
24
24
  onClick: handleClick,
25
25
  "data-selected": isSelected ? "" : void 0,
26
- className: "lb-root lb-lexical-mention"
27
- }, children);
26
+ className: "lb-root lb-lexical-mention",
27
+ children
28
+ });
28
29
  }
29
30
  function $isNodeSelected(key) {
30
31
  const node = lexical.$getNodeByKey(key);
@@ -34,16 +35,16 @@ function $isNodeSelected(key) {
34
35
  }
35
36
  function useIsNodeSelected(key) {
36
37
  const [editor] = LexicalComposerContext.useLexicalComposerContext();
37
- const subscribe = React.useCallback(
38
+ const subscribe = react.useCallback(
38
39
  (onStoreChange) => {
39
40
  return editor.registerUpdateListener(onStoreChange);
40
41
  },
41
42
  [editor]
42
43
  );
43
- const getSnapshot = React.useCallback(() => {
44
+ const getSnapshot = react.useCallback(() => {
44
45
  return editor.getEditorState().read(() => $isNodeSelected(key));
45
46
  }, [editor, key]);
46
- return index_js.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
47
+ return react.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
47
48
  }
48
49
 
49
50
  exports.Mention = Mention;