{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "comp-474",
  "type": "registry:component",
  "title": "Comp 474",
  "description": "Comp 474",
  "files": [
    {
      "path": "registry/ui-basic/comp-474.tsx",
      "content": "import { Table, TableBody, TableCell, TableRow } from \"@/components/ui/table\";\r\n\r\nexport default function Component() {\r\n\treturn (\r\n\t\t<div className=\"mx-auto max-w-lg\">\r\n\t\t\t<div className=\"bg-background overflow-hidden rounded-md border\">\r\n\t\t\t\t<Table>\r\n\t\t\t\t\t<TableBody>\r\n\t\t\t\t\t\t<TableRow className=\"*:border-border hover:bg-transparent [&>:not(:last-child)]:border-r\">\r\n\t\t\t\t\t\t\t<TableCell className=\"bg-muted/50 py-2 font-medium\">\r\n\t\t\t\t\t\t\t\tName\r\n\t\t\t\t\t\t\t</TableCell>\r\n\t\t\t\t\t\t\t<TableCell className=\"py-2\">David Kim</TableCell>\r\n\t\t\t\t\t\t</TableRow>\r\n\t\t\t\t\t\t<TableRow className=\"*:border-border hover:bg-transparent [&>:not(:last-child)]:border-r\">\r\n\t\t\t\t\t\t\t<TableCell className=\"bg-muted/50 py-2 font-medium\">\r\n\t\t\t\t\t\t\t\tEmail\r\n\t\t\t\t\t\t\t</TableCell>\r\n\t\t\t\t\t\t\t<TableCell className=\"py-2\">d.kim@company.com</TableCell>\r\n\t\t\t\t\t\t</TableRow>\r\n\t\t\t\t\t\t<TableRow className=\"*:border-border hover:bg-transparent [&>:not(:last-child)]:border-r\">\r\n\t\t\t\t\t\t\t<TableCell className=\"bg-muted/50 py-2 font-medium\">\r\n\t\t\t\t\t\t\t\tLocation\r\n\t\t\t\t\t\t\t</TableCell>\r\n\t\t\t\t\t\t\t<TableCell className=\"py-2\">Seoul, KR</TableCell>\r\n\t\t\t\t\t\t</TableRow>\r\n\t\t\t\t\t\t<TableRow className=\"*:border-border hover:bg-transparent [&>:not(:last-child)]:border-r\">\r\n\t\t\t\t\t\t\t<TableCell className=\"bg-muted/50 py-2 font-medium\">\r\n\t\t\t\t\t\t\t\tStatus\r\n\t\t\t\t\t\t\t</TableCell>\r\n\t\t\t\t\t\t\t<TableCell className=\"py-2\">Active</TableCell>\r\n\t\t\t\t\t\t</TableRow>\r\n\t\t\t\t\t\t<TableRow className=\"*:border-border hover:bg-transparent [&>:not(:last-child)]:border-r\">\r\n\t\t\t\t\t\t\t<TableCell className=\"bg-muted/50 py-2 font-medium\">\r\n\t\t\t\t\t\t\t\tBalance\r\n\t\t\t\t\t\t\t</TableCell>\r\n\t\t\t\t\t\t\t<TableCell className=\"py-2\">$1,000.00</TableCell>\r\n\t\t\t\t\t\t</TableRow>\r\n\t\t\t\t\t</TableBody>\r\n\t\t\t\t</Table>\r\n\t\t\t</div>\r\n\t\t\t<p className=\"text-muted-foreground mt-4 text-center text-sm\">\r\n\t\t\t\tVertical table\r\n\t\t\t</p>\r\n\t\t</div>\r\n\t);\r\n}\r\n",
      "type": "registry:ui"
    },
    {
      "path": "components/ui/table.tsx",
      "content": "import * as React from \"react\";\n\nimport { cn } from \"@/registry/utilities/cn\";\n\nfunction Table({ className, ...props }: React.ComponentProps<\"table\">) {\n\treturn (\n\t\t<div className=\"relative w-full overflow-auto\">\n\t\t\t<table\n\t\t\t\tdata-slot=\"table\"\n\t\t\t\tclassName={cn(\"w-full caption-bottom text-sm\", className)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction TableHeader({ className, ...props }: React.ComponentProps<\"thead\">) {\n\treturn (\n\t\t<thead data-slot=\"table-header\" className={cn(className)} {...props} />\n\t);\n}\n\nfunction TableBody({ className, ...props }: React.ComponentProps<\"tbody\">) {\n\treturn (\n\t\t<tbody\n\t\t\tdata-slot=\"table-body\"\n\t\t\tclassName={cn(\"[&_tr:last-child]:border-0\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction TableFooter({ className, ...props }: React.ComponentProps<\"tfoot\">) {\n\treturn (\n\t\t<tfoot\n\t\t\tdata-slot=\"table-footer\"\n\t\t\tclassName={cn(\n\t\t\t\t\"bg-muted/50 border-t font-medium last:[&>tr]:border-b-0\",\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction TableRow({ className, ...props }: React.ComponentProps<\"tr\">) {\n\treturn (\n\t\t<tr\n\t\t\tdata-slot=\"table-row\"\n\t\t\tclassName={cn(\n\t\t\t\t\"hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors\",\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction TableHead({ className, ...props }: React.ComponentProps<\"th\">) {\n\treturn (\n\t\t<th\n\t\t\tdata-slot=\"table-head\"\n\t\t\tclassName={cn(\n\t\t\t\t\"text-muted-foreground h-12 px-3 text-left align-middle font-medium has-[role=checkbox]:w-px [&:has([role=checkbox])]:pr-0\",\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction TableCell({ className, ...props }: React.ComponentProps<\"td\">) {\n\treturn (\n\t\t<td\n\t\t\tdata-slot=\"table-cell\"\n\t\t\tclassName={cn(\n\t\t\t\t\"p-3 align-middle [&:has([role=checkbox])]:pr-0\",\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction TableCaption({\n\tclassName,\n\t...props\n}: React.ComponentProps<\"caption\">) {\n\treturn (\n\t\t<caption\n\t\t\tdata-slot=\"table-caption\"\n\t\t\tclassName={cn(\"text-muted-foreground mt-4 text-sm\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport {\n\tTable,\n\tTableBody,\n\tTableCaption,\n\tTableCell,\n\tTableFooter,\n\tTableHead,\n\tTableHeader,\n\tTableRow,\n};\n",
      "type": "registry:ui"
    },
    {
      "path": "registry/utilities/cn.ts",
      "content": "import { ClassValue, clsx } from \"clsx\";\r\nimport { twMerge } from \"tailwind-merge\";\r\n\r\nexport function cn(...inputs: ClassValue[]) {\r\n\treturn twMerge(clsx(inputs));\r\n}\r\n",
      "type": "registry:ui"
    }
  ]
}