Skip to content

Commit 8ed8836

Browse files
committed
chore: add shadcn components
1 parent cc8a6a0 commit 8ed8836

File tree

15 files changed

+1799
-3
lines changed

15 files changed

+1799
-3
lines changed

package-lock.json

Lines changed: 698 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,17 @@
1010
"preview": "vite preview"
1111
},
1212
"dependencies": {
13+
"@radix-ui/react-checkbox": "^1.1.4",
1314
"@radix-ui/react-dialog": "^1.1.6",
15+
"@radix-ui/react-popover": "^1.1.6",
16+
"@radix-ui/react-progress": "^1.1.2",
17+
"@radix-ui/react-scroll-area": "^1.2.3",
18+
"@radix-ui/react-select": "^2.1.6",
1419
"@radix-ui/react-separator": "^1.1.2",
1520
"@radix-ui/react-slot": "^1.1.2",
21+
"@radix-ui/react-switch": "^1.1.3",
22+
"@radix-ui/react-tabs": "^1.1.3",
23+
"@radix-ui/react-toggle": "^1.1.2",
1624
"@radix-ui/react-tooltip": "^1.1.8",
1725
"@tailwindcss/vite": "^4.0.7",
1826
"class-variance-authority": "^0.7.1",
@@ -22,6 +30,7 @@
2230
"react": "^19.0.0",
2331
"react-dom": "^19.0.0",
2432
"react-router": "^7.2.0",
33+
"recharts": "^2.15.1",
2534
"tailwind-merge": "^3.0.1",
2635
"tailwindcss": "^4.0.7",
2736
"tailwindcss-animate": "^1.0.7"

src/components/ui/badge.tsx

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
import * as React from "react"
2+
import { Slot } from "@radix-ui/react-slot"
3+
import { cva, type VariantProps } from "class-variance-authority"
4+
5+
import { cn } from "@/lib/utils"
6+
7+
const badgeVariants = cva(
8+
"inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-semibold w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none ring-ring/10 dark:ring-ring/20 dark:outline-ring/40 outline-ring/50 focus-visible:ring-4 focus-visible:outline-1 aria-invalid:focus-visible:ring-0 transition-[color,box-shadow]",
9+
{
10+
variants: {
11+
variant: {
12+
default:
13+
"border-transparent bg-primary text-primary-foreground shadow-sm [a&]:hover:bg-primary/90",
14+
secondary:
15+
"border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
16+
destructive:
17+
"border-transparent bg-destructive text-destructive-foreground shadow-sm [a&]:hover:bg-destructive/90",
18+
outline:
19+
"text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
20+
},
21+
},
22+
defaultVariants: {
23+
variant: "default",
24+
},
25+
}
26+
)
27+
28+
function Badge({
29+
className,
30+
variant,
31+
asChild = false,
32+
...props
33+
}: React.ComponentProps<"span"> &
34+
VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
35+
const Comp = asChild ? Slot : "span"
36+
37+
return (
38+
<Comp
39+
data-slot="badge"
40+
className={cn(badgeVariants({ variant }), className)}
41+
{...props}
42+
/>
43+
)
44+
}
45+
46+
export { Badge, badgeVariants }

src/components/ui/card.tsx

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
import * as React from "react"
2+
3+
import { cn } from "@/lib/utils"
4+
5+
function Card({ className, ...props }: React.ComponentProps<"div">) {
6+
return (
7+
<div
8+
data-slot="card"
9+
className={cn(
10+
"bg-card text-card-foreground rounded-xl border shadow-sm",
11+
className
12+
)}
13+
{...props}
14+
/>
15+
)
16+
}
17+
18+
function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
19+
return (
20+
<div
21+
data-slot="card-header"
22+
className={cn("flex flex-col gap-1.5 p-6", className)}
23+
{...props}
24+
/>
25+
)
26+
}
27+
28+
function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
29+
return (
30+
<div
31+
data-slot="card-title"
32+
className={cn("leading-none font-semibold tracking-tight", className)}
33+
{...props}
34+
/>
35+
)
36+
}
37+
38+
function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
39+
return (
40+
<div
41+
data-slot="card-description"
42+
className={cn("text-muted-foreground text-sm", className)}
43+
{...props}
44+
/>
45+
)
46+
}
47+
48+
function CardContent({ className, ...props }: React.ComponentProps<"div">) {
49+
return (
50+
<div
51+
data-slot="card-content"
52+
className={cn("p-6 pt-0", className)}
53+
{...props}
54+
/>
55+
)
56+
}
57+
58+
function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
59+
return (
60+
<div
61+
data-slot="card-footer"
62+
className={cn("flex items-center p-6 pt-0", className)}
63+
{...props}
64+
/>
65+
)
66+
}
67+
68+
export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }

0 commit comments

Comments
 (0)