@liveblocks/react-tiptap 2.18.1 → 2.18.2-test1
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.d.mts +10 -2
- package/dist/index.d.ts +10 -2
- package/dist/index.js +4 -0
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +2 -0
- package/dist/index.mjs.map +1 -1
- package/dist/mentions/MentionExtension.js +8 -71
- package/dist/mentions/MentionExtension.js.map +1 -1
- package/dist/mentions/MentionExtension.mjs +11 -74
- package/dist/mentions/MentionExtension.mjs.map +1 -1
- package/dist/mentions/MentionNode.js +80 -0
- package/dist/mentions/MentionNode.js.map +1 -0
- package/dist/mentions/MentionNode.mjs +78 -0
- package/dist/mentions/MentionNode.mjs.map +1 -0
- package/dist/types.js +2 -0
- package/dist/types.js.map +1 -1
- package/dist/types.mjs +2 -1
- package/dist/types.mjs.map +1 -1
- package/dist/version.js +1 -1
- package/dist/version.js.map +1 -1
- package/dist/version.mjs +1 -1
- package/dist/version.mjs.map +1 -1
- package/package.json +6 -6
package/dist/index.d.mts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ContextualPromptContext, ContextualPromptResponse, BaseMetadata, DM, ThreadData, HistoryVersion } from '@liveblocks/core';
|
|
2
|
-
import { Content, Extension } from '@tiptap/core';
|
|
2
|
+
import { Content, Extension, Node } from '@tiptap/core';
|
|
3
3
|
import * as react from 'react';
|
|
4
4
|
import { ComponentProps, ReactNode, ComponentType, PropsWithChildren, ComponentPropsWithoutRef, HTMLAttributes } from 'react';
|
|
5
5
|
import { Editor } from '@tiptap/react';
|
|
@@ -163,6 +163,14 @@ declare function FloatingThreads({ threads, components, editor, ...props }: Floa
|
|
|
163
163
|
declare function useIsEditorReady(): boolean;
|
|
164
164
|
declare const useLiveblocksExtension: (opts?: LiveblocksExtensionOptions) => Extension;
|
|
165
165
|
|
|
166
|
+
type MentionExtensionOptions = {
|
|
167
|
+
onCreateMention: (userId: string, notificationId: string) => void;
|
|
168
|
+
onDeleteMention: (notificationId: string) => void;
|
|
169
|
+
};
|
|
170
|
+
declare const MentionExtension: Extension<MentionExtensionOptions, any>;
|
|
171
|
+
|
|
172
|
+
declare const MentionNode: Node<never, never>;
|
|
173
|
+
|
|
166
174
|
interface ToolbarSlotProps {
|
|
167
175
|
editor: Editor;
|
|
168
176
|
}
|
|
@@ -426,4 +434,4 @@ declare module "@tiptap/core" {
|
|
|
426
434
|
}
|
|
427
435
|
}
|
|
428
436
|
|
|
429
|
-
export { AiConfiguration, AiToolbar, AiToolbarProps, AnchoredThreads, AnchoredThreadsProps, FloatingComposer, FloatingComposerProps, FloatingThreads, FloatingThreadsProps, FloatingToolbar, FloatingToolbarProps, HistoryVersionPreview, HistoryVersionPreviewProps, ResolveContextualPromptArgs, ResolveContextualPromptResponse, Toolbar, ToolbarBlockSelectorItem, ToolbarBlockSelectorProps, ToolbarButtonProps, ToolbarProps, ToolbarSeparatorProps, ToolbarToggleProps, useIsEditorReady, useLiveblocksExtension };
|
|
437
|
+
export { AiConfiguration, AiToolbar, AiToolbarProps, AnchoredThreads, AnchoredThreadsProps, FloatingComposer, FloatingComposerProps, FloatingThreads, FloatingThreadsProps, FloatingToolbar, FloatingToolbarProps, HistoryVersionPreview, HistoryVersionPreviewProps, MentionExtension, MentionNode, ResolveContextualPromptArgs, ResolveContextualPromptResponse, Toolbar, ToolbarBlockSelectorItem, ToolbarBlockSelectorProps, ToolbarButtonProps, ToolbarProps, ToolbarSeparatorProps, ToolbarToggleProps, useIsEditorReady, useLiveblocksExtension };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ContextualPromptContext, ContextualPromptResponse, BaseMetadata, DM, ThreadData, HistoryVersion } from '@liveblocks/core';
|
|
2
|
-
import { Content, Extension } from '@tiptap/core';
|
|
2
|
+
import { Content, Extension, Node } from '@tiptap/core';
|
|
3
3
|
import * as react from 'react';
|
|
4
4
|
import { ComponentProps, ReactNode, ComponentType, PropsWithChildren, ComponentPropsWithoutRef, HTMLAttributes } from 'react';
|
|
5
5
|
import { Editor } from '@tiptap/react';
|
|
@@ -163,6 +163,14 @@ declare function FloatingThreads({ threads, components, editor, ...props }: Floa
|
|
|
163
163
|
declare function useIsEditorReady(): boolean;
|
|
164
164
|
declare const useLiveblocksExtension: (opts?: LiveblocksExtensionOptions) => Extension;
|
|
165
165
|
|
|
166
|
+
type MentionExtensionOptions = {
|
|
167
|
+
onCreateMention: (userId: string, notificationId: string) => void;
|
|
168
|
+
onDeleteMention: (notificationId: string) => void;
|
|
169
|
+
};
|
|
170
|
+
declare const MentionExtension: Extension<MentionExtensionOptions, any>;
|
|
171
|
+
|
|
172
|
+
declare const MentionNode: Node<never, never>;
|
|
173
|
+
|
|
166
174
|
interface ToolbarSlotProps {
|
|
167
175
|
editor: Editor;
|
|
168
176
|
}
|
|
@@ -426,4 +434,4 @@ declare module "@tiptap/core" {
|
|
|
426
434
|
}
|
|
427
435
|
}
|
|
428
436
|
|
|
429
|
-
export { AiConfiguration, AiToolbar, AiToolbarProps, AnchoredThreads, AnchoredThreadsProps, FloatingComposer, FloatingComposerProps, FloatingThreads, FloatingThreadsProps, FloatingToolbar, FloatingToolbarProps, HistoryVersionPreview, HistoryVersionPreviewProps, ResolveContextualPromptArgs, ResolveContextualPromptResponse, Toolbar, ToolbarBlockSelectorItem, ToolbarBlockSelectorProps, ToolbarButtonProps, ToolbarProps, ToolbarSeparatorProps, ToolbarToggleProps, useIsEditorReady, useLiveblocksExtension };
|
|
437
|
+
export { AiConfiguration, AiToolbar, AiToolbarProps, AnchoredThreads, AnchoredThreadsProps, FloatingComposer, FloatingComposerProps, FloatingThreads, FloatingThreadsProps, FloatingToolbar, FloatingToolbarProps, HistoryVersionPreview, HistoryVersionPreviewProps, MentionExtension, MentionNode, ResolveContextualPromptArgs, ResolveContextualPromptResponse, Toolbar, ToolbarBlockSelectorItem, ToolbarBlockSelectorProps, ToolbarButtonProps, ToolbarProps, ToolbarSeparatorProps, ToolbarToggleProps, useIsEditorReady, useLiveblocksExtension };
|
package/dist/index.js
CHANGED
|
@@ -7,6 +7,8 @@ var AnchoredThreads = require('./comments/AnchoredThreads.js');
|
|
|
7
7
|
var FloatingComposer = require('./comments/FloatingComposer.js');
|
|
8
8
|
var FloatingThreads = require('./comments/FloatingThreads.js');
|
|
9
9
|
var LiveblocksExtension = require('./LiveblocksExtension.js');
|
|
10
|
+
var MentionExtension = require('./mentions/MentionExtension.js');
|
|
11
|
+
var MentionNode = require('./mentions/MentionNode.js');
|
|
10
12
|
var FloatingToolbar = require('./toolbar/FloatingToolbar.js');
|
|
11
13
|
var Toolbar = require('./toolbar/Toolbar.js');
|
|
12
14
|
var HistoryVersionPreview = require('./version-history/HistoryVersionPreview.js');
|
|
@@ -19,6 +21,8 @@ exports.FloatingComposer = FloatingComposer.FloatingComposer;
|
|
|
19
21
|
exports.FloatingThreads = FloatingThreads.FloatingThreads;
|
|
20
22
|
exports.useIsEditorReady = LiveblocksExtension.useIsEditorReady;
|
|
21
23
|
exports.useLiveblocksExtension = LiveblocksExtension.useLiveblocksExtension;
|
|
24
|
+
exports.MentionExtension = MentionExtension.MentionExtension;
|
|
25
|
+
exports.MentionNode = MentionNode.MentionNode;
|
|
22
26
|
exports.FloatingToolbar = FloatingToolbar.FloatingToolbar;
|
|
23
27
|
exports.Toolbar = Toolbar.Toolbar;
|
|
24
28
|
exports.HistoryVersionPreview = HistoryVersionPreview.HistoryVersionPreview;
|
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 type { AiCommands, CommentsCommands } from \"./types\";\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type { AiToolbarProps } from \"./ai/AiToolbar\";\nexport { AiToolbar } from \"./ai/AiToolbar\";\nexport type { AnchoredThreadsProps } from \"./comments/AnchoredThreads\";\nexport { AnchoredThreads } from \"./comments/AnchoredThreads\";\nexport type { FloatingComposerProps } from \"./comments/FloatingComposer\";\nexport { FloatingComposer } from \"./comments/FloatingComposer\";\nexport type { FloatingThreadsProps } from \"./comments/FloatingThreads\";\nexport { FloatingThreads } from \"./comments/FloatingThreads\";\nexport { useLiveblocksExtension } from \"./LiveblocksExtension\";\nexport { useIsEditorReady } from \"./LiveblocksExtension\";\nexport type { FloatingToolbarProps } from \"./toolbar/FloatingToolbar\";\nexport { FloatingToolbar } from \"./toolbar/FloatingToolbar\";\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 {\n AiConfiguration,\n ResolveContextualPromptArgs,\n ResolveContextualPromptResponse,\n} from \"./types\";\nexport type { HistoryVersionPreviewProps } from \"./version-history/HistoryVersionPreview\";\nexport { HistoryVersionPreview } from \"./version-history/HistoryVersionPreview\";\n\ndeclare module \"@tiptap/core\" {\n interface Commands<ReturnType> {\n liveblocksComments: CommentsCommands<ReturnType>;\n liveblocksAi: AiCommands<ReturnType>;\n }\n}\n"],"names":["detectDupes","PKG_NAME","PKG_VERSION","PKG_FORMAT"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport type { AiCommands, CommentsCommands } from \"./types\";\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type { AiToolbarProps } from \"./ai/AiToolbar\";\nexport { AiToolbar } from \"./ai/AiToolbar\";\nexport type { AnchoredThreadsProps } from \"./comments/AnchoredThreads\";\nexport { AnchoredThreads } from \"./comments/AnchoredThreads\";\nexport type { FloatingComposerProps } from \"./comments/FloatingComposer\";\nexport { FloatingComposer } from \"./comments/FloatingComposer\";\nexport type { FloatingThreadsProps } from \"./comments/FloatingThreads\";\nexport { FloatingThreads } from \"./comments/FloatingThreads\";\nexport { useLiveblocksExtension } from \"./LiveblocksExtension\";\nexport { useIsEditorReady } from \"./LiveblocksExtension\";\nexport { MentionExtension } from \"./mentions/MentionExtension\";\nexport { MentionNode } from \"./mentions/MentionNode\";\nexport type { FloatingToolbarProps } from \"./toolbar/FloatingToolbar\";\nexport { FloatingToolbar } from \"./toolbar/FloatingToolbar\";\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 {\n AiConfiguration,\n ResolveContextualPromptArgs,\n ResolveContextualPromptResponse,\n} from \"./types\";\nexport type { HistoryVersionPreviewProps } from \"./version-history/HistoryVersionPreview\";\nexport { HistoryVersionPreview } from \"./version-history/HistoryVersionPreview\";\n\ndeclare module \"@tiptap/core\" {\n interface Commands<ReturnType> {\n liveblocksComments: CommentsCommands<ReturnType>;\n liveblocksAi: AiCommands<ReturnType>;\n }\n}\n"],"names":["detectDupes","PKG_NAME","PKG_VERSION","PKG_FORMAT"],"mappings":";;;;;;;;;;;;;;;AAKAA,gBAAY,CAAAC,gBAAA,EAAUC,qBAAaC,kBAAU,CAAA;;;;;;;;;;;;;;"}
|
package/dist/index.mjs
CHANGED
|
@@ -5,6 +5,8 @@ export { AnchoredThreads } from './comments/AnchoredThreads.mjs';
|
|
|
5
5
|
export { FloatingComposer } from './comments/FloatingComposer.mjs';
|
|
6
6
|
export { FloatingThreads } from './comments/FloatingThreads.mjs';
|
|
7
7
|
export { useIsEditorReady, useLiveblocksExtension } from './LiveblocksExtension.mjs';
|
|
8
|
+
export { MentionExtension } from './mentions/MentionExtension.mjs';
|
|
9
|
+
export { MentionNode } from './mentions/MentionNode.mjs';
|
|
8
10
|
export { FloatingToolbar } from './toolbar/FloatingToolbar.mjs';
|
|
9
11
|
export { Toolbar } from './toolbar/Toolbar.mjs';
|
|
10
12
|
export { HistoryVersionPreview } from './version-history/HistoryVersionPreview.mjs';
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport type { AiCommands, CommentsCommands } from \"./types\";\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type { AiToolbarProps } from \"./ai/AiToolbar\";\nexport { AiToolbar } from \"./ai/AiToolbar\";\nexport type { AnchoredThreadsProps } from \"./comments/AnchoredThreads\";\nexport { AnchoredThreads } from \"./comments/AnchoredThreads\";\nexport type { FloatingComposerProps } from \"./comments/FloatingComposer\";\nexport { FloatingComposer } from \"./comments/FloatingComposer\";\nexport type { FloatingThreadsProps } from \"./comments/FloatingThreads\";\nexport { FloatingThreads } from \"./comments/FloatingThreads\";\nexport { useLiveblocksExtension } from \"./LiveblocksExtension\";\nexport { useIsEditorReady } from \"./LiveblocksExtension\";\nexport type { FloatingToolbarProps } from \"./toolbar/FloatingToolbar\";\nexport { FloatingToolbar } from \"./toolbar/FloatingToolbar\";\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 {\n AiConfiguration,\n ResolveContextualPromptArgs,\n ResolveContextualPromptResponse,\n} from \"./types\";\nexport type { HistoryVersionPreviewProps } from \"./version-history/HistoryVersionPreview\";\nexport { HistoryVersionPreview } from \"./version-history/HistoryVersionPreview\";\n\ndeclare module \"@tiptap/core\" {\n interface Commands<ReturnType> {\n liveblocksComments: CommentsCommands<ReturnType>;\n liveblocksAi: AiCommands<ReturnType>;\n }\n}\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport type { AiCommands, CommentsCommands } from \"./types\";\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type { AiToolbarProps } from \"./ai/AiToolbar\";\nexport { AiToolbar } from \"./ai/AiToolbar\";\nexport type { AnchoredThreadsProps } from \"./comments/AnchoredThreads\";\nexport { AnchoredThreads } from \"./comments/AnchoredThreads\";\nexport type { FloatingComposerProps } from \"./comments/FloatingComposer\";\nexport { FloatingComposer } from \"./comments/FloatingComposer\";\nexport type { FloatingThreadsProps } from \"./comments/FloatingThreads\";\nexport { FloatingThreads } from \"./comments/FloatingThreads\";\nexport { useLiveblocksExtension } from \"./LiveblocksExtension\";\nexport { useIsEditorReady } from \"./LiveblocksExtension\";\nexport { MentionExtension } from \"./mentions/MentionExtension\";\nexport { MentionNode } from \"./mentions/MentionNode\";\nexport type { FloatingToolbarProps } from \"./toolbar/FloatingToolbar\";\nexport { FloatingToolbar } from \"./toolbar/FloatingToolbar\";\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 {\n AiConfiguration,\n ResolveContextualPromptArgs,\n ResolveContextualPromptResponse,\n} from \"./types\";\nexport type { HistoryVersionPreviewProps } from \"./version-history/HistoryVersionPreview\";\nexport { HistoryVersionPreview } from \"./version-history/HistoryVersionPreview\";\n\ndeclare module \"@tiptap/core\" {\n interface Commands<ReturnType> {\n liveblocksComments: CommentsCommands<ReturnType>;\n liveblocksAi: AiCommands<ReturnType>;\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;AAKA,WAAY,CAAA,QAAA,EAAU,aAAa,UAAU,CAAA"}
|
|
@@ -9,7 +9,7 @@ var Suggestion = require('@tiptap/suggestion');
|
|
|
9
9
|
var yProsemirror = require('y-prosemirror');
|
|
10
10
|
var types = require('../types.js');
|
|
11
11
|
var utils = require('../utils.js');
|
|
12
|
-
var
|
|
12
|
+
var MentionNode = require('./MentionNode.js');
|
|
13
13
|
var MentionsList = require('./MentionsList.js');
|
|
14
14
|
|
|
15
15
|
const mentionPasteHandler = () => {
|
|
@@ -70,75 +70,9 @@ const notifier = ({
|
|
|
70
70
|
}
|
|
71
71
|
});
|
|
72
72
|
};
|
|
73
|
-
const MentionExtension = core$1.
|
|
74
|
-
name: types.
|
|
75
|
-
group: "inline",
|
|
76
|
-
inline: true,
|
|
77
|
-
selectable: true,
|
|
78
|
-
atom: true,
|
|
73
|
+
const MentionExtension = core$1.Extension.create({
|
|
74
|
+
name: types.LIVEBLOCKS_MENTION_EXTENSION,
|
|
79
75
|
priority: 101,
|
|
80
|
-
parseHTML() {
|
|
81
|
-
return [
|
|
82
|
-
{
|
|
83
|
-
tag: "liveblocks-mention"
|
|
84
|
-
}
|
|
85
|
-
];
|
|
86
|
-
},
|
|
87
|
-
renderHTML({ HTMLAttributes }) {
|
|
88
|
-
return ["liveblocks-mention", core$1.mergeAttributes(HTMLAttributes)];
|
|
89
|
-
},
|
|
90
|
-
addNodeView() {
|
|
91
|
-
return react.ReactNodeViewRenderer(Mention.Mention, {
|
|
92
|
-
contentDOMElementTag: "span"
|
|
93
|
-
});
|
|
94
|
-
},
|
|
95
|
-
addAttributes() {
|
|
96
|
-
return {
|
|
97
|
-
id: {
|
|
98
|
-
default: null,
|
|
99
|
-
parseHTML: (element) => element.getAttribute("data-id"),
|
|
100
|
-
renderHTML: (attributes) => {
|
|
101
|
-
if (!attributes.id) {
|
|
102
|
-
return {};
|
|
103
|
-
}
|
|
104
|
-
return {
|
|
105
|
-
"data-id": attributes.id
|
|
106
|
-
};
|
|
107
|
-
}
|
|
108
|
-
},
|
|
109
|
-
notificationId: {
|
|
110
|
-
default: null,
|
|
111
|
-
parseHTML: (element) => element.getAttribute("data-notification-id"),
|
|
112
|
-
renderHTML: (attributes) => {
|
|
113
|
-
if (!attributes.notificationId) {
|
|
114
|
-
return {};
|
|
115
|
-
}
|
|
116
|
-
return {
|
|
117
|
-
"data-notification-id": attributes.notificationId
|
|
118
|
-
};
|
|
119
|
-
}
|
|
120
|
-
}
|
|
121
|
-
};
|
|
122
|
-
},
|
|
123
|
-
addKeyboardShortcuts() {
|
|
124
|
-
return {
|
|
125
|
-
Backspace: () => this.editor.commands.command(({ tr, state }) => {
|
|
126
|
-
let isMention = false;
|
|
127
|
-
const { selection } = state;
|
|
128
|
-
const { empty, anchor } = selection;
|
|
129
|
-
if (!empty) {
|
|
130
|
-
return false;
|
|
131
|
-
}
|
|
132
|
-
state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {
|
|
133
|
-
if (node.type.name === this.name) {
|
|
134
|
-
isMention = true;
|
|
135
|
-
tr.insertText("", pos, pos + node.nodeSize);
|
|
136
|
-
}
|
|
137
|
-
});
|
|
138
|
-
return isMention;
|
|
139
|
-
})
|
|
140
|
-
};
|
|
141
|
-
},
|
|
142
76
|
addOptions() {
|
|
143
77
|
return {
|
|
144
78
|
onCreateMention: () => {
|
|
@@ -147,6 +81,9 @@ const MentionExtension = core$1.Node.create({
|
|
|
147
81
|
}
|
|
148
82
|
};
|
|
149
83
|
},
|
|
84
|
+
addExtensions() {
|
|
85
|
+
return [MentionNode.MentionNode];
|
|
86
|
+
},
|
|
150
87
|
addProseMirrorPlugins() {
|
|
151
88
|
return [
|
|
152
89
|
Suggestion({
|
|
@@ -161,7 +98,7 @@ const MentionExtension = core$1.Node.create({
|
|
|
161
98
|
}
|
|
162
99
|
editor.chain().focus().insertContentAt(range, [
|
|
163
100
|
{
|
|
164
|
-
type:
|
|
101
|
+
type: types.LIVEBLOCKS_MENTION_TYPE,
|
|
165
102
|
attrs: props
|
|
166
103
|
},
|
|
167
104
|
{
|
|
@@ -173,7 +110,7 @@ const MentionExtension = core$1.Node.create({
|
|
|
173
110
|
},
|
|
174
111
|
allow: ({ state, range }) => {
|
|
175
112
|
const $from = state.doc.resolve(range.from);
|
|
176
|
-
const type = state.schema.nodes[
|
|
113
|
+
const type = state.schema.nodes[types.LIVEBLOCKS_MENTION_TYPE];
|
|
177
114
|
const allow = !!$from.parent.type.contentMatch.matchType(type);
|
|
178
115
|
return allow;
|
|
179
116
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MentionExtension.js","sources":["../../src/mentions/MentionExtension.ts"],"sourcesContent":["import { createInboxNotificationId } from \"@liveblocks/core\";\nimport {\n combineTransactionSteps,\n getChangedRanges,\n mergeAttributes,\n Node,\n} from \"@tiptap/core\";\nimport type { Node as ProseMirrorNode } from \"@tiptap/pm/model\";\nimport { Slice } from \"@tiptap/pm/model\";\nimport { Plugin } from \"@tiptap/pm/state\";\nimport { ReactNodeViewRenderer, ReactRenderer } from \"@tiptap/react\";\nimport Suggestion from \"@tiptap/suggestion\";\nimport { ySyncPluginKey } from \"y-prosemirror\";\n\nimport {\n LIVEBLOCKS_MENTION_KEY,\n LIVEBLOCKS_MENTION_NOTIFIER_KEY,\n LIVEBLOCKS_MENTION_PASTE_KEY,\n LIVEBLOCKS_MENTION_TYPE,\n} from \"../types\";\nimport { getMentionsFromNode, mapFragment } from \"../utils\";\nimport { Mention } from \"./Mention\";\nimport type { MentionsListHandle, MentionsListProps } from \"./MentionsList\";\nimport { MentionsList } from \"./MentionsList\";\n\n/**\n *\n * Handles creating new notificationIds when notifications are pasted\n *\n * @returns Plugin\n */\nconst mentionPasteHandler = (): Plugin => {\n return new Plugin({\n key: LIVEBLOCKS_MENTION_PASTE_KEY,\n props: {\n transformPasted: (slice) => {\n const getNewNotificationIds = (node: ProseMirrorNode) => {\n // If this is a mention node, we need to get a new notificatio id\n if (node.type.name === LIVEBLOCKS_MENTION_TYPE) {\n return node.type.create(\n { ...node.attrs, notificationId: createInboxNotificationId() },\n node.content\n );\n }\n return node.copy(node.content);\n };\n const fragment = mapFragment(slice.content, getNewNotificationIds);\n return new Slice(fragment, slice.openStart, slice.openEnd);\n },\n },\n });\n};\n\nexport type MentionExtensionOptions = {\n onCreateMention: (userId: string, notificationId: string) => void;\n onDeleteMention: (notificationId: string) => void;\n};\n/**\n *\n * The purpose of this plugin is to create inbox notifications when a mention is\n *\n * @returns Plugin (from @tiptap/core)\n */\nconst notifier = ({\n onCreateMention,\n onDeleteMention,\n}: MentionExtensionOptions): Plugin => {\n return new Plugin({\n key: LIVEBLOCKS_MENTION_NOTIFIER_KEY,\n appendTransaction: (transactions, oldState, newState) => {\n const docChanges =\n transactions.some((transaction) => transaction.docChanged) &&\n !oldState.doc.eq(newState.doc);\n // don't run if there was no change\n if (!docChanges) {\n return;\n }\n // don't run if from collab\n if (\n transactions.some((transaction) => transaction.getMeta(ySyncPluginKey))\n ) {\n return;\n }\n const transform = combineTransactionSteps(oldState.doc, [\n ...transactions,\n ]);\n const changes = getChangedRanges(transform);\n\n changes.forEach(({ newRange, oldRange }) => {\n const newMentions = getMentionsFromNode(newState.doc, newRange);\n const oldMentions = getMentionsFromNode(oldState.doc, oldRange);\n if (oldMentions.length || newMentions.length) {\n // create new mentions\n newMentions.forEach((mention) => {\n if (!oldMentions.includes(mention)) {\n onCreateMention(mention.userId, mention.notificationId);\n }\n });\n // delete old mentions\n oldMentions.forEach((mention) => {\n if (!newMentions.includes(mention)) {\n onDeleteMention(mention.notificationId);\n }\n });\n }\n });\n\n return undefined;\n },\n });\n};\n\nexport const MentionExtension = Node.create<MentionExtensionOptions>({\n name: LIVEBLOCKS_MENTION_TYPE,\n group: \"inline\",\n inline: true,\n selectable: true,\n atom: true,\n\n priority: 101,\n parseHTML() {\n return [\n {\n tag: \"liveblocks-mention\",\n },\n ];\n },\n\n renderHTML({ HTMLAttributes }) {\n return [\"liveblocks-mention\", mergeAttributes(HTMLAttributes)];\n },\n\n addNodeView() {\n return ReactNodeViewRenderer(Mention, {\n contentDOMElementTag: \"span\",\n });\n },\n\n addAttributes() {\n return {\n id: {\n default: null,\n parseHTML: (element) => element.getAttribute(\"data-id\"),\n renderHTML: (attributes) => {\n if (!attributes.id) {\n return {};\n }\n\n return {\n \"data-id\": attributes.id as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n };\n },\n },\n notificationId: {\n default: null,\n parseHTML: (element) => element.getAttribute(\"data-notification-id\"),\n renderHTML: (attributes) => {\n if (!attributes.notificationId) {\n return {};\n }\n\n return {\n \"data-notification-id\": attributes.notificationId as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n };\n },\n },\n };\n },\n addKeyboardShortcuts() {\n return {\n Backspace: () =>\n this.editor.commands.command(({ tr, state }) => {\n let isMention = false;\n const { selection } = state;\n const { empty, anchor } = selection;\n\n if (!empty) {\n return false;\n }\n\n state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n if (node.type.name === this.name) {\n isMention = true;\n tr.insertText(\"\", pos, pos + node.nodeSize);\n }\n });\n\n return isMention;\n }),\n };\n },\n\n addOptions() {\n return {\n onCreateMention: () => {},\n onDeleteMention: () => {},\n };\n },\n\n addProseMirrorPlugins() {\n return [\n Suggestion({\n editor: this.editor,\n char: \"@\",\n pluginKey: LIVEBLOCKS_MENTION_KEY,\n command: ({ editor, range, props }) => {\n // increase range.to by one when the next node is of type \"text\"\n // and starts with a space character\n const nodeAfter = editor.view.state.selection.$to.nodeAfter;\n const overrideSpace = nodeAfter?.text?.startsWith(\" \");\n\n if (overrideSpace) {\n range.to += 1;\n }\n\n editor\n .chain()\n .focus()\n .insertContentAt(range, [\n {\n type: this.name,\n attrs: props as Record<string, string>,\n },\n {\n type: \"text\",\n text: \" \",\n },\n ])\n .run();\n\n // get reference to `window` object from editor element, to support cross-frame JS usage\n editor.view.dom.ownerDocument.defaultView\n ?.getSelection()\n ?.collapseToEnd();\n },\n allow: ({ state, range }) => {\n const $from = state.doc.resolve(range.from);\n const type = state.schema.nodes[this.name];\n const allow = !!$from.parent.type.contentMatch.matchType(type);\n\n return allow;\n },\n allowSpaces: true,\n items: () => [], // we'll let the mentions list component do this\n render: () => {\n let component: ReactRenderer<MentionsListHandle, MentionsListProps>;\n return {\n onStart: (props) => {\n component = new ReactRenderer<\n MentionsListHandle,\n MentionsListProps\n >(MentionsList, {\n props,\n editor: props.editor,\n });\n\n if (!props.clientRect) {\n return;\n }\n\n document.body.appendChild(component.element);\n },\n\n onUpdate(props) {\n component.updateProps(props);\n },\n\n onKeyDown(props) {\n if (props.event.key === \"Escape\") {\n component.updateProps({\n ...props,\n hide: true,\n });\n return true;\n }\n return component.ref?.onKeyDown(props) ?? false;\n },\n\n onExit() {\n document.body.removeChild(component.element);\n component.destroy();\n },\n };\n },\n }),\n notifier(this.options),\n mentionPasteHandler(),\n ];\n },\n});\n"],"names":["Plugin","LIVEBLOCKS_MENTION_PASTE_KEY","LIVEBLOCKS_MENTION_TYPE","createInboxNotificationId","mapFragment","Slice","LIVEBLOCKS_MENTION_NOTIFIER_KEY","ySyncPluginKey","combineTransactionSteps","getChangedRanges","getMentionsFromNode","Node","mergeAttributes","ReactNodeViewRenderer","Mention","LIVEBLOCKS_MENTION_KEY","ReactRenderer","MentionsList"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MentionExtension.js","sources":["../../src/mentions/MentionExtension.ts"],"sourcesContent":["import { createInboxNotificationId } from \"@liveblocks/core\";\nimport {\n combineTransactionSteps,\n Extension,\n getChangedRanges,\n} from \"@tiptap/core\";\nimport type { Node as ProseMirrorNode } from \"@tiptap/pm/model\";\nimport { Slice } from \"@tiptap/pm/model\";\nimport { Plugin } from \"@tiptap/pm/state\";\nimport { ReactRenderer } from \"@tiptap/react\";\nimport Suggestion from \"@tiptap/suggestion\";\nimport { ySyncPluginKey } from \"y-prosemirror\";\n\nimport {\n LIVEBLOCKS_MENTION_EXTENSION,\n LIVEBLOCKS_MENTION_KEY,\n LIVEBLOCKS_MENTION_NOTIFIER_KEY,\n LIVEBLOCKS_MENTION_PASTE_KEY,\n LIVEBLOCKS_MENTION_TYPE,\n} from \"../types\";\nimport { getMentionsFromNode, mapFragment } from \"../utils\";\nimport { MentionNode } from \"./MentionNode\";\nimport type { MentionsListHandle, MentionsListProps } from \"./MentionsList\";\nimport { MentionsList } from \"./MentionsList\";\n\n/**\n *\n * Handles creating new notificationIds when notifications are pasted\n *\n * @returns Plugin\n */\nconst mentionPasteHandler = (): Plugin => {\n return new Plugin({\n key: LIVEBLOCKS_MENTION_PASTE_KEY,\n props: {\n transformPasted: (slice) => {\n const getNewNotificationIds = (node: ProseMirrorNode) => {\n // If this is a mention node, we need to get a new notificatio id\n if (node.type.name === LIVEBLOCKS_MENTION_TYPE) {\n return node.type.create(\n { ...node.attrs, notificationId: createInboxNotificationId() },\n node.content\n );\n }\n return node.copy(node.content);\n };\n const fragment = mapFragment(slice.content, getNewNotificationIds);\n return new Slice(fragment, slice.openStart, slice.openEnd);\n },\n },\n });\n};\n\nexport type MentionExtensionOptions = {\n onCreateMention: (userId: string, notificationId: string) => void;\n onDeleteMention: (notificationId: string) => void;\n};\n/**\n *\n * The purpose of this plugin is to create inbox notifications when a mention is\n *\n * @returns Plugin (from @tiptap/core)\n */\nconst notifier = ({\n onCreateMention,\n onDeleteMention,\n}: MentionExtensionOptions): Plugin => {\n return new Plugin({\n key: LIVEBLOCKS_MENTION_NOTIFIER_KEY,\n appendTransaction: (transactions, oldState, newState) => {\n const docChanges =\n transactions.some((transaction) => transaction.docChanged) &&\n !oldState.doc.eq(newState.doc);\n // don't run if there was no change\n if (!docChanges) {\n return;\n }\n // don't run if from collab\n if (\n transactions.some((transaction) => transaction.getMeta(ySyncPluginKey))\n ) {\n return;\n }\n const transform = combineTransactionSteps(oldState.doc, [\n ...transactions,\n ]);\n const changes = getChangedRanges(transform);\n\n changes.forEach(({ newRange, oldRange }) => {\n const newMentions = getMentionsFromNode(newState.doc, newRange);\n const oldMentions = getMentionsFromNode(oldState.doc, oldRange);\n if (oldMentions.length || newMentions.length) {\n // create new mentions\n newMentions.forEach((mention) => {\n if (!oldMentions.includes(mention)) {\n onCreateMention(mention.userId, mention.notificationId);\n }\n });\n // delete old mentions\n oldMentions.forEach((mention) => {\n if (!newMentions.includes(mention)) {\n onDeleteMention(mention.notificationId);\n }\n });\n }\n });\n\n return undefined;\n },\n });\n};\n\nexport const MentionExtension = Extension.create<MentionExtensionOptions>({\n name: LIVEBLOCKS_MENTION_EXTENSION,\n\n priority: 101,\n addOptions() {\n return {\n onCreateMention: () => {},\n onDeleteMention: () => {},\n };\n },\n\n addExtensions() {\n return [MentionNode];\n },\n\n addProseMirrorPlugins() {\n return [\n Suggestion({\n editor: this.editor,\n char: \"@\",\n pluginKey: LIVEBLOCKS_MENTION_KEY,\n command: ({ editor, range, props }) => {\n // increase range.to by one when the next node is of type \"text\"\n // and starts with a space character\n const nodeAfter = editor.view.state.selection.$to.nodeAfter;\n const overrideSpace = nodeAfter?.text?.startsWith(\" \");\n\n if (overrideSpace) {\n range.to += 1;\n }\n\n editor\n .chain()\n .focus()\n .insertContentAt(range, [\n {\n type: LIVEBLOCKS_MENTION_TYPE,\n attrs: props as Record<string, string>,\n },\n {\n type: \"text\",\n text: \" \",\n },\n ])\n .run();\n\n // get reference to `window` object from editor element, to support cross-frame JS usage\n editor.view.dom.ownerDocument.defaultView\n ?.getSelection()\n ?.collapseToEnd();\n },\n allow: ({ state, range }) => {\n const $from = state.doc.resolve(range.from);\n const type = state.schema.nodes[LIVEBLOCKS_MENTION_TYPE];\n const allow = !!$from.parent.type.contentMatch.matchType(type);\n\n return allow;\n },\n allowSpaces: true,\n items: () => [], // we'll let the mentions list component do this\n render: () => {\n let component: ReactRenderer<MentionsListHandle, MentionsListProps>;\n return {\n onStart: (props) => {\n component = new ReactRenderer<\n MentionsListHandle,\n MentionsListProps\n >(MentionsList, {\n props,\n editor: props.editor,\n });\n\n if (!props.clientRect) {\n return;\n }\n\n document.body.appendChild(component.element);\n },\n\n onUpdate(props) {\n component.updateProps(props);\n },\n\n onKeyDown(props) {\n if (props.event.key === \"Escape\") {\n component.updateProps({\n ...props,\n hide: true,\n });\n return true;\n }\n return component.ref?.onKeyDown(props) ?? false;\n },\n\n onExit() {\n document.body.removeChild(component.element);\n component.destroy();\n },\n };\n },\n }),\n notifier(this.options),\n mentionPasteHandler(),\n ];\n },\n});\n"],"names":["Plugin","LIVEBLOCKS_MENTION_PASTE_KEY","LIVEBLOCKS_MENTION_TYPE","createInboxNotificationId","mapFragment","Slice","LIVEBLOCKS_MENTION_NOTIFIER_KEY","ySyncPluginKey","combineTransactionSteps","getChangedRanges","getMentionsFromNode","Extension","LIVEBLOCKS_MENTION_EXTENSION","MentionNode","LIVEBLOCKS_MENTION_KEY","ReactRenderer","MentionsList"],"mappings":"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"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { createInboxNotificationId } from '@liveblocks/core';
|
|
2
|
-
import { combineTransactionSteps, getChangedRanges,
|
|
2
|
+
import { combineTransactionSteps, getChangedRanges, Extension } from '@tiptap/core';
|
|
3
3
|
import { Slice } from '@tiptap/pm/model';
|
|
4
4
|
import { Plugin } from '@tiptap/pm/state';
|
|
5
|
-
import {
|
|
5
|
+
import { ReactRenderer } from '@tiptap/react';
|
|
6
6
|
import Suggestion from '@tiptap/suggestion';
|
|
7
7
|
import { ySyncPluginKey } from 'y-prosemirror';
|
|
8
|
-
import { LIVEBLOCKS_MENTION_PASTE_KEY, LIVEBLOCKS_MENTION_TYPE, LIVEBLOCKS_MENTION_NOTIFIER_KEY, LIVEBLOCKS_MENTION_KEY } from '../types.mjs';
|
|
8
|
+
import { LIVEBLOCKS_MENTION_PASTE_KEY, LIVEBLOCKS_MENTION_TYPE, LIVEBLOCKS_MENTION_NOTIFIER_KEY, LIVEBLOCKS_MENTION_EXTENSION, LIVEBLOCKS_MENTION_KEY } from '../types.mjs';
|
|
9
9
|
import { mapFragment, getMentionsFromNode } from '../utils.mjs';
|
|
10
|
-
import {
|
|
10
|
+
import { MentionNode } from './MentionNode.mjs';
|
|
11
11
|
import { MentionsList } from './MentionsList.mjs';
|
|
12
12
|
|
|
13
13
|
const mentionPasteHandler = () => {
|
|
@@ -68,75 +68,9 @@ const notifier = ({
|
|
|
68
68
|
}
|
|
69
69
|
});
|
|
70
70
|
};
|
|
71
|
-
const MentionExtension =
|
|
72
|
-
name:
|
|
73
|
-
group: "inline",
|
|
74
|
-
inline: true,
|
|
75
|
-
selectable: true,
|
|
76
|
-
atom: true,
|
|
71
|
+
const MentionExtension = Extension.create({
|
|
72
|
+
name: LIVEBLOCKS_MENTION_EXTENSION,
|
|
77
73
|
priority: 101,
|
|
78
|
-
parseHTML() {
|
|
79
|
-
return [
|
|
80
|
-
{
|
|
81
|
-
tag: "liveblocks-mention"
|
|
82
|
-
}
|
|
83
|
-
];
|
|
84
|
-
},
|
|
85
|
-
renderHTML({ HTMLAttributes }) {
|
|
86
|
-
return ["liveblocks-mention", mergeAttributes(HTMLAttributes)];
|
|
87
|
-
},
|
|
88
|
-
addNodeView() {
|
|
89
|
-
return ReactNodeViewRenderer(Mention, {
|
|
90
|
-
contentDOMElementTag: "span"
|
|
91
|
-
});
|
|
92
|
-
},
|
|
93
|
-
addAttributes() {
|
|
94
|
-
return {
|
|
95
|
-
id: {
|
|
96
|
-
default: null,
|
|
97
|
-
parseHTML: (element) => element.getAttribute("data-id"),
|
|
98
|
-
renderHTML: (attributes) => {
|
|
99
|
-
if (!attributes.id) {
|
|
100
|
-
return {};
|
|
101
|
-
}
|
|
102
|
-
return {
|
|
103
|
-
"data-id": attributes.id
|
|
104
|
-
};
|
|
105
|
-
}
|
|
106
|
-
},
|
|
107
|
-
notificationId: {
|
|
108
|
-
default: null,
|
|
109
|
-
parseHTML: (element) => element.getAttribute("data-notification-id"),
|
|
110
|
-
renderHTML: (attributes) => {
|
|
111
|
-
if (!attributes.notificationId) {
|
|
112
|
-
return {};
|
|
113
|
-
}
|
|
114
|
-
return {
|
|
115
|
-
"data-notification-id": attributes.notificationId
|
|
116
|
-
};
|
|
117
|
-
}
|
|
118
|
-
}
|
|
119
|
-
};
|
|
120
|
-
},
|
|
121
|
-
addKeyboardShortcuts() {
|
|
122
|
-
return {
|
|
123
|
-
Backspace: () => this.editor.commands.command(({ tr, state }) => {
|
|
124
|
-
let isMention = false;
|
|
125
|
-
const { selection } = state;
|
|
126
|
-
const { empty, anchor } = selection;
|
|
127
|
-
if (!empty) {
|
|
128
|
-
return false;
|
|
129
|
-
}
|
|
130
|
-
state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {
|
|
131
|
-
if (node.type.name === this.name) {
|
|
132
|
-
isMention = true;
|
|
133
|
-
tr.insertText("", pos, pos + node.nodeSize);
|
|
134
|
-
}
|
|
135
|
-
});
|
|
136
|
-
return isMention;
|
|
137
|
-
})
|
|
138
|
-
};
|
|
139
|
-
},
|
|
140
74
|
addOptions() {
|
|
141
75
|
return {
|
|
142
76
|
onCreateMention: () => {
|
|
@@ -145,6 +79,9 @@ const MentionExtension = Node.create({
|
|
|
145
79
|
}
|
|
146
80
|
};
|
|
147
81
|
},
|
|
82
|
+
addExtensions() {
|
|
83
|
+
return [MentionNode];
|
|
84
|
+
},
|
|
148
85
|
addProseMirrorPlugins() {
|
|
149
86
|
return [
|
|
150
87
|
Suggestion({
|
|
@@ -159,7 +96,7 @@ const MentionExtension = Node.create({
|
|
|
159
96
|
}
|
|
160
97
|
editor.chain().focus().insertContentAt(range, [
|
|
161
98
|
{
|
|
162
|
-
type:
|
|
99
|
+
type: LIVEBLOCKS_MENTION_TYPE,
|
|
163
100
|
attrs: props
|
|
164
101
|
},
|
|
165
102
|
{
|
|
@@ -171,7 +108,7 @@ const MentionExtension = Node.create({
|
|
|
171
108
|
},
|
|
172
109
|
allow: ({ state, range }) => {
|
|
173
110
|
const $from = state.doc.resolve(range.from);
|
|
174
|
-
const type = state.schema.nodes[
|
|
111
|
+
const type = state.schema.nodes[LIVEBLOCKS_MENTION_TYPE];
|
|
175
112
|
const allow = !!$from.parent.type.contentMatch.matchType(type);
|
|
176
113
|
return allow;
|
|
177
114
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MentionExtension.mjs","sources":["../../src/mentions/MentionExtension.ts"],"sourcesContent":["import { createInboxNotificationId } from \"@liveblocks/core\";\nimport {\n combineTransactionSteps,\n getChangedRanges,\n mergeAttributes,\n Node,\n} from \"@tiptap/core\";\nimport type { Node as ProseMirrorNode } from \"@tiptap/pm/model\";\nimport { Slice } from \"@tiptap/pm/model\";\nimport { Plugin } from \"@tiptap/pm/state\";\nimport { ReactNodeViewRenderer, ReactRenderer } from \"@tiptap/react\";\nimport Suggestion from \"@tiptap/suggestion\";\nimport { ySyncPluginKey } from \"y-prosemirror\";\n\nimport {\n LIVEBLOCKS_MENTION_KEY,\n LIVEBLOCKS_MENTION_NOTIFIER_KEY,\n LIVEBLOCKS_MENTION_PASTE_KEY,\n LIVEBLOCKS_MENTION_TYPE,\n} from \"../types\";\nimport { getMentionsFromNode, mapFragment } from \"../utils\";\nimport { Mention } from \"./Mention\";\nimport type { MentionsListHandle, MentionsListProps } from \"./MentionsList\";\nimport { MentionsList } from \"./MentionsList\";\n\n/**\n *\n * Handles creating new notificationIds when notifications are pasted\n *\n * @returns Plugin\n */\nconst mentionPasteHandler = (): Plugin => {\n return new Plugin({\n key: LIVEBLOCKS_MENTION_PASTE_KEY,\n props: {\n transformPasted: (slice) => {\n const getNewNotificationIds = (node: ProseMirrorNode) => {\n // If this is a mention node, we need to get a new notificatio id\n if (node.type.name === LIVEBLOCKS_MENTION_TYPE) {\n return node.type.create(\n { ...node.attrs, notificationId: createInboxNotificationId() },\n node.content\n );\n }\n return node.copy(node.content);\n };\n const fragment = mapFragment(slice.content, getNewNotificationIds);\n return new Slice(fragment, slice.openStart, slice.openEnd);\n },\n },\n });\n};\n\nexport type MentionExtensionOptions = {\n onCreateMention: (userId: string, notificationId: string) => void;\n onDeleteMention: (notificationId: string) => void;\n};\n/**\n *\n * The purpose of this plugin is to create inbox notifications when a mention is\n *\n * @returns Plugin (from @tiptap/core)\n */\nconst notifier = ({\n onCreateMention,\n onDeleteMention,\n}: MentionExtensionOptions): Plugin => {\n return new Plugin({\n key: LIVEBLOCKS_MENTION_NOTIFIER_KEY,\n appendTransaction: (transactions, oldState, newState) => {\n const docChanges =\n transactions.some((transaction) => transaction.docChanged) &&\n !oldState.doc.eq(newState.doc);\n // don't run if there was no change\n if (!docChanges) {\n return;\n }\n // don't run if from collab\n if (\n transactions.some((transaction) => transaction.getMeta(ySyncPluginKey))\n ) {\n return;\n }\n const transform = combineTransactionSteps(oldState.doc, [\n ...transactions,\n ]);\n const changes = getChangedRanges(transform);\n\n changes.forEach(({ newRange, oldRange }) => {\n const newMentions = getMentionsFromNode(newState.doc, newRange);\n const oldMentions = getMentionsFromNode(oldState.doc, oldRange);\n if (oldMentions.length || newMentions.length) {\n // create new mentions\n newMentions.forEach((mention) => {\n if (!oldMentions.includes(mention)) {\n onCreateMention(mention.userId, mention.notificationId);\n }\n });\n // delete old mentions\n oldMentions.forEach((mention) => {\n if (!newMentions.includes(mention)) {\n onDeleteMention(mention.notificationId);\n }\n });\n }\n });\n\n return undefined;\n },\n });\n};\n\nexport const MentionExtension = Node.create<MentionExtensionOptions>({\n name: LIVEBLOCKS_MENTION_TYPE,\n group: \"inline\",\n inline: true,\n selectable: true,\n atom: true,\n\n priority: 101,\n parseHTML() {\n return [\n {\n tag: \"liveblocks-mention\",\n },\n ];\n },\n\n renderHTML({ HTMLAttributes }) {\n return [\"liveblocks-mention\", mergeAttributes(HTMLAttributes)];\n },\n\n addNodeView() {\n return ReactNodeViewRenderer(Mention, {\n contentDOMElementTag: \"span\",\n });\n },\n\n addAttributes() {\n return {\n id: {\n default: null,\n parseHTML: (element) => element.getAttribute(\"data-id\"),\n renderHTML: (attributes) => {\n if (!attributes.id) {\n return {};\n }\n\n return {\n \"data-id\": attributes.id as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n };\n },\n },\n notificationId: {\n default: null,\n parseHTML: (element) => element.getAttribute(\"data-notification-id\"),\n renderHTML: (attributes) => {\n if (!attributes.notificationId) {\n return {};\n }\n\n return {\n \"data-notification-id\": attributes.notificationId as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n };\n },\n },\n };\n },\n addKeyboardShortcuts() {\n return {\n Backspace: () =>\n this.editor.commands.command(({ tr, state }) => {\n let isMention = false;\n const { selection } = state;\n const { empty, anchor } = selection;\n\n if (!empty) {\n return false;\n }\n\n state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n if (node.type.name === this.name) {\n isMention = true;\n tr.insertText(\"\", pos, pos + node.nodeSize);\n }\n });\n\n return isMention;\n }),\n };\n },\n\n addOptions() {\n return {\n onCreateMention: () => {},\n onDeleteMention: () => {},\n };\n },\n\n addProseMirrorPlugins() {\n return [\n Suggestion({\n editor: this.editor,\n char: \"@\",\n pluginKey: LIVEBLOCKS_MENTION_KEY,\n command: ({ editor, range, props }) => {\n // increase range.to by one when the next node is of type \"text\"\n // and starts with a space character\n const nodeAfter = editor.view.state.selection.$to.nodeAfter;\n const overrideSpace = nodeAfter?.text?.startsWith(\" \");\n\n if (overrideSpace) {\n range.to += 1;\n }\n\n editor\n .chain()\n .focus()\n .insertContentAt(range, [\n {\n type: this.name,\n attrs: props as Record<string, string>,\n },\n {\n type: \"text\",\n text: \" \",\n },\n ])\n .run();\n\n // get reference to `window` object from editor element, to support cross-frame JS usage\n editor.view.dom.ownerDocument.defaultView\n ?.getSelection()\n ?.collapseToEnd();\n },\n allow: ({ state, range }) => {\n const $from = state.doc.resolve(range.from);\n const type = state.schema.nodes[this.name];\n const allow = !!$from.parent.type.contentMatch.matchType(type);\n\n return allow;\n },\n allowSpaces: true,\n items: () => [], // we'll let the mentions list component do this\n render: () => {\n let component: ReactRenderer<MentionsListHandle, MentionsListProps>;\n return {\n onStart: (props) => {\n component = new ReactRenderer<\n MentionsListHandle,\n MentionsListProps\n >(MentionsList, {\n props,\n editor: props.editor,\n });\n\n if (!props.clientRect) {\n return;\n }\n\n document.body.appendChild(component.element);\n },\n\n onUpdate(props) {\n component.updateProps(props);\n },\n\n onKeyDown(props) {\n if (props.event.key === \"Escape\") {\n component.updateProps({\n ...props,\n hide: true,\n });\n return true;\n }\n return component.ref?.onKeyDown(props) ?? false;\n },\n\n onExit() {\n document.body.removeChild(component.element);\n component.destroy();\n },\n };\n },\n }),\n notifier(this.options),\n mentionPasteHandler(),\n ];\n },\n});\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MentionExtension.mjs","sources":["../../src/mentions/MentionExtension.ts"],"sourcesContent":["import { createInboxNotificationId } from \"@liveblocks/core\";\nimport {\n combineTransactionSteps,\n Extension,\n getChangedRanges,\n} from \"@tiptap/core\";\nimport type { Node as ProseMirrorNode } from \"@tiptap/pm/model\";\nimport { Slice } from \"@tiptap/pm/model\";\nimport { Plugin } from \"@tiptap/pm/state\";\nimport { ReactRenderer } from \"@tiptap/react\";\nimport Suggestion from \"@tiptap/suggestion\";\nimport { ySyncPluginKey } from \"y-prosemirror\";\n\nimport {\n LIVEBLOCKS_MENTION_EXTENSION,\n LIVEBLOCKS_MENTION_KEY,\n LIVEBLOCKS_MENTION_NOTIFIER_KEY,\n LIVEBLOCKS_MENTION_PASTE_KEY,\n LIVEBLOCKS_MENTION_TYPE,\n} from \"../types\";\nimport { getMentionsFromNode, mapFragment } from \"../utils\";\nimport { MentionNode } from \"./MentionNode\";\nimport type { MentionsListHandle, MentionsListProps } from \"./MentionsList\";\nimport { MentionsList } from \"./MentionsList\";\n\n/**\n *\n * Handles creating new notificationIds when notifications are pasted\n *\n * @returns Plugin\n */\nconst mentionPasteHandler = (): Plugin => {\n return new Plugin({\n key: LIVEBLOCKS_MENTION_PASTE_KEY,\n props: {\n transformPasted: (slice) => {\n const getNewNotificationIds = (node: ProseMirrorNode) => {\n // If this is a mention node, we need to get a new notificatio id\n if (node.type.name === LIVEBLOCKS_MENTION_TYPE) {\n return node.type.create(\n { ...node.attrs, notificationId: createInboxNotificationId() },\n node.content\n );\n }\n return node.copy(node.content);\n };\n const fragment = mapFragment(slice.content, getNewNotificationIds);\n return new Slice(fragment, slice.openStart, slice.openEnd);\n },\n },\n });\n};\n\nexport type MentionExtensionOptions = {\n onCreateMention: (userId: string, notificationId: string) => void;\n onDeleteMention: (notificationId: string) => void;\n};\n/**\n *\n * The purpose of this plugin is to create inbox notifications when a mention is\n *\n * @returns Plugin (from @tiptap/core)\n */\nconst notifier = ({\n onCreateMention,\n onDeleteMention,\n}: MentionExtensionOptions): Plugin => {\n return new Plugin({\n key: LIVEBLOCKS_MENTION_NOTIFIER_KEY,\n appendTransaction: (transactions, oldState, newState) => {\n const docChanges =\n transactions.some((transaction) => transaction.docChanged) &&\n !oldState.doc.eq(newState.doc);\n // don't run if there was no change\n if (!docChanges) {\n return;\n }\n // don't run if from collab\n if (\n transactions.some((transaction) => transaction.getMeta(ySyncPluginKey))\n ) {\n return;\n }\n const transform = combineTransactionSteps(oldState.doc, [\n ...transactions,\n ]);\n const changes = getChangedRanges(transform);\n\n changes.forEach(({ newRange, oldRange }) => {\n const newMentions = getMentionsFromNode(newState.doc, newRange);\n const oldMentions = getMentionsFromNode(oldState.doc, oldRange);\n if (oldMentions.length || newMentions.length) {\n // create new mentions\n newMentions.forEach((mention) => {\n if (!oldMentions.includes(mention)) {\n onCreateMention(mention.userId, mention.notificationId);\n }\n });\n // delete old mentions\n oldMentions.forEach((mention) => {\n if (!newMentions.includes(mention)) {\n onDeleteMention(mention.notificationId);\n }\n });\n }\n });\n\n return undefined;\n },\n });\n};\n\nexport const MentionExtension = Extension.create<MentionExtensionOptions>({\n name: LIVEBLOCKS_MENTION_EXTENSION,\n\n priority: 101,\n addOptions() {\n return {\n onCreateMention: () => {},\n onDeleteMention: () => {},\n };\n },\n\n addExtensions() {\n return [MentionNode];\n },\n\n addProseMirrorPlugins() {\n return [\n Suggestion({\n editor: this.editor,\n char: \"@\",\n pluginKey: LIVEBLOCKS_MENTION_KEY,\n command: ({ editor, range, props }) => {\n // increase range.to by one when the next node is of type \"text\"\n // and starts with a space character\n const nodeAfter = editor.view.state.selection.$to.nodeAfter;\n const overrideSpace = nodeAfter?.text?.startsWith(\" \");\n\n if (overrideSpace) {\n range.to += 1;\n }\n\n editor\n .chain()\n .focus()\n .insertContentAt(range, [\n {\n type: LIVEBLOCKS_MENTION_TYPE,\n attrs: props as Record<string, string>,\n },\n {\n type: \"text\",\n text: \" \",\n },\n ])\n .run();\n\n // get reference to `window` object from editor element, to support cross-frame JS usage\n editor.view.dom.ownerDocument.defaultView\n ?.getSelection()\n ?.collapseToEnd();\n },\n allow: ({ state, range }) => {\n const $from = state.doc.resolve(range.from);\n const type = state.schema.nodes[LIVEBLOCKS_MENTION_TYPE];\n const allow = !!$from.parent.type.contentMatch.matchType(type);\n\n return allow;\n },\n allowSpaces: true,\n items: () => [], // we'll let the mentions list component do this\n render: () => {\n let component: ReactRenderer<MentionsListHandle, MentionsListProps>;\n return {\n onStart: (props) => {\n component = new ReactRenderer<\n MentionsListHandle,\n MentionsListProps\n >(MentionsList, {\n props,\n editor: props.editor,\n });\n\n if (!props.clientRect) {\n return;\n }\n\n document.body.appendChild(component.element);\n },\n\n onUpdate(props) {\n component.updateProps(props);\n },\n\n onKeyDown(props) {\n if (props.event.key === \"Escape\") {\n component.updateProps({\n ...props,\n hide: true,\n });\n return true;\n }\n return component.ref?.onKeyDown(props) ?? false;\n },\n\n onExit() {\n document.body.removeChild(component.element);\n component.destroy();\n },\n };\n },\n }),\n notifier(this.options),\n mentionPasteHandler(),\n ];\n },\n});\n"],"names":[],"mappings":";;;;;;;;;;;;AA+BA,MAAM,sBAAsB,MAAc;AACxC,EAAA,OAAO,IAAI,MAAO,CAAA;AAAA,IAChB,GAAK,EAAA,4BAAA;AAAA,IACL,KAAO,EAAA;AAAA,MACL,eAAA,EAAiB,CAAC,KAAU,KAAA;AAC1B,QAAM,MAAA,qBAAA,GAAwB,CAAC,IAA0B,KAAA;AAEvD,UAAI,IAAA,IAAA,CAAK,IAAK,CAAA,IAAA,KAAS,uBAAyB,EAAA;AAC9C,YAAA,OAAO,KAAK,IAAK,CAAA,MAAA;AAAA,cACf,EAAE,GAAG,IAAA,CAAK,KAAO,EAAA,cAAA,EAAgB,2BAA4B,EAAA;AAAA,cAC7D,IAAK,CAAA,OAAA;AAAA,aACP,CAAA;AAAA,WACF;AACA,UAAO,OAAA,IAAA,CAAK,IAAK,CAAA,IAAA,CAAK,OAAO,CAAA,CAAA;AAAA,SAC/B,CAAA;AACA,QAAA,MAAM,QAAW,GAAA,WAAA,CAAY,KAAM,CAAA,OAAA,EAAS,qBAAqB,CAAA,CAAA;AACjE,QAAA,OAAO,IAAI,KAAM,CAAA,QAAA,EAAU,KAAM,CAAA,SAAA,EAAW,MAAM,OAAO,CAAA,CAAA;AAAA,OAC3D;AAAA,KACF;AAAA,GACD,CAAA,CAAA;AACH,CAAA,CAAA;AAYA,MAAM,WAAW,CAAC;AAAA,EAChB,eAAA;AAAA,EACA,eAAA;AACF,CAAuC,KAAA;AACrC,EAAA,OAAO,IAAI,MAAO,CAAA;AAAA,IAChB,GAAK,EAAA,+BAAA;AAAA,IACL,iBAAmB,EAAA,CAAC,YAAc,EAAA,QAAA,EAAU,QAAa,KAAA;AACvD,MAAA,MAAM,UACJ,GAAA,YAAA,CAAa,IAAK,CAAA,CAAC,WAAgB,KAAA,WAAA,CAAY,UAAU,CAAA,IACzD,CAAC,QAAA,CAAS,GAAI,CAAA,EAAA,CAAG,SAAS,GAAG,CAAA,CAAA;AAE/B,MAAA,IAAI,CAAC,UAAY,EAAA;AACf,QAAA,OAAA;AAAA,OACF;AAEA,MACE,IAAA,YAAA,CAAa,KAAK,CAAC,WAAA,KAAgB,YAAY,OAAQ,CAAA,cAAc,CAAC,CACtE,EAAA;AACA,QAAA,OAAA;AAAA,OACF;AACA,MAAM,MAAA,SAAA,GAAY,uBAAwB,CAAA,QAAA,CAAS,GAAK,EAAA;AAAA,QACtD,GAAG,YAAA;AAAA,OACJ,CAAA,CAAA;AACD,MAAM,MAAA,OAAA,GAAU,iBAAiB,SAAS,CAAA,CAAA;AAE1C,MAAA,OAAA,CAAQ,OAAQ,CAAA,CAAC,EAAE,QAAA,EAAU,UAAe,KAAA;AAC1C,QAAA,MAAM,WAAc,GAAA,mBAAA,CAAoB,QAAS,CAAA,GAAA,EAAK,QAAQ,CAAA,CAAA;AAC9D,QAAA,MAAM,WAAc,GAAA,mBAAA,CAAoB,QAAS,CAAA,GAAA,EAAK,QAAQ,CAAA,CAAA;AAC9D,QAAI,IAAA,WAAA,CAAY,MAAU,IAAA,WAAA,CAAY,MAAQ,EAAA;AAE5C,UAAY,WAAA,CAAA,OAAA,CAAQ,CAAC,OAAY,KAAA;AAC/B,YAAA,IAAI,CAAC,WAAA,CAAY,QAAS,CAAA,OAAO,CAAG,EAAA;AAClC,cAAgB,eAAA,CAAA,OAAA,CAAQ,MAAQ,EAAA,OAAA,CAAQ,cAAc,CAAA,CAAA;AAAA,aACxD;AAAA,WACD,CAAA,CAAA;AAED,UAAY,WAAA,CAAA,OAAA,CAAQ,CAAC,OAAY,KAAA;AAC/B,YAAA,IAAI,CAAC,WAAA,CAAY,QAAS,CAAA,OAAO,CAAG,EAAA;AAClC,cAAA,eAAA,CAAgB,QAAQ,cAAc,CAAA,CAAA;AAAA,aACxC;AAAA,WACD,CAAA,CAAA;AAAA,SACH;AAAA,OACD,CAAA,CAAA;AAED,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAAA,GACD,CAAA,CAAA;AACH,CAAA,CAAA;AAEa,MAAA,gBAAA,GAAmB,UAAU,MAAgC,CAAA;AAAA,EACxE,IAAM,EAAA,4BAAA;AAAA,EAEN,QAAU,EAAA,GAAA;AAAA,EACV,UAAa,GAAA;AACX,IAAO,OAAA;AAAA,MACL,iBAAiB,MAAM;AAAA,OAAC;AAAA,MACxB,iBAAiB,MAAM;AAAA,OAAC;AAAA,KAC1B,CAAA;AAAA,GACF;AAAA,EAEA,aAAgB,GAAA;AACd,IAAA,OAAO,CAAC,WAAW,CAAA,CAAA;AAAA,GACrB;AAAA,EAEA,qBAAwB,GAAA;AACtB,IAAO,OAAA;AAAA,MACL,UAAW,CAAA;AAAA,QACT,QAAQ,IAAK,CAAA,MAAA;AAAA,QACb,IAAM,EAAA,GAAA;AAAA,QACN,SAAW,EAAA,sBAAA;AAAA,QACX,SAAS,CAAC,EAAE,MAAQ,EAAA,KAAA,EAAO,OAAY,KAAA;AAGrC,UAAA,MAAM,SAAY,GAAA,MAAA,CAAO,IAAK,CAAA,KAAA,CAAM,UAAU,GAAI,CAAA,SAAA,CAAA;AAClD,UAAA,MAAM,aAAgB,GAAA,SAAA,EAAW,IAAM,EAAA,UAAA,CAAW,GAAG,CAAA,CAAA;AAErD,UAAA,IAAI,aAAe,EAAA;AACjB,YAAA,KAAA,CAAM,EAAM,IAAA,CAAA,CAAA;AAAA,WACd;AAEA,UAAA,MAAA,CACG,KAAM,EAAA,CACN,KAAM,EAAA,CACN,gBAAgB,KAAO,EAAA;AAAA,YACtB;AAAA,cACE,IAAM,EAAA,uBAAA;AAAA,cACN,KAAO,EAAA,KAAA;AAAA,aACT;AAAA,YACA;AAAA,cACE,IAAM,EAAA,MAAA;AAAA,cACN,IAAM,EAAA,GAAA;AAAA,aACR;AAAA,WACD,EACA,GAAI,EAAA,CAAA;AAGP,UAAA,MAAA,CAAO,KAAK,GAAI,CAAA,aAAA,CAAc,WAC1B,EAAA,YAAA,IACA,aAAc,EAAA,CAAA;AAAA,SACpB;AAAA,QACA,KAAO,EAAA,CAAC,EAAE,KAAA,EAAO,OAAY,KAAA;AAC3B,UAAA,MAAM,KAAQ,GAAA,KAAA,CAAM,GAAI,CAAA,OAAA,CAAQ,MAAM,IAAI,CAAA,CAAA;AAC1C,UAAM,MAAA,IAAA,GAAO,KAAM,CAAA,MAAA,CAAO,KAAM,CAAA,uBAAA,CAAA,CAAA;AAChC,UAAM,MAAA,KAAA,GAAQ,CAAC,CAAC,KAAA,CAAM,OAAO,IAAK,CAAA,YAAA,CAAa,UAAU,IAAI,CAAA,CAAA;AAE7D,UAAO,OAAA,KAAA,CAAA;AAAA,SACT;AAAA,QACA,WAAa,EAAA,IAAA;AAAA,QACb,KAAA,EAAO,MAAM,EAAC;AAAA,QACd,QAAQ,MAAM;AACZ,UAAI,IAAA,SAAA,CAAA;AACJ,UAAO,OAAA;AAAA,YACL,OAAA,EAAS,CAAC,KAAU,KAAA;AAClB,cAAY,SAAA,GAAA,IAAI,cAGd,YAAc,EAAA;AAAA,gBACd,KAAA;AAAA,gBACA,QAAQ,KAAM,CAAA,MAAA;AAAA,eACf,CAAA,CAAA;AAED,cAAI,IAAA,CAAC,MAAM,UAAY,EAAA;AACrB,gBAAA,OAAA;AAAA,eACF;AAEA,cAAS,QAAA,CAAA,IAAA,CAAK,WAAY,CAAA,SAAA,CAAU,OAAO,CAAA,CAAA;AAAA,aAC7C;AAAA,YAEA,SAAS,KAAO,EAAA;AACd,cAAA,SAAA,CAAU,YAAY,KAAK,CAAA,CAAA;AAAA,aAC7B;AAAA,YAEA,UAAU,KAAO,EAAA;AACf,cAAI,IAAA,KAAA,CAAM,KAAM,CAAA,GAAA,KAAQ,QAAU,EAAA;AAChC,gBAAA,SAAA,CAAU,WAAY,CAAA;AAAA,kBACpB,GAAG,KAAA;AAAA,kBACH,IAAM,EAAA,IAAA;AAAA,iBACP,CAAA,CAAA;AACD,gBAAO,OAAA,IAAA,CAAA;AAAA,eACT;AACA,cAAA,OAAO,SAAU,CAAA,GAAA,EAAK,SAAU,CAAA,KAAK,CAAK,IAAA,KAAA,CAAA;AAAA,aAC5C;AAAA,YAEA,MAAS,GAAA;AACP,cAAS,QAAA,CAAA,IAAA,CAAK,WAAY,CAAA,SAAA,CAAU,OAAO,CAAA,CAAA;AAC3C,cAAA,SAAA,CAAU,OAAQ,EAAA,CAAA;AAAA,aACpB;AAAA,WACF,CAAA;AAAA,SACF;AAAA,OACD,CAAA;AAAA,MACD,QAAA,CAAS,KAAK,OAAO,CAAA;AAAA,MACrB,mBAAoB,EAAA;AAAA,KACtB,CAAA;AAAA,GACF;AACF,CAAC;;;;"}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var core = require('@tiptap/core');
|
|
4
|
+
var react = require('@tiptap/react');
|
|
5
|
+
var types = require('../types.js');
|
|
6
|
+
var Mention = require('./Mention.js');
|
|
7
|
+
|
|
8
|
+
const MentionNode = core.Node.create({
|
|
9
|
+
name: types.LIVEBLOCKS_MENTION_TYPE,
|
|
10
|
+
group: "inline",
|
|
11
|
+
inline: true,
|
|
12
|
+
selectable: true,
|
|
13
|
+
atom: true,
|
|
14
|
+
priority: 101,
|
|
15
|
+
parseHTML() {
|
|
16
|
+
return [
|
|
17
|
+
{
|
|
18
|
+
tag: "liveblocks-mention"
|
|
19
|
+
}
|
|
20
|
+
];
|
|
21
|
+
},
|
|
22
|
+
renderHTML({ HTMLAttributes }) {
|
|
23
|
+
return ["liveblocks-mention", core.mergeAttributes(HTMLAttributes)];
|
|
24
|
+
},
|
|
25
|
+
addNodeView() {
|
|
26
|
+
return react.ReactNodeViewRenderer(Mention.Mention, {
|
|
27
|
+
contentDOMElementTag: "span"
|
|
28
|
+
});
|
|
29
|
+
},
|
|
30
|
+
addAttributes() {
|
|
31
|
+
return {
|
|
32
|
+
id: {
|
|
33
|
+
default: null,
|
|
34
|
+
parseHTML: (element) => element.getAttribute("data-id"),
|
|
35
|
+
renderHTML: (attributes) => {
|
|
36
|
+
if (!attributes.id) {
|
|
37
|
+
return {};
|
|
38
|
+
}
|
|
39
|
+
return {
|
|
40
|
+
"data-id": attributes.id
|
|
41
|
+
};
|
|
42
|
+
}
|
|
43
|
+
},
|
|
44
|
+
notificationId: {
|
|
45
|
+
default: null,
|
|
46
|
+
parseHTML: (element) => element.getAttribute("data-notification-id"),
|
|
47
|
+
renderHTML: (attributes) => {
|
|
48
|
+
if (!attributes.notificationId) {
|
|
49
|
+
return {};
|
|
50
|
+
}
|
|
51
|
+
return {
|
|
52
|
+
"data-notification-id": attributes.notificationId
|
|
53
|
+
};
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
};
|
|
57
|
+
},
|
|
58
|
+
addKeyboardShortcuts() {
|
|
59
|
+
return {
|
|
60
|
+
Backspace: () => this.editor.commands.command(({ tr, state }) => {
|
|
61
|
+
let isMention = false;
|
|
62
|
+
const { selection } = state;
|
|
63
|
+
const { empty, anchor } = selection;
|
|
64
|
+
if (!empty) {
|
|
65
|
+
return false;
|
|
66
|
+
}
|
|
67
|
+
state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {
|
|
68
|
+
if (node.type.name === this.name) {
|
|
69
|
+
isMention = true;
|
|
70
|
+
tr.insertText("", pos, pos + node.nodeSize);
|
|
71
|
+
}
|
|
72
|
+
});
|
|
73
|
+
return isMention;
|
|
74
|
+
})
|
|
75
|
+
};
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
|
|
79
|
+
exports.MentionNode = MentionNode;
|
|
80
|
+
//# sourceMappingURL=MentionNode.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MentionNode.js","sources":["../../src/mentions/MentionNode.ts"],"sourcesContent":["import { mergeAttributes, Node } from \"@tiptap/core\";\nimport { ReactNodeViewRenderer } from \"@tiptap/react\";\n\nimport { LIVEBLOCKS_MENTION_TYPE } from \"../types\";\nimport { Mention } from \"./Mention\";\n\nexport const MentionNode = Node.create<never, never>({\n name: LIVEBLOCKS_MENTION_TYPE,\n group: \"inline\",\n inline: true,\n selectable: true,\n atom: true,\n\n priority: 101,\n parseHTML() {\n return [\n {\n tag: \"liveblocks-mention\",\n },\n ];\n },\n\n renderHTML({ HTMLAttributes }) {\n return [\"liveblocks-mention\", mergeAttributes(HTMLAttributes)];\n },\n\n addNodeView() {\n return ReactNodeViewRenderer(Mention, {\n contentDOMElementTag: \"span\",\n });\n },\n\n addAttributes() {\n return {\n id: {\n default: null,\n parseHTML: (element) => element.getAttribute(\"data-id\"),\n renderHTML: (attributes) => {\n if (!attributes.id) {\n return {};\n }\n\n return {\n \"data-id\": attributes.id as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n };\n },\n },\n notificationId: {\n default: null,\n parseHTML: (element) => element.getAttribute(\"data-notification-id\"),\n renderHTML: (attributes) => {\n if (!attributes.notificationId) {\n return {};\n }\n\n return {\n \"data-notification-id\": attributes.notificationId as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n };\n },\n },\n };\n },\n addKeyboardShortcuts() {\n return {\n Backspace: () =>\n this.editor.commands.command(({ tr, state }) => {\n let isMention = false;\n const { selection } = state;\n const { empty, anchor } = selection;\n\n if (!empty) {\n return false;\n }\n\n state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n if (node.type.name === this.name) {\n isMention = true;\n tr.insertText(\"\", pos, pos + node.nodeSize);\n }\n });\n\n return isMention;\n }),\n };\n },\n});\n"],"names":["Node","LIVEBLOCKS_MENTION_TYPE","mergeAttributes","ReactNodeViewRenderer","Mention"],"mappings":";;;;;;;AAMa,MAAA,WAAA,GAAcA,UAAK,MAAqB,CAAA;AAAA,EACnD,IAAM,EAAAC,6BAAA;AAAA,EACN,KAAO,EAAA,QAAA;AAAA,EACP,MAAQ,EAAA,IAAA;AAAA,EACR,UAAY,EAAA,IAAA;AAAA,EACZ,IAAM,EAAA,IAAA;AAAA,EAEN,QAAU,EAAA,GAAA;AAAA,EACV,SAAY,GAAA;AACV,IAAO,OAAA;AAAA,MACL;AAAA,QACE,GAAK,EAAA,oBAAA;AAAA,OACP;AAAA,KACF,CAAA;AAAA,GACF;AAAA,EAEA,UAAA,CAAW,EAAE,cAAA,EAAkB,EAAA;AAC7B,IAAA,OAAO,CAAC,oBAAA,EAAsBC,oBAAgB,CAAA,cAAc,CAAC,CAAA,CAAA;AAAA,GAC/D;AAAA,EAEA,WAAc,GAAA;AACZ,IAAA,OAAOC,4BAAsBC,eAAS,EAAA;AAAA,MACpC,oBAAsB,EAAA,MAAA;AAAA,KACvB,CAAA,CAAA;AAAA,GACH;AAAA,EAEA,aAAgB,GAAA;AACd,IAAO,OAAA;AAAA,MACL,EAAI,EAAA;AAAA,QACF,OAAS,EAAA,IAAA;AAAA,QACT,SAAW,EAAA,CAAC,OAAY,KAAA,OAAA,CAAQ,aAAa,SAAS,CAAA;AAAA,QACtD,UAAA,EAAY,CAAC,UAAe,KAAA;AAC1B,UAAI,IAAA,CAAC,WAAW,EAAI,EAAA;AAClB,YAAA,OAAO,EAAC,CAAA;AAAA,WACV;AAEA,UAAO,OAAA;AAAA,YACL,WAAW,UAAW,CAAA,EAAA;AAAA,WACxB,CAAA;AAAA,SACF;AAAA,OACF;AAAA,MACA,cAAgB,EAAA;AAAA,QACd,OAAS,EAAA,IAAA;AAAA,QACT,SAAW,EAAA,CAAC,OAAY,KAAA,OAAA,CAAQ,aAAa,sBAAsB,CAAA;AAAA,QACnE,UAAA,EAAY,CAAC,UAAe,KAAA;AAC1B,UAAI,IAAA,CAAC,WAAW,cAAgB,EAAA;AAC9B,YAAA,OAAO,EAAC,CAAA;AAAA,WACV;AAEA,UAAO,OAAA;AAAA,YACL,wBAAwB,UAAW,CAAA,cAAA;AAAA,WACrC,CAAA;AAAA,SACF;AAAA,OACF;AAAA,KACF,CAAA;AAAA,GACF;AAAA,EACA,oBAAuB,GAAA;AACrB,IAAO,OAAA;AAAA,MACL,SAAA,EAAW,MACT,IAAA,CAAK,MAAO,CAAA,QAAA,CAAS,QAAQ,CAAC,EAAE,EAAI,EAAA,KAAA,EAAY,KAAA;AAC9C,QAAA,IAAI,SAAY,GAAA,KAAA,CAAA;AAChB,QAAM,MAAA,EAAE,WAAc,GAAA,KAAA,CAAA;AACtB,QAAM,MAAA,EAAE,KAAO,EAAA,MAAA,EAAW,GAAA,SAAA,CAAA;AAE1B,QAAA,IAAI,CAAC,KAAO,EAAA;AACV,UAAO,OAAA,KAAA,CAAA;AAAA,SACT;AAEA,QAAA,KAAA,CAAM,IAAI,YAAa,CAAA,MAAA,GAAS,GAAG,MAAQ,EAAA,CAAC,MAAM,GAAQ,KAAA;AACxD,UAAA,IAAI,IAAK,CAAA,IAAA,CAAK,IAAS,KAAA,IAAA,CAAK,IAAM,EAAA;AAChC,YAAY,SAAA,GAAA,IAAA,CAAA;AACZ,YAAA,EAAA,CAAG,UAAW,CAAA,EAAA,EAAI,GAAK,EAAA,GAAA,GAAM,KAAK,QAAQ,CAAA,CAAA;AAAA,WAC5C;AAAA,SACD,CAAA,CAAA;AAED,QAAO,OAAA,SAAA,CAAA;AAAA,OACR,CAAA;AAAA,KACL,CAAA;AAAA,GACF;AACF,CAAC;;;;"}
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
import { Node, mergeAttributes } from '@tiptap/core';
|
|
2
|
+
import { ReactNodeViewRenderer } from '@tiptap/react';
|
|
3
|
+
import { LIVEBLOCKS_MENTION_TYPE } from '../types.mjs';
|
|
4
|
+
import { Mention } from './Mention.mjs';
|
|
5
|
+
|
|
6
|
+
const MentionNode = Node.create({
|
|
7
|
+
name: LIVEBLOCKS_MENTION_TYPE,
|
|
8
|
+
group: "inline",
|
|
9
|
+
inline: true,
|
|
10
|
+
selectable: true,
|
|
11
|
+
atom: true,
|
|
12
|
+
priority: 101,
|
|
13
|
+
parseHTML() {
|
|
14
|
+
return [
|
|
15
|
+
{
|
|
16
|
+
tag: "liveblocks-mention"
|
|
17
|
+
}
|
|
18
|
+
];
|
|
19
|
+
},
|
|
20
|
+
renderHTML({ HTMLAttributes }) {
|
|
21
|
+
return ["liveblocks-mention", mergeAttributes(HTMLAttributes)];
|
|
22
|
+
},
|
|
23
|
+
addNodeView() {
|
|
24
|
+
return ReactNodeViewRenderer(Mention, {
|
|
25
|
+
contentDOMElementTag: "span"
|
|
26
|
+
});
|
|
27
|
+
},
|
|
28
|
+
addAttributes() {
|
|
29
|
+
return {
|
|
30
|
+
id: {
|
|
31
|
+
default: null,
|
|
32
|
+
parseHTML: (element) => element.getAttribute("data-id"),
|
|
33
|
+
renderHTML: (attributes) => {
|
|
34
|
+
if (!attributes.id) {
|
|
35
|
+
return {};
|
|
36
|
+
}
|
|
37
|
+
return {
|
|
38
|
+
"data-id": attributes.id
|
|
39
|
+
};
|
|
40
|
+
}
|
|
41
|
+
},
|
|
42
|
+
notificationId: {
|
|
43
|
+
default: null,
|
|
44
|
+
parseHTML: (element) => element.getAttribute("data-notification-id"),
|
|
45
|
+
renderHTML: (attributes) => {
|
|
46
|
+
if (!attributes.notificationId) {
|
|
47
|
+
return {};
|
|
48
|
+
}
|
|
49
|
+
return {
|
|
50
|
+
"data-notification-id": attributes.notificationId
|
|
51
|
+
};
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
};
|
|
55
|
+
},
|
|
56
|
+
addKeyboardShortcuts() {
|
|
57
|
+
return {
|
|
58
|
+
Backspace: () => this.editor.commands.command(({ tr, state }) => {
|
|
59
|
+
let isMention = false;
|
|
60
|
+
const { selection } = state;
|
|
61
|
+
const { empty, anchor } = selection;
|
|
62
|
+
if (!empty) {
|
|
63
|
+
return false;
|
|
64
|
+
}
|
|
65
|
+
state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {
|
|
66
|
+
if (node.type.name === this.name) {
|
|
67
|
+
isMention = true;
|
|
68
|
+
tr.insertText("", pos, pos + node.nodeSize);
|
|
69
|
+
}
|
|
70
|
+
});
|
|
71
|
+
return isMention;
|
|
72
|
+
})
|
|
73
|
+
};
|
|
74
|
+
}
|
|
75
|
+
});
|
|
76
|
+
|
|
77
|
+
export { MentionNode };
|
|
78
|
+
//# sourceMappingURL=MentionNode.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MentionNode.mjs","sources":["../../src/mentions/MentionNode.ts"],"sourcesContent":["import { mergeAttributes, Node } from \"@tiptap/core\";\nimport { ReactNodeViewRenderer } from \"@tiptap/react\";\n\nimport { LIVEBLOCKS_MENTION_TYPE } from \"../types\";\nimport { Mention } from \"./Mention\";\n\nexport const MentionNode = Node.create<never, never>({\n name: LIVEBLOCKS_MENTION_TYPE,\n group: \"inline\",\n inline: true,\n selectable: true,\n atom: true,\n\n priority: 101,\n parseHTML() {\n return [\n {\n tag: \"liveblocks-mention\",\n },\n ];\n },\n\n renderHTML({ HTMLAttributes }) {\n return [\"liveblocks-mention\", mergeAttributes(HTMLAttributes)];\n },\n\n addNodeView() {\n return ReactNodeViewRenderer(Mention, {\n contentDOMElementTag: \"span\",\n });\n },\n\n addAttributes() {\n return {\n id: {\n default: null,\n parseHTML: (element) => element.getAttribute(\"data-id\"),\n renderHTML: (attributes) => {\n if (!attributes.id) {\n return {};\n }\n\n return {\n \"data-id\": attributes.id as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n };\n },\n },\n notificationId: {\n default: null,\n parseHTML: (element) => element.getAttribute(\"data-notification-id\"),\n renderHTML: (attributes) => {\n if (!attributes.notificationId) {\n return {};\n }\n\n return {\n \"data-notification-id\": attributes.notificationId as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n };\n },\n },\n };\n },\n addKeyboardShortcuts() {\n return {\n Backspace: () =>\n this.editor.commands.command(({ tr, state }) => {\n let isMention = false;\n const { selection } = state;\n const { empty, anchor } = selection;\n\n if (!empty) {\n return false;\n }\n\n state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n if (node.type.name === this.name) {\n isMention = true;\n tr.insertText(\"\", pos, pos + node.nodeSize);\n }\n });\n\n return isMention;\n }),\n };\n },\n});\n"],"names":[],"mappings":";;;;;AAMa,MAAA,WAAA,GAAc,KAAK,MAAqB,CAAA;AAAA,EACnD,IAAM,EAAA,uBAAA;AAAA,EACN,KAAO,EAAA,QAAA;AAAA,EACP,MAAQ,EAAA,IAAA;AAAA,EACR,UAAY,EAAA,IAAA;AAAA,EACZ,IAAM,EAAA,IAAA;AAAA,EAEN,QAAU,EAAA,GAAA;AAAA,EACV,SAAY,GAAA;AACV,IAAO,OAAA;AAAA,MACL;AAAA,QACE,GAAK,EAAA,oBAAA;AAAA,OACP;AAAA,KACF,CAAA;AAAA,GACF;AAAA,EAEA,UAAA,CAAW,EAAE,cAAA,EAAkB,EAAA;AAC7B,IAAA,OAAO,CAAC,oBAAA,EAAsB,eAAgB,CAAA,cAAc,CAAC,CAAA,CAAA;AAAA,GAC/D;AAAA,EAEA,WAAc,GAAA;AACZ,IAAA,OAAO,sBAAsB,OAAS,EAAA;AAAA,MACpC,oBAAsB,EAAA,MAAA;AAAA,KACvB,CAAA,CAAA;AAAA,GACH;AAAA,EAEA,aAAgB,GAAA;AACd,IAAO,OAAA;AAAA,MACL,EAAI,EAAA;AAAA,QACF,OAAS,EAAA,IAAA;AAAA,QACT,SAAW,EAAA,CAAC,OAAY,KAAA,OAAA,CAAQ,aAAa,SAAS,CAAA;AAAA,QACtD,UAAA,EAAY,CAAC,UAAe,KAAA;AAC1B,UAAI,IAAA,CAAC,WAAW,EAAI,EAAA;AAClB,YAAA,OAAO,EAAC,CAAA;AAAA,WACV;AAEA,UAAO,OAAA;AAAA,YACL,WAAW,UAAW,CAAA,EAAA;AAAA,WACxB,CAAA;AAAA,SACF;AAAA,OACF;AAAA,MACA,cAAgB,EAAA;AAAA,QACd,OAAS,EAAA,IAAA;AAAA,QACT,SAAW,EAAA,CAAC,OAAY,KAAA,OAAA,CAAQ,aAAa,sBAAsB,CAAA;AAAA,QACnE,UAAA,EAAY,CAAC,UAAe,KAAA;AAC1B,UAAI,IAAA,CAAC,WAAW,cAAgB,EAAA;AAC9B,YAAA,OAAO,EAAC,CAAA;AAAA,WACV;AAEA,UAAO,OAAA;AAAA,YACL,wBAAwB,UAAW,CAAA,cAAA;AAAA,WACrC,CAAA;AAAA,SACF;AAAA,OACF;AAAA,KACF,CAAA;AAAA,GACF;AAAA,EACA,oBAAuB,GAAA;AACrB,IAAO,OAAA;AAAA,MACL,SAAA,EAAW,MACT,IAAA,CAAK,MAAO,CAAA,QAAA,CAAS,QAAQ,CAAC,EAAE,EAAI,EAAA,KAAA,EAAY,KAAA;AAC9C,QAAA,IAAI,SAAY,GAAA,KAAA,CAAA;AAChB,QAAM,MAAA,EAAE,WAAc,GAAA,KAAA,CAAA;AACtB,QAAM,MAAA,EAAE,KAAO,EAAA,MAAA,EAAW,GAAA,SAAA,CAAA;AAE1B,QAAA,IAAI,CAAC,KAAO,EAAA;AACV,UAAO,OAAA,KAAA,CAAA;AAAA,SACT;AAEA,QAAA,KAAA,CAAM,IAAI,YAAa,CAAA,MAAA,GAAS,GAAG,MAAQ,EAAA,CAAC,MAAM,GAAQ,KAAA;AACxD,UAAA,IAAI,IAAK,CAAA,IAAA,CAAK,IAAS,KAAA,IAAA,CAAK,IAAM,EAAA;AAChC,YAAY,SAAA,GAAA,IAAA,CAAA;AACZ,YAAA,EAAA,CAAG,UAAW,CAAA,EAAA,EAAI,GAAK,EAAA,GAAA,GAAM,KAAK,QAAQ,CAAA,CAAA;AAAA,WAC5C;AAAA,SACD,CAAA,CAAA;AAED,QAAO,OAAA,SAAA,CAAA;AAAA,OACR,CAAA;AAAA,KACL,CAAA;AAAA,GACF;AACF,CAAC;;;;"}
|
package/dist/types.js
CHANGED
|
@@ -9,6 +9,7 @@ const LIVEBLOCKS_MENTION_PASTE_KEY = new state.PluginKey(
|
|
|
9
9
|
const LIVEBLOCKS_MENTION_NOTIFIER_KEY = new state.PluginKey(
|
|
10
10
|
"lb-plugin-mention-notify"
|
|
11
11
|
);
|
|
12
|
+
const LIVEBLOCKS_MENTION_EXTENSION = "liveblocksMentionExt";
|
|
12
13
|
const LIVEBLOCKS_MENTION_TYPE = "liveblocksMention";
|
|
13
14
|
const THREADS_ACTIVE_SELECTION_PLUGIN = new state.PluginKey(
|
|
14
15
|
"lb-threads-active-selection-plugin"
|
|
@@ -27,6 +28,7 @@ var ThreadPluginActions = /* @__PURE__ */ ((ThreadPluginActions2) => {
|
|
|
27
28
|
|
|
28
29
|
exports.AI_TOOLBAR_SELECTION_PLUGIN = AI_TOOLBAR_SELECTION_PLUGIN;
|
|
29
30
|
exports.LIVEBLOCKS_COMMENT_MARK_TYPE = LIVEBLOCKS_COMMENT_MARK_TYPE;
|
|
31
|
+
exports.LIVEBLOCKS_MENTION_EXTENSION = LIVEBLOCKS_MENTION_EXTENSION;
|
|
30
32
|
exports.LIVEBLOCKS_MENTION_KEY = LIVEBLOCKS_MENTION_KEY;
|
|
31
33
|
exports.LIVEBLOCKS_MENTION_NOTIFIER_KEY = LIVEBLOCKS_MENTION_NOTIFIER_KEY;
|
|
32
34
|
exports.LIVEBLOCKS_MENTION_PASTE_KEY = LIVEBLOCKS_MENTION_PASTE_KEY;
|
package/dist/types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sources":["../src/types.ts"],"sourcesContent":["import type {\n ContextualPromptContext,\n ContextualPromptResponse,\n Relax,\n} from \"@liveblocks/core\";\nimport type { LiveblocksYjsProvider } from \"@liveblocks/yjs\";\nimport type { Content, Range } from \"@tiptap/core\";\nimport { PluginKey } from \"@tiptap/pm/state\";\nimport type { DecorationSet } from \"@tiptap/pm/view\";\nimport type { ChainedCommands, SingleCommands } from \"@tiptap/react\";\nimport type { ProsemirrorBinding } from \"y-prosemirror\";\nimport type { Doc, PermanentUserData, Snapshot } from \"yjs\";\n\nexport const LIVEBLOCKS_MENTION_KEY = new PluginKey(\"lb-plugin-mention\");\nexport const LIVEBLOCKS_MENTION_PASTE_KEY = new PluginKey(\n \"lb-plugin-mention-paste\"\n);\nexport const LIVEBLOCKS_MENTION_NOTIFIER_KEY = new PluginKey(\n \"lb-plugin-mention-notify\"\n);\nexport const LIVEBLOCKS_MENTION_TYPE = \"liveblocksMention\";\n\nexport const THREADS_ACTIVE_SELECTION_PLUGIN = new PluginKey(\n \"lb-threads-active-selection-plugin\"\n);\nexport const THREADS_PLUGIN_KEY = new PluginKey<ThreadPluginState>(\n \"lb-threads-plugin\"\n);\nexport const AI_TOOLBAR_SELECTION_PLUGIN = new PluginKey(\n \"lb-ai-toolbar-selection-plugin\"\n);\n\nexport const LIVEBLOCKS_COMMENT_MARK_TYPE = \"liveblocksCommentMark\";\n\n/**\n * @beta\n */\nexport type ResolveContextualPromptArgs = {\n /**\n * The prompt being requested by the user.\n */\n prompt: string;\n\n /**\n * The context of the document and its current selection.\n */\n context: ContextualPromptContext;\n\n /**\n * The previous request and its response, if this is a follow-up request.\n */\n previous?: {\n prompt: string;\n response: ContextualPromptResponse;\n };\n\n /**\n * An abort signal that can be used to cancel requests.\n */\n signal: AbortSignal;\n};\n\n/**\n * @beta\n */\nexport type ResolveContextualPromptResponse = ContextualPromptResponse;\n\nexport interface AiConfiguration {\n /**\n * The AI's name. (\"Ask {name} anything…\", \"{name} is thinking…\", etc)\n */\n name?: string;\n\n /**\n * A function that returns an a response to a contextual prompt.\n */\n resolveContextualPrompt?: (\n args: ResolveContextualPromptArgs\n ) => Promise<ContextualPromptResponse>;\n}\n\nexport type LiveblocksExtensionOptions = {\n field?: string;\n comments?: boolean; // | CommentsConfiguration\n mentions?: boolean; // | MentionsConfiguration\n ai?: boolean | AiConfiguration;\n offlineSupport_experimental?: boolean;\n initialContent?: Content;\n};\n\nexport type LiveblocksExtensionStorage = {\n unsubs: (() => void)[];\n doc: Doc;\n provider: LiveblocksYjsProvider;\n permanentUserData: PermanentUserData;\n};\n\nexport type CommentsExtensionStorage = {\n pendingComment: boolean;\n};\n\nexport const enum ThreadPluginActions {\n SET_SELECTED_THREAD_ID = \"SET_SELECTED_THREAD_ID\",\n}\n\nexport type AiExtensionOptions = Required<\n Pick<AiConfiguration, \"name\" | \"resolveContextualPrompt\">\n> & {\n doc: Doc | undefined;\n pud: PermanentUserData | undefined;\n};\n\n/**\n * The state of the AI toolbar.\n *\n * ┌────────────────────────────────────────────────────────────────────────────────┐\n * │ │\n * │ ┌──────────────────────────────────────────────┐ │\n * ▼ ▼ │ │\n * ┌───────$closeAiToolbar()───────┐ │ │\n * ▼ ◇ ◇ ◇\n * ┌───────────────────────┐ ┌───────────────────────┐ ┌───────────────────────┐ ┌───────────────────────┐\n * │ CLOSED │ │ ASKING │ │ THINKING │ │ REVIEWING │\n * └───────────────────────┘ └───────────────────────┘ └───────────────────────┘ └───────────────────────┘\n * ▲ ◇ ◇ ▲ ▲ ◇ ▲ ▲ ◇ ▲ ◇ ◇\n * │ │ └───$openAiToolbarAsking()──┘ │ │ └ ─ ─ ─ ─ ─ ─⚠─ ─ ─ ─ ─ ─ ─│─├── ─ ─ ─ ─ ─ ─✓─ ─ ─ ─ ─ ─ ─ ┘ │ │\n * │ │ │ ▼ │ │ │ │\n * │ └─────────────────$startAiToolbarThinking(prompt)──────────────┘ │ │ │\n * │ │ ▲ │ │ │\n * │ │ └──────────────────────────────┼───────────────────────────────┘ │\n * │ │ │ │\n * │ └───$cancelAiToolbarThinking()───┘ │\n * │ │\n * └─────────────────────────────────────$acceptAiToolbarResponse()─────────────────────────────────────┘\n *\n */\nexport type AiToolbarState = Relax<\n | {\n phase: \"closed\";\n }\n | {\n phase: \"asking\";\n\n /**\n * The selection stored when opening the AI toolbar.\n */\n initialSelection: Range;\n\n /**\n * The custom prompt being written in the toolbar.\n */\n customPrompt: string;\n\n /**\n * A potential error that occurred during the last AI request.\n */\n error?: Error;\n }\n | {\n phase: \"thinking\";\n\n /**\n * The selection stored when opening the AI toolbar.\n */\n initialSelection: Range;\n\n /**\n * The custom prompt being written in the toolbar.\n */\n customPrompt: string;\n\n /**\n * An abort controller to cancel the AI request.\n */\n abortController: AbortController;\n\n /**\n * The prompt sent to the AI.\n */\n prompt: string;\n\n /**\n * The previous response if this \"thinking\" phase is a refinement.\n */\n previousResponse?: ContextualPromptResponse;\n }\n | {\n phase: \"reviewing\";\n\n /**\n * The selection stored when opening the AI toolbar.\n */\n initialSelection: Range;\n\n /**\n * The custom prompt being written in the toolbar.\n */\n customPrompt: string;\n\n /**\n * The prompt sent to the AI.\n */\n prompt: string;\n\n /**\n * The response of the AI request.\n */\n response: ContextualPromptResponse;\n }\n>;\n\nexport type AiExtensionStorage = {\n name: string;\n state: AiToolbarState;\n snapshot?: Snapshot;\n};\n\nexport type ThreadPluginState = {\n threadPositions: Map<string, { from: number; to: number }>;\n selectedThreadId: string | null;\n selectedThreadPos: number | null;\n decorations: DecorationSet;\n};\n\nexport type FloatingPosition = \"top\" | \"bottom\";\n\nexport type ExtendedCommands<\n T extends string,\n A extends any[] = [],\n> = SingleCommands & Record<T, (...args: A) => boolean>;\n\nexport type ExtendedChainedCommands<\n T extends string,\n A extends any[] = [],\n> = ChainedCommands & Record<T, (...args: A) => ChainedCommands>;\n\nexport type ChainedAiCommands = ChainedCommands & {\n [K in keyof AiCommands]: (\n ...args: Parameters<AiCommands[K]>\n ) => ChainedCommands;\n};\n\nexport type CommentsCommands<ReturnType = boolean> = {\n /**\n * Add a comment\n */\n addComment: (id: string) => ReturnType;\n selectThread: (id: string | null) => ReturnType;\n addPendingComment: () => ReturnType;\n\n /** @internal */\n closePendingComment: () => ReturnType;\n};\n\nexport type AiCommands<ReturnType = boolean> = {\n askAi: (prompt?: string) => ReturnType;\n\n // Transitions (see AiToolbarState)\n\n /**\n * @internal\n * @transition\n *\n * Close the AI toolbar.\n */\n $closeAiToolbar: () => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Accept the current AI response and close the AI toolbar.\n */\n $acceptAiToolbarResponse: () => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Open the AI toolbar in the \"asking\" phase.\n */\n $openAiToolbarAsking: () => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Set (and open if not already open) the AI toolbar in the \"thinking\" phase with the given prompt.\n */\n $startAiToolbarThinking: (\n prompt: string,\n withPreviousResponse?: boolean\n ) => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Cancel the current \"thinking\" phase, going back to the \"asking\" phase.\n */\n $cancelAiToolbarThinking: () => ReturnType;\n\n // Other\n\n /**\n * @internal\n *\n * Show the diff of the current \"reviewing\" phase.\n */\n _showAiToolbarReviewingDiff: () => ReturnType;\n\n /**\n * @internal\n *\n * Handle the success of the current \"thinking\" phase.\n */\n _handleAiToolbarThinkingSuccess: (\n response: ContextualPromptResponse\n ) => ReturnType;\n\n /**\n * @internal\n *\n * Handle an error of the current \"thinking\" phase.\n */\n _handleAiToolbarThinkingError: (error: unknown) => ReturnType;\n\n /**\n * @internal\n *\n * Update the current custom AI prompt.\n */\n _updateAiToolbarCustomPrompt: (\n customPrompt: string | ((currentCustomPrompt: string) => string)\n ) => ReturnType;\n};\n\nexport type YSyncPluginState = {\n binding: ProsemirrorBinding;\n};\n"],"names":["PluginKey","ThreadPluginActions"],"mappings":";;;;AAaa,MAAA,sBAAA,GAAyB,IAAIA,eAAA,CAAU,mBAAmB,EAAA;AAChE,MAAM,+BAA+B,IAAIA,eAAA;AAAA,EAC9C,yBAAA;AACF,EAAA;AACO,MAAM,kCAAkC,IAAIA,eAAA;AAAA,EACjD,0BAAA;AACF,EAAA;AACO,MAAM,uBAA0B,GAAA,oBAAA;AAEhC,MAAM,kCAAkC,IAAIA,eAAA;AAAA,EACjD,oCAAA;AACF,EAAA;AACO,MAAM,qBAAqB,IAAIA,eAAA;AAAA,EACpC,mBAAA;AACF,EAAA;AACO,MAAM,8BAA8B,IAAIA,eAAA;AAAA,EAC7C,gCAAA;AACF,EAAA;AAEO,MAAM,4BAA+B,GAAA,wBAAA;AAqE1B,IAAA,mBAAA,qBAAAC,oBAAX,KAAA;AACL,EAAAA,qBAAA,wBAAyB,CAAA,GAAA,wBAAA,CAAA;AADT,EAAAA,OAAAA,oBAAAA,CAAAA;AAAA,CAAA,EAAA,mBAAA,IAAA,EAAA;;;;;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"types.js","sources":["../src/types.ts"],"sourcesContent":["import type {\n ContextualPromptContext,\n ContextualPromptResponse,\n Relax,\n} from \"@liveblocks/core\";\nimport type { LiveblocksYjsProvider } from \"@liveblocks/yjs\";\nimport type { Content, Range } from \"@tiptap/core\";\nimport { PluginKey } from \"@tiptap/pm/state\";\nimport type { DecorationSet } from \"@tiptap/pm/view\";\nimport type { ChainedCommands, SingleCommands } from \"@tiptap/react\";\nimport type { ProsemirrorBinding } from \"y-prosemirror\";\nimport type { Doc, PermanentUserData, Snapshot } from \"yjs\";\n\nexport const LIVEBLOCKS_MENTION_KEY = new PluginKey(\"lb-plugin-mention\");\nexport const LIVEBLOCKS_MENTION_PASTE_KEY = new PluginKey(\n \"lb-plugin-mention-paste\"\n);\nexport const LIVEBLOCKS_MENTION_NOTIFIER_KEY = new PluginKey(\n \"lb-plugin-mention-notify\"\n);\n\nexport const LIVEBLOCKS_MENTION_EXTENSION = \"liveblocksMentionExt\";\nexport const LIVEBLOCKS_MENTION_TYPE = \"liveblocksMention\";\n\nexport const THREADS_ACTIVE_SELECTION_PLUGIN = new PluginKey(\n \"lb-threads-active-selection-plugin\"\n);\nexport const THREADS_PLUGIN_KEY = new PluginKey<ThreadPluginState>(\n \"lb-threads-plugin\"\n);\nexport const AI_TOOLBAR_SELECTION_PLUGIN = new PluginKey(\n \"lb-ai-toolbar-selection-plugin\"\n);\n\nexport const LIVEBLOCKS_COMMENT_MARK_TYPE = \"liveblocksCommentMark\";\n\n/**\n * @beta\n */\nexport type ResolveContextualPromptArgs = {\n /**\n * The prompt being requested by the user.\n */\n prompt: string;\n\n /**\n * The context of the document and its current selection.\n */\n context: ContextualPromptContext;\n\n /**\n * The previous request and its response, if this is a follow-up request.\n */\n previous?: {\n prompt: string;\n response: ContextualPromptResponse;\n };\n\n /**\n * An abort signal that can be used to cancel requests.\n */\n signal: AbortSignal;\n};\n\n/**\n * @beta\n */\nexport type ResolveContextualPromptResponse = ContextualPromptResponse;\n\nexport interface AiConfiguration {\n /**\n * The AI's name. (\"Ask {name} anything…\", \"{name} is thinking…\", etc)\n */\n name?: string;\n\n /**\n * A function that returns an a response to a contextual prompt.\n */\n resolveContextualPrompt?: (\n args: ResolveContextualPromptArgs\n ) => Promise<ContextualPromptResponse>;\n}\n\nexport type LiveblocksExtensionOptions = {\n field?: string;\n comments?: boolean; // | CommentsConfiguration\n mentions?: boolean; // | MentionsConfiguration\n ai?: boolean | AiConfiguration;\n offlineSupport_experimental?: boolean;\n initialContent?: Content;\n};\n\nexport type LiveblocksExtensionStorage = {\n unsubs: (() => void)[];\n doc: Doc;\n provider: LiveblocksYjsProvider;\n permanentUserData: PermanentUserData;\n};\n\nexport type CommentsExtensionStorage = {\n pendingComment: boolean;\n};\n\nexport const enum ThreadPluginActions {\n SET_SELECTED_THREAD_ID = \"SET_SELECTED_THREAD_ID\",\n}\n\nexport type AiExtensionOptions = Required<\n Pick<AiConfiguration, \"name\" | \"resolveContextualPrompt\">\n> & {\n doc: Doc | undefined;\n pud: PermanentUserData | undefined;\n};\n\n/**\n * The state of the AI toolbar.\n *\n * ┌────────────────────────────────────────────────────────────────────────────────┐\n * │ │\n * │ ┌──────────────────────────────────────────────┐ │\n * ▼ ▼ │ │\n * ┌───────$closeAiToolbar()───────┐ │ │\n * ▼ ◇ ◇ ◇\n * ┌───────────────────────┐ ┌───────────────────────┐ ┌───────────────────────┐ ┌───────────────────────┐\n * │ CLOSED │ │ ASKING │ │ THINKING │ │ REVIEWING │\n * └───────────────────────┘ └───────────────────────┘ └───────────────────────┘ └───────────────────────┘\n * ▲ ◇ ◇ ▲ ▲ ◇ ▲ ▲ ◇ ▲ ◇ ◇\n * │ │ └───$openAiToolbarAsking()──┘ │ │ └ ─ ─ ─ ─ ─ ─⚠─ ─ ─ ─ ─ ─ ─│─├── ─ ─ ─ ─ ─ ─✓─ ─ ─ ─ ─ ─ ─ ┘ │ │\n * │ │ │ ▼ │ │ │ │\n * │ └─────────────────$startAiToolbarThinking(prompt)──────────────┘ │ │ │\n * │ │ ▲ │ │ │\n * │ │ └──────────────────────────────┼───────────────────────────────┘ │\n * │ │ │ │\n * │ └───$cancelAiToolbarThinking()───┘ │\n * │ │\n * └─────────────────────────────────────$acceptAiToolbarResponse()─────────────────────────────────────┘\n *\n */\nexport type AiToolbarState = Relax<\n | {\n phase: \"closed\";\n }\n | {\n phase: \"asking\";\n\n /**\n * The selection stored when opening the AI toolbar.\n */\n initialSelection: Range;\n\n /**\n * The custom prompt being written in the toolbar.\n */\n customPrompt: string;\n\n /**\n * A potential error that occurred during the last AI request.\n */\n error?: Error;\n }\n | {\n phase: \"thinking\";\n\n /**\n * The selection stored when opening the AI toolbar.\n */\n initialSelection: Range;\n\n /**\n * The custom prompt being written in the toolbar.\n */\n customPrompt: string;\n\n /**\n * An abort controller to cancel the AI request.\n */\n abortController: AbortController;\n\n /**\n * The prompt sent to the AI.\n */\n prompt: string;\n\n /**\n * The previous response if this \"thinking\" phase is a refinement.\n */\n previousResponse?: ContextualPromptResponse;\n }\n | {\n phase: \"reviewing\";\n\n /**\n * The selection stored when opening the AI toolbar.\n */\n initialSelection: Range;\n\n /**\n * The custom prompt being written in the toolbar.\n */\n customPrompt: string;\n\n /**\n * The prompt sent to the AI.\n */\n prompt: string;\n\n /**\n * The response of the AI request.\n */\n response: ContextualPromptResponse;\n }\n>;\n\nexport type AiExtensionStorage = {\n name: string;\n state: AiToolbarState;\n snapshot?: Snapshot;\n};\n\nexport type ThreadPluginState = {\n threadPositions: Map<string, { from: number; to: number }>;\n selectedThreadId: string | null;\n selectedThreadPos: number | null;\n decorations: DecorationSet;\n};\n\nexport type FloatingPosition = \"top\" | \"bottom\";\n\nexport type ExtendedCommands<\n T extends string,\n A extends any[] = [],\n> = SingleCommands & Record<T, (...args: A) => boolean>;\n\nexport type ExtendedChainedCommands<\n T extends string,\n A extends any[] = [],\n> = ChainedCommands & Record<T, (...args: A) => ChainedCommands>;\n\nexport type ChainedAiCommands = ChainedCommands & {\n [K in keyof AiCommands]: (\n ...args: Parameters<AiCommands[K]>\n ) => ChainedCommands;\n};\n\nexport type CommentsCommands<ReturnType = boolean> = {\n /**\n * Add a comment\n */\n addComment: (id: string) => ReturnType;\n selectThread: (id: string | null) => ReturnType;\n addPendingComment: () => ReturnType;\n\n /** @internal */\n closePendingComment: () => ReturnType;\n};\n\nexport type AiCommands<ReturnType = boolean> = {\n askAi: (prompt?: string) => ReturnType;\n\n // Transitions (see AiToolbarState)\n\n /**\n * @internal\n * @transition\n *\n * Close the AI toolbar.\n */\n $closeAiToolbar: () => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Accept the current AI response and close the AI toolbar.\n */\n $acceptAiToolbarResponse: () => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Open the AI toolbar in the \"asking\" phase.\n */\n $openAiToolbarAsking: () => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Set (and open if not already open) the AI toolbar in the \"thinking\" phase with the given prompt.\n */\n $startAiToolbarThinking: (\n prompt: string,\n withPreviousResponse?: boolean\n ) => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Cancel the current \"thinking\" phase, going back to the \"asking\" phase.\n */\n $cancelAiToolbarThinking: () => ReturnType;\n\n // Other\n\n /**\n * @internal\n *\n * Show the diff of the current \"reviewing\" phase.\n */\n _showAiToolbarReviewingDiff: () => ReturnType;\n\n /**\n * @internal\n *\n * Handle the success of the current \"thinking\" phase.\n */\n _handleAiToolbarThinkingSuccess: (\n response: ContextualPromptResponse\n ) => ReturnType;\n\n /**\n * @internal\n *\n * Handle an error of the current \"thinking\" phase.\n */\n _handleAiToolbarThinkingError: (error: unknown) => ReturnType;\n\n /**\n * @internal\n *\n * Update the current custom AI prompt.\n */\n _updateAiToolbarCustomPrompt: (\n customPrompt: string | ((currentCustomPrompt: string) => string)\n ) => ReturnType;\n};\n\nexport type YSyncPluginState = {\n binding: ProsemirrorBinding;\n};\n"],"names":["PluginKey","ThreadPluginActions"],"mappings":";;;;AAaa,MAAA,sBAAA,GAAyB,IAAIA,eAAA,CAAU,mBAAmB,EAAA;AAChE,MAAM,+BAA+B,IAAIA,eAAA;AAAA,EAC9C,yBAAA;AACF,EAAA;AACO,MAAM,kCAAkC,IAAIA,eAAA;AAAA,EACjD,0BAAA;AACF,EAAA;AAEO,MAAM,4BAA+B,GAAA,uBAAA;AACrC,MAAM,uBAA0B,GAAA,oBAAA;AAEhC,MAAM,kCAAkC,IAAIA,eAAA;AAAA,EACjD,oCAAA;AACF,EAAA;AACO,MAAM,qBAAqB,IAAIA,eAAA;AAAA,EACpC,mBAAA;AACF,EAAA;AACO,MAAM,8BAA8B,IAAIA,eAAA;AAAA,EAC7C,gCAAA;AACF,EAAA;AAEO,MAAM,4BAA+B,GAAA,wBAAA;AAqE1B,IAAA,mBAAA,qBAAAC,oBAAX,KAAA;AACL,EAAAA,qBAAA,wBAAyB,CAAA,GAAA,wBAAA,CAAA;AADT,EAAAA,OAAAA,oBAAAA,CAAAA;AAAA,CAAA,EAAA,mBAAA,IAAA,EAAA;;;;;;;;;;;;;"}
|
package/dist/types.mjs
CHANGED
|
@@ -7,6 +7,7 @@ const LIVEBLOCKS_MENTION_PASTE_KEY = new PluginKey(
|
|
|
7
7
|
const LIVEBLOCKS_MENTION_NOTIFIER_KEY = new PluginKey(
|
|
8
8
|
"lb-plugin-mention-notify"
|
|
9
9
|
);
|
|
10
|
+
const LIVEBLOCKS_MENTION_EXTENSION = "liveblocksMentionExt";
|
|
10
11
|
const LIVEBLOCKS_MENTION_TYPE = "liveblocksMention";
|
|
11
12
|
const THREADS_ACTIVE_SELECTION_PLUGIN = new PluginKey(
|
|
12
13
|
"lb-threads-active-selection-plugin"
|
|
@@ -23,5 +24,5 @@ var ThreadPluginActions = /* @__PURE__ */ ((ThreadPluginActions2) => {
|
|
|
23
24
|
return ThreadPluginActions2;
|
|
24
25
|
})(ThreadPluginActions || {});
|
|
25
26
|
|
|
26
|
-
export { AI_TOOLBAR_SELECTION_PLUGIN, LIVEBLOCKS_COMMENT_MARK_TYPE, LIVEBLOCKS_MENTION_KEY, LIVEBLOCKS_MENTION_NOTIFIER_KEY, LIVEBLOCKS_MENTION_PASTE_KEY, LIVEBLOCKS_MENTION_TYPE, THREADS_ACTIVE_SELECTION_PLUGIN, THREADS_PLUGIN_KEY, ThreadPluginActions };
|
|
27
|
+
export { AI_TOOLBAR_SELECTION_PLUGIN, LIVEBLOCKS_COMMENT_MARK_TYPE, LIVEBLOCKS_MENTION_EXTENSION, LIVEBLOCKS_MENTION_KEY, LIVEBLOCKS_MENTION_NOTIFIER_KEY, LIVEBLOCKS_MENTION_PASTE_KEY, LIVEBLOCKS_MENTION_TYPE, THREADS_ACTIVE_SELECTION_PLUGIN, THREADS_PLUGIN_KEY, ThreadPluginActions };
|
|
27
28
|
//# sourceMappingURL=types.mjs.map
|
package/dist/types.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.mjs","sources":["../src/types.ts"],"sourcesContent":["import type {\n ContextualPromptContext,\n ContextualPromptResponse,\n Relax,\n} from \"@liveblocks/core\";\nimport type { LiveblocksYjsProvider } from \"@liveblocks/yjs\";\nimport type { Content, Range } from \"@tiptap/core\";\nimport { PluginKey } from \"@tiptap/pm/state\";\nimport type { DecorationSet } from \"@tiptap/pm/view\";\nimport type { ChainedCommands, SingleCommands } from \"@tiptap/react\";\nimport type { ProsemirrorBinding } from \"y-prosemirror\";\nimport type { Doc, PermanentUserData, Snapshot } from \"yjs\";\n\nexport const LIVEBLOCKS_MENTION_KEY = new PluginKey(\"lb-plugin-mention\");\nexport const LIVEBLOCKS_MENTION_PASTE_KEY = new PluginKey(\n \"lb-plugin-mention-paste\"\n);\nexport const LIVEBLOCKS_MENTION_NOTIFIER_KEY = new PluginKey(\n \"lb-plugin-mention-notify\"\n);\nexport const LIVEBLOCKS_MENTION_TYPE = \"liveblocksMention\";\n\nexport const THREADS_ACTIVE_SELECTION_PLUGIN = new PluginKey(\n \"lb-threads-active-selection-plugin\"\n);\nexport const THREADS_PLUGIN_KEY = new PluginKey<ThreadPluginState>(\n \"lb-threads-plugin\"\n);\nexport const AI_TOOLBAR_SELECTION_PLUGIN = new PluginKey(\n \"lb-ai-toolbar-selection-plugin\"\n);\n\nexport const LIVEBLOCKS_COMMENT_MARK_TYPE = \"liveblocksCommentMark\";\n\n/**\n * @beta\n */\nexport type ResolveContextualPromptArgs = {\n /**\n * The prompt being requested by the user.\n */\n prompt: string;\n\n /**\n * The context of the document and its current selection.\n */\n context: ContextualPromptContext;\n\n /**\n * The previous request and its response, if this is a follow-up request.\n */\n previous?: {\n prompt: string;\n response: ContextualPromptResponse;\n };\n\n /**\n * An abort signal that can be used to cancel requests.\n */\n signal: AbortSignal;\n};\n\n/**\n * @beta\n */\nexport type ResolveContextualPromptResponse = ContextualPromptResponse;\n\nexport interface AiConfiguration {\n /**\n * The AI's name. (\"Ask {name} anything…\", \"{name} is thinking…\", etc)\n */\n name?: string;\n\n /**\n * A function that returns an a response to a contextual prompt.\n */\n resolveContextualPrompt?: (\n args: ResolveContextualPromptArgs\n ) => Promise<ContextualPromptResponse>;\n}\n\nexport type LiveblocksExtensionOptions = {\n field?: string;\n comments?: boolean; // | CommentsConfiguration\n mentions?: boolean; // | MentionsConfiguration\n ai?: boolean | AiConfiguration;\n offlineSupport_experimental?: boolean;\n initialContent?: Content;\n};\n\nexport type LiveblocksExtensionStorage = {\n unsubs: (() => void)[];\n doc: Doc;\n provider: LiveblocksYjsProvider;\n permanentUserData: PermanentUserData;\n};\n\nexport type CommentsExtensionStorage = {\n pendingComment: boolean;\n};\n\nexport const enum ThreadPluginActions {\n SET_SELECTED_THREAD_ID = \"SET_SELECTED_THREAD_ID\",\n}\n\nexport type AiExtensionOptions = Required<\n Pick<AiConfiguration, \"name\" | \"resolveContextualPrompt\">\n> & {\n doc: Doc | undefined;\n pud: PermanentUserData | undefined;\n};\n\n/**\n * The state of the AI toolbar.\n *\n * ┌────────────────────────────────────────────────────────────────────────────────┐\n * │ │\n * │ ┌──────────────────────────────────────────────┐ │\n * ▼ ▼ │ │\n * ┌───────$closeAiToolbar()───────┐ │ │\n * ▼ ◇ ◇ ◇\n * ┌───────────────────────┐ ┌───────────────────────┐ ┌───────────────────────┐ ┌───────────────────────┐\n * │ CLOSED │ │ ASKING │ │ THINKING │ │ REVIEWING │\n * └───────────────────────┘ └───────────────────────┘ └───────────────────────┘ └───────────────────────┘\n * ▲ ◇ ◇ ▲ ▲ ◇ ▲ ▲ ◇ ▲ ◇ ◇\n * │ │ └───$openAiToolbarAsking()──┘ │ │ └ ─ ─ ─ ─ ─ ─⚠─ ─ ─ ─ ─ ─ ─│─├── ─ ─ ─ ─ ─ ─✓─ ─ ─ ─ ─ ─ ─ ┘ │ │\n * │ │ │ ▼ │ │ │ │\n * │ └─────────────────$startAiToolbarThinking(prompt)──────────────┘ │ │ │\n * │ │ ▲ │ │ │\n * │ │ └──────────────────────────────┼───────────────────────────────┘ │\n * │ │ │ │\n * │ └───$cancelAiToolbarThinking()───┘ │\n * │ │\n * └─────────────────────────────────────$acceptAiToolbarResponse()─────────────────────────────────────┘\n *\n */\nexport type AiToolbarState = Relax<\n | {\n phase: \"closed\";\n }\n | {\n phase: \"asking\";\n\n /**\n * The selection stored when opening the AI toolbar.\n */\n initialSelection: Range;\n\n /**\n * The custom prompt being written in the toolbar.\n */\n customPrompt: string;\n\n /**\n * A potential error that occurred during the last AI request.\n */\n error?: Error;\n }\n | {\n phase: \"thinking\";\n\n /**\n * The selection stored when opening the AI toolbar.\n */\n initialSelection: Range;\n\n /**\n * The custom prompt being written in the toolbar.\n */\n customPrompt: string;\n\n /**\n * An abort controller to cancel the AI request.\n */\n abortController: AbortController;\n\n /**\n * The prompt sent to the AI.\n */\n prompt: string;\n\n /**\n * The previous response if this \"thinking\" phase is a refinement.\n */\n previousResponse?: ContextualPromptResponse;\n }\n | {\n phase: \"reviewing\";\n\n /**\n * The selection stored when opening the AI toolbar.\n */\n initialSelection: Range;\n\n /**\n * The custom prompt being written in the toolbar.\n */\n customPrompt: string;\n\n /**\n * The prompt sent to the AI.\n */\n prompt: string;\n\n /**\n * The response of the AI request.\n */\n response: ContextualPromptResponse;\n }\n>;\n\nexport type AiExtensionStorage = {\n name: string;\n state: AiToolbarState;\n snapshot?: Snapshot;\n};\n\nexport type ThreadPluginState = {\n threadPositions: Map<string, { from: number; to: number }>;\n selectedThreadId: string | null;\n selectedThreadPos: number | null;\n decorations: DecorationSet;\n};\n\nexport type FloatingPosition = \"top\" | \"bottom\";\n\nexport type ExtendedCommands<\n T extends string,\n A extends any[] = [],\n> = SingleCommands & Record<T, (...args: A) => boolean>;\n\nexport type ExtendedChainedCommands<\n T extends string,\n A extends any[] = [],\n> = ChainedCommands & Record<T, (...args: A) => ChainedCommands>;\n\nexport type ChainedAiCommands = ChainedCommands & {\n [K in keyof AiCommands]: (\n ...args: Parameters<AiCommands[K]>\n ) => ChainedCommands;\n};\n\nexport type CommentsCommands<ReturnType = boolean> = {\n /**\n * Add a comment\n */\n addComment: (id: string) => ReturnType;\n selectThread: (id: string | null) => ReturnType;\n addPendingComment: () => ReturnType;\n\n /** @internal */\n closePendingComment: () => ReturnType;\n};\n\nexport type AiCommands<ReturnType = boolean> = {\n askAi: (prompt?: string) => ReturnType;\n\n // Transitions (see AiToolbarState)\n\n /**\n * @internal\n * @transition\n *\n * Close the AI toolbar.\n */\n $closeAiToolbar: () => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Accept the current AI response and close the AI toolbar.\n */\n $acceptAiToolbarResponse: () => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Open the AI toolbar in the \"asking\" phase.\n */\n $openAiToolbarAsking: () => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Set (and open if not already open) the AI toolbar in the \"thinking\" phase with the given prompt.\n */\n $startAiToolbarThinking: (\n prompt: string,\n withPreviousResponse?: boolean\n ) => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Cancel the current \"thinking\" phase, going back to the \"asking\" phase.\n */\n $cancelAiToolbarThinking: () => ReturnType;\n\n // Other\n\n /**\n * @internal\n *\n * Show the diff of the current \"reviewing\" phase.\n */\n _showAiToolbarReviewingDiff: () => ReturnType;\n\n /**\n * @internal\n *\n * Handle the success of the current \"thinking\" phase.\n */\n _handleAiToolbarThinkingSuccess: (\n response: ContextualPromptResponse\n ) => ReturnType;\n\n /**\n * @internal\n *\n * Handle an error of the current \"thinking\" phase.\n */\n _handleAiToolbarThinkingError: (error: unknown) => ReturnType;\n\n /**\n * @internal\n *\n * Update the current custom AI prompt.\n */\n _updateAiToolbarCustomPrompt: (\n customPrompt: string | ((currentCustomPrompt: string) => string)\n ) => ReturnType;\n};\n\nexport type YSyncPluginState = {\n binding: ProsemirrorBinding;\n};\n"],"names":["ThreadPluginActions"],"mappings":";;AAaa,MAAA,sBAAA,GAAyB,IAAI,SAAA,CAAU,mBAAmB,EAAA;AAChE,MAAM,+BAA+B,IAAI,SAAA;AAAA,EAC9C,yBAAA;AACF,EAAA;AACO,MAAM,kCAAkC,IAAI,SAAA;AAAA,EACjD,0BAAA;AACF,EAAA;AACO,MAAM,uBAA0B,GAAA,oBAAA;AAEhC,MAAM,kCAAkC,IAAI,SAAA;AAAA,EACjD,oCAAA;AACF,EAAA;AACO,MAAM,qBAAqB,IAAI,SAAA;AAAA,EACpC,mBAAA;AACF,EAAA;AACO,MAAM,8BAA8B,IAAI,SAAA;AAAA,EAC7C,gCAAA;AACF,EAAA;AAEO,MAAM,4BAA+B,GAAA,wBAAA;AAqE1B,IAAA,mBAAA,qBAAAA,oBAAX,KAAA;AACL,EAAAA,qBAAA,wBAAyB,CAAA,GAAA,wBAAA,CAAA;AADT,EAAAA,OAAAA,oBAAAA,CAAAA;AAAA,CAAA,EAAA,mBAAA,IAAA,EAAA;;;;"}
|
|
1
|
+
{"version":3,"file":"types.mjs","sources":["../src/types.ts"],"sourcesContent":["import type {\n ContextualPromptContext,\n ContextualPromptResponse,\n Relax,\n} from \"@liveblocks/core\";\nimport type { LiveblocksYjsProvider } from \"@liveblocks/yjs\";\nimport type { Content, Range } from \"@tiptap/core\";\nimport { PluginKey } from \"@tiptap/pm/state\";\nimport type { DecorationSet } from \"@tiptap/pm/view\";\nimport type { ChainedCommands, SingleCommands } from \"@tiptap/react\";\nimport type { ProsemirrorBinding } from \"y-prosemirror\";\nimport type { Doc, PermanentUserData, Snapshot } from \"yjs\";\n\nexport const LIVEBLOCKS_MENTION_KEY = new PluginKey(\"lb-plugin-mention\");\nexport const LIVEBLOCKS_MENTION_PASTE_KEY = new PluginKey(\n \"lb-plugin-mention-paste\"\n);\nexport const LIVEBLOCKS_MENTION_NOTIFIER_KEY = new PluginKey(\n \"lb-plugin-mention-notify\"\n);\n\nexport const LIVEBLOCKS_MENTION_EXTENSION = \"liveblocksMentionExt\";\nexport const LIVEBLOCKS_MENTION_TYPE = \"liveblocksMention\";\n\nexport const THREADS_ACTIVE_SELECTION_PLUGIN = new PluginKey(\n \"lb-threads-active-selection-plugin\"\n);\nexport const THREADS_PLUGIN_KEY = new PluginKey<ThreadPluginState>(\n \"lb-threads-plugin\"\n);\nexport const AI_TOOLBAR_SELECTION_PLUGIN = new PluginKey(\n \"lb-ai-toolbar-selection-plugin\"\n);\n\nexport const LIVEBLOCKS_COMMENT_MARK_TYPE = \"liveblocksCommentMark\";\n\n/**\n * @beta\n */\nexport type ResolveContextualPromptArgs = {\n /**\n * The prompt being requested by the user.\n */\n prompt: string;\n\n /**\n * The context of the document and its current selection.\n */\n context: ContextualPromptContext;\n\n /**\n * The previous request and its response, if this is a follow-up request.\n */\n previous?: {\n prompt: string;\n response: ContextualPromptResponse;\n };\n\n /**\n * An abort signal that can be used to cancel requests.\n */\n signal: AbortSignal;\n};\n\n/**\n * @beta\n */\nexport type ResolveContextualPromptResponse = ContextualPromptResponse;\n\nexport interface AiConfiguration {\n /**\n * The AI's name. (\"Ask {name} anything…\", \"{name} is thinking…\", etc)\n */\n name?: string;\n\n /**\n * A function that returns an a response to a contextual prompt.\n */\n resolveContextualPrompt?: (\n args: ResolveContextualPromptArgs\n ) => Promise<ContextualPromptResponse>;\n}\n\nexport type LiveblocksExtensionOptions = {\n field?: string;\n comments?: boolean; // | CommentsConfiguration\n mentions?: boolean; // | MentionsConfiguration\n ai?: boolean | AiConfiguration;\n offlineSupport_experimental?: boolean;\n initialContent?: Content;\n};\n\nexport type LiveblocksExtensionStorage = {\n unsubs: (() => void)[];\n doc: Doc;\n provider: LiveblocksYjsProvider;\n permanentUserData: PermanentUserData;\n};\n\nexport type CommentsExtensionStorage = {\n pendingComment: boolean;\n};\n\nexport const enum ThreadPluginActions {\n SET_SELECTED_THREAD_ID = \"SET_SELECTED_THREAD_ID\",\n}\n\nexport type AiExtensionOptions = Required<\n Pick<AiConfiguration, \"name\" | \"resolveContextualPrompt\">\n> & {\n doc: Doc | undefined;\n pud: PermanentUserData | undefined;\n};\n\n/**\n * The state of the AI toolbar.\n *\n * ┌────────────────────────────────────────────────────────────────────────────────┐\n * │ │\n * │ ┌──────────────────────────────────────────────┐ │\n * ▼ ▼ │ │\n * ┌───────$closeAiToolbar()───────┐ │ │\n * ▼ ◇ ◇ ◇\n * ┌───────────────────────┐ ┌───────────────────────┐ ┌───────────────────────┐ ┌───────────────────────┐\n * │ CLOSED │ │ ASKING │ │ THINKING │ │ REVIEWING │\n * └───────────────────────┘ └───────────────────────┘ └───────────────────────┘ └───────────────────────┘\n * ▲ ◇ ◇ ▲ ▲ ◇ ▲ ▲ ◇ ▲ ◇ ◇\n * │ │ └───$openAiToolbarAsking()──┘ │ │ └ ─ ─ ─ ─ ─ ─⚠─ ─ ─ ─ ─ ─ ─│─├── ─ ─ ─ ─ ─ ─✓─ ─ ─ ─ ─ ─ ─ ┘ │ │\n * │ │ │ ▼ │ │ │ │\n * │ └─────────────────$startAiToolbarThinking(prompt)──────────────┘ │ │ │\n * │ │ ▲ │ │ │\n * │ │ └──────────────────────────────┼───────────────────────────────┘ │\n * │ │ │ │\n * │ └───$cancelAiToolbarThinking()───┘ │\n * │ │\n * └─────────────────────────────────────$acceptAiToolbarResponse()─────────────────────────────────────┘\n *\n */\nexport type AiToolbarState = Relax<\n | {\n phase: \"closed\";\n }\n | {\n phase: \"asking\";\n\n /**\n * The selection stored when opening the AI toolbar.\n */\n initialSelection: Range;\n\n /**\n * The custom prompt being written in the toolbar.\n */\n customPrompt: string;\n\n /**\n * A potential error that occurred during the last AI request.\n */\n error?: Error;\n }\n | {\n phase: \"thinking\";\n\n /**\n * The selection stored when opening the AI toolbar.\n */\n initialSelection: Range;\n\n /**\n * The custom prompt being written in the toolbar.\n */\n customPrompt: string;\n\n /**\n * An abort controller to cancel the AI request.\n */\n abortController: AbortController;\n\n /**\n * The prompt sent to the AI.\n */\n prompt: string;\n\n /**\n * The previous response if this \"thinking\" phase is a refinement.\n */\n previousResponse?: ContextualPromptResponse;\n }\n | {\n phase: \"reviewing\";\n\n /**\n * The selection stored when opening the AI toolbar.\n */\n initialSelection: Range;\n\n /**\n * The custom prompt being written in the toolbar.\n */\n customPrompt: string;\n\n /**\n * The prompt sent to the AI.\n */\n prompt: string;\n\n /**\n * The response of the AI request.\n */\n response: ContextualPromptResponse;\n }\n>;\n\nexport type AiExtensionStorage = {\n name: string;\n state: AiToolbarState;\n snapshot?: Snapshot;\n};\n\nexport type ThreadPluginState = {\n threadPositions: Map<string, { from: number; to: number }>;\n selectedThreadId: string | null;\n selectedThreadPos: number | null;\n decorations: DecorationSet;\n};\n\nexport type FloatingPosition = \"top\" | \"bottom\";\n\nexport type ExtendedCommands<\n T extends string,\n A extends any[] = [],\n> = SingleCommands & Record<T, (...args: A) => boolean>;\n\nexport type ExtendedChainedCommands<\n T extends string,\n A extends any[] = [],\n> = ChainedCommands & Record<T, (...args: A) => ChainedCommands>;\n\nexport type ChainedAiCommands = ChainedCommands & {\n [K in keyof AiCommands]: (\n ...args: Parameters<AiCommands[K]>\n ) => ChainedCommands;\n};\n\nexport type CommentsCommands<ReturnType = boolean> = {\n /**\n * Add a comment\n */\n addComment: (id: string) => ReturnType;\n selectThread: (id: string | null) => ReturnType;\n addPendingComment: () => ReturnType;\n\n /** @internal */\n closePendingComment: () => ReturnType;\n};\n\nexport type AiCommands<ReturnType = boolean> = {\n askAi: (prompt?: string) => ReturnType;\n\n // Transitions (see AiToolbarState)\n\n /**\n * @internal\n * @transition\n *\n * Close the AI toolbar.\n */\n $closeAiToolbar: () => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Accept the current AI response and close the AI toolbar.\n */\n $acceptAiToolbarResponse: () => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Open the AI toolbar in the \"asking\" phase.\n */\n $openAiToolbarAsking: () => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Set (and open if not already open) the AI toolbar in the \"thinking\" phase with the given prompt.\n */\n $startAiToolbarThinking: (\n prompt: string,\n withPreviousResponse?: boolean\n ) => ReturnType;\n\n /**\n * @internal\n * @transition\n *\n * Cancel the current \"thinking\" phase, going back to the \"asking\" phase.\n */\n $cancelAiToolbarThinking: () => ReturnType;\n\n // Other\n\n /**\n * @internal\n *\n * Show the diff of the current \"reviewing\" phase.\n */\n _showAiToolbarReviewingDiff: () => ReturnType;\n\n /**\n * @internal\n *\n * Handle the success of the current \"thinking\" phase.\n */\n _handleAiToolbarThinkingSuccess: (\n response: ContextualPromptResponse\n ) => ReturnType;\n\n /**\n * @internal\n *\n * Handle an error of the current \"thinking\" phase.\n */\n _handleAiToolbarThinkingError: (error: unknown) => ReturnType;\n\n /**\n * @internal\n *\n * Update the current custom AI prompt.\n */\n _updateAiToolbarCustomPrompt: (\n customPrompt: string | ((currentCustomPrompt: string) => string)\n ) => ReturnType;\n};\n\nexport type YSyncPluginState = {\n binding: ProsemirrorBinding;\n};\n"],"names":["ThreadPluginActions"],"mappings":";;AAaa,MAAA,sBAAA,GAAyB,IAAI,SAAA,CAAU,mBAAmB,EAAA;AAChE,MAAM,+BAA+B,IAAI,SAAA;AAAA,EAC9C,yBAAA;AACF,EAAA;AACO,MAAM,kCAAkC,IAAI,SAAA;AAAA,EACjD,0BAAA;AACF,EAAA;AAEO,MAAM,4BAA+B,GAAA,uBAAA;AACrC,MAAM,uBAA0B,GAAA,oBAAA;AAEhC,MAAM,kCAAkC,IAAI,SAAA;AAAA,EACjD,oCAAA;AACF,EAAA;AACO,MAAM,qBAAqB,IAAI,SAAA;AAAA,EACpC,mBAAA;AACF,EAAA;AACO,MAAM,8BAA8B,IAAI,SAAA;AAAA,EAC7C,gCAAA;AACF,EAAA;AAEO,MAAM,4BAA+B,GAAA,wBAAA;AAqE1B,IAAA,mBAAA,qBAAAA,oBAAX,KAAA;AACL,EAAAA,qBAAA,wBAAyB,CAAA,GAAA,wBAAA,CAAA;AADT,EAAAA,OAAAA,oBAAAA,CAAAA;AAAA,CAAA,EAAA,mBAAA,IAAA,EAAA;;;;"}
|
package/dist/version.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
const PKG_NAME = "@liveblocks/react-tiptap";
|
|
4
|
-
const PKG_VERSION = typeof "2.18.
|
|
4
|
+
const PKG_VERSION = typeof "2.18.2-test1" === "string" && "2.18.2-test1";
|
|
5
5
|
const PKG_FORMAT = typeof "cjs" === "string" && "cjs";
|
|
6
6
|
|
|
7
7
|
exports.PKG_FORMAT = PKG_FORMAT;
|
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-tiptap\";\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,2BAAA;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-tiptap\";\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,2BAAA;AACX,MAAA,WAAA,GAAc,OAAO,cAAA,KAAgB,QAAY,IAAA,eAAA;AACjD,MAAA,UAAA,GAAa,OAAO,KAAA,KAAkB,QAAY,IAAA;;;;;;"}
|
package/dist/version.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const PKG_NAME = "@liveblocks/react-tiptap";
|
|
2
|
-
const PKG_VERSION = typeof "2.18.
|
|
2
|
+
const PKG_VERSION = typeof "2.18.2-test1" === "string" && "2.18.2-test1";
|
|
3
3
|
const PKG_FORMAT = typeof "esm" === "string" && "esm";
|
|
4
4
|
|
|
5
5
|
export { PKG_FORMAT, PKG_NAME, PKG_VERSION };
|
package/dist/version.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.mjs","sources":["../src/version.ts"],"sourcesContent":["declare const __VERSION__: string;\ndeclare const ROLLUP_FORMAT: string;\n\nexport const PKG_NAME = \"@liveblocks/react-tiptap\";\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,2BAAA;AACX,MAAA,WAAA,GAAc,OAAO,
|
|
1
|
+
{"version":3,"file":"version.mjs","sources":["../src/version.ts"],"sourcesContent":["declare const __VERSION__: string;\ndeclare const ROLLUP_FORMAT: string;\n\nexport const PKG_NAME = \"@liveblocks/react-tiptap\";\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,2BAAA;AACX,MAAA,WAAA,GAAc,OAAO,cAAA,KAAgB,QAAY,IAAA,eAAA;AACjD,MAAA,UAAA,GAAa,OAAO,KAAA,KAAkB,QAAY,IAAA;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@liveblocks/react-tiptap",
|
|
3
|
-
"version": "2.18.
|
|
3
|
+
"version": "2.18.2-test1",
|
|
4
4
|
"description": "A tiptap react plugin to enable collaboration, comments, live cursors, and more.",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"type": "commonjs",
|
|
@@ -42,11 +42,11 @@
|
|
|
42
42
|
},
|
|
43
43
|
"dependencies": {
|
|
44
44
|
"@floating-ui/react-dom": "^2.1.2",
|
|
45
|
-
"@liveblocks/client": "2.18.
|
|
46
|
-
"@liveblocks/core": "2.18.
|
|
47
|
-
"@liveblocks/react": "2.18.
|
|
48
|
-
"@liveblocks/react-ui": "2.18.
|
|
49
|
-
"@liveblocks/yjs": "2.18.
|
|
45
|
+
"@liveblocks/client": "2.18.2-test1",
|
|
46
|
+
"@liveblocks/core": "2.18.2-test1",
|
|
47
|
+
"@liveblocks/react": "2.18.2-test1",
|
|
48
|
+
"@liveblocks/react-ui": "2.18.2-test1",
|
|
49
|
+
"@liveblocks/yjs": "2.18.2-test1",
|
|
50
50
|
"@radix-ui/react-select": "^2.1.2",
|
|
51
51
|
"@radix-ui/react-toggle": "^1.1.0",
|
|
52
52
|
"@tiptap/core": "^2.7.2",
|