@cognite/aura 0.3.4 → 1.46104.0

package/dist/components/ui/core/message/message.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/ui/core/message/message.tsx"],"sourcesContent":["import type {\n  ComponentProps,\n  HTMLAttributes,\n  ReactElement,\n  ReactNode,\n} from 'react';\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\n\nimport { mermaid as mermaidPlugin } from '@streamdown/mermaid';\nimport {\n  IconChevronLeft,\n  IconChevronRight,\n  IconPaperclip,\n  IconX,\n} from '@tabler/icons-react';\nimport type { JSX } from 'react/jsx-runtime';\nimport type { Components, ExtraProps } from 'streamdown';\nimport { Streamdown } from 'streamdown';\n\nimport type { FileUIPart, UIMessage } from '../../../../lib/ai/types';\nimport { cn, getInitials } from '../../../../lib/utils';\nimport {\n  Avatar,\n  AvatarFallback,\n  AvatarIcon,\n  AvatarImage,\n} from '../avatar/avatar';\nimport { Button } from '../button/button';\nimport { ButtonGroup, ButtonGroupText } from '../button-group/button-group';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '../tooltip/tooltip';\n\nimport { MESSAGE_RESPONSE_DEFAULT_STREAMDOWN_CONTROLS } from './message-response-default-streamdown-controls';\n\ntype MessageProps = HTMLAttributes<HTMLDivElement> & {\n  isResponse?: boolean;\n};\n\nconst Message = ({\n  className,\n  isResponse = false,\n  ...props\n}: MessageProps): ReactNode => (\n  <div\n    data-slot=\"message\"\n    className={cn(\n      'group flex w-full items-start justify-start gap-3 mb-0 py-3',\n      isResponse ? 'is-assistant items-start' : 'is-user flex-row-reverse',\n      className\n    )}\n    {...props}\n  />\n);\n\ntype MessageContentProps = HTMLAttributes<HTMLDivElement>;\n\nconst MessageContent = ({\n  children,\n  className,\n  ...props\n}: MessageContentProps): ReactNode => (\n  <div\n    data-slot=\"message-content\"\n    className={cn(\n      'is-user:dark flex flex-col gap-4 rounded-md text-base leading-tight tracking-tightest',\n      'max-w-4/5',\n      'group-[.is-user]:overflow-hidden group-[.is-user]:bg-medium-background group-[.is-user]:p-2 group-[.is-user]:text-base-foreground',\n      'group-[.is-assistant]:text-base-foreground group-[.is-assistant]:pt-1',\n      className\n    )}\n    {...props}\n  >\n    {children}\n  </div>\n);\n\ntype MessageAvatarProps = ComponentProps<typeof Avatar> & {\n  avatarUrl?: string;\n  name?: string;\n};\n\nconst MessageAvatar = ({\n  avatarUrl,\n  name,\n  className,\n  children,\n  variant,\n  sizes,\n  ...props\n}: MessageAvatarProps): ReactNode => {\n  const fallbackText = name ? getInitials(name) : 'ME';\n\n  return (\n    <Avatar\n      data-slot=\"message-avatar\"\n      className={cn('size-7 group-[.is-user]:mt-1', className)}\n      variant={variant}\n      sizes={sizes}\n      {...props}\n    >\n      {children || (\n        <>\n          {avatarUrl && (\n            <AvatarImage\n              alt={name || ''}\n              className=\"mt-0 mb-0\"\n              src={avatarUrl}\n            />\n          )}\n          <AvatarFallback>{fallbackText}</AvatarFallback>\n        </>\n      )}\n    </Avatar>\n  );\n};\n\ntype MessageAvatarIconProps = ComponentProps<typeof AvatarIcon>;\n\nconst MessageAvatarIcon = (props: MessageAvatarIconProps): ReactNode => (\n  <AvatarIcon data-slot=\"message-avatar-icon\" {...props} />\n);\n\ntype MessageActionsProps = ComponentProps<'div'>;\n\nconst MessageActions = ({\n  className,\n  children,\n  ...props\n}: MessageActionsProps): ReactNode => (\n  <div\n    data-slot=\"message-actions\"\n    className={cn('flex items-center gap-2 pt-2', className)}\n    {...props}\n  >\n    {children}\n  </div>\n);\n\ntype MessageActionProps = ComponentProps<typeof Button> & {\n  tooltip?: string;\n  label?: string;\n};\n\nconst MessageAction = ({\n  tooltip,\n  children,\n  label,\n  className,\n  variant = 'ghost',\n  size = 'sm',\n  ...props\n}: MessageActionProps): ReactNode => {\n  const button = (\n    <Button\n      data-slot=\"message-action\"\n      className={cn(\n        'relative icon-sm text-muted-foreground hover:text-base-foreground',\n        className\n      )}\n      size={size}\n      type=\"button\"\n      variant={variant}\n      {...props}\n    >\n      {children}\n      <span className=\"sr-only\">{label || tooltip}</span>\n    </Button>\n  );\n\n  if (tooltip) {\n    return (\n      <Tooltip>\n        <TooltipTrigger render={button} />\n        <TooltipContent>\n          <p>{tooltip}</p>\n        </TooltipContent>\n      </Tooltip>\n    );\n  }\n\n  return button;\n};\n\ntype MessageBranchContextType = {\n  currentBranch: number;\n  totalBranches: number;\n  goToPrevious: () => void;\n  goToNext: () => void;\n  branches: ReactElement[];\n  setBranches: (branches: ReactElement[]) => void;\n};\n\nconst MessageBranchContext = createContext<MessageBranchContextType | null>(\n  null\n);\n\nconst useMessageBranch = () => {\n  const context = useContext(MessageBranchContext);\n\n  if (!context) {\n    throw new Error(\n      'MessageBranch components must be used within MessageBranch'\n    );\n  }\n\n  return context;\n};\n\ntype MessageBranchProps = HTMLAttributes<HTMLDivElement> & {\n  defaultBranch?: number;\n  onBranchChange?: (branchIndex: number) => void;\n};\n\nconst MessageBranch = ({\n  defaultBranch = 0,\n  onBranchChange,\n  className,\n  ...props\n}: MessageBranchProps): ReactNode => {\n  const [currentBranch, setCurrentBranch] = useState(defaultBranch);\n  const [branches, setBranches] = useState<ReactElement[]>([]);\n\n  const goToPrevious = useCallback(() => {\n    setCurrentBranch((prev) => {\n      const newBranch = prev > 0 ? prev - 1 : branches.length - 1;\n      onBranchChange?.(newBranch);\n      return newBranch;\n    });\n  }, [branches.length, onBranchChange]);\n\n  const goToNext = useCallback(() => {\n    setCurrentBranch((prev) => {\n      const newBranch = prev < branches.length - 1 ? prev + 1 : 0;\n      onBranchChange?.(newBranch);\n      return newBranch;\n    });\n  }, [branches.length, onBranchChange]);\n\n  const contextValue = useMemo<MessageBranchContextType>(\n    () => ({\n      currentBranch,\n      totalBranches: branches.length,\n      goToPrevious,\n      goToNext,\n      branches,\n      setBranches,\n    }),\n    [currentBranch, branches, goToPrevious, goToNext, setBranches]\n  );\n\n  return (\n    <MessageBranchContext.Provider value={contextValue}>\n      <div\n        data-slot=\"message-branch\"\n        className={cn('grid w-full gap-2 [&>div]:pb-0', className)}\n        {...props}\n      />\n    </MessageBranchContext.Provider>\n  );\n};\n\ntype MessageBranchContentProps = HTMLAttributes<HTMLDivElement>;\n\nconst MessageBranchContent = ({\n  children,\n  ...props\n}: MessageBranchContentProps): ReactNode[] => {\n  const { currentBranch, setBranches, branches } = useMessageBranch();\n  const childrenArray = useMemo(\n    () => (Array.isArray(children) ? children : [children]),\n    [children]\n  );\n\n  useEffect(() => {\n    if (branches.length !== childrenArray.length) {\n      setBranches(childrenArray);\n    }\n  }, [childrenArray, branches, setBranches]);\n\n  return childrenArray.map((branch, index) => (\n    <div\n      data-slot=\"message-branch-content\"\n      className={cn(\n        'grid gap-2 overflow-hidden [&>div]:pb-0',\n        index === currentBranch ? 'block' : 'hidden'\n      )}\n      key={branch.key}\n      {...props}\n    >\n      {branch}\n    </div>\n  ));\n};\n\ntype MessageBranchSelectorProps = HTMLAttributes<HTMLDivElement> & {\n  from: UIMessage['role'];\n};\n\nconst MessageBranchSelector = ({\n  ...props\n}: MessageBranchSelectorProps): ReactNode => {\n  const { totalBranches } = useMessageBranch();\n\n  if (totalBranches <= 1) {\n    return null;\n  }\n\n  return (\n    <ButtonGroup\n      data-slot=\"message-branch-selector\"\n      className=\"[&>*:not(:first-child)]:rounded-l-md [&>*:not(:last-child)]:rounded-r-md\"\n      orientation=\"horizontal\"\n      {...props}\n    />\n  );\n};\n\ntype MessageBranchPreviousProps = ComponentProps<typeof Button>;\n\nconst MessageBranchPrevious = ({\n  children,\n  ...props\n}: MessageBranchPreviousProps): ReactNode => {\n  const { goToPrevious, totalBranches } = useMessageBranch();\n\n  return (\n    <Button\n      data-slot=\"message-branch-previous\"\n      aria-label=\"Previous branch\"\n      disabled={totalBranches <= 1}\n      onClick={goToPrevious}\n      size=\"icon-sm\"\n      type=\"button\"\n      variant=\"ghost\"\n      {...props}\n    >\n      {children ?? <IconChevronLeft size={14} />}\n    </Button>\n  );\n};\n\ntype MessageBranchNextProps = ComponentProps<typeof Button>;\n\nconst MessageBranchNext = ({\n  children,\n  ...props\n}: MessageBranchNextProps): ReactNode => {\n  const { goToNext, totalBranches } = useMessageBranch();\n\n  return (\n    <Button\n      data-slot=\"message-branch-next\"\n      aria-label=\"Next branch\"\n      disabled={totalBranches <= 1}\n      onClick={goToNext}\n      size=\"icon-sm\"\n      type=\"button\"\n      variant=\"ghost\"\n      {...props}\n    >\n      {children ?? <IconChevronRight size={14} />}\n    </Button>\n  );\n};\n\ntype MessageBranchPageProps = HTMLAttributes<HTMLSpanElement>;\n\nconst MessageBranchPage = ({\n  className,\n  ...props\n}: MessageBranchPageProps): ReactNode => {\n  const { currentBranch, totalBranches } = useMessageBranch();\n\n  return (\n    <ButtonGroupText\n      data-slot=\"message-branch-page\"\n      className={cn(\n        'border-none bg-transparent text-muted-foreground shadow-none px-2',\n        className\n      )}\n      {...props}\n    >\n      {currentBranch + 1}/{totalBranches}\n    </ButtonGroupText>\n  );\n};\n\n/** Streamdown discards unrecognised props, so these go on a wrapper instead. */\ntype MessageResponseHostProps = Pick<\n  HTMLAttributes<HTMLDivElement>,\n  'id' | 'role' | 'aria-label' | 'aria-labelledby' | 'aria-describedby'\n> & {\n  'data-testid'?: string;\n};\n\ntype MessageResponseProps = ComponentProps<typeof Streamdown> &\n  MessageResponseHostProps;\n\ntype MarkdownComponentProps<T extends keyof JSX.IntrinsicElements> =\n  JSX.IntrinsicElements[T] & ExtraProps;\n\nconst messageResponseComponents: Components = {\n  h1: ({ children }: MarkdownComponentProps<'h1'>) => (\n    <h1 className=\"mt-0 mb-2 scroll-m-20 text-xl font-medium tracking-tightest\">\n      {children}\n    </h1>\n  ),\n  h2: ({ children }: MarkdownComponentProps<'h2'>) => (\n    <h2 className=\"mt-4 mb-1 scroll-m-20 text-lg font-medium tracking-tightest\">\n      {children}\n    </h2>\n  ),\n  h3: ({ children }: MarkdownComponentProps<'h3'>) => (\n    <h3 className=\"mt-4 mb-1 scroll-m-20 text-base font-medium tracking-tighter\">\n      {children}\n    </h3>\n  ),\n  h4: ({ children }: MarkdownComponentProps<'h4'>) => (\n    <h4 className=\"mt-2 mb-0 scroll-m-20 text-sm font-medium tracking-normal\">\n      {children}\n    </h4>\n  ),\n  h5: ({ children }: MarkdownComponentProps<'h5'>) => (\n    <h5 className=\"mt-0 mb-0 scroll-m-20 text-xs font-medium tracking-tighter\">\n      {children}\n    </h5>\n  ),\n  h6: ({ children }: MarkdownComponentProps<'h6'>) => (\n    <h6 className=\"mt-0 mb-0 scroll-m-20 text-2xs font-medium tracking-tighter\">\n      {children}\n    </h6>\n  ),\n  p: ({ children }: MarkdownComponentProps<'p'>) => (\n    <p className=\"mt-2 mb-3 text-base font-normal leading-5 tracking-tightest\">\n      {children}\n    </p>\n  ),\n  strong: ({ children }: MarkdownComponentProps<'strong'>) => (\n    <strong className=\"font-medium\">{children}</strong>\n  ),\n  em: ({ children }: MarkdownComponentProps<'em'>) => (\n    <em className=\"italic\">{children}</em>\n  ),\n  b: ({ children }: MarkdownComponentProps<'b'>) => (\n    <b className=\"font-medium\">{children}</b>\n  ),\n  i: ({ children }: MarkdownComponentProps<'i'>) => (\n    <i className=\"italic\">{children}</i>\n  ),\n  ul: ({ children }: MarkdownComponentProps<'ul'>) => (\n    <ul className=\"ml-8.25 mb-3 pt-2 pl-0 pb-0 list-disc text-base font-normal tracking-tightest\">\n      {children}\n    </ul>\n  ),\n  ol: ({ children }: MarkdownComponentProps<'ol'>) => (\n    <ol className=\"ml-8.25 mb-3 pt-2 pl-0 pb-0 list-decimal text-base font-normal tracking-tightest\">\n      {children}\n    </ol>\n  ),\n  li: ({ children }: MarkdownComponentProps<'li'>) => (\n    <li className=\"py-0\">{children}</li>\n  ),\n  blockquote: ({ children }: MarkdownComponentProps<'blockquote'>) => (\n    <blockquote className=\"my-3 pr-2 pl-2 border-l border-l-default text-sm text-muted-foreground font-normal tracking-tight not-italic\">\n      {children}\n    </blockquote>\n  ),\n  hr: () => <hr className=\"my-4 border-default\" />,\n  a: ({ children, href, ...props }: MarkdownComponentProps<'a'>) => (\n    <a\n      className=\"text-link-foreground no-underline hover:underline underline-offset-4\"\n      href={href}\n      {...props}\n    >\n      {children}\n    </a>\n  ),\n  table: ({ children }: MarkdownComponentProps<'table'>) => (\n    <div\n      className=\"my-6 overflow-x-auto\"\n      tabIndex={0}\n      role=\"group\"\n      aria-label=\"Atlas AI Chat Table\"\n    >\n      <table className=\"w-full\">{children}</table>\n    </div>\n  ),\n  thead: ({ children }: MarkdownComponentProps<'thead'>) => (\n    <thead>{children}</thead>\n  ),\n  tbody: ({ children }: MarkdownComponentProps<'tbody'>) => (\n    <tbody>{children}</tbody>\n  ),\n  tr: ({ children }: MarkdownComponentProps<'tr'>) => (\n    <tr className=\"m-0 border-t p-0 even:bg-muted-background\">{children}</tr>\n  ),\n  th: ({ children }: MarkdownComponentProps<'th'>) => (\n    <th className=\"border px-4 py-2 text-left font-bold\">{children}</th>\n  ),\n  td: ({ children }: MarkdownComponentProps<'td'>) => (\n    <td className=\"border px-4 py-2 text-left\">{children}</td>\n  ),\n};\n\nconst MessageResponseMarkdown = ({\n  className,\n  components,\n  plugins,\n  controls,\n  ...props\n}: ComponentProps<typeof Streamdown>): JSX.Element => (\n  <Streamdown\n    className={cn(\n      'size-full',\n      // Blockquote paragraph overrides\n      '[&_blockquote_p]:text-sm',\n      '[&_blockquote_p]:tracking-tight',\n      // Inline code\n      '[&_code]:relative',\n      '[&_code]:rounded',\n      '[&_code]:bg-muted-background',\n      '[&_code]:px-[0.3rem]',\n      '[&_code]:py-[0.2rem]',\n      '[&_code]:font-mono',\n      '[&_code]:text-sm',\n      '[&_code]:font-semibold',\n      // Code blocks (Streamdown container)\n      '[&_div[data-streamdown=\"code-block\"]]:my-4',\n      '[&_div[data-streamdown=\"code-block\"]]:w-full',\n      '[&_div[data-streamdown=\"code-block\"]]:overflow-hidden',\n      '[&_div[data-streamdown=\"code-block\"]]:rounded-xl',\n      '[&_div[data-streamdown=\"code-block\"]]:border',\n      '[&_div[data-streamdown=\"code-block\"]]:border-default',\n      // Code block header\n      '[&_div[data-streamdown=\"code-block-header\"]]:flex',\n      '[&_div[data-streamdown=\"code-block-header\"]]:items-center',\n      '[&_div[data-streamdown=\"code-block-header\"]]:justify-between',\n      '[&_div[data-streamdown=\"code-block-header\"]]:bg-muted-background/80',\n      '[&_div[data-streamdown=\"code-block-header\"]]:px-4',\n      '[&_div[data-streamdown=\"code-block-header\"]]:py-3',\n      '[&_div[data-streamdown=\"code-block-header\"]]:text-xs',\n      '[&_div[data-streamdown=\"code-block-header\"]]:text-muted-foreground',\n      // Pre element inside code block\n      '[&_div[data-streamdown=\"code-block\"]_pre]:m-0',\n      '[&_div[data-streamdown=\"code-block\"]_pre]:overflow-x-auto',\n      '[&_div[data-streamdown=\"code-block\"]_pre]:border-t',\n      '[&_div[data-streamdown=\"code-block\"]_pre]:border-default',\n      '[&_div[data-streamdown=\"code-block\"]_pre]:bg-card-background!',\n      '[&_div[data-streamdown=\"code-block\"]_pre]:p-4',\n      '[&_div[data-streamdown=\"code-block\"]_pre]:text-sm',\n      '[&_div[data-streamdown=\"code-block\"]_pre]:text-medium-foreground!',\n      // Code element inside pre\n      '[&_div[data-streamdown=\"code-block\"]_pre_code]:static',\n      '[&_div[data-streamdown=\"code-block\"]_pre_code]:rounded-none',\n      '[&_div[data-streamdown=\"code-block\"]_pre_code]:bg-transparent',\n      '[&_div[data-streamdown=\"code-block\"]_pre_code]:p-0',\n      '[&_div[data-streamdown=\"code-block\"]_pre_code]:font-mono',\n      '[&_div[data-streamdown=\"code-block\"]_pre_code]:text-sm',\n      '[&_div[data-streamdown=\"code-block\"]_pre_code]:font-normal',\n      // Code block buttons\n      '[&_button[data-streamdown=\"code-block-copy-button\"]]:cursor-pointer',\n      '[&_button[data-streamdown=\"code-block-copy-button\"]]:p-1',\n      '[&_button[data-streamdown=\"code-block-copy-button\"]]:text-muted-foreground',\n      '[&_button[data-streamdown=\"code-block-copy-button\"]]:transition-all',\n      '[&_button[data-streamdown=\"code-block-copy-button\"]]:hover:text-base-foreground',\n      '[&_button[data-streamdown=\"code-block-download-button\"]]:cursor-pointer',\n      '[&_button[data-streamdown=\"code-block-download-button\"]]:p-1',\n      '[&_button[data-streamdown=\"code-block-download-button\"]]:text-muted-foreground',\n      '[&_button[data-streamdown=\"code-block-download-button\"]]:transition-all',\n      '[&_button[data-streamdown=\"code-block-download-button\"]]:hover:text-base-foreground',\n      // Regular pre blocks (not in Streamdown code blocks)\n      '[&_pre:not([data-streamdown])]:my-3',\n      '[&_pre:not([data-streamdown])]:mx-0',\n      '[&_pre:not([data-streamdown])]:overflow-x-auto',\n      '[&_pre:not([data-streamdown])]:rounded-md',\n      '[&_pre:not([data-streamdown])]:border',\n      '[&_pre:not([data-streamdown])]:bg-card-background',\n      '[&_pre:not([data-streamdown])]:p-4',\n      '[&_pre:not([data-streamdown])]:text-medium-foreground',\n      '[&_pre:not([data-streamdown])]:text-sm',\n      '[&_pre:not([data-streamdown])_code]:static',\n      '[&_pre:not([data-streamdown])_code]:rounded-none',\n      '[&_pre:not([data-streamdown])_code]:bg-transparent',\n      '[&_pre:not([data-streamdown])_code]:px-0',\n      '[&_pre:not([data-streamdown])_code]:py-0',\n      '[&_pre:not([data-streamdown])_code]:font-mono',\n      '[&_pre:not([data-streamdown])_code]:text-sm',\n      '[&_pre:not([data-streamdown])_code]:font-normal',\n      // Mermaid diagram blocks\n      '[&_div[data-streamdown=\"mermaid-block\"]]:bg-card-background',\n      '[&_div[data-streamdown=\"mermaid-block\"]]:text-base-foreground',\n      '[&_div[data-streamdown=\"mermaid-block\"]]:flex',\n      '[&_div[data-streamdown=\"mermaid-block\"]]:flex-col',\n      '[&_div[data-streamdown=\"mermaid-block\"]]:rounded-lg',\n      '[&_div[data-streamdown=\"mermaid-block\"]]:hover:bg-base-background-hover',\n      '[&_div[data-streamdown=\"mermaid-block\"]]:border-0',\n      // Positioning context for the action strip (see below)\n      '[&_div[data-streamdown=\"mermaid-block\"]]:relative',\n      // Nested scroll + sticky + pointer-events breaks hit-testing on Mermaid Copy/Download\n      // (same class of issue as github.com/vercel/streamdown/issues/494). Force absolute strip.\n      '[&_div[data-streamdown=\"mermaid-block\"]>div:has([data-streamdown=\"mermaid-block-actions\"])]:!absolute',\n      '[&_div[data-streamdown=\"mermaid-block\"]>div:has([data-streamdown=\"mermaid-block-actions\"])]:!top-2',\n      '[&_div[data-streamdown=\"mermaid-block\"]>div:has([data-streamdown=\"mermaid-block-actions\"])]:!right-2',\n      '[&_div[data-streamdown=\"mermaid-block\"]>div:has([data-streamdown=\"mermaid-block-actions\"])]:!z-10',\n      '[&_div[data-streamdown=\"mermaid-block\"]>div:has([data-streamdown=\"mermaid-block-actions\"])]:!mt-0',\n      '[&_div[data-streamdown=\"mermaid-block\"]>div:has([data-streamdown=\"mermaid-block-actions\"])]:!pointer-events-auto',\n      // Ensure mermaid container is tall enough for the toolbar (pan/zoom + actions)\n      '[&_div[data-streamdown=\"mermaid-block\"]_.relative.w-full]:!min-h-28',\n      // KaTeX sizing (overflow rules live in styles.source.css)\n      '[&_.katex-display]:my-3',\n      '[&_.katex]:text-[1em]',\n      // First and last child margin resets\n      '[&>*:first-child]:mt-0',\n      '[&>*:last-child]:mb-0',\n      className\n    )}\n    components={{ ...messageResponseComponents, ...components }}\n    controls={controls ?? MESSAGE_RESPONSE_DEFAULT_STREAMDOWN_CONTROLS}\n    plugins={{ ...plugins, mermaid: mermaidPlugin }}\n    {...props}\n  />\n);\n\nconst MessageResponse = ({\n  id,\n  role,\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledBy,\n  'aria-describedby': ariaDescribedBy,\n  'data-testid': dataTestId,\n  ...props\n}: MessageResponseProps): JSX.Element => (\n  <div\n    data-slot=\"message-response\"\n    id={id}\n    role={role}\n    aria-label={ariaLabel}\n    aria-labelledby={ariaLabelledBy}\n    aria-describedby={ariaDescribedBy}\n    data-testid={dataTestId}\n  >\n    <MessageResponseMarkdown {...props} />\n  </div>\n);\n\ntype MessageAttachmentProps = HTMLAttributes<HTMLDivElement> & {\n  data: FileUIPart;\n  className?: string;\n  onRemove?: () => void;\n};\n\nfunction MessageAttachment({\n  data,\n  className,\n  onRemove,\n  ...props\n}: MessageAttachmentProps): ReactNode {\n  const filename = data.filename || '';\n  const mediaType =\n    data.mediaType?.startsWith('image/') && data.url ? 'image' : 'file';\n  const isImage = mediaType === 'image';\n  const attachmentLabel = filename || (isImage ? 'Image' : 'Attachment');\n\n  return (\n    <div\n      data-slot=\"message-attachment\"\n      className={cn(\n        'group relative size-24 overflow-hidden rounded-lg',\n        className\n      )}\n      {...props}\n    >\n      {isImage ? (\n        <>\n          <img\n            alt={filename || 'attachment'}\n            className=\"size-full object-cover\"\n            height={100}\n            src={data.url}\n            width={100}\n          />\n          {onRemove && (\n            <Button\n              aria-label=\"Remove attachment\"\n              className=\"absolute top-2 right-2 size-6 rounded-full bg-card-background/80 p-0 opacity-0 backdrop-blur-sm transition-opacity hover:bg-card-background group-hover:opacity-100 [&>svg]:size-3\"\n              onClick={(e) => {\n                e.stopPropagation();\n                onRemove();\n              }}\n              type=\"button\"\n              variant=\"ghost\"\n            >\n              <IconX />\n              <span className=\"sr-only\">Remove</span>\n            </Button>\n          )}\n        </>\n      ) : (\n        <>\n          <Tooltip>\n            <TooltipTrigger\n              render={\n                <div className=\"flex size-full shrink-0 items-center justify-center rounded-lg bg-muted-background text-muted-foreground\">\n                  <IconPaperclip className=\"size-4\" />\n                </div>\n              }\n            />\n            <TooltipContent>\n              <p>{attachmentLabel}</p>\n            </TooltipContent>\n          </Tooltip>\n          {onRemove && (\n            <Button\n              aria-label=\"Remove attachment\"\n              className=\"size-6 shrink-0 rounded-full p-0 opacity-0 transition-opacity hover:bg-base-background-hover group-hover:opacity-100 [&>svg]:size-3\"\n              onClick={(e) => {\n                e.stopPropagation();\n                onRemove();\n              }}\n              type=\"button\"\n              variant=\"ghost\"\n            >\n              <IconX />\n              <span className=\"sr-only\">Remove</span>\n            </Button>\n          )}\n        </>\n      )}\n    </div>\n  );\n}\n\ntype MessageAttachmentsProps = ComponentProps<'div'>;\n\nfunction MessageAttachments({\n  children,\n  className,\n  ...props\n}: MessageAttachmentsProps): ReactNode {\n  if (!children) {\n    return null;\n  }\n\n  return (\n    <div\n      data-slot=\"message-attachments\"\n      className={cn(\n        'ml-auto flex w-fit flex-wrap items-start gap-2',\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </div>\n  );\n}\n\ntype MessageToolbarProps = ComponentProps<'div'>;\n\nconst MessageToolbar = ({\n  className,\n  children,\n  ...props\n}: MessageToolbarProps): ReactNode => (\n  <div\n    data-slot=\"message-toolbar\"\n    className={cn(\n      'mt-4 flex w-full items-center justify-between gap-4',\n      className\n    )}\n    {...props}\n  >\n    {children}\n  </div>\n);\n\nexport {\n  Message,\n  MessageAction,\n  MessageActions,\n  MessageAttachment,\n  MessageAttachments,\n  MessageAvatar,\n  MessageAvatarIcon,\n  MessageBranch,\n  MessageBranchContent,\n  MessageBranchNext,\n  MessageBranchPage,\n  MessageBranchPrevious,\n  MessageBranchSelector,\n  MessageContent,\n  MessageResponse,\n  MessageToolbar,\n};\n"],"names":["createContext","useCallback","useContext","useEffect","useMemo","useState","mermaid","mermaidPlugin","IconChevronLeft","IconChevronRight","IconPaperclip","IconX","Streamdown","cn","getInitials","Avatar","AvatarFallback","AvatarIcon","AvatarImage","Button","ButtonGroup","ButtonGroupText","Tooltip","TooltipContent","TooltipTrigger","MESSAGE_RESPONSE_DEFAULT_STREAMDOWN_CONTROLS","Message","className","isResponse","props","div","data-slot","MessageContent","children","MessageAvatar","avatarUrl","name","variant","sizes","fallbackText","alt","src","MessageAvatarIcon","MessageActions","MessageAction","tooltip","label","size","button","type","span","render","p","MessageBranchContext","useMessageBranch","context","Error","MessageBranch","defaultBranch","onBranchChange","currentBranch","setCurrentBranch","branches","setBranches","goToPrevious","prev","newBranch","length","goToNext","contextValue","totalBranches","Provider","value","MessageBranchContent","childrenArray","Array","isArray","map","branch","index","key","MessageBranchSelector","orientation","MessageBranchPrevious","aria-label","disabled","onClick","MessageBranchNext","MessageBranchPage","messageResponseComponents","h1","h2","h3","h4","h5","h6","strong","em","b","i","ul","ol","li","blockquote","hr","a","href","table","tabIndex","role","thead","tbody","tr","th","td","MessageResponseMarkdown","components","plugins","controls","MessageResponse","id","ariaLabel","ariaLabelledBy","ariaDescribedBy","dataTestId","aria-labelledby","aria-describedby","data-testid","MessageAttachment","data","onRemove","filename","mediaType","startsWith","url","isImage","attachmentLabel","img","height","width","e","stopPropagation","MessageAttachments","MessageToolbar"],"mappings":"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"}

package/dist/components/ui/core/overflow-list/overflow-list.d.ts

@@ -0,0 +1,21 @@
+import { type ComponentRef, type ForwardRefExoticComponent, type JSX, type ReactNode, type RefAttributes } from "react";
+import { type CollapseStrategy, type CollapseUnit, type OverflowComponent } from "./overflow-list.utils";
+type OverflowMeasurement = {
+	size: number;
+	collapsedSize: number;
+};
+type OverflowListProps = {
+	children: ReactNode;
+	separator?: ReactNode;
+	collapseOrder: CollapseUnit[] | CollapseStrategy;
+	overflowComponent: OverflowComponent;
+	overflowPosition?: "auto" | "end";
+	orientation?: "horizontal" | "vertical";
+	as?: keyof JSX.IntrinsicElements;
+	lastItemMinVisibleRem?: number;
+	lastItemFlexibleSelector?: string;
+	className?: string;
+	onMeasure?: (measurement: OverflowMeasurement) => void;
+};
+declare const OverflowList: ForwardRefExoticComponent<OverflowListProps & RefAttributes<ComponentRef<"div">>>;
+export { OverflowList, type OverflowListProps, type OverflowMeasurement };

package/dist/components/ui/core/overflow-list/overflow-list.js

@@ -0,0 +1,197 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Children, createElement, forwardRef, Fragment, isValidElement, useCallback, useLayoutEffect, useRef, useState } from "react";
+import { cn } from "../../../../lib/utils.js";
+import { assignRef } from "../../../../utils/assign-ref.js";
+import { buildVisibleTokens, collapseStatesEqual, computeCollapsedMinWidth, computeCollapseState, getMeasurements, INITIAL_STATE, renderOverflow, resolveCollapseOrder, resolveInjectedElement } from "./overflow-list.utils.js";
+function toValidElements(children) {
+    // eslint-disable-next-line @eslint-react/no-children-to-array -- OverflowList needs a stable, flattened array of elements to index into for collapse/resize math; Children.toArray is the only API that flattens fragments and assigns stable keys
+    return Children.toArray(children).filter((child)=>/*#__PURE__*/ isValidElement(child));
+}
+const OverflowList = /*#__PURE__*/ forwardRef(function OverflowList({ children, separator, collapseOrder, overflowComponent: Overflow, overflowPosition = 'auto', orientation = 'horizontal', as: ContentElement = 'div', lastItemMinVisibleRem, lastItemFlexibleSelector, className, onMeasure }, ref) {
+    const containerRef = useRef(null);
+    const setContainerRef = useCallback((el)=>{
+        assignRef(containerRef, el);
+        assignRef(ref, el);
+    }, [
+        ref
+    ]);
+    const measureRef = useRef(null);
+    const overflowMeasureRef = useRef(null);
+    const measurementsRef = useRef(null);
+    const [collapseState, setCollapseState] = useState(INITIAL_STATE);
+    const [minSize, setMinSize] = useState(0);
+    const minSizeRef = useRef(0);
+    const lastSizeRef = useRef(0);
+    const separatorRef = useRef(separator);
+    const orientationRef = useRef(orientation);
+    const onMeasureRef = useRef(onMeasure);
+    const lastItemMinVisibleRemRef = useRef(lastItemMinVisibleRem);
+    const lastItemFlexibleSelectorRef = useRef(lastItemFlexibleSelector);
+    const items = toValidElements(children);
+    const itemCount = items.length;
+    const resolvedOrder = resolveCollapseOrder(collapseOrder, itemCount);
+    const itemCountRef = useRef(itemCount);
+    const collapseOrderRef = useRef(resolvedOrder);
+    const collapseOrderKey = resolvedOrder.join(',');
+    useLayoutEffect(()=>{
+        separatorRef.current = separator;
+        itemCountRef.current = itemCount;
+        collapseOrderRef.current = resolvedOrder;
+        orientationRef.current = orientation;
+        onMeasureRef.current = onMeasure;
+        lastItemMinVisibleRemRef.current = lastItemMinVisibleRem;
+        lastItemFlexibleSelectorRef.current = lastItemFlexibleSelector;
+    });
+    // eslint-disable-next-line react-hooks/preserve-manual-memoization -- stable ref-based callback required for ResizeObserver; React Compiler cannot preserve this memoization
+    const measure = useCallback(()=>{
+        const measureEl = measureRef.current;
+        const overflowEl = overflowMeasureRef.current;
+        if (!measureEl || !overflowEl || itemCountRef.current === 0) {
+            measurementsRef.current = null;
+            setMinSize(0);
+            return null;
+        }
+        const measurements = getMeasurements(measureEl, overflowEl, !!separatorRef.current, orientationRef.current, lastItemFlexibleSelectorRef.current);
+        measurementsRef.current = measurements;
+        const collapsedMinWidth = Math.ceil(computeCollapsedMinWidth({
+            ...measurements,
+            collapseOrder: collapseOrderRef.current,
+            lastItemMinVisible: lastItemMinVisibleRemRef.current != null ? lastItemMinVisibleRemRef.current * parseFloat(getComputedStyle(document.documentElement).fontSize) : undefined
+        }));
+        minSizeRef.current = collapsedMinWidth;
+        setMinSize((prev)=>prev === collapsedMinWidth ? prev : collapsedMinWidth);
+        return measurements;
+    }, []);
+    // eslint-disable-next-line react-hooks/preserve-manual-memoization -- stable ref-based callback required for ResizeObserver; React Compiler cannot preserve this memoization
+    const recalculate = useCallback(()=>{
+        const container = containerRef.current;
+        if (!container) return;
+        const containerSize = orientationRef.current === 'vertical' ? container.getBoundingClientRect().height : container.getBoundingClientRect().width;
+        if (containerSize === 0 || containerSize === lastSizeRef.current) {
+            return;
+        }
+        lastSizeRef.current = containerSize;
+        if (itemCountRef.current === 0) {
+            setCollapseState(INITIAL_STATE);
+            onMeasureRef.current?.({
+                size: containerSize,
+                collapsedSize: 0
+            });
+            return;
+        }
+        const measurements = measurementsRef.current ?? measure();
+        if (!measurements) return;
+        const newState = computeCollapseState({
+            containerSize,
+            ...measurements,
+            collapseOrder: collapseOrderRef.current
+        });
+        setCollapseState((prev)=>collapseStatesEqual(prev, newState) ? prev : newState);
+        onMeasureRef.current?.({
+            size: containerSize,
+            collapsedSize: minSizeRef.current
+        });
+    }, [
+        measure
+    ]);
+    useLayoutEffect(()=>{
+        const container = containerRef.current;
+        const measureEl = measureRef.current;
+        const overflowEl = overflowMeasureRef.current;
+        if (!container) return;
+        const observer = new ResizeObserver((entries)=>{
+            const itemsChanged = entries.some((entry)=>entry.target === measureEl || entry.target === overflowEl);
+            if (itemsChanged) {
+                measure();
+                lastSizeRef.current = 0;
+            }
+            recalculate();
+        });
+        observer.observe(container);
+        if (measureEl) observer.observe(measureEl);
+        if (overflowEl) observer.observe(overflowEl);
+        // eslint-disable-next-line react-hooks/set-state-in-effect -- intentional: useLayoutEffect + synchronous setState is the correct DOM measurement pattern; avoids paint flash
+        measure();
+        recalculate();
+        return ()=>observer.disconnect();
+    }, [
+        measure,
+        recalculate,
+        ContentElement
+    ]);
+    useLayoutEffect(()=>{
+        measurementsRef.current = null;
+        lastSizeRef.current = 0;
+        // eslint-disable-next-line react-hooks/set-state-in-effect -- intentional: useLayoutEffect + synchronous setState is the correct DOM measurement pattern; avoids paint flash
+        measure();
+        recalculate();
+    }, [
+        itemCount,
+        collapseOrderKey,
+        orientation,
+        measure,
+        recalculate,
+        ContentElement
+    ]);
+    if (itemCount === 0) return null;
+    const hiddenSet = new Set(collapseState.hiddenIndices);
+    const hiddenItems = items.filter((item, i)=>item != null && hiddenSet.has(i));
+    const SeparatorElement = resolveInjectedElement(ContentElement);
+    const overflowWrapper = SeparatorElement === 'li' ? 'li' : null;
+    const tokens = buildVisibleTokens(items, hiddenSet, overflowPosition === 'end' ? items.length : collapseState.overflowAt, hiddenItems, Overflow, overflowWrapper);
+    const isVertical = orientation === 'vertical';
+    return /*#__PURE__*/ _jsxs("div", {
+        ref: setContainerRef,
+        "data-slot": "overflow-list",
+        className: cn('relative overflow-hidden', isVertical ? 'min-h-0' : 'min-w-0', className),
+        style: {
+            [isVertical ? 'minHeight' : 'minWidth']: minSize || undefined
+        },
+        children: [
+            /*#__PURE__*/ createElement(ContentElement, {
+                ref: measureRef,
+                'aria-hidden': true,
+                className: cn(isVertical ? 'pointer-events-none invisible absolute left-0 top-0 flex flex-col list-none flex-nowrap text-sm tracking-tight *:shrink-0' : 'pointer-events-none invisible flex list-none flex-nowrap items-center text-sm tracking-tight *:shrink-0', 'p-0 m-0', className, isVertical ? 'h-max' : 'h-0 w-max')
+            }, items.map((child, i)=>/*#__PURE__*/ _jsxs(Fragment, {
+                    children: [
+                        i > 0 && separator != null && /*#__PURE__*/ _jsx(SeparatorElement, {
+                            "data-slot": "separator",
+                            "aria-hidden": true,
+                            children: separator
+                        }),
+                        child
+                    ]
+                }, child.key ?? i))),
+            /*#__PURE__*/ createElement(ContentElement, {
+                ref: overflowMeasureRef,
+                'aria-hidden': true,
+                className: cn(isVertical ? 'pointer-events-none invisible absolute left-0 top-0 flex flex-col list-none flex-nowrap text-sm tracking-tight *:shrink-0' : 'pointer-events-none invisible absolute left-0 top-0 flex list-none flex-nowrap items-center text-sm tracking-tight *:shrink-0', 'p-0 m-0', className, isVertical ? 'h-max' : undefined)
+            }, /*#__PURE__*/ createElement(SeparatorElement, {
+                'aria-hidden': true,
+                className: 'size-0'
+            }), separator != null && /*#__PURE__*/ createElement(SeparatorElement, {
+                'data-slot': 'separator',
+                'aria-hidden': true
+            }, separator), renderOverflow(Overflow, items, overflowWrapper)),
+            /*#__PURE__*/ _jsx(ContentElement, {
+                "data-slot": "overflow-list-content",
+                "data-truncated": !!hiddenItems.length || undefined,
+                className: cn(isVertical ? 'flex flex-col list-none flex-nowrap text-sm tracking-tight *:shrink-0' : 'flex list-none flex-nowrap items-center text-sm tracking-tight *:shrink-0', 'p-0 m-0 h-auto w-auto', className),
+                children: tokens.map((token, index)=>/*#__PURE__*/ _jsxs(Fragment, {
+                        children: [
+                            index > 0 && separator != null && /*#__PURE__*/ _jsx(SeparatorElement, {
+                                "data-slot": "separator",
+                                "aria-hidden": true,
+                                children: separator
+                            }),
+                            token.node
+                        ]
+                    }, token.key))
+            })
+        ]
+    });
+});
+OverflowList.displayName = 'OverflowList';
+export { OverflowList };
+
+//# sourceMappingURL=overflow-list.js.map

package/dist/components/ui/core/overflow-list/overflow-list.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/ui/core/overflow-list/overflow-list.tsx"],"sourcesContent":["import {\n  Children,\n  createElement,\n  forwardRef,\n  Fragment,\n  isValidElement,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n  type ComponentRef,\n  type ForwardRefExoticComponent,\n  type JSX,\n  type ReactNode,\n  type Ref,\n  type RefAttributes,\n} from 'react';\n\nimport { cn } from '../../../../lib/utils';\nimport { assignRef } from '../../../../utils/assign-ref';\n\nimport {\n  buildVisibleTokens,\n  collapseStatesEqual,\n  computeCollapsedMinWidth,\n  computeCollapseState,\n  getMeasurements,\n  INITIAL_STATE,\n  renderOverflow,\n  resolveCollapseOrder,\n  resolveInjectedElement,\n  type CollapseState,\n  type CollapseStrategy,\n  type CollapseUnit,\n  type ItemElement,\n  type OverflowComponent,\n} from './overflow-list.utils';\n\nfunction toValidElements(children: ReactNode): ItemElement[] {\n  // eslint-disable-next-line @eslint-react/no-children-to-array -- OverflowList needs a stable, flattened array of elements to index into for collapse/resize math; Children.toArray is the only API that flattens fragments and assigns stable keys\n  return Children.toArray(children).filter((child): child is ItemElement =>\n    isValidElement(child)\n  );\n}\n\ntype OverflowMeasurement = {\n  size: number;\n  collapsedSize: number;\n};\n\ntype OverflowListProps = {\n  children: ReactNode;\n  separator?: ReactNode;\n  collapseOrder: CollapseUnit[] | CollapseStrategy;\n  overflowComponent: OverflowComponent;\n  overflowPosition?: 'auto' | 'end';\n  orientation?: 'horizontal' | 'vertical';\n  as?: keyof JSX.IntrinsicElements;\n  lastItemMinVisibleRem?: number;\n  lastItemFlexibleSelector?: string;\n  className?: string;\n  onMeasure?: (measurement: OverflowMeasurement) => void;\n};\n\nconst OverflowList: ForwardRefExoticComponent<\n  OverflowListProps & RefAttributes<ComponentRef<'div'>>\n> = forwardRef<ComponentRef<'div'>, OverflowListProps>(function OverflowList(\n  {\n    children,\n    separator,\n    collapseOrder,\n    overflowComponent: Overflow,\n    overflowPosition = 'auto',\n    orientation = 'horizontal',\n    as: ContentElement = 'div',\n    lastItemMinVisibleRem,\n    lastItemFlexibleSelector,\n    className,\n    onMeasure,\n  }: OverflowListProps,\n  ref: Ref<ComponentRef<'div'>>\n) {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const setContainerRef = useCallback(\n    (el: HTMLDivElement | null) => {\n      assignRef(containerRef, el);\n      assignRef(ref, el);\n    },\n    [ref]\n  );\n\n  const measureRef = useRef<HTMLElement>(null);\n  const overflowMeasureRef = useRef<HTMLElement>(null);\n  const measurementsRef = useRef<{\n    itemWidths: number[];\n    gap: number;\n    overflowWidth: number;\n    outerMarginLeft: number;\n    outerMarginRight: number;\n    lastItemFlexibleWidth?: number;\n  } | null>(null);\n  const [collapseState, setCollapseState] =\n    useState<CollapseState>(INITIAL_STATE);\n  const [minSize, setMinSize] = useState(0);\n  const minSizeRef = useRef(0);\n  const lastSizeRef = useRef(0);\n\n  const separatorRef = useRef(separator);\n  const orientationRef = useRef(orientation);\n  const onMeasureRef = useRef(onMeasure);\n  const lastItemMinVisibleRemRef = useRef(lastItemMinVisibleRem);\n  const lastItemFlexibleSelectorRef = useRef(lastItemFlexibleSelector);\n  const items = toValidElements(children);\n  const itemCount = items.length;\n\n  const resolvedOrder = resolveCollapseOrder(collapseOrder, itemCount);\n\n  const itemCountRef = useRef(itemCount);\n  const collapseOrderRef = useRef(resolvedOrder);\n  const collapseOrderKey = resolvedOrder.join(',');\n\n  useLayoutEffect(() => {\n    separatorRef.current = separator;\n    itemCountRef.current = itemCount;\n    collapseOrderRef.current = resolvedOrder;\n    orientationRef.current = orientation;\n    onMeasureRef.current = onMeasure;\n    lastItemMinVisibleRemRef.current = lastItemMinVisibleRem;\n    lastItemFlexibleSelectorRef.current = lastItemFlexibleSelector;\n  });\n\n  // eslint-disable-next-line react-hooks/preserve-manual-memoization -- stable ref-based callback required for ResizeObserver; React Compiler cannot preserve this memoization\n  const measure = useCallback(() => {\n    const measureEl = measureRef.current;\n    const overflowEl = overflowMeasureRef.current;\n    if (!measureEl || !overflowEl || itemCountRef.current === 0) {\n      measurementsRef.current = null;\n      setMinSize(0);\n      return null;\n    }\n\n    const measurements = getMeasurements(\n      measureEl,\n      overflowEl,\n      !!separatorRef.current,\n      orientationRef.current,\n      lastItemFlexibleSelectorRef.current\n    );\n    measurementsRef.current = measurements;\n\n    const collapsedMinWidth = Math.ceil(\n      computeCollapsedMinWidth({\n        ...measurements,\n        collapseOrder: collapseOrderRef.current,\n        lastItemMinVisible:\n          lastItemMinVisibleRemRef.current != null\n            ? lastItemMinVisibleRemRef.current *\n              parseFloat(getComputedStyle(document.documentElement).fontSize)\n            : undefined,\n      })\n    );\n    minSizeRef.current = collapsedMinWidth;\n    setMinSize((prev) =>\n      prev === collapsedMinWidth ? prev : collapsedMinWidth\n    );\n\n    return measurements;\n  }, []);\n\n  // eslint-disable-next-line react-hooks/preserve-manual-memoization -- stable ref-based callback required for ResizeObserver; React Compiler cannot preserve this memoization\n  const recalculate = useCallback(() => {\n    const container = containerRef.current;\n    if (!container) return;\n\n    const containerSize =\n      orientationRef.current === 'vertical'\n        ? container.getBoundingClientRect().height\n        : container.getBoundingClientRect().width;\n\n    if (containerSize === 0 || containerSize === lastSizeRef.current) {\n      return;\n    }\n    lastSizeRef.current = containerSize;\n\n    if (itemCountRef.current === 0) {\n      setCollapseState(INITIAL_STATE);\n      onMeasureRef.current?.({ size: containerSize, collapsedSize: 0 });\n      return;\n    }\n\n    const measurements = measurementsRef.current ?? measure();\n    if (!measurements) return;\n\n    const newState = computeCollapseState({\n      containerSize,\n      ...measurements,\n      collapseOrder: collapseOrderRef.current,\n    });\n\n    setCollapseState((prev) =>\n      collapseStatesEqual(prev, newState) ? prev : newState\n    );\n    onMeasureRef.current?.({\n      size: containerSize,\n      collapsedSize: minSizeRef.current,\n    });\n  }, [measure]);\n\n  useLayoutEffect(() => {\n    const container = containerRef.current;\n    const measureEl = measureRef.current;\n    const overflowEl = overflowMeasureRef.current;\n    if (!container) return;\n\n    const observer = new ResizeObserver((entries) => {\n      const itemsChanged = entries.some(\n        (entry) => entry.target === measureEl || entry.target === overflowEl\n      );\n      if (itemsChanged) {\n        measure();\n        lastSizeRef.current = 0;\n      }\n      recalculate();\n    });\n\n    observer.observe(container);\n    if (measureEl) observer.observe(measureEl);\n    if (overflowEl) observer.observe(overflowEl);\n    // eslint-disable-next-line react-hooks/set-state-in-effect -- intentional: useLayoutEffect + synchronous setState is the correct DOM measurement pattern; avoids paint flash\n    measure();\n    recalculate();\n\n    return () => observer.disconnect();\n  }, [measure, recalculate, ContentElement]);\n\n  useLayoutEffect(() => {\n    measurementsRef.current = null;\n    lastSizeRef.current = 0;\n    // eslint-disable-next-line react-hooks/set-state-in-effect -- intentional: useLayoutEffect + synchronous setState is the correct DOM measurement pattern; avoids paint flash\n    measure();\n    recalculate();\n  }, [\n    itemCount,\n    collapseOrderKey,\n    orientation,\n    measure,\n    recalculate,\n    ContentElement,\n  ]);\n\n  if (itemCount === 0) return null;\n\n  const hiddenSet = new Set(collapseState.hiddenIndices);\n  const hiddenItems = items.filter(\n    (item, i) => item != null && hiddenSet.has(i)\n  );\n\n  const SeparatorElement = resolveInjectedElement(ContentElement);\n  const overflowWrapper = SeparatorElement === 'li' ? 'li' : null;\n\n  const tokens = buildVisibleTokens(\n    items,\n    hiddenSet,\n    overflowPosition === 'end' ? items.length : collapseState.overflowAt,\n    hiddenItems,\n    Overflow,\n    overflowWrapper\n  );\n\n  const isVertical = orientation === 'vertical';\n\n  return (\n    <div\n      ref={setContainerRef}\n      data-slot=\"overflow-list\"\n      className={cn(\n        'relative overflow-hidden',\n        isVertical ? 'min-h-0' : 'min-w-0',\n        className\n      )}\n      style={{\n        [isVertical ? 'minHeight' : 'minWidth']: minSize || undefined,\n      }}\n    >\n      {createElement(\n        ContentElement,\n        {\n          ref: measureRef,\n          'aria-hidden': true,\n          className: cn(\n            isVertical\n              ? 'pointer-events-none invisible absolute left-0 top-0 flex flex-col list-none flex-nowrap text-sm tracking-tight *:shrink-0'\n              : 'pointer-events-none invisible flex list-none flex-nowrap items-center text-sm tracking-tight *:shrink-0',\n            'p-0 m-0',\n            className,\n            isVertical ? 'h-max' : 'h-0 w-max'\n          ),\n        },\n        items.map((child, i) => (\n          <Fragment key={child.key ?? i}>\n            {i > 0 && separator != null && (\n              <SeparatorElement data-slot=\"separator\" aria-hidden>\n                {separator}\n              </SeparatorElement>\n            )}\n            {child}\n          </Fragment>\n        ))\n      )}\n\n      {createElement(\n        ContentElement,\n        {\n          ref: overflowMeasureRef,\n          'aria-hidden': true,\n          className: cn(\n            isVertical\n              ? 'pointer-events-none invisible absolute left-0 top-0 flex flex-col list-none flex-nowrap text-sm tracking-tight *:shrink-0'\n              : 'pointer-events-none invisible absolute left-0 top-0 flex list-none flex-nowrap items-center text-sm tracking-tight *:shrink-0',\n            'p-0 m-0',\n            className,\n            isVertical ? 'h-max' : undefined\n          ),\n        },\n        createElement(SeparatorElement, {\n          'aria-hidden': true,\n          className: 'size-0',\n        }),\n        separator != null &&\n          createElement(\n            SeparatorElement,\n            { 'data-slot': 'separator', 'aria-hidden': true },\n            separator\n          ),\n        renderOverflow(Overflow, items, overflowWrapper)\n      )}\n\n      <ContentElement\n        data-slot=\"overflow-list-content\"\n        data-truncated={!!hiddenItems.length || undefined}\n        className={cn(\n          isVertical\n            ? 'flex flex-col list-none flex-nowrap text-sm tracking-tight *:shrink-0'\n            : 'flex list-none flex-nowrap items-center text-sm tracking-tight *:shrink-0',\n          'p-0 m-0 h-auto w-auto',\n          className\n        )}\n      >\n        {tokens.map((token, index) => (\n          <Fragment key={token.key}>\n            {index > 0 && separator != null && (\n              <SeparatorElement data-slot=\"separator\" aria-hidden>\n                {separator}\n              </SeparatorElement>\n            )}\n            {token.node}\n          </Fragment>\n        ))}\n      </ContentElement>\n    </div>\n  );\n});\nOverflowList.displayName = 'OverflowList';\n\nexport { OverflowList, type OverflowListProps, type OverflowMeasurement };\n"],"names":["Children","createElement","forwardRef","Fragment","isValidElement","useCallback","useLayoutEffect","useRef","useState","cn","assignRef","buildVisibleTokens","collapseStatesEqual","computeCollapsedMinWidth","computeCollapseState","getMeasurements","INITIAL_STATE","renderOverflow","resolveCollapseOrder","resolveInjectedElement","toValidElements","children","toArray","filter","child","OverflowList","separator","collapseOrder","overflowComponent","Overflow","overflowPosition","orientation","as","ContentElement","lastItemMinVisibleRem","lastItemFlexibleSelector","className","onMeasure","ref","containerRef","setContainerRef","el","measureRef","overflowMeasureRef","measurementsRef","collapseState","setCollapseState","minSize","setMinSize","minSizeRef","lastSizeRef","separatorRef","orientationRef","onMeasureRef","lastItemMinVisibleRemRef","lastItemFlexibleSelectorRef","items","itemCount","length","resolvedOrder","itemCountRef","collapseOrderRef","collapseOrderKey","join","current","measure","measureEl","overflowEl","measurements","collapsedMinWidth","Math","ceil","lastItemMinVisible","parseFloat","getComputedStyle","document","documentElement","fontSize","undefined","prev","recalculate","container","containerSize","getBoundingClientRect","height","width","size","collapsedSize","newState","observer","ResizeObserver","entries","itemsChanged","some","entry","target","observe","disconnect","hiddenSet","Set","hiddenIndices","hiddenItems","item","i","has","SeparatorElement","overflowWrapper","tokens","overflowAt","isVertical","div","data-slot","style","map","aria-hidden","key","data-truncated","token","index","node","displayName"],"mappings":";AAAA,SACEA,QAAQ,EACRC,aAAa,EACbC,UAAU,EACVC,QAAQ,EACRC,cAAc,EACdC,WAAW,EACXC,eAAe,EACfC,MAAM,EACNC,QAAQ,QAOH,QAAQ;AAEf,SAASC,EAAE,QAAQ,2BAAwB;AAC3C,SAASC,SAAS,QAAQ,kCAA+B;AAEzD,SACEC,kBAAkB,EAClBC,mBAAmB,EACnBC,wBAAwB,EACxBC,oBAAoB,EACpBC,eAAe,EACfC,aAAa,EACbC,cAAc,EACdC,oBAAoB,EACpBC,sBAAsB,QAMjB,2BAAwB;AAE/B,SAASC,gBAAgBC,QAAmB;IAC1C,mPAAmP;IACnP,OAAOrB,SAASsB,OAAO,CAACD,UAAUE,MAAM,CAAC,CAACC,sBACxCpB,eAAeoB;AAEnB;AAqBA,MAAMC,6BAEFvB,WAAmD,SAASuB,aAC9D,EACEJ,QAAQ,EACRK,SAAS,EACTC,aAAa,EACbC,mBAAmBC,QAAQ,EAC3BC,mBAAmB,MAAM,EACzBC,cAAc,YAAY,EAC1BC,IAAIC,iBAAiB,KAAK,EAC1BC,qBAAqB,EACrBC,wBAAwB,EACxBC,SAAS,EACTC,SAAS,EACS,EACpBC,GAA6B;IAE7B,MAAMC,eAAehC,OAAuB;IAC5C,MAAMiC,kBAAkBnC,YACtB,CAACoC;QACC/B,UAAU6B,cAAcE;QACxB/B,UAAU4B,KAAKG;IACjB,GACA;QAACH;KAAI;IAGP,MAAMI,aAAanC,OAAoB;IACvC,MAAMoC,qBAAqBpC,OAAoB;IAC/C,MAAMqC,kBAAkBrC,OAOd;IACV,MAAM,CAACsC,eAAeC,iBAAiB,GACrCtC,SAAwBQ;IAC1B,MAAM,CAAC+B,SAASC,WAAW,GAAGxC,SAAS;IACvC,MAAMyC,aAAa1C,OAAO;IAC1B,MAAM2C,cAAc3C,OAAO;IAE3B,MAAM4C,eAAe5C,OAAOmB;IAC5B,MAAM0B,iBAAiB7C,OAAOwB;IAC9B,MAAMsB,eAAe9C,OAAO8B;IAC5B,MAAMiB,2BAA2B/C,OAAO2B;IACxC,MAAMqB,8BAA8BhD,OAAO4B;IAC3C,MAAMqB,QAAQpC,gBAAgBC;IAC9B,MAAMoC,YAAYD,MAAME,MAAM;IAE9B,MAAMC,gBAAgBzC,qBAAqBS,eAAe8B;IAE1D,MAAMG,eAAerD,OAAOkD;IAC5B,MAAMI,mBAAmBtD,OAAOoD;IAChC,MAAMG,mBAAmBH,cAAcI,IAAI,CAAC;IAE5CzD,gBAAgB;QACd6C,aAAaa,OAAO,GAAGtC;QACvBkC,aAAaI,OAAO,GAAGP;QACvBI,iBAAiBG,OAAO,GAAGL;QAC3BP,eAAeY,OAAO,GAAGjC;QACzBsB,aAAaW,OAAO,GAAG3B;QACvBiB,yBAAyBU,OAAO,GAAG9B;QACnCqB,4BAA4BS,OAAO,GAAG7B;IACxC;IAEA,6KAA6K;IAC7K,MAAM8B,UAAU5D,YAAY;QAC1B,MAAM6D,YAAYxB,WAAWsB,OAAO;QACpC,MAAMG,aAAaxB,mBAAmBqB,OAAO;QAC7C,IAAI,CAACE,aAAa,CAACC,cAAcP,aAAaI,OAAO,KAAK,GAAG;YAC3DpB,gBAAgBoB,OAAO,GAAG;YAC1BhB,WAAW;YACX,OAAO;QACT;QAEA,MAAMoB,eAAerD,gBACnBmD,WACAC,YACA,CAAC,CAAChB,aAAaa,OAAO,EACtBZ,eAAeY,OAAO,EACtBT,4BAA4BS,OAAO;QAErCpB,gBAAgBoB,OAAO,GAAGI;QAE1B,MAAMC,oBAAoBC,KAAKC,IAAI,CACjC1D,yBAAyB;YACvB,GAAGuD,YAAY;YACfzC,eAAekC,iBAAiBG,OAAO;YACvCQ,oBACElB,yBAAyBU,OAAO,IAAI,OAChCV,yBAAyBU,OAAO,GAChCS,WAAWC,iBAAiBC,SAASC,eAAe,EAAEC,QAAQ,IAC9DC;QACR;QAEF7B,WAAWe,OAAO,GAAGK;QACrBrB,WAAW,CAAC+B,OACVA,SAASV,oBAAoBU,OAAOV;QAGtC,OAAOD;IACT,GAAG,EAAE;IAEL,6KAA6K;IAC7K,MAAMY,cAAc3E,YAAY;QAC9B,MAAM4E,YAAY1C,aAAayB,OAAO;QACtC,IAAI,CAACiB,WAAW;QAEhB,MAAMC,gBACJ9B,eAAeY,OAAO,KAAK,aACvBiB,UAAUE,qBAAqB,GAAGC,MAAM,GACxCH,UAAUE,qBAAqB,GAAGE,KAAK;QAE7C,IAAIH,kBAAkB,KAAKA,kBAAkBhC,YAAYc,OAAO,EAAE;YAChE;QACF;QACAd,YAAYc,OAAO,GAAGkB;QAEtB,IAAItB,aAAaI,OAAO,KAAK,GAAG;YAC9BlB,iBAAiB9B;YACjBqC,aAAaW,OAAO,GAAG;gBAAEsB,MAAMJ;gBAAeK,eAAe;YAAE;YAC/D;QACF;QAEA,MAAMnB,eAAexB,gBAAgBoB,OAAO,IAAIC;QAChD,IAAI,CAACG,cAAc;QAEnB,MAAMoB,WAAW1E,qBAAqB;YACpCoE;YACA,GAAGd,YAAY;YACfzC,eAAekC,iBAAiBG,OAAO;QACzC;QAEAlB,iBAAiB,CAACiC,OAChBnE,oBAAoBmE,MAAMS,YAAYT,OAAOS;QAE/CnC,aAAaW,OAAO,GAAG;YACrBsB,MAAMJ;YACNK,eAAetC,WAAWe,OAAO;QACnC;IACF,GAAG;QAACC;KAAQ;IAEZ3D,gBAAgB;QACd,MAAM2E,YAAY1C,aAAayB,OAAO;QACtC,MAAME,YAAYxB,WAAWsB,OAAO;QACpC,MAAMG,aAAaxB,mBAAmBqB,OAAO;QAC7C,IAAI,CAACiB,WAAW;QAEhB,MAAMQ,WAAW,IAAIC,eAAe,CAACC;YACnC,MAAMC,eAAeD,QAAQE,IAAI,CAC/B,CAACC,QAAUA,MAAMC,MAAM,KAAK7B,aAAa4B,MAAMC,MAAM,KAAK5B;YAE5D,IAAIyB,cAAc;gBAChB3B;gBACAf,YAAYc,OAAO,GAAG;YACxB;YACAgB;QACF;QAEAS,SAASO,OAAO,CAACf;QACjB,IAAIf,WAAWuB,SAASO,OAAO,CAAC9B;QAChC,IAAIC,YAAYsB,SAASO,OAAO,CAAC7B;QACjC,6KAA6K;QAC7KF;QACAe;QAEA,OAAO,IAAMS,SAASQ,UAAU;IAClC,GAAG;QAAChC;QAASe;QAAa/C;KAAe;IAEzC3B,gBAAgB;QACdsC,gBAAgBoB,OAAO,GAAG;QAC1Bd,YAAYc,OAAO,GAAG;QACtB,6KAA6K;QAC7KC;QACAe;IACF,GAAG;QACDvB;QACAK;QACA/B;QACAkC;QACAe;QACA/C;KACD;IAED,IAAIwB,cAAc,GAAG,OAAO;IAE5B,MAAMyC,YAAY,IAAIC,IAAItD,cAAcuD,aAAa;IACrD,MAAMC,cAAc7C,MAAMjC,MAAM,CAC9B,CAAC+E,MAAMC,IAAMD,QAAQ,QAAQJ,UAAUM,GAAG,CAACD;IAG7C,MAAME,mBAAmBtF,uBAAuBc;IAChD,MAAMyE,kBAAkBD,qBAAqB,OAAO,OAAO;IAE3D,MAAME,SAAShG,mBACb6C,OACA0C,WACApE,qBAAqB,QAAQ0B,MAAME,MAAM,GAAGb,cAAc+D,UAAU,EACpEP,aACAxE,UACA6E;IAGF,MAAMG,aAAa9E,gBAAgB;IAEnC,qBACE,MAAC+E;QACCxE,KAAKE;QACLuE,aAAU;QACV3E,WAAW3B,GACT,4BACAoG,aAAa,YAAY,WACzBzE;QAEF4E,OAAO;YACL,CAACH,aAAa,cAAc,WAAW,EAAE9D,WAAW+B;QACtD;;0BAEC7E,cACCgC,gBACA;gBACEK,KAAKI;gBACL,eAAe;gBACfN,WAAW3B,GACToG,aACI,8HACA,2GACJ,WACAzE,WACAyE,aAAa,UAAU;YAE3B,GACArD,MAAMyD,GAAG,CAAC,CAACzF,OAAO+E,kBAChB,MAACpG;;wBACEoG,IAAI,KAAK7E,aAAa,sBACrB,KAAC+E;4BAAiBM,aAAU;4BAAYG,aAAW;sCAChDxF;;wBAGJF;;mBANYA,MAAM2F,GAAG,IAAIZ;0BAW/BtG,cACCgC,gBACA;gBACEK,KAAKK;gBACL,eAAe;gBACfP,WAAW3B,GACToG,aACI,8HACA,iIACJ,WACAzE,WACAyE,aAAa,UAAU/B;YAE3B,iBACA7E,cAAcwG,kBAAkB;gBAC9B,eAAe;gBACfrE,WAAW;YACb,IACAV,aAAa,sBACXzB,cACEwG,kBACA;gBAAE,aAAa;gBAAa,eAAe;YAAK,GAChD/E,YAEJT,eAAeY,UAAU2B,OAAOkD;0BAGlC,KAACzE;gBACC8E,aAAU;gBACVK,kBAAgB,CAAC,CAACf,YAAY3C,MAAM,IAAIoB;gBACxC1C,WAAW3B,GACToG,aACI,0EACA,6EACJ,yBACAzE;0BAGDuE,OAAOM,GAAG,CAAC,CAACI,OAAOC,sBAClB,MAACnH;;4BACEmH,QAAQ,KAAK5F,aAAa,sBACzB,KAAC+E;gCAAiBM,aAAU;gCAAYG,aAAW;0CAChDxF;;4BAGJ2F,MAAME,IAAI;;uBANEF,MAAMF,GAAG;;;;AAYlC;AACA1F,aAAa+F,WAAW,GAAG;AAE3B,SAAS/F,YAAY,GAAqD"}

package/dist/components/ui/core/overflow-list/overflow-list.utils.d.ts

@@ -1,52 +1,54 @@
-import { ComponentType, ReactElement, ReactNode } from 'react';
+import { type ComponentType, type ReactElement, type ReactNode } from "react";
 export type OverflowComponent = ComponentType<{
-    items: ReactElement[];
+	items: ReactElement[];
 }>;
 export type ItemElement = ReactElement<Record<string, unknown>>;
-export type CollapseStrategy = 'asc' | 'desc' | 'innerAscFirstKeepLast' | 'innerDescFirstKeepLast';
+export declare function resolveInjectedElement(as: unknown): "li" | "span";
+export type CollapseStrategy = "asc" | "desc" | "innerAscFirstKeepLast" | "innerDescFirstKeepLast";
 export type CollapseUnit = number | number[];
 export declare function resolveCollapseOrder(order: CollapseUnit[] | CollapseStrategy, itemCount: number): CollapseUnit[];
 export type CollapseState = {
-    hiddenIndices: number[];
-    overflowAt: number;
+	hiddenIndices: number[];
+	overflowAt: number;
 };
 export declare const INITIAL_STATE: CollapseState;
 export declare function arraysEqual(a: number[], b: number[]): boolean;
 export declare function totalWidth(itemWidths: number[], gap: number): number;
-export declare const FIT_EPSILON = 0.5;
-export declare function getMeasurements(measureEl: HTMLElement, overflowEl: HTMLElement, hasSep: boolean, orientation?: 'horizontal' | 'vertical', lastItemFlexibleSelector?: string): {
-    itemWidths: number[];
-    gap: number;
-    overflowWidth: number;
-    outerMarginLeft: number;
-    outerMarginRight: number;
-    lastItemFlexibleWidth?: number;
+export declare const FIT_EPSILON = .5;
+export declare function getMeasurements(measureEl: HTMLElement, overflowEl: HTMLElement, hasSep: boolean, orientation?: "horizontal" | "vertical", lastItemFlexibleSelector?: string): {
+	itemWidths: number[];
+	gap: number;
+	overflowWidth: number;
+	outerMarginLeft: number;
+	outerMarginRight: number;
+	lastItemFlexibleWidth?: number;
 };
 export declare function hideUntilFit(total: number, itemWidths: number[], gap: number, overflowCost: number, hideOrder: CollapseUnit[], containerWidth: number): {
-    hidden: Set<number>;
-    firstHidden: number | null;
+	hidden: Set<number>;
+	firstHidden: number | null;
 };
-export declare function computeCollapseState({ containerSize, itemWidths, gap, overflowWidth, outerMarginLeft, outerMarginRight, collapseOrder, }: {
-    containerSize: number;
-    itemWidths: number[];
-    gap: number;
-    overflowWidth: number;
-    outerMarginLeft?: number;
-    outerMarginRight?: number;
-    collapseOrder: CollapseUnit[];
+export declare function computeCollapseState({ containerSize, itemWidths, gap, overflowWidth, outerMarginLeft, outerMarginRight, collapseOrder }: {
+	containerSize: number;
+	itemWidths: number[];
+	gap: number;
+	overflowWidth: number;
+	outerMarginLeft?: number;
+	outerMarginRight?: number;
+	collapseOrder: CollapseUnit[];
 }): CollapseState;
-export declare function computeCollapsedMinWidth({ itemWidths, gap, overflowWidth, outerMarginLeft, outerMarginRight, collapseOrder, lastItemMinVisible, lastItemFlexibleWidth, }: {
-    itemWidths: number[];
-    gap: number;
-    overflowWidth: number;
-    outerMarginLeft?: number;
-    outerMarginRight?: number;
-    collapseOrder: CollapseUnit[];
-    lastItemMinVisible?: number;
-    lastItemFlexibleWidth?: number;
+export declare function computeCollapsedMinWidth({ itemWidths, gap, overflowWidth, outerMarginLeft, outerMarginRight, collapseOrder, lastItemMinVisible, lastItemFlexibleWidth }: {
+	itemWidths: number[];
+	gap: number;
+	overflowWidth: number;
+	outerMarginLeft?: number;
+	outerMarginRight?: number;
+	collapseOrder: CollapseUnit[];
+	lastItemMinVisible?: number;
+	lastItemFlexibleWidth?: number;
 }): number;
 export declare function collapseStatesEqual(a: CollapseState, b: CollapseState): boolean;
-export declare function buildVisibleTokens(items: ReactElement[], hiddenSet: Set<number>, overflowAt: number, hiddenItems: ReactElement[], Overflow: OverflowComponent): Array<{
-    key: string | number;
-    node: ReactNode;
+export declare function renderOverflow(Overflow: OverflowComponent, items: ReactElement[], wrapper: "li" | null): ReactNode;
+export declare function buildVisibleTokens(items: ReactElement[], hiddenSet: Set<number>, overflowAt: number, hiddenItems: ReactElement[], Overflow: OverflowComponent, overflowWrapper?: "li" | null): Array<{
+	key: string | number;
+	node: ReactNode;
 }>;