{"version":3,"file":"chat-attachment.cjs","sources":["../../../components/chat/chat-attachment.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'class-variance-authority';\nimport { ComponentProps, ReactNode } from 'react';\nimport { FileTextIcon, XIcon } from '~/icons';\nimport { IconButton } from '../icon-button';\nimport { Spinner } from '../spinner';\nimport styles from './chat.module.css';\n\nexport type ChatAttachmentState = 'uploading' | 'error' | 'done';\n\nexport interface ChatAttachmentProps\n  extends Omit<ComponentProps<'div'>, 'title'> {\n  /** File name or main label. */\n  title?: ReactNode;\n  /** Secondary line — file size, type, or the error message. */\n  description?: ReactNode;\n  /**\n   * Content of the leading media square. Defaults to a file icon, or a\n   * spinner while `state` is `\"uploading\"`.\n   */\n  media?: ReactNode;\n  /**\n   * Lifecycle of the attachment.\n   * @defaultValue \"done\"\n   */\n  state?: ChatAttachmentState;\n  /** When provided, renders a remove button that calls it. */\n  onRemove?: () => void;\n  /**\n   * Accessible label for the remove button.\n   * @defaultValue \"Remove attachment\"\n   */\n  removeLabel?: string;\n}\n\nexport function ChatAttachment({\n  className,\n  title,\n  description,\n  media,\n  state = 'done',\n  onRemove,\n  removeLabel = 'Remove attachment',\n  children,\n  ...props\n}: ChatAttachmentProps) {\n  return (\n    <div\n      data-state={state}\n      className={cx(styles.attachment, className)}\n      data-slot='chat-attachment'\n      {...props}\n    >\n      <div\n        className={styles['attachment-media']}\n        aria-hidden='true'\n        data-slot='chat-attachment-media'\n      >\n        {media ??\n          (state === 'uploading' ? (\n            <Spinner size={2} aria-hidden='true' />\n          ) : (\n            <FileTextIcon />\n          ))}\n      </div>\n      {(title || description) && (\n        <div\n          className={styles['attachment-body']}\n          data-slot='chat-attachment-body'\n        >\n          {title && (\n            <span\n              className={styles['attachment-title']}\n              data-slot='chat-attachment-title'\n            >\n              {title}\n            </span>\n          )}\n          {description && (\n            <span\n              className={styles['attachment-description']}\n              data-slot='chat-attachment-description'\n            >\n              {description}\n            </span>\n          )}\n        </div>\n      )}\n      {children}\n      {onRemove && (\n        <IconButton\n          size={2}\n          aria-label={removeLabel}\n          className={styles['attachment-remove']}\n          onClick={onRemove}\n          data-slot='chat-attachment-remove'\n        >\n          <XIcon />\n        </IconButton>\n      )}\n    </div>\n  );\n}\n\nChatAttachment.displayName = 'Chat.Attachment';\n"],"names":[],"mappings":";;;;;;;;;;;AAoCM;AAWJ;;AAwDF;AAEA;;"}