{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "empty-state",
  "type": "registry:ui",
  "title": "Empty state",
  "description": "Dashed empty state panel with an icon slot, title, description and an optional call to action button. Use it for first run screens and empty lists in React.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.minidev.pro/r/button.json",
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/empty-state.tsx",
      "type": "registry:ui",
      "target": "components/ui/empty-state.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { cn } from \"@/lib/utils\"\nimport { Button } from \"@/components/ui/button\"\n\nfunction EmptyState({\n  title,\n  description,\n  actionLabel,\n  onAction,\n  icon,\n  className,\n}: {\n  title: string\n  description?: string\n  actionLabel?: string\n  onAction?: () => void\n  icon?: React.ReactNode\n  className?: string\n}) {\n  return (\n    <div\n      data-slot=\"empty-state\"\n      className={cn(\n        \"flex flex-col items-center justify-center rounded-xl border border-dashed border-border bg-surface/50 px-6 py-16 text-center shadow-highlight\",\n        className\n      )}\n    >\n      {icon ? <div className=\"mb-4 text-fg-muted\">{icon}</div> : (\n        <div className=\"mb-4 size-10 rounded-xl border border-border bg-sunken\" aria-hidden />\n      )}\n      <h3 className=\"text-sm font-medium tracking-[0.005em] text-fg\">{title}</h3>\n      {description ? <p className=\"mt-1.5 max-w-sm text-xs leading-[1.55] text-fg-muted\">{description}</p> : null}\n      {actionLabel ? (\n        <Button className=\"mt-5\" size=\"sm\" onClick={onAction}>{actionLabel}</Button>\n      ) : null}\n    </div>\n  )\n}\nexport { EmptyState }\n"
    }
  ]
}