@liveblocks/react-lexical 2.25.0-aiprivatebeta8 → 3.0.0
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.
- package/dist/index.cjs +0 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -18
- package/dist/index.d.ts +1 -18
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/liveblocks-plugin-provider.cjs +0 -23
- package/dist/liveblocks-plugin-provider.cjs.map +1 -1
- package/dist/liveblocks-plugin-provider.js +1 -23
- package/dist/liveblocks-plugin-provider.js.map +1 -1
- package/dist/mentions/mention-plugin.cjs +34 -19
- package/dist/mentions/mention-plugin.cjs.map +1 -1
- package/dist/mentions/mention-plugin.js +35 -20
- package/dist/mentions/mention-plugin.js.map +1 -1
- package/dist/mentions/suggestions.cjs +26 -22
- package/dist/mentions/suggestions.cjs.map +1 -1
- package/dist/mentions/suggestions.js +26 -22
- package/dist/mentions/suggestions.js.map +1 -1
- package/dist/version.cjs +1 -1
- package/dist/version.cjs.map +1 -1
- package/dist/version.js +1 -1
- package/dist/version.js.map +1 -1
- package/package.json +16 -6
package/dist/index.cjs
CHANGED
|
@@ -25,7 +25,6 @@ exports.isBlockNodeActive = isBlockNodeActive.isBlockNodeActive;
|
|
|
25
25
|
exports.isTextFormatActive = isTextFormatActive.isTextFormatActive;
|
|
26
26
|
exports.liveblocksConfig = liveblocksConfig.liveblocksConfig;
|
|
27
27
|
exports.LiveblocksPlugin = liveblocksPluginProvider.LiveblocksPlugin;
|
|
28
|
-
exports.useEditorStatus = liveblocksPluginProvider.useEditorStatus;
|
|
29
28
|
exports.useIsEditorReady = liveblocksPluginProvider.useIsEditorReady;
|
|
30
29
|
exports.FloatingToolbar = floatingToolbar.FloatingToolbar;
|
|
31
30
|
exports.Toolbar = toolbar.Toolbar;
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type { AnchoredThreadsProps } from \"./comments/anchored-threads\";\nexport { AnchoredThreads } from \"./comments/anchored-threads\";\nexport { useIsThreadActive } from \"./comments/comment-plugin-provider\";\nexport type { FloatingComposerProps } from \"./comments/floating-composer\";\nexport {\n FloatingComposer,\n OPEN_FLOATING_COMPOSER_COMMAND,\n} from \"./comments/floating-composer\";\nexport type { FloatingThreadsProps } from \"./comments/floating-threads\";\nexport { FloatingThreads } from \"./comments/floating-threads\";\nexport { isBlockNodeActive } from \"./is-block-node-active\";\nexport { isTextFormatActive } from \"./is-text-format-active\";\nexport { liveblocksConfig } from \"./liveblocks-config\";\nexport {\n LiveblocksPlugin,\n
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type { AnchoredThreadsProps } from \"./comments/anchored-threads\";\nexport { AnchoredThreads } from \"./comments/anchored-threads\";\nexport { useIsThreadActive } from \"./comments/comment-plugin-provider\";\nexport type { FloatingComposerProps } from \"./comments/floating-composer\";\nexport {\n FloatingComposer,\n OPEN_FLOATING_COMPOSER_COMMAND,\n} from \"./comments/floating-composer\";\nexport type { FloatingThreadsProps } from \"./comments/floating-threads\";\nexport { FloatingThreads } from \"./comments/floating-threads\";\nexport { isBlockNodeActive } from \"./is-block-node-active\";\nexport { isTextFormatActive } from \"./is-text-format-active\";\nexport { liveblocksConfig } from \"./liveblocks-config\";\nexport {\n LiveblocksPlugin,\n useIsEditorReady,\n} from \"./liveblocks-plugin-provider\";\nexport type { FloatingToolbarProps } from \"./toolbar/floating-toolbar\";\nexport { FloatingToolbar } from \"./toolbar/floating-toolbar\";\nexport type {\n ToolbarBlockSelectorItem,\n ToolbarBlockSelectorProps,\n ToolbarButtonProps,\n ToolbarProps,\n ToolbarSeparatorProps,\n ToolbarToggleProps,\n} from \"./toolbar/toolbar\";\nexport { Toolbar } from \"./toolbar/toolbar\";\nexport type { HistoryVersionPreviewProps } from \"./version-history/history-version-preview\";\nexport { HistoryVersionPreview } from \"./version-history/history-version-preview\";\n"],"names":["detectDupes","PKG_NAME","PKG_VERSION","PKG_FORMAT"],"mappings":";;;;;;;;;;;;;;;;AAIAA,gBAAY,CAAAC,gBAAA,EAAUC,qBAAaC,kBAAU,CAAA;;;;;;;;;;;;;;;;"}
|
package/dist/index.d.cts
CHANGED
|
@@ -132,23 +132,6 @@ declare function liveblocksConfig(editorConfig: Omit<InitialConfigType, "editorS
|
|
|
132
132
|
theme?: lexical.EditorThemeClasses;
|
|
133
133
|
};
|
|
134
134
|
|
|
135
|
-
type EditorStatus = "not-loaded" | "loading"
|
|
136
|
-
/**
|
|
137
|
-
* Not working yet! Will be available in a future release.
|
|
138
|
-
* Some editor state modifications has not been acknowledged yet by the server
|
|
139
|
-
*/
|
|
140
|
-
| "synchronizing" | "synchronized";
|
|
141
|
-
/**
|
|
142
|
-
* Get the storage status.
|
|
143
|
-
*
|
|
144
|
-
* - `not-loaded`: Initial state when entering the room.
|
|
145
|
-
* - `loading`: Once the editor state has been requested by LiveblocksPlugin.
|
|
146
|
-
* - `synchronizing`: Not working yet! Will be available in a future release.
|
|
147
|
-
* - `synchronized`: The editor state is sync with Liveblocks servers.
|
|
148
|
-
*
|
|
149
|
-
* @deprecated Prefer `useIsEditorReady` or `useSyncStatus` (from @liveblocks/react)
|
|
150
|
-
*/
|
|
151
|
-
declare function useEditorStatus(): EditorStatus;
|
|
152
135
|
/**
|
|
153
136
|
* Returns whether the editor has loaded the initial text contents from the
|
|
154
137
|
* server and is ready to be used.
|
|
@@ -436,4 +419,4 @@ interface HistoryVersionPreviewProps extends ComponentPropsWithoutRef<"div"> {
|
|
|
436
419
|
*/
|
|
437
420
|
declare const HistoryVersionPreview: react.ForwardRefExoticComponent<HistoryVersionPreviewProps & react.RefAttributes<HTMLDivElement>>;
|
|
438
421
|
|
|
439
|
-
export { AnchoredThreads, AnchoredThreadsProps, FloatingComposer, FloatingComposerProps, FloatingThreads, FloatingThreadsProps, FloatingToolbar, FloatingToolbarProps, HistoryVersionPreview, HistoryVersionPreviewProps, LiveblocksPlugin, OPEN_FLOATING_COMPOSER_COMMAND, Toolbar, ToolbarBlockSelectorItem, ToolbarBlockSelectorProps, ToolbarButtonProps, ToolbarProps, ToolbarSeparatorProps, ToolbarToggleProps, isBlockNodeActive, isTextFormatActive, liveblocksConfig,
|
|
422
|
+
export { AnchoredThreads, AnchoredThreadsProps, FloatingComposer, FloatingComposerProps, FloatingThreads, FloatingThreadsProps, FloatingToolbar, FloatingToolbarProps, HistoryVersionPreview, HistoryVersionPreviewProps, LiveblocksPlugin, OPEN_FLOATING_COMPOSER_COMMAND, Toolbar, ToolbarBlockSelectorItem, ToolbarBlockSelectorProps, ToolbarButtonProps, ToolbarProps, ToolbarSeparatorProps, ToolbarToggleProps, isBlockNodeActive, isTextFormatActive, liveblocksConfig, useIsEditorReady, useIsThreadActive };
|
package/dist/index.d.ts
CHANGED
|
@@ -132,23 +132,6 @@ declare function liveblocksConfig(editorConfig: Omit<InitialConfigType, "editorS
|
|
|
132
132
|
theme?: lexical.EditorThemeClasses;
|
|
133
133
|
};
|
|
134
134
|
|
|
135
|
-
type EditorStatus = "not-loaded" | "loading"
|
|
136
|
-
/**
|
|
137
|
-
* Not working yet! Will be available in a future release.
|
|
138
|
-
* Some editor state modifications has not been acknowledged yet by the server
|
|
139
|
-
*/
|
|
140
|
-
| "synchronizing" | "synchronized";
|
|
141
|
-
/**
|
|
142
|
-
* Get the storage status.
|
|
143
|
-
*
|
|
144
|
-
* - `not-loaded`: Initial state when entering the room.
|
|
145
|
-
* - `loading`: Once the editor state has been requested by LiveblocksPlugin.
|
|
146
|
-
* - `synchronizing`: Not working yet! Will be available in a future release.
|
|
147
|
-
* - `synchronized`: The editor state is sync with Liveblocks servers.
|
|
148
|
-
*
|
|
149
|
-
* @deprecated Prefer `useIsEditorReady` or `useSyncStatus` (from @liveblocks/react)
|
|
150
|
-
*/
|
|
151
|
-
declare function useEditorStatus(): EditorStatus;
|
|
152
135
|
/**
|
|
153
136
|
* Returns whether the editor has loaded the initial text contents from the
|
|
154
137
|
* server and is ready to be used.
|
|
@@ -436,4 +419,4 @@ interface HistoryVersionPreviewProps extends ComponentPropsWithoutRef<"div"> {
|
|
|
436
419
|
*/
|
|
437
420
|
declare const HistoryVersionPreview: react.ForwardRefExoticComponent<HistoryVersionPreviewProps & react.RefAttributes<HTMLDivElement>>;
|
|
438
421
|
|
|
439
|
-
export { AnchoredThreads, AnchoredThreadsProps, FloatingComposer, FloatingComposerProps, FloatingThreads, FloatingThreadsProps, FloatingToolbar, FloatingToolbarProps, HistoryVersionPreview, HistoryVersionPreviewProps, LiveblocksPlugin, OPEN_FLOATING_COMPOSER_COMMAND, Toolbar, ToolbarBlockSelectorItem, ToolbarBlockSelectorProps, ToolbarButtonProps, ToolbarProps, ToolbarSeparatorProps, ToolbarToggleProps, isBlockNodeActive, isTextFormatActive, liveblocksConfig,
|
|
422
|
+
export { AnchoredThreads, AnchoredThreadsProps, FloatingComposer, FloatingComposerProps, FloatingThreads, FloatingThreadsProps, FloatingToolbar, FloatingToolbarProps, HistoryVersionPreview, HistoryVersionPreviewProps, LiveblocksPlugin, OPEN_FLOATING_COMPOSER_COMMAND, Toolbar, ToolbarBlockSelectorItem, ToolbarBlockSelectorProps, ToolbarButtonProps, ToolbarProps, ToolbarSeparatorProps, ToolbarToggleProps, isBlockNodeActive, isTextFormatActive, liveblocksConfig, useIsEditorReady, useIsThreadActive };
|
package/dist/index.js
CHANGED
|
@@ -7,7 +7,7 @@ export { FloatingThreads } from './comments/floating-threads.js';
|
|
|
7
7
|
export { isBlockNodeActive } from './is-block-node-active.js';
|
|
8
8
|
export { isTextFormatActive } from './is-text-format-active.js';
|
|
9
9
|
export { liveblocksConfig } from './liveblocks-config.js';
|
|
10
|
-
export { LiveblocksPlugin,
|
|
10
|
+
export { LiveblocksPlugin, useIsEditorReady } from './liveblocks-plugin-provider.js';
|
|
11
11
|
export { FloatingToolbar } from './toolbar/floating-toolbar.js';
|
|
12
12
|
export { Toolbar } from './toolbar/toolbar.js';
|
|
13
13
|
export { HistoryVersionPreview } from './version-history/history-version-preview.js';
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type { AnchoredThreadsProps } from \"./comments/anchored-threads\";\nexport { AnchoredThreads } from \"./comments/anchored-threads\";\nexport { useIsThreadActive } from \"./comments/comment-plugin-provider\";\nexport type { FloatingComposerProps } from \"./comments/floating-composer\";\nexport {\n FloatingComposer,\n OPEN_FLOATING_COMPOSER_COMMAND,\n} from \"./comments/floating-composer\";\nexport type { FloatingThreadsProps } from \"./comments/floating-threads\";\nexport { FloatingThreads } from \"./comments/floating-threads\";\nexport { isBlockNodeActive } from \"./is-block-node-active\";\nexport { isTextFormatActive } from \"./is-text-format-active\";\nexport { liveblocksConfig } from \"./liveblocks-config\";\nexport {\n LiveblocksPlugin,\n
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type { AnchoredThreadsProps } from \"./comments/anchored-threads\";\nexport { AnchoredThreads } from \"./comments/anchored-threads\";\nexport { useIsThreadActive } from \"./comments/comment-plugin-provider\";\nexport type { FloatingComposerProps } from \"./comments/floating-composer\";\nexport {\n FloatingComposer,\n OPEN_FLOATING_COMPOSER_COMMAND,\n} from \"./comments/floating-composer\";\nexport type { FloatingThreadsProps } from \"./comments/floating-threads\";\nexport { FloatingThreads } from \"./comments/floating-threads\";\nexport { isBlockNodeActive } from \"./is-block-node-active\";\nexport { isTextFormatActive } from \"./is-text-format-active\";\nexport { liveblocksConfig } from \"./liveblocks-config\";\nexport {\n LiveblocksPlugin,\n useIsEditorReady,\n} from \"./liveblocks-plugin-provider\";\nexport type { FloatingToolbarProps } from \"./toolbar/floating-toolbar\";\nexport { FloatingToolbar } from \"./toolbar/floating-toolbar\";\nexport type {\n ToolbarBlockSelectorItem,\n ToolbarBlockSelectorProps,\n ToolbarButtonProps,\n ToolbarProps,\n ToolbarSeparatorProps,\n ToolbarToggleProps,\n} from \"./toolbar/toolbar\";\nexport { Toolbar } from \"./toolbar/toolbar\";\nexport type { HistoryVersionPreviewProps } from \"./version-history/history-version-preview\";\nexport { HistoryVersionPreview } from \"./version-history/history-version-preview\";\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAIA,WAAY,CAAA,QAAA,EAAU,aAAa,UAAU,CAAA"}
|
|
@@ -15,28 +15,6 @@ var mentionNode = require('./mentions/mention-node.cjs');
|
|
|
15
15
|
var mentionPlugin = require('./mentions/mention-plugin.cjs');
|
|
16
16
|
var useRootElement = require('./use-root-element.cjs');
|
|
17
17
|
|
|
18
|
-
function useEditorStatus() {
|
|
19
|
-
const provider = _private.useYjsProvider();
|
|
20
|
-
const subscribe = react.useCallback(
|
|
21
|
-
(onStoreChange) => {
|
|
22
|
-
if (provider === void 0)
|
|
23
|
-
return () => {
|
|
24
|
-
};
|
|
25
|
-
provider.on("status", onStoreChange);
|
|
26
|
-
return () => {
|
|
27
|
-
provider.off("status", onStoreChange);
|
|
28
|
-
};
|
|
29
|
-
},
|
|
30
|
-
[provider]
|
|
31
|
-
);
|
|
32
|
-
const getSnapshot = react.useCallback(() => {
|
|
33
|
-
if (provider === void 0) {
|
|
34
|
-
return "not-loaded";
|
|
35
|
-
}
|
|
36
|
-
return provider.getStatus();
|
|
37
|
-
}, [provider]);
|
|
38
|
-
return react.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
|
|
39
|
-
}
|
|
40
18
|
function useIsEditorReady() {
|
|
41
19
|
const yjsProvider = _private.useYjsProvider();
|
|
42
20
|
const getSnapshot = react.useCallback(() => {
|
|
@@ -146,6 +124,5 @@ const LiveblocksPlugin = ({
|
|
|
146
124
|
};
|
|
147
125
|
|
|
148
126
|
exports.LiveblocksPlugin = LiveblocksPlugin;
|
|
149
|
-
exports.useEditorStatus = useEditorStatus;
|
|
150
127
|
exports.useIsEditorReady = useIsEditorReady;
|
|
151
128
|
//# sourceMappingURL=liveblocks-plugin-provider.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"liveblocks-plugin-provider.cjs","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 { TextEditorType } from \"@liveblocks/core\";\nimport { useRoom, useSelf } from \"@liveblocks/react\";\nimport {\n useLayoutEffect,\n useReportTextEditor,\n useResolveMentionSuggestions,\n useYjsProvider,\n} from \"@liveblocks/react/_private\";\nimport { getYjsProviderForRoom } from \"@liveblocks/yjs\";\nimport type { MutableRefObject, ReactNode } from \"react\";\nimport { useCallback, useEffect, useState, useSyncExternalStore } from \"react\";\nimport type { 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\";\nimport { useRootElement } from \"./use-root-element\";\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\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 const provider = getYjsProviderForRoom(room);\n yjsDocMap.set(id, provider.getYDoc());\n\n return provider 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"],"names":["useYjsProvider","useCallback","useSyncExternalStore","useResolveMentionSuggestions","useLexicalComposerContext","useRoom","ThreadMarkNode","MentionNode","useState","useFloating","autoUpdate","useEffect","useReportTextEditor","TextEditorType","useSelf","getYjsProviderForRoom","useRootElement","useLayoutEffect","jsxs","Fragment","jsx","CollaborationPlugin","MentionPlugin","CommentPluginProvider"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"liveblocks-plugin-provider.cjs","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 { TextEditorType } from \"@liveblocks/core\";\nimport { useRoom, useSelf } from \"@liveblocks/react\";\nimport {\n useLayoutEffect,\n useReportTextEditor,\n useResolveMentionSuggestions,\n useYjsProvider,\n} from \"@liveblocks/react/_private\";\nimport { getYjsProviderForRoom } from \"@liveblocks/yjs\";\nimport type { MutableRefObject, ReactNode } from \"react\";\nimport { useCallback, useEffect, useState, useSyncExternalStore } from \"react\";\nimport type { 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\";\nimport { useRootElement } from \"./use-root-element\";\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\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 const provider = getYjsProviderForRoom(room);\n yjsDocMap.set(id, provider.getYDoc());\n\n return provider 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"],"names":["useYjsProvider","useCallback","useSyncExternalStore","useResolveMentionSuggestions","useLexicalComposerContext","useRoom","ThreadMarkNode","MentionNode","useState","useFloating","autoUpdate","useEffect","useReportTextEditor","TextEditorType","useSelf","getYjsProviderForRoom","useRootElement","useLayoutEffect","jsxs","Fragment","jsx","CollaborationPlugin","MentionPlugin","CommentPluginProvider"],"mappings":"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"}
|
|
@@ -13,28 +13,6 @@ import { MentionNode } from './mentions/mention-node.js';
|
|
|
13
13
|
import { MentionPlugin } from './mentions/mention-plugin.js';
|
|
14
14
|
import { useRootElement } from './use-root-element.js';
|
|
15
15
|
|
|
16
|
-
function useEditorStatus() {
|
|
17
|
-
const provider = useYjsProvider();
|
|
18
|
-
const subscribe = useCallback(
|
|
19
|
-
(onStoreChange) => {
|
|
20
|
-
if (provider === void 0)
|
|
21
|
-
return () => {
|
|
22
|
-
};
|
|
23
|
-
provider.on("status", onStoreChange);
|
|
24
|
-
return () => {
|
|
25
|
-
provider.off("status", onStoreChange);
|
|
26
|
-
};
|
|
27
|
-
},
|
|
28
|
-
[provider]
|
|
29
|
-
);
|
|
30
|
-
const getSnapshot = useCallback(() => {
|
|
31
|
-
if (provider === void 0) {
|
|
32
|
-
return "not-loaded";
|
|
33
|
-
}
|
|
34
|
-
return provider.getStatus();
|
|
35
|
-
}, [provider]);
|
|
36
|
-
return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
|
|
37
|
-
}
|
|
38
16
|
function useIsEditorReady() {
|
|
39
17
|
const yjsProvider = useYjsProvider();
|
|
40
18
|
const getSnapshot = useCallback(() => {
|
|
@@ -143,5 +121,5 @@ const LiveblocksPlugin = ({
|
|
|
143
121
|
});
|
|
144
122
|
};
|
|
145
123
|
|
|
146
|
-
export { LiveblocksPlugin,
|
|
124
|
+
export { LiveblocksPlugin, useIsEditorReady };
|
|
147
125
|
//# sourceMappingURL=liveblocks-plugin-provider.js.map
|
|
@@ -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 { TextEditorType } from \"@liveblocks/core\";\nimport { useRoom, useSelf } from \"@liveblocks/react\";\nimport {\n useLayoutEffect,\n useReportTextEditor,\n useResolveMentionSuggestions,\n useYjsProvider,\n} from \"@liveblocks/react/_private\";\nimport { getYjsProviderForRoom } from \"@liveblocks/yjs\";\nimport type { MutableRefObject, ReactNode } from \"react\";\nimport { useCallback, useEffect, useState, useSyncExternalStore } from \"react\";\nimport type { 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\";\nimport { useRootElement } from \"./use-root-element\";\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\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 const provider = getYjsProviderForRoom(room);\n yjsDocMap.set(id, provider.getYDoc());\n\n return provider 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"],"names":[],"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 { TextEditorType } from \"@liveblocks/core\";\nimport { useRoom, useSelf } from \"@liveblocks/react\";\nimport {\n useLayoutEffect,\n useReportTextEditor,\n useResolveMentionSuggestions,\n useYjsProvider,\n} from \"@liveblocks/react/_private\";\nimport { getYjsProviderForRoom } from \"@liveblocks/yjs\";\nimport type { MutableRefObject, ReactNode } from \"react\";\nimport { useCallback, useEffect, useState, useSyncExternalStore } from \"react\";\nimport type { 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\";\nimport { useRootElement } from \"./use-root-element\";\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\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 const provider = getYjsProviderForRoom(room);\n yjsDocMap.set(id, provider.getYDoc());\n\n return provider 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"],"names":[],"mappings":";;;;;;;;;;;;;;;AA2BO,SAAS,gBAA4B,GAAA;AAC1C,EAAA,MAAM,cAAc,cAAe,EAAA,CAAA;AAEnC,EAAM,MAAA,WAAA,GAAc,YAAY,MAAM;AACpC,IAAM,MAAA,MAAA,GAAS,aAAa,SAAU,EAAA,CAAA;AACtC,IAAO,OAAA,MAAA,KAAW,mBAAmB,MAAW,KAAA,cAAA,CAAA;AAAA,GAClD,EAAG,CAAC,WAAW,CAAC,CAAA,CAAA;AAEhB,EAAA,MAAM,SAAY,GAAA,WAAA;AAAA,IAChB,CAAC,QAAyB,KAAA;AACxB,MAAA,IAAI,WAAgB,KAAA,KAAA,CAAA;AAAW,QAAA,OAAO,MAAM;AAAA,SAAC,CAAA;AAC7C,MAAY,WAAA,CAAA,EAAA,CAAG,UAAU,QAAQ,CAAA,CAAA;AACjC,MAAA,OAAO,MAAM;AACX,QAAY,WAAA,CAAA,GAAA,CAAI,UAAU,QAAQ,CAAA,CAAA;AAAA,OACpC,CAAA;AAAA,KACF;AAAA,IACA,CAAC,WAAW,CAAA;AAAA,GACd,CAAA;AAEA,EAAO,OAAA,oBAAA,CAAqB,SAAW,EAAA,WAAA,EAAa,WAAW,CAAA,CAAA;AACjE,CAAA;AAuCO,MAAM,mBAAmB,CAAC;AAAA,EAC/B,QAAA;AACF,CAA0C,KAAA;AACxC,EAAM,MAAA,kCAAA,GACJ,8BAAmC,KAAA,KAAA,CAAA,CAAA;AACrC,EAAM,MAAA,CAAC,MAAM,CAAA,GAAI,yBAA0B,EAAA,CAAA;AAC3C,EAAA,MAAM,OAAO,OAAQ,EAAA,CAAA;AAErB,EAAA,IAAI,CAAC,MAAO,CAAA,QAAA,CAAS,CAAC,cAAgB,EAAA,WAAW,CAAC,CAAG,EAAA;AACnD,IAAA,MAAM,IAAI,KAAA;AAAA,MACR,qNAAA;AAAA,KACF,CAAA;AAAA,GACF;AAEA,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,SAEtC,KAAS,CAAA,CAAA,CAAA;AAEX,EAAM,MAAA;AAAA,IACJ,IAAA,EAAM,EAAE,YAAA,EAAc,WAAY,EAAA;AAAA,IAClC,QAAA;AAAA,IACA,CAAA;AAAA,IACA,CAAA;AAAA,MACE,WAAY,CAAA;AAAA,IACd,QAAU,EAAA,OAAA;AAAA,IACV,SAAW,EAAA,QAAA;AAAA,IACX,oBAAA,EAAsB,IAAI,IAAS,KAAA;AACjC,MAAO,OAAA,UAAA,CAAW,GAAG,IAAM,EAAA;AAAA,QACzB,cAAgB,EAAA,IAAA;AAAA,OACjB,CAAA,CAAA;AAAA,KACH;AAAA,GACD,CAAA,CAAA;AAGD,EAAA,SAAA,CAAU,MAAM;AAEd,IAAI,IAAA,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AAEzC,MAAA,IAAI,CAAC,MAAA,CAAO,cAAe,EAAA,CAAE,SAAW,EAAA;AACtC,QAAQ,OAAA,CAAA,IAAA;AAAA,UACN,qFAAA;AAAA,SACF,CAAA;AAAA,OACF;AAAA,KACF;AAAA,GAIF,EAAG,EAAE,CAAA,CAAA;AAEL,EAAoB,mBAAA,CAAA,cAAA,CAAe,SAAS,MAAM,CAAA,CAAA;AAGlD,EAAA,MAAM,OAAO,OAAQ,EAAA,CAAA;AAErB,EAAA,MAAM,eAAkB,GAAA,WAAA;AAAA,IACtB,CAAC,IAAY,SAA0C,KAAA;AACrD,MAAM,MAAA,QAAA,GAAW,sBAAsB,IAAI,CAAA,CAAA;AAC3C,MAAA,SAAA,CAAU,GAAI,CAAA,EAAA,EAAI,QAAS,CAAA,OAAA,EAAS,CAAA,CAAA;AAEpC,MAAO,OAAA,QAAA,CAAA;AAAA,KACT;AAAA,IACA,CAAC,IAAI,CAAA;AAAA,GACP,CAAA;AAEA,EAAA,MAAM,OAAO,cAAe,EAAA,CAAA;AAE5B,EAAA,eAAA,CAAgB,MAAM;AACpB,IAAA,IAAI,IAAS,KAAA,IAAA;AAAM,MAAA,OAAA;AACnB,IAAa,YAAA,CAAA;AAAA,MACX,qBAAA,EAAuB,MAAM,IAAA,CAAK,qBAAsB,EAAA;AAAA,KACzD,CAAA,CAAA;AAAA,GACA,EAAA,CAAC,YAAc,EAAA,IAAI,CAAC,CAAA,CAAA;AAEvB,EAAA,MAAM,iBAAoB,GAAA,WAAA;AAAA,IACxB,CAAC,IAAyB,KAAA;AACxB,MAAA,WAAA,CAAY,IAAI,CAAA,CAAA;AAChB,MAAgB,eAAA,CAAA,EAAE,OAAS,EAAA,IAAA,EAAM,CAAA,CAAA;AAAA,KACnC;AAAA,IACA,CAAC,aAAa,eAAe,CAAA;AAAA,GAC/B,CAAA;AAEA,EACE,uBAAA,IAAA,CAAA,QAAA,EAAA;AAAA,IACE,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,KAAA,EAAA;AAAA,QACC,GAAK,EAAA,iBAAA;AAAA,QACL,KAAO,EAAA;AAAA,UACL,QAAU,EAAA,QAAA;AAAA,UACV,GAAK,EAAA,CAAA;AAAA,UACL,IAAM,EAAA,CAAA;AAAA,UACN,SAAA,EAAW,eAAe,IAAK,CAAA,KAAA,CAAM,CAAC,CAAQ,CAAA,IAAA,EAAA,IAAA,CAAK,MAAM,CAAC,CAAA,CAAA,MAAA,CAAA;AAAA,UAC1D,QAAU,EAAA,aAAA;AAAA,SACZ;AAAA,OACF,CAAA;AAAA,MAEC,wBACE,GAAA,CAAA,mBAAA,EAAA;AAAA,QAIC,IAAI,IAAK,CAAA,EAAA;AAAA,QACT,eAAA;AAAA,QACA,QAAA,EAAU,IAAK,CAAA,IAAA,EAAM,IAAQ,IAAA,EAAA;AAAA,QAC7B,WAAA,EAAa,KAAK,IAAM,EAAA,KAAA;AAAA,QACxB,mBAAqB,EAAA,YAAA;AAAA,QACrB,eAAiB,EAAA,IAAA;AAAA,OAAA,EANZ,KAAK,EAOZ,CAAA;AAAA,MAGD,kCAAA,wBAAuC,aAAc,EAAA,EAAA,CAAA;AAAA,sBACrD,GAAA,CAAA,qBAAA,EAAA;AAAA,QAAuB,QAAA;AAAA,OAAS,CAAA;AAAA,KAAA;AAAA,GACnC,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
4
4
|
var reactDom$1 = require('@floating-ui/react-dom');
|
|
5
5
|
var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
|
|
6
|
+
var core = require('@liveblocks/core');
|
|
6
7
|
var react = require('@liveblocks/react');
|
|
7
8
|
var _private = require('@liveblocks/react/_private');
|
|
8
9
|
var lexical = require('lexical');
|
|
@@ -193,8 +194,8 @@ function MentionPlugin() {
|
|
|
193
194
|
lexical.COMMAND_PRIORITY_LOW
|
|
194
195
|
);
|
|
195
196
|
}, [editor]);
|
|
196
|
-
const
|
|
197
|
-
(
|
|
197
|
+
const handleSuggestionSelect = react$1.useCallback(
|
|
198
|
+
(mention) => {
|
|
198
199
|
function $onValueSelect() {
|
|
199
200
|
if (match === null)
|
|
200
201
|
return;
|
|
@@ -217,7 +218,14 @@ function MentionPlugin() {
|
|
|
217
218
|
const startOffset = selectionOffset - queryOffset;
|
|
218
219
|
if (startOffset < 0)
|
|
219
220
|
return;
|
|
220
|
-
|
|
221
|
+
let mentionNode$1;
|
|
222
|
+
switch (mention.kind) {
|
|
223
|
+
case "user":
|
|
224
|
+
mentionNode$1 = mentionNode.$createMentionNode(mention.id);
|
|
225
|
+
break;
|
|
226
|
+
default:
|
|
227
|
+
return core.assertNever(mention.kind, "Unhandled mention kind");
|
|
228
|
+
}
|
|
221
229
|
if (startOffset === 0) {
|
|
222
230
|
const [node] = anchorNode.splitText(selectionOffset);
|
|
223
231
|
node.replace(mentionNode$1);
|
|
@@ -240,8 +248,8 @@ function MentionPlugin() {
|
|
|
240
248
|
return reactDom.createPortal(
|
|
241
249
|
/* @__PURE__ */ jsxRuntime.jsx(suggestions.SuggestionsContext.Provider, {
|
|
242
250
|
value: suggestions$1,
|
|
243
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(suggestions.
|
|
244
|
-
value:
|
|
251
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(suggestions.OnSuggestionSelectCallbackContext.Provider, {
|
|
252
|
+
value: handleSuggestionSelect,
|
|
245
253
|
children: /* @__PURE__ */ jsxRuntime.jsx(suggestions.OnResetMatchCallbackContext.Provider, {
|
|
246
254
|
value: () => setMatch(null),
|
|
247
255
|
children: /* @__PURE__ */ jsxRuntime.jsx(SuggestionsPortal, {
|
|
@@ -249,20 +257,27 @@ function MentionPlugin() {
|
|
|
249
257
|
container: document.body,
|
|
250
258
|
children: /* @__PURE__ */ jsxRuntime.jsx(suggestions.List, {
|
|
251
259
|
className: "lb-lexical-suggestions-list lb-lexical-mention-suggestions-list",
|
|
252
|
-
children: suggestions$1.map((
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
260
|
+
children: suggestions$1.map((mention) => {
|
|
261
|
+
switch (mention.kind) {
|
|
262
|
+
case "user":
|
|
263
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(suggestions.Item, {
|
|
264
|
+
value: mention.id,
|
|
265
|
+
className: "lb-lexical-suggestions-list-item lb-lexical-mention-suggestion",
|
|
266
|
+
children: [
|
|
267
|
+
/* @__PURE__ */ jsxRuntime.jsx(avatar.Avatar, {
|
|
268
|
+
userId: mention.id,
|
|
269
|
+
className: "lb-lexical-mention-suggestion-avatar"
|
|
270
|
+
}),
|
|
271
|
+
/* @__PURE__ */ jsxRuntime.jsx(user.User, {
|
|
272
|
+
userId: mention.id,
|
|
273
|
+
className: "lb-lexical-mention-suggestion-user"
|
|
274
|
+
})
|
|
275
|
+
]
|
|
276
|
+
}, mention.id);
|
|
277
|
+
default:
|
|
278
|
+
return core.assertNever(mention.kind, "Unhandled mention kind");
|
|
279
|
+
}
|
|
280
|
+
})
|
|
266
281
|
})
|
|
267
282
|
}, matchingString)
|
|
268
283
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mention-plugin.cjs","sources":["../../src/mentions/mention-plugin.tsx"],"sourcesContent":["import {\n autoUpdate,\n flip,\n hide,\n limitShift,\n offset,\n shift,\n size,\n useFloating,\n} from \"@floating-ui/react-dom\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { useRoom } from \"@liveblocks/react\";\nimport {\n useCreateTextMention,\n useDeleteTextMention,\n useLayoutEffect,\n useMentionSuggestions,\n} from \"@liveblocks/react/_private\";\nimport type { EditorState, NodeKey, NodeMutation, TextNode } from \"lexical\";\nimport {\n $createRangeSelection,\n $createTextNode,\n $getNodeByKey,\n $getSelection,\n $isElementNode,\n $isNodeSelection,\n $isRangeSelection,\n $isTextNode,\n $setSelection,\n COMMAND_PRIORITY_LOW,\n KEY_BACKSPACE_COMMAND,\n} from \"lexical\";\nimport type { ReactNode } from \"react\";\nimport { useCallback, useEffect, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\n\nimport { Avatar } from \"./avatar\";\nimport {\n $createMentionNode,\n $isMentionNode,\n MentionNode,\n} from \"./mention-node\";\nimport * as Suggestions from \"./suggestions\";\nimport {\n OnResetMatchCallbackContext,\n OnValueSelectCallbackContext,\n SuggestionsContext,\n} from \"./suggestions\";\nimport { User } from \"./user\";\n\nconst MENTION_TRIGGER = \"@\";\n\nconst PUNCTUATIONS =\n \"\\\\.,\\\\+\\\\*\\\\?\\\\$\\\\@\\\\|#{}\\\\(\\\\)\\\\^\\\\-\\\\[\\\\]\\\\\\\\/!%'\\\"~=<>_:;\";\n\n// Characters we expect to see in a mention (non-space, non-punctuation).\nconst VALID_CHARACTERS = \"[^\" + MENTION_TRIGGER + PUNCTUATIONS + \"\\\\s]\";\n\nconst VALID_JOINS =\n \"(?:\" +\n \"\\\\.[ |$]|\" + // E.g. \"r. \" in \"Mr. Smith\"\n \" |\" + // E.g. \" \" in \"Josh Duck\"\n \"[\" +\n PUNCTUATIONS +\n \"]|\" + // E.g. \"-' in \"Salier-Hellendag\"\n \")\";\n\nconst LENGTH_LIMIT = 75;\n\nconst MentionRegex = new RegExp(\n \"(^|\\\\s|\\\\()(\" +\n \"[\" +\n MENTION_TRIGGER +\n \"]\" +\n \"((?:\" +\n VALID_CHARACTERS +\n VALID_JOINS +\n \"){0,\" +\n LENGTH_LIMIT +\n \"})\" +\n \")$\"\n);\n\nfunction $getAnchorNodeTextContent(): string | null {\n const selection = $getSelection();\n if (!$isRangeSelection(selection)) return null;\n\n const anchor = selection.anchor;\n if (anchor.type !== \"text\") return null;\n const anchorNode = anchor.getNode();\n if (!anchorNode.isSimpleText()) return null;\n const anchorOffset = anchor.offset;\n return anchorNode.getTextContent().slice(0, anchorOffset);\n}\n\n/**\n * Walk backwards along user input and forward through entity title to try and replace more of the user's text with entity.\n */\nfunction getFullMatchOffset(\n documentText: string,\n entryText: string,\n offset: number\n): number {\n let triggerOffset = offset;\n for (let i = triggerOffset; i <= entryText.length; i++) {\n if (documentText.substr(-i) === entryText.substr(0, i)) {\n triggerOffset = i;\n }\n }\n return triggerOffset;\n}\n\nfunction $isCurrentSelectionAtBoundary(offset: number): boolean {\n // If the offset is not zero, i.e. not at the beginning of the text node, the selection is somewhere in the middle of the entity, i.e. not at the boundary.\n if (offset !== 0) return false;\n\n // Othewise (if the offset is zero), it means the selection could be at the start of an entity. It could also be at the end of the previous entity, or it could be in a position where there are no entities at all.\n // So, we check if the previous sibling of the node at the anchor of the selection is a text entity. If it is, then the selection is at the boundary of the entity.\n const selection = $getSelection();\n\n if (!$isRangeSelection(selection)) return false;\n\n const anchor = selection.anchor.getNode();\n const prevSibling = anchor.getPreviousSibling();\n\n if (!$isTextNode(prevSibling)) return false;\n if (!prevSibling.isTextEntity()) return false;\n\n return true;\n}\n\nfunction $getRangeAtMatch(match: RegExpExecArray): globalThis.Range | null {\n const offsetWithWhitespaces = match.index + match[1].length;\n\n if ($isCurrentSelectionAtBoundary(offsetWithWhitespaces)) return null;\n\n const selection = window.getSelection();\n if (selection === null) return null;\n if (!selection.isCollapsed) return null;\n\n const anchor = selection.anchorNode;\n if (anchor === null) return null;\n\n const endOffset = selection.anchorOffset;\n if (endOffset === null) return null;\n\n const range = document.createRange();\n\n try {\n range.setStart(anchor, offsetWithWhitespaces);\n range.setEnd(anchor, endOffset);\n return range;\n } catch (error) {\n return null;\n }\n}\n\nexport function MentionPlugin() {\n const [editor] = useLexicalComposerContext();\n const room = useRoom();\n\n const [match, setMatch] = useState<RegExpExecArray | null>(null); // Represents the current match of the mention regex. A `null` value means there is no match.\n const matchingString = match?.[3];\n\n const suggestions = useMentionSuggestions(room.id, matchingString);\n const createTextMention = useCreateTextMention();\n const deleteTextMention = useDeleteTextMention();\n\n useEffect(() => {\n function $handleMutation(\n mutations: Map<NodeKey, NodeMutation>,\n {\n prevEditorState,\n }: {\n prevEditorState: EditorState;\n }\n ) {\n for (const [key, mutation] of mutations) {\n if (mutation === \"created\") {\n editor.getEditorState().read(() => {\n const node = $getNodeByKey(key);\n if (node === null) return;\n\n if (!$isMentionNode(node)) return;\n createTextMention(node.getUserId(), node.getId());\n });\n } else if (mutation === \"destroyed\") {\n prevEditorState.read(() => {\n const node = $getNodeByKey(key);\n if (node === null) return;\n\n if (!$isMentionNode(node)) return;\n deleteTextMention(node.getId());\n });\n }\n }\n }\n\n return editor.registerMutationListener(\n MentionNode,\n (mutations, payload) => {\n // Ignore mutations to MentionNode (creation/updates/deletions) that are caused by collaboration (remote users) or history merge.\n if (\n payload.updateTags.has(\"collaboration\") ||\n payload.updateTags.has(\"history-merge\")\n ) {\n return;\n }\n\n $handleMutation(mutations, payload);\n }\n );\n }, [editor, createTextMention, deleteTextMention]);\n\n useEffect(() => {\n function $onStateRead() {\n const text = $getAnchorNodeTextContent();\n if (text === null) {\n setMatch(null);\n return;\n }\n\n const match = MentionRegex.exec(text);\n setMatch(match);\n }\n\n return editor.registerUpdateListener(({ editorState: state }) => {\n state.read($onStateRead);\n });\n }, [editor]);\n\n useEffect(() => {\n function $handleBackspace(event: KeyboardEvent): boolean {\n const selection = $getSelection();\n\n if (selection === null) return false;\n\n // If the selection is a node selection and the only node selected is a mention node, then we replace the mention node with a text node containing \"@\" and set the selection at the end of the text node.\n if ($isNodeSelection(selection)) {\n const nodes = selection.getNodes();\n if (nodes.length !== 1) return false;\n\n const node = nodes[0];\n if (!$isMentionNode(node)) return false;\n\n const text = $createTextNode(\"@\");\n node.replace(text);\n\n const newSelection = $createRangeSelection();\n newSelection.setTextNodeRange(text, 1, text, 1);\n $setSelection(newSelection);\n\n event.preventDefault();\n return true;\n } else if ($isRangeSelection(selection)) {\n if (!selection.isCollapsed()) return false;\n\n const anchor = selection.anchor.getNode();\n const prevSibling = anchor.getPreviousSibling();\n if (selection.anchor.offset === 0 && $isMentionNode(prevSibling)) {\n const text = $createTextNode(\"@\");\n prevSibling.replace(text);\n\n const newSelection = $createRangeSelection();\n newSelection.setTextNodeRange(text, 1, text, 1);\n $setSelection(newSelection);\n\n event.preventDefault();\n return true;\n } else if ($isElementNode(anchor)) {\n const child = anchor.getChildAtIndex(selection.anchor.offset - 1);\n if (!$isMentionNode(child)) return false;\n\n const text = $createTextNode(\"@\");\n child.replace(text);\n\n const newSelection = $createRangeSelection();\n newSelection.setTextNodeRange(text, 1, text, 1);\n $setSelection(newSelection);\n\n event.preventDefault();\n return true;\n }\n\n return false;\n }\n\n return false;\n }\n\n return editor.registerCommand(\n KEY_BACKSPACE_COMMAND,\n $handleBackspace,\n COMMAND_PRIORITY_LOW\n );\n }, [editor]);\n\n const handleValueSelect = useCallback(\n (userId: string) => {\n function $onValueSelect() {\n if (match === null) return;\n\n setMatch(null);\n\n const selection = $getSelection();\n\n if (!$isRangeSelection(selection)) return;\n if (!selection.isCollapsed()) return;\n\n const anchor = selection.anchor;\n if (anchor.type !== \"text\") return;\n\n const anchorNode: TextNode = anchor.getNode();\n if (!anchorNode.isSimpleText()) return;\n\n const selectionOffset = anchor.offset;\n const text = anchorNode.getTextContent().slice(0, selectionOffset);\n\n const characterOffset = match[2].length;\n const queryOffset = getFullMatchOffset(text, match[2], characterOffset);\n const startOffset = selectionOffset - queryOffset;\n if (startOffset < 0) return;\n\n const mentionNode = $createMentionNode(userId);\n\n // Split the anchor (text) node and create a new text node only containing matched text.\n if (startOffset === 0) {\n const [node] = anchorNode.splitText(selectionOffset);\n node.replace(mentionNode);\n } else {\n const [, node] = anchorNode.splitText(startOffset, selectionOffset);\n node.replace(mentionNode);\n }\n }\n\n editor.update($onValueSelect);\n },\n [editor, match]\n );\n\n if (match === null || matchingString === undefined) return null;\n\n if (suggestions === undefined || suggestions.length === 0) return null;\n\n const range = editor.getEditorState().read(() => $getRangeAtMatch(match));\n\n if (range === null) return null;\n\n return createPortal(\n <SuggestionsContext.Provider value={suggestions}>\n <OnValueSelectCallbackContext.Provider value={handleValueSelect}>\n <OnResetMatchCallbackContext.Provider value={() => setMatch(null)}>\n <SuggestionsPortal\n range={range}\n container={document.body}\n key={matchingString}\n >\n <Suggestions.List className=\"lb-lexical-suggestions-list lb-lexical-mention-suggestions-list\">\n {suggestions.map((userId) => (\n <Suggestions.Item\n key={userId}\n value={userId}\n className=\"lb-lexical-suggestions-list-item lb-lexical-mention-suggestion\"\n >\n <Avatar\n userId={userId}\n className=\"lb-lexical-mention-suggestion-avatar\"\n />\n <User\n userId={userId}\n className=\"lb-lexical-mention-suggestion-user\"\n />\n </Suggestions.Item>\n ))}\n </Suggestions.List>\n </SuggestionsPortal>\n </OnResetMatchCallbackContext.Provider>\n </OnValueSelectCallbackContext.Provider>\n </SuggestionsContext.Provider>,\n document.body\n );\n}\n\nexport const SUGGESTIONS_COLLISION_PADDING = 10;\n\nfunction SuggestionsPortal({\n children,\n range,\n container,\n}: {\n children: ReactNode;\n range: Range;\n container: Element;\n}) {\n const {\n refs: { setReference, setFloating },\n strategy,\n x,\n y,\n } = useFloating({\n strategy: \"fixed\",\n placement: \"top-start\",\n middleware: [\n flip({ padding: SUGGESTIONS_COLLISION_PADDING, crossAxis: false }),\n offset(10),\n hide({ padding: SUGGESTIONS_COLLISION_PADDING }),\n shift({ padding: SUGGESTIONS_COLLISION_PADDING, limiter: limitShift() }),\n size({ padding: SUGGESTIONS_COLLISION_PADDING }),\n ],\n whileElementsMounted: (...args) => {\n return autoUpdate(...args, {\n animationFrame: true,\n });\n },\n });\n\n useLayoutEffect(() => {\n setReference({\n getBoundingClientRect: () => range.getBoundingClientRect(),\n });\n }, [setReference, range]);\n\n return createPortal(\n <div\n ref={setFloating}\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 className=\"lb-root lb-portal lb-elevation lb-lexical-suggestions lb-lexical-mention-suggestions\"\n >\n {children}\n </div>,\n container\n );\n}\n"],"names":["$getSelection","$isRangeSelection","offset","$isTextNode","useLexicalComposerContext","useRoom","useState","suggestions","useMentionSuggestions","useCreateTextMention","useDeleteTextMention","useEffect","$getNodeByKey","$isMentionNode","MentionNode","match","$isNodeSelection","$createTextNode","$createRangeSelection","$setSelection","$isElementNode","KEY_BACKSPACE_COMMAND","COMMAND_PRIORITY_LOW","useCallback","mentionNode","$createMentionNode","createPortal","jsx","SuggestionsContext","OnValueSelectCallbackContext","OnResetMatchCallbackContext","Suggestions.List","jsxs","Suggestions.Item","Avatar","User","useFloating","flip","hide","shift","limitShift","size","autoUpdate","useLayoutEffect"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"mention-plugin.cjs","sources":["../../src/mentions/mention-plugin.tsx"],"sourcesContent":["import {\n autoUpdate,\n flip,\n hide,\n limitShift,\n offset,\n shift,\n size,\n useFloating,\n} from \"@floating-ui/react-dom\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { assertNever, type MentionData } from \"@liveblocks/core\";\nimport { useRoom } from \"@liveblocks/react\";\nimport {\n useCreateTextMention,\n useDeleteTextMention,\n useLayoutEffect,\n useMentionSuggestions,\n} from \"@liveblocks/react/_private\";\nimport type { EditorState, NodeKey, NodeMutation, TextNode } from \"lexical\";\nimport {\n $createRangeSelection,\n $createTextNode,\n $getNodeByKey,\n $getSelection,\n $isElementNode,\n $isNodeSelection,\n $isRangeSelection,\n $isTextNode,\n $setSelection,\n COMMAND_PRIORITY_LOW,\n KEY_BACKSPACE_COMMAND,\n} from \"lexical\";\nimport type { ReactNode } from \"react\";\nimport { useCallback, useEffect, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\n\nimport { Avatar } from \"./avatar\";\nimport {\n $createMentionNode,\n $isMentionNode,\n MentionNode,\n} from \"./mention-node\";\nimport * as Suggestions from \"./suggestions\";\nimport {\n OnResetMatchCallbackContext,\n OnSuggestionSelectCallbackContext,\n SuggestionsContext,\n} from \"./suggestions\";\nimport { User } from \"./user\";\n\nconst MENTION_TRIGGER = \"@\";\n\nconst PUNCTUATIONS =\n \"\\\\.,\\\\+\\\\*\\\\?\\\\$\\\\@\\\\|#{}\\\\(\\\\)\\\\^\\\\-\\\\[\\\\]\\\\\\\\/!%'\\\"~=<>_:;\";\n\n// Characters we expect to see in a mention (non-space, non-punctuation).\nconst VALID_CHARACTERS = \"[^\" + MENTION_TRIGGER + PUNCTUATIONS + \"\\\\s]\";\n\nconst VALID_JOINS =\n \"(?:\" +\n \"\\\\.[ |$]|\" + // E.g. \"r. \" in \"Mr. Smith\"\n \" |\" + // E.g. \" \" in \"Josh Duck\"\n \"[\" +\n PUNCTUATIONS +\n \"]|\" + // E.g. \"-' in \"Salier-Hellendag\"\n \")\";\n\nconst LENGTH_LIMIT = 75;\n\nconst MentionRegex = new RegExp(\n \"(^|\\\\s|\\\\()(\" +\n \"[\" +\n MENTION_TRIGGER +\n \"]\" +\n \"((?:\" +\n VALID_CHARACTERS +\n VALID_JOINS +\n \"){0,\" +\n LENGTH_LIMIT +\n \"})\" +\n \")$\"\n);\n\nfunction $getAnchorNodeTextContent(): string | null {\n const selection = $getSelection();\n if (!$isRangeSelection(selection)) return null;\n\n const anchor = selection.anchor;\n if (anchor.type !== \"text\") return null;\n const anchorNode = anchor.getNode();\n if (!anchorNode.isSimpleText()) return null;\n const anchorOffset = anchor.offset;\n return anchorNode.getTextContent().slice(0, anchorOffset);\n}\n\n/**\n * Walk backwards along user input and forward through entity title to try and replace more of the user's text with entity.\n */\nfunction getFullMatchOffset(\n documentText: string,\n entryText: string,\n offset: number\n): number {\n let triggerOffset = offset;\n for (let i = triggerOffset; i <= entryText.length; i++) {\n if (documentText.substr(-i) === entryText.substr(0, i)) {\n triggerOffset = i;\n }\n }\n return triggerOffset;\n}\n\nfunction $isCurrentSelectionAtBoundary(offset: number): boolean {\n // If the offset is not zero, i.e. not at the beginning of the text node, the selection is somewhere in the middle of the entity, i.e. not at the boundary.\n if (offset !== 0) return false;\n\n // Othewise (if the offset is zero), it means the selection could be at the start of an entity. It could also be at the end of the previous entity, or it could be in a position where there are no entities at all.\n // So, we check if the previous sibling of the node at the anchor of the selection is a text entity. If it is, then the selection is at the boundary of the entity.\n const selection = $getSelection();\n\n if (!$isRangeSelection(selection)) return false;\n\n const anchor = selection.anchor.getNode();\n const prevSibling = anchor.getPreviousSibling();\n\n if (!$isTextNode(prevSibling)) return false;\n if (!prevSibling.isTextEntity()) return false;\n\n return true;\n}\n\nfunction $getRangeAtMatch(match: RegExpExecArray): globalThis.Range | null {\n const offsetWithWhitespaces = match.index + match[1].length;\n\n if ($isCurrentSelectionAtBoundary(offsetWithWhitespaces)) return null;\n\n const selection = window.getSelection();\n if (selection === null) return null;\n if (!selection.isCollapsed) return null;\n\n const anchor = selection.anchorNode;\n if (anchor === null) return null;\n\n const endOffset = selection.anchorOffset;\n if (endOffset === null) return null;\n\n const range = document.createRange();\n\n try {\n range.setStart(anchor, offsetWithWhitespaces);\n range.setEnd(anchor, endOffset);\n return range;\n } catch (error) {\n return null;\n }\n}\n\nexport function MentionPlugin() {\n const [editor] = useLexicalComposerContext();\n const room = useRoom();\n\n const [match, setMatch] = useState<RegExpExecArray | null>(null); // Represents the current match of the mention regex. A `null` value means there is no match.\n const matchingString = match?.[3];\n\n const suggestions = useMentionSuggestions(room.id, matchingString);\n const createTextMention = useCreateTextMention();\n const deleteTextMention = useDeleteTextMention();\n\n useEffect(() => {\n function $handleMutation(\n mutations: Map<NodeKey, NodeMutation>,\n {\n prevEditorState,\n }: {\n prevEditorState: EditorState;\n }\n ) {\n for (const [key, mutation] of mutations) {\n if (mutation === \"created\") {\n editor.getEditorState().read(() => {\n const node = $getNodeByKey(key);\n if (node === null) return;\n\n if (!$isMentionNode(node)) return;\n createTextMention(node.getUserId(), node.getId());\n });\n } else if (mutation === \"destroyed\") {\n prevEditorState.read(() => {\n const node = $getNodeByKey(key);\n if (node === null) return;\n\n if (!$isMentionNode(node)) return;\n deleteTextMention(node.getId());\n });\n }\n }\n }\n\n return editor.registerMutationListener(\n MentionNode,\n (mutations, payload) => {\n // Ignore mutations to MentionNode (creation/updates/deletions) that are caused by collaboration (remote users) or history merge.\n if (\n payload.updateTags.has(\"collaboration\") ||\n payload.updateTags.has(\"history-merge\")\n ) {\n return;\n }\n\n $handleMutation(mutations, payload);\n }\n );\n }, [editor, createTextMention, deleteTextMention]);\n\n useEffect(() => {\n function $onStateRead() {\n const text = $getAnchorNodeTextContent();\n if (text === null) {\n setMatch(null);\n return;\n }\n\n const match = MentionRegex.exec(text);\n setMatch(match);\n }\n\n return editor.registerUpdateListener(({ editorState: state }) => {\n state.read($onStateRead);\n });\n }, [editor]);\n\n useEffect(() => {\n function $handleBackspace(event: KeyboardEvent): boolean {\n const selection = $getSelection();\n\n if (selection === null) return false;\n\n // If the selection is a node selection and the only node selected is a mention node, then we replace the mention node with a text node containing \"@\" and set the selection at the end of the text node.\n if ($isNodeSelection(selection)) {\n const nodes = selection.getNodes();\n if (nodes.length !== 1) return false;\n\n const node = nodes[0];\n if (!$isMentionNode(node)) return false;\n\n const text = $createTextNode(\"@\");\n node.replace(text);\n\n const newSelection = $createRangeSelection();\n newSelection.setTextNodeRange(text, 1, text, 1);\n $setSelection(newSelection);\n\n event.preventDefault();\n return true;\n } else if ($isRangeSelection(selection)) {\n if (!selection.isCollapsed()) return false;\n\n const anchor = selection.anchor.getNode();\n const prevSibling = anchor.getPreviousSibling();\n if (selection.anchor.offset === 0 && $isMentionNode(prevSibling)) {\n const text = $createTextNode(\"@\");\n prevSibling.replace(text);\n\n const newSelection = $createRangeSelection();\n newSelection.setTextNodeRange(text, 1, text, 1);\n $setSelection(newSelection);\n\n event.preventDefault();\n return true;\n } else if ($isElementNode(anchor)) {\n const child = anchor.getChildAtIndex(selection.anchor.offset - 1);\n if (!$isMentionNode(child)) return false;\n\n const text = $createTextNode(\"@\");\n child.replace(text);\n\n const newSelection = $createRangeSelection();\n newSelection.setTextNodeRange(text, 1, text, 1);\n $setSelection(newSelection);\n\n event.preventDefault();\n return true;\n }\n\n return false;\n }\n\n return false;\n }\n\n return editor.registerCommand(\n KEY_BACKSPACE_COMMAND,\n $handleBackspace,\n COMMAND_PRIORITY_LOW\n );\n }, [editor]);\n\n const handleSuggestionSelect = useCallback(\n (mention: MentionData) => {\n function $onValueSelect() {\n if (match === null) return;\n\n setMatch(null);\n\n const selection = $getSelection();\n\n if (!$isRangeSelection(selection)) return;\n if (!selection.isCollapsed()) return;\n\n const anchor = selection.anchor;\n if (anchor.type !== \"text\") return;\n\n const anchorNode: TextNode = anchor.getNode();\n if (!anchorNode.isSimpleText()) return;\n\n const selectionOffset = anchor.offset;\n const text = anchorNode.getTextContent().slice(0, selectionOffset);\n\n const characterOffset = match[2].length;\n const queryOffset = getFullMatchOffset(text, match[2], characterOffset);\n const startOffset = selectionOffset - queryOffset;\n if (startOffset < 0) return;\n\n let mentionNode: MentionNode;\n\n // Other mention kinds will be different nodes: GroupMentionNode, etc.\n switch (mention.kind) {\n case \"user\":\n mentionNode = $createMentionNode(mention.id);\n break;\n\n default:\n return assertNever(mention.kind, \"Unhandled mention kind\");\n }\n\n // Split the anchor (text) node and create a new text node only containing matched text.\n if (startOffset === 0) {\n const [node] = anchorNode.splitText(selectionOffset);\n node.replace(mentionNode);\n } else {\n const [, node] = anchorNode.splitText(startOffset, selectionOffset);\n node.replace(mentionNode);\n }\n }\n\n editor.update($onValueSelect);\n },\n [editor, match]\n );\n\n if (match === null || matchingString === undefined) return null;\n\n if (suggestions === undefined || suggestions.length === 0) return null;\n\n const range = editor.getEditorState().read(() => $getRangeAtMatch(match));\n\n if (range === null) return null;\n\n return createPortal(\n <SuggestionsContext.Provider value={suggestions}>\n <OnSuggestionSelectCallbackContext.Provider\n value={handleSuggestionSelect}\n >\n <OnResetMatchCallbackContext.Provider value={() => setMatch(null)}>\n <SuggestionsPortal\n range={range}\n container={document.body}\n key={matchingString}\n >\n <Suggestions.List className=\"lb-lexical-suggestions-list lb-lexical-mention-suggestions-list\">\n {suggestions.map((mention) => {\n switch (mention.kind) {\n case \"user\":\n return (\n <Suggestions.Item\n key={mention.id}\n value={mention.id}\n className=\"lb-lexical-suggestions-list-item lb-lexical-mention-suggestion\"\n >\n <Avatar\n userId={mention.id}\n className=\"lb-lexical-mention-suggestion-avatar\"\n />\n <User\n userId={mention.id}\n className=\"lb-lexical-mention-suggestion-user\"\n />\n </Suggestions.Item>\n );\n\n default:\n return assertNever(mention.kind, \"Unhandled mention kind\");\n }\n })}\n </Suggestions.List>\n </SuggestionsPortal>\n </OnResetMatchCallbackContext.Provider>\n </OnSuggestionSelectCallbackContext.Provider>\n </SuggestionsContext.Provider>,\n document.body\n );\n}\n\nexport const SUGGESTIONS_COLLISION_PADDING = 10;\n\nfunction SuggestionsPortal({\n children,\n range,\n container,\n}: {\n children: ReactNode;\n range: Range;\n container: Element;\n}) {\n const {\n refs: { setReference, setFloating },\n strategy,\n x,\n y,\n } = useFloating({\n strategy: \"fixed\",\n placement: \"top-start\",\n middleware: [\n flip({ padding: SUGGESTIONS_COLLISION_PADDING, crossAxis: false }),\n offset(10),\n hide({ padding: SUGGESTIONS_COLLISION_PADDING }),\n shift({ padding: SUGGESTIONS_COLLISION_PADDING, limiter: limitShift() }),\n size({ padding: SUGGESTIONS_COLLISION_PADDING }),\n ],\n whileElementsMounted: (...args) => {\n return autoUpdate(...args, {\n animationFrame: true,\n });\n },\n });\n\n useLayoutEffect(() => {\n setReference({\n getBoundingClientRect: () => range.getBoundingClientRect(),\n });\n }, [setReference, range]);\n\n return createPortal(\n <div\n ref={setFloating}\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 className=\"lb-root lb-portal lb-elevation lb-lexical-suggestions lb-lexical-mention-suggestions\"\n >\n {children}\n </div>,\n container\n );\n}\n"],"names":["$getSelection","$isRangeSelection","offset","$isTextNode","useLexicalComposerContext","useRoom","useState","suggestions","useMentionSuggestions","useCreateTextMention","useDeleteTextMention","useEffect","$getNodeByKey","$isMentionNode","MentionNode","match","$isNodeSelection","$createTextNode","$createRangeSelection","$setSelection","$isElementNode","KEY_BACKSPACE_COMMAND","COMMAND_PRIORITY_LOW","useCallback","mentionNode","$createMentionNode","assertNever","createPortal","jsx","SuggestionsContext","OnSuggestionSelectCallbackContext","OnResetMatchCallbackContext","Suggestions.List","jsxs","Suggestions.Item","Avatar","User","useFloating","flip","hide","shift","limitShift","size","autoUpdate","useLayoutEffect"],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
2
|
import { useFloating, flip, offset, hide, shift, limitShift, size, autoUpdate } from '@floating-ui/react-dom';
|
|
3
3
|
import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
|
|
4
|
+
import { assertNever } from '@liveblocks/core';
|
|
4
5
|
import { useRoom } from '@liveblocks/react';
|
|
5
6
|
import { useMentionSuggestions, useCreateTextMention, useDeleteTextMention, useLayoutEffect } from '@liveblocks/react/_private';
|
|
6
7
|
import { $getSelection, $isRangeSelection, $isTextNode, $getNodeByKey, $isNodeSelection, $createTextNode, $createRangeSelection, $setSelection, $isElementNode, KEY_BACKSPACE_COMMAND, COMMAND_PRIORITY_LOW } from 'lexical';
|
|
@@ -8,7 +9,7 @@ import { useState, useEffect, useCallback } from 'react';
|
|
|
8
9
|
import { createPortal } from 'react-dom';
|
|
9
10
|
import { Avatar } from './avatar.js';
|
|
10
11
|
import { $isMentionNode, MentionNode, $createMentionNode } from './mention-node.js';
|
|
11
|
-
import { SuggestionsContext,
|
|
12
|
+
import { SuggestionsContext, OnSuggestionSelectCallbackContext, OnResetMatchCallbackContext, List, Item } from './suggestions.js';
|
|
12
13
|
import { User } from './user.js';
|
|
13
14
|
|
|
14
15
|
const MENTION_TRIGGER = "@";
|
|
@@ -191,8 +192,8 @@ function MentionPlugin() {
|
|
|
191
192
|
COMMAND_PRIORITY_LOW
|
|
192
193
|
);
|
|
193
194
|
}, [editor]);
|
|
194
|
-
const
|
|
195
|
-
(
|
|
195
|
+
const handleSuggestionSelect = useCallback(
|
|
196
|
+
(mention) => {
|
|
196
197
|
function $onValueSelect() {
|
|
197
198
|
if (match === null)
|
|
198
199
|
return;
|
|
@@ -215,7 +216,14 @@ function MentionPlugin() {
|
|
|
215
216
|
const startOffset = selectionOffset - queryOffset;
|
|
216
217
|
if (startOffset < 0)
|
|
217
218
|
return;
|
|
218
|
-
|
|
219
|
+
let mentionNode;
|
|
220
|
+
switch (mention.kind) {
|
|
221
|
+
case "user":
|
|
222
|
+
mentionNode = $createMentionNode(mention.id);
|
|
223
|
+
break;
|
|
224
|
+
default:
|
|
225
|
+
return assertNever(mention.kind, "Unhandled mention kind");
|
|
226
|
+
}
|
|
219
227
|
if (startOffset === 0) {
|
|
220
228
|
const [node] = anchorNode.splitText(selectionOffset);
|
|
221
229
|
node.replace(mentionNode);
|
|
@@ -238,8 +246,8 @@ function MentionPlugin() {
|
|
|
238
246
|
return createPortal(
|
|
239
247
|
/* @__PURE__ */ jsx(SuggestionsContext.Provider, {
|
|
240
248
|
value: suggestions,
|
|
241
|
-
children: /* @__PURE__ */ jsx(
|
|
242
|
-
value:
|
|
249
|
+
children: /* @__PURE__ */ jsx(OnSuggestionSelectCallbackContext.Provider, {
|
|
250
|
+
value: handleSuggestionSelect,
|
|
243
251
|
children: /* @__PURE__ */ jsx(OnResetMatchCallbackContext.Provider, {
|
|
244
252
|
value: () => setMatch(null),
|
|
245
253
|
children: /* @__PURE__ */ jsx(SuggestionsPortal, {
|
|
@@ -247,20 +255,27 @@ function MentionPlugin() {
|
|
|
247
255
|
container: document.body,
|
|
248
256
|
children: /* @__PURE__ */ jsx(List, {
|
|
249
257
|
className: "lb-lexical-suggestions-list lb-lexical-mention-suggestions-list",
|
|
250
|
-
children: suggestions.map((
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
258
|
+
children: suggestions.map((mention) => {
|
|
259
|
+
switch (mention.kind) {
|
|
260
|
+
case "user":
|
|
261
|
+
return /* @__PURE__ */ jsxs(Item, {
|
|
262
|
+
value: mention.id,
|
|
263
|
+
className: "lb-lexical-suggestions-list-item lb-lexical-mention-suggestion",
|
|
264
|
+
children: [
|
|
265
|
+
/* @__PURE__ */ jsx(Avatar, {
|
|
266
|
+
userId: mention.id,
|
|
267
|
+
className: "lb-lexical-mention-suggestion-avatar"
|
|
268
|
+
}),
|
|
269
|
+
/* @__PURE__ */ jsx(User, {
|
|
270
|
+
userId: mention.id,
|
|
271
|
+
className: "lb-lexical-mention-suggestion-user"
|
|
272
|
+
})
|
|
273
|
+
]
|
|
274
|
+
}, mention.id);
|
|
275
|
+
default:
|
|
276
|
+
return assertNever(mention.kind, "Unhandled mention kind");
|
|
277
|
+
}
|
|
278
|
+
})
|
|
264
279
|
})
|
|
265
280
|
}, matchingString)
|
|
266
281
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mention-plugin.js","sources":["../../src/mentions/mention-plugin.tsx"],"sourcesContent":["import {\n autoUpdate,\n flip,\n hide,\n limitShift,\n offset,\n shift,\n size,\n useFloating,\n} from \"@floating-ui/react-dom\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { useRoom } from \"@liveblocks/react\";\nimport {\n useCreateTextMention,\n useDeleteTextMention,\n useLayoutEffect,\n useMentionSuggestions,\n} from \"@liveblocks/react/_private\";\nimport type { EditorState, NodeKey, NodeMutation, TextNode } from \"lexical\";\nimport {\n $createRangeSelection,\n $createTextNode,\n $getNodeByKey,\n $getSelection,\n $isElementNode,\n $isNodeSelection,\n $isRangeSelection,\n $isTextNode,\n $setSelection,\n COMMAND_PRIORITY_LOW,\n KEY_BACKSPACE_COMMAND,\n} from \"lexical\";\nimport type { ReactNode } from \"react\";\nimport { useCallback, useEffect, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\n\nimport { Avatar } from \"./avatar\";\nimport {\n $createMentionNode,\n $isMentionNode,\n MentionNode,\n} from \"./mention-node\";\nimport * as Suggestions from \"./suggestions\";\nimport {\n OnResetMatchCallbackContext,\n OnValueSelectCallbackContext,\n SuggestionsContext,\n} from \"./suggestions\";\nimport { User } from \"./user\";\n\nconst MENTION_TRIGGER = \"@\";\n\nconst PUNCTUATIONS =\n \"\\\\.,\\\\+\\\\*\\\\?\\\\$\\\\@\\\\|#{}\\\\(\\\\)\\\\^\\\\-\\\\[\\\\]\\\\\\\\/!%'\\\"~=<>_:;\";\n\n// Characters we expect to see in a mention (non-space, non-punctuation).\nconst VALID_CHARACTERS = \"[^\" + MENTION_TRIGGER + PUNCTUATIONS + \"\\\\s]\";\n\nconst VALID_JOINS =\n \"(?:\" +\n \"\\\\.[ |$]|\" + // E.g. \"r. \" in \"Mr. Smith\"\n \" |\" + // E.g. \" \" in \"Josh Duck\"\n \"[\" +\n PUNCTUATIONS +\n \"]|\" + // E.g. \"-' in \"Salier-Hellendag\"\n \")\";\n\nconst LENGTH_LIMIT = 75;\n\nconst MentionRegex = new RegExp(\n \"(^|\\\\s|\\\\()(\" +\n \"[\" +\n MENTION_TRIGGER +\n \"]\" +\n \"((?:\" +\n VALID_CHARACTERS +\n VALID_JOINS +\n \"){0,\" +\n LENGTH_LIMIT +\n \"})\" +\n \")$\"\n);\n\nfunction $getAnchorNodeTextContent(): string | null {\n const selection = $getSelection();\n if (!$isRangeSelection(selection)) return null;\n\n const anchor = selection.anchor;\n if (anchor.type !== \"text\") return null;\n const anchorNode = anchor.getNode();\n if (!anchorNode.isSimpleText()) return null;\n const anchorOffset = anchor.offset;\n return anchorNode.getTextContent().slice(0, anchorOffset);\n}\n\n/**\n * Walk backwards along user input and forward through entity title to try and replace more of the user's text with entity.\n */\nfunction getFullMatchOffset(\n documentText: string,\n entryText: string,\n offset: number\n): number {\n let triggerOffset = offset;\n for (let i = triggerOffset; i <= entryText.length; i++) {\n if (documentText.substr(-i) === entryText.substr(0, i)) {\n triggerOffset = i;\n }\n }\n return triggerOffset;\n}\n\nfunction $isCurrentSelectionAtBoundary(offset: number): boolean {\n // If the offset is not zero, i.e. not at the beginning of the text node, the selection is somewhere in the middle of the entity, i.e. not at the boundary.\n if (offset !== 0) return false;\n\n // Othewise (if the offset is zero), it means the selection could be at the start of an entity. It could also be at the end of the previous entity, or it could be in a position where there are no entities at all.\n // So, we check if the previous sibling of the node at the anchor of the selection is a text entity. If it is, then the selection is at the boundary of the entity.\n const selection = $getSelection();\n\n if (!$isRangeSelection(selection)) return false;\n\n const anchor = selection.anchor.getNode();\n const prevSibling = anchor.getPreviousSibling();\n\n if (!$isTextNode(prevSibling)) return false;\n if (!prevSibling.isTextEntity()) return false;\n\n return true;\n}\n\nfunction $getRangeAtMatch(match: RegExpExecArray): globalThis.Range | null {\n const offsetWithWhitespaces = match.index + match[1].length;\n\n if ($isCurrentSelectionAtBoundary(offsetWithWhitespaces)) return null;\n\n const selection = window.getSelection();\n if (selection === null) return null;\n if (!selection.isCollapsed) return null;\n\n const anchor = selection.anchorNode;\n if (anchor === null) return null;\n\n const endOffset = selection.anchorOffset;\n if (endOffset === null) return null;\n\n const range = document.createRange();\n\n try {\n range.setStart(anchor, offsetWithWhitespaces);\n range.setEnd(anchor, endOffset);\n return range;\n } catch (error) {\n return null;\n }\n}\n\nexport function MentionPlugin() {\n const [editor] = useLexicalComposerContext();\n const room = useRoom();\n\n const [match, setMatch] = useState<RegExpExecArray | null>(null); // Represents the current match of the mention regex. A `null` value means there is no match.\n const matchingString = match?.[3];\n\n const suggestions = useMentionSuggestions(room.id, matchingString);\n const createTextMention = useCreateTextMention();\n const deleteTextMention = useDeleteTextMention();\n\n useEffect(() => {\n function $handleMutation(\n mutations: Map<NodeKey, NodeMutation>,\n {\n prevEditorState,\n }: {\n prevEditorState: EditorState;\n }\n ) {\n for (const [key, mutation] of mutations) {\n if (mutation === \"created\") {\n editor.getEditorState().read(() => {\n const node = $getNodeByKey(key);\n if (node === null) return;\n\n if (!$isMentionNode(node)) return;\n createTextMention(node.getUserId(), node.getId());\n });\n } else if (mutation === \"destroyed\") {\n prevEditorState.read(() => {\n const node = $getNodeByKey(key);\n if (node === null) return;\n\n if (!$isMentionNode(node)) return;\n deleteTextMention(node.getId());\n });\n }\n }\n }\n\n return editor.registerMutationListener(\n MentionNode,\n (mutations, payload) => {\n // Ignore mutations to MentionNode (creation/updates/deletions) that are caused by collaboration (remote users) or history merge.\n if (\n payload.updateTags.has(\"collaboration\") ||\n payload.updateTags.has(\"history-merge\")\n ) {\n return;\n }\n\n $handleMutation(mutations, payload);\n }\n );\n }, [editor, createTextMention, deleteTextMention]);\n\n useEffect(() => {\n function $onStateRead() {\n const text = $getAnchorNodeTextContent();\n if (text === null) {\n setMatch(null);\n return;\n }\n\n const match = MentionRegex.exec(text);\n setMatch(match);\n }\n\n return editor.registerUpdateListener(({ editorState: state }) => {\n state.read($onStateRead);\n });\n }, [editor]);\n\n useEffect(() => {\n function $handleBackspace(event: KeyboardEvent): boolean {\n const selection = $getSelection();\n\n if (selection === null) return false;\n\n // If the selection is a node selection and the only node selected is a mention node, then we replace the mention node with a text node containing \"@\" and set the selection at the end of the text node.\n if ($isNodeSelection(selection)) {\n const nodes = selection.getNodes();\n if (nodes.length !== 1) return false;\n\n const node = nodes[0];\n if (!$isMentionNode(node)) return false;\n\n const text = $createTextNode(\"@\");\n node.replace(text);\n\n const newSelection = $createRangeSelection();\n newSelection.setTextNodeRange(text, 1, text, 1);\n $setSelection(newSelection);\n\n event.preventDefault();\n return true;\n } else if ($isRangeSelection(selection)) {\n if (!selection.isCollapsed()) return false;\n\n const anchor = selection.anchor.getNode();\n const prevSibling = anchor.getPreviousSibling();\n if (selection.anchor.offset === 0 && $isMentionNode(prevSibling)) {\n const text = $createTextNode(\"@\");\n prevSibling.replace(text);\n\n const newSelection = $createRangeSelection();\n newSelection.setTextNodeRange(text, 1, text, 1);\n $setSelection(newSelection);\n\n event.preventDefault();\n return true;\n } else if ($isElementNode(anchor)) {\n const child = anchor.getChildAtIndex(selection.anchor.offset - 1);\n if (!$isMentionNode(child)) return false;\n\n const text = $createTextNode(\"@\");\n child.replace(text);\n\n const newSelection = $createRangeSelection();\n newSelection.setTextNodeRange(text, 1, text, 1);\n $setSelection(newSelection);\n\n event.preventDefault();\n return true;\n }\n\n return false;\n }\n\n return false;\n }\n\n return editor.registerCommand(\n KEY_BACKSPACE_COMMAND,\n $handleBackspace,\n COMMAND_PRIORITY_LOW\n );\n }, [editor]);\n\n const handleValueSelect = useCallback(\n (userId: string) => {\n function $onValueSelect() {\n if (match === null) return;\n\n setMatch(null);\n\n const selection = $getSelection();\n\n if (!$isRangeSelection(selection)) return;\n if (!selection.isCollapsed()) return;\n\n const anchor = selection.anchor;\n if (anchor.type !== \"text\") return;\n\n const anchorNode: TextNode = anchor.getNode();\n if (!anchorNode.isSimpleText()) return;\n\n const selectionOffset = anchor.offset;\n const text = anchorNode.getTextContent().slice(0, selectionOffset);\n\n const characterOffset = match[2].length;\n const queryOffset = getFullMatchOffset(text, match[2], characterOffset);\n const startOffset = selectionOffset - queryOffset;\n if (startOffset < 0) return;\n\n const mentionNode = $createMentionNode(userId);\n\n // Split the anchor (text) node and create a new text node only containing matched text.\n if (startOffset === 0) {\n const [node] = anchorNode.splitText(selectionOffset);\n node.replace(mentionNode);\n } else {\n const [, node] = anchorNode.splitText(startOffset, selectionOffset);\n node.replace(mentionNode);\n }\n }\n\n editor.update($onValueSelect);\n },\n [editor, match]\n );\n\n if (match === null || matchingString === undefined) return null;\n\n if (suggestions === undefined || suggestions.length === 0) return null;\n\n const range = editor.getEditorState().read(() => $getRangeAtMatch(match));\n\n if (range === null) return null;\n\n return createPortal(\n <SuggestionsContext.Provider value={suggestions}>\n <OnValueSelectCallbackContext.Provider value={handleValueSelect}>\n <OnResetMatchCallbackContext.Provider value={() => setMatch(null)}>\n <SuggestionsPortal\n range={range}\n container={document.body}\n key={matchingString}\n >\n <Suggestions.List className=\"lb-lexical-suggestions-list lb-lexical-mention-suggestions-list\">\n {suggestions.map((userId) => (\n <Suggestions.Item\n key={userId}\n value={userId}\n className=\"lb-lexical-suggestions-list-item lb-lexical-mention-suggestion\"\n >\n <Avatar\n userId={userId}\n className=\"lb-lexical-mention-suggestion-avatar\"\n />\n <User\n userId={userId}\n className=\"lb-lexical-mention-suggestion-user\"\n />\n </Suggestions.Item>\n ))}\n </Suggestions.List>\n </SuggestionsPortal>\n </OnResetMatchCallbackContext.Provider>\n </OnValueSelectCallbackContext.Provider>\n </SuggestionsContext.Provider>,\n document.body\n );\n}\n\nexport const SUGGESTIONS_COLLISION_PADDING = 10;\n\nfunction SuggestionsPortal({\n children,\n range,\n container,\n}: {\n children: ReactNode;\n range: Range;\n container: Element;\n}) {\n const {\n refs: { setReference, setFloating },\n strategy,\n x,\n y,\n } = useFloating({\n strategy: \"fixed\",\n placement: \"top-start\",\n middleware: [\n flip({ padding: SUGGESTIONS_COLLISION_PADDING, crossAxis: false }),\n offset(10),\n hide({ padding: SUGGESTIONS_COLLISION_PADDING }),\n shift({ padding: SUGGESTIONS_COLLISION_PADDING, limiter: limitShift() }),\n size({ padding: SUGGESTIONS_COLLISION_PADDING }),\n ],\n whileElementsMounted: (...args) => {\n return autoUpdate(...args, {\n animationFrame: true,\n });\n },\n });\n\n useLayoutEffect(() => {\n setReference({\n getBoundingClientRect: () => range.getBoundingClientRect(),\n });\n }, [setReference, range]);\n\n return createPortal(\n <div\n ref={setFloating}\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 className=\"lb-root lb-portal lb-elevation lb-lexical-suggestions lb-lexical-mention-suggestions\"\n >\n {children}\n </div>,\n container\n );\n}\n"],"names":["offset","match","Suggestions.List","Suggestions.Item"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"mention-plugin.js","sources":["../../src/mentions/mention-plugin.tsx"],"sourcesContent":["import {\n autoUpdate,\n flip,\n hide,\n limitShift,\n offset,\n shift,\n size,\n useFloating,\n} from \"@floating-ui/react-dom\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { assertNever, type MentionData } from \"@liveblocks/core\";\nimport { useRoom } from \"@liveblocks/react\";\nimport {\n useCreateTextMention,\n useDeleteTextMention,\n useLayoutEffect,\n useMentionSuggestions,\n} from \"@liveblocks/react/_private\";\nimport type { EditorState, NodeKey, NodeMutation, TextNode } from \"lexical\";\nimport {\n $createRangeSelection,\n $createTextNode,\n $getNodeByKey,\n $getSelection,\n $isElementNode,\n $isNodeSelection,\n $isRangeSelection,\n $isTextNode,\n $setSelection,\n COMMAND_PRIORITY_LOW,\n KEY_BACKSPACE_COMMAND,\n} from \"lexical\";\nimport type { ReactNode } from \"react\";\nimport { useCallback, useEffect, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\n\nimport { Avatar } from \"./avatar\";\nimport {\n $createMentionNode,\n $isMentionNode,\n MentionNode,\n} from \"./mention-node\";\nimport * as Suggestions from \"./suggestions\";\nimport {\n OnResetMatchCallbackContext,\n OnSuggestionSelectCallbackContext,\n SuggestionsContext,\n} from \"./suggestions\";\nimport { User } from \"./user\";\n\nconst MENTION_TRIGGER = \"@\";\n\nconst PUNCTUATIONS =\n \"\\\\.,\\\\+\\\\*\\\\?\\\\$\\\\@\\\\|#{}\\\\(\\\\)\\\\^\\\\-\\\\[\\\\]\\\\\\\\/!%'\\\"~=<>_:;\";\n\n// Characters we expect to see in a mention (non-space, non-punctuation).\nconst VALID_CHARACTERS = \"[^\" + MENTION_TRIGGER + PUNCTUATIONS + \"\\\\s]\";\n\nconst VALID_JOINS =\n \"(?:\" +\n \"\\\\.[ |$]|\" + // E.g. \"r. \" in \"Mr. Smith\"\n \" |\" + // E.g. \" \" in \"Josh Duck\"\n \"[\" +\n PUNCTUATIONS +\n \"]|\" + // E.g. \"-' in \"Salier-Hellendag\"\n \")\";\n\nconst LENGTH_LIMIT = 75;\n\nconst MentionRegex = new RegExp(\n \"(^|\\\\s|\\\\()(\" +\n \"[\" +\n MENTION_TRIGGER +\n \"]\" +\n \"((?:\" +\n VALID_CHARACTERS +\n VALID_JOINS +\n \"){0,\" +\n LENGTH_LIMIT +\n \"})\" +\n \")$\"\n);\n\nfunction $getAnchorNodeTextContent(): string | null {\n const selection = $getSelection();\n if (!$isRangeSelection(selection)) return null;\n\n const anchor = selection.anchor;\n if (anchor.type !== \"text\") return null;\n const anchorNode = anchor.getNode();\n if (!anchorNode.isSimpleText()) return null;\n const anchorOffset = anchor.offset;\n return anchorNode.getTextContent().slice(0, anchorOffset);\n}\n\n/**\n * Walk backwards along user input and forward through entity title to try and replace more of the user's text with entity.\n */\nfunction getFullMatchOffset(\n documentText: string,\n entryText: string,\n offset: number\n): number {\n let triggerOffset = offset;\n for (let i = triggerOffset; i <= entryText.length; i++) {\n if (documentText.substr(-i) === entryText.substr(0, i)) {\n triggerOffset = i;\n }\n }\n return triggerOffset;\n}\n\nfunction $isCurrentSelectionAtBoundary(offset: number): boolean {\n // If the offset is not zero, i.e. not at the beginning of the text node, the selection is somewhere in the middle of the entity, i.e. not at the boundary.\n if (offset !== 0) return false;\n\n // Othewise (if the offset is zero), it means the selection could be at the start of an entity. It could also be at the end of the previous entity, or it could be in a position where there are no entities at all.\n // So, we check if the previous sibling of the node at the anchor of the selection is a text entity. If it is, then the selection is at the boundary of the entity.\n const selection = $getSelection();\n\n if (!$isRangeSelection(selection)) return false;\n\n const anchor = selection.anchor.getNode();\n const prevSibling = anchor.getPreviousSibling();\n\n if (!$isTextNode(prevSibling)) return false;\n if (!prevSibling.isTextEntity()) return false;\n\n return true;\n}\n\nfunction $getRangeAtMatch(match: RegExpExecArray): globalThis.Range | null {\n const offsetWithWhitespaces = match.index + match[1].length;\n\n if ($isCurrentSelectionAtBoundary(offsetWithWhitespaces)) return null;\n\n const selection = window.getSelection();\n if (selection === null) return null;\n if (!selection.isCollapsed) return null;\n\n const anchor = selection.anchorNode;\n if (anchor === null) return null;\n\n const endOffset = selection.anchorOffset;\n if (endOffset === null) return null;\n\n const range = document.createRange();\n\n try {\n range.setStart(anchor, offsetWithWhitespaces);\n range.setEnd(anchor, endOffset);\n return range;\n } catch (error) {\n return null;\n }\n}\n\nexport function MentionPlugin() {\n const [editor] = useLexicalComposerContext();\n const room = useRoom();\n\n const [match, setMatch] = useState<RegExpExecArray | null>(null); // Represents the current match of the mention regex. A `null` value means there is no match.\n const matchingString = match?.[3];\n\n const suggestions = useMentionSuggestions(room.id, matchingString);\n const createTextMention = useCreateTextMention();\n const deleteTextMention = useDeleteTextMention();\n\n useEffect(() => {\n function $handleMutation(\n mutations: Map<NodeKey, NodeMutation>,\n {\n prevEditorState,\n }: {\n prevEditorState: EditorState;\n }\n ) {\n for (const [key, mutation] of mutations) {\n if (mutation === \"created\") {\n editor.getEditorState().read(() => {\n const node = $getNodeByKey(key);\n if (node === null) return;\n\n if (!$isMentionNode(node)) return;\n createTextMention(node.getUserId(), node.getId());\n });\n } else if (mutation === \"destroyed\") {\n prevEditorState.read(() => {\n const node = $getNodeByKey(key);\n if (node === null) return;\n\n if (!$isMentionNode(node)) return;\n deleteTextMention(node.getId());\n });\n }\n }\n }\n\n return editor.registerMutationListener(\n MentionNode,\n (mutations, payload) => {\n // Ignore mutations to MentionNode (creation/updates/deletions) that are caused by collaboration (remote users) or history merge.\n if (\n payload.updateTags.has(\"collaboration\") ||\n payload.updateTags.has(\"history-merge\")\n ) {\n return;\n }\n\n $handleMutation(mutations, payload);\n }\n );\n }, [editor, createTextMention, deleteTextMention]);\n\n useEffect(() => {\n function $onStateRead() {\n const text = $getAnchorNodeTextContent();\n if (text === null) {\n setMatch(null);\n return;\n }\n\n const match = MentionRegex.exec(text);\n setMatch(match);\n }\n\n return editor.registerUpdateListener(({ editorState: state }) => {\n state.read($onStateRead);\n });\n }, [editor]);\n\n useEffect(() => {\n function $handleBackspace(event: KeyboardEvent): boolean {\n const selection = $getSelection();\n\n if (selection === null) return false;\n\n // If the selection is a node selection and the only node selected is a mention node, then we replace the mention node with a text node containing \"@\" and set the selection at the end of the text node.\n if ($isNodeSelection(selection)) {\n const nodes = selection.getNodes();\n if (nodes.length !== 1) return false;\n\n const node = nodes[0];\n if (!$isMentionNode(node)) return false;\n\n const text = $createTextNode(\"@\");\n node.replace(text);\n\n const newSelection = $createRangeSelection();\n newSelection.setTextNodeRange(text, 1, text, 1);\n $setSelection(newSelection);\n\n event.preventDefault();\n return true;\n } else if ($isRangeSelection(selection)) {\n if (!selection.isCollapsed()) return false;\n\n const anchor = selection.anchor.getNode();\n const prevSibling = anchor.getPreviousSibling();\n if (selection.anchor.offset === 0 && $isMentionNode(prevSibling)) {\n const text = $createTextNode(\"@\");\n prevSibling.replace(text);\n\n const newSelection = $createRangeSelection();\n newSelection.setTextNodeRange(text, 1, text, 1);\n $setSelection(newSelection);\n\n event.preventDefault();\n return true;\n } else if ($isElementNode(anchor)) {\n const child = anchor.getChildAtIndex(selection.anchor.offset - 1);\n if (!$isMentionNode(child)) return false;\n\n const text = $createTextNode(\"@\");\n child.replace(text);\n\n const newSelection = $createRangeSelection();\n newSelection.setTextNodeRange(text, 1, text, 1);\n $setSelection(newSelection);\n\n event.preventDefault();\n return true;\n }\n\n return false;\n }\n\n return false;\n }\n\n return editor.registerCommand(\n KEY_BACKSPACE_COMMAND,\n $handleBackspace,\n COMMAND_PRIORITY_LOW\n );\n }, [editor]);\n\n const handleSuggestionSelect = useCallback(\n (mention: MentionData) => {\n function $onValueSelect() {\n if (match === null) return;\n\n setMatch(null);\n\n const selection = $getSelection();\n\n if (!$isRangeSelection(selection)) return;\n if (!selection.isCollapsed()) return;\n\n const anchor = selection.anchor;\n if (anchor.type !== \"text\") return;\n\n const anchorNode: TextNode = anchor.getNode();\n if (!anchorNode.isSimpleText()) return;\n\n const selectionOffset = anchor.offset;\n const text = anchorNode.getTextContent().slice(0, selectionOffset);\n\n const characterOffset = match[2].length;\n const queryOffset = getFullMatchOffset(text, match[2], characterOffset);\n const startOffset = selectionOffset - queryOffset;\n if (startOffset < 0) return;\n\n let mentionNode: MentionNode;\n\n // Other mention kinds will be different nodes: GroupMentionNode, etc.\n switch (mention.kind) {\n case \"user\":\n mentionNode = $createMentionNode(mention.id);\n break;\n\n default:\n return assertNever(mention.kind, \"Unhandled mention kind\");\n }\n\n // Split the anchor (text) node and create a new text node only containing matched text.\n if (startOffset === 0) {\n const [node] = anchorNode.splitText(selectionOffset);\n node.replace(mentionNode);\n } else {\n const [, node] = anchorNode.splitText(startOffset, selectionOffset);\n node.replace(mentionNode);\n }\n }\n\n editor.update($onValueSelect);\n },\n [editor, match]\n );\n\n if (match === null || matchingString === undefined) return null;\n\n if (suggestions === undefined || suggestions.length === 0) return null;\n\n const range = editor.getEditorState().read(() => $getRangeAtMatch(match));\n\n if (range === null) return null;\n\n return createPortal(\n <SuggestionsContext.Provider value={suggestions}>\n <OnSuggestionSelectCallbackContext.Provider\n value={handleSuggestionSelect}\n >\n <OnResetMatchCallbackContext.Provider value={() => setMatch(null)}>\n <SuggestionsPortal\n range={range}\n container={document.body}\n key={matchingString}\n >\n <Suggestions.List className=\"lb-lexical-suggestions-list lb-lexical-mention-suggestions-list\">\n {suggestions.map((mention) => {\n switch (mention.kind) {\n case \"user\":\n return (\n <Suggestions.Item\n key={mention.id}\n value={mention.id}\n className=\"lb-lexical-suggestions-list-item lb-lexical-mention-suggestion\"\n >\n <Avatar\n userId={mention.id}\n className=\"lb-lexical-mention-suggestion-avatar\"\n />\n <User\n userId={mention.id}\n className=\"lb-lexical-mention-suggestion-user\"\n />\n </Suggestions.Item>\n );\n\n default:\n return assertNever(mention.kind, \"Unhandled mention kind\");\n }\n })}\n </Suggestions.List>\n </SuggestionsPortal>\n </OnResetMatchCallbackContext.Provider>\n </OnSuggestionSelectCallbackContext.Provider>\n </SuggestionsContext.Provider>,\n document.body\n );\n}\n\nexport const SUGGESTIONS_COLLISION_PADDING = 10;\n\nfunction SuggestionsPortal({\n children,\n range,\n container,\n}: {\n children: ReactNode;\n range: Range;\n container: Element;\n}) {\n const {\n refs: { setReference, setFloating },\n strategy,\n x,\n y,\n } = useFloating({\n strategy: \"fixed\",\n placement: \"top-start\",\n middleware: [\n flip({ padding: SUGGESTIONS_COLLISION_PADDING, crossAxis: false }),\n offset(10),\n hide({ padding: SUGGESTIONS_COLLISION_PADDING }),\n shift({ padding: SUGGESTIONS_COLLISION_PADDING, limiter: limitShift() }),\n size({ padding: SUGGESTIONS_COLLISION_PADDING }),\n ],\n whileElementsMounted: (...args) => {\n return autoUpdate(...args, {\n animationFrame: true,\n });\n },\n });\n\n useLayoutEffect(() => {\n setReference({\n getBoundingClientRect: () => range.getBoundingClientRect(),\n });\n }, [setReference, range]);\n\n return createPortal(\n <div\n ref={setFloating}\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 className=\"lb-root lb-portal lb-elevation lb-lexical-suggestions lb-lexical-mention-suggestions\"\n >\n {children}\n </div>,\n container\n );\n}\n"],"names":["offset","match","Suggestions.List","Suggestions.Item"],"mappings":"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"}
|
|
@@ -6,7 +6,7 @@ var lexical = require('lexical');
|
|
|
6
6
|
var react = require('react');
|
|
7
7
|
|
|
8
8
|
const SuggestionsContext = react.createContext(null);
|
|
9
|
-
const
|
|
9
|
+
const OnSuggestionSelectCallbackContext = react.createContext(null);
|
|
10
10
|
const OnResetMatchCallbackContext = react.createContext(
|
|
11
11
|
null
|
|
12
12
|
);
|
|
@@ -16,16 +16,16 @@ const List = react.forwardRef(
|
|
|
16
16
|
const { children, ...divProps } = props;
|
|
17
17
|
const [editor] = LexicalComposerContext.useLexicalComposerContext();
|
|
18
18
|
const [highlightedIndex, setHighlightedIndex] = react.useState(0);
|
|
19
|
-
const
|
|
20
|
-
const
|
|
19
|
+
const suggestions = useSuggestions();
|
|
20
|
+
const onSuggestionSelect = useOnSuggestionSelectCallback();
|
|
21
21
|
const onEscapeKeyDown = useOnResetMatchCallback();
|
|
22
22
|
react.useEffect(() => {
|
|
23
23
|
function onKeyArrowDown(event) {
|
|
24
|
-
if (
|
|
24
|
+
if (suggestions.length === 0)
|
|
25
25
|
return true;
|
|
26
26
|
if (highlightedIndex === null)
|
|
27
27
|
return true;
|
|
28
|
-
const nextIndex = highlightedIndex ===
|
|
28
|
+
const nextIndex = highlightedIndex === suggestions.length - 1 ? 0 : highlightedIndex + 1;
|
|
29
29
|
setHighlightedIndex(nextIndex);
|
|
30
30
|
event.preventDefault();
|
|
31
31
|
event.stopImmediatePropagation();
|
|
@@ -36,14 +36,14 @@ const List = react.forwardRef(
|
|
|
36
36
|
onKeyArrowDown,
|
|
37
37
|
lexical.COMMAND_PRIORITY_LOW
|
|
38
38
|
);
|
|
39
|
-
}, [editor, highlightedIndex,
|
|
39
|
+
}, [editor, highlightedIndex, suggestions]);
|
|
40
40
|
react.useEffect(() => {
|
|
41
41
|
function onKeyArrowUp(event) {
|
|
42
|
-
if (
|
|
42
|
+
if (suggestions.length === 0)
|
|
43
43
|
return true;
|
|
44
44
|
if (highlightedIndex === null)
|
|
45
45
|
return true;
|
|
46
|
-
const nextIndex = highlightedIndex === 0 ?
|
|
46
|
+
const nextIndex = highlightedIndex === 0 ? suggestions.length - 1 : highlightedIndex - 1;
|
|
47
47
|
setHighlightedIndex(nextIndex);
|
|
48
48
|
event.preventDefault();
|
|
49
49
|
event.stopImmediatePropagation();
|
|
@@ -54,7 +54,7 @@ const List = react.forwardRef(
|
|
|
54
54
|
onKeyArrowUp,
|
|
55
55
|
lexical.COMMAND_PRIORITY_LOW
|
|
56
56
|
);
|
|
57
|
-
}, [editor, highlightedIndex,
|
|
57
|
+
}, [editor, highlightedIndex, suggestions]);
|
|
58
58
|
react.useEffect(() => {
|
|
59
59
|
function onKeyEscape(event) {
|
|
60
60
|
event.preventDefault();
|
|
@@ -70,9 +70,9 @@ const List = react.forwardRef(
|
|
|
70
70
|
}, [editor, onEscapeKeyDown]);
|
|
71
71
|
react.useEffect(() => {
|
|
72
72
|
function onKeyEnter(event) {
|
|
73
|
-
if (
|
|
73
|
+
if (suggestions.length === 0)
|
|
74
74
|
return true;
|
|
75
|
-
|
|
75
|
+
onSuggestionSelect(suggestions[highlightedIndex]);
|
|
76
76
|
if (event === null)
|
|
77
77
|
return true;
|
|
78
78
|
event.preventDefault();
|
|
@@ -84,7 +84,7 @@ const List = react.forwardRef(
|
|
|
84
84
|
onKeyEnter,
|
|
85
85
|
lexical.COMMAND_PRIORITY_LOW
|
|
86
86
|
);
|
|
87
|
-
}, [editor,
|
|
87
|
+
}, [editor, onSuggestionSelect, highlightedIndex, suggestions]);
|
|
88
88
|
react.useEffect(() => {
|
|
89
89
|
const root = editor.getRootElement();
|
|
90
90
|
if (root === null)
|
|
@@ -114,8 +114,8 @@ const Item = react.forwardRef(
|
|
|
114
114
|
const divRef = react.useRef(null);
|
|
115
115
|
const [highlightedIndex, setHighlightedIndex] = useHighlightedIndex();
|
|
116
116
|
const suggestions = useSuggestions();
|
|
117
|
-
const
|
|
118
|
-
const isHighlighted = suggestions[highlightedIndex] === value;
|
|
117
|
+
const onSuggestionSelect = useOnSuggestionSelectCallback();
|
|
118
|
+
const isHighlighted = suggestions[highlightedIndex].id === value;
|
|
119
119
|
react.useImperativeHandle(
|
|
120
120
|
forwardedRef,
|
|
121
121
|
() => divRef.current
|
|
@@ -132,7 +132,9 @@ const Item = react.forwardRef(
|
|
|
132
132
|
onMouseEnter?.(event);
|
|
133
133
|
if (event.isDefaultPrevented())
|
|
134
134
|
return;
|
|
135
|
-
const index = suggestions.
|
|
135
|
+
const index = suggestions.findIndex(
|
|
136
|
+
(suggestion) => suggestion.id === value
|
|
137
|
+
);
|
|
136
138
|
if (index === -1)
|
|
137
139
|
return;
|
|
138
140
|
setHighlightedIndex(index);
|
|
@@ -141,7 +143,7 @@ const Item = react.forwardRef(
|
|
|
141
143
|
onClick?.(event);
|
|
142
144
|
if (event.isDefaultPrevented())
|
|
143
145
|
return;
|
|
144
|
-
|
|
146
|
+
onSuggestionSelect(suggestions[highlightedIndex]);
|
|
145
147
|
}
|
|
146
148
|
return /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
147
149
|
role: "option",
|
|
@@ -170,12 +172,14 @@ function useSuggestions() {
|
|
|
170
172
|
}
|
|
171
173
|
return suggestions;
|
|
172
174
|
}
|
|
173
|
-
function
|
|
174
|
-
const
|
|
175
|
-
if (
|
|
176
|
-
throw new Error(
|
|
175
|
+
function useOnSuggestionSelectCallback() {
|
|
176
|
+
const onSuggestionSelect = react.useContext(OnSuggestionSelectCallbackContext);
|
|
177
|
+
if (onSuggestionSelect === null) {
|
|
178
|
+
throw new Error(
|
|
179
|
+
"useOnSuggestionSelectCallback: OnSuggestionSelectContext not found"
|
|
180
|
+
);
|
|
177
181
|
}
|
|
178
|
-
return
|
|
182
|
+
return onSuggestionSelect;
|
|
179
183
|
}
|
|
180
184
|
function useOnResetMatchCallback() {
|
|
181
185
|
const onResetMatch = react.useContext(OnResetMatchCallbackContext);
|
|
@@ -188,6 +192,6 @@ function useOnResetMatchCallback() {
|
|
|
188
192
|
exports.Item = Item;
|
|
189
193
|
exports.List = List;
|
|
190
194
|
exports.OnResetMatchCallbackContext = OnResetMatchCallbackContext;
|
|
191
|
-
exports.
|
|
195
|
+
exports.OnSuggestionSelectCallbackContext = OnSuggestionSelectCallbackContext;
|
|
192
196
|
exports.SuggestionsContext = SuggestionsContext;
|
|
193
197
|
//# sourceMappingURL=suggestions.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"suggestions.cjs","sources":["../../src/mentions/suggestions.tsx"],"sourcesContent":["import { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport {\n COMMAND_PRIORITY_LOW,\n KEY_ARROW_DOWN_COMMAND,\n KEY_ARROW_UP_COMMAND,\n KEY_ENTER_COMMAND,\n KEY_ESCAPE_COMMAND,\n} from \"lexical\";\nimport type {\n Dispatch,\n HTMLAttributes,\n MouseEvent,\n ReactNode,\n SetStateAction,\n} from \"react\";\nimport {\n createContext,\n forwardRef,\n useContext,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from \"react\";\n\nexport const SuggestionsContext = createContext<string[] | null>(null);\n\nexport const OnValueSelectCallbackContext = createContext<\n ((value: string) => void) | null\n>(null);\n\nexport const OnResetMatchCallbackContext = createContext<(() => void) | null>(\n null\n);\n\nconst HighlightedIndexContext = createContext<\n [number, Dispatch<SetStateAction<number>>] | null\n>(null);\n\nexport interface ListProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n}\n\nconst List = forwardRef<HTMLDivElement, ListProps>(\n function (props, forwardedRef) {\n const { children, ...divProps } = props;\n const [editor] = useLexicalComposerContext();\n const [highlightedIndex, setHighlightedIndex] = useState(0);\n const values = useSuggestions();\n const onValueSelect = useOnValueSelectCallback();\n const onEscapeKeyDown = useOnResetMatchCallback();\n\n useEffect(() => {\n function onKeyArrowDown(event: KeyboardEvent): boolean {\n if (values.length === 0) return true;\n if (highlightedIndex === null) return true;\n\n // If the highlighted index is at the last suggestion, then we loop back to the first suggestion, otherwise we increment the index.\n const nextIndex =\n highlightedIndex === values.length - 1 ? 0 : highlightedIndex + 1;\n setHighlightedIndex(nextIndex);\n\n event.preventDefault();\n event.stopImmediatePropagation();\n\n return true;\n }\n\n return editor.registerCommand(\n KEY_ARROW_DOWN_COMMAND,\n onKeyArrowDown,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, highlightedIndex, values]);\n\n useEffect(() => {\n function onKeyArrowUp(event: KeyboardEvent): boolean {\n if (values.length === 0) return true;\n if (highlightedIndex === null) return true;\n\n // If the highlighted index is at the first suggestion, then we loop back to the last suggestion, otherwise we decrement the index.\n const nextIndex =\n highlightedIndex === 0 ? values.length - 1 : highlightedIndex - 1;\n setHighlightedIndex(nextIndex);\n\n event.preventDefault();\n event.stopImmediatePropagation();\n return true;\n }\n\n return editor.registerCommand(\n KEY_ARROW_UP_COMMAND,\n onKeyArrowUp,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, highlightedIndex, values]);\n\n useEffect(() => {\n function onKeyEscape(event: KeyboardEvent): boolean {\n event.preventDefault();\n event.stopImmediatePropagation();\n\n onEscapeKeyDown();\n return true;\n }\n\n return editor.registerCommand<KeyboardEvent>(\n KEY_ESCAPE_COMMAND,\n onKeyEscape,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, onEscapeKeyDown]);\n\n useEffect(() => {\n function onKeyEnter(event: KeyboardEvent | null): boolean {\n if (values.length === 0) return true;\n\n onValueSelect(values[highlightedIndex]);\n\n if (event === null) return true;\n\n event.preventDefault();\n event.stopImmediatePropagation();\n return true;\n }\n\n return editor.registerCommand(\n KEY_ENTER_COMMAND,\n onKeyEnter,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, onValueSelect, highlightedIndex, values]);\n\n useEffect(() => {\n const root = editor.getRootElement();\n if (root === null) return;\n\n root.setAttribute(\n \"aria-activedescendant\",\n `typeahead-item-${highlightedIndex}`\n );\n\n return () => {\n root.removeAttribute(\"aria-activedescendant\");\n };\n }, [editor, highlightedIndex]);\n\n return (\n <HighlightedIndexContext.Provider\n value={[highlightedIndex, setHighlightedIndex]}\n >\n <div role=\"listbox\" {...divProps} ref={forwardedRef}>\n {children}\n </div>\n </HighlightedIndexContext.Provider>\n );\n }\n);\n\ninterface ItemProps extends HTMLAttributes<HTMLDivElement> {\n value: string;\n}\n\nconst Item = forwardRef<HTMLDivElement | null, ItemProps>(\n function Item(props, forwardedRef) {\n const { children, value, onMouseEnter, onClick, ...divProps } = props;\n const divRef = useRef<HTMLDivElement>(null);\n\n const [highlightedIndex, setHighlightedIndex] = useHighlightedIndex();\n const suggestions = useSuggestions();\n const onValueSelect = useOnValueSelectCallback();\n\n const isHighlighted = suggestions[highlightedIndex] === value;\n\n useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(\n forwardedRef,\n () => divRef.current\n );\n\n useEffect(() => {\n if (!isHighlighted) return;\n\n const div = divRef.current;\n if (div === null) return;\n\n div.scrollIntoView({ block: \"nearest\" });\n }, [isHighlighted]);\n\n function handleMouseEnter(event: MouseEvent<HTMLDivElement>) {\n onMouseEnter?.(event);\n\n if (event.isDefaultPrevented()) return;\n\n const index = suggestions.indexOf(value);\n if (index === -1) return;\n\n setHighlightedIndex(index);\n }\n\n function handleClick(event: MouseEvent<HTMLDivElement>) {\n onClick?.(event);\n\n if (event.isDefaultPrevented()) return;\n\n onValueSelect(value);\n }\n\n return (\n <div\n role=\"option\"\n data-highlighted={isHighlighted || undefined}\n onMouseEnter={handleMouseEnter}\n onClick={handleClick}\n {...divProps}\n ref={divRef}\n >\n {children}\n </div>\n );\n }\n);\n\nfunction useHighlightedIndex(): [number, Dispatch<SetStateAction<number>>] {\n const context = useContext(HighlightedIndexContext);\n if (context === null) {\n throw new Error(\n \"useHighlightedIndex must be used within a HighlightedIndexProvider\"\n );\n }\n return context;\n}\n\nfunction useSuggestions(): string[] {\n const suggestions = useContext(SuggestionsContext);\n if (suggestions === null) {\n throw new Error(\"useSuggestions: SuggestionsContext not found\");\n }\n\n return suggestions;\n}\n\nfunction useOnValueSelectCallback(): (value: string) => void {\n const onValueSelect = useContext(OnValueSelectCallbackContext);\n if (onValueSelect === null) {\n throw new Error(\"useOnValueSelectCallback: OnValueSelectContext not found\");\n }\n\n return onValueSelect;\n}\n\nfunction useOnResetMatchCallback(): () => void {\n const onResetMatch = useContext(OnResetMatchCallbackContext);\n if (onResetMatch === null) {\n throw new Error(\"useOnResetMatchCallback: OnResetMatchContext not found\");\n }\n\n return onResetMatch;\n}\n\nexport { Item, List };\n"],"names":["createContext","forwardRef","useLexicalComposerContext","useState","useEffect","KEY_ARROW_DOWN_COMMAND","COMMAND_PRIORITY_LOW","KEY_ARROW_UP_COMMAND","KEY_ESCAPE_COMMAND","KEY_ENTER_COMMAND","jsx","Item","useRef","useImperativeHandle","useContext"],"mappings":";;;;;;;AAyBa,MAAA,kBAAA,GAAqBA,oBAA+B,IAAI,EAAA;AAExD,MAAA,4BAAA,GAA+BA,oBAE1C,IAAI,EAAA;AAEC,MAAM,2BAA8B,GAAAA,mBAAA;AAAA,EACzC,IAAA;AACF,EAAA;AAEA,MAAM,uBAAA,GAA0BA,oBAE9B,IAAI,CAAA,CAAA;AAMN,MAAM,IAAO,GAAAC,gBAAA;AAAA,EACX,SAAU,OAAO,YAAc,EAAA;AAC7B,IAAM,MAAA,EAAE,QAAa,EAAA,GAAA,QAAA,EAAa,GAAA,KAAA,CAAA;AAClC,IAAM,MAAA,CAAC,MAAM,CAAA,GAAIC,gDAA0B,EAAA,CAAA;AAC3C,IAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAIC,eAAS,CAAC,CAAA,CAAA;AAC1D,IAAA,MAAM,SAAS,cAAe,EAAA,CAAA;AAC9B,IAAA,MAAM,gBAAgB,wBAAyB,EAAA,CAAA;AAC/C,IAAA,MAAM,kBAAkB,uBAAwB,EAAA,CAAA;AAEhD,IAAAC,eAAA,CAAU,MAAM;AACd,MAAA,SAAS,eAAe,KAA+B,EAAA;AACrD,QAAA,IAAI,OAAO,MAAW,KAAA,CAAA;AAAG,UAAO,OAAA,IAAA,CAAA;AAChC,QAAA,IAAI,gBAAqB,KAAA,IAAA;AAAM,UAAO,OAAA,IAAA,CAAA;AAGtC,QAAA,MAAM,YACJ,gBAAqB,KAAA,MAAA,CAAO,MAAS,GAAA,CAAA,GAAI,IAAI,gBAAmB,GAAA,CAAA,CAAA;AAClE,QAAA,mBAAA,CAAoB,SAAS,CAAA,CAAA;AAE7B,QAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,QAAA,KAAA,CAAM,wBAAyB,EAAA,CAAA;AAE/B,QAAO,OAAA,IAAA,CAAA;AAAA,OACT;AAEA,MAAA,OAAO,MAAO,CAAA,eAAA;AAAA,QACZC,8BAAA;AAAA,QACA,cAAA;AAAA,QACAC,4BAAA;AAAA,OACF,CAAA;AAAA,KACC,EAAA,CAAC,MAAQ,EAAA,gBAAA,EAAkB,MAAM,CAAC,CAAA,CAAA;AAErC,IAAAF,eAAA,CAAU,MAAM;AACd,MAAA,SAAS,aAAa,KAA+B,EAAA;AACnD,QAAA,IAAI,OAAO,MAAW,KAAA,CAAA;AAAG,UAAO,OAAA,IAAA,CAAA;AAChC,QAAA,IAAI,gBAAqB,KAAA,IAAA;AAAM,UAAO,OAAA,IAAA,CAAA;AAGtC,QAAA,MAAM,YACJ,gBAAqB,KAAA,CAAA,GAAI,MAAO,CAAA,MAAA,GAAS,IAAI,gBAAmB,GAAA,CAAA,CAAA;AAClE,QAAA,mBAAA,CAAoB,SAAS,CAAA,CAAA;AAE7B,QAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,QAAA,KAAA,CAAM,wBAAyB,EAAA,CAAA;AAC/B,QAAO,OAAA,IAAA,CAAA;AAAA,OACT;AAEA,MAAA,OAAO,MAAO,CAAA,eAAA;AAAA,QACZG,4BAAA;AAAA,QACA,YAAA;AAAA,QACAD,4BAAA;AAAA,OACF,CAAA;AAAA,KACC,EAAA,CAAC,MAAQ,EAAA,gBAAA,EAAkB,MAAM,CAAC,CAAA,CAAA;AAErC,IAAAF,eAAA,CAAU,MAAM;AACd,MAAA,SAAS,YAAY,KAA+B,EAAA;AAClD,QAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,QAAA,KAAA,CAAM,wBAAyB,EAAA,CAAA;AAE/B,QAAgB,eAAA,EAAA,CAAA;AAChB,QAAO,OAAA,IAAA,CAAA;AAAA,OACT;AAEA,MAAA,OAAO,MAAO,CAAA,eAAA;AAAA,QACZI,0BAAA;AAAA,QACA,WAAA;AAAA,QACAF,4BAAA;AAAA,OACF,CAAA;AAAA,KACC,EAAA,CAAC,MAAQ,EAAA,eAAe,CAAC,CAAA,CAAA;AAE5B,IAAAF,eAAA,CAAU,MAAM;AACd,MAAA,SAAS,WAAW,KAAsC,EAAA;AACxD,QAAA,IAAI,OAAO,MAAW,KAAA,CAAA;AAAG,UAAO,OAAA,IAAA,CAAA;AAEhC,QAAA,aAAA,CAAc,OAAO,gBAAiB,CAAA,CAAA,CAAA;AAEtC,QAAA,IAAI,KAAU,KAAA,IAAA;AAAM,UAAO,OAAA,IAAA,CAAA;AAE3B,QAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,QAAA,KAAA,CAAM,wBAAyB,EAAA,CAAA;AAC/B,QAAO,OAAA,IAAA,CAAA;AAAA,OACT;AAEA,MAAA,OAAO,MAAO,CAAA,eAAA;AAAA,QACZK,yBAAA;AAAA,QACA,UAAA;AAAA,QACAH,4BAAA;AAAA,OACF,CAAA;AAAA,OACC,CAAC,MAAA,EAAQ,aAAe,EAAA,gBAAA,EAAkB,MAAM,CAAC,CAAA,CAAA;AAEpD,IAAAF,eAAA,CAAU,MAAM;AACd,MAAM,MAAA,IAAA,GAAO,OAAO,cAAe,EAAA,CAAA;AACnC,MAAA,IAAI,IAAS,KAAA,IAAA;AAAM,QAAA,OAAA;AAEnB,MAAK,IAAA,CAAA,YAAA;AAAA,QACH,uBAAA;AAAA,QACA,CAAkB,eAAA,EAAA,gBAAA,CAAA,CAAA;AAAA,OACpB,CAAA;AAEA,MAAA,OAAO,MAAM;AACX,QAAA,IAAA,CAAK,gBAAgB,uBAAuB,CAAA,CAAA;AAAA,OAC9C,CAAA;AAAA,KACC,EAAA,CAAC,MAAQ,EAAA,gBAAgB,CAAC,CAAA,CAAA;AAE7B,IACE,uBAAAM,cAAA,CAAC,wBAAwB,QAAxB,EAAA;AAAA,MACC,KAAA,EAAO,CAAC,gBAAA,EAAkB,mBAAmB,CAAA;AAAA,MAE7C,QAAC,kBAAAA,cAAA,CAAA,KAAA,EAAA;AAAA,QAAI,IAAK,EAAA,SAAA;AAAA,QAAW,GAAG,QAAA;AAAA,QAAU,GAAK,EAAA,YAAA;AAAA,QACpC,QAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAMA,MAAM,IAAO,GAAAT,gBAAA;AAAA,EACX,SAASU,KAAK,CAAA,KAAA,EAAO,YAAc,EAAA;AACjC,IAAA,MAAM,EAAE,QAAU,EAAA,KAAA,EAAO,YAAc,EAAA,OAAA,EAAA,GAAY,UAAa,GAAA,KAAA,CAAA;AAChE,IAAM,MAAA,MAAA,GAASC,aAAuB,IAAI,CAAA,CAAA;AAE1C,IAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAI,mBAAoB,EAAA,CAAA;AACpE,IAAA,MAAM,cAAc,cAAe,EAAA,CAAA;AACnC,IAAA,MAAM,gBAAgB,wBAAyB,EAAA,CAAA;AAE/C,IAAM,MAAA,aAAA,GAAgB,YAAY,gBAAsB,CAAA,KAAA,KAAA,CAAA;AAExD,IAAAC,yBAAA;AAAA,MACE,YAAA;AAAA,MACA,MAAM,MAAO,CAAA,OAAA;AAAA,KACf,CAAA;AAEA,IAAAT,eAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,aAAA;AAAe,QAAA,OAAA;AAEpB,MAAA,MAAM,MAAM,MAAO,CAAA,OAAA,CAAA;AACnB,MAAA,IAAI,GAAQ,KAAA,IAAA;AAAM,QAAA,OAAA;AAElB,MAAA,GAAA,CAAI,cAAe,CAAA,EAAE,KAAO,EAAA,SAAA,EAAW,CAAA,CAAA;AAAA,KACzC,EAAG,CAAC,aAAa,CAAC,CAAA,CAAA;AAElB,IAAA,SAAS,iBAAiB,KAAmC,EAAA;AAC3D,MAAA,YAAA,GAAe,KAAK,CAAA,CAAA;AAEpB,MAAA,IAAI,MAAM,kBAAmB,EAAA;AAAG,QAAA,OAAA;AAEhC,MAAM,MAAA,KAAA,GAAQ,WAAY,CAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AACvC,MAAA,IAAI,KAAU,KAAA,CAAA,CAAA;AAAI,QAAA,OAAA;AAElB,MAAA,mBAAA,CAAoB,KAAK,CAAA,CAAA;AAAA,KAC3B;AAEA,IAAA,SAAS,YAAY,KAAmC,EAAA;AACtD,MAAA,OAAA,GAAU,KAAK,CAAA,CAAA;AAEf,MAAA,IAAI,MAAM,kBAAmB,EAAA;AAAG,QAAA,OAAA;AAEhC,MAAA,aAAA,CAAc,KAAK,CAAA,CAAA;AAAA,KACrB;AAEA,IAAA,uBACGM,cAAA,CAAA,KAAA,EAAA;AAAA,MACC,IAAK,EAAA,QAAA;AAAA,MACL,oBAAkB,aAAiB,IAAA,KAAA,CAAA;AAAA,MACnC,YAAc,EAAA,gBAAA;AAAA,MACd,OAAS,EAAA,WAAA;AAAA,MACR,GAAG,QAAA;AAAA,MACJ,GAAK,EAAA,MAAA;AAAA,MAEJ,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAEA,SAAS,mBAAkE,GAAA;AACzE,EAAM,MAAA,OAAA,GAAUI,iBAAW,uBAAuB,CAAA,CAAA;AAClD,EAAA,IAAI,YAAY,IAAM,EAAA;AACpB,IAAA,MAAM,IAAI,KAAA;AAAA,MACR,oEAAA;AAAA,KACF,CAAA;AAAA,GACF;AACA,EAAO,OAAA,OAAA,CAAA;AACT,CAAA;AAEA,SAAS,cAA2B,GAAA;AAClC,EAAM,MAAA,WAAA,GAAcA,iBAAW,kBAAkB,CAAA,CAAA;AACjD,EAAA,IAAI,gBAAgB,IAAM,EAAA;AACxB,IAAM,MAAA,IAAI,MAAM,8CAA8C,CAAA,CAAA;AAAA,GAChE;AAEA,EAAO,OAAA,WAAA,CAAA;AACT,CAAA;AAEA,SAAS,wBAAoD,GAAA;AAC3D,EAAM,MAAA,aAAA,GAAgBA,iBAAW,4BAA4B,CAAA,CAAA;AAC7D,EAAA,IAAI,kBAAkB,IAAM,EAAA;AAC1B,IAAM,MAAA,IAAI,MAAM,0DAA0D,CAAA,CAAA;AAAA,GAC5E;AAEA,EAAO,OAAA,aAAA,CAAA;AACT,CAAA;AAEA,SAAS,uBAAsC,GAAA;AAC7C,EAAM,MAAA,YAAA,GAAeA,iBAAW,2BAA2B,CAAA,CAAA;AAC3D,EAAA,IAAI,iBAAiB,IAAM,EAAA;AACzB,IAAM,MAAA,IAAI,MAAM,wDAAwD,CAAA,CAAA;AAAA,GAC1E;AAEA,EAAO,OAAA,YAAA,CAAA;AACT;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"suggestions.cjs","sources":["../../src/mentions/suggestions.tsx"],"sourcesContent":["import { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport type { MentionData } from \"@liveblocks/core\";\nimport {\n COMMAND_PRIORITY_LOW,\n KEY_ARROW_DOWN_COMMAND,\n KEY_ARROW_UP_COMMAND,\n KEY_ENTER_COMMAND,\n KEY_ESCAPE_COMMAND,\n} from \"lexical\";\nimport type {\n Dispatch,\n HTMLAttributes,\n MouseEvent,\n ReactNode,\n SetStateAction,\n} from \"react\";\nimport {\n createContext,\n forwardRef,\n useContext,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from \"react\";\n\nexport const SuggestionsContext = createContext<MentionData[] | null>(null);\n\nexport const OnSuggestionSelectCallbackContext = createContext<\n ((mention: MentionData) => void) | null\n>(null);\n\nexport const OnResetMatchCallbackContext = createContext<(() => void) | null>(\n null\n);\n\nconst HighlightedIndexContext = createContext<\n [number, Dispatch<SetStateAction<number>>] | null\n>(null);\n\nexport interface ListProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n}\n\nconst List = forwardRef<HTMLDivElement, ListProps>(\n function (props, forwardedRef) {\n const { children, ...divProps } = props;\n const [editor] = useLexicalComposerContext();\n const [highlightedIndex, setHighlightedIndex] = useState(0);\n const suggestions = useSuggestions();\n const onSuggestionSelect = useOnSuggestionSelectCallback();\n const onEscapeKeyDown = useOnResetMatchCallback();\n\n useEffect(() => {\n function onKeyArrowDown(event: KeyboardEvent): boolean {\n if (suggestions.length === 0) return true;\n if (highlightedIndex === null) return true;\n\n // If the highlighted index is at the last suggestion, then we loop back to the first suggestion, otherwise we increment the index.\n const nextIndex =\n highlightedIndex === suggestions.length - 1\n ? 0\n : highlightedIndex + 1;\n setHighlightedIndex(nextIndex);\n\n event.preventDefault();\n event.stopImmediatePropagation();\n\n return true;\n }\n\n return editor.registerCommand(\n KEY_ARROW_DOWN_COMMAND,\n onKeyArrowDown,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, highlightedIndex, suggestions]);\n\n useEffect(() => {\n function onKeyArrowUp(event: KeyboardEvent): boolean {\n if (suggestions.length === 0) return true;\n if (highlightedIndex === null) return true;\n\n // If the highlighted index is at the first suggestion, then we loop back to the last suggestion, otherwise we decrement the index.\n const nextIndex =\n highlightedIndex === 0\n ? suggestions.length - 1\n : highlightedIndex - 1;\n setHighlightedIndex(nextIndex);\n\n event.preventDefault();\n event.stopImmediatePropagation();\n return true;\n }\n\n return editor.registerCommand(\n KEY_ARROW_UP_COMMAND,\n onKeyArrowUp,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, highlightedIndex, suggestions]);\n\n useEffect(() => {\n function onKeyEscape(event: KeyboardEvent): boolean {\n event.preventDefault();\n event.stopImmediatePropagation();\n\n onEscapeKeyDown();\n return true;\n }\n\n return editor.registerCommand<KeyboardEvent>(\n KEY_ESCAPE_COMMAND,\n onKeyEscape,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, onEscapeKeyDown]);\n\n useEffect(() => {\n function onKeyEnter(event: KeyboardEvent | null): boolean {\n if (suggestions.length === 0) return true;\n\n onSuggestionSelect(suggestions[highlightedIndex]);\n\n if (event === null) return true;\n\n event.preventDefault();\n event.stopImmediatePropagation();\n return true;\n }\n\n return editor.registerCommand(\n KEY_ENTER_COMMAND,\n onKeyEnter,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, onSuggestionSelect, highlightedIndex, suggestions]);\n\n useEffect(() => {\n const root = editor.getRootElement();\n if (root === null) return;\n\n root.setAttribute(\n \"aria-activedescendant\",\n `typeahead-item-${highlightedIndex}`\n );\n\n return () => {\n root.removeAttribute(\"aria-activedescendant\");\n };\n }, [editor, highlightedIndex]);\n\n return (\n <HighlightedIndexContext.Provider\n value={[highlightedIndex, setHighlightedIndex]}\n >\n <div role=\"listbox\" {...divProps} ref={forwardedRef}>\n {children}\n </div>\n </HighlightedIndexContext.Provider>\n );\n }\n);\n\ninterface ItemProps extends HTMLAttributes<HTMLDivElement> {\n value: string;\n}\n\nconst Item = forwardRef<HTMLDivElement | null, ItemProps>(\n function Item(props, forwardedRef) {\n const { children, value, onMouseEnter, onClick, ...divProps } = props;\n const divRef = useRef<HTMLDivElement>(null);\n\n const [highlightedIndex, setHighlightedIndex] = useHighlightedIndex();\n const suggestions = useSuggestions();\n const onSuggestionSelect = useOnSuggestionSelectCallback();\n\n const isHighlighted = suggestions[highlightedIndex].id === value;\n\n useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(\n forwardedRef,\n () => divRef.current\n );\n\n useEffect(() => {\n if (!isHighlighted) return;\n\n const div = divRef.current;\n if (div === null) return;\n\n div.scrollIntoView({ block: \"nearest\" });\n }, [isHighlighted]);\n\n function handleMouseEnter(event: MouseEvent<HTMLDivElement>) {\n onMouseEnter?.(event);\n\n if (event.isDefaultPrevented()) return;\n\n const index = suggestions.findIndex(\n (suggestion) => suggestion.id === value\n );\n if (index === -1) return;\n\n setHighlightedIndex(index);\n }\n\n function handleClick(event: MouseEvent<HTMLDivElement>) {\n onClick?.(event);\n\n if (event.isDefaultPrevented()) return;\n\n onSuggestionSelect(suggestions[highlightedIndex]);\n }\n\n return (\n <div\n role=\"option\"\n data-highlighted={isHighlighted || undefined}\n onMouseEnter={handleMouseEnter}\n onClick={handleClick}\n {...divProps}\n ref={divRef}\n >\n {children}\n </div>\n );\n }\n);\n\nfunction useHighlightedIndex(): [number, Dispatch<SetStateAction<number>>] {\n const context = useContext(HighlightedIndexContext);\n if (context === null) {\n throw new Error(\n \"useHighlightedIndex must be used within a HighlightedIndexProvider\"\n );\n }\n return context;\n}\n\nfunction useSuggestions(): MentionData[] {\n const suggestions = useContext(SuggestionsContext);\n if (suggestions === null) {\n throw new Error(\"useSuggestions: SuggestionsContext not found\");\n }\n\n return suggestions;\n}\n\nfunction useOnSuggestionSelectCallback(): (mention: MentionData) => void {\n const onSuggestionSelect = useContext(OnSuggestionSelectCallbackContext);\n if (onSuggestionSelect === null) {\n throw new Error(\n \"useOnSuggestionSelectCallback: OnSuggestionSelectContext not found\"\n );\n }\n\n return onSuggestionSelect;\n}\n\nfunction useOnResetMatchCallback(): () => void {\n const onResetMatch = useContext(OnResetMatchCallbackContext);\n if (onResetMatch === null) {\n throw new Error(\"useOnResetMatchCallback: OnResetMatchContext not found\");\n }\n\n return onResetMatch;\n}\n\nexport { Item, List };\n"],"names":["createContext","forwardRef","useLexicalComposerContext","useState","useEffect","KEY_ARROW_DOWN_COMMAND","COMMAND_PRIORITY_LOW","KEY_ARROW_UP_COMMAND","KEY_ESCAPE_COMMAND","KEY_ENTER_COMMAND","jsx","Item","useRef","useImperativeHandle","useContext"],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@ import { KEY_ARROW_DOWN_COMMAND, COMMAND_PRIORITY_LOW, KEY_ARROW_UP_COMMAND, KEY
|
|
|
4
4
|
import { createContext, forwardRef, useState, useEffect, useRef, useImperativeHandle, useContext } from 'react';
|
|
5
5
|
|
|
6
6
|
const SuggestionsContext = createContext(null);
|
|
7
|
-
const
|
|
7
|
+
const OnSuggestionSelectCallbackContext = createContext(null);
|
|
8
8
|
const OnResetMatchCallbackContext = createContext(
|
|
9
9
|
null
|
|
10
10
|
);
|
|
@@ -14,16 +14,16 @@ const List = forwardRef(
|
|
|
14
14
|
const { children, ...divProps } = props;
|
|
15
15
|
const [editor] = useLexicalComposerContext();
|
|
16
16
|
const [highlightedIndex, setHighlightedIndex] = useState(0);
|
|
17
|
-
const
|
|
18
|
-
const
|
|
17
|
+
const suggestions = useSuggestions();
|
|
18
|
+
const onSuggestionSelect = useOnSuggestionSelectCallback();
|
|
19
19
|
const onEscapeKeyDown = useOnResetMatchCallback();
|
|
20
20
|
useEffect(() => {
|
|
21
21
|
function onKeyArrowDown(event) {
|
|
22
|
-
if (
|
|
22
|
+
if (suggestions.length === 0)
|
|
23
23
|
return true;
|
|
24
24
|
if (highlightedIndex === null)
|
|
25
25
|
return true;
|
|
26
|
-
const nextIndex = highlightedIndex ===
|
|
26
|
+
const nextIndex = highlightedIndex === suggestions.length - 1 ? 0 : highlightedIndex + 1;
|
|
27
27
|
setHighlightedIndex(nextIndex);
|
|
28
28
|
event.preventDefault();
|
|
29
29
|
event.stopImmediatePropagation();
|
|
@@ -34,14 +34,14 @@ const List = forwardRef(
|
|
|
34
34
|
onKeyArrowDown,
|
|
35
35
|
COMMAND_PRIORITY_LOW
|
|
36
36
|
);
|
|
37
|
-
}, [editor, highlightedIndex,
|
|
37
|
+
}, [editor, highlightedIndex, suggestions]);
|
|
38
38
|
useEffect(() => {
|
|
39
39
|
function onKeyArrowUp(event) {
|
|
40
|
-
if (
|
|
40
|
+
if (suggestions.length === 0)
|
|
41
41
|
return true;
|
|
42
42
|
if (highlightedIndex === null)
|
|
43
43
|
return true;
|
|
44
|
-
const nextIndex = highlightedIndex === 0 ?
|
|
44
|
+
const nextIndex = highlightedIndex === 0 ? suggestions.length - 1 : highlightedIndex - 1;
|
|
45
45
|
setHighlightedIndex(nextIndex);
|
|
46
46
|
event.preventDefault();
|
|
47
47
|
event.stopImmediatePropagation();
|
|
@@ -52,7 +52,7 @@ const List = forwardRef(
|
|
|
52
52
|
onKeyArrowUp,
|
|
53
53
|
COMMAND_PRIORITY_LOW
|
|
54
54
|
);
|
|
55
|
-
}, [editor, highlightedIndex,
|
|
55
|
+
}, [editor, highlightedIndex, suggestions]);
|
|
56
56
|
useEffect(() => {
|
|
57
57
|
function onKeyEscape(event) {
|
|
58
58
|
event.preventDefault();
|
|
@@ -68,9 +68,9 @@ const List = forwardRef(
|
|
|
68
68
|
}, [editor, onEscapeKeyDown]);
|
|
69
69
|
useEffect(() => {
|
|
70
70
|
function onKeyEnter(event) {
|
|
71
|
-
if (
|
|
71
|
+
if (suggestions.length === 0)
|
|
72
72
|
return true;
|
|
73
|
-
|
|
73
|
+
onSuggestionSelect(suggestions[highlightedIndex]);
|
|
74
74
|
if (event === null)
|
|
75
75
|
return true;
|
|
76
76
|
event.preventDefault();
|
|
@@ -82,7 +82,7 @@ const List = forwardRef(
|
|
|
82
82
|
onKeyEnter,
|
|
83
83
|
COMMAND_PRIORITY_LOW
|
|
84
84
|
);
|
|
85
|
-
}, [editor,
|
|
85
|
+
}, [editor, onSuggestionSelect, highlightedIndex, suggestions]);
|
|
86
86
|
useEffect(() => {
|
|
87
87
|
const root = editor.getRootElement();
|
|
88
88
|
if (root === null)
|
|
@@ -112,8 +112,8 @@ const Item = forwardRef(
|
|
|
112
112
|
const divRef = useRef(null);
|
|
113
113
|
const [highlightedIndex, setHighlightedIndex] = useHighlightedIndex();
|
|
114
114
|
const suggestions = useSuggestions();
|
|
115
|
-
const
|
|
116
|
-
const isHighlighted = suggestions[highlightedIndex] === value;
|
|
115
|
+
const onSuggestionSelect = useOnSuggestionSelectCallback();
|
|
116
|
+
const isHighlighted = suggestions[highlightedIndex].id === value;
|
|
117
117
|
useImperativeHandle(
|
|
118
118
|
forwardedRef,
|
|
119
119
|
() => divRef.current
|
|
@@ -130,7 +130,9 @@ const Item = forwardRef(
|
|
|
130
130
|
onMouseEnter?.(event);
|
|
131
131
|
if (event.isDefaultPrevented())
|
|
132
132
|
return;
|
|
133
|
-
const index = suggestions.
|
|
133
|
+
const index = suggestions.findIndex(
|
|
134
|
+
(suggestion) => suggestion.id === value
|
|
135
|
+
);
|
|
134
136
|
if (index === -1)
|
|
135
137
|
return;
|
|
136
138
|
setHighlightedIndex(index);
|
|
@@ -139,7 +141,7 @@ const Item = forwardRef(
|
|
|
139
141
|
onClick?.(event);
|
|
140
142
|
if (event.isDefaultPrevented())
|
|
141
143
|
return;
|
|
142
|
-
|
|
144
|
+
onSuggestionSelect(suggestions[highlightedIndex]);
|
|
143
145
|
}
|
|
144
146
|
return /* @__PURE__ */ jsx("div", {
|
|
145
147
|
role: "option",
|
|
@@ -168,12 +170,14 @@ function useSuggestions() {
|
|
|
168
170
|
}
|
|
169
171
|
return suggestions;
|
|
170
172
|
}
|
|
171
|
-
function
|
|
172
|
-
const
|
|
173
|
-
if (
|
|
174
|
-
throw new Error(
|
|
173
|
+
function useOnSuggestionSelectCallback() {
|
|
174
|
+
const onSuggestionSelect = useContext(OnSuggestionSelectCallbackContext);
|
|
175
|
+
if (onSuggestionSelect === null) {
|
|
176
|
+
throw new Error(
|
|
177
|
+
"useOnSuggestionSelectCallback: OnSuggestionSelectContext not found"
|
|
178
|
+
);
|
|
175
179
|
}
|
|
176
|
-
return
|
|
180
|
+
return onSuggestionSelect;
|
|
177
181
|
}
|
|
178
182
|
function useOnResetMatchCallback() {
|
|
179
183
|
const onResetMatch = useContext(OnResetMatchCallbackContext);
|
|
@@ -183,5 +187,5 @@ function useOnResetMatchCallback() {
|
|
|
183
187
|
return onResetMatch;
|
|
184
188
|
}
|
|
185
189
|
|
|
186
|
-
export { Item, List, OnResetMatchCallbackContext,
|
|
190
|
+
export { Item, List, OnResetMatchCallbackContext, OnSuggestionSelectCallbackContext, SuggestionsContext };
|
|
187
191
|
//# sourceMappingURL=suggestions.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"suggestions.js","sources":["../../src/mentions/suggestions.tsx"],"sourcesContent":["import { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport {\n COMMAND_PRIORITY_LOW,\n KEY_ARROW_DOWN_COMMAND,\n KEY_ARROW_UP_COMMAND,\n KEY_ENTER_COMMAND,\n KEY_ESCAPE_COMMAND,\n} from \"lexical\";\nimport type {\n Dispatch,\n HTMLAttributes,\n MouseEvent,\n ReactNode,\n SetStateAction,\n} from \"react\";\nimport {\n createContext,\n forwardRef,\n useContext,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from \"react\";\n\nexport const SuggestionsContext = createContext<string[] | null>(null);\n\nexport const OnValueSelectCallbackContext = createContext<\n ((value: string) => void) | null\n>(null);\n\nexport const OnResetMatchCallbackContext = createContext<(() => void) | null>(\n null\n);\n\nconst HighlightedIndexContext = createContext<\n [number, Dispatch<SetStateAction<number>>] | null\n>(null);\n\nexport interface ListProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n}\n\nconst List = forwardRef<HTMLDivElement, ListProps>(\n function (props, forwardedRef) {\n const { children, ...divProps } = props;\n const [editor] = useLexicalComposerContext();\n const [highlightedIndex, setHighlightedIndex] = useState(0);\n const values = useSuggestions();\n const onValueSelect = useOnValueSelectCallback();\n const onEscapeKeyDown = useOnResetMatchCallback();\n\n useEffect(() => {\n function onKeyArrowDown(event: KeyboardEvent): boolean {\n if (values.length === 0) return true;\n if (highlightedIndex === null) return true;\n\n // If the highlighted index is at the last suggestion, then we loop back to the first suggestion, otherwise we increment the index.\n const nextIndex =\n highlightedIndex === values.length - 1 ? 0 : highlightedIndex + 1;\n setHighlightedIndex(nextIndex);\n\n event.preventDefault();\n event.stopImmediatePropagation();\n\n return true;\n }\n\n return editor.registerCommand(\n KEY_ARROW_DOWN_COMMAND,\n onKeyArrowDown,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, highlightedIndex, values]);\n\n useEffect(() => {\n function onKeyArrowUp(event: KeyboardEvent): boolean {\n if (values.length === 0) return true;\n if (highlightedIndex === null) return true;\n\n // If the highlighted index is at the first suggestion, then we loop back to the last suggestion, otherwise we decrement the index.\n const nextIndex =\n highlightedIndex === 0 ? values.length - 1 : highlightedIndex - 1;\n setHighlightedIndex(nextIndex);\n\n event.preventDefault();\n event.stopImmediatePropagation();\n return true;\n }\n\n return editor.registerCommand(\n KEY_ARROW_UP_COMMAND,\n onKeyArrowUp,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, highlightedIndex, values]);\n\n useEffect(() => {\n function onKeyEscape(event: KeyboardEvent): boolean {\n event.preventDefault();\n event.stopImmediatePropagation();\n\n onEscapeKeyDown();\n return true;\n }\n\n return editor.registerCommand<KeyboardEvent>(\n KEY_ESCAPE_COMMAND,\n onKeyEscape,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, onEscapeKeyDown]);\n\n useEffect(() => {\n function onKeyEnter(event: KeyboardEvent | null): boolean {\n if (values.length === 0) return true;\n\n onValueSelect(values[highlightedIndex]);\n\n if (event === null) return true;\n\n event.preventDefault();\n event.stopImmediatePropagation();\n return true;\n }\n\n return editor.registerCommand(\n KEY_ENTER_COMMAND,\n onKeyEnter,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, onValueSelect, highlightedIndex, values]);\n\n useEffect(() => {\n const root = editor.getRootElement();\n if (root === null) return;\n\n root.setAttribute(\n \"aria-activedescendant\",\n `typeahead-item-${highlightedIndex}`\n );\n\n return () => {\n root.removeAttribute(\"aria-activedescendant\");\n };\n }, [editor, highlightedIndex]);\n\n return (\n <HighlightedIndexContext.Provider\n value={[highlightedIndex, setHighlightedIndex]}\n >\n <div role=\"listbox\" {...divProps} ref={forwardedRef}>\n {children}\n </div>\n </HighlightedIndexContext.Provider>\n );\n }\n);\n\ninterface ItemProps extends HTMLAttributes<HTMLDivElement> {\n value: string;\n}\n\nconst Item = forwardRef<HTMLDivElement | null, ItemProps>(\n function Item(props, forwardedRef) {\n const { children, value, onMouseEnter, onClick, ...divProps } = props;\n const divRef = useRef<HTMLDivElement>(null);\n\n const [highlightedIndex, setHighlightedIndex] = useHighlightedIndex();\n const suggestions = useSuggestions();\n const onValueSelect = useOnValueSelectCallback();\n\n const isHighlighted = suggestions[highlightedIndex] === value;\n\n useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(\n forwardedRef,\n () => divRef.current\n );\n\n useEffect(() => {\n if (!isHighlighted) return;\n\n const div = divRef.current;\n if (div === null) return;\n\n div.scrollIntoView({ block: \"nearest\" });\n }, [isHighlighted]);\n\n function handleMouseEnter(event: MouseEvent<HTMLDivElement>) {\n onMouseEnter?.(event);\n\n if (event.isDefaultPrevented()) return;\n\n const index = suggestions.indexOf(value);\n if (index === -1) return;\n\n setHighlightedIndex(index);\n }\n\n function handleClick(event: MouseEvent<HTMLDivElement>) {\n onClick?.(event);\n\n if (event.isDefaultPrevented()) return;\n\n onValueSelect(value);\n }\n\n return (\n <div\n role=\"option\"\n data-highlighted={isHighlighted || undefined}\n onMouseEnter={handleMouseEnter}\n onClick={handleClick}\n {...divProps}\n ref={divRef}\n >\n {children}\n </div>\n );\n }\n);\n\nfunction useHighlightedIndex(): [number, Dispatch<SetStateAction<number>>] {\n const context = useContext(HighlightedIndexContext);\n if (context === null) {\n throw new Error(\n \"useHighlightedIndex must be used within a HighlightedIndexProvider\"\n );\n }\n return context;\n}\n\nfunction useSuggestions(): string[] {\n const suggestions = useContext(SuggestionsContext);\n if (suggestions === null) {\n throw new Error(\"useSuggestions: SuggestionsContext not found\");\n }\n\n return suggestions;\n}\n\nfunction useOnValueSelectCallback(): (value: string) => void {\n const onValueSelect = useContext(OnValueSelectCallbackContext);\n if (onValueSelect === null) {\n throw new Error(\"useOnValueSelectCallback: OnValueSelectContext not found\");\n }\n\n return onValueSelect;\n}\n\nfunction useOnResetMatchCallback(): () => void {\n const onResetMatch = useContext(OnResetMatchCallbackContext);\n if (onResetMatch === null) {\n throw new Error(\"useOnResetMatchCallback: OnResetMatchContext not found\");\n }\n\n return onResetMatch;\n}\n\nexport { Item, List };\n"],"names":["Item"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"suggestions.js","sources":["../../src/mentions/suggestions.tsx"],"sourcesContent":["import { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport type { MentionData } from \"@liveblocks/core\";\nimport {\n COMMAND_PRIORITY_LOW,\n KEY_ARROW_DOWN_COMMAND,\n KEY_ARROW_UP_COMMAND,\n KEY_ENTER_COMMAND,\n KEY_ESCAPE_COMMAND,\n} from \"lexical\";\nimport type {\n Dispatch,\n HTMLAttributes,\n MouseEvent,\n ReactNode,\n SetStateAction,\n} from \"react\";\nimport {\n createContext,\n forwardRef,\n useContext,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from \"react\";\n\nexport const SuggestionsContext = createContext<MentionData[] | null>(null);\n\nexport const OnSuggestionSelectCallbackContext = createContext<\n ((mention: MentionData) => void) | null\n>(null);\n\nexport const OnResetMatchCallbackContext = createContext<(() => void) | null>(\n null\n);\n\nconst HighlightedIndexContext = createContext<\n [number, Dispatch<SetStateAction<number>>] | null\n>(null);\n\nexport interface ListProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n}\n\nconst List = forwardRef<HTMLDivElement, ListProps>(\n function (props, forwardedRef) {\n const { children, ...divProps } = props;\n const [editor] = useLexicalComposerContext();\n const [highlightedIndex, setHighlightedIndex] = useState(0);\n const suggestions = useSuggestions();\n const onSuggestionSelect = useOnSuggestionSelectCallback();\n const onEscapeKeyDown = useOnResetMatchCallback();\n\n useEffect(() => {\n function onKeyArrowDown(event: KeyboardEvent): boolean {\n if (suggestions.length === 0) return true;\n if (highlightedIndex === null) return true;\n\n // If the highlighted index is at the last suggestion, then we loop back to the first suggestion, otherwise we increment the index.\n const nextIndex =\n highlightedIndex === suggestions.length - 1\n ? 0\n : highlightedIndex + 1;\n setHighlightedIndex(nextIndex);\n\n event.preventDefault();\n event.stopImmediatePropagation();\n\n return true;\n }\n\n return editor.registerCommand(\n KEY_ARROW_DOWN_COMMAND,\n onKeyArrowDown,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, highlightedIndex, suggestions]);\n\n useEffect(() => {\n function onKeyArrowUp(event: KeyboardEvent): boolean {\n if (suggestions.length === 0) return true;\n if (highlightedIndex === null) return true;\n\n // If the highlighted index is at the first suggestion, then we loop back to the last suggestion, otherwise we decrement the index.\n const nextIndex =\n highlightedIndex === 0\n ? suggestions.length - 1\n : highlightedIndex - 1;\n setHighlightedIndex(nextIndex);\n\n event.preventDefault();\n event.stopImmediatePropagation();\n return true;\n }\n\n return editor.registerCommand(\n KEY_ARROW_UP_COMMAND,\n onKeyArrowUp,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, highlightedIndex, suggestions]);\n\n useEffect(() => {\n function onKeyEscape(event: KeyboardEvent): boolean {\n event.preventDefault();\n event.stopImmediatePropagation();\n\n onEscapeKeyDown();\n return true;\n }\n\n return editor.registerCommand<KeyboardEvent>(\n KEY_ESCAPE_COMMAND,\n onKeyEscape,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, onEscapeKeyDown]);\n\n useEffect(() => {\n function onKeyEnter(event: KeyboardEvent | null): boolean {\n if (suggestions.length === 0) return true;\n\n onSuggestionSelect(suggestions[highlightedIndex]);\n\n if (event === null) return true;\n\n event.preventDefault();\n event.stopImmediatePropagation();\n return true;\n }\n\n return editor.registerCommand(\n KEY_ENTER_COMMAND,\n onKeyEnter,\n COMMAND_PRIORITY_LOW\n );\n }, [editor, onSuggestionSelect, highlightedIndex, suggestions]);\n\n useEffect(() => {\n const root = editor.getRootElement();\n if (root === null) return;\n\n root.setAttribute(\n \"aria-activedescendant\",\n `typeahead-item-${highlightedIndex}`\n );\n\n return () => {\n root.removeAttribute(\"aria-activedescendant\");\n };\n }, [editor, highlightedIndex]);\n\n return (\n <HighlightedIndexContext.Provider\n value={[highlightedIndex, setHighlightedIndex]}\n >\n <div role=\"listbox\" {...divProps} ref={forwardedRef}>\n {children}\n </div>\n </HighlightedIndexContext.Provider>\n );\n }\n);\n\ninterface ItemProps extends HTMLAttributes<HTMLDivElement> {\n value: string;\n}\n\nconst Item = forwardRef<HTMLDivElement | null, ItemProps>(\n function Item(props, forwardedRef) {\n const { children, value, onMouseEnter, onClick, ...divProps } = props;\n const divRef = useRef<HTMLDivElement>(null);\n\n const [highlightedIndex, setHighlightedIndex] = useHighlightedIndex();\n const suggestions = useSuggestions();\n const onSuggestionSelect = useOnSuggestionSelectCallback();\n\n const isHighlighted = suggestions[highlightedIndex].id === value;\n\n useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(\n forwardedRef,\n () => divRef.current\n );\n\n useEffect(() => {\n if (!isHighlighted) return;\n\n const div = divRef.current;\n if (div === null) return;\n\n div.scrollIntoView({ block: \"nearest\" });\n }, [isHighlighted]);\n\n function handleMouseEnter(event: MouseEvent<HTMLDivElement>) {\n onMouseEnter?.(event);\n\n if (event.isDefaultPrevented()) return;\n\n const index = suggestions.findIndex(\n (suggestion) => suggestion.id === value\n );\n if (index === -1) return;\n\n setHighlightedIndex(index);\n }\n\n function handleClick(event: MouseEvent<HTMLDivElement>) {\n onClick?.(event);\n\n if (event.isDefaultPrevented()) return;\n\n onSuggestionSelect(suggestions[highlightedIndex]);\n }\n\n return (\n <div\n role=\"option\"\n data-highlighted={isHighlighted || undefined}\n onMouseEnter={handleMouseEnter}\n onClick={handleClick}\n {...divProps}\n ref={divRef}\n >\n {children}\n </div>\n );\n }\n);\n\nfunction useHighlightedIndex(): [number, Dispatch<SetStateAction<number>>] {\n const context = useContext(HighlightedIndexContext);\n if (context === null) {\n throw new Error(\n \"useHighlightedIndex must be used within a HighlightedIndexProvider\"\n );\n }\n return context;\n}\n\nfunction useSuggestions(): MentionData[] {\n const suggestions = useContext(SuggestionsContext);\n if (suggestions === null) {\n throw new Error(\"useSuggestions: SuggestionsContext not found\");\n }\n\n return suggestions;\n}\n\nfunction useOnSuggestionSelectCallback(): (mention: MentionData) => void {\n const onSuggestionSelect = useContext(OnSuggestionSelectCallbackContext);\n if (onSuggestionSelect === null) {\n throw new Error(\n \"useOnSuggestionSelectCallback: OnSuggestionSelectContext not found\"\n );\n }\n\n return onSuggestionSelect;\n}\n\nfunction useOnResetMatchCallback(): () => void {\n const onResetMatch = useContext(OnResetMatchCallbackContext);\n if (onResetMatch === null) {\n throw new Error(\"useOnResetMatchCallback: OnResetMatchContext not found\");\n }\n\n return onResetMatch;\n}\n\nexport { Item, List };\n"],"names":["Item"],"mappings":"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"}
|
package/dist/version.cjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
const PKG_NAME = "@liveblocks/react-lexical";
|
|
4
|
-
const PKG_VERSION = typeof "
|
|
4
|
+
const PKG_VERSION = typeof "3.0.0" === "string" && "3.0.0";
|
|
5
5
|
const PKG_FORMAT = typeof "cjs" === "string" && "cjs";
|
|
6
6
|
|
|
7
7
|
exports.PKG_FORMAT = PKG_FORMAT;
|
package/dist/version.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.cjs","sources":["../src/version.ts"],"sourcesContent":["declare const __VERSION__: string;\ndeclare const ROLLUP_FORMAT: string;\n\nexport const PKG_NAME = \"@liveblocks/react-lexical\";\nexport const PKG_VERSION = typeof __VERSION__ === \"string\" && __VERSION__;\nexport const PKG_FORMAT = typeof ROLLUP_FORMAT === \"string\" && ROLLUP_FORMAT;\n"],"names":[],"mappings":";;AAGO,MAAM,QAAW,GAAA,4BAAA;AACX,MAAA,WAAA,GAAc,OAAO,
|
|
1
|
+
{"version":3,"file":"version.cjs","sources":["../src/version.ts"],"sourcesContent":["declare const __VERSION__: string;\ndeclare const ROLLUP_FORMAT: string;\n\nexport const PKG_NAME = \"@liveblocks/react-lexical\";\nexport const PKG_VERSION = typeof __VERSION__ === \"string\" && __VERSION__;\nexport const PKG_FORMAT = typeof ROLLUP_FORMAT === \"string\" && ROLLUP_FORMAT;\n"],"names":[],"mappings":";;AAGO,MAAM,QAAW,GAAA,4BAAA;AACX,MAAA,WAAA,GAAc,OAAO,OAAA,KAAgB,QAAY,IAAA,QAAA;AACjD,MAAA,UAAA,GAAa,OAAO,KAAA,KAAkB,QAAY,IAAA;;;;;;"}
|
package/dist/version.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const PKG_NAME = "@liveblocks/react-lexical";
|
|
2
|
-
const PKG_VERSION = typeof "
|
|
2
|
+
const PKG_VERSION = typeof "3.0.0" === "string" && "3.0.0";
|
|
3
3
|
const PKG_FORMAT = typeof "esm" === "string" && "esm";
|
|
4
4
|
|
|
5
5
|
export { PKG_FORMAT, PKG_NAME, PKG_VERSION };
|
package/dist/version.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.js","sources":["../src/version.ts"],"sourcesContent":["declare const __VERSION__: string;\ndeclare const ROLLUP_FORMAT: string;\n\nexport const PKG_NAME = \"@liveblocks/react-lexical\";\nexport const PKG_VERSION = typeof __VERSION__ === \"string\" && __VERSION__;\nexport const PKG_FORMAT = typeof ROLLUP_FORMAT === \"string\" && ROLLUP_FORMAT;\n"],"names":[],"mappings":"AAGO,MAAM,QAAW,GAAA,4BAAA;AACX,MAAA,WAAA,GAAc,OAAO,
|
|
1
|
+
{"version":3,"file":"version.js","sources":["../src/version.ts"],"sourcesContent":["declare const __VERSION__: string;\ndeclare const ROLLUP_FORMAT: string;\n\nexport const PKG_NAME = \"@liveblocks/react-lexical\";\nexport const PKG_VERSION = typeof __VERSION__ === \"string\" && __VERSION__;\nexport const PKG_FORMAT = typeof ROLLUP_FORMAT === \"string\" && ROLLUP_FORMAT;\n"],"names":[],"mappings":"AAGO,MAAM,QAAW,GAAA,4BAAA;AACX,MAAA,WAAA,GAAc,OAAO,OAAA,KAAgB,QAAY,IAAA,QAAA;AACjD,MAAA,UAAA,GAAa,OAAO,KAAA,KAAkB,QAAY,IAAA;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@liveblocks/react-lexical",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "3.0.0",
|
|
4
4
|
"description": "An integration of Lexical + React to enable collaboration, comments, live cursors, and more with Liveblocks.",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"type": "module",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
},
|
|
44
44
|
"dependencies": {
|
|
45
45
|
"@floating-ui/react-dom": "^2.1.1",
|
|
46
|
-
"@liveblocks/client": "
|
|
47
|
-
"@liveblocks/core": "
|
|
48
|
-
"@liveblocks/react": "
|
|
49
|
-
"@liveblocks/react-ui": "
|
|
50
|
-
"@liveblocks/yjs": "
|
|
46
|
+
"@liveblocks/client": "3.0.0",
|
|
47
|
+
"@liveblocks/core": "3.0.0",
|
|
48
|
+
"@liveblocks/react": "3.0.0",
|
|
49
|
+
"@liveblocks/react-ui": "3.0.0",
|
|
50
|
+
"@liveblocks/yjs": "3.0.0",
|
|
51
51
|
"@radix-ui/react-select": "^2.1.2",
|
|
52
52
|
"@radix-ui/react-toggle": "^1.1.0",
|
|
53
53
|
"yjs": "^13.6.18"
|
|
@@ -58,10 +58,20 @@
|
|
|
58
58
|
"@lexical/selection": "0.24.0",
|
|
59
59
|
"@lexical/utils": "0.24.0",
|
|
60
60
|
"@lexical/yjs": "0.24.0",
|
|
61
|
+
"@types/react": "*",
|
|
62
|
+
"@types/react-dom": "*",
|
|
61
63
|
"lexical": "0.24.0",
|
|
62
64
|
"react": "^18 || ^19 || ^19.0.0-rc",
|
|
63
65
|
"react-dom": "^18 || ^19 || ^19.0.0-rc"
|
|
64
66
|
},
|
|
67
|
+
"peerDependenciesMeta": {
|
|
68
|
+
"@types/react": {
|
|
69
|
+
"optional": true
|
|
70
|
+
},
|
|
71
|
+
"@types/react-dom": {
|
|
72
|
+
"optional": true
|
|
73
|
+
}
|
|
74
|
+
},
|
|
65
75
|
"devDependencies": {
|
|
66
76
|
"@liveblocks/eslint-config": "*",
|
|
67
77
|
"@liveblocks/jest-config": "*",
|