{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "error-2",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "button",
    "card"
  ],
  "files": [
    {
      "path": "src/components/watermelon-ui/error-2.tsx",
      "content": "import { Button } from \"@/components/ui/button\";\nimport { Card } from \"@/components/ui/card\";\nimport { type ReactNode } from \"react\";\n\nexport interface ActionItem {\n  label: string;\n  icon: ReactNode;\n  onClick?: () => void;\n  variant?: \"default\" | \"secondary\" | \"outline\";\n}\n\nexport interface RecoveryLink {\n  title: string;\n  description: string;\n  icon: ReactNode;\n}\n\nexport interface MissingStateProps {\n  badge?: string;\n  title: string;\n  description: string;\n  actions?: ActionItem[];\n  links?: RecoveryLink[];\n}\n\nfunction RecoveryCard({ title, description, icon }: RecoveryLink) {\n  return (\n    <Card className=\"bg-muted hover:bg-muted/70 rounded shadow-xs ring-0 transition-opacity duration-200\">\n      <div className=\"flex items-start gap-4 px-4\">\n        <div className=\"bg-secondary text-secondary-foreground flex items-center justify-center rounded-lg\">\n          {icon}\n        </div>\n\n        <div className=\"space-y-1\">\n          <h3 className=\"text-foreground text-sm font-semibold\">{title}</h3>\n\n          <p className=\"text-muted-foreground text-sm leading-relaxed\">\n            {description}\n          </p>\n        </div>\n      </div>\n    </Card>\n  );\n}\n\nfunction ActionButton({\n  label,\n  icon,\n  onClick,\n  variant = \"default\",\n}: ActionItem) {\n  return (\n    <Button\n      variant={variant}\n      onClick={onClick}\n      className=\"rounded shadow-[inset_0_2px_4px_0_rgba(255,255,255,0.5),inset_0_-2px_4px_0_rgba(0,0,0,0.1)] dark:shadow-[inset_0_-2px_4px_0_rgba(0,0,0,0.1),inset_0_2px_4px_0_rgba(255,255,255,0.08)]\"\n    >\n      <span className=\"flex items-center gap-0.5\">\n        {icon}\n        <span>{label}</span>\n      </span>\n    </Button>\n  );\n}\n\nexport function MissingState({\n  title,\n  description,\n  actions = [],\n  links = [],\n}: MissingStateProps) {\n  return (\n    <section className=\"bg-background relative flex min-h-screen items-center justify-center overflow-hidden px-6 py-10\">\n      <div className=\"bg-background absolute inset-0\" />\n\n      <div className=\"relative z-10 mx-auto flex w-full max-w-6xl flex-col gap-10 lg:items-center\">\n        <div className=\"space-y-8\">\n          <div className=\"mx-auto max-w-xl space-y-5 text-center\">\n            <h1 className=\"text-foreground text-4xl font-semibold tracking-tight sm:text-4xl lg:text-4xl\">\n              {title}\n            </h1>\n\n            <p className=\"text-muted-foreground sm:text-md mx-auto max-w-md text-base leading-7\">\n              {description}\n            </p>\n          </div>\n\n          <div className=\"flex flex-col justify-center gap-3 sm:flex-row sm:flex-wrap\">\n            {actions.map((action) => (\n              <ActionButton key={action.label} {...action} />\n            ))}\n          </div>\n        </div>\n\n        <div className=\"grid gap-4\">\n          {links.map((link) => (\n            <RecoveryCard key={link.title} {...link} />\n          ))}\n        </div>\n      </div>\n    </section>\n  );\n}\n\nexport default MissingState;\n",
      "type": "registry:ui",
      "target": "components/ui/error-2.tsx"
    }
  ],
  "type": "registry:ui"
}