@liveblocks/react-tiptap 2.16.0-toolbars4 → 2.17.0-channels1
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/LiveblocksExtension.js.map +1 -1
- package/dist/LiveblocksExtension.mjs.map +1 -1
- package/dist/comments/CommentsExtension.js +11 -20
- package/dist/comments/CommentsExtension.js.map +1 -1
- package/dist/comments/CommentsExtension.mjs +13 -22
- package/dist/comments/CommentsExtension.mjs.map +1 -1
- package/dist/comments/FloatingComposer.js +30 -27
- package/dist/comments/FloatingComposer.js.map +1 -1
- package/dist/comments/FloatingComposer.mjs +32 -29
- package/dist/comments/FloatingComposer.mjs.map +1 -1
- package/dist/index.d.mts +10 -254
- package/dist/index.d.ts +10 -254
- package/dist/index.js +0 -4
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +0 -2
- package/dist/index.mjs.map +1 -1
- package/dist/types.js +3 -7
- package/dist/types.js.map +1 -1
- package/dist/types.mjs +3 -6
- package/dist/types.mjs.map +1 -1
- package/dist/utils.js +0 -17
- package/dist/utils.js.map +1 -1
- package/dist/utils.mjs +1 -16
- package/dist/utils.mjs.map +1 -1
- package/dist/version-history/HistoryVersionPreview.js +79 -79
- package/dist/version-history/HistoryVersionPreview.js.map +1 -1
- package/dist/version-history/HistoryVersionPreview.mjs +79 -79
- package/dist/version-history/HistoryVersionPreview.mjs.map +1 -1
- package/dist/version.js +1 -1
- package/dist/version.mjs +1 -1
- package/package.json +6 -8
- package/src/styles/constants.css +1 -2
- package/src/styles/index.css +6 -58
- package/src/styles/utils.css +0 -11
- package/styles.css +1 -1
- package/styles.css.map +1 -1
- package/dist/context.js +0 -24
- package/dist/context.js.map +0 -1
- package/dist/context.mjs +0 -21
- package/dist/context.mjs.map +0 -1
- package/dist/toolbar/FloatingToolbar.js +0 -321
- package/dist/toolbar/FloatingToolbar.js.map +0 -1
- package/dist/toolbar/FloatingToolbar.mjs +0 -318
- package/dist/toolbar/FloatingToolbar.mjs.map +0 -1
- package/dist/toolbar/Toolbar.js +0 -396
- package/dist/toolbar/Toolbar.js.map +0 -1
- package/dist/toolbar/Toolbar.mjs +0 -371
- package/dist/toolbar/Toolbar.mjs.map +0 -1
- package/dist/toolbar/shared.js +0 -39
- package/dist/toolbar/shared.js.map +0 -1
- package/dist/toolbar/shared.mjs +0 -36
- package/dist/toolbar/shared.mjs.map +0 -1
|
@@ -11,87 +11,87 @@ var yjs = require('yjs');
|
|
|
11
11
|
var classnames = require('../classnames.js');
|
|
12
12
|
|
|
13
13
|
const AUTHORS_TRUNCATE = 3;
|
|
14
|
-
const HistoryVersionPreview = react.forwardRef(
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
"lb-
|
|
44
|
-
|
|
45
|
-
),
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
userId: author.id,
|
|
69
|
-
replaceSelf: true
|
|
70
|
-
}, author.id)),
|
|
71
|
-
formatRemaining: $.LIST_REMAINING_USERS,
|
|
72
|
-
truncate: AUTHORS_TRUNCATE,
|
|
73
|
-
locale: $.locale
|
|
74
|
-
})
|
|
75
|
-
)
|
|
76
|
-
}),
|
|
77
|
-
/* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
78
|
-
className: "lb-history-version-preview-actions",
|
|
79
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(_private.Button, {
|
|
80
|
-
onClick: restore,
|
|
81
|
-
disabled: !data,
|
|
82
|
-
variant: "primary",
|
|
83
|
-
size: "large",
|
|
84
|
-
className: "lb-history-version-preview-action",
|
|
85
|
-
icon: /* @__PURE__ */ jsxRuntime.jsx(_private.RestoreIcon, {}),
|
|
86
|
-
children: $.HISTORY_VERSION_PREVIEW_RESTORE
|
|
14
|
+
const HistoryVersionPreview = react.forwardRef(({ version, editor: parentEditor, onVersionRestore, className, ...props }, forwardedRef) => {
|
|
15
|
+
const $ = reactUi.useOverrides();
|
|
16
|
+
const { isLoading, data, error } = react$1.useHistoryVersionData(version.id);
|
|
17
|
+
const previewEditor = react$2.useEditor({
|
|
18
|
+
editable: false,
|
|
19
|
+
extensions: parentEditor.extensionManager.extensions.filter((e) => e.type !== "extension")
|
|
20
|
+
});
|
|
21
|
+
react.useEffect(() => {
|
|
22
|
+
if (data && previewEditor) {
|
|
23
|
+
const doc = new yjs.Doc();
|
|
24
|
+
yjs.applyUpdate(doc, data);
|
|
25
|
+
const root = doc.getXmlFragment("default");
|
|
26
|
+
const node = yProsemirror.yXmlFragmentToProseMirrorRootNode(root, parentEditor.schema);
|
|
27
|
+
previewEditor.commands.setContent(node.toJSON());
|
|
28
|
+
}
|
|
29
|
+
}, [data, previewEditor, parentEditor]);
|
|
30
|
+
const restore = react.useCallback(() => {
|
|
31
|
+
parentEditor.commands.setContent(previewEditor?.getJSON() ?? "");
|
|
32
|
+
onVersionRestore?.(version);
|
|
33
|
+
}, [onVersionRestore, parentEditor, previewEditor, version]);
|
|
34
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", {
|
|
35
|
+
...props,
|
|
36
|
+
className: classnames.classNames(
|
|
37
|
+
"lb-root lb-history-version-preview lb-tiptap-version-preview",
|
|
38
|
+
className
|
|
39
|
+
),
|
|
40
|
+
ref: forwardedRef,
|
|
41
|
+
children: [
|
|
42
|
+
isLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
43
|
+
className: "lb-loading lb-history-version-preview-loading",
|
|
44
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(_private.SpinnerIcon, {})
|
|
45
|
+
}) : error ? /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
46
|
+
className: "lb-error lb-history-version-preview-error",
|
|
47
|
+
children: $.HISTORY_VERSION_PREVIEW_ERROR(error)
|
|
48
|
+
}) : /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
49
|
+
className: "lb-history-version-preview-content lb-tiptap-editor-container lb-tiptap-version-preview-editor-container",
|
|
50
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(react$2.EditorContent, {
|
|
51
|
+
editor: previewEditor
|
|
52
|
+
})
|
|
53
|
+
}),
|
|
54
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", {
|
|
55
|
+
className: "lb-history-version-preview-footer",
|
|
56
|
+
children: [
|
|
57
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", {
|
|
58
|
+
className: "lb-history-version-preview-authors",
|
|
59
|
+
children: $.HISTORY_VERSION_PREVIEW_AUTHORS_LIST(
|
|
60
|
+
/* @__PURE__ */ jsxRuntime.jsx(_private.List, {
|
|
61
|
+
values: version.authors.map((author) => /* @__PURE__ */ jsxRuntime.jsx(_private.User, {
|
|
62
|
+
userId: author.id,
|
|
63
|
+
replaceSelf: true
|
|
64
|
+
}, author.id)),
|
|
65
|
+
formatRemaining: $.LIST_REMAINING_USERS,
|
|
66
|
+
truncate: AUTHORS_TRUNCATE,
|
|
67
|
+
locale: $.locale
|
|
87
68
|
})
|
|
69
|
+
)
|
|
70
|
+
}),
|
|
71
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
72
|
+
className: "lb-history-version-preview-actions",
|
|
73
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs(_private.Button, {
|
|
74
|
+
onClick: restore,
|
|
75
|
+
disabled: !data,
|
|
76
|
+
variant: "primary",
|
|
77
|
+
size: "large",
|
|
78
|
+
className: "lb-history-version-preview-action",
|
|
79
|
+
children: [
|
|
80
|
+
/* @__PURE__ */ jsxRuntime.jsx(_private.RestoreIcon, {
|
|
81
|
+
className: "lb-button-icon"
|
|
82
|
+
}),
|
|
83
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", {
|
|
84
|
+
className: "lb-button-label",
|
|
85
|
+
children: $.HISTORY_VERSION_PREVIEW_RESTORE
|
|
86
|
+
})
|
|
87
|
+
]
|
|
88
88
|
})
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
}
|
|
94
|
-
);
|
|
89
|
+
})
|
|
90
|
+
]
|
|
91
|
+
})
|
|
92
|
+
]
|
|
93
|
+
});
|
|
94
|
+
});
|
|
95
95
|
|
|
96
96
|
exports.HistoryVersionPreview = HistoryVersionPreview;
|
|
97
97
|
//# sourceMappingURL=HistoryVersionPreview.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HistoryVersionPreview.js","sources":["../../src/version-history/HistoryVersionPreview.tsx"],"sourcesContent":["import type { HistoryVersion } from \"@liveblocks/core\";\nimport { useHistoryVersionData } from \"@liveblocks/react\";\nimport { useOverrides } from \"@liveblocks/react-ui\";\nimport {\n Button,\n List,\n RestoreIcon,\n SpinnerIcon,\n User,\n} from \"@liveblocks/react-ui/_private\";\nimport type { Content, Editor } from \"@tiptap/react\";\nimport { EditorContent, useEditor } from \"@tiptap/react\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport { forwardRef, useCallback, useEffect } from \"react\";\nimport { yXmlFragmentToProseMirrorRootNode } from \"y-prosemirror\";\nimport { applyUpdate, Doc } from \"yjs\";\n\nimport { classNames } from \"../classnames\";\n\nconst AUTHORS_TRUNCATE = 3;\n\nexport interface HistoryVersionPreviewProps\n extends ComponentPropsWithoutRef<\"div\"> {\n version: HistoryVersion;\n editor: Editor;\n onVersionRestore?: (version: HistoryVersion) => void;\n}\n\n/**\n * Displays a specific version of the current TipTap document.\n *\n * @example\n * <HistoryVersionPreview version={version} />\n */\nexport const HistoryVersionPreview = forwardRef<\n HTMLDivElement,\n HistoryVersionPreviewProps\n>(
|
|
1
|
+
{"version":3,"file":"HistoryVersionPreview.js","sources":["../../src/version-history/HistoryVersionPreview.tsx"],"sourcesContent":["import type { HistoryVersion } from \"@liveblocks/core\";\nimport { useHistoryVersionData } from \"@liveblocks/react\";\nimport { useOverrides } from \"@liveblocks/react-ui\";\nimport {\n Button,\n List,\n RestoreIcon,\n SpinnerIcon,\n User,\n} from \"@liveblocks/react-ui/_private\";\nimport type { Content, Editor } from \"@tiptap/react\";\nimport { EditorContent, useEditor } from \"@tiptap/react\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport { forwardRef, useCallback, useEffect } from \"react\";\nimport { yXmlFragmentToProseMirrorRootNode } from \"y-prosemirror\";\nimport { applyUpdate, Doc } from \"yjs\";\n\nimport { classNames } from \"../classnames\";\n\nconst AUTHORS_TRUNCATE = 3;\n\nexport interface HistoryVersionPreviewProps\n extends ComponentPropsWithoutRef<\"div\"> {\n version: HistoryVersion;\n editor: Editor;\n onVersionRestore?: (version: HistoryVersion) => void;\n}\n\n/**\n * Displays a specific version of the current TipTap document.\n *\n * @example\n * <HistoryVersionPreview version={version} />\n */\nexport const HistoryVersionPreview = forwardRef<\n HTMLDivElement,\n HistoryVersionPreviewProps\n>(({ version, editor: parentEditor, onVersionRestore, className, ...props }, forwardedRef) => {\n const $ = useOverrides();\n const { isLoading, data, error } = useHistoryVersionData(version.id);\n\n const previewEditor = useEditor({\n // ignore extensions, only get marks/nodes\n editable: false,\n extensions: parentEditor.extensionManager.extensions.filter((e) => e.type !== \"extension\"),\n });\n useEffect(() => {\n if (data && previewEditor) {\n const doc = new Doc();\n applyUpdate(doc, data);\n const root = doc.getXmlFragment(\"default\") // TODO: lookup field\n const node = yXmlFragmentToProseMirrorRootNode(root, parentEditor.schema);\n previewEditor.commands.setContent(node.toJSON() as Content)\n }\n }, [data, previewEditor, parentEditor]);\n const restore = useCallback(() => {\n parentEditor.commands.setContent(previewEditor?.getJSON() ?? \"\");\n onVersionRestore?.(version);\n }, [onVersionRestore, parentEditor, previewEditor, version]);\n\n return (\n <div\n {...props}\n className={classNames(\n \"lb-root lb-history-version-preview lb-tiptap-version-preview\",\n className\n )}\n ref={forwardedRef}\n >\n {isLoading ? (\n <div className=\"lb-loading lb-history-version-preview-loading\">\n <SpinnerIcon />\n </div>\n ) : error ? (\n <div className=\"lb-error lb-history-version-preview-error\">\n {$.HISTORY_VERSION_PREVIEW_ERROR(error)}\n </div>\n ) : (\n <div className=\"lb-history-version-preview-content lb-tiptap-editor-container lb-tiptap-version-preview-editor-container\">\n\n <EditorContent editor={previewEditor} />\n </div>\n )}\n <div className=\"lb-history-version-preview-footer\">\n <span className=\"lb-history-version-preview-authors\">\n {$.HISTORY_VERSION_PREVIEW_AUTHORS_LIST(\n <List\n values={version.authors.map((author) => (\n <User key={author.id} userId={author.id} replaceSelf />\n ))}\n formatRemaining={$.LIST_REMAINING_USERS}\n truncate={AUTHORS_TRUNCATE}\n locale={$.locale}\n />\n )}\n </span>\n <div className=\"lb-history-version-preview-actions\">\n <Button\n onClick={restore}\n disabled={!data}\n variant=\"primary\"\n size=\"large\"\n className=\"lb-history-version-preview-action\"\n >\n <RestoreIcon className=\"lb-button-icon\" />\n <span className=\"lb-button-label\">\n {$.HISTORY_VERSION_PREVIEW_RESTORE}\n </span>\n </Button>\n </div>\n </div>\n </div>\n );\n});\n"],"names":["forwardRef","useOverrides","useHistoryVersionData","useEditor","useEffect","Doc","applyUpdate","yXmlFragmentToProseMirrorRootNode","useCallback","jsxs","classNames","jsx","SpinnerIcon","EditorContent","List","User","Button","RestoreIcon"],"mappings":"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"}
|
|
@@ -9,87 +9,87 @@ import { Doc, applyUpdate } from 'yjs';
|
|
|
9
9
|
import { classNames } from '../classnames.mjs';
|
|
10
10
|
|
|
11
11
|
const AUTHORS_TRUNCATE = 3;
|
|
12
|
-
const HistoryVersionPreview = forwardRef(
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
"lb-
|
|
42
|
-
|
|
43
|
-
),
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
userId: author.id,
|
|
67
|
-
replaceSelf: true
|
|
68
|
-
}, author.id)),
|
|
69
|
-
formatRemaining: $.LIST_REMAINING_USERS,
|
|
70
|
-
truncate: AUTHORS_TRUNCATE,
|
|
71
|
-
locale: $.locale
|
|
72
|
-
})
|
|
73
|
-
)
|
|
74
|
-
}),
|
|
75
|
-
/* @__PURE__ */ jsx("div", {
|
|
76
|
-
className: "lb-history-version-preview-actions",
|
|
77
|
-
children: /* @__PURE__ */ jsx(Button, {
|
|
78
|
-
onClick: restore,
|
|
79
|
-
disabled: !data,
|
|
80
|
-
variant: "primary",
|
|
81
|
-
size: "large",
|
|
82
|
-
className: "lb-history-version-preview-action",
|
|
83
|
-
icon: /* @__PURE__ */ jsx(RestoreIcon, {}),
|
|
84
|
-
children: $.HISTORY_VERSION_PREVIEW_RESTORE
|
|
12
|
+
const HistoryVersionPreview = forwardRef(({ version, editor: parentEditor, onVersionRestore, className, ...props }, forwardedRef) => {
|
|
13
|
+
const $ = useOverrides();
|
|
14
|
+
const { isLoading, data, error } = useHistoryVersionData(version.id);
|
|
15
|
+
const previewEditor = useEditor({
|
|
16
|
+
editable: false,
|
|
17
|
+
extensions: parentEditor.extensionManager.extensions.filter((e) => e.type !== "extension")
|
|
18
|
+
});
|
|
19
|
+
useEffect(() => {
|
|
20
|
+
if (data && previewEditor) {
|
|
21
|
+
const doc = new Doc();
|
|
22
|
+
applyUpdate(doc, data);
|
|
23
|
+
const root = doc.getXmlFragment("default");
|
|
24
|
+
const node = yXmlFragmentToProseMirrorRootNode(root, parentEditor.schema);
|
|
25
|
+
previewEditor.commands.setContent(node.toJSON());
|
|
26
|
+
}
|
|
27
|
+
}, [data, previewEditor, parentEditor]);
|
|
28
|
+
const restore = useCallback(() => {
|
|
29
|
+
parentEditor.commands.setContent(previewEditor?.getJSON() ?? "");
|
|
30
|
+
onVersionRestore?.(version);
|
|
31
|
+
}, [onVersionRestore, parentEditor, previewEditor, version]);
|
|
32
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
33
|
+
...props,
|
|
34
|
+
className: classNames(
|
|
35
|
+
"lb-root lb-history-version-preview lb-tiptap-version-preview",
|
|
36
|
+
className
|
|
37
|
+
),
|
|
38
|
+
ref: forwardedRef,
|
|
39
|
+
children: [
|
|
40
|
+
isLoading ? /* @__PURE__ */ jsx("div", {
|
|
41
|
+
className: "lb-loading lb-history-version-preview-loading",
|
|
42
|
+
children: /* @__PURE__ */ jsx(SpinnerIcon, {})
|
|
43
|
+
}) : error ? /* @__PURE__ */ jsx("div", {
|
|
44
|
+
className: "lb-error lb-history-version-preview-error",
|
|
45
|
+
children: $.HISTORY_VERSION_PREVIEW_ERROR(error)
|
|
46
|
+
}) : /* @__PURE__ */ jsx("div", {
|
|
47
|
+
className: "lb-history-version-preview-content lb-tiptap-editor-container lb-tiptap-version-preview-editor-container",
|
|
48
|
+
children: /* @__PURE__ */ jsx(EditorContent, {
|
|
49
|
+
editor: previewEditor
|
|
50
|
+
})
|
|
51
|
+
}),
|
|
52
|
+
/* @__PURE__ */ jsxs("div", {
|
|
53
|
+
className: "lb-history-version-preview-footer",
|
|
54
|
+
children: [
|
|
55
|
+
/* @__PURE__ */ jsx("span", {
|
|
56
|
+
className: "lb-history-version-preview-authors",
|
|
57
|
+
children: $.HISTORY_VERSION_PREVIEW_AUTHORS_LIST(
|
|
58
|
+
/* @__PURE__ */ jsx(List, {
|
|
59
|
+
values: version.authors.map((author) => /* @__PURE__ */ jsx(User, {
|
|
60
|
+
userId: author.id,
|
|
61
|
+
replaceSelf: true
|
|
62
|
+
}, author.id)),
|
|
63
|
+
formatRemaining: $.LIST_REMAINING_USERS,
|
|
64
|
+
truncate: AUTHORS_TRUNCATE,
|
|
65
|
+
locale: $.locale
|
|
85
66
|
})
|
|
67
|
+
)
|
|
68
|
+
}),
|
|
69
|
+
/* @__PURE__ */ jsx("div", {
|
|
70
|
+
className: "lb-history-version-preview-actions",
|
|
71
|
+
children: /* @__PURE__ */ jsxs(Button, {
|
|
72
|
+
onClick: restore,
|
|
73
|
+
disabled: !data,
|
|
74
|
+
variant: "primary",
|
|
75
|
+
size: "large",
|
|
76
|
+
className: "lb-history-version-preview-action",
|
|
77
|
+
children: [
|
|
78
|
+
/* @__PURE__ */ jsx(RestoreIcon, {
|
|
79
|
+
className: "lb-button-icon"
|
|
80
|
+
}),
|
|
81
|
+
/* @__PURE__ */ jsx("span", {
|
|
82
|
+
className: "lb-button-label",
|
|
83
|
+
children: $.HISTORY_VERSION_PREVIEW_RESTORE
|
|
84
|
+
})
|
|
85
|
+
]
|
|
86
86
|
})
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
}
|
|
92
|
-
);
|
|
87
|
+
})
|
|
88
|
+
]
|
|
89
|
+
})
|
|
90
|
+
]
|
|
91
|
+
});
|
|
92
|
+
});
|
|
93
93
|
|
|
94
94
|
export { HistoryVersionPreview };
|
|
95
95
|
//# sourceMappingURL=HistoryVersionPreview.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HistoryVersionPreview.mjs","sources":["../../src/version-history/HistoryVersionPreview.tsx"],"sourcesContent":["import type { HistoryVersion } from \"@liveblocks/core\";\nimport { useHistoryVersionData } from \"@liveblocks/react\";\nimport { useOverrides } from \"@liveblocks/react-ui\";\nimport {\n Button,\n List,\n RestoreIcon,\n SpinnerIcon,\n User,\n} from \"@liveblocks/react-ui/_private\";\nimport type { Content, Editor } from \"@tiptap/react\";\nimport { EditorContent, useEditor } from \"@tiptap/react\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport { forwardRef, useCallback, useEffect } from \"react\";\nimport { yXmlFragmentToProseMirrorRootNode } from \"y-prosemirror\";\nimport { applyUpdate, Doc } from \"yjs\";\n\nimport { classNames } from \"../classnames\";\n\nconst AUTHORS_TRUNCATE = 3;\n\nexport interface HistoryVersionPreviewProps\n extends ComponentPropsWithoutRef<\"div\"> {\n version: HistoryVersion;\n editor: Editor;\n onVersionRestore?: (version: HistoryVersion) => void;\n}\n\n/**\n * Displays a specific version of the current TipTap document.\n *\n * @example\n * <HistoryVersionPreview version={version} />\n */\nexport const HistoryVersionPreview = forwardRef<\n HTMLDivElement,\n HistoryVersionPreviewProps\n>(
|
|
1
|
+
{"version":3,"file":"HistoryVersionPreview.mjs","sources":["../../src/version-history/HistoryVersionPreview.tsx"],"sourcesContent":["import type { HistoryVersion } from \"@liveblocks/core\";\nimport { useHistoryVersionData } from \"@liveblocks/react\";\nimport { useOverrides } from \"@liveblocks/react-ui\";\nimport {\n Button,\n List,\n RestoreIcon,\n SpinnerIcon,\n User,\n} from \"@liveblocks/react-ui/_private\";\nimport type { Content, Editor } from \"@tiptap/react\";\nimport { EditorContent, useEditor } from \"@tiptap/react\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport { forwardRef, useCallback, useEffect } from \"react\";\nimport { yXmlFragmentToProseMirrorRootNode } from \"y-prosemirror\";\nimport { applyUpdate, Doc } from \"yjs\";\n\nimport { classNames } from \"../classnames\";\n\nconst AUTHORS_TRUNCATE = 3;\n\nexport interface HistoryVersionPreviewProps\n extends ComponentPropsWithoutRef<\"div\"> {\n version: HistoryVersion;\n editor: Editor;\n onVersionRestore?: (version: HistoryVersion) => void;\n}\n\n/**\n * Displays a specific version of the current TipTap document.\n *\n * @example\n * <HistoryVersionPreview version={version} />\n */\nexport const HistoryVersionPreview = forwardRef<\n HTMLDivElement,\n HistoryVersionPreviewProps\n>(({ version, editor: parentEditor, onVersionRestore, className, ...props }, forwardedRef) => {\n const $ = useOverrides();\n const { isLoading, data, error } = useHistoryVersionData(version.id);\n\n const previewEditor = useEditor({\n // ignore extensions, only get marks/nodes\n editable: false,\n extensions: parentEditor.extensionManager.extensions.filter((e) => e.type !== \"extension\"),\n });\n useEffect(() => {\n if (data && previewEditor) {\n const doc = new Doc();\n applyUpdate(doc, data);\n const root = doc.getXmlFragment(\"default\") // TODO: lookup field\n const node = yXmlFragmentToProseMirrorRootNode(root, parentEditor.schema);\n previewEditor.commands.setContent(node.toJSON() as Content)\n }\n }, [data, previewEditor, parentEditor]);\n const restore = useCallback(() => {\n parentEditor.commands.setContent(previewEditor?.getJSON() ?? \"\");\n onVersionRestore?.(version);\n }, [onVersionRestore, parentEditor, previewEditor, version]);\n\n return (\n <div\n {...props}\n className={classNames(\n \"lb-root lb-history-version-preview lb-tiptap-version-preview\",\n className\n )}\n ref={forwardedRef}\n >\n {isLoading ? (\n <div className=\"lb-loading lb-history-version-preview-loading\">\n <SpinnerIcon />\n </div>\n ) : error ? (\n <div className=\"lb-error lb-history-version-preview-error\">\n {$.HISTORY_VERSION_PREVIEW_ERROR(error)}\n </div>\n ) : (\n <div className=\"lb-history-version-preview-content lb-tiptap-editor-container lb-tiptap-version-preview-editor-container\">\n\n <EditorContent editor={previewEditor} />\n </div>\n )}\n <div className=\"lb-history-version-preview-footer\">\n <span className=\"lb-history-version-preview-authors\">\n {$.HISTORY_VERSION_PREVIEW_AUTHORS_LIST(\n <List\n values={version.authors.map((author) => (\n <User key={author.id} userId={author.id} replaceSelf />\n ))}\n formatRemaining={$.LIST_REMAINING_USERS}\n truncate={AUTHORS_TRUNCATE}\n locale={$.locale}\n />\n )}\n </span>\n <div className=\"lb-history-version-preview-actions\">\n <Button\n onClick={restore}\n disabled={!data}\n variant=\"primary\"\n size=\"large\"\n className=\"lb-history-version-preview-action\"\n >\n <RestoreIcon className=\"lb-button-icon\" />\n <span className=\"lb-button-label\">\n {$.HISTORY_VERSION_PREVIEW_RESTORE}\n </span>\n </Button>\n </div>\n </div>\n </div>\n );\n});\n"],"names":[],"mappings":"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"}
|
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.
|
|
4
|
+
const PKG_VERSION = typeof "2.17.0-channels1" === "string" && "2.17.0-channels1";
|
|
5
5
|
const PKG_FORMAT = typeof "cjs" === "string" && "cjs";
|
|
6
6
|
|
|
7
7
|
exports.PKG_FORMAT = PKG_FORMAT;
|
package/dist/version.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const PKG_NAME = "@liveblocks/react-tiptap";
|
|
2
|
-
const PKG_VERSION = typeof "2.
|
|
2
|
+
const PKG_VERSION = typeof "2.17.0-channels1" === "string" && "2.17.0-channels1";
|
|
3
3
|
const PKG_FORMAT = typeof "esm" === "string" && "esm";
|
|
4
4
|
|
|
5
5
|
export { PKG_FORMAT, PKG_NAME, PKG_VERSION };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@liveblocks/react-tiptap",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.17.0-channels1",
|
|
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,13 +42,11 @@
|
|
|
42
42
|
},
|
|
43
43
|
"dependencies": {
|
|
44
44
|
"@floating-ui/react-dom": "^2.1.2",
|
|
45
|
-
"@liveblocks/client": "2.
|
|
46
|
-
"@liveblocks/core": "2.
|
|
47
|
-
"@liveblocks/react": "2.
|
|
48
|
-
"@liveblocks/react-ui": "2.
|
|
49
|
-
"@liveblocks/yjs": "2.
|
|
50
|
-
"@radix-ui/react-select": "^2.1.2",
|
|
51
|
-
"@radix-ui/react-toggle": "^1.1.0",
|
|
45
|
+
"@liveblocks/client": "2.17.0-channels1",
|
|
46
|
+
"@liveblocks/core": "2.17.0-channels1",
|
|
47
|
+
"@liveblocks/react": "2.17.0-channels1",
|
|
48
|
+
"@liveblocks/react-ui": "2.17.0-channels1",
|
|
49
|
+
"@liveblocks/yjs": "2.17.0-channels1",
|
|
52
50
|
"@tiptap/core": "^2.7.2",
|
|
53
51
|
"@tiptap/react": "^2.7.2",
|
|
54
52
|
"@tiptap/suggestion": "^2.7.2",
|
package/src/styles/constants.css
CHANGED
package/src/styles/index.css
CHANGED
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
*************************************/
|
|
38
38
|
|
|
39
39
|
.lb-tiptap-suggestions {
|
|
40
|
-
padding: $lb-elevation-padding;
|
|
40
|
+
padding: $lb-elevation-list-padding;
|
|
41
41
|
animation-duration: var(--lb-transition-duration);
|
|
42
42
|
animation-timing-function: var(--lb-transition-easing);
|
|
43
43
|
will-change: transform, opacity;
|
|
@@ -47,26 +47,23 @@
|
|
|
47
47
|
display: flex;
|
|
48
48
|
align-items: center;
|
|
49
49
|
padding: calc(0.25 * var(--lb-spacing)) calc(0.5 * var(--lb-spacing));
|
|
50
|
-
border-radius: calc(var(--lb-radius) - 0.75 * $lb-elevation-padding);
|
|
50
|
+
border-radius: calc(var(--lb-radius) - 0.75 * $lb-elevation-list-padding);
|
|
51
51
|
color: var(--lb-foreground-secondary);
|
|
52
52
|
outline: none;
|
|
53
53
|
font-size: 0.875rem;
|
|
54
54
|
cursor: pointer;
|
|
55
55
|
user-select: none;
|
|
56
56
|
transition-property: background, color, opacity;
|
|
57
|
-
scroll-margin-block: $lb-elevation-padding;
|
|
57
|
+
scroll-margin-block: $lb-elevation-list-padding;
|
|
58
58
|
}
|
|
59
59
|
|
|
60
60
|
:is(.lb-tiptap-suggestions-list-item) {
|
|
61
|
-
&:where(
|
|
62
|
-
[data-highlighted]:not([data-highlighted="false"]),
|
|
63
|
-
[data-selected]:not([data-selected="false"])
|
|
64
|
-
) {
|
|
61
|
+
&:where([data-highlighted], [data-selected]) {
|
|
65
62
|
background: var(--lb-foreground-subtle);
|
|
66
63
|
transition-duration: calc(var(--lb-transition-duration) / 2);
|
|
67
64
|
}
|
|
68
65
|
|
|
69
|
-
&:where(:disabled, [data-disabled]
|
|
66
|
+
&:where(:disabled, [data-disabled]) {
|
|
70
67
|
opacity: 0.5;
|
|
71
68
|
cursor: not-allowed;
|
|
72
69
|
}
|
|
@@ -212,62 +209,13 @@
|
|
|
212
209
|
inline-size: var(--lb-tiptap-floating-size);
|
|
213
210
|
}
|
|
214
211
|
|
|
215
|
-
/*************************************
|
|
216
|
-
* Active selection *
|
|
217
|
-
*************************************/
|
|
218
|
-
|
|
219
212
|
.lb-tiptap-active-selection {
|
|
220
213
|
background: var(--lb-selection, rgb(0 0 255 / 20%));
|
|
221
214
|
pointer-events: none;
|
|
222
215
|
}
|
|
223
216
|
|
|
224
217
|
/*************************************
|
|
225
|
-
*
|
|
226
|
-
*************************************/
|
|
227
|
-
|
|
228
|
-
.lb-tiptap-toolbar {
|
|
229
|
-
--lb-tiptap-toolbar-spacing: calc(0.25 * var(--lb-spacing));
|
|
230
|
-
|
|
231
|
-
position: relative;
|
|
232
|
-
display: flex;
|
|
233
|
-
flex-direction: row;
|
|
234
|
-
gap: var(--lb-tiptap-toolbar-spacing);
|
|
235
|
-
align-items: center;
|
|
236
|
-
padding: var(--lb-tiptap-toolbar-spacing);
|
|
237
|
-
background: var(--lb-background);
|
|
238
|
-
|
|
239
|
-
/* overflow-inline: auto; doesn't work as expected */
|
|
240
|
-
/* stylelint-disable-next-line plugin/use-logical-properties-and-values */
|
|
241
|
-
overflow-x: auto;
|
|
242
|
-
|
|
243
|
-
@include invisible-scrollbar;
|
|
244
|
-
|
|
245
|
-
> * {
|
|
246
|
-
flex: none;
|
|
247
|
-
}
|
|
248
|
-
}
|
|
249
|
-
|
|
250
|
-
.lb-tiptap-floating-toolbar {
|
|
251
|
-
--lb-tiptap-toolbar-spacing: $lb-elevation-padding;
|
|
252
|
-
}
|
|
253
|
-
|
|
254
|
-
.lb-tiptap-toolbar-separator {
|
|
255
|
-
position: relative;
|
|
256
|
-
align-self: stretch;
|
|
257
|
-
inline-size: 1px;
|
|
258
|
-
margin-inline: 1px;
|
|
259
|
-
pointer-events: none;
|
|
260
|
-
|
|
261
|
-
&::before {
|
|
262
|
-
content: "";
|
|
263
|
-
position: absolute;
|
|
264
|
-
inset: 10% 0;
|
|
265
|
-
background: var(--lb-foreground-subtle);
|
|
266
|
-
}
|
|
267
|
-
}
|
|
268
|
-
|
|
269
|
-
/*************************************
|
|
270
|
-
* Collab Cursors *
|
|
218
|
+
* Collab Cursors *
|
|
271
219
|
*************************************/
|
|
272
220
|
|
|
273
221
|
/* Give a remote user a caret */
|
package/src/styles/utils.css
CHANGED
package/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.lb-tiptap-suggestions-list{margin:0;padding:0;list-style:none}.lb-tiptap-mention-suggestions{--lb-tiptap-mention-suggestion-avatar-size:1.25rem}.lb-tiptap-mention-suggestion{padding:calc(.375*var(--lb-spacing))calc(.625*var(--lb-spacing))}.lb-tiptap-mention-suggestion-avatar{inline-size:var(--lb-tiptap-mention-suggestion-avatar-size);margin-inline-start:calc(-.125*var(--lb-spacing));margin-inline-end:calc(.5*var(--lb-spacing));margin-block:calc(.125*var(--lb-spacing));background:var(--lb-foreground-subtle);color:var(--lb-foreground-moderate)}.lb-tiptap-suggestions{animation-duration:var(--lb-transition-duration);animation-timing-function:var(--lb-transition-easing);will-change:transform,opacity;padding:4px}.lb-tiptap-suggestions-list-item{padding:calc(.25*var(--lb-spacing))calc(.5*var(--lb-spacing));border-radius:calc(var(--lb-radius) - .75*4px);color:var(--lb-foreground-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;align-items:center;scroll-margin-block:4px;font-size:.875rem;transition-property:background,color,opacity;display:flex}.lb-tiptap-suggestions-list-item:where([data-highlighted]
|
|
1
|
+
.lb-tiptap-suggestions-list{margin:0;padding:0;list-style:none}.lb-tiptap-mention-suggestions{--lb-tiptap-mention-suggestion-avatar-size:1.25rem}.lb-tiptap-mention-suggestion{padding:calc(.375*var(--lb-spacing))calc(.625*var(--lb-spacing))}.lb-tiptap-mention-suggestion-avatar{inline-size:var(--lb-tiptap-mention-suggestion-avatar-size);margin-inline-start:calc(-.125*var(--lb-spacing));margin-inline-end:calc(.5*var(--lb-spacing));margin-block:calc(.125*var(--lb-spacing));background:var(--lb-foreground-subtle);color:var(--lb-foreground-moderate)}.lb-tiptap-suggestions{animation-duration:var(--lb-transition-duration);animation-timing-function:var(--lb-transition-easing);will-change:transform,opacity;padding:4px}.lb-tiptap-suggestions-list-item{padding:calc(.25*var(--lb-spacing))calc(.5*var(--lb-spacing));border-radius:calc(var(--lb-radius) - .75*4px);color:var(--lb-foreground-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;align-items:center;scroll-margin-block:4px;font-size:.875rem;transition-property:background,color,opacity;display:flex}.lb-tiptap-suggestions-list-item:where([data-highlighted],[data-selected]){background:var(--lb-foreground-subtle);transition-duration:calc(var(--lb-transition-duration)/2)}.lb-tiptap-suggestions-list-item:where(:disabled,[data-disabled]){opacity:.5;cursor:not-allowed}.lb-tiptap-suggestions:where([data-side=top]){animation-name:lb-animation-slide-up}.lb-tiptap-suggestions:where([data-side=bottom]){animation-name:lb-animation-slide-down}.lb-tiptap-suggestions:where([data-state=closed]){animation-name:lb-animation-disappear}.lb-tiptap-mention{border-radius:calc(.675*var(--lb-radius));background:var(--lb-accent-subtle);color:var(--lb-accent);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:.1em .3em;font-weight:500}.lb-tiptap-mention::selection{background:0 0}.lb-tiptap-mention ::selection{background:0 0}.lb-mention-selected{background:var(--lb-accent);color:var(--lb-accent-foreground)}:where(.lb-tiptap-thread-mark:not([data-orphan=true])){background:var(--lb-accent-subtle);color:var(--lb-foreground);text-decoration-line:underline;-webkit-text-decoration-color:var(--lb-foreground-moderate);text-decoration-color:var(--lb-foreground-moderate);text-underline-offset:2px;outline:none;font-weight:500;transition-property:color,text-decoration-color}:where(.lb-tiptap-thread-mark:not([data-orphan=true]) .lb-tiptap-thread-mark-selected){color:var(--lb-accent);text-decoration-line:underline;-webkit-text-decoration-color:var(--lb-accent-moderate);text-decoration-color:var(--lb-accent-moderate);text-underline-offset:2px}.lb-tiptap-anchored-threads{--lb-tiptap-anchored-threads-gap:1.25rem;--lb-tiptap-anchored-threads-active-thread-offset:-.75rem}.lb-tiptap-anchored-threads-thread-container{transition-duration:calc(var(--lb-transition-duration)*2);transition-property:transform}.lb-tiptap-anchored-threads-thread{border-radius:var(--lb-radius);background:var(--lb-dynamic-background);transition-property:background,box-shadow;position:relative;overflow:hidden;box-shadow:0 0 0 1px #0000000a,0 2px 6px #0000000a,0 6px 20px #0000000f}.lb-tiptap-anchored-threads-thread:after{content:"";z-index:1;border-radius:inherit;box-shadow:var(--lb-inset-shadow);pointer-events:none;position:absolute;inset:0}.lb-tiptap-anchored-threads-thread:where([data-state=active]){box-shadow:0 0 0 1px #0000000a,0 2px 6px #00000014,0 8px 26px #0000001f}.lb-tiptap-floating{--lb-tiptap-floating-size:350px}.lb-tiptap-floating-threads-thread{inline-size:var(--lb-tiptap-floating-size)}.lb-tiptap-floating-threads-thread:where(:not(:last-of-type)){border-block-end:1px solid var(--lb-foreground-subtle)}.lb-tiptap-floating-composer{inline-size:var(--lb-tiptap-floating-size)}.lb-tiptap-active-selection{background:var(--lb-selection,#00f3);pointer-events:none}.collaboration-cursor__caret{word-break:normal;pointer-events:none;border-inline:1px solid #0d0d0d;margin-inline:-1px;position:relative}.collaboration-cursor__label{border-radius:6px;color:#fff;white-space:nowrap;pointer-events:none;-webkit-user-select:none;user-select:none;border-end-start-radius:0;padding:2px 6px;font-size:14px;font-style:normal;font-weight:600;line-height:normal;position:absolute;inset-block-start:-1.4em;inset-inline-start:-1px}@media (prefers-reduced-motion){.lb-tiptap-suggestions:where(:not([data-state=closed])){animation-name:lb-animation-appear}.lb-tiptap-anchored-threads-thread-container{transition-duration:0s}}
|