{
  "name": "attachment",
  "type": "registry:ui",
  "dependencies": [
    "class-variance-authority",
    "reka-ui"
  ],
  "registryDependencies": [
    "button"
  ],
  "files": [
    {
      "path": "ui/attachment/Attachment.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { HTMLAttributes } from \"vue\"\nimport type { AttachmentVariants } from \".\"\nimport { cn } from \"@/lib/utils\"\nimport { attachmentVariants } from \".\"\n\ninterface Props {\n  size?: AttachmentVariants[\"size\"]\n  orientation?: AttachmentVariants[\"orientation\"]\n  state?: \"idle\" | \"uploading\" | \"processing\" | \"error\" | \"done\"\n  class?: HTMLAttributes[\"class\"]\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  state: \"done\",\n  size: \"default\",\n  orientation: \"horizontal\",\n})\n</script>\n\n<template>\n  <div\n    data-slot=\"attachment\"\n    :data-state=\"state\"\n    :data-size=\"size\"\n    :data-orientation=\"orientation\"\n    :class=\"cn(attachmentVariants({ size, orientation }), props.class)\"\n  >\n    <slot />\n  </div>\n</template>\n"
    },
    {
      "path": "ui/attachment/AttachmentAction.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { HTMLAttributes } from \"vue\"\nimport type { ButtonVariants } from \"../button\"\nimport { cn } from \"@/lib/utils\"\nimport { Button } from \"@/components/ui/button\"\n\nconst props = withDefaults(defineProps<{\n  class?: HTMLAttributes[\"class\"]\n  variant?: ButtonVariants[\"variant\"]\n  size?: ButtonVariants[\"size\"]\n}>(), {\n  variant: \"ghost\",\n  size: \"icon-xs\",\n})\n</script>\n\n<template>\n  <Button\n    data-slot=\"attachment-action\"\n    :variant=\"variant\"\n    :size=\"size\"\n    :class=\"cn('cn-attachment-action', props.class)\"\n  >\n    <slot />\n  </Button>\n</template>\n"
    },
    {
      "path": "ui/attachment/AttachmentActions.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { HTMLAttributes } from \"vue\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<{\n  class?: HTMLAttributes[\"class\"]\n}>()\n</script>\n\n<template>\n  <div\n    data-slot=\"attachment-actions\"\n    :class=\"cn(\n      'cn-attachment-actions flex shrink-0 items-center',\n      props.class,\n    )\"\n  >\n    <slot />\n  </div>\n</template>\n"
    },
    {
      "path": "ui/attachment/AttachmentContent.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { HTMLAttributes } from \"vue\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<{\n  class?: HTMLAttributes[\"class\"]\n}>()\n</script>\n\n<template>\n  <div\n    data-slot=\"attachment-content\"\n    :class=\"cn(\n      'cn-attachment-content max-w-full min-w-0 flex-1',\n      props.class,\n    )\"\n    v-bind=\"props\"\n  >\n    <slot />\n  </div>\n</template>\n"
    },
    {
      "path": "ui/attachment/AttachmentDescription.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { HTMLAttributes } from \"vue\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<{\n  class?: HTMLAttributes[\"class\"]\n}>()\n</script>\n\n<template>\n  <span\n    data-slot=\"attachment-description\"\n    :class=\"cn(\n      'cn-attachment-description block min-w-0 truncate text-muted-foreground group-data-[state=error]/attachment:text-destructive/80',\n      'max-w-full',\n      props.class,\n    )\"\n  >\n    <slot />\n  </span>\n</template>\n"
    },
    {
      "path": "ui/attachment/AttachmentGroup.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { HTMLAttributes } from \"vue\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<{\n  class?: HTMLAttributes[\"class\"]\n}>()\n</script>\n\n<template>\n  <div\n    data-slot=\"attachment-group\"\n    :class=\"cn(\n      'cn-attachment-group flex min-w-0 scroll-fade-x snap-x snap-mandatory scrollbar-none overflow-x-auto overscroll-x-contain *:data-[slot=attachment]:flex-none *:data-[slot=attachment]:snap-start',\n      props.class,\n    )\"\n  >\n    <slot />\n  </div>\n</template>\n"
    },
    {
      "path": "ui/attachment/AttachmentMedia.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { HTMLAttributes } from \"vue\"\nimport type { AttachmentMediaVariants } from \".\"\nimport { cn } from \"@/lib/utils\"\nimport { attachmentMediaVariants } from \".\"\n\nconst props = defineProps<{\n  class?: HTMLAttributes[\"class\"]\n  variant?: AttachmentMediaVariants[\"variant\"]\n}>()\n</script>\n\n<template>\n  <div\n    data-slot=\"attachment-media\"\n    :data-variant=\"variant\"\n    :class=\"cn(attachmentMediaVariants({ variant }), props.class)\"\n  >\n    <slot />\n  </div>\n</template>\n"
    },
    {
      "path": "ui/attachment/AttachmentTitle.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { HTMLAttributes } from \"vue\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<{\n  class?: HTMLAttributes[\"class\"]\n}>()\n</script>\n\n<template>\n  <span\n    data-slot=\"attachment-title\"\n    :class=\"cn(\n      'cn-attachment-title block max-w-full min-w-0 truncate group-data-[state=processing]/attachment:shimmer group-data-[state=uploading]/attachment:shimmer',\n      props.class,\n    )\"\n  >\n    <slot />\n  </span>\n</template>\n"
    },
    {
      "path": "ui/attachment/AttachmentTrigger.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport { Primitive } from 'reka-ui'\nimport type { PrimitiveProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { cn } from \"@/lib/utils\"\n\ninterface Props extends PrimitiveProps {\n  class?: HTMLAttributes[\"class\"]\n}\nconst props = withDefaults(defineProps<Props>(), {\n  as: \"button\",\n})\n</script>\n\n<template>\n  <Primitive\n    data-slot=\"attachment-trigger\"\n    :as=\"as\"\n    :as-child=\"asChild\"\n    :class=\"cn('cn-attachment-trigger absolute inset-0 z-10 outline-none', props.class)\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"
    },
    {
      "path": "ui/attachment/index.ts",
      "type": "registry:ui",
      "content": "import type { VariantProps } from \"class-variance-authority\"\nimport { cva } from \"class-variance-authority\"\n\nexport { default as Attachment } from \"./Attachment.vue\"\nexport { default as AttachmentAction } from \"./AttachmentAction.vue\"\nexport { default as AttachmentActions } from \"./AttachmentActions.vue\"\nexport { default as AttachmentContent } from \"./AttachmentContent.vue\"\nexport { default as AttachmentDescription } from \"./AttachmentDescription.vue\"\nexport { default as AttachmentGroup } from \"./AttachmentGroup.vue\"\nexport { default as AttachmentMedia } from \"./AttachmentMedia.vue\"\nexport { default as AttachmentTitle } from \"./AttachmentTitle.vue\"\nexport { default as AttachmentTrigger } from \"./AttachmentTrigger.vue\"\n\nexport const attachmentVariants = cva(\n  \"cn-attachment group/attachment relative flex max-w-full min-w-0 shrink-0 flex-wrap border bg-card text-card-foreground transition-colors has-[>a,>button]:hover:bg-muted/50 data-[state=error]:border-destructive/30 data-[state=idle]:border-dashed\",\n  {\n    variants: {\n      size: {\n        default: \"cn-attachment-size-default\",\n        sm: \"cn-attachment-size-sm\",\n        xs: \"cn-attachment-size-xs\",\n      },\n      orientation: {\n        horizontal: \"cn-attachment-orientation-horizontal items-center\",\n        vertical: \"cn-attachment-orientation-vertical flex-col\",\n      },\n    },\n  },\n)\n\nexport type AttachmentVariants = VariantProps<typeof attachmentVariants>\n\nexport const attachmentMediaVariants = cva(\n  \"cn-attachment-media relative flex aspect-square shrink-0 items-center justify-center overflow-hidden group-data-[state=error]/attachment:bg-destructive/10 group-data-[state=error]/attachment:text-destructive [&_svg]:pointer-events-none\",\n  {\n    variants: {\n      variant: {\n        icon: \"cn-attachment-media-variant-icon\",\n        image:\n          \"cn-attachment-media-variant-image *:[img]:aspect-square *:[img]:w-full *:[img]:object-cover\",\n      },\n    },\n    defaultVariants: {\n      variant: \"icon\",\n    },\n  },\n)\n\nexport type AttachmentMediaVariants = VariantProps<typeof attachmentMediaVariants>\n"
    }
  ]
}