From 5dd89739cee2b8aeacaf692cea7eef7259988a49 Mon Sep 17 00:00:00 2001
From: Madhura68 <janpetervisser2@gmail.com>
Date: Sat, 25 Apr 2026 19:55:23 +0200
Subject: [PATCH] feat(ST-509): add Table UI primitives (Table, Header, Body,
 Row, Head, Cell)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 components/ui/table.tsx | 41 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)
 create mode 100644 components/ui/table.tsx

diff --git a/components/ui/table.tsx b/components/ui/table.tsx
new file mode 100644
index 0000000..3fe114c
--- /dev/null
+++ b/components/ui/table.tsx
@@ -0,0 +1,41 @@
+import { cn } from '@/lib/utils'
+
+function Table({ className, ...props }: React.ComponentProps<'table'>) {
+  return (
+    <div className="relative w-full overflow-auto">
+      <table className={cn('w-full caption-bottom text-sm', className)} {...props} />
+    </div>
+  )
+}
+
+function TableHeader({ className, ...props }: React.ComponentProps<'thead'>) {
+  return <thead className={cn('[&_tr]:border-b [&_tr]:border-border', className)} {...props} />
+}
+
+function TableBody({ className, ...props }: React.ComponentProps<'tbody'>) {
+  return <tbody className={cn('[&_tr:last-child]:border-0', className)} {...props} />
+}
+
+function TableRow({ className, ...props }: React.ComponentProps<'tr'>) {
+  return (
+    <tr
+      className={cn('border-b border-border transition-colors', className)}
+      {...props}
+    />
+  )
+}
+
+function TableHead({ className, ...props }: React.ComponentProps<'th'>) {
+  return (
+    <th
+      className={cn('h-10 px-3 text-left align-middle text-xs font-medium text-muted-foreground', className)}
+      {...props}
+    />
+  )
+}
+
+function TableCell({ className, ...props }: React.ComponentProps<'td'>) {
+  return <td className={cn('px-3 py-2.5 align-top', className)} {...props} />
+}
+
+export { Table, TableHeader, TableBody, TableRow, TableHead, TableCell }