{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "table-4",
  "type": "registry:component",
  "title": "Table 4",
  "description": "Table 4. A structured layout used to display data in rows and columns, enabling easy comparison, sorting, and organization of information.",
  "dependencies": [],
  "registryDependencies": [
    "badge",
    "table"
  ],
  "files": [
    {
      "path": "components/watermelon/table-4.tsx",
      "type": "registry:component",
      "content": "import {\n  Table,\n  TableBody,\n  TableCell,\n  TableFooter,\n  TableHead,\n  TableHeader,\n  TableRow,\n} from '@/components/base-ui/table';\n\nimport { Badge } from '@/components/base-ui/badge';\nimport { cn } from '@/lib/utils';\n\nconst projects = [\n  {\n    id: 'PRJ-001',\n    name: 'AI Dashboard',\n    team: 'Frontend',\n    status: 'Completed',\n    budget: '₹1,20,000',\n  },\n  {\n    id: 'PRJ-002',\n    name: 'Payment Gateway',\n    team: 'Backend',\n    status: 'In Progress',\n    budget: '₹95,000',\n  },\n  {\n    id: 'PRJ-003',\n    name: 'Mobile App Revamp',\n    team: 'Mobile',\n    status: 'On Hold',\n    budget: '₹70,000',\n  },\n  {\n    id: 'PRJ-004',\n    name: 'Marketing Website',\n    team: 'Design',\n    status: 'Completed',\n    budget: '₹50,000',\n  },\n  {\n    id: 'PRJ-005',\n    name: 'Admin Panel',\n    team: 'Full Stack',\n    status: 'In Progress',\n    budget: '₹1,40,000',\n  },\n];\n\nconst getStatusClass = (status: string) => {\n  switch (status) {\n    case 'Completed':\n      return 'bg-green-600/10 text-green-600 border-green-600/20 dark:bg-green-400/10 dark:text-green-400 dark:border-green-400/20';\n    case 'In Progress':\n      return 'bg-blue-600/10 text-blue-600 border-blue-600/20 dark:bg-blue-400/10 dark:text-blue-400 dark:border-blue-400/20';\n    case 'On Hold':\n      return 'bg-yellow-600/10 text-yellow-600 border-yellow-600/20 dark:bg-yellow-400/10 dark:text-yellow-400 dark:border-yellow-400/20';\n    default:\n      return '';\n  }\n};\n\nconst Table4 = () => {\n  return (\n    <div className=\"w-full\">\n      <div className=\"overflow-hidden\">\n        <Table>\n          <TableHeader>\n            <TableRow className=\"hover:bg-transparent\">\n              <TableHead className=\"w-40\">Project</TableHead>\n              <TableHead>Team</TableHead>\n              <TableHead>Status</TableHead>\n              <TableHead className=\"text-right\">Budget</TableHead>\n            </TableRow>\n          </TableHeader>\n\n          <TableBody>\n            {projects.map((project) => (\n              <TableRow\n                key={project.id}\n                className=\"odd:bg-muted/50 odd:hover:bg-muted/50 odd:shadow-[inset_0px_1px_2px_0px_rgba(255,255,255,1),0px_1px_2px_0px_rgba(0,0,0,0.1)] hover:bg-transparent odd:dark:shadow-[inset_0px_1px_2px_0px_rgba(255,255,255,0.1),0px_1px_2px_0px_rgba(0,0,0,0.7)]\"\n              >\n                <TableCell className=\"font-medium\">{project.name}</TableCell>\n\n                <TableCell>{project.team}</TableCell>\n\n                <TableCell>\n                  <Badge\n                    variant=\"outline\"\n                    className={cn(\n                      getStatusClass(project.status),\n                      'rounded-sm shadow-[inset_0px_1px_2px_0px_rgba(255,255,255,1),inset_0px_-1px_2px_0px_rgba(0,0,0,0.05)] dark:shadow-[inset_0px_1px_2px_0px_rgba(255,255,255,0.25),inset_0px_-1px_2px_0px_rgba(0,0,0,0.7)]',\n                    )}\n                  >\n                    {project.status}\n                  </Badge>\n                </TableCell>\n\n                <TableCell className=\"text-right font-medium\">\n                  {project.budget}\n                </TableCell>\n              </TableRow>\n            ))}\n          </TableBody>\n\n          <TableFooter className=\"bg-transparent\">\n            <TableRow className=\"hover:bg-transparent\">\n              <TableCell colSpan={3}>Total Budget</TableCell>\n              <TableCell className=\"text-right font-semibold\">\n                ₹4,75,000\n              </TableCell>\n            </TableRow>\n          </TableFooter>\n        </Table>\n      </div>\n      <p className=\"text-muted-foreground mt-4 text-center text-sm\">\n        Project tracking table\n      </p>\n    </div>\n  );\n};\n\nexport default Table4;\n"
    }
  ]
}