{
  "$schema": "https://abackui.com/schema/registry-item.json",
  "name": "empty-state",
  "type": "registry:ui",
  "title": "Empty State",
  "description": "A clear zero-data state with an optional action.",
  "dependencies": [
    "@tabler/icons-react"
  ],
  "registryDependencies": [
    "https://abackui.com/r/utils.json"
  ],
  "categories": [
    "Application"
  ],
  "docs": "https://abackui.com/docs/components/empty-state",
  "meta": {
    "status": "stable",
    "usedIn": [
      "aback-tools",
      "aback-launch"
    ]
  },
  "files": [
    {
      "path": "components/ui/empty-state.tsx",
      "content": "import * as React from \"react\";\nimport { IconInbox } from \"@tabler/icons-react\";\n\nimport { cn } from \"@/lib/utils\";\n\nexport interface EmptyStateProps extends Omit<React.ComponentProps<\"div\">, \"title\"> {\n  icon?: React.ReactNode;\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  action?: React.ReactNode;\n}\n\nfunction EmptyState({\n  icon,\n  title,\n  description,\n  action,\n  className,\n  ...props\n}: EmptyStateProps) {\n  return (\n    <div\n      data-slot=\"empty-state\"\n      className={cn(\n        \"flex flex-col items-center justify-center gap-3 border border-border bg-muted/10 p-12 text-center\",\n        className,\n      )}\n      {...props}\n    >\n      <div className=\"flex size-12 items-center justify-center text-muted-foreground/40 [&_svg]:size-8\">\n        {icon ?? <IconInbox aria-hidden=\"true\" />}\n      </div>\n      <p className=\"text-base font-semibold text-foreground\">{title}</p>\n      {description ? (\n        <p className=\"max-w-sm text-sm leading-relaxed text-muted-foreground\">\n          {description}\n        </p>\n      ) : null}\n      {action ? <div className=\"mt-2\">{action}</div> : null}\n    </div>\n  );\n}\n\nexport { EmptyState };\n",
      "type": "registry:ui",
      "target": "components/ui/empty-state.tsx"
    }
  ]
}