@liveblocks/react-tiptap 2.15.2 → 2.16.0-toolbars2

package/dist/comments/FloatingComposer.mjs

@@ -1,27 +1,25 @@
 import { jsx } from 'react/jsx-runtime';
-import { useFloating, flip, offset, hide, shift, limitShift, size, autoUpdate } from '@floating-ui/react-dom';
+import { useFloating, inline, flip, offset, hide, shift, limitShift, size, autoUpdate } from '@floating-ui/react-dom';
 import { useCreateThread } from '@liveblocks/react';
 import { useLayoutEffect } from '@liveblocks/react/_private';
 import { Composer } from '@liveblocks/react-ui';
 import { useEditorState } from '@tiptap/react';
-import { forwardRef, useCallback, useEffect } from 'react';
+import { forwardRef, useCallback } from 'react';
 import { createPortal } from 'react-dom';
+import { compareTextSelections, getDomRangeFromTextSelection } from '../utils.mjs';
 
 const FLOATING_COMPOSER_COLLISION_PADDING = 10;
 const FloatingComposer = forwardRef(function FloatingComposer2(props, forwardedRef) {
   const createThread = useCreateThread();
   const { editor, onComposerSubmit, onKeyDown } = props;
-  const { showComposer } = useEditorState({
+  const pendingCommentSelection = useEditorState({
     editor,
-    selector: (ctx) => ({
-      showComposer: !!ctx.editor?.storage.liveblocksComments?.pendingCommentSelection
-    }),
-    equalityFn: (prev, next) => {
-      if (!next)
-        return false;
-      return prev.showComposer === next.showComposer;
-    }
-  }) ?? { showComposer: false };
+    selector: (ctx) => {
+      return ctx.editor?.storage.liveblocksComments?.pendingCommentSelection;
+    },
+    equalityFn: compareTextSelections
+  }) ?? void 0;
+  const isOpen = pendingCommentSelection !== void 0;
   const {
     refs: { setReference, setFloating },
     strategy,
@@ -31,6 +29,7 @@ const FloatingComposer = forwardRef(function FloatingComposer2(props, forwardedR
     strategy: "fixed",
     placement: "bottom",
     middleware: [
+      inline({ padding: FLOATING_COMPOSER_COLLISION_PADDING }),
       flip({ padding: FLOATING_COMPOSER_COLLISION_PADDING, crossAxis: false }),
       offset(10),
       hide({ padding: FLOATING_COMPOSER_COLLISION_PADDING }),
@@ -46,25 +45,20 @@ const FloatingComposer = forwardRef(function FloatingComposer2(props, forwardedR
       });
     }
   });
-  const updateRef = useCallback(() => {
-    if (!editor || !showComposer) {
+  useLayoutEffect(() => {
+    if (!editor || !isOpen) {
       return;
     }
-    const el = editor.view.dom.querySelector(".lb-tiptap-active-selection");
-    if (el) {
-      setReference(el);
-    }
-  }, [setReference, editor, showComposer]);
-  useEffect(() => {
-    if (!editor || !showComposer) {
-      return;
+    if (!pendingCommentSelection) {
+      setReference(null);
+    } else {
+      const domRange = getDomRangeFromTextSelection(
+        pendingCommentSelection,
+        editor
+      );
+      setReference(domRange);
     }
-    editor.on("transaction", updateRef);
-    return () => {
-      editor.off("transaction", updateRef);
-    };
-  }, [editor, updateRef, showComposer]);
-  useLayoutEffect(updateRef, [updateRef]);
+  }, [pendingCommentSelection, editor, isOpen, setReference]);
   const handleComposerSubmit = useCallback(
     (comment, event) => {
       onComposerSubmit?.(comment, event);
@@ -85,14 +79,17 @@ const FloatingComposer = forwardRef(function FloatingComposer2(props, forwardedR
   );
   const handleKeyDown = useCallback(
     (event) => {
-      if (event.key === "Escape" && editor) {
-        editor.commands.focus();
-      }
       onKeyDown?.(event);
+      if (event.isDefaultPrevented() || !editor) {
+        return;
+      }
+      if (event.key === "Escape") {
+        editor.chain().closePendingComment().run();
+      }
     },
     [editor, onKeyDown]
   );
-  if (!showComposer || !editor) {
+  if (!isOpen || !editor) {
     return null;
   }
   return createPortal(

package/dist/comments/FloatingComposer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingComposer.mjs","sources":["../../src/comments/FloatingComposer.tsx"],"sourcesContent":["import {\n  autoUpdate,\n  flip,\n  hide,\n  limitShift,\n  offset,\n  shift,\n  size,\n  useFloating,\n} from \"@floating-ui/react-dom\";\nimport type { BaseMetadata } from \"@liveblocks/client\";\nimport type { DM } from \"@liveblocks/core\";\nimport { useCreateThread } from \"@liveblocks/react\";\nimport { useLayoutEffect } from \"@liveblocks/react/_private\";\nimport type {\n  ComposerProps,\n  ComposerSubmitComment,\n} from \"@liveblocks/react-ui\";\nimport { Composer } from \"@liveblocks/react-ui\";\nimport { type Editor, useEditorState } from \"@tiptap/react\";\nimport type { ComponentRef, FormEvent, KeyboardEvent } from \"react\";\nimport { forwardRef, useCallback, useEffect } from \"react\";\nimport { createPortal } from \"react-dom\";\n\nimport type { CommentsExtensionStorage } from \"../types\";\n\nexport type FloatingComposerProps<M extends BaseMetadata = DM> = Omit<\n  ComposerProps<M>,\n  \"threadId\" | \"commentId\"\n> & {\n  editor: Editor | null;\n};\n\ntype ComposerElement = ComponentRef<typeof Composer>;\n\nexport const FLOATING_COMPOSER_COLLISION_PADDING = 10;\n\nexport const FloatingComposer = forwardRef<\n  ComposerElement,\n  FloatingComposerProps\n>(function FloatingComposer(props, forwardedRef) {\n  const createThread = useCreateThread();\n  const { editor, onComposerSubmit, onKeyDown } = props;\n  const { showComposer } = useEditorState({\n    editor,\n    selector: (ctx) => ({\n      showComposer: !!(\n        ctx.editor?.storage.liveblocksComments as\n          | CommentsExtensionStorage\n          | undefined\n      )?.pendingCommentSelection,\n    }),\n    equalityFn: (prev, next) => {\n      if (!next) return false;\n      return prev.showComposer === next.showComposer;\n    },\n  }) ?? { showComposer: false };\n\n  const {\n    refs: { setReference, setFloating },\n    strategy,\n    x,\n    y,\n  } = useFloating({\n    strategy: \"fixed\",\n    placement: \"bottom\",\n    middleware: [\n      flip({ padding: FLOATING_COMPOSER_COLLISION_PADDING, crossAxis: false }),\n      offset(10),\n      hide({ padding: FLOATING_COMPOSER_COLLISION_PADDING }),\n      shift({\n        padding: FLOATING_COMPOSER_COLLISION_PADDING,\n        limiter: limitShift(),\n      }),\n      size({ padding: FLOATING_COMPOSER_COLLISION_PADDING }),\n    ],\n    whileElementsMounted: (...args) => {\n      return autoUpdate(...args, {\n        animationFrame: true,\n      });\n    },\n  });\n\n  const updateRef = useCallback(() => {\n    if (!editor || !showComposer) {\n      return;\n    }\n    const el = editor.view.dom.querySelector(\".lb-tiptap-active-selection\");\n    if (el) {\n      setReference(el);\n    }\n  }, [setReference, editor, showComposer]);\n\n  // Remote cursor updates and other edits can cause the ref to break\n  useEffect(() => {\n    if (!editor || !showComposer) {\n      return;\n    }\n    editor.on(\"transaction\", updateRef);\n    return () => {\n      editor.off(\"transaction\", updateRef);\n    };\n  }, [editor, updateRef, showComposer]);\n\n  useLayoutEffect(updateRef, [updateRef]);\n\n  // Submit a new thread and update the comment highlight to show a completed highlight\n  const handleComposerSubmit = useCallback(\n    (comment: ComposerSubmitComment, event: FormEvent<HTMLFormElement>) => {\n      onComposerSubmit?.(comment, event);\n      if (event.defaultPrevented) return;\n\n      if (!editor) {\n        return;\n      }\n      event.preventDefault();\n\n      const thread = createThread({\n        body: comment.body,\n        attachments: comment.attachments,\n        metadata: props.metadata ?? {},\n      });\n      editor.commands.addComment(thread.id);\n    },\n    [onComposerSubmit, editor, createThread, props.metadata]\n  );\n\n  const handleKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLFormElement>) => {\n      if (event.key === \"Escape\" && editor) {\n        editor.commands.focus();\n      }\n      onKeyDown?.(event);\n    },\n    [editor, onKeyDown]\n  );\n\n  if (!showComposer || !editor) {\n    return null;\n  }\n\n  return createPortal(\n    <div\n      className=\"lb-root lb-portal lb-elevation lb-tiptap-floating lb-tiptap-floating-composer\"\n      ref={setFloating}\n      style={{\n        position: strategy,\n        top: 0,\n        left: 0,\n        transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,\n        minWidth: \"max-content\",\n      }}\n    >\n      <Composer\n        ref={forwardedRef}\n        {...props}\n        onKeyDown={handleKeyDown}\n        onComposerSubmit={handleComposerSubmit}\n        onClick={(e) => {\n          // Don't send up a click event from emoji popout and close the composer\n          e.stopPropagation();\n        }}\n        autoFocus={true}\n      />\n    </div>,\n    document.body\n  );\n});\n"],"names":["FloatingComposer"],"mappings":"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"}
+{"version":3,"file":"FloatingComposer.mjs","sources":["../../src/comments/FloatingComposer.tsx"],"sourcesContent":["import {\n  autoUpdate,\n  flip,\n  hide,\n  inline,\n  limitShift,\n  offset,\n  shift,\n  size,\n  useFloating,\n} from \"@floating-ui/react-dom\";\nimport type { BaseMetadata } from \"@liveblocks/client\";\nimport type { DM } from \"@liveblocks/core\";\nimport { useCreateThread } from \"@liveblocks/react\";\nimport { useLayoutEffect } from \"@liveblocks/react/_private\";\nimport type {\n  ComposerProps,\n  ComposerSubmitComment,\n} from \"@liveblocks/react-ui\";\nimport { Composer } from \"@liveblocks/react-ui\";\nimport { type Editor, useEditorState } from \"@tiptap/react\";\nimport type { ComponentRef, FormEvent, KeyboardEvent } from \"react\";\nimport { forwardRef, useCallback } from \"react\";\nimport { createPortal } from \"react-dom\";\n\nimport type {\n  CommentsExtensionStorage,\n  ExtendedChainedCommands,\n} from \"../types\";\nimport { compareTextSelections, getDomRangeFromTextSelection } from \"../utils\";\n\nexport type FloatingComposerProps<M extends BaseMetadata = DM> = Omit<\n  ComposerProps<M>,\n  \"threadId\" | \"commentId\"\n> & {\n  editor: Editor | null;\n};\n\ntype ComposerElement = ComponentRef<typeof Composer>;\n\nexport const FLOATING_COMPOSER_COLLISION_PADDING = 10;\n\nexport const FloatingComposer = forwardRef<\n  ComposerElement,\n  FloatingComposerProps\n>(function FloatingComposer(props, forwardedRef) {\n  const createThread = useCreateThread();\n  const { editor, onComposerSubmit, onKeyDown } = props;\n  const pendingCommentSelection =\n    useEditorState({\n      editor,\n      selector: (ctx) => {\n        return (\n          ctx.editor?.storage.liveblocksComments as\n            | CommentsExtensionStorage\n            | undefined\n        )?.pendingCommentSelection;\n      },\n      equalityFn: compareTextSelections,\n    }) ?? undefined;\n  const isOpen = pendingCommentSelection !== undefined;\n  const {\n    refs: { setReference, setFloating },\n    strategy,\n    x,\n    y,\n  } = useFloating({\n    strategy: \"fixed\",\n    placement: \"bottom\",\n    middleware: [\n      inline({ padding: FLOATING_COMPOSER_COLLISION_PADDING }),\n      flip({ padding: FLOATING_COMPOSER_COLLISION_PADDING, crossAxis: false }),\n      offset(10),\n      hide({ padding: FLOATING_COMPOSER_COLLISION_PADDING }),\n      shift({\n        padding: FLOATING_COMPOSER_COLLISION_PADDING,\n        limiter: limitShift(),\n      }),\n      size({ padding: FLOATING_COMPOSER_COLLISION_PADDING }),\n    ],\n    whileElementsMounted: (...args) => {\n      return autoUpdate(...args, {\n        animationFrame: true,\n      });\n    },\n  });\n\n  useLayoutEffect(() => {\n    if (!editor || !isOpen) {\n      return;\n    }\n\n    if (!pendingCommentSelection) {\n      setReference(null);\n    } else {\n      const domRange = getDomRangeFromTextSelection(\n        pendingCommentSelection,\n        editor\n      );\n\n      setReference(domRange);\n    }\n  }, [pendingCommentSelection, editor, isOpen, setReference]);\n\n  // Submit a new thread and update the comment highlight to show a completed highlight\n  const handleComposerSubmit = useCallback(\n    (comment: ComposerSubmitComment, event: FormEvent<HTMLFormElement>) => {\n      onComposerSubmit?.(comment, event);\n      if (event.defaultPrevented) return;\n\n      if (!editor) {\n        return;\n      }\n      event.preventDefault();\n\n      const thread = createThread({\n        body: comment.body,\n        attachments: comment.attachments,\n        metadata: props.metadata ?? {},\n      });\n      editor.commands.addComment(thread.id);\n    },\n    [onComposerSubmit, editor, createThread, props.metadata]\n  );\n\n  const handleKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLFormElement>) => {\n      onKeyDown?.(event);\n\n      if (event.isDefaultPrevented() || !editor) {\n        return;\n      }\n\n      if (event.key === \"Escape\") {\n        (editor.chain() as ExtendedChainedCommands<\"closePendingComment\">)\n          .closePendingComment()\n          .run();\n      }\n    },\n    [editor, onKeyDown]\n  );\n\n  if (!isOpen || !editor) {\n    return null;\n  }\n\n  return createPortal(\n    <div\n      className=\"lb-root lb-portal lb-elevation lb-tiptap-floating lb-tiptap-floating-composer\"\n      ref={setFloating}\n      style={{\n        position: strategy,\n        top: 0,\n        left: 0,\n        transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,\n        minWidth: \"max-content\",\n      }}\n    >\n      <Composer\n        ref={forwardedRef}\n        {...props}\n        onKeyDown={handleKeyDown}\n        onComposerSubmit={handleComposerSubmit}\n        onClick={(e) => {\n          // Don't send up a click event from emoji popout and close the composer\n          e.stopPropagation();\n        }}\n        autoFocus={true}\n      />\n    </div>,\n    document.body\n  );\n});\n"],"names":["FloatingComposer"],"mappings":"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"}

package/dist/context.js

@@ -0,0 +1,24 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@liveblocks/core');
+var react = require('react');
+
+const EditorContext = react.createContext(null);
+function EditorProvider({
+  editor,
+  children
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(EditorContext.Provider, {
+    value: editor,
+    children
+  });
+}
+function useCurrentEditor(source, parent) {
+  const currentEditor = react.useContext(EditorContext);
+  return core.nn(currentEditor, `${source} can\u2019t be used outside of ${parent}.`);
+}
+
+exports.EditorProvider = EditorProvider;
+exports.useCurrentEditor = useCurrentEditor;
+//# sourceMappingURL=context.js.map

package/dist/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","sources":["../src/context.tsx"],"sourcesContent":["import { nn } from \"@liveblocks/core\";\nimport type { Editor } from \"@tiptap/react\";\nimport type { PropsWithChildren } from \"react\";\nimport { createContext, useContext } from \"react\";\n\nconst EditorContext = createContext<Editor | null>(null);\n\nexport function EditorProvider({\n  editor,\n  children,\n}: PropsWithChildren<{ editor: Editor }>) {\n  return (\n    <EditorContext.Provider value={editor}>{children}</EditorContext.Provider>\n  );\n}\n\n/**\n * @tiptap/react already offers a `useCurrentEditor` hook but our components might\n * not live under `EditorProvider` or `EditorContent` so we create our own to reduce\n * repetition within our own nested components.\n *\n * @example\n * <Toolbar editor={editor}> // `editor` is required here\n *   <ToolbarSectionInline /> // But it isn't there, because `Toolbar` uses our own `EditorProvider`\n * </Toolbar>\n */\nexport function useCurrentEditor(source: string, parent: string) {\n  const currentEditor = useContext(EditorContext);\n\n  return nn(currentEditor, `${source} can’t be used outside of ${parent}.`);\n}\n"],"names":["createContext","jsx","useContext","nn"],"mappings":";;;;;;AAKA,MAAM,aAAA,GAAgBA,oBAA6B,IAAI,CAAA,CAAA;AAEhD,SAAS,cAAe,CAAA;AAAA,EAC7B,MAAA;AAAA,EACA,QAAA;AACF,CAA0C,EAAA;AACxC,EACE,uBAAAC,cAAA,CAAC,cAAc,QAAd,EAAA;AAAA,IAAuB,KAAO,EAAA,MAAA;AAAA,IAAS,QAAA;AAAA,GAAS,CAAA,CAAA;AAErD,CAAA;AAYgB,SAAA,gBAAA,CAAiB,QAAgB,MAAgB,EAAA;AAC/D,EAAM,MAAA,aAAA,GAAgBC,iBAAW,aAAa,CAAA,CAAA;AAE9C,EAAA,OAAOC,OAAG,CAAA,aAAA,EAAe,CAAG,EAAA,MAAA,CAAA,+BAAA,EAAmC,MAAS,CAAA,CAAA,CAAA,CAAA,CAAA;AAC1E;;;;;"}

package/dist/context.mjs

@@ -0,0 +1,21 @@
+import { jsx } from 'react/jsx-runtime';
+import { nn } from '@liveblocks/core';
+import { createContext, useContext } from 'react';
+
+const EditorContext = createContext(null);
+function EditorProvider({
+  editor,
+  children
+}) {
+  return /* @__PURE__ */ jsx(EditorContext.Provider, {
+    value: editor,
+    children
+  });
+}
+function useCurrentEditor(source, parent) {
+  const currentEditor = useContext(EditorContext);
+  return nn(currentEditor, `${source} can\u2019t be used outside of ${parent}.`);
+}
+
+export { EditorProvider, useCurrentEditor };
+//# sourceMappingURL=context.mjs.map

package/dist/context.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.mjs","sources":["../src/context.tsx"],"sourcesContent":["import { nn } from \"@liveblocks/core\";\nimport type { Editor } from \"@tiptap/react\";\nimport type { PropsWithChildren } from \"react\";\nimport { createContext, useContext } from \"react\";\n\nconst EditorContext = createContext<Editor | null>(null);\n\nexport function EditorProvider({\n  editor,\n  children,\n}: PropsWithChildren<{ editor: Editor }>) {\n  return (\n    <EditorContext.Provider value={editor}>{children}</EditorContext.Provider>\n  );\n}\n\n/**\n * @tiptap/react already offers a `useCurrentEditor` hook but our components might\n * not live under `EditorProvider` or `EditorContent` so we create our own to reduce\n * repetition within our own nested components.\n *\n * @example\n * <Toolbar editor={editor}> // `editor` is required here\n *   <ToolbarSectionInline /> // But it isn't there, because `Toolbar` uses our own `EditorProvider`\n * </Toolbar>\n */\nexport function useCurrentEditor(source: string, parent: string) {\n  const currentEditor = useContext(EditorContext);\n\n  return nn(currentEditor, `${source} can’t be used outside of ${parent}.`);\n}\n"],"names":[],"mappings":";;;;AAKA,MAAM,aAAA,GAAgB,cAA6B,IAAI,CAAA,CAAA;AAEhD,SAAS,cAAe,CAAA;AAAA,EAC7B,MAAA;AAAA,EACA,QAAA;AACF,CAA0C,EAAA;AACxC,EACE,uBAAA,GAAA,CAAC,cAAc,QAAd,EAAA;AAAA,IAAuB,KAAO,EAAA,MAAA;AAAA,IAAS,QAAA;AAAA,GAAS,CAAA,CAAA;AAErD,CAAA;AAYgB,SAAA,gBAAA,CAAiB,QAAgB,MAAgB,EAAA;AAC/D,EAAM,MAAA,aAAA,GAAgB,WAAW,aAAa,CAAA,CAAA;AAE9C,EAAA,OAAO,EAAG,CAAA,aAAA,EAAe,CAAG,EAAA,MAAA,CAAA,+BAAA,EAAmC,MAAS,CAAA,CAAA,CAAA,CAAA,CAAA;AAC1E;;;;"}

package/dist/index.d.mts

@@ -3,11 +3,21 @@ import { BaseMetadata, DM, ThreadData, HistoryVersion } from '@liveblocks/core';
 import { ThreadProps, ComposerProps } from '@liveblocks/react-ui';
 import { Editor } from '@tiptap/react';
 import * as react from 'react';
-import { ComponentPropsWithoutRef, ComponentType, HTMLAttributes } from 'react';
+import { ComponentPropsWithoutRef, ComponentType, HTMLAttributes, ComponentProps, ReactNode } from 'react';
 import { BaseMetadata as BaseMetadata$1 } from '@liveblocks/client';
 import { Extension, Content } from '@tiptap/core';
 
-declare type AnchoredThreadsComponents = {
+type FloatingPosition = "top" | "bottom";
+type CommentsCommands<ReturnType> = {
+    /**
+     * Add a comment
+     */
+    addComment: (id: string) => ReturnType;
+    selectThread: (id: string | null) => ReturnType;
+    addPendingComment: () => ReturnType;
+};
+
+type AnchoredThreadsComponents = {
     Thread: ComponentType<ThreadProps>;
 };
 interface AnchoredThreadsProps<M extends BaseMetadata = DM> extends Omit<ComponentPropsWithoutRef<"div">, "children"> {
@@ -30,7 +40,7 @@ declare const FloatingComposer: react.ForwardRefExoticComponent<Omit<ComposerPro
     editor: Editor | null;
 } & react.RefAttributes<HTMLFormElement>>;
 
-declare type ThreadPanelComponents = {
+type ThreadPanelComponents = {
     Thread: ComponentType<ThreadProps>;
 };
 interface FloatingThreadsProps<M extends BaseMetadata = DM> extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
@@ -49,7 +59,7 @@ interface FloatingThreadsProps<M extends BaseMetadata = DM> extends Omit<HTMLAtt
 }
 declare function FloatingThreads({ threads, components, editor, ...props }: FloatingThreadsProps): react_jsx_runtime.JSX.Element | null;
 
-declare type LiveblocksExtensionOptions = {
+type LiveblocksExtensionOptions = {
     field?: string;
     comments?: boolean;
     mentions?: boolean;
@@ -64,6 +74,57 @@ declare type LiveblocksExtensionOptions = {
 declare function useIsEditorReady(): boolean;
 declare const useLiveblocksExtension: (opts?: LiveblocksExtensionOptions) => Extension;
 
+interface ToolbarSlotProps {
+    editor: Editor;
+}
+type ToolbarSlot = ReactNode | ComponentType<ToolbarSlotProps>;
+interface ToolbarProps extends Omit<ComponentProps<"div">, "children"> {
+    editor: Editor | null;
+    children?: ToolbarSlot;
+    before?: ToolbarSlot;
+    after?: ToolbarSlot;
+}
+interface ToolbarButtonProps extends ComponentProps<"button"> {
+    icon?: ReactNode;
+    name: string;
+    shortcut?: string;
+}
+interface ToolbarToggleProps extends ToolbarButtonProps {
+    active: boolean;
+}
+interface ToolbarBlockSelectorItem {
+    name: string;
+    isActive: (editor: Editor) => boolean;
+    setActive: (editor: Editor) => void;
+}
+interface ToolbarBlockSelectorProps extends ComponentProps<"button"> {
+    items?: ToolbarBlockSelectorItem[];
+}
+declare function ToolbarSectionHistory(): react_jsx_runtime.JSX.Element;
+declare function ToolbarSectionInline(): react_jsx_runtime.JSX.Element;
+declare function ToolbarSectionCollaboration(): react_jsx_runtime.JSX.Element;
+declare const Toolbar: react.ForwardRefExoticComponent<Omit<ToolbarProps, "ref"> & react.RefAttributes<HTMLDivElement>> & {
+    Button: react.ForwardRefExoticComponent<Omit<ToolbarButtonProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+    Toggle: react.ForwardRefExoticComponent<Omit<ToolbarToggleProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+    Separator: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+    SectionHistory: typeof ToolbarSectionHistory;
+    SectionInline: typeof ToolbarSectionInline;
+    SectionCollaboration: typeof ToolbarSectionCollaboration;
+    BlockSelector: react.ForwardRefExoticComponent<Omit<ToolbarBlockSelectorProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+};
+
+interface FloatingToolbarProps extends Omit<ComponentProps<"div">, "children"> {
+    editor: Editor | null;
+    position?: FloatingPosition;
+    offset?: number;
+    children?: ToolbarSlot;
+    before?: ToolbarSlot;
+    after?: ToolbarSlot;
+}
+declare const FloatingToolbar: react.ForwardRefExoticComponent<Omit<FloatingToolbarProps, "ref"> & react.RefAttributes<HTMLDivElement>> & {
+    External: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+};
+
 interface HistoryVersionPreviewProps extends ComponentPropsWithoutRef<"div"> {
     version: HistoryVersion;
     editor: Editor;
@@ -79,15 +140,8 @@ declare const HistoryVersionPreview: react.ForwardRefExoticComponent<HistoryVers
 
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
-        comments: {
-            /**
-             * Add a comment
-             */
-            addComment: (id: string) => ReturnType;
-            selectThread: (id: string | null) => ReturnType;
-            addPendingComment: () => ReturnType;
-        };
+        comments: CommentsCommands<ReturnType>;
     }
 }
 
-export { AnchoredThreads, FloatingComposer, FloatingThreads, HistoryVersionPreview, useIsEditorReady, useLiveblocksExtension };
+export { AnchoredThreads, FloatingComposer, FloatingThreads, FloatingToolbar, HistoryVersionPreview, Toolbar, useIsEditorReady, useLiveblocksExtension };

package/dist/index.d.ts

@@ -3,11 +3,21 @@ import { BaseMetadata, DM, ThreadData, HistoryVersion } from '@liveblocks/core';
 import { ThreadProps, ComposerProps } from '@liveblocks/react-ui';
 import { Editor } from '@tiptap/react';
 import * as react from 'react';
-import { ComponentPropsWithoutRef, ComponentType, HTMLAttributes } from 'react';
+import { ComponentPropsWithoutRef, ComponentType, HTMLAttributes, ComponentProps, ReactNode } from 'react';
 import { BaseMetadata as BaseMetadata$1 } from '@liveblocks/client';
 import { Extension, Content } from '@tiptap/core';
 
-declare type AnchoredThreadsComponents = {
+type FloatingPosition = "top" | "bottom";
+type CommentsCommands<ReturnType> = {
+    /**
+     * Add a comment
+     */
+    addComment: (id: string) => ReturnType;
+    selectThread: (id: string | null) => ReturnType;
+    addPendingComment: () => ReturnType;
+};
+
+type AnchoredThreadsComponents = {
     Thread: ComponentType<ThreadProps>;
 };
 interface AnchoredThreadsProps<M extends BaseMetadata = DM> extends Omit<ComponentPropsWithoutRef<"div">, "children"> {
@@ -30,7 +40,7 @@ declare const FloatingComposer: react.ForwardRefExoticComponent<Omit<ComposerPro
     editor: Editor | null;
 } & react.RefAttributes<HTMLFormElement>>;
 
-declare type ThreadPanelComponents = {
+type ThreadPanelComponents = {
     Thread: ComponentType<ThreadProps>;
 };
 interface FloatingThreadsProps<M extends BaseMetadata = DM> extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
@@ -49,7 +59,7 @@ interface FloatingThreadsProps<M extends BaseMetadata = DM> extends Omit<HTMLAtt
 }
 declare function FloatingThreads({ threads, components, editor, ...props }: FloatingThreadsProps): react_jsx_runtime.JSX.Element | null;
 
-declare type LiveblocksExtensionOptions = {
+type LiveblocksExtensionOptions = {
     field?: string;
     comments?: boolean;
     mentions?: boolean;
@@ -64,6 +74,57 @@ declare type LiveblocksExtensionOptions = {
 declare function useIsEditorReady(): boolean;
 declare const useLiveblocksExtension: (opts?: LiveblocksExtensionOptions) => Extension;
 
+interface ToolbarSlotProps {
+    editor: Editor;
+}
+type ToolbarSlot = ReactNode | ComponentType<ToolbarSlotProps>;
+interface ToolbarProps extends Omit<ComponentProps<"div">, "children"> {
+    editor: Editor | null;
+    children?: ToolbarSlot;
+    before?: ToolbarSlot;
+    after?: ToolbarSlot;
+}
+interface ToolbarButtonProps extends ComponentProps<"button"> {
+    icon?: ReactNode;
+    name: string;
+    shortcut?: string;
+}
+interface ToolbarToggleProps extends ToolbarButtonProps {
+    active: boolean;
+}
+interface ToolbarBlockSelectorItem {
+    name: string;
+    isActive: (editor: Editor) => boolean;
+    setActive: (editor: Editor) => void;
+}
+interface ToolbarBlockSelectorProps extends ComponentProps<"button"> {
+    items?: ToolbarBlockSelectorItem[];
+}
+declare function ToolbarSectionHistory(): react_jsx_runtime.JSX.Element;
+declare function ToolbarSectionInline(): react_jsx_runtime.JSX.Element;
+declare function ToolbarSectionCollaboration(): react_jsx_runtime.JSX.Element;
+declare const Toolbar: react.ForwardRefExoticComponent<Omit<ToolbarProps, "ref"> & react.RefAttributes<HTMLDivElement>> & {
+    Button: react.ForwardRefExoticComponent<Omit<ToolbarButtonProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+    Toggle: react.ForwardRefExoticComponent<Omit<ToolbarToggleProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+    Separator: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+    SectionHistory: typeof ToolbarSectionHistory;
+    SectionInline: typeof ToolbarSectionInline;
+    SectionCollaboration: typeof ToolbarSectionCollaboration;
+    BlockSelector: react.ForwardRefExoticComponent<Omit<ToolbarBlockSelectorProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+};
+
+interface FloatingToolbarProps extends Omit<ComponentProps<"div">, "children"> {
+    editor: Editor | null;
+    position?: FloatingPosition;
+    offset?: number;
+    children?: ToolbarSlot;
+    before?: ToolbarSlot;
+    after?: ToolbarSlot;
+}
+declare const FloatingToolbar: react.ForwardRefExoticComponent<Omit<FloatingToolbarProps, "ref"> & react.RefAttributes<HTMLDivElement>> & {
+    External: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+};
+
 interface HistoryVersionPreviewProps extends ComponentPropsWithoutRef<"div"> {
     version: HistoryVersion;
     editor: Editor;
@@ -79,15 +140,8 @@ declare const HistoryVersionPreview: react.ForwardRefExoticComponent<HistoryVers
 
 declare module "@tiptap/core" {
     interface Commands<ReturnType> {
-        comments: {
-            /**
-             * Add a comment
-             */
-            addComment: (id: string) => ReturnType;
-            selectThread: (id: string | null) => ReturnType;
-            addPendingComment: () => ReturnType;
-        };
+        comments: CommentsCommands<ReturnType>;
     }
 }
 
-export { AnchoredThreads, FloatingComposer, FloatingThreads, HistoryVersionPreview, useIsEditorReady, useLiveblocksExtension };
+export { AnchoredThreads, FloatingComposer, FloatingThreads, FloatingToolbar, HistoryVersionPreview, Toolbar, useIsEditorReady, useLiveblocksExtension };

package/dist/index.js

@@ -6,6 +6,8 @@ var AnchoredThreads = require('./comments/AnchoredThreads.js');
 var FloatingComposer = require('./comments/FloatingComposer.js');
 var FloatingThreads = require('./comments/FloatingThreads.js');
 var LiveblocksExtension = require('./LiveblocksExtension.js');
+var FloatingToolbar = require('./toolbar/FloatingToolbar.js');
+var Toolbar = require('./toolbar/Toolbar.js');
 var HistoryVersionPreview = require('./version-history/HistoryVersionPreview.js');
 
 core.detectDupes(version.PKG_NAME, version.PKG_VERSION, version.PKG_FORMAT);
@@ -15,5 +17,7 @@ exports.FloatingComposer = FloatingComposer.FloatingComposer;
 exports.FloatingThreads = FloatingThreads.FloatingThreads;
 exports.useIsEditorReady = LiveblocksExtension.useIsEditorReady;
 exports.useLiveblocksExtension = LiveblocksExtension.useLiveblocksExtension;
+exports.FloatingToolbar = FloatingToolbar.FloatingToolbar;
+exports.Toolbar = Toolbar.Toolbar;
 exports.HistoryVersionPreview = HistoryVersionPreview.HistoryVersionPreview;
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport { AnchoredThreads } from \"./comments/AnchoredThreads\";\nexport { FloatingComposer } from \"./comments/FloatingComposer\";\nexport { FloatingThreads } from \"./comments/FloatingThreads\";\nexport { useLiveblocksExtension } from \"./LiveblocksExtension\";\nexport { useIsEditorReady } from \"./LiveblocksExtension\";\nexport { HistoryVersionPreview } from \"./version-history/HistoryVersionPreview\";\n\ndeclare module \"@tiptap/core\" {\n  interface Commands<ReturnType> {\n    comments: {\n      /**\n       * Add a comment\n       */\n      addComment: (id: string) => ReturnType;\n      selectThread: (id: string | null) => ReturnType;\n      addPendingComment: () => ReturnType;\n    };\n  }\n}\n"],"names":["detectDupes","PKG_NAME","PKG_VERSION","PKG_FORMAT"],"mappings":";;;;;;;;;;AAIAA,gBAAY,CAAAC,gBAAA,EAAUC,qBAAaC,kBAAU,CAAA;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport type { CommentsCommands } from \"./types\";\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport { AnchoredThreads } from \"./comments/AnchoredThreads\";\nexport { FloatingComposer } from \"./comments/FloatingComposer\";\nexport { FloatingThreads } from \"./comments/FloatingThreads\";\nexport { useLiveblocksExtension } from \"./LiveblocksExtension\";\nexport { useIsEditorReady } from \"./LiveblocksExtension\";\nexport { FloatingToolbar } from \"./toolbar/FloatingToolbar\";\nexport { Toolbar } from \"./toolbar/Toolbar\";\nexport { HistoryVersionPreview } from \"./version-history/HistoryVersionPreview\";\n\ndeclare module \"@tiptap/core\" {\n  interface Commands<ReturnType> {\n    comments: CommentsCommands<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

@@ -4,6 +4,8 @@ export { AnchoredThreads } from './comments/AnchoredThreads.mjs';
 export { FloatingComposer } from './comments/FloatingComposer.mjs';
 export { FloatingThreads } from './comments/FloatingThreads.mjs';
 export { useIsEditorReady, useLiveblocksExtension } from './LiveblocksExtension.mjs';
+export { FloatingToolbar } from './toolbar/FloatingToolbar.mjs';
+export { Toolbar } from './toolbar/Toolbar.mjs';
 export { HistoryVersionPreview } from './version-history/HistoryVersionPreview.mjs';
 
 detectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport { AnchoredThreads } from \"./comments/AnchoredThreads\";\nexport { FloatingComposer } from \"./comments/FloatingComposer\";\nexport { FloatingThreads } from \"./comments/FloatingThreads\";\nexport { useLiveblocksExtension } from \"./LiveblocksExtension\";\nexport { useIsEditorReady } from \"./LiveblocksExtension\";\nexport { HistoryVersionPreview } from \"./version-history/HistoryVersionPreview\";\n\ndeclare module \"@tiptap/core\" {\n  interface Commands<ReturnType> {\n    comments: {\n      /**\n       * Add a comment\n       */\n      addComment: (id: string) => ReturnType;\n      selectThread: (id: string | null) => ReturnType;\n      addPendingComment: () => ReturnType;\n    };\n  }\n}\n"],"names":[],"mappings":";;;;;;;;AAIA,WAAY,CAAA,QAAA,EAAU,aAAa,UAAU,CAAA"}
+{"version":3,"file":"index.mjs","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport type { CommentsCommands } from \"./types\";\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport { AnchoredThreads } from \"./comments/AnchoredThreads\";\nexport { FloatingComposer } from \"./comments/FloatingComposer\";\nexport { FloatingThreads } from \"./comments/FloatingThreads\";\nexport { useLiveblocksExtension } from \"./LiveblocksExtension\";\nexport { useIsEditorReady } from \"./LiveblocksExtension\";\nexport { FloatingToolbar } from \"./toolbar/FloatingToolbar\";\nexport { Toolbar } from \"./toolbar/Toolbar\";\nexport { HistoryVersionPreview } from \"./version-history/HistoryVersionPreview\";\n\ndeclare module \"@tiptap/core\" {\n  interface Commands<ReturnType> {\n    comments: CommentsCommands<ReturnType>;\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;AAKA,WAAY,CAAA,QAAA,EAAU,aAAa,UAAU,CAAA"}