lite-math 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.
- package/.eslintrc.json +19 -0
- package/.prettierrc +10 -0
- package/CHANGELOG.md +22 -0
- package/CONTRIBUTING.md +51 -0
- package/LICENSE +21 -0
- package/README.md +213 -0
- package/app/globals.css +125 -0
- package/app/layout.tsx +27 -0
- package/app/page.tsx +7 -0
- package/components/theme-provider.tsx +11 -0
- package/components/ui/accordion.tsx +66 -0
- package/components/ui/alert-dialog.tsx +157 -0
- package/components/ui/alert.tsx +66 -0
- package/components/ui/aspect-ratio.tsx +11 -0
- package/components/ui/avatar.tsx +53 -0
- package/components/ui/badge.tsx +46 -0
- package/components/ui/breadcrumb.tsx +109 -0
- package/components/ui/button-group.tsx +83 -0
- package/components/ui/button.tsx +60 -0
- package/components/ui/calendar.tsx +213 -0
- package/components/ui/card.tsx +92 -0
- package/components/ui/carousel.tsx +241 -0
- package/components/ui/chart.tsx +353 -0
- package/components/ui/checkbox.tsx +32 -0
- package/components/ui/collapsible.tsx +33 -0
- package/components/ui/command.tsx +184 -0
- package/components/ui/context-menu.tsx +252 -0
- package/components/ui/dialog.tsx +143 -0
- package/components/ui/drawer.tsx +135 -0
- package/components/ui/dropdown-menu.tsx +257 -0
- package/components/ui/empty.tsx +104 -0
- package/components/ui/field.tsx +244 -0
- package/components/ui/form.tsx +167 -0
- package/components/ui/hover-card.tsx +44 -0
- package/components/ui/input-group.tsx +169 -0
- package/components/ui/input-otp.tsx +77 -0
- package/components/ui/input.tsx +21 -0
- package/components/ui/item.tsx +193 -0
- package/components/ui/kbd.tsx +28 -0
- package/components/ui/label.tsx +24 -0
- package/components/ui/menubar.tsx +276 -0
- package/components/ui/navigation-menu.tsx +166 -0
- package/components/ui/pagination.tsx +127 -0
- package/components/ui/popover.tsx +48 -0
- package/components/ui/progress.tsx +31 -0
- package/components/ui/radio-group.tsx +45 -0
- package/components/ui/resizable.tsx +56 -0
- package/components/ui/scroll-area.tsx +58 -0
- package/components/ui/select.tsx +185 -0
- package/components/ui/separator.tsx +28 -0
- package/components/ui/sheet.tsx +139 -0
- package/components/ui/sidebar.tsx +726 -0
- package/components/ui/skeleton.tsx +13 -0
- package/components/ui/slider.tsx +63 -0
- package/components/ui/sonner.tsx +25 -0
- package/components/ui/spinner.tsx +16 -0
- package/components/ui/switch.tsx +31 -0
- package/components/ui/table.tsx +116 -0
- package/components/ui/tabs.tsx +66 -0
- package/components/ui/textarea.tsx +18 -0
- package/components/ui/toast.tsx +129 -0
- package/components/ui/toaster.tsx +35 -0
- package/components/ui/toggle-group.tsx +73 -0
- package/components/ui/toggle.tsx +47 -0
- package/components/ui/tooltip.tsx +61 -0
- package/components/ui/use-mobile.tsx +19 -0
- package/components/ui/use-toast.ts +191 -0
- package/components.json +21 -0
- package/dist/advanced/cube-root.d.ts +2 -0
- package/dist/advanced/cube-root.d.ts.map +1 -0
- package/dist/advanced/cube-root.js +4 -0
- package/dist/advanced/cube-root.js.map +1 -0
- package/dist/advanced/factorial.d.ts +2 -0
- package/dist/advanced/factorial.d.ts.map +1 -0
- package/dist/advanced/factorial.js +11 -0
- package/dist/advanced/factorial.js.map +1 -0
- package/dist/advanced/fibonacci.d.ts +2 -0
- package/dist/advanced/fibonacci.d.ts.map +1 -0
- package/dist/advanced/fibonacci.js +15 -0
- package/dist/advanced/fibonacci.js.map +1 -0
- package/dist/advanced/gcd.d.ts +2 -0
- package/dist/advanced/gcd.d.ts.map +1 -0
- package/dist/advanced/gcd.js +10 -0
- package/dist/advanced/gcd.js.map +1 -0
- package/dist/advanced/lcm.d.ts +2 -0
- package/dist/advanced/lcm.d.ts.map +1 -0
- package/dist/advanced/lcm.js +13 -0
- package/dist/advanced/lcm.js.map +1 -0
- package/dist/advanced/power.d.ts +2 -0
- package/dist/advanced/power.d.ts.map +1 -0
- package/dist/advanced/power.js +4 -0
- package/dist/advanced/power.js.map +1 -0
- package/dist/advanced/prime-check.d.ts +2 -0
- package/dist/advanced/prime-check.d.ts.map +1 -0
- package/dist/advanced/prime-check.js +14 -0
- package/dist/advanced/prime-check.js.map +1 -0
- package/dist/advanced/prime-list.d.ts +2 -0
- package/dist/advanced/prime-list.d.ts.map +1 -0
- package/dist/advanced/prime-list.js +14 -0
- package/dist/advanced/prime-list.js.map +1 -0
- package/dist/advanced/sqrt.d.ts +2 -0
- package/dist/advanced/sqrt.d.ts.map +1 -0
- package/dist/advanced/sqrt.js +6 -0
- package/dist/advanced/sqrt.js.map +1 -0
- package/dist/algebra/circle-area.d.ts +2 -0
- package/dist/algebra/circle-area.d.ts.map +1 -0
- package/dist/algebra/circle-area.js +4 -0
- package/dist/algebra/circle-area.js.map +1 -0
- package/dist/algebra/distance.d.ts +2 -0
- package/dist/algebra/distance.d.ts.map +1 -0
- package/dist/algebra/distance.js +4 -0
- package/dist/algebra/distance.js.map +1 -0
- package/dist/algebra/midpoint.d.ts +2 -0
- package/dist/algebra/midpoint.d.ts.map +1 -0
- package/dist/algebra/midpoint.js +4 -0
- package/dist/algebra/midpoint.js.map +1 -0
- package/dist/algebra/slope.d.ts +2 -0
- package/dist/algebra/slope.d.ts.map +1 -0
- package/dist/algebra/slope.js +6 -0
- package/dist/algebra/slope.js.map +1 -0
- package/dist/algebra/solve-linear.d.ts +2 -0
- package/dist/algebra/solve-linear.d.ts.map +1 -0
- package/dist/algebra/solve-linear.js +6 -0
- package/dist/algebra/solve-linear.js.map +1 -0
- package/dist/algebra/solve-quadratic.d.ts +2 -0
- package/dist/algebra/solve-quadratic.d.ts.map +1 -0
- package/dist/algebra/solve-quadratic.js +12 -0
- package/dist/algebra/solve-quadratic.js.map +1 -0
- package/dist/algebra/triangle-area.d.ts +2 -0
- package/dist/algebra/triangle-area.d.ts.map +1 -0
- package/dist/algebra/triangle-area.js +5 -0
- package/dist/algebra/triangle-area.js.map +1 -0
- package/dist/arithmetic/add.d.ts +2 -0
- package/dist/arithmetic/add.d.ts.map +1 -0
- package/dist/arithmetic/add.js +4 -0
- package/dist/arithmetic/add.js.map +1 -0
- package/dist/arithmetic/ceil.d.ts +2 -0
- package/dist/arithmetic/ceil.d.ts.map +1 -0
- package/dist/arithmetic/ceil.js +4 -0
- package/dist/arithmetic/ceil.js.map +1 -0
- package/dist/arithmetic/clamp.d.ts +2 -0
- package/dist/arithmetic/clamp.d.ts.map +1 -0
- package/dist/arithmetic/clamp.js +4 -0
- package/dist/arithmetic/clamp.js.map +1 -0
- package/dist/arithmetic/divide.d.ts +2 -0
- package/dist/arithmetic/divide.d.ts.map +1 -0
- package/dist/arithmetic/divide.js +6 -0
- package/dist/arithmetic/divide.js.map +1 -0
- package/dist/arithmetic/floor.d.ts +2 -0
- package/dist/arithmetic/floor.d.ts.map +1 -0
- package/dist/arithmetic/floor.js +4 -0
- package/dist/arithmetic/floor.js.map +1 -0
- package/dist/arithmetic/modulo.d.ts +2 -0
- package/dist/arithmetic/modulo.d.ts.map +1 -0
- package/dist/arithmetic/modulo.js +4 -0
- package/dist/arithmetic/modulo.js.map +1 -0
- package/dist/arithmetic/multiply.d.ts +2 -0
- package/dist/arithmetic/multiply.d.ts.map +1 -0
- package/dist/arithmetic/multiply.js +4 -0
- package/dist/arithmetic/multiply.js.map +1 -0
- package/dist/arithmetic/percentage.d.ts +2 -0
- package/dist/arithmetic/percentage.d.ts.map +1 -0
- package/dist/arithmetic/percentage.js +4 -0
- package/dist/arithmetic/percentage.js.map +1 -0
- package/dist/arithmetic/round.d.ts +2 -0
- package/dist/arithmetic/round.d.ts.map +1 -0
- package/dist/arithmetic/round.js +5 -0
- package/dist/arithmetic/round.js.map +1 -0
- package/dist/arithmetic/subtract.d.ts +2 -0
- package/dist/arithmetic/subtract.d.ts.map +1 -0
- package/dist/arithmetic/subtract.js +4 -0
- package/dist/arithmetic/subtract.js.map +1 -0
- package/dist/cli.d.ts +3 -0
- package/dist/cli.d.ts.map +1 -0
- package/dist/cli.js +277 -0
- package/dist/cli.js.map +1 -0
- package/dist/convert/c-to-f.d.ts +2 -0
- package/dist/convert/c-to-f.d.ts.map +1 -0
- package/dist/convert/c-to-f.js +4 -0
- package/dist/convert/c-to-f.js.map +1 -0
- package/dist/convert/deg-to-rad.d.ts +2 -0
- package/dist/convert/deg-to-rad.d.ts.map +1 -0
- package/dist/convert/deg-to-rad.js +4 -0
- package/dist/convert/deg-to-rad.js.map +1 -0
- package/dist/convert/f-to-c.d.ts +2 -0
- package/dist/convert/f-to-c.d.ts.map +1 -0
- package/dist/convert/f-to-c.js +4 -0
- package/dist/convert/f-to-c.js.map +1 -0
- package/dist/convert/km-to-miles.d.ts +2 -0
- package/dist/convert/km-to-miles.d.ts.map +1 -0
- package/dist/convert/km-to-miles.js +4 -0
- package/dist/convert/km-to-miles.js.map +1 -0
- package/dist/convert/miles-to-km.d.ts +2 -0
- package/dist/convert/miles-to-km.d.ts.map +1 -0
- package/dist/convert/miles-to-km.js +4 -0
- package/dist/convert/miles-to-km.js.map +1 -0
- package/dist/convert/rad-to-deg.d.ts +2 -0
- package/dist/convert/rad-to-deg.d.ts.map +1 -0
- package/dist/convert/rad-to-deg.js +4 -0
- package/dist/convert/rad-to-deg.js.map +1 -0
- package/dist/index.d.ts +45 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +45 -0
- package/dist/index.js.map +1 -0
- package/dist/random/random-array.d.ts +2 -0
- package/dist/random/random-array.d.ts.map +1 -0
- package/dist/random/random-array.js +4 -0
- package/dist/random/random-array.js.map +1 -0
- package/dist/random/random-float.d.ts +2 -0
- package/dist/random/random-float.d.ts.map +1 -0
- package/dist/random/random-float.js +4 -0
- package/dist/random/random-float.js.map +1 -0
- package/dist/random/random-from-array.d.ts +2 -0
- package/dist/random/random-from-array.d.ts.map +1 -0
- package/dist/random/random-from-array.js +4 -0
- package/dist/random/random-from-array.js.map +1 -0
- package/dist/random/random-int.d.ts +2 -0
- package/dist/random/random-int.d.ts.map +1 -0
- package/dist/random/random-int.js +4 -0
- package/dist/random/random-int.js.map +1 -0
- package/dist/statistics/mean.d.ts +2 -0
- package/dist/statistics/mean.d.ts.map +1 -0
- package/dist/statistics/mean.js +6 -0
- package/dist/statistics/mean.js.map +1 -0
- package/dist/statistics/median.d.ts +2 -0
- package/dist/statistics/median.d.ts.map +1 -0
- package/dist/statistics/median.js +8 -0
- package/dist/statistics/median.js.map +1 -0
- package/dist/statistics/mode.d.ts +2 -0
- package/dist/statistics/mode.d.ts.map +1 -0
- package/dist/statistics/mode.js +13 -0
- package/dist/statistics/mode.js.map +1 -0
- package/dist/statistics/product-array.d.ts +2 -0
- package/dist/statistics/product-array.d.ts.map +1 -0
- package/dist/statistics/product-array.js +4 -0
- package/dist/statistics/product-array.js.map +1 -0
- package/dist/statistics/range.d.ts +2 -0
- package/dist/statistics/range.d.ts.map +1 -0
- package/dist/statistics/range.js +6 -0
- package/dist/statistics/range.js.map +1 -0
- package/dist/statistics/std-dev.d.ts +2 -0
- package/dist/statistics/std-dev.d.ts.map +1 -0
- package/dist/statistics/std-dev.js +10 -0
- package/dist/statistics/std-dev.js.map +1 -0
- package/dist/statistics/sum-array.d.ts +2 -0
- package/dist/statistics/sum-array.d.ts.map +1 -0
- package/dist/statistics/sum-array.js +4 -0
- package/dist/statistics/sum-array.js.map +1 -0
- package/dist/statistics/variance.d.ts +2 -0
- package/dist/statistics/variance.d.ts.map +1 -0
- package/dist/statistics/variance.js +7 -0
- package/dist/statistics/variance.js.map +1 -0
- package/examples/advanced-examples.ts +31 -0
- package/examples/algebra-examples.ts +24 -0
- package/examples/arithmetic-examples.ts +24 -0
- package/examples/conversion-examples.ts +24 -0
- package/examples/statistics-examples.ts +29 -0
- package/hooks/use-mobile.ts +19 -0
- package/hooks/use-toast.ts +191 -0
- package/jest.config.js +15 -0
- package/lib/utils.ts +6 -0
- package/next.config.mjs +11 -0
- package/package.json +110 -0
- package/postcss.config.mjs +8 -0
- package/public/apple-icon.png +0 -0
- package/public/icon-dark-32x32.png +0 -0
- package/public/icon-light-32x32.png +0 -0
- package/public/icon.svg +26 -0
- package/public/placeholder-logo.png +0 -0
- package/public/placeholder-logo.svg +1 -0
- package/public/placeholder-user.jpg +0 -0
- package/public/placeholder.jpg +0 -0
- package/public/placeholder.svg +1 -0
- package/src/advanced/cube-root.ts +8 -0
- package/src/advanced/factorial.ts +12 -0
- package/src/advanced/fibonacci.ts +16 -0
- package/src/advanced/gcd.ts +14 -0
- package/src/advanced/lcm.ts +18 -0
- package/src/advanced/power.ts +9 -0
- package/src/advanced/prime-check.ts +14 -0
- package/src/advanced/prime-list.ts +16 -0
- package/src/advanced/sqrt.ts +9 -0
- package/src/algebra/circle-area.ts +8 -0
- package/src/algebra/distance.ts +11 -0
- package/src/algebra/midpoint.ts +11 -0
- package/src/algebra/slope.ts +12 -0
- package/src/algebra/solve-linear.ts +10 -0
- package/src/algebra/solve-quadratic.ts +15 -0
- package/src/algebra/triangle-area.ts +11 -0
- package/src/arithmetic/add.ts +9 -0
- package/src/arithmetic/ceil.ts +8 -0
- package/src/arithmetic/clamp.ts +10 -0
- package/src/arithmetic/divide.ts +11 -0
- package/src/arithmetic/floor.ts +8 -0
- package/src/arithmetic/modulo.ts +9 -0
- package/src/arithmetic/multiply.ts +9 -0
- package/src/arithmetic/percentage.ts +9 -0
- package/src/arithmetic/round.ts +10 -0
- package/src/arithmetic/subtract.ts +9 -0
- package/src/cli.ts +321 -0
- package/src/convert/c-to-f.ts +8 -0
- package/src/convert/deg-to-rad.ts +8 -0
- package/src/convert/f-to-c.ts +8 -0
- package/src/convert/km-to-miles.ts +8 -0
- package/src/convert/miles-to-km.ts +8 -0
- package/src/convert/rad-to-deg.ts +8 -0
- package/src/index.ts +49 -0
- package/src/random/random-array.ts +10 -0
- package/src/random/random-float.ts +9 -0
- package/src/random/random-from-array.ts +8 -0
- package/src/random/random-int.ts +9 -0
- package/src/statistics/mean.ts +9 -0
- package/src/statistics/median.ts +11 -0
- package/src/statistics/mode.ts +16 -0
- package/src/statistics/product-array.ts +8 -0
- package/src/statistics/range.ts +9 -0
- package/src/statistics/std-dev.ts +14 -0
- package/src/statistics/sum-array.ts +8 -0
- package/src/statistics/variance.ts +10 -0
- package/styles/globals.css +125 -0
- package/tsconfig.json +25 -0
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { cn } from '@/lib/utils'
|
|
2
|
+
|
|
3
|
+
function Skeleton({ className, ...props }: React.ComponentProps<'div'>) {
|
|
4
|
+
return (
|
|
5
|
+
<div
|
|
6
|
+
data-slot="skeleton"
|
|
7
|
+
className={cn('bg-accent animate-pulse rounded-md', className)}
|
|
8
|
+
{...props}
|
|
9
|
+
/>
|
|
10
|
+
)
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
export { Skeleton }
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
'use client'
|
|
2
|
+
|
|
3
|
+
import * as React from 'react'
|
|
4
|
+
import * as SliderPrimitive from '@radix-ui/react-slider'
|
|
5
|
+
|
|
6
|
+
import { cn } from '@/lib/utils'
|
|
7
|
+
|
|
8
|
+
function Slider({
|
|
9
|
+
className,
|
|
10
|
+
defaultValue,
|
|
11
|
+
value,
|
|
12
|
+
min = 0,
|
|
13
|
+
max = 100,
|
|
14
|
+
...props
|
|
15
|
+
}: React.ComponentProps<typeof SliderPrimitive.Root>) {
|
|
16
|
+
const _values = React.useMemo(
|
|
17
|
+
() =>
|
|
18
|
+
Array.isArray(value)
|
|
19
|
+
? value
|
|
20
|
+
: Array.isArray(defaultValue)
|
|
21
|
+
? defaultValue
|
|
22
|
+
: [min, max],
|
|
23
|
+
[value, defaultValue, min, max],
|
|
24
|
+
)
|
|
25
|
+
|
|
26
|
+
return (
|
|
27
|
+
<SliderPrimitive.Root
|
|
28
|
+
data-slot="slider"
|
|
29
|
+
defaultValue={defaultValue}
|
|
30
|
+
value={value}
|
|
31
|
+
min={min}
|
|
32
|
+
max={max}
|
|
33
|
+
className={cn(
|
|
34
|
+
'relative flex w-full touch-none items-center select-none data-[disabled]:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col',
|
|
35
|
+
className,
|
|
36
|
+
)}
|
|
37
|
+
{...props}
|
|
38
|
+
>
|
|
39
|
+
<SliderPrimitive.Track
|
|
40
|
+
data-slot="slider-track"
|
|
41
|
+
className={
|
|
42
|
+
'bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5'
|
|
43
|
+
}
|
|
44
|
+
>
|
|
45
|
+
<SliderPrimitive.Range
|
|
46
|
+
data-slot="slider-range"
|
|
47
|
+
className={
|
|
48
|
+
'bg-primary absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full'
|
|
49
|
+
}
|
|
50
|
+
/>
|
|
51
|
+
</SliderPrimitive.Track>
|
|
52
|
+
{Array.from({ length: _values.length }, (_, index) => (
|
|
53
|
+
<SliderPrimitive.Thumb
|
|
54
|
+
data-slot="slider-thumb"
|
|
55
|
+
key={index}
|
|
56
|
+
className="border-primary ring-ring/50 block size-4 shrink-0 rounded-full border bg-white shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50"
|
|
57
|
+
/>
|
|
58
|
+
))}
|
|
59
|
+
</SliderPrimitive.Root>
|
|
60
|
+
)
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
export { Slider }
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
'use client'
|
|
2
|
+
|
|
3
|
+
import { useTheme } from 'next-themes'
|
|
4
|
+
import { Toaster as Sonner, ToasterProps } from 'sonner'
|
|
5
|
+
|
|
6
|
+
const Toaster = ({ ...props }: ToasterProps) => {
|
|
7
|
+
const { theme = 'system' } = useTheme()
|
|
8
|
+
|
|
9
|
+
return (
|
|
10
|
+
<Sonner
|
|
11
|
+
theme={theme as ToasterProps['theme']}
|
|
12
|
+
className="toaster group"
|
|
13
|
+
style={
|
|
14
|
+
{
|
|
15
|
+
'--normal-bg': 'var(--popover)',
|
|
16
|
+
'--normal-text': 'var(--popover-foreground)',
|
|
17
|
+
'--normal-border': 'var(--border)',
|
|
18
|
+
} as React.CSSProperties
|
|
19
|
+
}
|
|
20
|
+
{...props}
|
|
21
|
+
/>
|
|
22
|
+
)
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
export { Toaster }
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { Loader2Icon } from 'lucide-react'
|
|
2
|
+
|
|
3
|
+
import { cn } from '@/lib/utils'
|
|
4
|
+
|
|
5
|
+
function Spinner({ className, ...props }: React.ComponentProps<'svg'>) {
|
|
6
|
+
return (
|
|
7
|
+
<Loader2Icon
|
|
8
|
+
role="status"
|
|
9
|
+
aria-label="Loading"
|
|
10
|
+
className={cn('size-4 animate-spin', className)}
|
|
11
|
+
{...props}
|
|
12
|
+
/>
|
|
13
|
+
)
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
export { Spinner }
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
'use client'
|
|
2
|
+
|
|
3
|
+
import * as React from 'react'
|
|
4
|
+
import * as SwitchPrimitive from '@radix-ui/react-switch'
|
|
5
|
+
|
|
6
|
+
import { cn } from '@/lib/utils'
|
|
7
|
+
|
|
8
|
+
function Switch({
|
|
9
|
+
className,
|
|
10
|
+
...props
|
|
11
|
+
}: React.ComponentProps<typeof SwitchPrimitive.Root>) {
|
|
12
|
+
return (
|
|
13
|
+
<SwitchPrimitive.Root
|
|
14
|
+
data-slot="switch"
|
|
15
|
+
className={cn(
|
|
16
|
+
'peer data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50',
|
|
17
|
+
className,
|
|
18
|
+
)}
|
|
19
|
+
{...props}
|
|
20
|
+
>
|
|
21
|
+
<SwitchPrimitive.Thumb
|
|
22
|
+
data-slot="switch-thumb"
|
|
23
|
+
className={
|
|
24
|
+
'bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0'
|
|
25
|
+
}
|
|
26
|
+
/>
|
|
27
|
+
</SwitchPrimitive.Root>
|
|
28
|
+
)
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
export { Switch }
|
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
'use client'
|
|
2
|
+
|
|
3
|
+
import * as React from 'react'
|
|
4
|
+
|
|
5
|
+
import { cn } from '@/lib/utils'
|
|
6
|
+
|
|
7
|
+
function Table({ className, ...props }: React.ComponentProps<'table'>) {
|
|
8
|
+
return (
|
|
9
|
+
<div
|
|
10
|
+
data-slot="table-container"
|
|
11
|
+
className="relative w-full overflow-x-auto"
|
|
12
|
+
>
|
|
13
|
+
<table
|
|
14
|
+
data-slot="table"
|
|
15
|
+
className={cn('w-full caption-bottom text-sm', className)}
|
|
16
|
+
{...props}
|
|
17
|
+
/>
|
|
18
|
+
</div>
|
|
19
|
+
)
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
function TableHeader({ className, ...props }: React.ComponentProps<'thead'>) {
|
|
23
|
+
return (
|
|
24
|
+
<thead
|
|
25
|
+
data-slot="table-header"
|
|
26
|
+
className={cn('[&_tr]:border-b', className)}
|
|
27
|
+
{...props}
|
|
28
|
+
/>
|
|
29
|
+
)
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
function TableBody({ className, ...props }: React.ComponentProps<'tbody'>) {
|
|
33
|
+
return (
|
|
34
|
+
<tbody
|
|
35
|
+
data-slot="table-body"
|
|
36
|
+
className={cn('[&_tr:last-child]:border-0', className)}
|
|
37
|
+
{...props}
|
|
38
|
+
/>
|
|
39
|
+
)
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
function TableFooter({ className, ...props }: React.ComponentProps<'tfoot'>) {
|
|
43
|
+
return (
|
|
44
|
+
<tfoot
|
|
45
|
+
data-slot="table-footer"
|
|
46
|
+
className={cn(
|
|
47
|
+
'bg-muted/50 border-t font-medium [&>tr]:last:border-b-0',
|
|
48
|
+
className,
|
|
49
|
+
)}
|
|
50
|
+
{...props}
|
|
51
|
+
/>
|
|
52
|
+
)
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
function TableRow({ className, ...props }: React.ComponentProps<'tr'>) {
|
|
56
|
+
return (
|
|
57
|
+
<tr
|
|
58
|
+
data-slot="table-row"
|
|
59
|
+
className={cn(
|
|
60
|
+
'hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors',
|
|
61
|
+
className,
|
|
62
|
+
)}
|
|
63
|
+
{...props}
|
|
64
|
+
/>
|
|
65
|
+
)
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
function TableHead({ className, ...props }: React.ComponentProps<'th'>) {
|
|
69
|
+
return (
|
|
70
|
+
<th
|
|
71
|
+
data-slot="table-head"
|
|
72
|
+
className={cn(
|
|
73
|
+
'text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]',
|
|
74
|
+
className,
|
|
75
|
+
)}
|
|
76
|
+
{...props}
|
|
77
|
+
/>
|
|
78
|
+
)
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
function TableCell({ className, ...props }: React.ComponentProps<'td'>) {
|
|
82
|
+
return (
|
|
83
|
+
<td
|
|
84
|
+
data-slot="table-cell"
|
|
85
|
+
className={cn(
|
|
86
|
+
'p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]',
|
|
87
|
+
className,
|
|
88
|
+
)}
|
|
89
|
+
{...props}
|
|
90
|
+
/>
|
|
91
|
+
)
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
function TableCaption({
|
|
95
|
+
className,
|
|
96
|
+
...props
|
|
97
|
+
}: React.ComponentProps<'caption'>) {
|
|
98
|
+
return (
|
|
99
|
+
<caption
|
|
100
|
+
data-slot="table-caption"
|
|
101
|
+
className={cn('text-muted-foreground mt-4 text-sm', className)}
|
|
102
|
+
{...props}
|
|
103
|
+
/>
|
|
104
|
+
)
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
export {
|
|
108
|
+
Table,
|
|
109
|
+
TableHeader,
|
|
110
|
+
TableBody,
|
|
111
|
+
TableFooter,
|
|
112
|
+
TableHead,
|
|
113
|
+
TableRow,
|
|
114
|
+
TableCell,
|
|
115
|
+
TableCaption,
|
|
116
|
+
}
|
|
@@ -0,0 +1,66 @@
|
|
|
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
|
+
function Tabs({
|
|
9
|
+
className,
|
|
10
|
+
...props
|
|
11
|
+
}: React.ComponentProps<typeof TabsPrimitive.Root>) {
|
|
12
|
+
return (
|
|
13
|
+
<TabsPrimitive.Root
|
|
14
|
+
data-slot="tabs"
|
|
15
|
+
className={cn('flex flex-col gap-2', className)}
|
|
16
|
+
{...props}
|
|
17
|
+
/>
|
|
18
|
+
)
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
function TabsList({
|
|
22
|
+
className,
|
|
23
|
+
...props
|
|
24
|
+
}: React.ComponentProps<typeof TabsPrimitive.List>) {
|
|
25
|
+
return (
|
|
26
|
+
<TabsPrimitive.List
|
|
27
|
+
data-slot="tabs-list"
|
|
28
|
+
className={cn(
|
|
29
|
+
'bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]',
|
|
30
|
+
className,
|
|
31
|
+
)}
|
|
32
|
+
{...props}
|
|
33
|
+
/>
|
|
34
|
+
)
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
function TabsTrigger({
|
|
38
|
+
className,
|
|
39
|
+
...props
|
|
40
|
+
}: React.ComponentProps<typeof TabsPrimitive.Trigger>) {
|
|
41
|
+
return (
|
|
42
|
+
<TabsPrimitive.Trigger
|
|
43
|
+
data-slot="tabs-trigger"
|
|
44
|
+
className={cn(
|
|
45
|
+
"data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
46
|
+
className,
|
|
47
|
+
)}
|
|
48
|
+
{...props}
|
|
49
|
+
/>
|
|
50
|
+
)
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
function TabsContent({
|
|
54
|
+
className,
|
|
55
|
+
...props
|
|
56
|
+
}: React.ComponentProps<typeof TabsPrimitive.Content>) {
|
|
57
|
+
return (
|
|
58
|
+
<TabsPrimitive.Content
|
|
59
|
+
data-slot="tabs-content"
|
|
60
|
+
className={cn('flex-1 outline-none', className)}
|
|
61
|
+
{...props}
|
|
62
|
+
/>
|
|
63
|
+
)
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
export { Tabs, TabsList, TabsTrigger, TabsContent }
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import * as React from 'react'
|
|
2
|
+
|
|
3
|
+
import { cn } from '@/lib/utils'
|
|
4
|
+
|
|
5
|
+
function Textarea({ className, ...props }: React.ComponentProps<'textarea'>) {
|
|
6
|
+
return (
|
|
7
|
+
<textarea
|
|
8
|
+
data-slot="textarea"
|
|
9
|
+
className={cn(
|
|
10
|
+
'border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
|
|
11
|
+
className,
|
|
12
|
+
)}
|
|
13
|
+
{...props}
|
|
14
|
+
/>
|
|
15
|
+
)
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
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,73 @@
|
|
|
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
|
+
function ToggleGroup({
|
|
18
|
+
className,
|
|
19
|
+
variant,
|
|
20
|
+
size,
|
|
21
|
+
children,
|
|
22
|
+
...props
|
|
23
|
+
}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &
|
|
24
|
+
VariantProps<typeof toggleVariants>) {
|
|
25
|
+
return (
|
|
26
|
+
<ToggleGroupPrimitive.Root
|
|
27
|
+
data-slot="toggle-group"
|
|
28
|
+
data-variant={variant}
|
|
29
|
+
data-size={size}
|
|
30
|
+
className={cn(
|
|
31
|
+
'group/toggle-group flex w-fit items-center rounded-md data-[variant=outline]:shadow-xs',
|
|
32
|
+
className,
|
|
33
|
+
)}
|
|
34
|
+
{...props}
|
|
35
|
+
>
|
|
36
|
+
<ToggleGroupContext.Provider value={{ variant, size }}>
|
|
37
|
+
{children}
|
|
38
|
+
</ToggleGroupContext.Provider>
|
|
39
|
+
</ToggleGroupPrimitive.Root>
|
|
40
|
+
)
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
function ToggleGroupItem({
|
|
44
|
+
className,
|
|
45
|
+
children,
|
|
46
|
+
variant,
|
|
47
|
+
size,
|
|
48
|
+
...props
|
|
49
|
+
}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> &
|
|
50
|
+
VariantProps<typeof toggleVariants>) {
|
|
51
|
+
const context = React.useContext(ToggleGroupContext)
|
|
52
|
+
|
|
53
|
+
return (
|
|
54
|
+
<ToggleGroupPrimitive.Item
|
|
55
|
+
data-slot="toggle-group-item"
|
|
56
|
+
data-variant={context.variant || variant}
|
|
57
|
+
data-size={context.size || size}
|
|
58
|
+
className={cn(
|
|
59
|
+
toggleVariants({
|
|
60
|
+
variant: context.variant || variant,
|
|
61
|
+
size: context.size || size,
|
|
62
|
+
}),
|
|
63
|
+
'min-w-0 flex-1 shrink-0 rounded-none shadow-none first:rounded-l-md last:rounded-r-md focus:z-10 focus-visible:z-10 data-[variant=outline]:border-l-0 data-[variant=outline]:first:border-l',
|
|
64
|
+
className,
|
|
65
|
+
)}
|
|
66
|
+
{...props}
|
|
67
|
+
>
|
|
68
|
+
{children}
|
|
69
|
+
</ToggleGroupPrimitive.Item>
|
|
70
|
+
)
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
export { ToggleGroup, ToggleGroupItem }
|
|
@@ -0,0 +1,47 @@
|
|
|
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 gap-2 rounded-md text-sm font-medium hover:bg-muted hover:text-muted-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0 focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none transition-[color,box-shadow] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive whitespace-nowrap",
|
|
11
|
+
{
|
|
12
|
+
variants: {
|
|
13
|
+
variant: {
|
|
14
|
+
default: 'bg-transparent',
|
|
15
|
+
outline:
|
|
16
|
+
'border border-input bg-transparent shadow-xs hover:bg-accent hover:text-accent-foreground',
|
|
17
|
+
},
|
|
18
|
+
size: {
|
|
19
|
+
default: 'h-9 px-2 min-w-9',
|
|
20
|
+
sm: 'h-8 px-1.5 min-w-8',
|
|
21
|
+
lg: 'h-10 px-2.5 min-w-10',
|
|
22
|
+
},
|
|
23
|
+
},
|
|
24
|
+
defaultVariants: {
|
|
25
|
+
variant: 'default',
|
|
26
|
+
size: 'default',
|
|
27
|
+
},
|
|
28
|
+
},
|
|
29
|
+
)
|
|
30
|
+
|
|
31
|
+
function Toggle({
|
|
32
|
+
className,
|
|
33
|
+
variant,
|
|
34
|
+
size,
|
|
35
|
+
...props
|
|
36
|
+
}: React.ComponentProps<typeof TogglePrimitive.Root> &
|
|
37
|
+
VariantProps<typeof toggleVariants>) {
|
|
38
|
+
return (
|
|
39
|
+
<TogglePrimitive.Root
|
|
40
|
+
data-slot="toggle"
|
|
41
|
+
className={cn(toggleVariants({ variant, size, className }))}
|
|
42
|
+
{...props}
|
|
43
|
+
/>
|
|
44
|
+
)
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
export { Toggle, toggleVariants }
|