{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "attachment3",
  "title": "Attachment",
  "description": "A component for displaying file attachments with media previews, upload states, and actions.",
  "files": [
    {
      "path": "contents/components/attachment/3/index.tsx",
      "content": "import {\n  CheckIcon,\n  ClockIcon,\n  FileTextIcon,\n  FileWarningIcon,\n  RefreshCwIcon,\n  XIcon,\n} from \"lucide-react\"\n\nimport {\n  Attachment,\n  AttachmentAction,\n  AttachmentActions,\n  AttachmentContent,\n  AttachmentDescription,\n  AttachmentMedia,\n  AttachmentTitle,\n} from \"@/components/ui/attachment\"\nimport { Spinner } from \"@/components/ui/spinner\"\n\nexport default function AttachmentStates() {\n  return (\n    <div className=\"mx-auto flex w-full max-w-sm flex-col gap-2 py-12\">\n      <Attachment state=\"idle\" className=\"w-full\">\n        <AttachmentMedia>\n          <ClockIcon />\n        </AttachmentMedia>\n        <AttachmentContent>\n          <AttachmentTitle>selected-file.pdf</AttachmentTitle>\n          <AttachmentDescription>Ready to upload</AttachmentDescription>\n        </AttachmentContent>\n        <AttachmentActions>\n          <AttachmentAction aria-label=\"Remove selected-file.pdf\">\n            <XIcon />\n          </AttachmentAction>\n        </AttachmentActions>\n      </Attachment>\n      <Attachment state=\"uploading\" className=\"w-full\">\n        <AttachmentMedia>\n          <Spinner />\n        </AttachmentMedia>\n        <AttachmentContent>\n          <AttachmentTitle>design-system.zip</AttachmentTitle>\n          <AttachmentDescription>Uploading · 64%</AttachmentDescription>\n        </AttachmentContent>\n        <AttachmentActions>\n          <AttachmentAction aria-label=\"Cancel upload\">\n            <XIcon />\n          </AttachmentAction>\n        </AttachmentActions>\n      </Attachment>\n      <Attachment state=\"processing\" className=\"w-full\">\n        <AttachmentMedia>\n          <FileTextIcon />\n        </AttachmentMedia>\n        <AttachmentContent>\n          <AttachmentTitle>market-research.pdf</AttachmentTitle>\n          <AttachmentDescription>Processing document</AttachmentDescription>\n        </AttachmentContent>\n        <AttachmentActions>\n          <AttachmentAction aria-label=\"Remove market-research.pdf\">\n            <XIcon />\n          </AttachmentAction>\n        </AttachmentActions>\n      </Attachment>\n      <Attachment state=\"error\" className=\"w-full\">\n        <AttachmentMedia>\n          <FileWarningIcon />\n        </AttachmentMedia>\n        <AttachmentContent>\n          <AttachmentTitle>financial-model.xlsx</AttachmentTitle>\n          <AttachmentDescription>\n            Upload failed. Try again.\n          </AttachmentDescription>\n        </AttachmentContent>\n        <AttachmentActions>\n          <AttachmentAction aria-label=\"Retry upload\">\n            <RefreshCwIcon />\n          </AttachmentAction>\n          <AttachmentAction aria-label=\"Remove financial-model.xlsx\">\n            <XIcon />\n          </AttachmentAction>\n        </AttachmentActions>\n      </Attachment>\n      <Attachment state=\"done\" className=\"w-full\">\n        <AttachmentMedia>\n          <CheckIcon />\n        </AttachmentMedia>\n        <AttachmentContent>\n          <AttachmentTitle>uploaded-report.pdf</AttachmentTitle>\n          <AttachmentDescription>Uploaded · 1.8 MB</AttachmentDescription>\n        </AttachmentContent>\n        <AttachmentActions>\n          <AttachmentAction aria-label=\"Remove uploaded-report.pdf\">\n            <XIcon />\n          </AttachmentAction>\n        </AttachmentActions>\n      </Attachment>\n    </div>\n  )\n}\n",
      "type": "registry:component",
      "target": "components/attachment3.tsx"
    }
  ],
  "type": "registry:component"
}