{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "alert",
  "title": "Alert",
  "type": "registry:ui",
  "files": [
    {
      "path": "packages/registry-react/components/alert/alert.tsx",
      "content": "import * as React from 'react'\nimport { AlertCircle, CheckCircle, Info, TriangleAlert } from 'lucide-react'\nimport { cn } from '@/lib/utils'\nimport { alertVariants, type AlertVariants } from './alert.variants'\n\nexport interface AlertProps extends React.HTMLAttributes<HTMLDivElement>, AlertVariants {\n  icon?: 'info' | 'warning' | 'error' | 'success'\n  title?: string\n  text?: string\n}\n\nconst Alert = React.forwardRef<HTMLDivElement, AlertProps>(\n  ({ className, variant, icon, title, text, children, ...props }, ref) => (\n    <div\n      ref={ref}\n      role=\"alert\"\n      data-uipkge=\"\"\n      data-slot=\"alert\"\n      className={cn(alertVariants({ variant }), className)}\n      {...props}\n    >\n      {icon ? (\n        <div data-uipkge=\"\" data-slot=\"alert-icon\" className=\"absolute top-4 left-4\">\n          {icon === 'error' ? (\n            <AlertCircle className=\"size-4\" aria-hidden=\"true\" />\n          ) : icon === 'success' ? (\n            <CheckCircle className=\"size-4\" aria-hidden=\"true\" />\n          ) : icon === 'warning' ? (\n            <TriangleAlert className=\"size-4\" aria-hidden=\"true\" />\n          ) : (\n            <Info className=\"size-4\" aria-hidden=\"true\" />\n          )}\n        </div>\n      ) : null}\n      <div data-uipkge=\"\" data-slot=\"alert-content\" className=\"[&_p]:text-sm [&_p]:leading-relaxed\">\n        {title ? <p className=\"text-sm font-medium\">{title}</p> : null}\n        {text ? <p className=\"text-muted-foreground text-sm\">{text}</p> : null}\n        {children}\n      </div>\n    </div>\n  ),\n)\nAlert.displayName = 'Alert'\n\nexport interface AlertTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {\n  as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div'\n}\n\nconst AlertTitle = React.forwardRef<HTMLHeadingElement, AlertTitleProps>(\n  ({ className, as: Comp = 'h5', ...props }, ref) => (\n    <Comp\n      ref={ref}\n      data-uipkge=\"\"\n      data-slot=\"alert-title\"\n      className={cn('mb-1 text-sm leading-none font-medium tracking-tight', className)}\n      {...props}\n    />\n  ),\n)\nAlertTitle.displayName = 'AlertTitle'\n\nconst AlertDescription = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-uipkge=\"\"\n      data-slot=\"alert-description\"\n      className={cn('text-muted-foreground text-sm leading-relaxed [&_p]:leading-relaxed', className)}\n      {...props}\n    />\n  ),\n)\nAlertDescription.displayName = 'AlertDescription'\n\nexport { Alert, AlertTitle, AlertDescription }\n",
      "type": "registry:ui",
      "target": "~/components/ui/alert/alert.tsx"
    },
    {
      "path": "packages/registry-react/components/alert/alert.variants.ts",
      "content": "import type { VariantProps } from 'class-variance-authority'\nimport { cva } from 'class-variance-authority'\n\n/**\n * Variant definitions live in their own file (rather than the package\n * `index.ts`) so `Alert.vue` can `import { alertVariants } from\n * './alert.variants'` without creating a circular dependency through the\n * index. See card.variants.ts for the same pattern + the SSR symptom that\n * motivated the split.\n */\nexport const alertVariants = cva(\n  'relative w-full rounded-lg border p-4 [&>svg]:text-foreground [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg+div]:translate-y-[-3px] [&:has([data-slot=alert-icon])]:pl-12 [&:has([data-slot=alert-description])]:pt-7',\n  {\n    variants: {\n      variant: {\n        default: 'bg-background text-foreground border-border',\n        destructive: 'border-destructive/20 text-destructive bg-destructive/5 [&>svg]:text-destructive',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  },\n)\n\nexport type AlertVariants = VariantProps<typeof alertVariants>\n",
      "type": "registry:ui",
      "target": "~/components/ui/alert/alert.variants.ts"
    },
    {
      "path": "packages/registry-react/components/alert/index.ts",
      "content": "export { Alert, AlertTitle, AlertDescription, type AlertProps, type AlertTitleProps } from './alert'\n\n// Re-export variant API from the sibling file (kept separate to avoid the\n// alert.tsx <-> index.ts circular import — mirrors the Vue registry).\nexport { alertVariants, type AlertVariants } from './alert.variants'\n",
      "type": "registry:ui",
      "target": "~/components/ui/alert/index.ts"
    }
  ],
  "dependencies": [
    "class-variance-authority",
    "lucide-react"
  ],
  "devDependencies": [],
  "registryDependencies": [],
  "description": "Static, in-flow notice block with a leading icon, title, and description. Use for inline page-level messages — info banners, success confirmations, warning callouts. Two tones: `default` and `destructive`.",
  "categories": [
    "feedback"
  ]
}