{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "state-panel",
  "title": "State Panel",
  "description": "Cover empty, loading, error, and access-denied states with clear recovery actions.",
  "dependencies": [
    "lucide-react@^1.33.0"
  ],
  "registryDependencies": [
    "https://components.exe.xyz/r/button.json",
    "https://components.exe.xyz/r/card.json",
    "https://components.exe.xyz/r/empty.json",
    "https://components.exe.xyz/r/skeleton.json"
  ],
  "files": [
    {
      "path": "src/components/blocks/state-panel.tsx",
      "content": "import { AlertTriangle, Archive, LockKeyhole, RotateCcw } from \"lucide-react\"\n\nimport { Button } from \"@/components/ui/button\"\nimport { Card } from \"@/components/ui/card\"\nimport {\n  Empty,\n  EmptyDescription,\n  EmptyHeader,\n  EmptyMedia,\n  EmptyTitle,\n} from \"@/components/ui/empty\"\nimport { Skeleton } from \"@/components/ui/skeleton\"\n\nexport function StatePanel({\n  state = \"empty\",\n}: {\n  state?: \"empty\" | \"loading\" | \"error\" | \"denied\"\n}) {\n  if (state === \"loading\")\n    return (\n      <Card className=\"space-y-3 p-6\">\n        <Skeleton className=\"h-5 w-36\" />\n        <Skeleton className=\"h-24 w-full\" />\n        <div className=\"flex gap-2\">\n          <Skeleton className=\"h-8 w-24\" />\n          <Skeleton className=\"h-8 w-20\" />\n        </div>\n      </Card>\n    )\n\n  const config =\n    state === \"error\"\n      ? {\n          icon: AlertTriangle,\n          title: \"Couldn’t load this view\",\n          body: \"The request timed out. Your filters are still saved.\",\n          action: \"Try again\",\n        }\n      : state === \"denied\"\n        ? {\n            icon: LockKeyhole,\n            title: \"Permission required\",\n            body: \"Ask a workspace admin for access to this area.\",\n            action: \"Request access\",\n          }\n        : {\n            icon: Archive,\n            title: \"No records yet\",\n            body: \"Create the first record or change your current filters.\",\n            action: \"Create record\",\n          }\n  const Icon = config.icon\n\n  return (\n    <Empty className=\"border\">\n      <EmptyHeader>\n        <EmptyMedia variant=\"icon\">\n          <Icon />\n        </EmptyMedia>\n        <EmptyTitle>{config.title}</EmptyTitle>\n        <EmptyDescription>{config.body}</EmptyDescription>\n      </EmptyHeader>\n      <Button size=\"sm\">\n        {state === \"error\" && <RotateCcw />}\n        {config.action}\n      </Button>\n    </Empty>\n  )\n}\n",
      "type": "registry:block"
    }
  ],
  "type": "registry:block"
}