{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "table",
  "title": "Table",
  "description": "A plain table styled as a macOS list: grey column titles, stripes and an accent selected row.",
  "registryDependencies": [
    "@cupertinoui/macos-theme"
  ],
  "files": [
    {
      "path": "registry/macos/ui/table.tsx",
      "content": "import * as React from \"react\"\n\nimport { cn } from \"@/lib/utils\"\n\n// A plain table in the style of a macOS list: a header of small grey\n// column titles, 24pt rows with alternating stripes and an accent\n// highlight on the selected row (data-state=\"selected\").\nfunction Table({ className, ...props }: React.ComponentProps<\"table\">) {\n  return (\n    <div data-slot=\"table-container\" className=\"relative w-full overflow-x-auto\">\n      <table data-slot=\"table\" className={cn(\"w-full caption-bottom border-separate border-spacing-0 text-mac-body text-mac-label\", className)} {...props} />\n    </div>\n  )\n}\n\nfunction TableHeader({ className, ...props }: React.ComponentProps<\"thead\">) {\n  return <thead data-slot=\"table-header\" className={cn(\"[&_th]:border-b [&_th]:border-mac-grid\", className)} {...props} />\n}\n\nfunction TableBody({ className, ...props }: React.ComponentProps<\"tbody\">) {\n  return <tbody data-slot=\"table-body\" className={cn(\"[&>tr:nth-child(even)]:bg-mac-content-alternate\", className)} {...props} />\n}\n\nfunction TableFooter({ className, ...props }: React.ComponentProps<\"tfoot\">) {\n  return <tfoot data-slot=\"table-footer\" className={cn(\"font-semibold [&_td]:border-t [&_td]:border-mac-grid\", className)} {...props} />\n}\n\nfunction TableRow({ className, ...props }: React.ComponentProps<\"tr\">) {\n  return (\n    <tr\n      data-slot=\"table-row\"\n      className={cn(\n        \"h-6 data-[state=selected]:bg-mac-selection! data-[state=selected]:text-white [&>td:first-child]:rounded-l-[5px] [&>td:last-child]:rounded-r-[5px]\",\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      className={cn(\"h-7 px-2 text-left align-middle text-mac-subheadline font-medium whitespace-nowrap text-mac-label-secondary [&:has([role=checkbox])]:pr-0\", className)}\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-2 align-middle whitespace-nowrap in-data-[state=selected]:text-white [&:has([role=checkbox])]:pr-0\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction TableCaption({ className, ...props }: React.ComponentProps<\"caption\">) {\n  return <caption data-slot=\"table-caption\" className={cn(\"mt-3 text-mac-subheadline text-mac-label-secondary\", className)} {...props} />\n}\n\nexport { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow }\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}