{
  "$schema": "https://abackui.com/schema/registry-item.json",
  "name": "table",
  "type": "registry:ui",
  "title": "Table",
  "description": "Semantic table primitives for dense data.",
  "registryDependencies": [
    "https://abackui.com/r/utils.json"
  ],
  "categories": [
    "Data Display"
  ],
  "docs": "https://abackui.com/docs/components/table",
  "meta": {
    "status": "stable",
    "usedIn": [
      "aback-launch"
    ]
  },
  "files": [
    {
      "path": "components/ui/table.tsx",
      "content": "import * as React from \"react\";\n\nimport { cn } from \"@/lib/utils\";\n\nexport interface TableProps extends React.ComponentProps<\"table\"> {\n  /** Props for the horizontally scrollable container, which is keyboard focusable. */\n  containerProps?: React.ComponentProps<\"div\">;\n}\n\nfunction Table({ className, containerProps, ...props }: TableProps) {\n  const {\n    className: containerClassName,\n    tabIndex,\n    ...containerRest\n  } = containerProps ?? {};\n\n  return (\n    <div\n      {...containerRest}\n      data-slot=\"table-container\"\n      tabIndex={tabIndex ?? 0}\n      className={cn(\"relative w-full overflow-x-auto\", containerClassName)}\n    >\n      <table\n        data-slot=\"table\"\n        className={cn(\"w-full caption-bottom border-collapse text-sm\", className)}\n        {...props}\n      />\n    </div>\n  );\n}\n\nfunction TableHeader({ className, ...props }: React.ComponentProps<\"thead\">) {\n  return (\n    <thead\n      data-slot=\"table-header\"\n      className={cn(\"bg-muted/40 [&_tr]:border-b [&_tr]:border-border\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction TableBody({ className, ...props }: React.ComponentProps<\"tbody\">) {\n  return (\n    <tbody\n      data-slot=\"table-body\"\n      className={cn(\"[&_tr:last-child]:border-0\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction TableFooter({ className, ...props }: React.ComponentProps<\"tfoot\">) {\n  return (\n    <tfoot\n      data-slot=\"table-footer\"\n      className={cn(\"border-t border-border bg-muted/40 font-medium\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction TableRow({ className, ...props }: React.ComponentProps<\"tr\">) {\n  return (\n    <tr\n      data-slot=\"table-row\"\n      className={cn(\n        \"border-b border-border transition-colors duration-150 hover:bg-muted/40 data-[state=selected]:bg-muted\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction TableHead({ className, ...props }: React.ComponentProps<\"th\">) {\n  return (\n    <th\n      data-slot=\"table-head\"\n      scope=\"col\"\n      className={cn(\n        \"h-9 whitespace-nowrap px-3 text-left align-middle text-xs font-medium uppercase tracking-wide text-muted-foreground\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction TableCell({ className, ...props }: React.ComponentProps<\"td\">) {\n  return (\n    <td\n      data-slot=\"table-cell\"\n      className={cn(\"px-3 py-3 align-middle text-foreground\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction TableCaption({ className, ...props }: React.ComponentProps<\"caption\">) {\n  return (\n    <caption\n      data-slot=\"table-caption\"\n      className={cn(\"mt-4 text-xs text-muted-foreground\", className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Table,\n  TableHeader,\n  TableBody,\n  TableFooter,\n  TableRow,\n  TableHead,\n  TableCell,\n  TableCaption,\n};\n",
      "type": "registry:ui",
      "target": "components/ui/table.tsx"
    }
  ]
}