{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "empty-state",
  "title": "Empty state",
  "description": "A centred title, description, icon and action for empty content. Neutral uses a dashed border; info, ok, attention and danger use solid borders and readable tone washes. RefusedState and ErrorState supply the distinct refusal and failure presets.",
  "dependencies": [
    "lucide-react@1.33.0"
  ],
  "registryDependencies": [
    "@waimakers/utils",
    "@waimakers/theme"
  ],
  "files": [
    {
      "path": "src/components/ui/empty-state.tsx",
      "content": "import type * as React from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst toneClasses = {\n  neutral: \"bg-card/50\",\n  info: \"border-solid bg-[var(--info-wash,var(--surface-sunken))] text-[var(--info-text,var(--text))]\",\n  ok: \"border-solid bg-[var(--ok-wash,var(--surface-sunken))] text-[var(--ok-text,var(--text))]\",\n  attention:\n    \"border-solid bg-[var(--attention-wash,var(--surface-sunken))] text-[var(--attention-text,var(--text))]\",\n  danger:\n    \"border-solid bg-[var(--danger-wash,var(--surface-sunken))] text-[var(--danger-text,var(--text))]\",\n};\n\nfunction EmptyState({\n  tone = \"neutral\",\n  icon,\n  title,\n  description,\n  action,\n  className,\n  ...props\n}: Omit<React.ComponentProps<\"div\">, \"title\"> & {\n  tone?: keyof typeof toneClasses;\n  icon?: React.ReactNode;\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  action?: React.ReactNode;\n}) {\n  const Title = typeof title === \"string\" ? \"p\" : \"div\";\n  return (\n    <div\n      data-slot=\"empty-state\"\n      className={cn(\n        \"flex flex-col items-center justify-center gap-3 rounded-xl border border-dashed px-6 py-12 text-center\",\n        toneClasses[tone],\n        className,\n      )}\n      {...props}\n    >\n      {icon ? (\n        <div\n          className={cn(\n            \"flex size-11 items-center justify-center rounded-full [&_svg]:size-5\",\n            tone === \"neutral\" && \"bg-muted text-muted-foreground\",\n          )}\n        >\n          {icon}\n        </div>\n      ) : null}\n      <div className=\"flex flex-col gap-1\">\n        <Title\n          className={cn(\n            \"font-display text-base font-semibold\",\n            tone === \"neutral\" && \"text-foreground\",\n          )}\n        >\n          {title}\n        </Title>\n        {description ? (\n          <p className={cn(\"max-w-sm text-sm\", tone === \"neutral\" && \"text-muted-foreground\")}>\n            {description}\n          </p>\n        ) : null}\n      </div>\n      {action ? <div className=\"mt-1\">{action}</div> : null}\n    </div>\n  );\n}\n\nexport { EmptyState };\n",
      "type": "registry:ui",
      "target": "components/ui/empty-state.tsx"
    }
  ],
  "type": "registry:ui"
}