@liveblocks/react-tiptap 2.15.1 → 2.16.0-toolbars1

package/dist/version-history/HistoryVersionPreview.js

@@ -11,87 +11,87 @@ var yjs = require('yjs');
 var classnames = require('../classnames.js');
 
 const AUTHORS_TRUNCATE = 3;
-const HistoryVersionPreview = react.forwardRef(({ version, editor: parentEditor, onVersionRestore, className, ...props }, forwardedRef) => {
-  const $ = reactUi.useOverrides();
-  const { isLoading, data, error } = react$1.useHistoryVersionData(version.id);
-  const previewEditor = react$2.useEditor({
-    editable: false,
-    extensions: parentEditor.extensionManager.extensions.filter((e) => e.type !== "extension")
-  });
-  react.useEffect(() => {
-    if (data && previewEditor) {
-      const doc = new yjs.Doc();
-      yjs.applyUpdate(doc, data);
-      const root = doc.getXmlFragment("default");
-      const node = yProsemirror.yXmlFragmentToProseMirrorRootNode(root, parentEditor.schema);
-      previewEditor.commands.setContent(node.toJSON());
-    }
-  }, [data, previewEditor, parentEditor]);
-  const restore = react.useCallback(() => {
-    parentEditor.commands.setContent(previewEditor?.getJSON() ?? "");
-    onVersionRestore?.(version);
-  }, [onVersionRestore, parentEditor, previewEditor, version]);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    ...props,
-    className: classnames.classNames(
-      "lb-root lb-history-version-preview lb-tiptap-version-preview",
-      className
-    ),
-    ref: forwardedRef,
-    children: [
-      isLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", {
-        className: "lb-loading lb-history-version-preview-loading",
-        children: /* @__PURE__ */ jsxRuntime.jsx(_private.SpinnerIcon, {})
-      }) : error ? /* @__PURE__ */ jsxRuntime.jsx("div", {
-        className: "lb-error lb-history-version-preview-error",
-        children: $.HISTORY_VERSION_PREVIEW_ERROR(error)
-      }) : /* @__PURE__ */ jsxRuntime.jsx("div", {
-        className: "lb-history-version-preview-content lb-tiptap-editor-container lb-tiptap-version-preview-editor-container",
-        children: /* @__PURE__ */ jsxRuntime.jsx(react$2.EditorContent, {
-          editor: previewEditor
-        })
-      }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", {
-        className: "lb-history-version-preview-footer",
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", {
-            className: "lb-history-version-preview-authors",
-            children: $.HISTORY_VERSION_PREVIEW_AUTHORS_LIST(
-              /* @__PURE__ */ jsxRuntime.jsx(_private.List, {
-                values: version.authors.map((author) => /* @__PURE__ */ jsxRuntime.jsx(_private.User, {
-                  userId: author.id,
-                  replaceSelf: true
-                }, author.id)),
-                formatRemaining: $.LIST_REMAINING_USERS,
-                truncate: AUTHORS_TRUNCATE,
-                locale: $.locale
-              })
-            )
-          }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", {
-            className: "lb-history-version-preview-actions",
-            children: /* @__PURE__ */ jsxRuntime.jsxs(_private.Button, {
-              onClick: restore,
-              disabled: !data,
-              variant: "primary",
-              size: "large",
-              className: "lb-history-version-preview-action",
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx(_private.RestoreIcon, {
-                  className: "lb-button-icon"
-                }),
-                /* @__PURE__ */ jsxRuntime.jsx("span", {
-                  className: "lb-button-label",
-                  children: $.HISTORY_VERSION_PREVIEW_RESTORE
+const HistoryVersionPreview = react.forwardRef(
+  ({ version, editor: parentEditor, onVersionRestore, className, ...props }, forwardedRef) => {
+    const $ = reactUi.useOverrides();
+    const { isLoading, data, error } = react$1.useHistoryVersionData(version.id);
+    const previewEditor = react$2.useEditor({
+      editable: false,
+      extensions: parentEditor.extensionManager.extensions.filter(
+        (e) => e.type !== "extension"
+      )
+    });
+    react.useEffect(() => {
+      if (data && previewEditor) {
+        const doc = new yjs.Doc();
+        yjs.applyUpdate(doc, data);
+        const root = doc.getXmlFragment("default");
+        const node = yProsemirror.yXmlFragmentToProseMirrorRootNode(
+          root,
+          parentEditor.schema
+        );
+        previewEditor.commands.setContent(node.toJSON());
+      }
+    }, [data, previewEditor, parentEditor]);
+    const restore = react.useCallback(() => {
+      parentEditor.commands.setContent(previewEditor?.getJSON() ?? "");
+      onVersionRestore?.(version);
+    }, [onVersionRestore, parentEditor, previewEditor, version]);
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+      ...props,
+      className: classnames.classNames(
+        "lb-root lb-history-version-preview lb-tiptap-version-preview",
+        className
+      ),
+      ref: forwardedRef,
+      children: [
+        isLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", {
+          className: "lb-loading lb-history-version-preview-loading",
+          children: /* @__PURE__ */ jsxRuntime.jsx(_private.SpinnerIcon, {})
+        }) : error ? /* @__PURE__ */ jsxRuntime.jsx("div", {
+          className: "lb-error lb-history-version-preview-error",
+          children: $.HISTORY_VERSION_PREVIEW_ERROR(error)
+        }) : /* @__PURE__ */ jsxRuntime.jsx("div", {
+          className: "lb-history-version-preview-content lb-tiptap-editor-container lb-tiptap-version-preview-editor-container",
+          children: /* @__PURE__ */ jsxRuntime.jsx(react$2.EditorContent, {
+            editor: previewEditor
+          })
+        }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", {
+          className: "lb-history-version-preview-footer",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", {
+              className: "lb-history-version-preview-authors",
+              children: $.HISTORY_VERSION_PREVIEW_AUTHORS_LIST(
+                /* @__PURE__ */ jsxRuntime.jsx(_private.List, {
+                  values: version.authors.map((author) => /* @__PURE__ */ jsxRuntime.jsx(_private.User, {
+                    userId: author.id,
+                    replaceSelf: true
+                  }, author.id)),
+                  formatRemaining: $.LIST_REMAINING_USERS,
+                  truncate: AUTHORS_TRUNCATE,
+                  locale: $.locale
                 })
-              ]
+              )
+            }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", {
+              className: "lb-history-version-preview-actions",
+              children: /* @__PURE__ */ jsxRuntime.jsx(_private.Button, {
+                onClick: restore,
+                disabled: !data,
+                variant: "primary",
+                size: "large",
+                className: "lb-history-version-preview-action",
+                icon: /* @__PURE__ */ jsxRuntime.jsx(_private.RestoreIcon, {}),
+                children: $.HISTORY_VERSION_PREVIEW_RESTORE
+              })
             })
-          })
-        ]
-      })
-    ]
-  });
-});
+          ]
+        })
+      ]
+    });
+  }
+);
 
 exports.HistoryVersionPreview = HistoryVersionPreview;
 //# sourceMappingURL=HistoryVersionPreview.js.map

package/dist/version-history/HistoryVersionPreview.js.map

@@ -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>(({ 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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"}
+{"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>(\n  (\n    { version, editor: parentEditor, onVersionRestore, className, ...props },\n    forwardedRef\n  ) => {\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(\n        (e) => e.type !== \"extension\"\n      ),\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(\n          root,\n          parentEditor.schema\n        );\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            <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              icon={<RestoreIcon />}\n            >\n              {$.HISTORY_VERSION_PREVIEW_RESTORE}\n            </Button>\n          </div>\n        </div>\n      </div>\n    );\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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"}

package/dist/version-history/HistoryVersionPreview.mjs

@@ -9,87 +9,87 @@ import { Doc, applyUpdate } from 'yjs';
 import { classNames } from '../classnames.mjs';
 
 const AUTHORS_TRUNCATE = 3;
-const HistoryVersionPreview = forwardRef(({ version, editor: parentEditor, onVersionRestore, className, ...props }, forwardedRef) => {
-  const $ = useOverrides();
-  const { isLoading, data, error } = useHistoryVersionData(version.id);
-  const previewEditor = useEditor({
-    editable: false,
-    extensions: parentEditor.extensionManager.extensions.filter((e) => e.type !== "extension")
-  });
-  useEffect(() => {
-    if (data && previewEditor) {
-      const doc = new Doc();
-      applyUpdate(doc, data);
-      const root = doc.getXmlFragment("default");
-      const node = yXmlFragmentToProseMirrorRootNode(root, parentEditor.schema);
-      previewEditor.commands.setContent(node.toJSON());
-    }
-  }, [data, previewEditor, parentEditor]);
-  const restore = useCallback(() => {
-    parentEditor.commands.setContent(previewEditor?.getJSON() ?? "");
-    onVersionRestore?.(version);
-  }, [onVersionRestore, parentEditor, previewEditor, version]);
-  return /* @__PURE__ */ jsxs("div", {
-    ...props,
-    className: classNames(
-      "lb-root lb-history-version-preview lb-tiptap-version-preview",
-      className
-    ),
-    ref: forwardedRef,
-    children: [
-      isLoading ? /* @__PURE__ */ jsx("div", {
-        className: "lb-loading lb-history-version-preview-loading",
-        children: /* @__PURE__ */ jsx(SpinnerIcon, {})
-      }) : error ? /* @__PURE__ */ jsx("div", {
-        className: "lb-error lb-history-version-preview-error",
-        children: $.HISTORY_VERSION_PREVIEW_ERROR(error)
-      }) : /* @__PURE__ */ jsx("div", {
-        className: "lb-history-version-preview-content lb-tiptap-editor-container lb-tiptap-version-preview-editor-container",
-        children: /* @__PURE__ */ jsx(EditorContent, {
-          editor: previewEditor
-        })
-      }),
-      /* @__PURE__ */ jsxs("div", {
-        className: "lb-history-version-preview-footer",
-        children: [
-          /* @__PURE__ */ jsx("span", {
-            className: "lb-history-version-preview-authors",
-            children: $.HISTORY_VERSION_PREVIEW_AUTHORS_LIST(
-              /* @__PURE__ */ jsx(List, {
-                values: version.authors.map((author) => /* @__PURE__ */ jsx(User, {
-                  userId: author.id,
-                  replaceSelf: true
-                }, author.id)),
-                formatRemaining: $.LIST_REMAINING_USERS,
-                truncate: AUTHORS_TRUNCATE,
-                locale: $.locale
-              })
-            )
-          }),
-          /* @__PURE__ */ jsx("div", {
-            className: "lb-history-version-preview-actions",
-            children: /* @__PURE__ */ jsxs(Button, {
-              onClick: restore,
-              disabled: !data,
-              variant: "primary",
-              size: "large",
-              className: "lb-history-version-preview-action",
-              children: [
-                /* @__PURE__ */ jsx(RestoreIcon, {
-                  className: "lb-button-icon"
-                }),
-                /* @__PURE__ */ jsx("span", {
-                  className: "lb-button-label",
-                  children: $.HISTORY_VERSION_PREVIEW_RESTORE
+const HistoryVersionPreview = forwardRef(
+  ({ version, editor: parentEditor, onVersionRestore, className, ...props }, forwardedRef) => {
+    const $ = useOverrides();
+    const { isLoading, data, error } = useHistoryVersionData(version.id);
+    const previewEditor = useEditor({
+      editable: false,
+      extensions: parentEditor.extensionManager.extensions.filter(
+        (e) => e.type !== "extension"
+      )
+    });
+    useEffect(() => {
+      if (data && previewEditor) {
+        const doc = new Doc();
+        applyUpdate(doc, data);
+        const root = doc.getXmlFragment("default");
+        const node = yXmlFragmentToProseMirrorRootNode(
+          root,
+          parentEditor.schema
+        );
+        previewEditor.commands.setContent(node.toJSON());
+      }
+    }, [data, previewEditor, parentEditor]);
+    const restore = useCallback(() => {
+      parentEditor.commands.setContent(previewEditor?.getJSON() ?? "");
+      onVersionRestore?.(version);
+    }, [onVersionRestore, parentEditor, previewEditor, version]);
+    return /* @__PURE__ */ jsxs("div", {
+      ...props,
+      className: classNames(
+        "lb-root lb-history-version-preview lb-tiptap-version-preview",
+        className
+      ),
+      ref: forwardedRef,
+      children: [
+        isLoading ? /* @__PURE__ */ jsx("div", {
+          className: "lb-loading lb-history-version-preview-loading",
+          children: /* @__PURE__ */ jsx(SpinnerIcon, {})
+        }) : error ? /* @__PURE__ */ jsx("div", {
+          className: "lb-error lb-history-version-preview-error",
+          children: $.HISTORY_VERSION_PREVIEW_ERROR(error)
+        }) : /* @__PURE__ */ jsx("div", {
+          className: "lb-history-version-preview-content lb-tiptap-editor-container lb-tiptap-version-preview-editor-container",
+          children: /* @__PURE__ */ jsx(EditorContent, {
+            editor: previewEditor
+          })
+        }),
+        /* @__PURE__ */ jsxs("div", {
+          className: "lb-history-version-preview-footer",
+          children: [
+            /* @__PURE__ */ jsx("span", {
+              className: "lb-history-version-preview-authors",
+              children: $.HISTORY_VERSION_PREVIEW_AUTHORS_LIST(
+                /* @__PURE__ */ jsx(List, {
+                  values: version.authors.map((author) => /* @__PURE__ */ jsx(User, {
+                    userId: author.id,
+                    replaceSelf: true
+                  }, author.id)),
+                  formatRemaining: $.LIST_REMAINING_USERS,
+                  truncate: AUTHORS_TRUNCATE,
+                  locale: $.locale
                 })
-              ]
+              )
+            }),
+            /* @__PURE__ */ jsx("div", {
+              className: "lb-history-version-preview-actions",
+              children: /* @__PURE__ */ jsx(Button, {
+                onClick: restore,
+                disabled: !data,
+                variant: "primary",
+                size: "large",
+                className: "lb-history-version-preview-action",
+                icon: /* @__PURE__ */ jsx(RestoreIcon, {}),
+                children: $.HISTORY_VERSION_PREVIEW_RESTORE
+              })
             })
-          })
-        ]
-      })
-    ]
-  });
-});
+          ]
+        })
+      ]
+    });
+  }
+);
 
 export { HistoryVersionPreview };
 //# sourceMappingURL=HistoryVersionPreview.mjs.map

package/dist/version-history/HistoryVersionPreview.mjs.map

@@ -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>(({ 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":";;;;;;;;;;AAmBA,MAAM,gBAAmB,GAAA,CAAA,CAAA;AAeZ,MAAA,qBAAA,GAAwB,UAGnC,CAAA,CAAC,EAAE,OAAA,EAAS,MAAQ,EAAA,YAAA,EAAc,gBAAkB,EAAA,SAAA,EAAA,GAAc,KAAM,EAAA,EAAG,YAAiB,KAAA;AAC5F,EAAA,MAAM,IAAI,YAAa,EAAA,CAAA;AACvB,EAAA,MAAM,EAAE,SAAW,EAAA,IAAA,EAAM,OAAU,GAAA,qBAAA,CAAsB,QAAQ,EAAE,CAAA,CAAA;AAEnE,EAAA,MAAM,gBAAgB,SAAU,CAAA;AAAA,IAE9B,QAAU,EAAA,KAAA;AAAA,IACV,UAAA,EAAY,aAAa,gBAAiB,CAAA,UAAA,CAAW,OAAO,CAAC,CAAA,KAAM,CAAE,CAAA,IAAA,KAAS,WAAW,CAAA;AAAA,GAC1F,CAAA,CAAA;AACD,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,QAAQ,aAAe,EAAA;AACzB,MAAM,MAAA,GAAA,GAAM,IAAI,GAAI,EAAA,CAAA;AACpB,MAAA,WAAA,CAAY,KAAK,IAAI,CAAA,CAAA;AACrB,MAAM,MAAA,IAAA,GAAO,GAAI,CAAA,cAAA,CAAe,SAAS,CAAA,CAAA;AACzC,MAAA,MAAM,IAAO,GAAA,iCAAA,CAAkC,IAAM,EAAA,YAAA,CAAa,MAAM,CAAA,CAAA;AACxE,MAAA,aAAA,CAAc,QAAS,CAAA,UAAA,CAAW,IAAK,CAAA,MAAA,EAAmB,CAAA,CAAA;AAAA,KAC5D;AAAA,GACC,EAAA,CAAC,IAAM,EAAA,aAAA,EAAe,YAAY,CAAC,CAAA,CAAA;AACtC,EAAM,MAAA,OAAA,GAAU,YAAY,MAAM;AAChC,IAAA,YAAA,CAAa,QAAS,CAAA,UAAA,CAAW,aAAe,EAAA,OAAA,MAAa,EAAE,CAAA,CAAA;AAC/D,IAAA,gBAAA,GAAmB,OAAO,CAAA,CAAA;AAAA,KACzB,CAAC,gBAAA,EAAkB,YAAc,EAAA,aAAA,EAAe,OAAO,CAAC,CAAA,CAAA;AAE3D,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA;AAAA,IACE,GAAG,KAAA;AAAA,IACJ,SAAW,EAAA,UAAA;AAAA,MACT,8DAAA;AAAA,MACA,SAAA;AAAA,KACF;AAAA,IACA,GAAK,EAAA,YAAA;AAAA,IAEJ,QAAA,EAAA;AAAA,MAAA,SAAA,mBACE,GAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAU,EAAA,+CAAA;AAAA,QACb,8BAAC,WAAY,EAAA,EAAA,CAAA;AAAA,OACf,CAAA,GACE,wBACD,GAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAU,EAAA,2CAAA;AAAA,QACZ,QAAA,EAAA,CAAA,CAAE,8BAA8B,KAAK,CAAA;AAAA,OACxC,oBAEC,GAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAU,EAAA,0GAAA;AAAA,QAEb,QAAC,kBAAA,GAAA,CAAA,aAAA,EAAA;AAAA,UAAc,MAAQ,EAAA,aAAA;AAAA,SAAe,CAAA;AAAA,OACxC,CAAA;AAAA,sBAED,IAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAU,EAAA,mCAAA;AAAA,QACb,QAAA,EAAA;AAAA,0BAAC,GAAA,CAAA,MAAA,EAAA;AAAA,YAAK,SAAU,EAAA,oCAAA;AAAA,YACb,QAAE,EAAA,CAAA,CAAA,oCAAA;AAAA,8BACA,GAAA,CAAA,IAAA,EAAA;AAAA,gBACC,QAAQ,OAAQ,CAAA,OAAA,CAAQ,GAAI,CAAA,CAAC,2BAC1B,GAAA,CAAA,IAAA,EAAA;AAAA,kBAAqB,QAAQ,MAAO,CAAA,EAAA;AAAA,kBAAI,WAAW,EAAA,IAAA;AAAA,iBAAzC,EAAA,MAAA,CAAO,EAAmC,CACtD,CAAA;AAAA,gBACD,iBAAiB,CAAE,CAAA,oBAAA;AAAA,gBACnB,QAAU,EAAA,gBAAA;AAAA,gBACV,QAAQ,CAAE,CAAA,MAAA;AAAA,eACZ,CAAA;AAAA,aACF;AAAA,WACF,CAAA;AAAA,0BACC,GAAA,CAAA,KAAA,EAAA;AAAA,YAAI,SAAU,EAAA,oCAAA;AAAA,YACb,QAAC,kBAAA,IAAA,CAAA,MAAA,EAAA;AAAA,cACC,OAAS,EAAA,OAAA;AAAA,cACT,UAAU,CAAC,IAAA;AAAA,cACX,OAAQ,EAAA,SAAA;AAAA,cACR,IAAK,EAAA,OAAA;AAAA,cACL,SAAU,EAAA,mCAAA;AAAA,cAEV,QAAA,EAAA;AAAA,gCAAC,GAAA,CAAA,WAAA,EAAA;AAAA,kBAAY,SAAU,EAAA,gBAAA;AAAA,iBAAiB,CAAA;AAAA,gCACvC,GAAA,CAAA,MAAA,EAAA;AAAA,kBAAK,SAAU,EAAA,iBAAA;AAAA,kBACb,QAAE,EAAA,CAAA,CAAA,+BAAA;AAAA,iBACL,CAAA;AAAA,eAAA;AAAA,aACF,CAAA;AAAA,WACF,CAAA;AAAA,SAAA;AAAA,OACF,CAAA;AAAA,KAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAC;;;;"}
+{"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>(\n  (\n    { version, editor: parentEditor, onVersionRestore, className, ...props },\n    forwardedRef\n  ) => {\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(\n        (e) => e.type !== \"extension\"\n      ),\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(\n          root,\n          parentEditor.schema\n        );\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            <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              icon={<RestoreIcon />}\n            >\n              {$.HISTORY_VERSION_PREVIEW_RESTORE}\n            </Button>\n          </div>\n        </div>\n      </div>\n    );\n  }\n);\n"],"names":[],"mappings":"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"}

package/dist/version.js

@@ -1,7 +1,7 @@
 'use strict';
 
 const PKG_NAME = "@liveblocks/react-tiptap";
-const PKG_VERSION = typeof "2.15.1" === "string" && "2.15.1";
+const PKG_VERSION = typeof "2.16.0-toolbars1" === "string" && "2.16.0-toolbars1";
 const PKG_FORMAT = typeof "cjs" === "string" && "cjs";
 
 exports.PKG_FORMAT = PKG_FORMAT;

package/dist/version.js.map

@@ -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,QAAA,KAAgB,QAAY,IAAA,SAAA;AACjD,MAAA,UAAA,GAAa,OAAO,KAAA,KAAkB,QAAY,IAAA;;;;;;"}
+{"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,kBAAA,KAAgB,QAAY,IAAA,mBAAA;AACjD,MAAA,UAAA,GAAa,OAAO,KAAA,KAAkB,QAAY,IAAA;;;;;;"}

package/dist/version.mjs

@@ -1,5 +1,5 @@
 const PKG_NAME = "@liveblocks/react-tiptap";
-const PKG_VERSION = typeof "2.15.1" === "string" && "2.15.1";
+const PKG_VERSION = typeof "2.16.0-toolbars1" === "string" && "2.16.0-toolbars1";
 const PKG_FORMAT = typeof "esm" === "string" && "esm";
 
 export { PKG_FORMAT, PKG_NAME, PKG_VERSION };

package/dist/version.mjs.map

@@ -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,QAAA,KAAgB,QAAY,IAAA,SAAA;AACjD,MAAA,UAAA,GAAa,OAAO,KAAA,KAAkB,QAAY,IAAA;;;;"}
+{"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,kBAAA,KAAgB,QAAY,IAAA,mBAAA;AACjD,MAAA,UAAA,GAAa,OAAO,KAAA,KAAkB,QAAY,IAAA;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@liveblocks/react-tiptap",
-  "version": "2.15.1",
+  "version": "2.16.0-toolbars1",
   "description": "A tiptap react plugin to enable collaboration, comments, live cursors, and more.",
   "license": "Apache-2.0",
   "type": "commonjs",
@@ -42,14 +42,17 @@
   },
   "dependencies": {
     "@floating-ui/react-dom": "^2.1.2",
-    "@liveblocks/client": "2.15.1",
-    "@liveblocks/core": "2.15.1",
-    "@liveblocks/react": "2.15.1",
-    "@liveblocks/react-ui": "2.15.1",
-    "@liveblocks/yjs": "2.15.1",
+    "@liveblocks/client": "2.16.0-toolbars1",
+    "@liveblocks/core": "2.16.0-toolbars1",
+    "@liveblocks/react": "2.16.0-toolbars1",
+    "@liveblocks/react-ui": "2.16.0-toolbars1",
+    "@liveblocks/yjs": "2.16.0-toolbars1",
+    "@radix-ui/react-select": "^2.1.2",
+    "@radix-ui/react-toggle": "^1.1.0",
     "@tiptap/core": "^2.7.2",
     "@tiptap/react": "^2.7.2",
     "@tiptap/suggestion": "^2.7.2",
+    "cmdk": "^1.0.4",
     "y-prosemirror": "^1.2.12",
     "yjs": "^13.6.18"
   },
@@ -69,7 +72,7 @@
     "@testing-library/jest-dom": "^5.16.5",
     "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "msw": "^0.27.1",
+    "msw": "^1.3.5",
     "rollup": "3.28.0",
     "stylelint": "^15.10.2",
     "stylelint-config-standard": "^34.0.0",
@@ -82,7 +85,7 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/liveblocks/liveblocks.git",
+    "url": "git+https://github.com/liveblocks/liveblocks.git",
     "directory": "packages/liveblocks-react-tiptap"
   },
   "homepage": "https://liveblocks.io",

package/src/styles/constants.css

@@ -1,4 +1,5 @@
-$lb-elevation-list-padding: 4px;
+$lb-button-size: calc(2 * 0.25 * var(--lb-spacing) + var(--lb-icon-size));
+$lb-elevation-padding: 4px;
 $lb-tiptap-anchored-threads-shadow:
   0 0 0 1px rgb(0 0 0 / 4%),
   0 2px 6px rgb(0 0 0 / 4%),

package/src/styles/index.css

@@ -37,7 +37,7 @@
  *************************************/
 
 .lb-tiptap-suggestions {
-  padding: $lb-elevation-list-padding;
+  padding: $lb-elevation-padding;
   animation-duration: var(--lb-transition-duration);
   animation-timing-function: var(--lb-transition-easing);
   will-change: transform, opacity;
@@ -47,23 +47,26 @@
   display: flex;
   align-items: center;
   padding: calc(0.25 * var(--lb-spacing)) calc(0.5 * var(--lb-spacing));
-  border-radius: calc(var(--lb-radius) - 0.75 * $lb-elevation-list-padding);
+  border-radius: calc(var(--lb-radius) - 0.75 * $lb-elevation-padding);
   color: var(--lb-foreground-secondary);
   outline: none;
   font-size: 0.875rem;
   cursor: pointer;
   user-select: none;
   transition-property: background, color, opacity;
-  scroll-margin-block: $lb-elevation-list-padding;
+  scroll-margin-block: $lb-elevation-padding;
 }
 
 :is(.lb-tiptap-suggestions-list-item) {
-  &:where([data-highlighted], [data-selected]) {
+  &:where(
+      [data-highlighted]:not([data-highlighted="false"]),
+      [data-selected]:not([data-selected="false"])
+    ) {
     background: var(--lb-foreground-subtle);
     transition-duration: calc(var(--lb-transition-duration) / 2);
   }
 
-  &:where(:disabled, [data-disabled]) {
+  &:where(:disabled, [data-disabled]:not([data-disabled="false"])) {
     opacity: 0.5;
     cursor: not-allowed;
   }
@@ -209,13 +212,62 @@
   inline-size: var(--lb-tiptap-floating-size);
 }
 
+/*************************************
+ *         Active selection          *
+ *************************************/
+
 .lb-tiptap-active-selection {
   background: var(--lb-selection, rgb(0 0 255 / 20%));
   pointer-events: none;
 }
 
 /*************************************
- *         Collab Cursors            *
+ *              Toolbar              *
+ *************************************/
+
+.lb-tiptap-toolbar {
+  --lb-tiptap-toolbar-spacing: calc(0.25 * var(--lb-spacing));
+
+  position: relative;
+  display: flex;
+  flex-direction: row;
+  gap: var(--lb-tiptap-toolbar-spacing);
+  align-items: center;
+  padding: var(--lb-tiptap-toolbar-spacing);
+  background: var(--lb-background);
+
+  /* overflow-inline: auto; doesn't work as expected */
+  /* stylelint-disable-next-line plugin/use-logical-properties-and-values */
+  overflow-x: auto;
+
+  @include invisible-scrollbar;
+
+  > * {
+    flex: none;
+  }
+}
+
+.lb-tiptap-floating-toolbar {
+  --lb-tiptap-toolbar-spacing: $lb-elevation-padding;
+}
+
+.lb-tiptap-toolbar-separator {
+  position: relative;
+  align-self: stretch;
+  inline-size: 1px;
+  margin-inline: 1px;
+  pointer-events: none;
+
+  &::before {
+    content: "";
+    position: absolute;
+    inset: 10% 0;
+    background: var(--lb-foreground-subtle);
+  }
+}
+
+/*************************************
+ *          Collab Cursors           *
  *************************************/
 
 /* Give a remote user a caret */