{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "users-table-page",
  "type": "registry:component",
  "title": "Users table page",
  "description": "A React users admin page with an invite action, a search toolbar that filters rows as you type, and a data table with name, role and status badge columns.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.minidev.pro/r/button.json",
    "https://ui.minidev.pro/r/data-table.json",
    "https://ui.minidev.pro/r/page-header.json",
    "https://ui.minidev.pro/r/status-badge.json",
    "https://ui.minidev.pro/r/table-toolbar.json"
  ],
  "files": [
    {
      "path": "registry/blocks/users-table-page.tsx",
      "type": "registry:ui",
      "target": "components/ui/users-table-page.tsx",
      "content": "\"use client\"\nimport { PageHeader } from \"@/components/ui/page-header\"\nimport { DataTable } from \"@/components/ui/data-table\"\nimport { TableToolbar } from \"@/components/ui/table-toolbar\"\nimport { StatusBadge } from \"@/components/ui/status-badge\"\nimport { Button } from \"@/components/ui/button\"\nimport * as React from \"react\"\nfunction UsersTablePage() {\n  const [q, setQ] = React.useState(\"\")\n  const data = [\n    { id: \"1\", name: \"Aman\", role: \"Owner\", status: \"active\" },\n    { id: \"2\", name: \"Jordan\", role: \"Admin\", status: \"active\" },\n    { id: \"3\", name: \"Sam\", role: \"Member\", status: \"invited\" },\n  ].filter((r) => r.name.toLowerCase().includes(q.toLowerCase()))\n  return (\n    <div data-slot=\"users-table-page\" className=\"space-y-4\">\n      <PageHeader title=\"Users\" description=\"Manage members\" actions={<Button size=\"sm\">Invite</Button>} />\n      <TableToolbar search={q} onSearchChange={setQ} />\n      <DataTable data={data} columns={[\n        { id: \"name\", header: \"Name\", cell: (r) => r.name },\n        { id: \"role\", header: \"Role\", cell: (r) => r.role },\n        { id: \"status\", header: \"Status\", cell: (r) => <StatusBadge tone={r.status===\"active\"?\"success\":\"warning\"}>{r.status}</StatusBadge> },\n      ]} />\n    </div>\n  )\n}\nexport { UsersTablePage }\n"
    }
  ]
}