@liveblocks/react-ui 3.15.0-components1 → 3.15.0-thread2

package/dist/index.d.ts

@@ -1,8 +1,7 @@
 import * as react from 'react';
 import { ComponentType, ComponentPropsWithoutRef, ElementType, ReactNode, ComponentProps, FormEvent, RefAttributes, MouseEvent, PropsWithChildren } from 'react';
-import { CommentAttachment, AiReasoningPart, AiRetrievalPart, Relax, WithNavigation, AiAssistantMessage, CopilotId, AiKnowledgeSource, AiOpaqueToolDefinition, AiToolTypePack, JsonObject, AiToolExecuteCallback, NoInfr, CommentBody, MentionData, BaseMetadata, DTM, DCM, Patchable, CommentData, ThreadData, HistoryVersion, InboxNotificationData, InboxNotificationThreadData, InboxNotificationTextMentionData, InboxNotificationCustomData, KDAD } from '@liveblocks/core';
+import { CommentAttachment, AiReasoningPart, AiRetrievalPart, Relax, WithNavigation, AiAssistantMessage, CopilotId, AiKnowledgeSource, AiOpaqueToolDefinition, AiToolTypePack, JsonObject, AiToolExecuteCallback, NoInfr, CommentBody, MentionData, BaseMetadata, DTM, DCM, Patchable, CommentData, HistoryVersion, InboxNotificationData, InboxNotificationThreadData, InboxNotificationTextMentionData, InboxNotificationCustomData, KDAD, ThreadData } from '@liveblocks/core';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { Popover } from 'radix-ui';
 
 interface GlobalComponents {
     Anchor: ComponentType<ComponentPropsWithoutRef<"a">> | "a";
@@ -810,25 +809,6 @@ declare const AiTool: react.ForwardRefExoticComponent<Omit<AiToolProps, "ref"> &
     Confirmation: typeof AiToolConfirmation;
 };
 
-interface AvatarStackProps extends ComponentPropsWithoutRef<"div"> {
-    /**
-     * Optional additional user IDs to include in the stack.
-     */
-    userIds?: string[];
-    /**
-     * The maximum number of visible avatars.
-     */
-    max?: number;
-    /**
-     * Override the component's strings.
-     */
-    overrides?: Partial<GlobalOverrides>;
-}
-/**
- * Displays a stack of avatars for the users currently present in the room.
- */
-declare const AvatarStack: react.ForwardRefExoticComponent<AvatarStackProps & react.RefAttributes<HTMLDivElement>>;
-
 interface ComposerEditorMentionProps {
     /**
      * Whether the mention is selected.
@@ -1051,11 +1031,27 @@ type ComposerProps<TM extends BaseMetadata = DTM, CM extends BaseMetadata = DCM>
  */
 declare const Composer: <TM extends BaseMetadata = DTM, CM extends BaseMetadata = DCM>(props: ComposerProps<TM, CM> & RefAttributes<HTMLFormElement>) => JSX.Element;
 
-interface CommentProps extends ComponentPropsWithoutRef<"div"> {
+interface CommentProps<CM extends BaseMetadata = DCM> extends Omit<ComponentPropsWithoutRef<"div">, "children"> {
     /**
      * The comment to display.
      */
-    comment: CommentData;
+    comment: CommentData<CM>;
+    /**
+     * The comment's avatar.
+     * Can be combined with `Comment.Avatar` to easily follow default styles.
+     */
+    avatar?: ReactNode;
+    /**
+     * The comment's author.
+     * Can be combined with `Comment.Author` to easily follow default styles.
+     */
+    author?: ReactNode;
+    /**
+     * The comment's date.
+     * Can be combined with `Comment.Date` to easily follow default styles,
+     * or the `Timestamp` primitive for more control.
+     */
+    date?: ReactNode;
     /**
      * How to show or hide the actions.
      */
@@ -1080,6 +1076,10 @@ interface CommentProps extends ComponentPropsWithoutRef<"div"> {
      * Whether to indent the comment's content.
      */
     indentContent?: boolean;
+    /**
+     * Additional content to display below the comment's body.
+     */
+    additionalContent?: ReactNode;
     /**
      * The event handler called when the comment is edited.
      */
@@ -1104,7 +1104,13 @@ interface CommentProps extends ComponentPropsWithoutRef<"div"> {
      * Add (or change) items to display in the comment's dropdown.
      */
     dropdownItems?: ReactNode | ((props: PropsWithChildren<{
-        comment: CommentData;
+        comment: CommentData<CM>;
+    }>) => ReactNode);
+    /**
+     * Override the comment's content.
+     */
+    children?: ReactNode | ((props: PropsWithChildren<{
+        comment: CommentData<CM>;
     }>) => ReactNode);
     /**
      * Override the component's strings.
@@ -1115,6 +1121,31 @@ interface CommentProps extends ComponentPropsWithoutRef<"div"> {
      */
     components?: Partial<GlobalComponents>;
 }
+interface CommentAvatarProps extends Omit<ComponentProps<"div">, "children"> {
+    /**
+     * The user ID to display the avatar for.
+     */
+    userId: string;
+}
+interface CommentAuthorProps extends Omit<ComponentProps<"span">, "children"> {
+    /**
+     * The user ID to display the author for.
+     */
+    userId: string;
+}
+interface CommentDateProps extends Omit<ComponentProps<"span">, "children"> {
+    /**
+     * The date to display.
+     */
+    date: Date | string | number;
+    /**
+     * The locale used when formatting the date.
+     */
+    locale?: string;
+}
+declare function CommentAvatar(props: CommentAvatarProps): react_jsx_runtime.JSX.Element;
+declare function CommentAuthor(props: CommentAuthorProps): react_jsx_runtime.JSX.Element;
+declare function CommentDate({ locale, date, className, ...props }: CommentDateProps): react_jsx_runtime.JSX.Element;
 interface CommentDropdownItemProps extends Omit<ComponentPropsWithoutRef<"div">, "onSelect"> {
     /**
      * An optional icon displayed in this dropdown item.
@@ -1135,204 +1166,24 @@ interface CommentDropdownItemProps extends Omit<ComponentPropsWithoutRef<"div">,
  *   ))}
  * </>
  */
-declare const Comment: react.ForwardRefExoticComponent<CommentProps & react.RefAttributes<HTMLDivElement>> & {
+declare const Comment: react.ForwardRefExoticComponent<CommentProps<BaseMetadata> & react.RefAttributes<HTMLDivElement>> & {
     /**
      * Displays a dropdown item in the comment's dropdown.
      */
     DropdownItem: react.ForwardRefExoticComponent<CommentDropdownItemProps & react.RefAttributes<HTMLDivElement>>;
-};
-
-interface CommentPinProps extends ComponentPropsWithoutRef<"button"> {
-    /**
-     * The corner that points to the comment position.
-     */
-    corner?: "top-left" | "top-right" | "bottom-right" | "bottom-left";
-    /**
-     * The user ID to optionally display an avatar for.
-     */
-    userId?: string;
-}
-/**
- * Displays a comment pin that can be used as a trigger
- * for `FloatingComposer` and `FloatingThread`.
- */
-declare const CommentPin: react.ForwardRefExoticComponent<CommentPinProps & react.RefAttributes<HTMLButtonElement>>;
-
-interface CursorProps extends ComponentPropsWithoutRef<"div"> {
-    /**
-     * A floating label to display next to the cursor.
-     */
-    label?: ReactNode;
-    /**
-     * The color of the cursor.
-     */
-    color?: string;
-}
-/**
- * Displays a multiplayer cursor.
- */
-declare const Cursor: react.ForwardRefExoticComponent<CursorProps & react.RefAttributes<HTMLDivElement>>;
-
-interface CursorsProps extends ComponentPropsWithoutRef<"div"> {
-    /**
-     * The key used to store the cursors in users' Presence.
-     * This can be used to have multiple `Cursors` in a single room.
-     */
-    presenceKey?: string;
-}
-/**
- * Displays multiplayer cursors.
- */
-declare const Cursors: react.ForwardRefExoticComponent<CursorsProps & react.RefAttributes<HTMLDivElement>>;
-
-interface FloatingComposerProps<TM extends BaseMetadata = DTM, CM extends BaseMetadata = DCM> extends Omit<ComposerProps<TM, CM>, "collapsed" | "onCollapsedChange" | "defaultCollapsed">, Relax<Pick<Popover.PopoverProps, "defaultOpen" | "open" | "onOpenChange"> & Pick<Popover.PopoverContentProps, "side" | "sideOffset" | "align" | "alignOffset">> {
-    /**
-     * The element which opens the floating composer.
-     */
-    children: ReactNode;
-}
-/**
- * Displays a floating composer attached to a trigger element.
- */
-declare const FloatingComposer: <TM extends BaseMetadata = DTM, CM extends BaseMetadata = DCM>(props: FloatingComposerProps<TM, CM> & RefAttributes<HTMLFormElement>) => JSX.Element;
-
-interface ThreadProps<TM extends BaseMetadata = DTM, CM extends BaseMetadata = DCM> extends ComponentPropsWithoutRef<"div"> {
-    /**
-     * The thread to display.
-     */
-    thread: ThreadData<TM, CM>;
-    /**
-     * How to show or hide the composer to reply to the thread.
-     */
-    showComposer?: boolean | "collapsed";
-    /**
-     * Whether to show the action to resolve the thread.
-     */
-    showResolveAction?: boolean;
     /**
-     * How to show or hide the actions.
-     */
-    showActions?: CommentProps["showActions"];
-    /**
-     * Whether to show reactions.
-     */
-    showReactions?: CommentProps["showReactions"];
-    /**
-     * Whether to show the composer's formatting controls.
-     */
-    showComposerFormattingControls?: ComposerProps["showFormattingControls"];
-    /**
-     * Add (or change) items to display in a comment's dropdown.
-     */
-    commentDropdownItems?: ReactNode | ((props: PropsWithChildren<{
-        comment: CommentData;
-    }>) => ReactNode);
-    /**
-     * The maximum number of comments to show.
-     *
-     * The first and last comments are always shown and by default if some comments
-     * are hidden, only the first comment will be shown before the "show more" button
-     * and after it will be shown all the newest comments to fit the limit set.
-     *
-     * It's possible to customize this by setting `maxVisibleComments` to an object:
-     *
-     * @example
-     * // Only show the last comment, and all the older ones to fit the limit.
-     * <Thread maxVisibleComments={{ max: 5, show: "oldest" }} />
-     *
-     * @example
-     * // Show as many old comments as new ones to fit the limit.
-     * <Thread maxVisibleComments={{ max: 5, show: "both" }} />
-     */
-    maxVisibleComments?: number | {
-        max: number;
-        show: "oldest" | "both" | "newest";
-    };
-    /**
-     * Whether to blur the composer editor when the composer is submitted.
-     */
-    blurComposerOnSubmit?: ComposerProps["blurOnSubmit"];
-    /**
-     * Whether to indent the comments' content.
-     */
-    indentCommentContent?: CommentProps["indentContent"];
-    /**
-     * Whether to show deleted comments.
-     */
-    showDeletedComments?: CommentProps["showDeleted"];
-    /**
-     * Whether to show attachments.
-     */
-    showAttachments?: boolean;
-    /**
-     * The event handler called when changing the resolved status.
-     */
-    onResolvedChange?: (resolved: boolean) => void;
-    /**
-     * The event handler called when a comment is edited.
-     */
-    onCommentEdit?: CommentProps["onCommentEdit"];
-    /**
-     * The event handler called when a comment is deleted.
-     */
-    onCommentDelete?: CommentProps["onCommentDelete"];
-    /**
-     * The event handler called when the thread is deleted.
-     * A thread is deleted when all its comments are deleted.
-     */
-    onThreadDelete?: (thread: ThreadData<TM, CM>) => void;
-    /**
-     * The event handler called when clicking on a comment's author.
-     */
-    onAuthorClick?: CommentProps["onAuthorClick"];
-    /**
-     * The event handler called when clicking on a mention.
+     * Displays a comment's avatar.
      */
-    onMentionClick?: CommentProps["onMentionClick"];
+    Avatar: typeof CommentAvatar;
     /**
-     * The event handler called when clicking on a comment's attachment.
+     * Displays a comment's author.
      */
-    onAttachmentClick?: CommentProps["onAttachmentClick"];
+    Author: typeof CommentAuthor;
     /**
-     * The event handler called when the composer is submitted.
+     * Displays a comment's date.
      */
-    onComposerSubmit?: ComposerProps["onComposerSubmit"];
-    /**
-     * Whether to focus the composer on mount.
-     */
-    autoFocus?: ComposerProps["autoFocus"];
-    /**
-     * Override the component's strings.
-     */
-    overrides?: Partial<GlobalOverrides & ThreadOverrides & CommentOverrides & ComposerOverrides>;
-    /**
-     * Override the component's components.
-     */
-    components?: Partial<GlobalComponents>;
-}
-/**
- * Displays a thread of comments, with a composer to reply
- * to it.
- *
- * @example
- * <>
- *   {threads.map((thread) => (
- *     <Thread key={thread.id} thread={thread} />
- *   ))}
- * </>
- */
-declare const Thread: <TM extends BaseMetadata = DTM, CM extends BaseMetadata = DCM>(props: ThreadProps<TM, CM> & RefAttributes<HTMLDivElement>) => JSX.Element;
-
-interface FloatingThreadProps<TM extends BaseMetadata = DTM, CM extends BaseMetadata = DCM> extends ThreadProps<TM, CM>, Relax<Pick<Popover.PopoverProps, "defaultOpen" | "open" | "onOpenChange"> & Pick<Popover.PopoverContentProps, "side" | "sideOffset" | "align" | "alignOffset">> {
-    /**
-     * The element which opens the floating thread.
-     */
-    children: ReactNode;
-}
-/**
- * Displays a floating thread attached to a trigger element.
- */
-declare const FloatingThread: <TM extends BaseMetadata = DTM, CM extends BaseMetadata = DCM>(props: FloatingThreadProps<TM, CM> & RefAttributes<HTMLDivElement>) => JSX.Element;
+    Date: typeof CommentDate;
+};
 
 interface HistoryVersionSummaryProps extends ComponentPropsWithoutRef<"button"> {
     version: HistoryVersion;
@@ -1529,6 +1380,139 @@ interface InboxNotificationListProps extends ComponentPropsWithoutRef<"ol"> {
  */
 declare const InboxNotificationList: react.ForwardRefExoticComponent<InboxNotificationListProps & react.RefAttributes<HTMLOListElement>>;
 
+interface ThreadComponents<_TM extends BaseMetadata = DTM, CM extends BaseMetadata = DCM> {
+    /**
+     * The component used to display comments.
+     */
+    Comment: ComponentType<CommentProps<CM>>;
+}
+interface ThreadProps<TM extends BaseMetadata = DTM, CM extends BaseMetadata = DCM> extends ComponentPropsWithoutRef<"div"> {
+    /**
+     * The thread to display.
+     */
+    thread: ThreadData<TM, CM>;
+    /**
+     * How to show or hide the composer to reply to the thread.
+     */
+    showComposer?: boolean | "collapsed";
+    /**
+     * Whether to show the action to resolve the thread.
+     */
+    showResolveAction?: boolean;
+    /**
+     * How to show or hide the actions.
+     */
+    showActions?: CommentProps["showActions"];
+    /**
+     * Whether to show reactions.
+     */
+    showReactions?: CommentProps["showReactions"];
+    /**
+     * Whether to show the composer's formatting controls.
+     */
+    showComposerFormattingControls?: ComposerProps["showFormattingControls"];
+    /**
+     * Add (or change) items to display in a comment's dropdown.
+     */
+    commentDropdownItems?: ReactNode | ((props: PropsWithChildren<{
+        comment: CommentData<CM>;
+    }>) => ReactNode);
+    /**
+     * The maximum number of comments to show.
+     *
+     * The first and last comments are always shown and by default if some comments
+     * are hidden, only the first comment will be shown before the "show more" button
+     * and after it will be shown all the newest comments to fit the limit set.
+     *
+     * It's possible to customize this by setting `maxVisibleComments` to an object:
+     *
+     * @example
+     * // Only show the last comment, and all the older ones to fit the limit.
+     * <Thread maxVisibleComments={{ max: 5, show: "oldest" }} />
+     *
+     * @example
+     * // Show as many old comments as new ones to fit the limit.
+     * <Thread maxVisibleComments={{ max: 5, show: "both" }} />
+     */
+    maxVisibleComments?: number | {
+        max: number;
+        show: "oldest" | "both" | "newest";
+    };
+    /**
+     * Whether to blur the composer editor when the composer is submitted.
+     */
+    blurComposerOnSubmit?: ComposerProps["blurOnSubmit"];
+    /**
+     * Whether to indent the comments' content.
+     */
+    indentCommentContent?: CommentProps["indentContent"];
+    /**
+     * Additional content to display below the thread's comments.
+     */
+    additionalContent?: ReactNode;
+    /**
+     * Whether to show deleted comments.
+     */
+    showDeletedComments?: CommentProps["showDeleted"];
+    /**
+     * Whether to show attachments.
+     */
+    showAttachments?: boolean;
+    /**
+     * The event handler called when changing the resolved status.
+     */
+    onResolvedChange?: (resolved: boolean) => void;
+    /**
+     * The event handler called when a comment is edited.
+     */
+    onCommentEdit?: CommentProps["onCommentEdit"];
+    /**
+     * The event handler called when a comment is deleted.
+     */
+    onCommentDelete?: CommentProps["onCommentDelete"];
+    /**
+     * The event handler called when the thread is deleted.
+     * A thread is deleted when all its comments are deleted.
+     */
+    onThreadDelete?: (thread: ThreadData<TM, CM>) => void;
+    /**
+     * The event handler called when clicking on a comment's author.
+     */
+    onAuthorClick?: CommentProps["onAuthorClick"];
+    /**
+     * The event handler called when clicking on a mention.
+     */
+    onMentionClick?: CommentProps["onMentionClick"];
+    /**
+     * The event handler called when clicking on a comment's attachment.
+     */
+    onAttachmentClick?: CommentProps["onAttachmentClick"];
+    /**
+     * The event handler called when the composer is submitted.
+     */
+    onComposerSubmit?: ComposerProps["onComposerSubmit"];
+    /**
+     * Override the component's strings.
+     */
+    overrides?: Partial<GlobalOverrides & ThreadOverrides & CommentOverrides & ComposerOverrides>;
+    /**
+     * Override the component's components.
+     */
+    components?: Partial<GlobalComponents & ThreadComponents>;
+}
+/**
+ * Displays a thread of comments, with a composer to reply
+ * to it.
+ *
+ * @example
+ * <>
+ *   {threads.map((thread) => (
+ *     <Thread key={thread.id} thread={thread} />
+ *   ))}
+ * </>
+ */
+declare const Thread: <TM extends BaseMetadata = DTM, CM extends BaseMetadata = DCM>(props: ThreadProps<TM, CM> & RefAttributes<HTMLDivElement>) => JSX.Element;
+
 type LiveblocksUiConfigProps = PropsWithChildren<{
     /**
      * Override the components' strings.
@@ -1728,4 +1712,4 @@ declare namespace icon {
   };
 }
 
-export { AiChat, AiChatComponents, AiChatComponentsEmptyProps, AiChatComponentsLoadingProps, AiChatProps, AiComposerSubmitMessage, AiTool, AiToolIconProps, AiToolProps, AvatarStack, AvatarStackProps, Comment, CommentAttachmentArgs, CommentDropdownItemProps, CommentOverrides, CommentPin, CommentPinProps, CommentProps, Composer, ComposerBodyMark, ComposerBodyMarks, ComposerOverrides, ComposerProps, ComposerSubmitComment, Cursor, CursorProps, Cursors, CursorsProps, FloatingComposer, FloatingComposerProps, FloatingThread, FloatingThreadProps, GlobalOverrides, HistoryVersionSummary, HistoryVersionSummaryList, HistoryVersionSummaryListProps, HistoryVersionSummaryProps, icon as Icon, InboxNotification, InboxNotificationAvatarProps, InboxNotificationCustomKindProps, InboxNotificationCustomProps, InboxNotificationIconProps, InboxNotificationInspectorProps, InboxNotificationList, InboxNotificationListProps, InboxNotificationOverrides, InboxNotificationProps, InboxNotificationTextMentionKindProps, InboxNotificationTextMentionProps, InboxNotificationThreadKindProps, InboxNotificationThreadProps, LiveblocksUiConfig, LocalizationOverrides, Overrides, Thread, ThreadOverrides, ThreadProps, useOverrides };
+export { AiChat, AiChatComponents, AiChatComponentsEmptyProps, AiChatComponentsLoadingProps, AiChatProps, AiComposerSubmitMessage, AiTool, AiToolIconProps, AiToolProps, Comment, CommentAttachmentArgs, CommentAuthorProps, CommentAvatarProps, CommentDateProps, CommentDropdownItemProps, CommentOverrides, CommentProps, Composer, ComposerBodyMark, ComposerBodyMarks, ComposerOverrides, ComposerProps, ComposerSubmitComment, GlobalOverrides, HistoryVersionSummary, HistoryVersionSummaryList, HistoryVersionSummaryListProps, HistoryVersionSummaryProps, icon as Icon, InboxNotification, InboxNotificationAvatarProps, InboxNotificationCustomKindProps, InboxNotificationCustomProps, InboxNotificationIconProps, InboxNotificationInspectorProps, InboxNotificationList, InboxNotificationListProps, InboxNotificationOverrides, InboxNotificationProps, InboxNotificationTextMentionKindProps, InboxNotificationTextMentionProps, InboxNotificationThreadKindProps, InboxNotificationThreadProps, LiveblocksUiConfig, LocalizationOverrides, Overrides, Thread, ThreadOverrides, ThreadProps, useOverrides };

package/dist/index.js

@@ -2,14 +2,8 @@ import { detectDupes } from '@liveblocks/core';
 import { PKG_NAME, PKG_VERSION, PKG_FORMAT } from './version.js';
 export { AiChat } from './components/AiChat.js';
 export { AiTool } from './components/AiTool.js';
-export { AvatarStack } from './components/AvatarStack.js';
 export { Comment } from './components/Comment.js';
-export { CommentPin } from './components/CommentPin.js';
 export { Composer } from './components/Composer.js';
-export { Cursor } from './components/Cursor.js';
-export { Cursors } from './components/Cursors.js';
-export { FloatingComposer } from './components/FloatingComposer.js';
-export { FloatingThread } from './components/FloatingThread.js';
 export { HistoryVersionSummary } from './components/HistoryVersionSummary.js';
 export { HistoryVersionSummaryList } from './components/HistoryVersionSummaryList.js';
 export { InboxNotification } from './components/InboxNotification.js';

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 type {\n  AiChatComponents,\n  AiChatComponentsEmptyProps,\n  AiChatComponentsLoadingProps,\n  AiChatProps,\n} from \"./components/AiChat\";\nexport { AiChat } from \"./components/AiChat\";\nexport type { AiToolIconProps, AiToolProps } from \"./components/AiTool\";\nexport { AiTool } from \"./components/AiTool\";\nexport type { AvatarStackProps } from \"./components/AvatarStack\";\nexport { AvatarStack } from \"./components/AvatarStack\";\nexport type {\n  CommentDropdownItemProps,\n  CommentProps,\n} from \"./components/Comment\";\nexport { Comment } from \"./components/Comment\";\nexport type { CommentPinProps } from \"./components/CommentPin\";\nexport { CommentPin } from \"./components/CommentPin\";\nexport type { ComposerProps } from \"./components/Composer\";\nexport { Composer } from \"./components/Composer\";\nexport type { CursorProps } from \"./components/Cursor\";\nexport { Cursor } from \"./components/Cursor\";\nexport type { CursorsProps } from \"./components/Cursors\";\nexport { Cursors } from \"./components/Cursors\";\nexport type { FloatingComposerProps } from \"./components/FloatingComposer\";\nexport { FloatingComposer } from \"./components/FloatingComposer\";\nexport type { FloatingThreadProps } from \"./components/FloatingThread\";\nexport { FloatingThread } from \"./components/FloatingThread\";\nexport type { HistoryVersionSummaryProps } from \"./components/HistoryVersionSummary\";\nexport { HistoryVersionSummary } from \"./components/HistoryVersionSummary\";\nexport type { HistoryVersionSummaryListProps } from \"./components/HistoryVersionSummaryList\";\nexport { HistoryVersionSummaryList } from \"./components/HistoryVersionSummaryList\";\nexport type {\n  InboxNotificationAvatarProps,\n  InboxNotificationCustomKindProps,\n  InboxNotificationCustomProps,\n  InboxNotificationIconProps,\n  InboxNotificationInspectorProps,\n  InboxNotificationProps,\n  InboxNotificationTextMentionKindProps,\n  InboxNotificationTextMentionProps,\n  InboxNotificationThreadKindProps,\n  InboxNotificationThreadProps,\n} from \"./components/InboxNotification\";\nexport { InboxNotification } from \"./components/InboxNotification\";\nexport type { InboxNotificationListProps } from \"./components/InboxNotificationList\";\nexport { InboxNotificationList } from \"./components/InboxNotificationList\";\nexport type { ThreadProps } from \"./components/Thread\";\nexport { Thread } from \"./components/Thread\";\nexport { LiveblocksUiConfig } from \"./config\";\nexport * as Icon from \"./icon\";\nexport type {\n  CommentOverrides,\n  ComposerOverrides,\n  GlobalOverrides,\n  InboxNotificationOverrides,\n  LocalizationOverrides,\n  Overrides,\n  ThreadOverrides,\n} from \"./overrides\";\nexport { useOverrides } from \"./overrides\";\nexport type {\n  AiComposerSubmitMessage,\n  ComposerSubmitComment,\n} from \"./primitives\";\nexport type {\n  CommentAttachmentArgs,\n  ComposerBodyMark,\n  ComposerBodyMarks,\n} from \"./types\";\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAIA,WAAY,CAAA,QAAA,EAAU,aAAa,UAAU,CAAA"}
+{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type {\n  AiChatComponents,\n  AiChatComponentsEmptyProps,\n  AiChatComponentsLoadingProps,\n  AiChatProps,\n} from \"./components/AiChat\";\nexport { AiChat } from \"./components/AiChat\";\nexport type { AiToolIconProps, AiToolProps } from \"./components/AiTool\";\nexport { AiTool } from \"./components/AiTool\";\nexport type {\n  CommentAuthorProps,\n  CommentAvatarProps,\n  CommentDateProps,\n  CommentDropdownItemProps,\n  CommentProps,\n} from \"./components/Comment\";\nexport { Comment } from \"./components/Comment\";\nexport type { ComposerProps } from \"./components/Composer\";\nexport { Composer } from \"./components/Composer\";\nexport type { HistoryVersionSummaryProps } from \"./components/HistoryVersionSummary\";\nexport { HistoryVersionSummary } from \"./components/HistoryVersionSummary\";\nexport type { HistoryVersionSummaryListProps } from \"./components/HistoryVersionSummaryList\";\nexport { HistoryVersionSummaryList } from \"./components/HistoryVersionSummaryList\";\nexport type {\n  InboxNotificationAvatarProps,\n  InboxNotificationCustomKindProps,\n  InboxNotificationCustomProps,\n  InboxNotificationIconProps,\n  InboxNotificationInspectorProps,\n  InboxNotificationProps,\n  InboxNotificationTextMentionKindProps,\n  InboxNotificationTextMentionProps,\n  InboxNotificationThreadKindProps,\n  InboxNotificationThreadProps,\n} from \"./components/InboxNotification\";\nexport { InboxNotification } from \"./components/InboxNotification\";\nexport type { InboxNotificationListProps } from \"./components/InboxNotificationList\";\nexport { InboxNotificationList } from \"./components/InboxNotificationList\";\nexport type { ThreadProps } from \"./components/Thread\";\nexport { Thread } from \"./components/Thread\";\nexport { LiveblocksUiConfig } from \"./config\";\nexport * as Icon from \"./icon\";\nexport type {\n  CommentOverrides,\n  ComposerOverrides,\n  GlobalOverrides,\n  InboxNotificationOverrides,\n  LocalizationOverrides,\n  Overrides,\n  ThreadOverrides,\n} from \"./overrides\";\nexport { useOverrides } from \"./overrides\";\nexport type {\n  AiComposerSubmitMessage,\n  ComposerSubmitComment,\n} from \"./primitives\";\nexport type {\n  CommentAttachmentArgs,\n  ComposerBodyMark,\n  ComposerBodyMarks,\n} from \"./types\";\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAIA,WAAY,CAAA,QAAA,EAAU,aAAa,UAAU,CAAA"}

package/dist/primitives/AiComposer/index.cjs

@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var core = require('@liveblocks/core');
 var react$1 = require('@liveblocks/react');
 var _private = require('@liveblocks/react/_private');
-var radixUi = require('radix-ui');
+var reactSlot = require('@radix-ui/react-slot');
 var react = require('react');
 var slate = require('slate');
 var slateHistory = require('slate-history');
@@ -43,7 +43,7 @@ const AiComposerForm = react.forwardRef(
     asChild,
     ...props
   }, forwardedRef) => {
-    const Component = asChild ? radixUi.Slot.Slot : "form";
+    const Component = asChild ? reactSlot.Slot : "form";
     const client = react$1.useClient();
     const formRef = react.useRef(null);
     const editor = useInitial.useInitial(
@@ -302,7 +302,6 @@ const AiComposerEditor = react.forwardRef(
           slateReact.Editable,
           {
             dir,
-            tabIndex: isDisabled ? -1 : 0,
             enterKeyHint: "send",
             autoCapitalize: "sentences",
             "aria-label": "Composer editor",
@@ -322,7 +321,7 @@ const AiComposerEditor = react.forwardRef(
   }
 );
 const AiComposerSubmit = react.forwardRef(({ disabled, asChild, ...props }, forwardedRef) => {
-  const Component = asChild ? radixUi.Slot.Slot : "button";
+  const Component = asChild ? reactSlot.Slot : "button";
   const { isDisabled: isComposerDisabled, canSubmit } = contexts.useAiComposer();
   const isDisabled = isComposerDisabled || disabled || !canSubmit;
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -336,7 +335,7 @@ const AiComposerSubmit = react.forwardRef(({ disabled, asChild, ...props }, forw
   );
 });
 const AiComposerAbort = react.forwardRef(({ disabled, onClick, asChild, ...props }, forwardedRef) => {
-  const Component = asChild ? radixUi.Slot.Slot : "button";
+  const Component = asChild ? reactSlot.Slot : "button";
   const { isDisabled: isComposerDisabled, canAbort, abort } = contexts.useAiComposer();
   const isDisabled = isComposerDisabled || disabled || !canAbort;
   const handleClick = react.useCallback(