{
  "name": "alert",
  "dependencies": [],
  "registryDependencies": [],
  "files": [
    {
      "name": "Alert.vue",
      "content": "<script setup lang=\"ts\">\nimport { type AlertVariants, alertVariants } from '.';\nimport { cn } from '@ui/utils';\n\nconst props = defineProps<{\n  variant?: AlertVariants['variant'];\n}>();\n</script>\n\n<template>\n  <div\n    :class=\"cn(alertVariants({ variant }), $attrs.class ?? '')\"\n    role=\"alert\"\n  >\n    <slot />\n  </div>\n</template>\n"
    },
    {
      "name": "AlertDescription.vue",
      "content": "<script setup lang=\"ts\">\nimport { cn } from '@ui/utils';\n\n</script>\n\n<template>\n  <div :class=\"cn('text-sm [&_p]:leading-relaxed', $attrs.class ?? '')\">\n    <slot />\n  </div>\n</template>\n"
    },
    {
      "name": "AlertTitle.vue",
      "content": "<script setup lang=\"ts\">\nimport { cn } from '@ui/utils';\n\n</script>\n\n<template>\n  <h5 :class=\"cn('mb-1 font-medium leading-none tracking-tight', $attrs.class ?? '')\">\n    <slot />\n  </h5>\n</template>\n"
    },
    {
      "name": "index.ts",
      "content": "import { type VariantProps, cva } from 'class-variance-authority';\n\nexport { default as Alert } from './Alert.vue';\nexport { default as AlertTitle } from './AlertTitle.vue';\nexport { default as AlertDescription } from './AlertDescription.vue';\n\nexport const alertVariants = cva(\n  'relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground',\n  {\n    variants: {\n      variant: {\n        default: 'bg-background text-foreground',\n        destructive:\n          'border-destructive/50 text-destructive [&>svg]:text-red-500 dark:bg-destructive/20 dark:text-red-500 dark:border-destructive',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  },\n);\n\nexport type AlertVariants = VariantProps<typeof alertVariants>;\n"
    }
  ],
  "type": "components:ui"
}