{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "mc-alert",
  "title": "MicroClub Alert",
  "description": "An alert component for MicroClub UI",
  "dependencies": [
    "lucide-react"
  ],
  "files": [
    {
      "path": "registry/ui/mc-alert.tsx",
      "content": "'use client';\n\nimport * as React from 'react';\nimport { CircleAlert, CircleCheck, Popcorn } from 'lucide-react';\nimport { cn } from '@/lib/utils';\n\ntype AlertVariant = 'success' | 'default' | 'destructive';\n\ninterface McAlertProps extends React.HTMLAttributes<HTMLDivElement> {\n  variant: AlertVariant;\n  title: string;\n  description?: string;\n  items?: string[];\n}\n\nconst variantStyles: Record<AlertVariant, string> = {\n  success:\n    'border border-success rounded-lg w-fit max-w-[719px] pt-[12px] pb-[14px] pl-[12px] pr-[12px]',\n  default: 'border border-border rounded-lg w-fit max-w-[719px] pl-[16px] pr-3 py-3',\n  destructive: 'border border-destructive rounded-lg w-fit max-w-[719px] pl-[16px] pr-4 py-3',\n};\n\nconst titleStyles: Record<AlertVariant, string> = {\n  success: 'text-success font-medium text-base leading-6',\n  default: 'text-card-foreground font-medium text-base leading-6',\n  destructive: 'text-destructive font-medium text-base leading-6',\n};\n\nconst descStyles: Record<AlertVariant, string> = {\n  success: 'text-success font-normal text-sm leading-5',\n  default: 'text-muted-foreground font-normal text-sm leading-5',\n  destructive: 'text-destructive font-normal text-sm leading-5',\n};\n\nconst iconMap: Record<AlertVariant, React.ReactNode> = {\n  success: <CircleCheck className=\"size-4 shrink-0 stroke-2 text-success\" />,\n  default: <Popcorn className=\"size-4 shrink-0 stroke-2 text-card-foreground\" />,\n  destructive: <CircleAlert className=\"size-4 shrink-0 stroke-2 text-destructive\" />,\n};\n\nconst iconGap: Record<AlertVariant, string> = {\n  success: 'gap-1',\n  default: 'gap-3',\n  destructive: 'gap-3',\n};\n\nfunction McAlert({ variant, title, description, items, className, ...props }: McAlertProps) {\n  const hasSupportingContent = !!description || !!items?.length;\n\n  return (\n    <div\n      data-slot=\"mc-alert\"\n      data-variant={variant}\n      className={cn(variantStyles[variant], className)}\n      role=\"alert\"\n      {...props}\n    >\n      <div\n        className={cn(\n          'flex',\n          hasSupportingContent ? 'items-start' : 'items-center',\n          iconGap[variant]\n        )}\n      >\n        <div className={cn('shrink-0', hasSupportingContent && 'pt-1')}>{iconMap[variant]}</div>\n        <div className=\"min-w-0\">\n          <span className={cn('block', titleStyles[variant])}>{title}</span>\n\n          {description && <p className={cn('mt-0.5', descStyles[variant])}>{description}</p>}\n\n          {items && items.length > 0 && (\n            <ul className={cn('mt-0.5 list-disc pl-6', descStyles[variant])}>\n              {items.map((item, i) => (\n                <li key={i}>{item}</li>\n              ))}\n            </ul>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport { McAlert };\nexport type { McAlertProps, AlertVariant };\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}