Jensin commited on
Commit
2231a4d
·
verified ·
1 Parent(s): 7b79b0e

Upload components/ui/table.jsx with huggingface_hub

Browse files
Files changed (1) hide show
  1. components/ui/table.jsx +89 -0
components/ui/table.jsx ADDED
@@ -0,0 +1,89 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ import * as React from "react"
2
+ import { cn } from "@/lib/utils"
3
+
4
+ const Table = React.forwardRef(({ className, ...props }, ref) => (
5
+ <div className="relative w-full overflow-auto">
6
+ <table
7
+ ref={ref}
8
+ className={cn("w-full caption-bottom text-sm", className)}
9
+ {...props}
10
+ />
11
+ </div>
12
+ ))
13
+ Table.displayName = "Table"
14
+
15
+ const TableHeader = React.forwardRef(({ className, ...props }, ref) => (
16
+ <thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />
17
+ ))
18
+ TableHeader.displayName = "TableHeader"
19
+
20
+ const TableBody = React.forwardRef(({ className, ...props }, ref) => (
21
+ <tbody
22
+ ref={ref}
23
+ className={cn("[&_tr:last-child]:border-0", className)}
24
+ {...props}
25
+ />
26
+ ))
27
+ TableBody.displayName = "TableBody"
28
+
29
+ const TableFooter = React.forwardRef(({ className, ...props }, ref) => (
30
+ <tfoot
31
+ ref={ref}
32
+ className={cn("bg-primary font-medium text-primary-foreground", className)}
33
+ {...props}
34
+ />
35
+ ))
36
+ TableFooter.displayName = "TableFooter"
37
+
38
+ const TableRow = React.forwardRef(({ className, ...props }, ref) => (
39
+ <tr
40
+ ref={ref}
41
+ className={cn(
42
+ "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
43
+ className
44
+ )}
45
+ {...props}
46
+ />
47
+ ))
48
+ TableRow.displayName = "TableRow"
49
+
50
+ const TableHead = React.forwardRef(({ className, ...props }, ref) => (
51
+ <th
52
+ ref={ref}
53
+ className={cn(
54
+ "h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",
55
+ className
56
+ )}
57
+ {...props}
58
+ />
59
+ ))
60
+ TableHead.displayName = "TableHead"
61
+
62
+ const TableCell = React.forwardRef(({ className, ...props }, ref) => (
63
+ <td
64
+ ref={ref}
65
+ className={cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className)}
66
+ {...props}
67
+ />
68
+ ))
69
+ TableCell.displayName = "TableCell"
70
+
71
+ const TableCaption = React.forwardRef(({ className, ...props }, ref) => (
72
+ <caption
73
+ ref={ref}
74
+ className={cn("mt-4 text-sm text-muted-foreground", className)}
75
+ {...props}
76
+ />
77
+ ))
78
+ TableCaption.displayName = "TableCaption"
79
+
80
+ export {
81
+ Table,
82
+ TableHeader,
83
+ TableBody,
84
+ TableFooter,
85
+ TableHead,
86
+ TableRow,
87
+ TableCell,
88
+ TableCaption,
89
+ }