{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "attachment-chip",
  "type": "registry:ui",
  "title": "Attachment chip",
  "description": "Compact Tailwind file chip with a paperclip icon, truncated filename and an optional remove button, for attachments in chat composers, emails and forms.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/attachment-chip.tsx",
      "type": "registry:ui",
      "target": "components/ui/attachment-chip.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { PaperclipIcon, XIcon } from \"lucide-react\"\nimport { cn } from \"@/lib/utils\"\n\nfunction AttachmentChip({\n  name,\n  onRemove,\n  className,\n}: {\n  name: string\n  onRemove?: () => void\n  className?: string\n}) {\n  return (\n    <span\n      data-slot=\"attachment-chip\"\n      className={cn(\n        \"inline-flex h-7 max-w-56 items-center gap-1.5 rounded-md border border-border bg-sunken px-2 text-xs text-fg\",\n        className\n      )}\n    >\n      <PaperclipIcon className=\"size-3 shrink-0 text-fg-muted\" aria-hidden />\n      <span className=\"truncate\">{name}</span>\n      {onRemove ? (\n        <button type=\"button\" aria-label={`Remove ${name}`} className=\"text-fg-muted hover:text-fg\" onClick={onRemove}>\n          <XIcon className=\"size-3\" />\n        </button>\n      ) : null}\n    </span>\n  )\n}\nexport { AttachmentChip }\n"
    }
  ]
}
