vite-shadcn-ui-cli 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (66) hide show
  1. package/README.md +52 -0
  2. package/components.json +21 -0
  3. package/eslint.config.js +28 -0
  4. package/index.html +13 -0
  5. package/package.json +55 -0
  6. package/postcss.config.js +6 -0
  7. package/public/vite.svg +1 -0
  8. package/src/App.css +5 -0
  9. package/src/App.tsx +14 -0
  10. package/src/assets/react.svg +1 -0
  11. package/src/components/ui/accordion.tsx +58 -0
  12. package/src/components/ui/alert-dialog.tsx +141 -0
  13. package/src/components/ui/alert.tsx +59 -0
  14. package/src/components/ui/aspect-ratio.tsx +7 -0
  15. package/src/components/ui/avatar.tsx +50 -0
  16. package/src/components/ui/badge.tsx +36 -0
  17. package/src/components/ui/breadcrumb.tsx +115 -0
  18. package/src/components/ui/button.tsx +57 -0
  19. package/src/components/ui/calendar.tsx +66 -0
  20. package/src/components/ui/card.tsx +79 -0
  21. package/src/components/ui/carousel.tsx +262 -0
  22. package/src/components/ui/chart.tsx +365 -0
  23. package/src/components/ui/checkbox.tsx +30 -0
  24. package/src/components/ui/collapsible.tsx +11 -0
  25. package/src/components/ui/command.tsx +155 -0
  26. package/src/components/ui/context-menu.tsx +200 -0
  27. package/src/components/ui/dialog.tsx +122 -0
  28. package/src/components/ui/drawer.tsx +118 -0
  29. package/src/components/ui/dropdown-menu.tsx +200 -0
  30. package/src/components/ui/form.tsx +178 -0
  31. package/src/components/ui/hover-card.tsx +29 -0
  32. package/src/components/ui/input-otp.tsx +71 -0
  33. package/src/components/ui/input.tsx +25 -0
  34. package/src/components/ui/label.tsx +26 -0
  35. package/src/components/ui/menubar.tsx +236 -0
  36. package/src/components/ui/navigation-menu.tsx +128 -0
  37. package/src/components/ui/pagination.tsx +67 -0
  38. package/src/components/ui/popover.tsx +31 -0
  39. package/src/components/ui/progress.tsx +28 -0
  40. package/src/components/ui/radio-group.tsx +44 -0
  41. package/src/components/ui/resizable.tsx +45 -0
  42. package/src/components/ui/scroll-area.tsx +48 -0
  43. package/src/components/ui/select.tsx +160 -0
  44. package/src/components/ui/separator.tsx +31 -0
  45. package/src/components/ui/sheet.tsx +140 -0
  46. package/src/components/ui/skeleton.tsx +15 -0
  47. package/src/components/ui/slider.tsx +28 -0
  48. package/src/components/ui/sonner.tsx +31 -0
  49. package/src/components/ui/switch.tsx +29 -0
  50. package/src/components/ui/table.tsx +117 -0
  51. package/src/components/ui/tabs.tsx +55 -0
  52. package/src/components/ui/textarea.tsx +24 -0
  53. package/src/components/ui/toast.tsx +129 -0
  54. package/src/components/ui/toaster.tsx +35 -0
  55. package/src/components/ui/toggle-group.tsx +61 -0
  56. package/src/components/ui/toggle.tsx +45 -0
  57. package/src/components/ui/tooltip.tsx +30 -0
  58. package/src/index.css +93 -0
  59. package/src/lib/utils.ts +6 -0
  60. package/src/main.tsx +10 -0
  61. package/src/vite-env.d.ts +1 -0
  62. package/tailwind.config.js +57 -0
  63. package/tsconfig.app.json +32 -0
  64. package/tsconfig.json +17 -0
  65. package/tsconfig.node.json +24 -0
  66. package/vite.config.ts +12 -0
@@ -0,0 +1,29 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+ import * as SwitchPrimitives from "@radix-ui/react-switch"
5
+
6
+ import { cn } from "@/lib/utils"
7
+
8
+ const Switch = React.forwardRef<
9
+ React.ElementRef<typeof SwitchPrimitives.Root>,
10
+ React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root>
11
+ >(({ className, ...props }, ref) => (
12
+ <SwitchPrimitives.Root
13
+ className={cn(
14
+ "peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
15
+ className
16
+ )}
17
+ {...props}
18
+ ref={ref}
19
+ >
20
+ <SwitchPrimitives.Thumb
21
+ className={cn(
22
+ "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
23
+ )}
24
+ />
25
+ </SwitchPrimitives.Root>
26
+ ))
27
+ Switch.displayName = SwitchPrimitives.Root.displayName
28
+
29
+ export { Switch }
@@ -0,0 +1,117 @@
1
+ import * as React from "react"
2
+
3
+ import { cn } from "@/lib/utils"
4
+
5
+ const Table = React.forwardRef<
6
+ HTMLTableElement,
7
+ React.HTMLAttributes<HTMLTableElement>
8
+ >(({ className, ...props }, ref) => (
9
+ <div className="relative w-full overflow-auto bg-white">
10
+ <table
11
+ ref={ref}
12
+ className={cn("w-full caption-bottom text-sm", className)}
13
+ {...props}
14
+ />
15
+ </div>
16
+ ))
17
+ Table.displayName = "Table"
18
+
19
+ const TableHeader = React.forwardRef<
20
+ HTMLTableSectionElement,
21
+ React.HTMLAttributes<HTMLTableSectionElement>
22
+ >(({ className, ...props }, ref) => (
23
+ <thead ref={ref} className={cn("[&_tr]:border-b", className)} {...props} />
24
+ ))
25
+ TableHeader.displayName = "TableHeader"
26
+
27
+ const TableBody = React.forwardRef<
28
+ HTMLTableSectionElement,
29
+ React.HTMLAttributes<HTMLTableSectionElement>
30
+ >(({ className, ...props }, ref) => (
31
+ <tbody
32
+ ref={ref}
33
+ className={cn("[&_tr:last-child]:border-0", className)}
34
+ {...props}
35
+ />
36
+ ))
37
+ TableBody.displayName = "TableBody"
38
+
39
+ const TableFooter = React.forwardRef<
40
+ HTMLTableSectionElement,
41
+ React.HTMLAttributes<HTMLTableSectionElement>
42
+ >(({ className, ...props }, ref) => (
43
+ <tfoot
44
+ ref={ref}
45
+ className={cn(
46
+ "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
47
+ className
48
+ )}
49
+ {...props}
50
+ />
51
+ ))
52
+ TableFooter.displayName = "TableFooter"
53
+
54
+ const TableRow = React.forwardRef<
55
+ HTMLTableRowElement,
56
+ React.HTMLAttributes<HTMLTableRowElement>
57
+ >(({ className, ...props }, ref) => (
58
+ <tr
59
+ ref={ref}
60
+ className={cn(
61
+ "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
62
+ className
63
+ )}
64
+ {...props}
65
+ />
66
+ ))
67
+ TableRow.displayName = "TableRow"
68
+
69
+ const TableHead = React.forwardRef<
70
+ HTMLTableCellElement,
71
+ React.ThHTMLAttributes<HTMLTableCellElement>
72
+ >(({ className, ...props }, ref) => (
73
+ <th
74
+ ref={ref}
75
+ className={cn(
76
+ "h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0",
77
+ className
78
+ )}
79
+ {...props}
80
+ />
81
+ ))
82
+ TableHead.displayName = "TableHead"
83
+
84
+ const TableCell = React.forwardRef<
85
+ HTMLTableCellElement,
86
+ React.TdHTMLAttributes<HTMLTableCellElement>
87
+ >(({ className, ...props }, ref) => (
88
+ <td
89
+ ref={ref}
90
+ className={cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className)}
91
+ {...props}
92
+ />
93
+ ))
94
+ TableCell.displayName = "TableCell"
95
+
96
+ const TableCaption = React.forwardRef<
97
+ HTMLTableCaptionElement,
98
+ React.HTMLAttributes<HTMLTableCaptionElement>
99
+ >(({ className, ...props }, ref) => (
100
+ <caption
101
+ ref={ref}
102
+ className={cn("mt-4 text-sm text-muted-foreground", className)}
103
+ {...props}
104
+ />
105
+ ))
106
+ TableCaption.displayName = "TableCaption"
107
+
108
+ export {
109
+ Table,
110
+ TableHeader,
111
+ TableBody,
112
+ TableFooter,
113
+ TableHead,
114
+ TableRow,
115
+ TableCell,
116
+ TableCaption,
117
+ }
@@ -0,0 +1,55 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+ import * as TabsPrimitive from "@radix-ui/react-tabs"
5
+
6
+ import { cn } from "@/lib/utils"
7
+
8
+ const Tabs = TabsPrimitive.Root
9
+
10
+ const TabsList = React.forwardRef<
11
+ React.ElementRef<typeof TabsPrimitive.List>,
12
+ React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>
13
+ >(({ className, ...props }, ref) => (
14
+ <TabsPrimitive.List
15
+ ref={ref}
16
+ className={cn(
17
+ "inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground",
18
+ className
19
+ )}
20
+ {...props}
21
+ />
22
+ ))
23
+ TabsList.displayName = TabsPrimitive.List.displayName
24
+
25
+ const TabsTrigger = React.forwardRef<
26
+ React.ElementRef<typeof TabsPrimitive.Trigger>,
27
+ React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>
28
+ >(({ className, ...props }, ref) => (
29
+ <TabsPrimitive.Trigger
30
+ ref={ref}
31
+ className={cn(
32
+ "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
33
+ className
34
+ )}
35
+ {...props}
36
+ />
37
+ ))
38
+ TabsTrigger.displayName = TabsPrimitive.Trigger.displayName
39
+
40
+ const TabsContent = React.forwardRef<
41
+ React.ElementRef<typeof TabsPrimitive.Content>,
42
+ React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>
43
+ >(({ className, ...props }, ref) => (
44
+ <TabsPrimitive.Content
45
+ ref={ref}
46
+ className={cn(
47
+ "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
48
+ className
49
+ )}
50
+ {...props}
51
+ />
52
+ ))
53
+ TabsContent.displayName = TabsPrimitive.Content.displayName
54
+
55
+ export { Tabs, TabsList, TabsTrigger, TabsContent }
@@ -0,0 +1,24 @@
1
+ import * as React from "react"
2
+
3
+ import { cn } from "@/lib/utils"
4
+
5
+ export interface TextareaProps
6
+ extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
7
+
8
+ const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
9
+ ({ className, ...props }, ref) => {
10
+ return (
11
+ <textarea
12
+ className={cn(
13
+ "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
14
+ className
15
+ )}
16
+ ref={ref}
17
+ {...props}
18
+ />
19
+ )
20
+ }
21
+ )
22
+ Textarea.displayName = "Textarea"
23
+
24
+ export { Textarea }
@@ -0,0 +1,129 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+ import * as ToastPrimitives from "@radix-ui/react-toast"
5
+ import { cva, type VariantProps } from "class-variance-authority"
6
+ import { X } from "lucide-react"
7
+
8
+ import { cn } from "@/lib/utils"
9
+
10
+ const ToastProvider = ToastPrimitives.Provider
11
+
12
+ const ToastViewport = React.forwardRef<
13
+ React.ElementRef<typeof ToastPrimitives.Viewport>,
14
+ React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>
15
+ >(({ className, ...props }, ref) => (
16
+ <ToastPrimitives.Viewport
17
+ ref={ref}
18
+ className={cn(
19
+ "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
20
+ className
21
+ )}
22
+ {...props}
23
+ />
24
+ ))
25
+ ToastViewport.displayName = ToastPrimitives.Viewport.displayName
26
+
27
+ const toastVariants = cva(
28
+ "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
29
+ {
30
+ variants: {
31
+ variant: {
32
+ default: "border bg-background text-foreground",
33
+ destructive:
34
+ "destructive group border-destructive bg-destructive text-destructive-foreground",
35
+ },
36
+ },
37
+ defaultVariants: {
38
+ variant: "default",
39
+ },
40
+ }
41
+ )
42
+
43
+ const Toast = React.forwardRef<
44
+ React.ElementRef<typeof ToastPrimitives.Root>,
45
+ React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> &
46
+ VariantProps<typeof toastVariants>
47
+ >(({ className, variant, ...props }, ref) => {
48
+ return (
49
+ <ToastPrimitives.Root
50
+ ref={ref}
51
+ className={cn(toastVariants({ variant }), className)}
52
+ {...props}
53
+ />
54
+ )
55
+ })
56
+ Toast.displayName = ToastPrimitives.Root.displayName
57
+
58
+ const ToastAction = React.forwardRef<
59
+ React.ElementRef<typeof ToastPrimitives.Action>,
60
+ React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>
61
+ >(({ className, ...props }, ref) => (
62
+ <ToastPrimitives.Action
63
+ ref={ref}
64
+ className={cn(
65
+ "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
66
+ className
67
+ )}
68
+ {...props}
69
+ />
70
+ ))
71
+ ToastAction.displayName = ToastPrimitives.Action.displayName
72
+
73
+ const ToastClose = React.forwardRef<
74
+ React.ElementRef<typeof ToastPrimitives.Close>,
75
+ React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>
76
+ >(({ className, ...props }, ref) => (
77
+ <ToastPrimitives.Close
78
+ ref={ref}
79
+ className={cn(
80
+ "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
81
+ className
82
+ )}
83
+ toast-close=""
84
+ {...props}
85
+ >
86
+ <X className="h-4 w-4" />
87
+ </ToastPrimitives.Close>
88
+ ))
89
+ ToastClose.displayName = ToastPrimitives.Close.displayName
90
+
91
+ const ToastTitle = React.forwardRef<
92
+ React.ElementRef<typeof ToastPrimitives.Title>,
93
+ React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title>
94
+ >(({ className, ...props }, ref) => (
95
+ <ToastPrimitives.Title
96
+ ref={ref}
97
+ className={cn("text-sm font-semibold", className)}
98
+ {...props}
99
+ />
100
+ ))
101
+ ToastTitle.displayName = ToastPrimitives.Title.displayName
102
+
103
+ const ToastDescription = React.forwardRef<
104
+ React.ElementRef<typeof ToastPrimitives.Description>,
105
+ React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description>
106
+ >(({ className, ...props }, ref) => (
107
+ <ToastPrimitives.Description
108
+ ref={ref}
109
+ className={cn("text-sm opacity-90", className)}
110
+ {...props}
111
+ />
112
+ ))
113
+ ToastDescription.displayName = ToastPrimitives.Description.displayName
114
+
115
+ type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>
116
+
117
+ type ToastActionElement = React.ReactElement<typeof ToastAction>
118
+
119
+ export {
120
+ type ToastProps,
121
+ type ToastActionElement,
122
+ ToastProvider,
123
+ ToastViewport,
124
+ Toast,
125
+ ToastTitle,
126
+ ToastDescription,
127
+ ToastClose,
128
+ ToastAction,
129
+ }
@@ -0,0 +1,35 @@
1
+ "use client"
2
+
3
+ import { useToast } from "@/hooks/use-toast"
4
+ import {
5
+ Toast,
6
+ ToastClose,
7
+ ToastDescription,
8
+ ToastProvider,
9
+ ToastTitle,
10
+ ToastViewport,
11
+ } from "@/components/ui/toast"
12
+
13
+ export function Toaster() {
14
+ const { toasts } = useToast()
15
+
16
+ return (
17
+ <ToastProvider>
18
+ {toasts.map(function ({ id, title, description, action, ...props }) {
19
+ return (
20
+ <Toast key={id} {...props}>
21
+ <div className="grid gap-1">
22
+ {title && <ToastTitle>{title}</ToastTitle>}
23
+ {description && (
24
+ <ToastDescription>{description}</ToastDescription>
25
+ )}
26
+ </div>
27
+ {action}
28
+ <ToastClose />
29
+ </Toast>
30
+ )
31
+ })}
32
+ <ToastViewport />
33
+ </ToastProvider>
34
+ )
35
+ }
@@ -0,0 +1,61 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+ import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group"
5
+ import { type VariantProps } from "class-variance-authority"
6
+
7
+ import { cn } from "@/lib/utils"
8
+ import { toggleVariants } from "@/components/ui/toggle"
9
+
10
+ const ToggleGroupContext = React.createContext<
11
+ VariantProps<typeof toggleVariants>
12
+ >({
13
+ size: "default",
14
+ variant: "default",
15
+ })
16
+
17
+ const ToggleGroup = React.forwardRef<
18
+ React.ElementRef<typeof ToggleGroupPrimitive.Root>,
19
+ React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Root> &
20
+ VariantProps<typeof toggleVariants>
21
+ >(({ className, variant, size, children, ...props }, ref) => (
22
+ <ToggleGroupPrimitive.Root
23
+ ref={ref}
24
+ className={cn("flex items-center justify-center gap-1", className)}
25
+ {...props}
26
+ >
27
+ <ToggleGroupContext.Provider value={{ variant, size }}>
28
+ {children}
29
+ </ToggleGroupContext.Provider>
30
+ </ToggleGroupPrimitive.Root>
31
+ ))
32
+
33
+ ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName
34
+
35
+ const ToggleGroupItem = React.forwardRef<
36
+ React.ElementRef<typeof ToggleGroupPrimitive.Item>,
37
+ React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Item> &
38
+ VariantProps<typeof toggleVariants>
39
+ >(({ className, children, variant, size, ...props }, ref) => {
40
+ const context = React.useContext(ToggleGroupContext)
41
+
42
+ return (
43
+ <ToggleGroupPrimitive.Item
44
+ ref={ref}
45
+ className={cn(
46
+ toggleVariants({
47
+ variant: context.variant || variant,
48
+ size: context.size || size,
49
+ }),
50
+ className
51
+ )}
52
+ {...props}
53
+ >
54
+ {children}
55
+ </ToggleGroupPrimitive.Item>
56
+ )
57
+ })
58
+
59
+ ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName
60
+
61
+ export { ToggleGroup, ToggleGroupItem }
@@ -0,0 +1,45 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+ import * as TogglePrimitive from "@radix-ui/react-toggle"
5
+ import { cva, type VariantProps } from "class-variance-authority"
6
+
7
+ import { cn } from "@/lib/utils"
8
+
9
+ const toggleVariants = cva(
10
+ "inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground",
11
+ {
12
+ variants: {
13
+ variant: {
14
+ default: "bg-transparent",
15
+ outline:
16
+ "border border-input bg-transparent hover:bg-accent hover:text-accent-foreground",
17
+ },
18
+ size: {
19
+ default: "h-10 px-3",
20
+ sm: "h-9 px-2.5",
21
+ lg: "h-11 px-5",
22
+ },
23
+ },
24
+ defaultVariants: {
25
+ variant: "default",
26
+ size: "default",
27
+ },
28
+ }
29
+ )
30
+
31
+ const Toggle = React.forwardRef<
32
+ React.ElementRef<typeof TogglePrimitive.Root>,
33
+ React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root> &
34
+ VariantProps<typeof toggleVariants>
35
+ >(({ className, variant, size, ...props }, ref) => (
36
+ <TogglePrimitive.Root
37
+ ref={ref}
38
+ className={cn(toggleVariants({ variant, size, className }))}
39
+ {...props}
40
+ />
41
+ ))
42
+
43
+ Toggle.displayName = TogglePrimitive.Root.displayName
44
+
45
+ export { Toggle, toggleVariants }
@@ -0,0 +1,30 @@
1
+ "use client"
2
+
3
+ import * as React from "react"
4
+ import * as TooltipPrimitive from "@radix-ui/react-tooltip"
5
+
6
+ import { cn } from "@/lib/utils"
7
+
8
+ const TooltipProvider = TooltipPrimitive.Provider
9
+
10
+ const Tooltip = TooltipPrimitive.Root
11
+
12
+ const TooltipTrigger = TooltipPrimitive.Trigger
13
+
14
+ const TooltipContent = React.forwardRef<
15
+ React.ElementRef<typeof TooltipPrimitive.Content>,
16
+ React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>
17
+ >(({ className, sideOffset = 4, ...props }, ref) => (
18
+ <TooltipPrimitive.Content
19
+ ref={ref}
20
+ sideOffset={sideOffset}
21
+ className={cn(
22
+ "z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
23
+ className
24
+ )}
25
+ {...props}
26
+ />
27
+ ))
28
+ TooltipContent.displayName = TooltipPrimitive.Content.displayName
29
+
30
+ export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }
package/src/index.css ADDED
@@ -0,0 +1,93 @@
1
+ @tailwind base;
2
+ @tailwind components;
3
+ @tailwind utilities;
4
+
5
+ /* ... */
6
+
7
+ @layer base {
8
+ * {
9
+ @apply border-border;
10
+ }
11
+ body {
12
+ @apply bg-background text-foreground;
13
+ font-feature-settings: 'rlig' 1, 'calt' 1;
14
+ }
15
+ }
16
+
17
+ @layer utilities {
18
+ .scrollbar-hide {
19
+ -ms-overflow-style: none; /* IE and Edge */
20
+ scrollbar-width: none; /* Firefox */
21
+ }
22
+ .scrollbar-hide::-webkit-scrollbar {
23
+ display: none; /* Chrome, Safari and Opera */
24
+ }
25
+ .scrollbar-simple::-webkit-scrollbar {
26
+ width: 7px;
27
+ height: 7px;
28
+ }
29
+ .scrollbar-simple::-webkit-scrollbar-thumb {
30
+ background-color: #79797f;
31
+ border-radius: 4px;
32
+ }
33
+ .scrollbar-simple::-webkit-scrollbar-track {
34
+ background-color: #f1f1f1;
35
+ }
36
+ }
37
+
38
+ @layer base {
39
+ :root {
40
+ --background: 0 0% 100%;
41
+ --foreground: 222.2 84% 4.9%;
42
+ --card: 0 0% 100%;
43
+ --card-foreground: 222.2 84% 4.9%;
44
+ --popover: 0 0% 100%;
45
+ --popover-foreground: 222.2 84% 4.9%;
46
+ --primary: 221.2 83.2% 53.3%;
47
+ --primary-foreground: 210 40% 98%;
48
+ --secondary: 210 40% 96.1%;
49
+ --secondary-foreground: 222.2 47.4% 11.2%;
50
+ --muted: 210 40% 96.1%;
51
+ --muted-foreground: 215.4 16.3% 46.9%;
52
+ --accent: 210 40% 96.1%;
53
+ --accent-foreground: 222.2 47.4% 11.2%;
54
+ --destructive: 0 84.2% 60.2%;
55
+ --destructive-foreground: 210 40% 98%;
56
+ --border: 214.3 31.8% 91.4%;
57
+ --input: 214.3 31.8% 91.4%;
58
+ --ring: 221.2 83.2% 53.3%;
59
+ --radius: 0.5rem;
60
+ --chart-1: 12 76% 61%;
61
+ --chart-2: 173 58% 39%;
62
+ --chart-3: 197 37% 24%;
63
+ --chart-4: 43 74% 66%;
64
+ --chart-5: 27 87% 67%;
65
+ }
66
+
67
+ .dark {
68
+ --background: 222.2 84% 4.9%;
69
+ --foreground: 210 40% 98%;
70
+ --card: 222.2 84% 4.9%;
71
+ --card-foreground: 210 40% 98%;
72
+ --popover: 222.2 84% 4.9%;
73
+ --popover-foreground: 210 40% 98%;
74
+ --primary: 217.2 91.2% 59.8%;
75
+ --primary-foreground: 222.2 47.4% 11.2%;
76
+ --secondary: 217.2 32.6% 17.5%;
77
+ --secondary-foreground: 210 40% 98%;
78
+ --muted: 217.2 32.6% 17.5%;
79
+ --muted-foreground: 215 20.2% 65.1%;
80
+ --accent: 217.2 32.6% 17.5%;
81
+ --accent-foreground: 210 40% 98%;
82
+ --destructive: 0 62.8% 30.6%;
83
+ --destructive-foreground: 210 40% 98%;
84
+ --border: 217.2 32.6% 17.5%;
85
+ --input: 217.2 32.6% 17.5%;
86
+ --ring: 224.3 76.3% 48%;
87
+ --chart-1: 220 70% 50%;
88
+ --chart-2: 160 60% 45%;
89
+ --chart-3: 30 80% 55%;
90
+ --chart-4: 280 65% 60%;
91
+ --chart-5: 340 75% 55%;
92
+ }
93
+ }
@@ -0,0 +1,6 @@
1
+ import { clsx, type ClassValue } from "clsx"
2
+ import { twMerge } from "tailwind-merge"
3
+
4
+ export function cn(...inputs: ClassValue[]) {
5
+ return twMerge(clsx(inputs))
6
+ }
package/src/main.tsx ADDED
@@ -0,0 +1,10 @@
1
+ import { StrictMode } from 'react'
2
+ import { createRoot } from 'react-dom/client'
3
+ import './index.css'
4
+ import App from './App.tsx'
5
+
6
+ createRoot(document.getElementById('root')!).render(
7
+ <StrictMode>
8
+ <App />
9
+ </StrictMode>,
10
+ )
@@ -0,0 +1 @@
1
+ /// <reference types="vite/client" />