@liveblocks/react-ui 2.7.0-beta2 → 2.7.0-versions2

package/dist/components/Thread.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Thread.mjs","sources":["../../src/components/Thread.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n  BaseMetadata,\n  CommentData,\n  DM,\n  ThreadData,\n} from \"@liveblocks/core\";\nimport {\n  useMarkThreadAsResolved,\n  useMarkThreadAsUnresolved,\n  useThreadSubscription,\n} from \"@liveblocks/react\";\nimport * as TogglePrimitive from \"@radix-ui/react-toggle\";\nimport type {\n  ComponentPropsWithoutRef,\n  ForwardedRef,\n  RefAttributes,\n  SyntheticEvent,\n} from \"react\";\nimport React, {\n  forwardRef,\n  Fragment,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from \"react\";\n\nimport { ArrowDownIcon } from \"../icons/ArrowDown\";\nimport { ResolveIcon } from \"../icons/Resolve\";\nimport { ResolvedIcon } from \"../icons/Resolved\";\nimport type {\n  CommentOverrides,\n  ComposerOverrides,\n  GlobalOverrides,\n  ThreadOverrides,\n} from \"../overrides\";\nimport { useOverrides } from \"../overrides\";\nimport { classNames } from \"../utils/class-names\";\nimport { findLastIndex } from \"../utils/find-last-index\";\nimport type { CommentProps } from \"./Comment\";\nimport { Comment } from \"./Comment\";\nimport { Composer } from \"./Composer\";\nimport { Button } from \"./internal/Button\";\nimport { Tooltip, TooltipProvider } from \"./internal/Tooltip\";\n\nexport interface ThreadProps<M extends BaseMetadata = DM>\n  extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The thread to display.\n   */\n  thread: ThreadData<M>;\n\n  /**\n   * How to show or hide the composer to reply to the thread.\n   */\n  showComposer?: boolean | \"collapsed\";\n\n  /**\n   * Whether to show the action to resolve the thread.\n   */\n  showResolveAction?: boolean;\n\n  /**\n   * How to show or hide the actions.\n   */\n  showActions?: CommentProps[\"showActions\"];\n\n  /**\n   * Whether to show reactions.\n   */\n  showReactions?: CommentProps[\"showReactions\"];\n\n  /**\n   * Whether to indent the comments' content.\n   */\n  indentCommentContent?: CommentProps[\"indentContent\"];\n\n  /**\n   * Whether to show deleted comments.\n   */\n  showDeletedComments?: CommentProps[\"showDeleted\"];\n\n  /**\n   * Whether to show attachments.\n   */\n  showAttachments?: boolean;\n\n  /**\n   * The event handler called when changing the resolved status.\n   */\n  onResolvedChange?: (resolved: boolean) => void;\n\n  /**\n   * The event handler called when a comment is edited.\n   */\n  onCommentEdit?: CommentProps[\"onCommentEdit\"];\n\n  /**\n   * The event handler called when a comment is deleted.\n   */\n  onCommentDelete?: CommentProps[\"onCommentDelete\"];\n\n  /**\n   * The event handler called when the thread is deleted.\n   * A thread is deleted when all its comments are deleted.\n   */\n  onThreadDelete?: (thread: ThreadData<M>) => void;\n\n  /**\n   * The event handler called when clicking on a comment's author.\n   */\n  onAuthorClick?: CommentProps[\"onAuthorClick\"];\n\n  /**\n   * The event handler called when clicking on a mention.\n   */\n  onMentionClick?: CommentProps[\"onMentionClick\"];\n\n  /**\n   * The event handler called when clicking on a comment's attachment.\n   */\n  onAttachmentClick?: CommentProps[\"onAttachmentClick\"];\n\n  /**\n   * Override the component's strings.\n   */\n  overrides?: Partial<\n    GlobalOverrides & ThreadOverrides & CommentOverrides & ComposerOverrides\n  >;\n}\n\n/**\n * Displays a thread of comments, with a composer to reply\n * to it.\n *\n * @example\n * <>\n *   {threads.map((thread) => (\n *     <Thread key={thread.id} thread={thread} />\n *   ))}\n * </>\n */\nexport const Thread = forwardRef(\n  <M extends BaseMetadata = DM>(\n    {\n      thread,\n      indentCommentContent = true,\n      showActions = \"hover\",\n      showDeletedComments,\n      showResolveAction = true,\n      showReactions = true,\n      showComposer = \"collapsed\",\n      onResolvedChange,\n      onCommentEdit,\n      onCommentDelete,\n      onThreadDelete,\n      onAuthorClick,\n      onMentionClick,\n      onAttachmentClick,\n      overrides,\n      className,\n      ...props\n    }: ThreadProps<M>,\n    forwardedRef: ForwardedRef<HTMLDivElement>\n  ) => {\n    const markThreadAsResolved = useMarkThreadAsResolved();\n    const markThreadAsUnresolved = useMarkThreadAsUnresolved();\n    const $ = useOverrides(overrides);\n    const firstCommentIndex = useMemo(() => {\n      return showDeletedComments\n        ? 0\n        : thread.comments.findIndex((comment) => comment.body);\n    }, [showDeletedComments, thread.comments]);\n    const lastCommentIndex = useMemo(() => {\n      return showDeletedComments\n        ? thread.comments.length - 1\n        : findLastIndex(thread.comments, (comment) => comment.body);\n    }, [showDeletedComments, thread.comments]);\n    const { status: subscriptionStatus, unreadSince } = useThreadSubscription(\n      thread.id\n    );\n    const unreadIndex = useMemo(() => {\n      // The user is not subscribed to this thread.\n      if (subscriptionStatus !== \"subscribed\") {\n        return;\n      }\n\n      // The user hasn't read the thread yet, so all comments are unread.\n      if (unreadSince === null) {\n        return firstCommentIndex;\n      }\n\n      // The user has read the thread, so we find the first unread comment.\n      const unreadIndex = thread.comments.findIndex(\n        (comment) =>\n          (showDeletedComments ? true : comment.body) &&\n          comment.createdAt > unreadSince\n      );\n\n      return unreadIndex >= 0 && unreadIndex < thread.comments.length\n        ? unreadIndex\n        : undefined;\n    }, [\n      firstCommentIndex,\n      showDeletedComments,\n      subscriptionStatus,\n      thread.comments,\n      unreadSince,\n    ]);\n    const [newIndex, setNewIndex] = useState<number>();\n    const newIndicatorIndex = newIndex === undefined ? unreadIndex : newIndex;\n\n    useEffect(() => {\n      if (unreadIndex) {\n        // Keep the \"new\" indicator at the lowest unread index.\n        setNewIndex((persistedUnreadIndex) =>\n          Math.min(persistedUnreadIndex ?? Infinity, unreadIndex)\n        );\n      }\n    }, [unreadIndex]);\n\n    const stopPropagation = useCallback((event: SyntheticEvent) => {\n      event.stopPropagation();\n    }, []);\n\n    const handleResolvedChange = useCallback(\n      (resolved: boolean) => {\n        onResolvedChange?.(resolved);\n\n        if (resolved) {\n          markThreadAsResolved(thread.id);\n        } else {\n          markThreadAsUnresolved(thread.id);\n        }\n      },\n      [\n        markThreadAsResolved,\n        markThreadAsUnresolved,\n        onResolvedChange,\n        thread.id,\n      ]\n    );\n\n    const handleCommentDelete = useCallback(\n      (comment: CommentData) => {\n        onCommentDelete?.(comment);\n\n        const filteredComments = thread.comments.filter(\n          (comment) => comment.body\n        );\n\n        if (filteredComments.length <= 1) {\n          onThreadDelete?.(thread);\n        }\n      },\n      [onCommentDelete, onThreadDelete, thread]\n    );\n\n    return (\n      <TooltipProvider>\n        <div\n          className={classNames(\n            \"lb-root lb-thread\",\n            showActions === \"hover\" && \"lb-thread:show-actions-hover\",\n            className\n          )}\n          data-resolved={thread.resolved ? \"\" : undefined}\n          data-unread={unreadIndex !== undefined ? \"\" : undefined}\n          dir={$.dir}\n          {...props}\n          ref={forwardedRef}\n        >\n          <div className=\"lb-thread-comments\">\n            {thread.comments.map((comment, index) => {\n              const isFirstComment = index === firstCommentIndex;\n              const isUnread =\n                unreadIndex !== undefined && index >= unreadIndex;\n\n              const children = (\n                <Comment\n                  key={comment.id}\n                  className=\"lb-thread-comment\"\n                  data-unread={isUnread ? \"\" : undefined}\n                  comment={comment}\n                  indentContent={indentCommentContent}\n                  showDeleted={showDeletedComments}\n                  showActions={showActions}\n                  showReactions={showReactions}\n                  onCommentEdit={onCommentEdit}\n                  onCommentDelete={handleCommentDelete}\n                  onAuthorClick={onAuthorClick}\n                  onMentionClick={onMentionClick}\n                  onAttachmentClick={onAttachmentClick}\n                  autoMarkReadThreadId={\n                    index === lastCommentIndex && isUnread\n                      ? thread.id\n                      : undefined\n                  }\n                  additionalActionsClassName={\n                    isFirstComment ? \"lb-thread-actions\" : undefined\n                  }\n                  additionalActions={\n                    isFirstComment && showResolveAction ? (\n                      <Tooltip\n                        content={\n                          thread.resolved\n                            ? $.THREAD_UNRESOLVE\n                            : $.THREAD_RESOLVE\n                        }\n                      >\n                        <TogglePrimitive.Root\n                          pressed={thread.resolved}\n                          onPressedChange={handleResolvedChange}\n                          asChild\n                        >\n                          <Button\n                            className=\"lb-comment-action\"\n                            onClick={stopPropagation}\n                            aria-label={\n                              thread.resolved\n                                ? $.THREAD_UNRESOLVE\n                                : $.THREAD_RESOLVE\n                            }\n                          >\n                            {thread.resolved ? (\n                              <ResolvedIcon className=\"lb-button-icon\" />\n                            ) : (\n                              <ResolveIcon className=\"lb-button-icon\" />\n                            )}\n                          </Button>\n                        </TogglePrimitive.Root>\n                      </Tooltip>\n                    ) : null\n                  }\n                />\n              );\n\n              return index === newIndicatorIndex &&\n                newIndicatorIndex !== firstCommentIndex &&\n                newIndicatorIndex <= lastCommentIndex ? (\n                <Fragment key={comment.id}>\n                  <div\n                    className=\"lb-thread-new-indicator\"\n                    aria-label={$.THREAD_NEW_INDICATOR_DESCRIPTION}\n                  >\n                    <span className=\"lb-thread-new-indicator-label\">\n                      <ArrowDownIcon className=\"lb-thread-new-indicator-label-icon\" />\n                      {$.THREAD_NEW_INDICATOR}\n                    </span>\n                  </div>\n                  {children}\n                </Fragment>\n              ) : (\n                children\n              );\n            })}\n          </div>\n          {showComposer && (\n            <Composer\n              className=\"lb-thread-composer\"\n              threadId={thread.id}\n              defaultCollapsed={showComposer === \"collapsed\" ? true : undefined}\n              overrides={{\n                COMPOSER_PLACEHOLDER: $.THREAD_COMPOSER_PLACEHOLDER,\n                COMPOSER_SEND: $.THREAD_COMPOSER_SEND,\n              }}\n            />\n          )}\n        </div>\n      </TooltipProvider>\n    );\n  }\n) as <M extends BaseMetadata = DM>(\n  props: ThreadProps<M> & RefAttributes<HTMLDivElement>\n) => JSX.Element;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAgJO;AAAe;AAElB;AACE;AACuB;AACT;AACd;AACoB;AACJ;AACD;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACG;AAIL;AACA;AACA;AACA;AACE;AAEuD;AAEzD;AACE;AAE4D;AAE9D;AAAoD;AAC3C;AAET;AAEE;AACE;AAAA;AAIF;AACE;AAAO;AAIT;AAAoC;AAGZ;AAGxB;AAEI;AACH;AACD;AACA;AACA;AACO;AACP;AAEF;AACA;AAEA;AACE;AAEE;AAAA;AACwD;AACxD;AACF;AAGF;AACE;AAAsB;AAGxB;AAA6B;AAEzB;AAEA;AACE;AAA8B;AAE9B;AAAgC;AAClC;AACF;AACA;AACE;AACA;AACA;AACO;AACT;AAGF;AAA4B;AAExB;AAEA;AAAyC;AAClB;AAGvB;AACE;AAAuB;AACzB;AACF;AACwC;AAG1C;AAEK;AACY;AACT;AAC2B;AAC3B;AACF;AACsC;AACQ;AACvC;AACH;AACC;AAEJ;AAAc;AAEX;AACA;AAGA;AACG;AACc;AACH;AACmB;AAC7B;AACe;AACF;AACb;AACA;AACA;AACiB;AACjB;AACA;AACA;AAIM;AAGmC;AAIpC;AAIS;AAGP;AACiB;AACC;AACV;AAEN;AACW;AACD;AAID;AAIL;AAAuB;AAEvB;AAAsB;AAK7B;AAKV;AAGG;AAAsB;AACpB;AACW;AACI;AAEb;AAAe;AACb;AAAwB;AAO/B;AAKH;AACW;AACO;AACuC;AAC7C;AACe;AACP;AACnB;AAIR;AAGN;;"}
+{"version":3,"file":"Thread.mjs","sources":["../../src/components/Thread.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n  BaseMetadata,\n  CommentData,\n  DM,\n  ThreadData,\n} from \"@liveblocks/core\";\nimport {\n  useMarkThreadAsResolved,\n  useMarkThreadAsUnresolved,\n  useThreadSubscription,\n} from \"@liveblocks/react\";\nimport * as TogglePrimitive from \"@radix-ui/react-toggle\";\nimport type {\n  ComponentPropsWithoutRef,\n  ForwardedRef,\n  RefAttributes,\n  SyntheticEvent,\n} from \"react\";\nimport React, {\n  forwardRef,\n  Fragment,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from \"react\";\n\nimport { ArrowDownIcon } from \"../icons/ArrowDown\";\nimport { ResolveIcon } from \"../icons/Resolve\";\nimport { ResolvedIcon } from \"../icons/Resolved\";\nimport type {\n  CommentOverrides,\n  ComposerOverrides,\n  GlobalOverrides,\n  ThreadOverrides,\n} from \"../overrides\";\nimport { useOverrides } from \"../overrides\";\nimport { classNames } from \"../utils/class-names\";\nimport { findLastIndex } from \"../utils/find-last-index\";\nimport type { CommentProps } from \"./Comment\";\nimport { Comment } from \"./Comment\";\nimport { Composer } from \"./Composer\";\nimport { Button } from \"./internal/Button\";\nimport { Tooltip, TooltipProvider } from \"./internal/Tooltip\";\n\nexport interface ThreadProps<M extends BaseMetadata = DM>\n  extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The thread to display.\n   */\n  thread: ThreadData<M>;\n\n  /**\n   * How to show or hide the composer to reply to the thread.\n   */\n  showComposer?: boolean | \"collapsed\";\n\n  /**\n   * Whether to show the action to resolve the thread.\n   */\n  showResolveAction?: boolean;\n\n  /**\n   * How to show or hide the actions.\n   */\n  showActions?: CommentProps[\"showActions\"];\n\n  /**\n   * Whether to show reactions.\n   */\n  showReactions?: CommentProps[\"showReactions\"];\n\n  /**\n   * Whether to indent the comments' content.\n   */\n  indentCommentContent?: CommentProps[\"indentContent\"];\n\n  /**\n   * Whether to show deleted comments.\n   */\n  showDeletedComments?: CommentProps[\"showDeleted\"];\n\n  /**\n   * The event handler called when changing the resolved status.\n   */\n  onResolvedChange?: (resolved: boolean) => void;\n\n  /**\n   * The event handler called when a comment is edited.\n   */\n  onCommentEdit?: CommentProps[\"onCommentEdit\"];\n\n  /**\n   * The event handler called when a comment is deleted.\n   */\n  onCommentDelete?: CommentProps[\"onCommentDelete\"];\n\n  /**\n   * The event handler called when the thread is deleted.\n   * A thread is deleted when all its comments are deleted.\n   */\n  onThreadDelete?: (thread: ThreadData<M>) => void;\n\n  /**\n   * The event handler called when clicking on a comment's author.\n   */\n  onAuthorClick?: CommentProps[\"onAuthorClick\"];\n\n  /**\n   * The event handler called when clicking on a mention.\n   */\n  onMentionClick?: CommentProps[\"onMentionClick\"];\n\n  /**\n   * Override the component's strings.\n   */\n  overrides?: Partial<\n    GlobalOverrides & ThreadOverrides & CommentOverrides & ComposerOverrides\n  >;\n}\n\n/**\n * Displays a thread of comments, with a composer to reply\n * to it.\n *\n * @example\n * <>\n *   {threads.map((thread) => (\n *     <Thread key={thread.id} thread={thread} />\n *   ))}\n * </>\n */\nexport const Thread = forwardRef(\n  <M extends BaseMetadata = DM>(\n    {\n      thread,\n      indentCommentContent = true,\n      showActions = \"hover\",\n      showDeletedComments,\n      showResolveAction = true,\n      showReactions = true,\n      showComposer = \"collapsed\",\n      onResolvedChange,\n      onCommentEdit,\n      onCommentDelete,\n      onThreadDelete,\n      onAuthorClick,\n      onMentionClick,\n      overrides,\n      className,\n      ...props\n    }: ThreadProps<M>,\n    forwardedRef: ForwardedRef<HTMLDivElement>\n  ) => {\n    const markThreadAsResolved = useMarkThreadAsResolved();\n    const markThreadAsUnresolved = useMarkThreadAsUnresolved();\n    const $ = useOverrides(overrides);\n    const firstCommentIndex = useMemo(() => {\n      return showDeletedComments\n        ? 0\n        : thread.comments.findIndex((comment) => comment.body);\n    }, [showDeletedComments, thread.comments]);\n    const lastCommentIndex = useMemo(() => {\n      return showDeletedComments\n        ? thread.comments.length - 1\n        : findLastIndex(thread.comments, (comment) => comment.body);\n    }, [showDeletedComments, thread.comments]);\n    const { status: subscriptionStatus, unreadSince } = useThreadSubscription(\n      thread.id\n    );\n    const unreadIndex = useMemo(() => {\n      // The user is not subscribed to this thread.\n      if (subscriptionStatus !== \"subscribed\") {\n        return;\n      }\n\n      // The user hasn't read the thread yet, so all comments are unread.\n      if (unreadSince === null) {\n        return firstCommentIndex;\n      }\n\n      // The user has read the thread, so we find the first unread comment.\n      const unreadIndex = thread.comments.findIndex(\n        (comment) =>\n          (showDeletedComments ? true : comment.body) &&\n          comment.createdAt > unreadSince\n      );\n\n      return unreadIndex >= 0 && unreadIndex < thread.comments.length\n        ? unreadIndex\n        : undefined;\n    }, [\n      firstCommentIndex,\n      showDeletedComments,\n      subscriptionStatus,\n      thread.comments,\n      unreadSince,\n    ]);\n    const [newIndex, setNewIndex] = useState<number>();\n    const newIndicatorIndex = newIndex === undefined ? unreadIndex : newIndex;\n\n    useEffect(() => {\n      if (unreadIndex) {\n        // Keep the \"new\" indicator at the lowest unread index.\n        setNewIndex((persistedUnreadIndex) =>\n          Math.min(persistedUnreadIndex ?? Infinity, unreadIndex)\n        );\n      }\n    }, [unreadIndex]);\n\n    const stopPropagation = useCallback((event: SyntheticEvent) => {\n      event.stopPropagation();\n    }, []);\n\n    const handleResolvedChange = useCallback(\n      (resolved: boolean) => {\n        onResolvedChange?.(resolved);\n\n        if (resolved) {\n          markThreadAsResolved(thread.id);\n        } else {\n          markThreadAsUnresolved(thread.id);\n        }\n      },\n      [\n        markThreadAsResolved,\n        markThreadAsUnresolved,\n        onResolvedChange,\n        thread.id,\n      ]\n    );\n\n    const handleCommentDelete = useCallback(\n      (comment: CommentData) => {\n        onCommentDelete?.(comment);\n\n        const filteredComments = thread.comments.filter(\n          (comment) => comment.body\n        );\n\n        if (filteredComments.length <= 1) {\n          onThreadDelete?.(thread);\n        }\n      },\n      [onCommentDelete, onThreadDelete, thread]\n    );\n\n    return (\n      <TooltipProvider>\n        <div\n          className={classNames(\n            \"lb-root lb-thread\",\n            showActions === \"hover\" && \"lb-thread:show-actions-hover\",\n            className\n          )}\n          data-resolved={thread.resolved ? \"\" : undefined}\n          data-unread={unreadIndex !== undefined ? \"\" : undefined}\n          dir={$.dir}\n          {...props}\n          ref={forwardedRef}\n        >\n          <div className=\"lb-thread-comments\">\n            {thread.comments.map((comment, index) => {\n              const isFirstComment = index === firstCommentIndex;\n              const isUnread =\n                unreadIndex !== undefined && index >= unreadIndex;\n\n              const children = (\n                <Comment\n                  key={comment.id}\n                  className=\"lb-thread-comment\"\n                  data-unread={isUnread ? \"\" : undefined}\n                  comment={comment}\n                  indentContent={indentCommentContent}\n                  showDeleted={showDeletedComments}\n                  showActions={showActions}\n                  showReactions={showReactions}\n                  onCommentEdit={onCommentEdit}\n                  onCommentDelete={handleCommentDelete}\n                  onAuthorClick={onAuthorClick}\n                  onMentionClick={onMentionClick}\n                  autoMarkReadThreadId={\n                    index === lastCommentIndex && isUnread\n                      ? thread.id\n                      : undefined\n                  }\n                  additionalActionsClassName={\n                    isFirstComment ? \"lb-thread-actions\" : undefined\n                  }\n                  additionalActions={\n                    isFirstComment && showResolveAction ? (\n                      <Tooltip\n                        content={\n                          thread.resolved\n                            ? $.THREAD_UNRESOLVE\n                            : $.THREAD_RESOLVE\n                        }\n                      >\n                        <TogglePrimitive.Root\n                          pressed={thread.resolved}\n                          onPressedChange={handleResolvedChange}\n                          asChild\n                        >\n                          <Button\n                            className=\"lb-comment-action\"\n                            onClick={stopPropagation}\n                            aria-label={\n                              thread.resolved\n                                ? $.THREAD_UNRESOLVE\n                                : $.THREAD_RESOLVE\n                            }\n                          >\n                            {thread.resolved ? (\n                              <ResolvedIcon className=\"lb-button-icon\" />\n                            ) : (\n                              <ResolveIcon className=\"lb-button-icon\" />\n                            )}\n                          </Button>\n                        </TogglePrimitive.Root>\n                      </Tooltip>\n                    ) : null\n                  }\n                />\n              );\n\n              return index === newIndicatorIndex &&\n                newIndicatorIndex !== firstCommentIndex &&\n                newIndicatorIndex <= lastCommentIndex ? (\n                <Fragment key={comment.id}>\n                  <div\n                    className=\"lb-thread-new-indicator\"\n                    aria-label={$.THREAD_NEW_INDICATOR_DESCRIPTION}\n                  >\n                    <span className=\"lb-thread-new-indicator-label\">\n                      <ArrowDownIcon className=\"lb-thread-new-indicator-label-icon\" />\n                      {$.THREAD_NEW_INDICATOR}\n                    </span>\n                  </div>\n                  {children}\n                </Fragment>\n              ) : (\n                children\n              );\n            })}\n          </div>\n          {showComposer && (\n            <Composer\n              className=\"lb-thread-composer\"\n              threadId={thread.id}\n              defaultCollapsed={showComposer === \"collapsed\" ? true : undefined}\n              overrides={{\n                COMPOSER_PLACEHOLDER: $.THREAD_COMPOSER_PLACEHOLDER,\n                COMPOSER_SEND: $.THREAD_COMPOSER_SEND,\n              }}\n            />\n          )}\n        </div>\n      </TooltipProvider>\n    );\n  }\n) as <M extends BaseMetadata = DM>(\n  props: ThreadProps<M> & RefAttributes<HTMLDivElement>\n) => JSX.Element;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAsIO;AAAe;AAElB;AACE;AACuB;AACT;AACd;AACoB;AACJ;AACD;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACG;AAIL;AACA;AACA;AACA;AACE;AAEuD;AAEzD;AACE;AAE4D;AAE9D;AAAoD;AAC3C;AAET;AAEE;AACE;AAAA;AAIF;AACE;AAAO;AAIT;AAAoC;AAGZ;AAGxB;AAEI;AACH;AACD;AACA;AACA;AACO;AACP;AAEF;AACA;AAEA;AACE;AAEE;AAAA;AACwD;AACxD;AACF;AAGF;AACE;AAAsB;AAGxB;AAA6B;AAEzB;AAEA;AACE;AAA8B;AAE9B;AAAgC;AAClC;AACF;AACA;AACE;AACA;AACA;AACO;AACT;AAGF;AAA4B;AAExB;AAEA;AAAyC;AAClB;AAGvB;AACE;AAAuB;AACzB;AACF;AACwC;AAG1C;AAEK;AACY;AACT;AAC2B;AAC3B;AACF;AACsC;AACQ;AACvC;AACH;AACC;AAEJ;AAAc;AAEX;AACA;AAGA;AACG;AACc;AACH;AACmB;AAC7B;AACe;AACF;AACb;AACA;AACA;AACiB;AACjB;AACA;AAIM;AAGmC;AAIpC;AAIS;AAGP;AACiB;AACC;AACV;AAEN;AACW;AACD;AAID;AAIL;AAAuB;AAEvB;AAAsB;AAK7B;AAKV;AAGG;AAAsB;AACpB;AACW;AACI;AAEb;AAAe;AACb;AAAwB;AAO/B;AAKH;AACW;AACO;AACuC;AAC7C;AACe;AACP;AACnB;AAIR;AAGN;;"}

package/dist/components/internal/Button.js

@@ -5,7 +5,13 @@ var React = require('react');
 var classNames = require('../../utils/class-names.js');
 
 const Button = React.forwardRef(
-  ({ variant = "default", disableable = true, className, ...props }, forwardedRef) => {
+  ({
+    variant = "default",
+    size = "default",
+    disableable = true,
+    className,
+    ...props
+  }, forwardedRef) => {
     return /* @__PURE__ */ React.createElement("button", {
       type: "button",
       className: classNames.classNames(
@@ -14,6 +20,7 @@ const Button = React.forwardRef(
         className
       ),
       "data-variant": variant,
+      "data-size": size,
       ...props,
       ref: forwardedRef
     });

package/dist/components/internal/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../src/components/internal/Button.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentProps } from \"react\";\nimport React, { forwardRef } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface ButtonProps extends ComponentProps<\"button\"> {\n  variant?: \"default\" | \"outline\" | \"primary\";\n  disableable?: boolean;\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    { variant = \"default\", disableable = true, className, ...props },\n    forwardedRef\n  ) => {\n    return (\n      <button\n        type=\"button\"\n        className={classNames(\n          \"lb-button\",\n          !disableable && \"lb-button:non-disableable\",\n          className\n        )}\n        data-variant={variant}\n        {...props}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n"],"names":[],"mappings":";;;;;;AAYO;AAAe;AAKlB;AACG;AACM;AACM;AACT;AACgB;AAChB;AACF;AACc;AACV;AACC;AACP;AAGN;;"}
+{"version":3,"file":"Button.js","sources":["../../../src/components/internal/Button.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentProps } from \"react\";\nimport React, { forwardRef } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface ButtonProps extends ComponentProps<\"button\"> {\n  variant?: \"default\" | \"outline\" | \"primary\";\n  size?: \"default\" | \"large\";\n  disableable?: boolean;\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      variant = \"default\",\n      size = \"default\",\n      disableable = true,\n      className,\n      ...props\n    },\n    forwardedRef\n  ) => {\n    return (\n      <button\n        type=\"button\"\n        className={classNames(\n          \"lb-button\",\n          !disableable && \"lb-button:non-disableable\",\n          className\n        )}\n        data-variant={variant}\n        data-size={size}\n        {...props}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n"],"names":[],"mappings":";;;;;;AAaO;AAAe;AAElB;AACY;AACH;AACO;AACd;AACG;AAIL;AACG;AACM;AACM;AACT;AACgB;AAChB;AACF;AACc;AACH;AACP;AACC;AACP;AAGN;;"}

package/dist/components/internal/Button.mjs

@@ -3,7 +3,13 @@ import React__default, { forwardRef } from 'react';
 import { classNames } from '../../utils/class-names.mjs';
 
 const Button = forwardRef(
-  ({ variant = "default", disableable = true, className, ...props }, forwardedRef) => {
+  ({
+    variant = "default",
+    size = "default",
+    disableable = true,
+    className,
+    ...props
+  }, forwardedRef) => {
     return /* @__PURE__ */ React__default.createElement("button", {
       type: "button",
       className: classNames(
@@ -12,6 +18,7 @@ const Button = forwardRef(
         className
       ),
       "data-variant": variant,
+      "data-size": size,
       ...props,
       ref: forwardedRef
     });

package/dist/components/internal/Button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Button.mjs","sources":["../../../src/components/internal/Button.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentProps } from \"react\";\nimport React, { forwardRef } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface ButtonProps extends ComponentProps<\"button\"> {\n  variant?: \"default\" | \"outline\" | \"primary\";\n  disableable?: boolean;\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    { variant = \"default\", disableable = true, className, ...props },\n    forwardedRef\n  ) => {\n    return (\n      <button\n        type=\"button\"\n        className={classNames(\n          \"lb-button\",\n          !disableable && \"lb-button:non-disableable\",\n          className\n        )}\n        data-variant={variant}\n        {...props}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n"],"names":[],"mappings":";;;;AAYO;AAAe;AAKlB;AACG;AACM;AACM;AACT;AACgB;AAChB;AACF;AACc;AACV;AACC;AACP;AAGN;;"}
+{"version":3,"file":"Button.mjs","sources":["../../../src/components/internal/Button.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentProps } from \"react\";\nimport React, { forwardRef } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface ButtonProps extends ComponentProps<\"button\"> {\n  variant?: \"default\" | \"outline\" | \"primary\";\n  size?: \"default\" | \"large\";\n  disableable?: boolean;\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      variant = \"default\",\n      size = \"default\",\n      disableable = true,\n      className,\n      ...props\n    },\n    forwardedRef\n  ) => {\n    return (\n      <button\n        type=\"button\"\n        className={classNames(\n          \"lb-button\",\n          !disableable && \"lb-button:non-disableable\",\n          className\n        )}\n        data-variant={variant}\n        data-size={size}\n        {...props}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n"],"names":[],"mappings":";;;;AAaO;AAAe;AAElB;AACY;AACH;AACO;AACd;AACG;AAIL;AACG;AACM;AACM;AACT;AACgB;AAChB;AACF;AACc;AACH;AACP;AACC;AACP;AAGN;;"}

package/dist/components/internal/EmojiPicker.js

@@ -35,7 +35,7 @@ function EmojiPickerLoading({
   ...props
 }) {
   return /* @__PURE__ */ React.createElement("div", {
-    className: classNames.classNames("lb-emoji-picker-loading", className),
+    className: classNames.classNames("lb-loading lb-emoji-picker-loading", className),
     ...props
   }, /* @__PURE__ */ React.createElement(Spinner.SpinnerIcon, null));
 }
@@ -45,7 +45,7 @@ function EmojiPickerEmpty({
 }) {
   const $ = overrides.useOverrides();
   return /* @__PURE__ */ React.createElement("div", {
-    className: classNames.classNames("lb-emoji-picker-empty", className),
+    className: classNames.classNames("lb-empty lb-emoji-picker-empty", className),
     ...props
   }, $.EMOJI_PICKER_EMPTY);
 }
@@ -56,7 +56,7 @@ function EmojiPickerError({
 }) {
   const $ = overrides.useOverrides();
   return /* @__PURE__ */ React.createElement("div", {
-    className: classNames.classNames("lb-emoji-picker-error", className),
+    className: classNames.classNames("lb-error lb-emoji-picker-error", className),
     ...props
   }, $.EMOJI_PICKER_ERROR(error));
 }

package/dist/components/internal/EmojiPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmojiPicker.js","sources":["../../../src/components/internal/EmojiPicker.tsx"],"sourcesContent":["import * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport React, { forwardRef, useCallback, useMemo, useState } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n  FLOATING_ELEMENT_COLLISION_PADDING,\n  FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { SearchIcon } from \"../../icons/Search\";\nimport { SpinnerIcon } from \"../../icons/Spinner\";\nimport { useOverrides } from \"../../overrides\";\nimport * as EmojiPickerPrimitive from \"../../primitives/EmojiPicker\";\nimport type {\n  EmojiPickerContentCategoryHeaderProps,\n  EmojiPickerContentEmojiProps,\n  EmojiPickerContentEmptyProps,\n  EmojiPickerContentErrorProps,\n  EmojiPickerContentGridProps,\n  EmojiPickerContentLoadingProps,\n  EmojiPickerContentRowProps,\n} from \"../../primitives/EmojiPicker/types\";\nimport { classNames } from \"../../utils/class-names\";\nimport { Emoji } from \"./Emoji\";\n\nexport interface EmojiPickerProps extends ComponentPropsWithoutRef<\"div\"> {\n  onOpenChange?: (open: boolean) => void;\n  onEmojiSelect?: (emoji: string) => void;\n}\n\nfunction EmojiPickerLoading({\n  className,\n  ...props\n}: EmojiPickerContentLoadingProps) {\n  return (\n    <div\n      className={classNames(\"lb-emoji-picker-loading\", className)}\n      {...props}\n    >\n      <SpinnerIcon />\n    </div>\n  );\n}\n\nfunction EmojiPickerEmpty({\n  className,\n  ...props\n}: EmojiPickerContentEmptyProps) {\n  const $ = useOverrides();\n\n  return (\n    <div className={classNames(\"lb-emoji-picker-empty\", className)} {...props}>\n      {$.EMOJI_PICKER_EMPTY}\n    </div>\n  );\n}\n\nfunction EmojiPickerError({\n  error,\n  className,\n  ...props\n}: EmojiPickerContentErrorProps) {\n  const $ = useOverrides();\n\n  return (\n    <div className={classNames(\"lb-emoji-picker-error\", className)} {...props}>\n      {$.EMOJI_PICKER_ERROR(error)}\n    </div>\n  );\n}\n\nfunction EmojiPickerCategoryHeader({\n  category,\n  className,\n  ...props\n}: EmojiPickerContentCategoryHeaderProps) {\n  return (\n    <div\n      className={classNames(\"lb-emoji-picker-category-header\", className)}\n      {...props}\n    >\n      <span className=\"lb-emoji-picker-category-header-title\">{category}</span>\n    </div>\n  );\n}\n\nfunction EmojiPickerGrid({\n  children,\n  className,\n  ...props\n}: EmojiPickerContentGridProps) {\n  return (\n    <div className={classNames(\"lb-emoji-picker-grid\", className)} {...props}>\n      {children}\n    </div>\n  );\n}\n\nfunction EmojiPickerRow({\n  attributes,\n  children,\n  className,\n  ...props\n}: EmojiPickerContentRowProps) {\n  const isFirstRow = useMemo(\n    () => attributes.categoryRowIndex === 0,\n    [attributes.categoryRowIndex]\n  );\n  const isLastRow = useMemo(\n    () => attributes.categoryRowIndex === attributes.categoryRowsCount - 1,\n    [attributes.categoryRowIndex, attributes.categoryRowsCount]\n  );\n\n  return (\n    <div\n      className={classNames(\"lb-emoji-picker-row\", className)}\n      data-first={isFirstRow ? \"\" : undefined}\n      data-last={isLastRow ? \"\" : undefined}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\nfunction EmojiPickerEmoji({\n  emoji,\n  className,\n  ...props\n}: EmojiPickerContentEmojiProps) {\n  return (\n    <button\n      className={classNames(\"lb-emoji-picker-emoji\", className)}\n      {...props}\n    >\n      <Emoji emoji={emoji} />\n    </button>\n  );\n}\n\nexport const EmojiPicker = forwardRef<HTMLDivElement, EmojiPickerProps>(\n  (\n    { onEmojiSelect, onOpenChange, children, className, ...props },\n    forwardedRef\n  ) => {\n    const [isOpen, setOpen] = useState(false);\n    const { portalContainer } = useLiveblocksUIConfig();\n    const $ = useOverrides();\n\n    const handleOpenChange = useCallback(\n      (isOpen: boolean) => {\n        setOpen(isOpen);\n        onOpenChange?.(isOpen);\n      },\n      [onOpenChange]\n    );\n\n    const handleEmojiSelect = useCallback(\n      (emoji: string) => {\n        setOpen(false);\n        onEmojiSelect?.(emoji);\n      },\n      [onEmojiSelect]\n    );\n\n    return (\n      <PopoverPrimitive.Root open={isOpen} onOpenChange={handleOpenChange}>\n        {children}\n        <PopoverPrimitive.Portal container={portalContainer}>\n          <PopoverPrimitive.Content\n            side=\"top\"\n            align=\"center\"\n            sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n            collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n            className={classNames(\n              \"lb-root lb-portal lb-elevation lb-emoji-picker\",\n              className\n            )}\n            {...props}\n            ref={forwardedRef}\n          >\n            <EmojiPickerPrimitive.Root\n              onEmojiSelect={handleEmojiSelect}\n              locale={$.locale}\n            >\n              <div className=\"lb-emoji-picker-header\">\n                <div className=\"lb-emoji-picker-search-container\">\n                  <EmojiPickerPrimitive.Search\n                    className=\"lb-emoji-picker-search\"\n                    placeholder={$.EMOJI_PICKER_SEARCH_PLACEHOLDER}\n                    autoFocus\n                  />\n                  <SearchIcon className=\"lb-emoji-picker-search-icon\" />\n                </div>\n              </div>\n              <EmojiPickerPrimitive.Content\n                className=\"lb-emoji-picker-content\"\n                components={{\n                  Loading: EmojiPickerLoading,\n                  Empty: EmojiPickerEmpty,\n                  Error: EmojiPickerError,\n                  CategoryHeader: EmojiPickerCategoryHeader,\n                  Grid: EmojiPickerGrid,\n                  Row: EmojiPickerRow,\n                  Emoji: EmojiPickerEmoji,\n                }}\n              />\n            </EmojiPickerPrimitive.Root>\n          </PopoverPrimitive.Content>\n        </PopoverPrimitive.Portal>\n      </PopoverPrimitive.Root>\n    );\n  }\n);\n\nexport { PopoverTrigger as EmojiPickerTrigger } from \"@radix-ui/react-popover\";\n"],"names":["classNames","SpinnerIcon","useOverrides","useMemo","Emoji","forwardRef","useState","useLiveblocksUIConfig","useCallback","isOpen","PopoverPrimitive","FLOATING_ELEMENT_SIDE_OFFSET","FLOATING_ELEMENT_COLLISION_PADDING","EmojiPickerPrimitive.Root","EmojiPickerPrimitive.Search","SearchIcon","EmojiPickerPrimitive.Content"],"mappings":"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"}
+{"version":3,"file":"EmojiPicker.js","sources":["../../../src/components/internal/EmojiPicker.tsx"],"sourcesContent":["import * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport React, { forwardRef, useCallback, useMemo, useState } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n  FLOATING_ELEMENT_COLLISION_PADDING,\n  FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { SearchIcon } from \"../../icons/Search\";\nimport { SpinnerIcon } from \"../../icons/Spinner\";\nimport { useOverrides } from \"../../overrides\";\nimport * as EmojiPickerPrimitive from \"../../primitives/EmojiPicker\";\nimport type {\n  EmojiPickerContentCategoryHeaderProps,\n  EmojiPickerContentEmojiProps,\n  EmojiPickerContentEmptyProps,\n  EmojiPickerContentErrorProps,\n  EmojiPickerContentGridProps,\n  EmojiPickerContentLoadingProps,\n  EmojiPickerContentRowProps,\n} from \"../../primitives/EmojiPicker/types\";\nimport { classNames } from \"../../utils/class-names\";\nimport { Emoji } from \"./Emoji\";\n\nexport interface EmojiPickerProps extends ComponentPropsWithoutRef<\"div\"> {\n  onOpenChange?: (open: boolean) => void;\n  onEmojiSelect?: (emoji: string) => void;\n}\n\nfunction EmojiPickerLoading({\n  className,\n  ...props\n}: EmojiPickerContentLoadingProps) {\n  return (\n    <div\n      className={classNames(\"lb-loading lb-emoji-picker-loading\", className)}\n      {...props}\n    >\n      <SpinnerIcon />\n    </div>\n  );\n}\n\nfunction EmojiPickerEmpty({\n  className,\n  ...props\n}: EmojiPickerContentEmptyProps) {\n  const $ = useOverrides();\n\n  return (\n    <div\n      className={classNames(\"lb-empty lb-emoji-picker-empty\", className)}\n      {...props}\n    >\n      {$.EMOJI_PICKER_EMPTY}\n    </div>\n  );\n}\n\nfunction EmojiPickerError({\n  error,\n  className,\n  ...props\n}: EmojiPickerContentErrorProps) {\n  const $ = useOverrides();\n\n  return (\n    <div\n      className={classNames(\"lb-error lb-emoji-picker-error\", className)}\n      {...props}\n    >\n      {$.EMOJI_PICKER_ERROR(error)}\n    </div>\n  );\n}\n\nfunction EmojiPickerCategoryHeader({\n  category,\n  className,\n  ...props\n}: EmojiPickerContentCategoryHeaderProps) {\n  return (\n    <div\n      className={classNames(\"lb-emoji-picker-category-header\", className)}\n      {...props}\n    >\n      <span className=\"lb-emoji-picker-category-header-title\">{category}</span>\n    </div>\n  );\n}\n\nfunction EmojiPickerGrid({\n  children,\n  className,\n  ...props\n}: EmojiPickerContentGridProps) {\n  return (\n    <div className={classNames(\"lb-emoji-picker-grid\", className)} {...props}>\n      {children}\n    </div>\n  );\n}\n\nfunction EmojiPickerRow({\n  attributes,\n  children,\n  className,\n  ...props\n}: EmojiPickerContentRowProps) {\n  const isFirstRow = useMemo(\n    () => attributes.categoryRowIndex === 0,\n    [attributes.categoryRowIndex]\n  );\n  const isLastRow = useMemo(\n    () => attributes.categoryRowIndex === attributes.categoryRowsCount - 1,\n    [attributes.categoryRowIndex, attributes.categoryRowsCount]\n  );\n\n  return (\n    <div\n      className={classNames(\"lb-emoji-picker-row\", className)}\n      data-first={isFirstRow ? \"\" : undefined}\n      data-last={isLastRow ? \"\" : undefined}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\nfunction EmojiPickerEmoji({\n  emoji,\n  className,\n  ...props\n}: EmojiPickerContentEmojiProps) {\n  return (\n    <button\n      className={classNames(\"lb-emoji-picker-emoji\", className)}\n      {...props}\n    >\n      <Emoji emoji={emoji} />\n    </button>\n  );\n}\n\nexport const EmojiPicker = forwardRef<HTMLDivElement, EmojiPickerProps>(\n  (\n    { onEmojiSelect, onOpenChange, children, className, ...props },\n    forwardedRef\n  ) => {\n    const [isOpen, setOpen] = useState(false);\n    const { portalContainer } = useLiveblocksUIConfig();\n    const $ = useOverrides();\n\n    const handleOpenChange = useCallback(\n      (isOpen: boolean) => {\n        setOpen(isOpen);\n        onOpenChange?.(isOpen);\n      },\n      [onOpenChange]\n    );\n\n    const handleEmojiSelect = useCallback(\n      (emoji: string) => {\n        setOpen(false);\n        onEmojiSelect?.(emoji);\n      },\n      [onEmojiSelect]\n    );\n\n    return (\n      <PopoverPrimitive.Root open={isOpen} onOpenChange={handleOpenChange}>\n        {children}\n        <PopoverPrimitive.Portal container={portalContainer}>\n          <PopoverPrimitive.Content\n            side=\"top\"\n            align=\"center\"\n            sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n            collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n            className={classNames(\n              \"lb-root lb-portal lb-elevation lb-emoji-picker\",\n              className\n            )}\n            {...props}\n            ref={forwardedRef}\n          >\n            <EmojiPickerPrimitive.Root\n              onEmojiSelect={handleEmojiSelect}\n              locale={$.locale}\n            >\n              <div className=\"lb-emoji-picker-header\">\n                <div className=\"lb-emoji-picker-search-container\">\n                  <EmojiPickerPrimitive.Search\n                    className=\"lb-emoji-picker-search\"\n                    placeholder={$.EMOJI_PICKER_SEARCH_PLACEHOLDER}\n                    autoFocus\n                  />\n                  <SearchIcon className=\"lb-emoji-picker-search-icon\" />\n                </div>\n              </div>\n              <EmojiPickerPrimitive.Content\n                className=\"lb-emoji-picker-content\"\n                components={{\n                  Loading: EmojiPickerLoading,\n                  Empty: EmojiPickerEmpty,\n                  Error: EmojiPickerError,\n                  CategoryHeader: EmojiPickerCategoryHeader,\n                  Grid: EmojiPickerGrid,\n                  Row: EmojiPickerRow,\n                  Emoji: EmojiPickerEmoji,\n                }}\n              />\n            </EmojiPickerPrimitive.Root>\n          </PopoverPrimitive.Content>\n        </PopoverPrimitive.Portal>\n      </PopoverPrimitive.Root>\n    );\n  }\n);\n\nexport { PopoverTrigger as EmojiPickerTrigger } from \"@radix-ui/react-popover\";\n"],"names":["classNames","SpinnerIcon","useOverrides","useMemo","Emoji","forwardRef","useState","useLiveblocksUIConfig","useCallback","isOpen","PopoverPrimitive","FLOATING_ELEMENT_SIDE_OFFSET","FLOATING_ELEMENT_COLLISION_PADDING","EmojiPickerPrimitive.Root","EmojiPickerPrimitive.Search","SearchIcon","EmojiPickerPrimitive.Content"],"mappings":"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"}

package/dist/components/internal/EmojiPicker.mjs

@@ -15,7 +15,7 @@ function EmojiPickerLoading({
   ...props
 }) {
   return /* @__PURE__ */ React__default.createElement("div", {
-    className: classNames("lb-emoji-picker-loading", className),
+    className: classNames("lb-loading lb-emoji-picker-loading", className),
     ...props
   }, /* @__PURE__ */ React__default.createElement(SpinnerIcon, null));
 }
@@ -25,7 +25,7 @@ function EmojiPickerEmpty({
 }) {
   const $ = useOverrides();
   return /* @__PURE__ */ React__default.createElement("div", {
-    className: classNames("lb-emoji-picker-empty", className),
+    className: classNames("lb-empty lb-emoji-picker-empty", className),
     ...props
   }, $.EMOJI_PICKER_EMPTY);
 }
@@ -36,7 +36,7 @@ function EmojiPickerError({
 }) {
   const $ = useOverrides();
   return /* @__PURE__ */ React__default.createElement("div", {
-    className: classNames("lb-emoji-picker-error", className),
+    className: classNames("lb-error lb-emoji-picker-error", className),
     ...props
   }, $.EMOJI_PICKER_ERROR(error));
 }

package/dist/components/internal/EmojiPicker.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"EmojiPicker.mjs","sources":["../../../src/components/internal/EmojiPicker.tsx"],"sourcesContent":["import * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport React, { forwardRef, useCallback, useMemo, useState } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n  FLOATING_ELEMENT_COLLISION_PADDING,\n  FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { SearchIcon } from \"../../icons/Search\";\nimport { SpinnerIcon } from \"../../icons/Spinner\";\nimport { useOverrides } from \"../../overrides\";\nimport * as EmojiPickerPrimitive from \"../../primitives/EmojiPicker\";\nimport type {\n  EmojiPickerContentCategoryHeaderProps,\n  EmojiPickerContentEmojiProps,\n  EmojiPickerContentEmptyProps,\n  EmojiPickerContentErrorProps,\n  EmojiPickerContentGridProps,\n  EmojiPickerContentLoadingProps,\n  EmojiPickerContentRowProps,\n} from \"../../primitives/EmojiPicker/types\";\nimport { classNames } from \"../../utils/class-names\";\nimport { Emoji } from \"./Emoji\";\n\nexport interface EmojiPickerProps extends ComponentPropsWithoutRef<\"div\"> {\n  onOpenChange?: (open: boolean) => void;\n  onEmojiSelect?: (emoji: string) => void;\n}\n\nfunction EmojiPickerLoading({\n  className,\n  ...props\n}: EmojiPickerContentLoadingProps) {\n  return (\n    <div\n      className={classNames(\"lb-emoji-picker-loading\", className)}\n      {...props}\n    >\n      <SpinnerIcon />\n    </div>\n  );\n}\n\nfunction EmojiPickerEmpty({\n  className,\n  ...props\n}: EmojiPickerContentEmptyProps) {\n  const $ = useOverrides();\n\n  return (\n    <div className={classNames(\"lb-emoji-picker-empty\", className)} {...props}>\n      {$.EMOJI_PICKER_EMPTY}\n    </div>\n  );\n}\n\nfunction EmojiPickerError({\n  error,\n  className,\n  ...props\n}: EmojiPickerContentErrorProps) {\n  const $ = useOverrides();\n\n  return (\n    <div className={classNames(\"lb-emoji-picker-error\", className)} {...props}>\n      {$.EMOJI_PICKER_ERROR(error)}\n    </div>\n  );\n}\n\nfunction EmojiPickerCategoryHeader({\n  category,\n  className,\n  ...props\n}: EmojiPickerContentCategoryHeaderProps) {\n  return (\n    <div\n      className={classNames(\"lb-emoji-picker-category-header\", className)}\n      {...props}\n    >\n      <span className=\"lb-emoji-picker-category-header-title\">{category}</span>\n    </div>\n  );\n}\n\nfunction EmojiPickerGrid({\n  children,\n  className,\n  ...props\n}: EmojiPickerContentGridProps) {\n  return (\n    <div className={classNames(\"lb-emoji-picker-grid\", className)} {...props}>\n      {children}\n    </div>\n  );\n}\n\nfunction EmojiPickerRow({\n  attributes,\n  children,\n  className,\n  ...props\n}: EmojiPickerContentRowProps) {\n  const isFirstRow = useMemo(\n    () => attributes.categoryRowIndex === 0,\n    [attributes.categoryRowIndex]\n  );\n  const isLastRow = useMemo(\n    () => attributes.categoryRowIndex === attributes.categoryRowsCount - 1,\n    [attributes.categoryRowIndex, attributes.categoryRowsCount]\n  );\n\n  return (\n    <div\n      className={classNames(\"lb-emoji-picker-row\", className)}\n      data-first={isFirstRow ? \"\" : undefined}\n      data-last={isLastRow ? \"\" : undefined}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\nfunction EmojiPickerEmoji({\n  emoji,\n  className,\n  ...props\n}: EmojiPickerContentEmojiProps) {\n  return (\n    <button\n      className={classNames(\"lb-emoji-picker-emoji\", className)}\n      {...props}\n    >\n      <Emoji emoji={emoji} />\n    </button>\n  );\n}\n\nexport const EmojiPicker = forwardRef<HTMLDivElement, EmojiPickerProps>(\n  (\n    { onEmojiSelect, onOpenChange, children, className, ...props },\n    forwardedRef\n  ) => {\n    const [isOpen, setOpen] = useState(false);\n    const { portalContainer } = useLiveblocksUIConfig();\n    const $ = useOverrides();\n\n    const handleOpenChange = useCallback(\n      (isOpen: boolean) => {\n        setOpen(isOpen);\n        onOpenChange?.(isOpen);\n      },\n      [onOpenChange]\n    );\n\n    const handleEmojiSelect = useCallback(\n      (emoji: string) => {\n        setOpen(false);\n        onEmojiSelect?.(emoji);\n      },\n      [onEmojiSelect]\n    );\n\n    return (\n      <PopoverPrimitive.Root open={isOpen} onOpenChange={handleOpenChange}>\n        {children}\n        <PopoverPrimitive.Portal container={portalContainer}>\n          <PopoverPrimitive.Content\n            side=\"top\"\n            align=\"center\"\n            sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n            collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n            className={classNames(\n              \"lb-root lb-portal lb-elevation lb-emoji-picker\",\n              className\n            )}\n            {...props}\n            ref={forwardedRef}\n          >\n            <EmojiPickerPrimitive.Root\n              onEmojiSelect={handleEmojiSelect}\n              locale={$.locale}\n            >\n              <div className=\"lb-emoji-picker-header\">\n                <div className=\"lb-emoji-picker-search-container\">\n                  <EmojiPickerPrimitive.Search\n                    className=\"lb-emoji-picker-search\"\n                    placeholder={$.EMOJI_PICKER_SEARCH_PLACEHOLDER}\n                    autoFocus\n                  />\n                  <SearchIcon className=\"lb-emoji-picker-search-icon\" />\n                </div>\n              </div>\n              <EmojiPickerPrimitive.Content\n                className=\"lb-emoji-picker-content\"\n                components={{\n                  Loading: EmojiPickerLoading,\n                  Empty: EmojiPickerEmpty,\n                  Error: EmojiPickerError,\n                  CategoryHeader: EmojiPickerCategoryHeader,\n                  Grid: EmojiPickerGrid,\n                  Row: EmojiPickerRow,\n                  Emoji: EmojiPickerEmoji,\n                }}\n              />\n            </EmojiPickerPrimitive.Root>\n          </PopoverPrimitive.Content>\n        </PopoverPrimitive.Portal>\n      </PopoverPrimitive.Root>\n    );\n  }\n);\n\nexport { PopoverTrigger as EmojiPickerTrigger } from \"@radix-ui/react-popover\";\n"],"names":["React","isOpen","EmojiPickerPrimitive.Root","EmojiPickerPrimitive.Search","EmojiPickerPrimitive.Content"],"mappings":"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"}
+{"version":3,"file":"EmojiPicker.mjs","sources":["../../../src/components/internal/EmojiPicker.tsx"],"sourcesContent":["import * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport React, { forwardRef, useCallback, useMemo, useState } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n  FLOATING_ELEMENT_COLLISION_PADDING,\n  FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { SearchIcon } from \"../../icons/Search\";\nimport { SpinnerIcon } from \"../../icons/Spinner\";\nimport { useOverrides } from \"../../overrides\";\nimport * as EmojiPickerPrimitive from \"../../primitives/EmojiPicker\";\nimport type {\n  EmojiPickerContentCategoryHeaderProps,\n  EmojiPickerContentEmojiProps,\n  EmojiPickerContentEmptyProps,\n  EmojiPickerContentErrorProps,\n  EmojiPickerContentGridProps,\n  EmojiPickerContentLoadingProps,\n  EmojiPickerContentRowProps,\n} from \"../../primitives/EmojiPicker/types\";\nimport { classNames } from \"../../utils/class-names\";\nimport { Emoji } from \"./Emoji\";\n\nexport interface EmojiPickerProps extends ComponentPropsWithoutRef<\"div\"> {\n  onOpenChange?: (open: boolean) => void;\n  onEmojiSelect?: (emoji: string) => void;\n}\n\nfunction EmojiPickerLoading({\n  className,\n  ...props\n}: EmojiPickerContentLoadingProps) {\n  return (\n    <div\n      className={classNames(\"lb-loading lb-emoji-picker-loading\", className)}\n      {...props}\n    >\n      <SpinnerIcon />\n    </div>\n  );\n}\n\nfunction EmojiPickerEmpty({\n  className,\n  ...props\n}: EmojiPickerContentEmptyProps) {\n  const $ = useOverrides();\n\n  return (\n    <div\n      className={classNames(\"lb-empty lb-emoji-picker-empty\", className)}\n      {...props}\n    >\n      {$.EMOJI_PICKER_EMPTY}\n    </div>\n  );\n}\n\nfunction EmojiPickerError({\n  error,\n  className,\n  ...props\n}: EmojiPickerContentErrorProps) {\n  const $ = useOverrides();\n\n  return (\n    <div\n      className={classNames(\"lb-error lb-emoji-picker-error\", className)}\n      {...props}\n    >\n      {$.EMOJI_PICKER_ERROR(error)}\n    </div>\n  );\n}\n\nfunction EmojiPickerCategoryHeader({\n  category,\n  className,\n  ...props\n}: EmojiPickerContentCategoryHeaderProps) {\n  return (\n    <div\n      className={classNames(\"lb-emoji-picker-category-header\", className)}\n      {...props}\n    >\n      <span className=\"lb-emoji-picker-category-header-title\">{category}</span>\n    </div>\n  );\n}\n\nfunction EmojiPickerGrid({\n  children,\n  className,\n  ...props\n}: EmojiPickerContentGridProps) {\n  return (\n    <div className={classNames(\"lb-emoji-picker-grid\", className)} {...props}>\n      {children}\n    </div>\n  );\n}\n\nfunction EmojiPickerRow({\n  attributes,\n  children,\n  className,\n  ...props\n}: EmojiPickerContentRowProps) {\n  const isFirstRow = useMemo(\n    () => attributes.categoryRowIndex === 0,\n    [attributes.categoryRowIndex]\n  );\n  const isLastRow = useMemo(\n    () => attributes.categoryRowIndex === attributes.categoryRowsCount - 1,\n    [attributes.categoryRowIndex, attributes.categoryRowsCount]\n  );\n\n  return (\n    <div\n      className={classNames(\"lb-emoji-picker-row\", className)}\n      data-first={isFirstRow ? \"\" : undefined}\n      data-last={isLastRow ? \"\" : undefined}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\nfunction EmojiPickerEmoji({\n  emoji,\n  className,\n  ...props\n}: EmojiPickerContentEmojiProps) {\n  return (\n    <button\n      className={classNames(\"lb-emoji-picker-emoji\", className)}\n      {...props}\n    >\n      <Emoji emoji={emoji} />\n    </button>\n  );\n}\n\nexport const EmojiPicker = forwardRef<HTMLDivElement, EmojiPickerProps>(\n  (\n    { onEmojiSelect, onOpenChange, children, className, ...props },\n    forwardedRef\n  ) => {\n    const [isOpen, setOpen] = useState(false);\n    const { portalContainer } = useLiveblocksUIConfig();\n    const $ = useOverrides();\n\n    const handleOpenChange = useCallback(\n      (isOpen: boolean) => {\n        setOpen(isOpen);\n        onOpenChange?.(isOpen);\n      },\n      [onOpenChange]\n    );\n\n    const handleEmojiSelect = useCallback(\n      (emoji: string) => {\n        setOpen(false);\n        onEmojiSelect?.(emoji);\n      },\n      [onEmojiSelect]\n    );\n\n    return (\n      <PopoverPrimitive.Root open={isOpen} onOpenChange={handleOpenChange}>\n        {children}\n        <PopoverPrimitive.Portal container={portalContainer}>\n          <PopoverPrimitive.Content\n            side=\"top\"\n            align=\"center\"\n            sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n            collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n            className={classNames(\n              \"lb-root lb-portal lb-elevation lb-emoji-picker\",\n              className\n            )}\n            {...props}\n            ref={forwardedRef}\n          >\n            <EmojiPickerPrimitive.Root\n              onEmojiSelect={handleEmojiSelect}\n              locale={$.locale}\n            >\n              <div className=\"lb-emoji-picker-header\">\n                <div className=\"lb-emoji-picker-search-container\">\n                  <EmojiPickerPrimitive.Search\n                    className=\"lb-emoji-picker-search\"\n                    placeholder={$.EMOJI_PICKER_SEARCH_PLACEHOLDER}\n                    autoFocus\n                  />\n                  <SearchIcon className=\"lb-emoji-picker-search-icon\" />\n                </div>\n              </div>\n              <EmojiPickerPrimitive.Content\n                className=\"lb-emoji-picker-content\"\n                components={{\n                  Loading: EmojiPickerLoading,\n                  Empty: EmojiPickerEmpty,\n                  Error: EmojiPickerError,\n                  CategoryHeader: EmojiPickerCategoryHeader,\n                  Grid: EmojiPickerGrid,\n                  Row: EmojiPickerRow,\n                  Emoji: EmojiPickerEmoji,\n                }}\n              />\n            </EmojiPickerPrimitive.Root>\n          </PopoverPrimitive.Content>\n        </PopoverPrimitive.Portal>\n      </PopoverPrimitive.Root>\n    );\n  }\n);\n\nexport { PopoverTrigger as EmojiPickerTrigger } from \"@radix-ui/react-popover\";\n"],"names":["React","isOpen","EmojiPickerPrimitive.Root","EmojiPickerPrimitive.Search","EmojiPickerPrimitive.Content"],"mappings":"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"}

package/dist/components/internal/InboxNotificationThread.js

@@ -12,8 +12,6 @@ const INBOX_NOTIFICATION_THREAD_MAX_COMMENTS = 3;
 function InboxNotificationComment({
   comment,
   showHeader = true,
-  showAttachments = true,
-  showReactions = true,
   overrides: overrides$1,
   className,
   ...props
@@ -39,20 +37,14 @@ function InboxNotificationComment({
       Mention: Comment.CommentMention,
       Link: Comment.CommentNonInteractiveLink
     }
-  }), showReactions && comment.reactions.length > 0 && /* @__PURE__ */ React.createElement("div", {
+  }), comment.reactions.length > 0 && /* @__PURE__ */ React.createElement("div", {
     className: "lb-comment-reactions"
   }, comment.reactions.map((reaction) => /* @__PURE__ */ React.createElement(Comment.CommentNonInteractiveReaction, {
     key: reaction.emoji,
     reaction,
     overrides: overrides$1,
     disabled: true
-  }))), showAttachments && comment.attachments.length > 0 ? /* @__PURE__ */ React.createElement("div", {
-    className: "lb-comment-attachments"
-  }, comment.attachments.map((attachment) => /* @__PURE__ */ React.createElement(Comment.CommentNonInteractiveFileAttachment, {
-    key: attachment.id,
-    attachment,
-    overrides: overrides$1
-  }))) : null) : /* @__PURE__ */ React.createElement("div", {
+  })))) : /* @__PURE__ */ React.createElement("div", {
     className: "lb-comment-body"
   }, /* @__PURE__ */ React.createElement("p", {
     className: "lb-comment-deleted"

package/dist/components/internal/InboxNotificationThread.js.map

@@ -1 +1 @@
-{"version":3,"file":"InboxNotificationThread.js","sources":["../../../src/components/internal/InboxNotificationThread.tsx"],"sourcesContent":["import type {\n  BaseMetadata,\n  CommentData,\n  InboxNotificationThreadData,\n  ThreadData,\n} from \"@liveblocks/core\";\nimport { getMentionedIdsFromCommentBody } from \"@liveblocks/core\";\nimport type { ComponentProps } from \"react\";\nimport React from \"react\";\n\nimport {\n  type CommentOverrides,\n  type GlobalOverrides,\n  useOverrides,\n} from \"../../overrides\";\nimport * as CommentPrimitive from \"../../primitives/Comment\";\nimport { classNames } from \"../../utils/class-names\";\nimport {\n  CommentMention,\n  CommentNonInteractiveFileAttachment,\n  CommentNonInteractiveLink,\n  CommentNonInteractiveReaction,\n} from \"../Comment\";\nimport { User } from \"./User\";\n\ntype InboxNotificationThreadCommentsContents = {\n  type: \"comments\";\n  unread: boolean;\n  comments: CommentData[];\n  userIds: string[];\n  date: Date;\n};\n\ntype InboxNotificationThreadMentionContents = {\n  type: \"mention\";\n  unread: boolean;\n  comments: CommentData[];\n  userIds: string[];\n  date: Date;\n};\n\nexport const INBOX_NOTIFICATION_THREAD_MAX_COMMENTS = 3;\n\ntype InboxNotificationThreadContents =\n  | InboxNotificationThreadCommentsContents\n  | InboxNotificationThreadMentionContents;\n\ninterface InboxNotificationCommentProps extends ComponentProps<\"div\"> {\n  comment: CommentData;\n  showHeader?: boolean;\n  showAttachments?: boolean;\n  showReactions?: boolean;\n  overrides?: Partial<GlobalOverrides & CommentOverrides>;\n}\n\nexport function InboxNotificationComment({\n  comment,\n  showHeader = true,\n  showAttachments = true,\n  showReactions = true,\n  overrides,\n  className,\n  ...props\n}: InboxNotificationCommentProps) {\n  const $ = useOverrides(overrides);\n\n  return (\n    <div\n      className={classNames(\n        \"lb-root lb-inbox-notification-comment lb-comment\",\n        className\n      )}\n      {...props}\n    >\n      {showHeader && (\n        <div className=\"lb-comment-header\">\n          <User className=\"lb-comment-author\" userId={comment.userId} />\n        </div>\n      )}\n      <div className=\"lb-comment-content\">\n        {comment.body ? (\n          <>\n            <CommentPrimitive.Body\n              className=\"lb-comment-body\"\n              body={comment.body}\n              components={{\n                Mention: CommentMention,\n                Link: CommentNonInteractiveLink,\n              }}\n            />\n            {showReactions && comment.reactions.length > 0 && (\n              <div className=\"lb-comment-reactions\">\n                {comment.reactions.map((reaction) => (\n                  <CommentNonInteractiveReaction\n                    key={reaction.emoji}\n                    reaction={reaction}\n                    overrides={overrides}\n                    disabled\n                  />\n                ))}\n              </div>\n            )}\n            {showAttachments && comment.attachments.length > 0 ? (\n              <div className=\"lb-comment-attachments\">\n                {comment.attachments.map((attachment) => (\n                  <CommentNonInteractiveFileAttachment\n                    key={attachment.id}\n                    attachment={attachment}\n                    overrides={overrides}\n                  />\n                ))}\n              </div>\n            ) : null}\n          </>\n        ) : (\n          <div className=\"lb-comment-body\">\n            <p className=\"lb-comment-deleted\">{$.COMMENT_DELETED}</p>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\n/**\n * Find the last comment with a mention for the given user ID,\n * unless the comment was created by the user themselves.\n */\nfunction findLastCommentWithMentionedId(\n  comments: CommentData[],\n  mentionedId: string\n) {\n  for (let i = comments.length - 1; i >= 0; i--) {\n    const comment = comments[i];\n\n    if (comment.userId === mentionedId) {\n      continue;\n    }\n\n    if (comment.body) {\n      const mentionedIds = getMentionedIdsFromCommentBody(comment.body);\n\n      if (mentionedIds.includes(mentionedId)) {\n        return comment;\n      }\n    }\n  }\n\n  return;\n}\n\nfunction getUserIdsFromComments(comments: CommentData[]) {\n  return Array.from(new Set(comments.map((comment) => comment.userId)));\n}\n\nexport function generateInboxNotificationThreadContents(\n  inboxNotification: InboxNotificationThreadData,\n  thread: ThreadData<BaseMetadata>,\n  userId: string\n): InboxNotificationThreadContents {\n  const unreadComments = thread.comments.filter((comment) => {\n    if (!comment.body) {\n      return false;\n    }\n\n    return inboxNotification.readAt\n      ? comment.createdAt > inboxNotification.readAt &&\n          comment.createdAt <= inboxNotification.notifiedAt\n      : comment.createdAt <= inboxNotification.notifiedAt;\n  });\n\n  // If the thread is read, show the last comments.\n  if (unreadComments.length === 0) {\n    const lastComments = thread.comments\n      .filter((comment) => comment.body)\n      .slice(-INBOX_NOTIFICATION_THREAD_MAX_COMMENTS);\n\n    return {\n      type: \"comments\",\n      unread: false,\n      comments: lastComments,\n      userIds: getUserIdsFromComments(lastComments),\n      date: inboxNotification.notifiedAt,\n    };\n  }\n\n  const commentWithMention = findLastCommentWithMentionedId(\n    unreadComments,\n    userId\n  );\n\n  // If the thread contains one or more mentions for the current user, show the last comment with a mention.\n  if (commentWithMention) {\n    return {\n      type: \"mention\",\n      unread: true,\n      comments: [commentWithMention],\n      userIds: [commentWithMention.userId],\n      date: commentWithMention.createdAt,\n    };\n  }\n\n  const lastUnreadComments = unreadComments.slice(\n    -INBOX_NOTIFICATION_THREAD_MAX_COMMENTS\n  );\n\n  // Otherwise, show the last unread comments.\n  return {\n    type: \"comments\",\n    unread: true,\n    comments: lastUnreadComments,\n    userIds: getUserIdsFromComments(unreadComments),\n    date: inboxNotification.notifiedAt,\n  };\n}\n"],"names":["overrides","useOverrides","classNames","User","CommentPrimitive.Body","CommentMention","CommentNonInteractiveLink","CommentNonInteractiveReaction","CommentNonInteractiveFileAttachment","getMentionedIdsFromCommentBody"],"mappings":"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"}
+{"version":3,"file":"InboxNotificationThread.js","sources":["../../../src/components/internal/InboxNotificationThread.tsx"],"sourcesContent":["import type {\n  BaseMetadata,\n  CommentData,\n  InboxNotificationThreadData,\n  ThreadData,\n} from \"@liveblocks/core\";\nimport { getMentionedIdsFromCommentBody } from \"@liveblocks/core\";\nimport type { ComponentProps } from \"react\";\nimport React from \"react\";\n\nimport {\n  type CommentOverrides,\n  type GlobalOverrides,\n  useOverrides,\n} from \"../../overrides\";\nimport * as CommentPrimitive from \"../../primitives/Comment\";\nimport { classNames } from \"../../utils/class-names\";\nimport {\n  CommentMention,\n  CommentNonInteractiveLink,\n  CommentNonInteractiveReaction,\n} from \"../Comment\";\nimport { User } from \"./User\";\n\ntype InboxNotificationThreadCommentsContents = {\n  type: \"comments\";\n  unread: boolean;\n  comments: CommentData[];\n  userIds: string[];\n  date: Date;\n};\n\ntype InboxNotificationThreadMentionContents = {\n  type: \"mention\";\n  unread: boolean;\n  comments: CommentData[];\n  userIds: string[];\n  date: Date;\n};\n\nexport const INBOX_NOTIFICATION_THREAD_MAX_COMMENTS = 3;\n\ntype InboxNotificationThreadContents =\n  | InboxNotificationThreadCommentsContents\n  | InboxNotificationThreadMentionContents;\n\ninterface InboxNotificationCommentProps extends ComponentProps<\"div\"> {\n  comment: CommentData;\n  showHeader?: boolean;\n  overrides?: Partial<GlobalOverrides & CommentOverrides>;\n}\n\nexport function InboxNotificationComment({\n  comment,\n  showHeader = true,\n  overrides,\n  className,\n  ...props\n}: InboxNotificationCommentProps) {\n  const $ = useOverrides(overrides);\n\n  return (\n    <div\n      className={classNames(\n        \"lb-root lb-inbox-notification-comment lb-comment\",\n        className\n      )}\n      {...props}\n    >\n      {showHeader && (\n        <div className=\"lb-comment-header\">\n          <User className=\"lb-comment-author\" userId={comment.userId} />\n        </div>\n      )}\n      <div className=\"lb-comment-content\">\n        {comment.body ? (\n          <>\n            <CommentPrimitive.Body\n              className=\"lb-comment-body\"\n              body={comment.body}\n              components={{\n                Mention: CommentMention,\n                Link: CommentNonInteractiveLink,\n              }}\n            />\n            {comment.reactions.length > 0 && (\n              <div className=\"lb-comment-reactions\">\n                {comment.reactions.map((reaction) => (\n                  <CommentNonInteractiveReaction\n                    key={reaction.emoji}\n                    reaction={reaction}\n                    overrides={overrides}\n                    disabled\n                  />\n                ))}\n              </div>\n            )}\n          </>\n        ) : (\n          <div className=\"lb-comment-body\">\n            <p className=\"lb-comment-deleted\">{$.COMMENT_DELETED}</p>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\n/**\n * Find the last comment with a mention for the given user ID,\n * unless the comment was created by the user themselves.\n */\nfunction findLastCommentWithMentionedId(\n  comments: CommentData[],\n  mentionedId: string\n) {\n  for (let i = comments.length - 1; i >= 0; i--) {\n    const comment = comments[i];\n\n    if (comment.userId === mentionedId) {\n      continue;\n    }\n\n    if (comment.body) {\n      const mentionedIds = getMentionedIdsFromCommentBody(comment.body);\n\n      if (mentionedIds.includes(mentionedId)) {\n        return comment;\n      }\n    }\n  }\n\n  return;\n}\n\nfunction getUserIdsFromComments(comments: CommentData[]) {\n  return Array.from(new Set(comments.map((comment) => comment.userId)));\n}\n\nexport function generateInboxNotificationThreadContents(\n  inboxNotification: InboxNotificationThreadData,\n  thread: ThreadData<BaseMetadata>,\n  userId: string\n): InboxNotificationThreadContents {\n  const unreadComments = thread.comments.filter((comment) => {\n    if (!comment.body) {\n      return false;\n    }\n\n    return inboxNotification.readAt\n      ? comment.createdAt > inboxNotification.readAt &&\n          comment.createdAt <= inboxNotification.notifiedAt\n      : comment.createdAt <= inboxNotification.notifiedAt;\n  });\n\n  // If the thread is read, show the last comments.\n  if (unreadComments.length === 0) {\n    const lastComments = thread.comments\n      .filter((comment) => comment.body)\n      .slice(-INBOX_NOTIFICATION_THREAD_MAX_COMMENTS);\n\n    return {\n      type: \"comments\",\n      unread: false,\n      comments: lastComments,\n      userIds: getUserIdsFromComments(lastComments),\n      date: inboxNotification.notifiedAt,\n    };\n  }\n\n  const commentWithMention = findLastCommentWithMentionedId(\n    unreadComments,\n    userId\n  );\n\n  // If the thread contains one or more mentions for the current user, show the last comment with a mention.\n  if (commentWithMention) {\n    return {\n      type: \"mention\",\n      unread: true,\n      comments: [commentWithMention],\n      userIds: [commentWithMention.userId],\n      date: commentWithMention.createdAt,\n    };\n  }\n\n  const lastUnreadComments = unreadComments.slice(\n    -INBOX_NOTIFICATION_THREAD_MAX_COMMENTS\n  );\n\n  // Otherwise, show the last unread comments.\n  return {\n    type: \"comments\",\n    unread: true,\n    comments: lastUnreadComments,\n    userIds: getUserIdsFromComments(unreadComments),\n    date: inboxNotification.notifiedAt,\n  };\n}\n"],"names":["overrides","useOverrides","classNames","User","CommentPrimitive.Body","CommentMention","CommentNonInteractiveLink","CommentNonInteractiveReaction","getMentionedIdsFromCommentBody"],"mappings":"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"}

package/dist/components/internal/InboxNotificationThread.mjs

@@ -3,15 +3,13 @@ import React__default from 'react';
 import { useOverrides } from '../../overrides.mjs';
 import { Body as CommentBody } from '../../primitives/Comment/index.mjs';
 import { classNames } from '../../utils/class-names.mjs';
-import { CommentMention, CommentNonInteractiveLink, CommentNonInteractiveReaction, CommentNonInteractiveFileAttachment } from '../Comment.mjs';
+import { CommentMention, CommentNonInteractiveLink, CommentNonInteractiveReaction } from '../Comment.mjs';
 import { User } from './User.mjs';
 
 const INBOX_NOTIFICATION_THREAD_MAX_COMMENTS = 3;
 function InboxNotificationComment({
   comment,
   showHeader = true,
-  showAttachments = true,
-  showReactions = true,
   overrides,
   className,
   ...props
@@ -37,20 +35,14 @@ function InboxNotificationComment({
       Mention: CommentMention,
       Link: CommentNonInteractiveLink
     }
-  }), showReactions && comment.reactions.length > 0 && /* @__PURE__ */ React__default.createElement("div", {
+  }), comment.reactions.length > 0 && /* @__PURE__ */ React__default.createElement("div", {
     className: "lb-comment-reactions"
   }, comment.reactions.map((reaction) => /* @__PURE__ */ React__default.createElement(CommentNonInteractiveReaction, {
     key: reaction.emoji,
     reaction,
     overrides,
     disabled: true
-  }))), showAttachments && comment.attachments.length > 0 ? /* @__PURE__ */ React__default.createElement("div", {
-    className: "lb-comment-attachments"
-  }, comment.attachments.map((attachment) => /* @__PURE__ */ React__default.createElement(CommentNonInteractiveFileAttachment, {
-    key: attachment.id,
-    attachment,
-    overrides
-  }))) : null) : /* @__PURE__ */ React__default.createElement("div", {
+  })))) : /* @__PURE__ */ React__default.createElement("div", {
     className: "lb-comment-body"
   }, /* @__PURE__ */ React__default.createElement("p", {
     className: "lb-comment-deleted"

package/dist/components/internal/InboxNotificationThread.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"InboxNotificationThread.mjs","sources":["../../../src/components/internal/InboxNotificationThread.tsx"],"sourcesContent":["import type {\n  BaseMetadata,\n  CommentData,\n  InboxNotificationThreadData,\n  ThreadData,\n} from \"@liveblocks/core\";\nimport { getMentionedIdsFromCommentBody } from \"@liveblocks/core\";\nimport type { ComponentProps } from \"react\";\nimport React from \"react\";\n\nimport {\n  type CommentOverrides,\n  type GlobalOverrides,\n  useOverrides,\n} from \"../../overrides\";\nimport * as CommentPrimitive from \"../../primitives/Comment\";\nimport { classNames } from \"../../utils/class-names\";\nimport {\n  CommentMention,\n  CommentNonInteractiveFileAttachment,\n  CommentNonInteractiveLink,\n  CommentNonInteractiveReaction,\n} from \"../Comment\";\nimport { User } from \"./User\";\n\ntype InboxNotificationThreadCommentsContents = {\n  type: \"comments\";\n  unread: boolean;\n  comments: CommentData[];\n  userIds: string[];\n  date: Date;\n};\n\ntype InboxNotificationThreadMentionContents = {\n  type: \"mention\";\n  unread: boolean;\n  comments: CommentData[];\n  userIds: string[];\n  date: Date;\n};\n\nexport const INBOX_NOTIFICATION_THREAD_MAX_COMMENTS = 3;\n\ntype InboxNotificationThreadContents =\n  | InboxNotificationThreadCommentsContents\n  | InboxNotificationThreadMentionContents;\n\ninterface InboxNotificationCommentProps extends ComponentProps<\"div\"> {\n  comment: CommentData;\n  showHeader?: boolean;\n  showAttachments?: boolean;\n  showReactions?: boolean;\n  overrides?: Partial<GlobalOverrides & CommentOverrides>;\n}\n\nexport function InboxNotificationComment({\n  comment,\n  showHeader = true,\n  showAttachments = true,\n  showReactions = true,\n  overrides,\n  className,\n  ...props\n}: InboxNotificationCommentProps) {\n  const $ = useOverrides(overrides);\n\n  return (\n    <div\n      className={classNames(\n        \"lb-root lb-inbox-notification-comment lb-comment\",\n        className\n      )}\n      {...props}\n    >\n      {showHeader && (\n        <div className=\"lb-comment-header\">\n          <User className=\"lb-comment-author\" userId={comment.userId} />\n        </div>\n      )}\n      <div className=\"lb-comment-content\">\n        {comment.body ? (\n          <>\n            <CommentPrimitive.Body\n              className=\"lb-comment-body\"\n              body={comment.body}\n              components={{\n                Mention: CommentMention,\n                Link: CommentNonInteractiveLink,\n              }}\n            />\n            {showReactions && comment.reactions.length > 0 && (\n              <div className=\"lb-comment-reactions\">\n                {comment.reactions.map((reaction) => (\n                  <CommentNonInteractiveReaction\n                    key={reaction.emoji}\n                    reaction={reaction}\n                    overrides={overrides}\n                    disabled\n                  />\n                ))}\n              </div>\n            )}\n            {showAttachments && comment.attachments.length > 0 ? (\n              <div className=\"lb-comment-attachments\">\n                {comment.attachments.map((attachment) => (\n                  <CommentNonInteractiveFileAttachment\n                    key={attachment.id}\n                    attachment={attachment}\n                    overrides={overrides}\n                  />\n                ))}\n              </div>\n            ) : null}\n          </>\n        ) : (\n          <div className=\"lb-comment-body\">\n            <p className=\"lb-comment-deleted\">{$.COMMENT_DELETED}</p>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\n/**\n * Find the last comment with a mention for the given user ID,\n * unless the comment was created by the user themselves.\n */\nfunction findLastCommentWithMentionedId(\n  comments: CommentData[],\n  mentionedId: string\n) {\n  for (let i = comments.length - 1; i >= 0; i--) {\n    const comment = comments[i];\n\n    if (comment.userId === mentionedId) {\n      continue;\n    }\n\n    if (comment.body) {\n      const mentionedIds = getMentionedIdsFromCommentBody(comment.body);\n\n      if (mentionedIds.includes(mentionedId)) {\n        return comment;\n      }\n    }\n  }\n\n  return;\n}\n\nfunction getUserIdsFromComments(comments: CommentData[]) {\n  return Array.from(new Set(comments.map((comment) => comment.userId)));\n}\n\nexport function generateInboxNotificationThreadContents(\n  inboxNotification: InboxNotificationThreadData,\n  thread: ThreadData<BaseMetadata>,\n  userId: string\n): InboxNotificationThreadContents {\n  const unreadComments = thread.comments.filter((comment) => {\n    if (!comment.body) {\n      return false;\n    }\n\n    return inboxNotification.readAt\n      ? comment.createdAt > inboxNotification.readAt &&\n          comment.createdAt <= inboxNotification.notifiedAt\n      : comment.createdAt <= inboxNotification.notifiedAt;\n  });\n\n  // If the thread is read, show the last comments.\n  if (unreadComments.length === 0) {\n    const lastComments = thread.comments\n      .filter((comment) => comment.body)\n      .slice(-INBOX_NOTIFICATION_THREAD_MAX_COMMENTS);\n\n    return {\n      type: \"comments\",\n      unread: false,\n      comments: lastComments,\n      userIds: getUserIdsFromComments(lastComments),\n      date: inboxNotification.notifiedAt,\n    };\n  }\n\n  const commentWithMention = findLastCommentWithMentionedId(\n    unreadComments,\n    userId\n  );\n\n  // If the thread contains one or more mentions for the current user, show the last comment with a mention.\n  if (commentWithMention) {\n    return {\n      type: \"mention\",\n      unread: true,\n      comments: [commentWithMention],\n      userIds: [commentWithMention.userId],\n      date: commentWithMention.createdAt,\n    };\n  }\n\n  const lastUnreadComments = unreadComments.slice(\n    -INBOX_NOTIFICATION_THREAD_MAX_COMMENTS\n  );\n\n  // Otherwise, show the last unread comments.\n  return {\n    type: \"comments\",\n    unread: true,\n    comments: lastUnreadComments,\n    userIds: getUserIdsFromComments(unreadComments),\n    date: inboxNotification.notifiedAt,\n  };\n}\n"],"names":["React","CommentPrimitive.Body"],"mappings":"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"}
+{"version":3,"file":"InboxNotificationThread.mjs","sources":["../../../src/components/internal/InboxNotificationThread.tsx"],"sourcesContent":["import type {\n  BaseMetadata,\n  CommentData,\n  InboxNotificationThreadData,\n  ThreadData,\n} from \"@liveblocks/core\";\nimport { getMentionedIdsFromCommentBody } from \"@liveblocks/core\";\nimport type { ComponentProps } from \"react\";\nimport React from \"react\";\n\nimport {\n  type CommentOverrides,\n  type GlobalOverrides,\n  useOverrides,\n} from \"../../overrides\";\nimport * as CommentPrimitive from \"../../primitives/Comment\";\nimport { classNames } from \"../../utils/class-names\";\nimport {\n  CommentMention,\n  CommentNonInteractiveLink,\n  CommentNonInteractiveReaction,\n} from \"../Comment\";\nimport { User } from \"./User\";\n\ntype InboxNotificationThreadCommentsContents = {\n  type: \"comments\";\n  unread: boolean;\n  comments: CommentData[];\n  userIds: string[];\n  date: Date;\n};\n\ntype InboxNotificationThreadMentionContents = {\n  type: \"mention\";\n  unread: boolean;\n  comments: CommentData[];\n  userIds: string[];\n  date: Date;\n};\n\nexport const INBOX_NOTIFICATION_THREAD_MAX_COMMENTS = 3;\n\ntype InboxNotificationThreadContents =\n  | InboxNotificationThreadCommentsContents\n  | InboxNotificationThreadMentionContents;\n\ninterface InboxNotificationCommentProps extends ComponentProps<\"div\"> {\n  comment: CommentData;\n  showHeader?: boolean;\n  overrides?: Partial<GlobalOverrides & CommentOverrides>;\n}\n\nexport function InboxNotificationComment({\n  comment,\n  showHeader = true,\n  overrides,\n  className,\n  ...props\n}: InboxNotificationCommentProps) {\n  const $ = useOverrides(overrides);\n\n  return (\n    <div\n      className={classNames(\n        \"lb-root lb-inbox-notification-comment lb-comment\",\n        className\n      )}\n      {...props}\n    >\n      {showHeader && (\n        <div className=\"lb-comment-header\">\n          <User className=\"lb-comment-author\" userId={comment.userId} />\n        </div>\n      )}\n      <div className=\"lb-comment-content\">\n        {comment.body ? (\n          <>\n            <CommentPrimitive.Body\n              className=\"lb-comment-body\"\n              body={comment.body}\n              components={{\n                Mention: CommentMention,\n                Link: CommentNonInteractiveLink,\n              }}\n            />\n            {comment.reactions.length > 0 && (\n              <div className=\"lb-comment-reactions\">\n                {comment.reactions.map((reaction) => (\n                  <CommentNonInteractiveReaction\n                    key={reaction.emoji}\n                    reaction={reaction}\n                    overrides={overrides}\n                    disabled\n                  />\n                ))}\n              </div>\n            )}\n          </>\n        ) : (\n          <div className=\"lb-comment-body\">\n            <p className=\"lb-comment-deleted\">{$.COMMENT_DELETED}</p>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\n/**\n * Find the last comment with a mention for the given user ID,\n * unless the comment was created by the user themselves.\n */\nfunction findLastCommentWithMentionedId(\n  comments: CommentData[],\n  mentionedId: string\n) {\n  for (let i = comments.length - 1; i >= 0; i--) {\n    const comment = comments[i];\n\n    if (comment.userId === mentionedId) {\n      continue;\n    }\n\n    if (comment.body) {\n      const mentionedIds = getMentionedIdsFromCommentBody(comment.body);\n\n      if (mentionedIds.includes(mentionedId)) {\n        return comment;\n      }\n    }\n  }\n\n  return;\n}\n\nfunction getUserIdsFromComments(comments: CommentData[]) {\n  return Array.from(new Set(comments.map((comment) => comment.userId)));\n}\n\nexport function generateInboxNotificationThreadContents(\n  inboxNotification: InboxNotificationThreadData,\n  thread: ThreadData<BaseMetadata>,\n  userId: string\n): InboxNotificationThreadContents {\n  const unreadComments = thread.comments.filter((comment) => {\n    if (!comment.body) {\n      return false;\n    }\n\n    return inboxNotification.readAt\n      ? comment.createdAt > inboxNotification.readAt &&\n          comment.createdAt <= inboxNotification.notifiedAt\n      : comment.createdAt <= inboxNotification.notifiedAt;\n  });\n\n  // If the thread is read, show the last comments.\n  if (unreadComments.length === 0) {\n    const lastComments = thread.comments\n      .filter((comment) => comment.body)\n      .slice(-INBOX_NOTIFICATION_THREAD_MAX_COMMENTS);\n\n    return {\n      type: \"comments\",\n      unread: false,\n      comments: lastComments,\n      userIds: getUserIdsFromComments(lastComments),\n      date: inboxNotification.notifiedAt,\n    };\n  }\n\n  const commentWithMention = findLastCommentWithMentionedId(\n    unreadComments,\n    userId\n  );\n\n  // If the thread contains one or more mentions for the current user, show the last comment with a mention.\n  if (commentWithMention) {\n    return {\n      type: \"mention\",\n      unread: true,\n      comments: [commentWithMention],\n      userIds: [commentWithMention.userId],\n      date: commentWithMention.createdAt,\n    };\n  }\n\n  const lastUnreadComments = unreadComments.slice(\n    -INBOX_NOTIFICATION_THREAD_MAX_COMMENTS\n  );\n\n  // Otherwise, show the last unread comments.\n  return {\n    type: \"comments\",\n    unread: true,\n    comments: lastUnreadComments,\n    userIds: getUserIdsFromComments(unreadComments),\n    date: inboxNotification.notifiedAt,\n  };\n}\n"],"names":["React","CommentPrimitive.Body"],"mappings":"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"}

package/dist/components/internal/User.js

@@ -5,31 +5,15 @@ var react = require('@liveblocks/react');
 var React = require('react');
 var overrides = require('../../overrides.js');
 var shared = require('../../shared.js');
-var capitalize = require('../../utils/capitalize.js');
 var classNames = require('../../utils/class-names.js');
 
-function User({
-  userId,
-  replaceSelf,
-  capitalize: shouldCapitalize,
-  className,
-  ...props
-}) {
+function User({ userId, replaceSelf, className, ...props }) {
   const currentId = shared.useCurrentUserId();
   const { user, isLoading } = react.useUser(userId);
   const $ = overrides.useOverrides();
   const resolvedUserName = React.useMemo(() => {
-    const name = replaceSelf && currentId === userId ? $.USER_SELF : user?.name ?? $.USER_UNKNOWN;
-    return shouldCapitalize ? capitalize.capitalize(name) : name;
-  }, [
-    replaceSelf,
-    currentId,
-    userId,
-    $.USER_SELF,
-    $.USER_UNKNOWN,
-    user?.name,
-    shouldCapitalize
-  ]);
+    return replaceSelf && currentId === userId ? $.USER_SELF : user?.name ?? $.USER_UNKNOWN;
+  }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);
   return /* @__PURE__ */ React.createElement("span", {
     className: classNames.classNames("lb-name lb-user", className),
     "data-loading": isLoading ? "" : void 0,

package/dist/components/internal/User.js.map

@@ -1 +1 @@
-{"version":3,"file":"User.js","sources":["../../../src/components/internal/User.tsx"],"sourcesContent":["\"use client\";\n\nimport { useUser } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport React, { useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport { useCurrentUserId } from \"../../shared\";\nimport { capitalize } from \"../../utils/capitalize\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface UserProps extends ComponentProps<\"span\"> {\n  /**\n   * The user ID to display the user name for.\n   */\n  userId: string;\n\n  /**\n   * Whether to replace the user name with \"you\" ($.USER_SELF) for the current user.\n   */\n  replaceSelf?: boolean;\n\n  /**\n   * Whether to capitalize the user name.\n   */\n  capitalize?: boolean;\n}\n\nexport function User({\n  userId,\n  replaceSelf,\n  capitalize: shouldCapitalize,\n  className,\n  ...props\n}: UserProps) {\n  const currentId = useCurrentUserId();\n  const { user, isLoading } = useUser(userId);\n  const $ = useOverrides();\n  const resolvedUserName = useMemo(() => {\n    const name =\n      replaceSelf && currentId === userId\n        ? $.USER_SELF\n        : user?.name ?? $.USER_UNKNOWN;\n\n    return shouldCapitalize ? capitalize(name) : name;\n  }, [\n    replaceSelf,\n    currentId,\n    userId,\n    $.USER_SELF,\n    $.USER_UNKNOWN,\n    user?.name,\n    shouldCapitalize,\n  ]);\n\n  return (\n    <span\n      className={classNames(\"lb-name lb-user\", className)}\n      data-loading={isLoading ? \"\" : undefined}\n      {...props}\n    >\n      {isLoading ? null : resolvedUserName}\n    </span>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;AA4BO;AAAc;AACnB;AACA;AACY;AACZ;AAEF;AACE;AACA;AACA;AACA;AACE;AAKA;AAA6C;AAC5C;AACD;AACA;AACA;AACE;AACA;AACI;AACN;AAGF;AACG;AACmD;AACnB;AAC3B;AAKV;;"}
+{"version":3,"file":"User.js","sources":["../../../src/components/internal/User.tsx"],"sourcesContent":["\"use client\";\n\nimport { useUser } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport React, { useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport { useCurrentUserId } from \"../../shared\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface UserProps extends ComponentProps<\"span\"> {\n  /**\n   * The user ID to display the user name for.\n   */\n  userId: string;\n\n  /**\n   * Whether to replace the user name with \"you\" ($.USER_SELF) for the current user.\n   */\n  replaceSelf?: boolean;\n}\n\nexport function User({ userId, replaceSelf, className, ...props }: UserProps) {\n  const currentId = useCurrentUserId();\n  const { user, isLoading } = useUser(userId);\n  const $ = useOverrides();\n  const resolvedUserName = useMemo(() => {\n    return replaceSelf && currentId === userId\n      ? $.USER_SELF\n      : user?.name ?? $.USER_UNKNOWN;\n  }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);\n\n  return (\n    <span\n      className={classNames(\"lb-name lb-user\", className)}\n      data-loading={isLoading ? \"\" : undefined}\n      {...props}\n    >\n      {isLoading ? null : resolvedUserName}\n    </span>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;AAsBO;AACL;AACA;AACA;AACA;AACE;AAEoB;AAGtB;AACG;AACmD;AACnB;AAC3B;AAKV;;"}

package/dist/components/internal/User.mjs

@@ -3,31 +3,15 @@ import { useUser } from '@liveblocks/react';
 import React__default, { useMemo } from 'react';
 import { useOverrides } from '../../overrides.mjs';
 import { useCurrentUserId } from '../../shared.mjs';
-import { capitalize } from '../../utils/capitalize.mjs';
 import { classNames } from '../../utils/class-names.mjs';
 
-function User({
-  userId,
-  replaceSelf,
-  capitalize: shouldCapitalize,
-  className,
-  ...props
-}) {
+function User({ userId, replaceSelf, className, ...props }) {
   const currentId = useCurrentUserId();
   const { user, isLoading } = useUser(userId);
   const $ = useOverrides();
   const resolvedUserName = useMemo(() => {
-    const name = replaceSelf && currentId === userId ? $.USER_SELF : user?.name ?? $.USER_UNKNOWN;
-    return shouldCapitalize ? capitalize(name) : name;
-  }, [
-    replaceSelf,
-    currentId,
-    userId,
-    $.USER_SELF,
-    $.USER_UNKNOWN,
-    user?.name,
-    shouldCapitalize
-  ]);
+    return replaceSelf && currentId === userId ? $.USER_SELF : user?.name ?? $.USER_UNKNOWN;
+  }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);
   return /* @__PURE__ */ React__default.createElement("span", {
     className: classNames("lb-name lb-user", className),
     "data-loading": isLoading ? "" : void 0,

package/dist/components/internal/User.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"User.mjs","sources":["../../../src/components/internal/User.tsx"],"sourcesContent":["\"use client\";\n\nimport { useUser } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport React, { useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport { useCurrentUserId } from \"../../shared\";\nimport { capitalize } from \"../../utils/capitalize\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface UserProps extends ComponentProps<\"span\"> {\n  /**\n   * The user ID to display the user name for.\n   */\n  userId: string;\n\n  /**\n   * Whether to replace the user name with \"you\" ($.USER_SELF) for the current user.\n   */\n  replaceSelf?: boolean;\n\n  /**\n   * Whether to capitalize the user name.\n   */\n  capitalize?: boolean;\n}\n\nexport function User({\n  userId,\n  replaceSelf,\n  capitalize: shouldCapitalize,\n  className,\n  ...props\n}: UserProps) {\n  const currentId = useCurrentUserId();\n  const { user, isLoading } = useUser(userId);\n  const $ = useOverrides();\n  const resolvedUserName = useMemo(() => {\n    const name =\n      replaceSelf && currentId === userId\n        ? $.USER_SELF\n        : user?.name ?? $.USER_UNKNOWN;\n\n    return shouldCapitalize ? capitalize(name) : name;\n  }, [\n    replaceSelf,\n    currentId,\n    userId,\n    $.USER_SELF,\n    $.USER_UNKNOWN,\n    user?.name,\n    shouldCapitalize,\n  ]);\n\n  return (\n    <span\n      className={classNames(\"lb-name lb-user\", className)}\n      data-loading={isLoading ? \"\" : undefined}\n      {...props}\n    >\n      {isLoading ? null : resolvedUserName}\n    </span>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;AA4BO;AAAc;AACnB;AACA;AACY;AACZ;AAEF;AACE;AACA;AACA;AACA;AACE;AAKA;AAA6C;AAC5C;AACD;AACA;AACA;AACE;AACA;AACI;AACN;AAGF;AACG;AACmD;AACnB;AAC3B;AAKV;;"}
+{"version":3,"file":"User.mjs","sources":["../../../src/components/internal/User.tsx"],"sourcesContent":["\"use client\";\n\nimport { useUser } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport React, { useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport { useCurrentUserId } from \"../../shared\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface UserProps extends ComponentProps<\"span\"> {\n  /**\n   * The user ID to display the user name for.\n   */\n  userId: string;\n\n  /**\n   * Whether to replace the user name with \"you\" ($.USER_SELF) for the current user.\n   */\n  replaceSelf?: boolean;\n}\n\nexport function User({ userId, replaceSelf, className, ...props }: UserProps) {\n  const currentId = useCurrentUserId();\n  const { user, isLoading } = useUser(userId);\n  const $ = useOverrides();\n  const resolvedUserName = useMemo(() => {\n    return replaceSelf && currentId === userId\n      ? $.USER_SELF\n      : user?.name ?? $.USER_UNKNOWN;\n  }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);\n\n  return (\n    <span\n      className={classNames(\"lb-name lb-user\", className)}\n      data-loading={isLoading ? \"\" : undefined}\n      {...props}\n    >\n      {isLoading ? null : resolvedUserName}\n    </span>\n  );\n}\n"],"names":[],"mappings":";;;;;;;AAsBO;AACL;AACA;AACA;AACA;AACE;AAEoB;AAGtB;AACG;AACmD;AACnB;AAC3B;AAKV;;"}

package/dist/icons/ArrowUp.js

@@ -0,0 +1,15 @@
+'use strict';
+
+var React = require('react');
+var Icon = require('../components/internal/Icon.js');
+
+function ArrowUpIcon(props) {
+  return /* @__PURE__ */ React.createElement(Icon.Icon, {
+    ...props
+  }, /* @__PURE__ */ React.createElement("path", {
+    d: "M10 16V4m-6 6 6-6 6 6"
+  }));
+}
+
+exports.ArrowUpIcon = ArrowUpIcon;
+//# sourceMappingURL=ArrowUp.js.map

package/dist/icons/ArrowUp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArrowUp.js","sources":["../../src/icons/ArrowUp.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport React from \"react\";\n\nimport { Icon } from \"../components/internal/Icon\";\n\nexport function ArrowUpIcon(props: ComponentProps<\"svg\">) {\n  return (\n    <Icon {...props}>\n      <path d=\"M10 16V4m-6 6 6-6 6 6\" />\n    </Icon>\n  );\n}\n"],"names":["Icon"],"mappings":";;;;;AAKO,SAAS,YAAY,KAA8B,EAAA;AACxD,EAAA,uBACG,KAAA,CAAA,aAAA,CAAAA,SAAA,EAAA;AAAA,IAAM,GAAG,KAAA;AAAA,GAAA,kBACP,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAA,IAAK,CAAE,EAAA,uBAAA;AAAA,GAAwB,CAClC,CAAA,CAAA;AAEJ;;;;"}

package/dist/icons/ArrowUp.mjs

@@ -0,0 +1,13 @@
+import React__default from 'react';
+import { Icon } from '../components/internal/Icon.mjs';
+
+function ArrowUpIcon(props) {
+  return /* @__PURE__ */ React__default.createElement(Icon, {
+    ...props
+  }, /* @__PURE__ */ React__default.createElement("path", {
+    d: "M10 16V4m-6 6 6-6 6 6"
+  }));
+}
+
+export { ArrowUpIcon };
+//# sourceMappingURL=ArrowUp.mjs.map