{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "alert",
  "type": "registry:ui",
  "title": "Alert",
  "description": "High-contrast pop notification banner.",
  "dependencies": [
    "clsx",
    "tailwind-merge",
    "lucide-react"
  ],
  "devDependencies": [],
  "registryDependencies": [],
  "files": [
    {
      "path": "components/ui/alert.tsx",
      "content": "import * as React from 'react'\nimport { motion } from 'motion/react'\nimport { AlertTriangle, CheckCircle2, Info, XCircle } from 'lucide-react'\nimport { cn } from '@/lib/utils'\n\nexport interface AlertProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onAnimationStart' | 'onDrag' | 'onDragStart' | 'onDragEnd'> {\n  variant?: 'info' | 'success' | 'warning' | 'error'\n  title?: string\n  description?: string\n}\n\nexport function Alert({\n  variant = 'info',\n  title,\n  description,\n  children,\n  className,\n  ...props\n}: AlertProps) {\n  const variantStyles = {\n    info: 'bg-rk-sky text-rk-ink',\n    success: 'bg-rk-mint text-rk-ink',\n    warning: 'bg-rk-primary text-rk-ink',\n    error: 'bg-rk-error text-rk-ink',\n  }\n\n  const icons = {\n    info: <Info className=\"w-5 h-5 stroke-[2.5]\" />,\n    success: <CheckCircle2 className=\"w-5 h-5 text-green-900 stroke-[2.5]\" />,\n    warning: <AlertTriangle className=\"w-5 h-5 text-amber-950 stroke-[2.5]\" />,\n    error: <XCircle className=\"w-5 h-5 text-red-950 stroke-[2.5]\" />,\n  }\n\n  return (\n    <motion.div\n      initial={{ opacity: 0, y: -8 }}\n      animate={{ opacity: 1, y: 0 }}\n      transition={{ type: 'spring', stiffness: 500, damping: 25 }}\n      className={cn(\n        'flex items-start gap-3.5 p-4 rounded-2xl rk-border rk-shadow-sm font-sans',\n        variantStyles[variant],\n        className\n      )}\n      {...props}\n    >\n      <div className=\"mt-0.5 shrink-0\">{icons[variant]}</div>\n      <div className=\"flex-1 space-y-0.5\">\n        {title && <h5 className=\"font-display font-extrabold text-sm leading-tight\">{title}</h5>}\n        {description && <p className=\"text-xs font-bold opacity-90\">{description}</p>}\n        {children}\n      </div>\n    </motion.div>\n  )\n}\n",
      "type": "registry:ui",
      "target": "components/ui/alert.tsx"
    }
  ]
}