{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "role-permission-matrix",
  "type": "registry:ui",
  "title": "Role permission matrix",
  "description": "Role and permission matrix with roles as columns and permissions as rows, each cell a labelled checkbox. Scrolls sideways on small screens, styled in Tailwind.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.minidev.pro/r/checkbox.json",
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/role-permission-matrix.tsx",
      "type": "registry:ui",
      "target": "components/ui/role-permission-matrix.tsx",
      "content": "\"use client\"\nimport { Checkbox } from \"@/components/ui/checkbox\"\nimport { cn } from \"@/lib/utils\"\n\n/** A permissions table with one checkbox per role and capability, for workspace access settings. */\ntype RolePermissionMatrixProps = {\n  /** Column headers. Defaults to Lumen's three workspace roles. */\n  roles?: string[]\n  /** Row labels, one per capability. */\n  permissions?: string[]\n  className?: string\n}\n\nconst SAMPLE_ROLES = [\"Owner\", \"Admin\", \"Member\"]\nconst SAMPLE_PERMISSIONS = [\"Read\", \"Comment\", \"Edit\", \"Delete\", \"Invite members\", \"Manage billing\"]\n\nfunction RolePermissionMatrix({\n  roles = SAMPLE_ROLES,\n  permissions = SAMPLE_PERMISSIONS,\n  className,\n}: RolePermissionMatrixProps) {\n  return (\n    <div data-slot=\"role-permission-matrix\" className={cn(\"w-full max-w-xl overflow-x-auto rounded-xl border border-border bg-surface\", className)}>\n      <table className=\"w-full text-sm\">\n        <thead>\n          <tr className=\"border-b border-border bg-sunken\">\n            <th className=\"px-3 py-2 text-left text-xs text-fg-muted\">Permission</th>\n            {roles.map((r) => (\n              <th key={r} className=\"px-3 py-2 text-left text-xs text-fg\">\n                {r}\n              </th>\n            ))}\n          </tr>\n        </thead>\n        <tbody>\n          {permissions.map((p) => (\n            <tr key={p} className=\"border-b border-border last:border-b-0\">\n              <td className=\"px-3 py-2 text-fg-muted\">{p}</td>\n              {roles.map((r) => (\n                <td key={r} className=\"px-3 py-2\">\n                  <Checkbox aria-label={`${r} ${p}`} defaultChecked={r !== \"Member\" || p === \"Read\"} />\n                </td>\n              ))}\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </div>\n  )\n}\nexport { RolePermissionMatrix }\nexport type { RolePermissionMatrixProps }\n"
    }
  ]
}