@uselets/ui 0.3.0 → 0.5.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/README.md +82 -1
- package/dist/components/accordion.d.ts +31 -0
- package/dist/components/accordion.js +2 -0
- package/dist/components/accordion.js.map +1 -0
- package/dist/components/alert-dialog.d.ts +74 -0
- package/dist/components/alert-dialog.js +2 -0
- package/dist/components/alert-dialog.js.map +1 -0
- package/dist/components/alert.d.ts +1 -1
- package/dist/components/alert.js +1 -1
- package/dist/components/alert.js.map +1 -1
- package/dist/components/anchor.d.ts +24 -0
- package/dist/components/anchor.js +2 -0
- package/dist/components/anchor.js.map +1 -0
- package/dist/components/avatar.d.ts +1 -1
- package/dist/components/avatar.js +1 -1
- package/dist/components/avatar.js.map +1 -1
- package/dist/components/badge.d.ts +22 -0
- package/dist/components/badge.js +2 -0
- package/dist/components/badge.js.map +1 -0
- package/dist/components/breadcrumb.d.ts +47 -0
- package/dist/components/breadcrumb.js +2 -0
- package/dist/components/breadcrumb.js.map +1 -0
- package/dist/components/button-group.d.ts +33 -0
- package/dist/components/button-group.js +2 -0
- package/dist/components/button-group.js.map +1 -0
- package/dist/components/button.d.ts +4 -2
- package/dist/components/button.js +1 -1
- package/dist/components/button.js.map +1 -1
- package/dist/components/calendar.d.ts +34 -0
- package/dist/components/calendar.js +2 -0
- package/dist/components/calendar.js.map +1 -0
- package/dist/components/card.js +1 -1
- package/dist/components/card.js.map +1 -1
- package/dist/components/carousel.d.ts +64 -0
- package/dist/components/carousel.js +2 -0
- package/dist/components/carousel.js.map +1 -0
- package/dist/components/center.d.ts +21 -0
- package/dist/components/center.js +2 -0
- package/dist/components/center.js.map +1 -0
- package/dist/components/chart.d.ts +263 -0
- package/dist/components/chart.js +8 -0
- package/dist/components/chart.js.map +1 -0
- package/dist/components/checkbox.d.ts +2 -2
- package/dist/components/checkbox.js +1 -1
- package/dist/components/checkbox.js.map +1 -1
- package/dist/components/code.d.ts +13 -0
- package/dist/components/code.js +2 -0
- package/dist/components/code.js.map +1 -0
- package/dist/components/collapsible.d.ts +20 -0
- package/dist/components/collapsible.js +2 -0
- package/dist/components/collapsible.js.map +1 -0
- package/dist/components/combobox.d.ts +103 -0
- package/dist/components/combobox.js +2 -0
- package/dist/components/combobox.js.map +1 -0
- package/dist/components/command.d.ts +65 -0
- package/dist/components/command.js +2 -0
- package/dist/components/command.js.map +1 -0
- package/dist/components/container.d.ts +19 -0
- package/dist/components/container.js +2 -0
- package/dist/components/container.js.map +1 -0
- package/dist/components/dialog.d.ts +3 -3
- package/dist/components/dialog.js +1 -1
- package/dist/components/dialog.js.map +1 -1
- package/dist/components/drawer.d.ts +2 -2
- package/dist/components/drawer.js +1 -1
- package/dist/components/drawer.js.map +1 -1
- package/dist/components/dropdown-menu.d.ts +9 -10
- package/dist/components/dropdown-menu.js +1 -1
- package/dist/components/dropdown-menu.js.map +1 -1
- package/dist/components/dropzone.d.ts +107 -0
- package/dist/components/dropzone.js +2 -0
- package/dist/components/dropzone.js.map +1 -0
- package/dist/components/empty.d.ts +1 -1
- package/dist/components/empty.js +1 -1
- package/dist/components/empty.js.map +1 -1
- package/dist/components/field.d.ts +2 -2
- package/dist/components/field.js +1 -1
- package/dist/components/field.js.map +1 -1
- package/dist/components/group.d.ts +21 -0
- package/dist/components/group.js +2 -0
- package/dist/components/group.js.map +1 -0
- package/dist/components/heading.d.ts +22 -0
- package/dist/components/heading.js +2 -0
- package/dist/components/heading.js.map +1 -0
- package/dist/components/hover-card.d.ts +24 -0
- package/dist/components/hover-card.js +2 -0
- package/dist/components/hover-card.js.map +1 -0
- package/dist/components/input-group.d.ts +52 -0
- package/dist/components/input-group.js +2 -0
- package/dist/components/input-group.js.map +1 -0
- package/dist/components/input-otp.js +1 -1
- package/dist/components/input-otp.js.map +1 -1
- package/dist/components/input.js +1 -1
- package/dist/components/input.js.map +1 -1
- package/dist/components/kbd.js +1 -1
- package/dist/components/kbd.js.map +1 -1
- package/dist/components/label.d.ts +1 -1
- package/dist/components/label.js +1 -1
- package/dist/components/label.js.map +1 -1
- package/dist/components/list.d.ts +44 -0
- package/dist/components/list.js +2 -0
- package/dist/components/list.js.map +1 -0
- package/dist/components/native-select.js +1 -1
- package/dist/components/native-select.js.map +1 -1
- package/dist/components/navigation-menu.d.ts +56 -0
- package/dist/components/navigation-menu.js +2 -0
- package/dist/components/navigation-menu.js.map +1 -0
- package/dist/components/pagination.d.ts +54 -0
- package/dist/components/pagination.js +2 -0
- package/dist/components/pagination.js.map +1 -0
- package/dist/components/popover.d.ts +1 -1
- package/dist/components/popover.js +1 -1
- package/dist/components/popover.js.map +1 -1
- package/dist/components/progress.d.ts +15 -0
- package/dist/components/progress.js +2 -0
- package/dist/components/progress.js.map +1 -0
- package/dist/components/radio-group.d.ts +19 -0
- package/dist/components/radio-group.js +2 -0
- package/dist/components/radio-group.js.map +1 -0
- package/dist/components/resizable.d.ts +25 -0
- package/dist/components/resizable.js +2 -0
- package/dist/components/resizable.js.map +1 -0
- package/dist/components/scroll-area.d.ts +21 -0
- package/dist/components/scroll-area.js +2 -0
- package/dist/components/scroll-area.js.map +1 -0
- package/dist/components/select.d.ts +1 -1
- package/dist/components/select.js +1 -1
- package/dist/components/select.js.map +1 -1
- package/dist/components/separator.d.ts +1 -1
- package/dist/components/separator.js +1 -1
- package/dist/components/separator.js.map +1 -1
- package/dist/components/sheet.d.ts +61 -0
- package/dist/components/sheet.js +2 -0
- package/dist/components/sheet.js.map +1 -0
- package/dist/components/sidebar.d.ts +192 -0
- package/dist/components/sidebar.js +2 -0
- package/dist/components/sidebar.js.map +1 -0
- package/dist/components/skeleton.js +1 -1
- package/dist/components/skeleton.js.map +1 -1
- package/dist/components/slider.d.ts +18 -0
- package/dist/components/slider.js +2 -0
- package/dist/components/slider.js.map +1 -0
- package/dist/components/sonner.js +1 -1
- package/dist/components/sonner.js.map +1 -1
- package/dist/components/spinner.d.ts +1 -1
- package/dist/components/spinner.js +1 -1
- package/dist/components/spinner.js.map +1 -1
- package/dist/components/stack.d.ts +19 -0
- package/dist/components/stack.js +2 -0
- package/dist/components/stack.js.map +1 -0
- package/dist/components/switch.d.ts +17 -0
- package/dist/components/switch.js +2 -0
- package/dist/components/switch.js.map +1 -0
- package/dist/components/table.d.ts +48 -0
- package/dist/components/table.js +2 -0
- package/dist/components/table.js.map +1 -0
- package/dist/components/tabs.d.ts +36 -0
- package/dist/components/tabs.js +2 -0
- package/dist/components/tabs.js.map +1 -0
- package/dist/components/text.d.ts +22 -0
- package/dist/components/text.js +2 -0
- package/dist/components/text.js.map +1 -0
- package/dist/components/textarea.d.ts +13 -0
- package/dist/components/textarea.js +2 -0
- package/dist/components/textarea.js.map +1 -0
- package/dist/components/theme.js +1 -1
- package/dist/components/theme.js.map +1 -1
- package/dist/components/timeline.d.ts +63 -0
- package/dist/components/timeline.js +2 -0
- package/dist/components/timeline.js.map +1 -0
- package/dist/components/toggle-group.d.ts +32 -0
- package/dist/components/toggle-group.js +2 -0
- package/dist/components/toggle-group.js.map +1 -0
- package/dist/components/toggle.d.ts +22 -0
- package/dist/components/toggle.js +2 -0
- package/dist/components/toggle.js.map +1 -0
- package/dist/components/tooltip.d.ts +1 -1
- package/dist/components/tooltip.js +1 -1
- package/dist/components/tooltip.js.map +1 -1
- package/dist/hooks/use-mobile.d.ts +7 -0
- package/dist/hooks/use-mobile.js +2 -0
- package/dist/hooks/use-mobile.js.map +1 -0
- package/dist/index.d.ts +46 -4
- package/dist/index.js +1 -1
- package/dist/lib/button.d.ts +16 -0
- package/dist/lib/button.js +2 -0
- package/dist/lib/button.js.map +1 -0
- package/dist/lib/utils.js +1 -1
- package/dist/lib/utils.js.map +1 -1
- package/dist/styles.css +1436 -3
- package/package.json +18 -7
- package/dist/styles.css.map +0 -1
- package/dist/styles.js +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"skeleton.js","names":[],"sources":["../../src/components/skeleton.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\nexport type SkeletonProps = React.ComponentProps<'div'>\n\nfunction Skeleton({ className, ...props }: SkeletonProps) {\n return <div data-slot=\"skeleton\" className={cn('bg-muted rounded-md animate-pulse', className)} {...props} />\n}\n\nexport { Skeleton }\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"skeleton.js","names":[],"sources":["../../src/components/skeleton.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\nexport type SkeletonProps = React.ComponentProps<'div'>\n\nfunction Skeleton({ className, ...props }: SkeletonProps) {\n return <div data-slot=\"skeleton\" className={cn('bg-muted rounded-md animate-pulse', className)} {...props} />\n}\n\nexport { Skeleton }\n"],"mappings":"0GAMA,SAAS,SAAS,CAAE,YAAW,GAAG,GAAwB,CACxD,OAAO,EAAC,MAAD,CAAK,YAAU,WAAW,UAAW,EAAG,oCAAqC,EAAU,CAAE,GAAI,EAAS,CAAA"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { t as __name } from "../chunk-IpJEthwI.js";
|
|
2
|
+
import { Slider as Slider$1 } from "radix-ui";
|
|
3
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
4
|
+
import * as React from "react";
|
|
5
|
+
|
|
6
|
+
//#region src/components/slider.d.ts
|
|
7
|
+
type SliderProps = React.ComponentProps<typeof Slider$1.Root>;
|
|
8
|
+
declare function Slider({
|
|
9
|
+
className,
|
|
10
|
+
defaultValue,
|
|
11
|
+
value,
|
|
12
|
+
min,
|
|
13
|
+
max,
|
|
14
|
+
...props
|
|
15
|
+
}: SliderProps): react_jsx_runtime0.JSX.Element;
|
|
16
|
+
//#endregion
|
|
17
|
+
export { Slider, SliderProps };
|
|
18
|
+
//# sourceMappingURL=slider.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import"../chunk-IpJEthwI.js";import{cn as e}from"../lib/utils.js";import{Slider as t}from"radix-ui";import{jsx as n,jsxs as r}from"react/jsx-runtime";import*as i from"react";function Slider({className:a,defaultValue:o,value:s,min:c=0,max:l=100,...u}){let d=i.useMemo(()=>Array.isArray(s)?s:Array.isArray(o)?o:[c,l],[s,o,c,l]);return r(t.Root,{"data-slot":`slider`,defaultValue:o,value:s,min:c,max:l,className:e(`relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-vertical:h-full data-vertical:min-h-40 data-vertical:w-auto data-vertical:flex-col`,a),...u,children:[n(t.Track,{"data-slot":`slider-track`,className:e(`relative grow overflow-hidden rounded-full bg-muted`,`data-horizontal:h-1 data-horizontal:w-full`,`data-vertical:h-full data-vertical:w-1`),children:n(t.Range,{"data-slot":`slider-range`,className:`absolute bg-primary select-none data-horizontal:h-full data-vertical:w-full`})}),d.map(r=>n(t.Thumb,{"data-slot":`slider-thumb`,className:e(`relative block size-3 shrink-0 rounded-full border border-ring bg-white ring-ring/50`,`transition-[color,box-shadow] select-none after:absolute after:-inset-2`,`hover:ring-3 focus-visible:ring-3 focus-visible:outline-hidden active:ring-3`,`disabled:pointer-events-none disabled:opacity-50`)},r))]})}export{Slider};
|
|
2
|
+
//# sourceMappingURL=slider.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"slider.js","names":["SliderPrimitive"],"sources":["../../src/components/slider.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Slider as SliderPrimitive } from 'radix-ui'\n\nimport { cn } from '../lib/utils'\n\nexport type SliderProps = React.ComponentProps<typeof SliderPrimitive.Root>\n\nfunction Slider({ className, defaultValue, value, min = 0, max = 100, ...props }: SliderProps) {\n const _values = React.useMemo(\n () => (Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min, max]),\n [value, defaultValue, min, max]\n )\n\n return (\n <SliderPrimitive.Root\n data-slot=\"slider\"\n defaultValue={defaultValue}\n value={value}\n min={min}\n max={max}\n className={cn(\n 'relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-vertical:h-full data-vertical:min-h-40 data-vertical:w-auto data-vertical:flex-col',\n className\n )}\n {...props}\n >\n <SliderPrimitive.Track\n data-slot=\"slider-track\"\n className={cn(\n 'relative grow overflow-hidden rounded-full bg-muted',\n 'data-horizontal:h-1 data-horizontal:w-full',\n 'data-vertical:h-full data-vertical:w-1'\n )}\n >\n <SliderPrimitive.Range\n data-slot=\"slider-range\"\n className=\"absolute bg-primary select-none data-horizontal:h-full data-vertical:w-full\"\n />\n </SliderPrimitive.Track>\n {_values.map((value) => (\n <SliderPrimitive.Thumb\n data-slot=\"slider-thumb\"\n key={value}\n className={cn(\n 'relative block size-3 shrink-0 rounded-full border border-ring bg-white ring-ring/50',\n 'transition-[color,box-shadow] select-none after:absolute after:-inset-2',\n 'hover:ring-3 focus-visible:ring-3 focus-visible:outline-hidden active:ring-3',\n 'disabled:pointer-events-none disabled:opacity-50'\n )}\n />\n ))}\n </SliderPrimitive.Root>\n )\n}\n\nexport { Slider }\n"],"mappings":"8KAQA,SAAS,OAAO,CAAE,YAAW,eAAc,QAAO,MAAM,EAAG,MAAM,IAAK,GAAG,GAAsB,CAC7F,IAAM,EAAU,EAAM,YACb,MAAM,QAAQ,EAAM,CAAG,EAAQ,MAAM,QAAQ,EAAa,CAAG,EAAe,CAAC,EAAK,EAAI,CAC7F,CAAC,EAAO,EAAc,EAAK,EAAI,CAChC,CAED,OACE,EAACA,EAAgB,KAAjB,CACE,YAAU,SACI,eACP,QACF,MACA,MACL,UAAW,EACT,4KACA,EACD,CACD,GAAI,WAVN,CAYE,EAACA,EAAgB,MAAjB,CACE,YAAU,eACV,UAAW,EACT,sDACA,6CACA,yCACD,UAED,EAACA,EAAgB,MAAjB,CACE,YAAU,eACV,UAAU,8EACV,CAAA,CACoB,CAAA,CACvB,EAAQ,IAAK,GACZ,EAACA,EAAgB,MAAjB,CACE,YAAU,eAEV,UAAW,EACT,uFACA,0EACA,+EACA,mDACD,CACD,CAPK,EAOL,CACF,CACmB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import"../chunk-IpJEthwI.js";import{IconAlertOctagon as e,IconAlertTriangle as t,IconCircleCheck as n,IconInfoCircle as r,IconLoader as i}from"@tabler/icons-react";import{jsx as a}from"react/jsx-runtime";import{useTheme as o}from"next-themes";import{Toaster as s,toast as c}from"sonner";const Toaster=c=>{let{theme:l=`system`}=o();return a(s,{theme:l,className:`toaster group`,richColors:!0,icons:{success:a(n,{className:`size-4`}),info:a(r,{className:`size-4`}),warning:a(t,{className:`size-4`}),error:a(e,{className:`size-4`}),loading:a(i,{className:`size-4 animate-spin`})},style:{"--normal-bg":`var(--popover)`,"--normal-text":`var(--popover-foreground)`,"--normal-border":`var(--border)`,"--border-radius":`var(--radius)`},toastOptions:{classNames:{toast:`cn-toast`}},...c})};export{Toaster,c as toast};
|
|
2
2
|
//# sourceMappingURL=sonner.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sonner.js","names":["Sonner"],"sources":["../../src/components/sonner.tsx"],"sourcesContent":["import type { CSSProperties } from 'react'\n\nimport { IconAlertOctagon, IconAlertTriangle, IconCircleCheck, IconInfoCircle, IconLoader } from '@tabler/icons-react'\nimport { useTheme } from 'next-themes'\nimport { Toaster as Sonner, type ToasterProps as SonnerToasterProps, toast } from 'sonner'\n\nexport type ToasterProps = SonnerToasterProps\n\nconst Toaster = (props: ToasterProps) => {\n const { theme = 'system' } = useTheme()\n\n return (\n <Sonner\n theme={theme as ToasterProps['theme']}\n className=\"toaster group\"\n richColors\n icons={{\n success: <IconCircleCheck className=\"size-4\" />,\n info: <IconInfoCircle className=\"size-4\" />,\n warning: <IconAlertTriangle className=\"size-4\" />,\n error: <IconAlertOctagon className=\"size-4\" />,\n loading: <IconLoader className=\"size-4 animate-spin\" />\n }}\n style={\n {\n '--normal-bg': 'var(--popover)',\n '--normal-text': 'var(--popover-foreground)',\n '--normal-border': 'var(--border)',\n '--border-radius': 'var(--radius)'\n } as CSSProperties\n }\n toastOptions={{\n classNames: {\n toast: 'cn-toast'\n }\n }}\n {...props}\n />\n )\n}\n\nexport { toast, Toaster }\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"sonner.js","names":["Sonner"],"sources":["../../src/components/sonner.tsx"],"sourcesContent":["import type { CSSProperties } from 'react'\n\nimport { IconAlertOctagon, IconAlertTriangle, IconCircleCheck, IconInfoCircle, IconLoader } from '@tabler/icons-react'\nimport { useTheme } from 'next-themes'\nimport { Toaster as Sonner, type ToasterProps as SonnerToasterProps, toast } from 'sonner'\n\nexport type ToasterProps = SonnerToasterProps\n\nconst Toaster = (props: ToasterProps) => {\n const { theme = 'system' } = useTheme()\n\n return (\n <Sonner\n theme={theme as ToasterProps['theme']}\n className=\"toaster group\"\n richColors\n icons={{\n success: <IconCircleCheck className=\"size-4\" />,\n info: <IconInfoCircle className=\"size-4\" />,\n warning: <IconAlertTriangle className=\"size-4\" />,\n error: <IconAlertOctagon className=\"size-4\" />,\n loading: <IconLoader className=\"size-4 animate-spin\" />\n }}\n style={\n {\n '--normal-bg': 'var(--popover)',\n '--normal-text': 'var(--popover-foreground)',\n '--normal-border': 'var(--border)',\n '--border-radius': 'var(--radius)'\n } as CSSProperties\n }\n toastOptions={{\n classNames: {\n toast: 'cn-toast'\n }\n }}\n {...props}\n />\n )\n}\n\nexport { toast, Toaster }\n"],"mappings":"+RAQA,MAAM,QAAW,GAAwB,CACvC,GAAM,CAAE,QAAQ,UAAa,GAAU,CAEvC,OACE,EAACA,EAAD,CACS,QACP,UAAU,gBACV,WAAA,GACA,MAAO,CACL,QAAS,EAAC,EAAD,CAAiB,UAAU,SAAW,CAAA,CAC/C,KAAM,EAAC,EAAD,CAAgB,UAAU,SAAW,CAAA,CAC3C,QAAS,EAAC,EAAD,CAAmB,UAAU,SAAW,CAAA,CACjD,MAAO,EAAC,EAAD,CAAkB,UAAU,SAAW,CAAA,CAC9C,QAAS,EAAC,EAAD,CAAY,UAAU,sBAAwB,CAAA,CACxD,CACD,MACE,CACE,cAAe,iBACf,gBAAiB,4BACjB,kBAAmB,gBACnB,kBAAmB,gBACpB,CAEH,aAAc,CACZ,WAAY,CACV,MAAO,WACR,CACF,CACD,GAAI,EACJ,CAAA"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { t as __name } from "../chunk-IpJEthwI.js";
|
|
2
|
-
import { VariantProps } from "class-variance-authority";
|
|
3
2
|
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import { VariantProps } from "class-variance-authority";
|
|
4
4
|
import * as React from "react";
|
|
5
5
|
import * as class_variance_authority_types0 from "class-variance-authority/types";
|
|
6
6
|
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import"../chunk-IpJEthwI.js";import{cn as e}from"../lib/utils.js";import{IconLoader as t}from"@tabler/icons-react";import{jsx as n}from"react/jsx-runtime";import{cva as r}from"class-variance-authority";const i=r(`animate-spin`,{variants:{size:{sm:`size-3`,default:`size-4`,lg:`size-5`}},defaultVariants:{size:`default`}});function Spinner({className:r,size:a=`default`,...o}){return n(t,{role:`status`,"aria-label":`Loading`,"data-slot":`spinner`,"data-size":a,className:e(i({size:a}),r),...o})}export{Spinner,i as spinnerVariants};
|
|
2
2
|
//# sourceMappingURL=spinner.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spinner.js","names":[],"sources":["../../src/components/spinner.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { IconLoader } from '@tabler/icons-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nconst spinnerVariants = cva('animate-spin', {\n variants: {\n size: {\n sm: 'size-3',\n default: 'size-4',\n lg: 'size-5'\n }\n },\n defaultVariants: {\n size: 'default'\n }\n})\n\nexport type SpinnerProps = React.ComponentProps<'svg'> & VariantProps<typeof spinnerVariants>\n\nfunction Spinner({ className, size = 'default', ...props }: SpinnerProps) {\n return (\n <IconLoader\n role=\"status\"\n aria-label=\"Loading\"\n data-slot=\"spinner\"\n data-size={size}\n className={cn(spinnerVariants({ size }), className)}\n {...props}\n />\n )\n}\n\nexport { Spinner, spinnerVariants }\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"spinner.js","names":[],"sources":["../../src/components/spinner.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { IconLoader } from '@tabler/icons-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nconst spinnerVariants = cva('animate-spin', {\n variants: {\n size: {\n sm: 'size-3',\n default: 'size-4',\n lg: 'size-5'\n }\n },\n defaultVariants: {\n size: 'default'\n }\n})\n\nexport type SpinnerProps = React.ComponentProps<'svg'> & VariantProps<typeof spinnerVariants>\n\nfunction Spinner({ className, size = 'default', ...props }: SpinnerProps) {\n return (\n <IconLoader\n role=\"status\"\n aria-label=\"Loading\"\n data-slot=\"spinner\"\n data-size={size}\n className={cn(spinnerVariants({ size }), className)}\n {...props}\n />\n )\n}\n\nexport { Spinner, spinnerVariants }\n"],"mappings":"0MAOA,MAAM,EAAkB,EAAI,eAAgB,CAC1C,SAAU,CACR,KAAM,CACJ,GAAI,SACJ,QAAS,SACT,GAAI,SACL,CACF,CACD,gBAAiB,CACf,KAAM,UACP,CACF,CAAC,CAIF,SAAS,QAAQ,CAAE,YAAW,OAAO,UAAW,GAAG,GAAuB,CACxE,OACE,EAAC,EAAD,CACE,KAAK,SACL,aAAW,UACX,YAAU,UACV,YAAW,EACX,UAAW,EAAG,EAAgB,CAAE,OAAM,CAAC,CAAE,EAAU,CACnD,GAAI,EACJ,CAAA"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { t as __name } from "../chunk-IpJEthwI.js";
|
|
2
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import { VariantProps } from "class-variance-authority";
|
|
4
|
+
import * as React from "react";
|
|
5
|
+
import * as class_variance_authority_types0 from "class-variance-authority/types";
|
|
6
|
+
|
|
7
|
+
//#region src/components/stack.d.ts
|
|
8
|
+
declare const stackVariants: (props?: ({
|
|
9
|
+
size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
|
|
10
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
11
|
+
type StackProps = React.ComponentProps<'div'> & VariantProps<typeof stackVariants>;
|
|
12
|
+
declare function Stack({
|
|
13
|
+
className,
|
|
14
|
+
size,
|
|
15
|
+
...props
|
|
16
|
+
}: StackProps): react_jsx_runtime0.JSX.Element;
|
|
17
|
+
//#endregion
|
|
18
|
+
export { Stack, StackProps, stackVariants };
|
|
19
|
+
//# sourceMappingURL=stack.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import"../chunk-IpJEthwI.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";import{cva as n}from"class-variance-authority";const r=n(`flex flex-col`,{variants:{size:{xs:`gap-1`,sm:`gap-2`,md:`gap-3`,lg:`gap-4`,xl:`gap-6`}},defaultVariants:{size:`md`}});function Stack({className:n,size:i=`md`,...a}){return t(`div`,{"data-slot":`stack`,"data-size":i,className:e(r({size:i}),n),...a})}export{Stack,r as stackVariants};
|
|
2
|
+
//# sourceMappingURL=stack.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"stack.js","names":[],"sources":["../../src/components/stack.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\n\nconst stackVariants = cva('flex flex-col', {\n variants: {\n size: {\n xs: 'gap-1',\n sm: 'gap-2',\n md: 'gap-3',\n lg: 'gap-4',\n xl: 'gap-6'\n }\n },\n defaultVariants: {\n size: 'md'\n }\n})\n\nexport type StackProps = React.ComponentProps<'div'> & VariantProps<typeof stackVariants>\n\nfunction Stack({ className, size = 'md', ...props }: StackProps) {\n return <div data-slot=\"stack\" data-size={size} className={cn(stackVariants({ size }), className)} {...props} />\n}\n\nexport { Stack, stackVariants }\n"],"mappings":"yJAMA,MAAM,EAAgB,EAAI,gBAAiB,CACzC,SAAU,CACR,KAAM,CACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACJ,GAAI,QACL,CACF,CACD,gBAAiB,CACf,KAAM,KACP,CACF,CAAC,CAIF,SAAS,MAAM,CAAE,YAAW,OAAO,KAAM,GAAG,GAAqB,CAC/D,OAAO,EAAC,MAAD,CAAK,YAAU,QAAQ,YAAW,EAAM,UAAW,EAAG,EAAc,CAAE,OAAM,CAAC,CAAE,EAAU,CAAE,GAAI,EAAS,CAAA"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { t as __name } from "../chunk-IpJEthwI.js";
|
|
2
|
+
import { Switch as Switch$1 } from "radix-ui";
|
|
3
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
4
|
+
import * as React from "react";
|
|
5
|
+
|
|
6
|
+
//#region src/components/switch.d.ts
|
|
7
|
+
type SwitchProps = React.ComponentProps<typeof Switch$1.Root> & {
|
|
8
|
+
size?: 'sm' | 'default';
|
|
9
|
+
};
|
|
10
|
+
declare function Switch({
|
|
11
|
+
className,
|
|
12
|
+
size,
|
|
13
|
+
...props
|
|
14
|
+
}: SwitchProps): react_jsx_runtime0.JSX.Element;
|
|
15
|
+
//#endregion
|
|
16
|
+
export { Switch, SwitchProps };
|
|
17
|
+
//# sourceMappingURL=switch.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import"../chunk-IpJEthwI.js";import{cn as e}from"../lib/utils.js";import{Switch as t}from"radix-ui";import{jsx as n}from"react/jsx-runtime";function Switch({className:r,size:i=`default`,...a}){return n(t.Root,{"data-slot":`switch`,"data-size":i,className:e(`peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none`,`after:absolute after:-inset-x-3 after:-inset-y-2`,`focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50`,`aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20`,`data-[size=default]:h-[18.4px] data-[size=default]:w-8 data-[size=sm]:h-3.5 data-[size=sm]:w-6`,`dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40`,`data-checked:bg-primary data-unchecked:bg-input dark:data-unchecked:bg-input/80`,`data-disabled:cursor-not-allowed data-disabled:opacity-50`,r),...a,children:n(t.Thumb,{"data-slot":`switch-thumb`,className:e(`pointer-events-none block rounded-full bg-background ring-0 transition-transform`,`group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3`,`group-data-[size=default]/switch:data-checked:translate-x-[calc(100%-2px)]`,`group-data-[size=sm]/switch:data-checked:translate-x-[calc(100%-2px)]`,`group-data-[size=default]/switch:data-unchecked:translate-x-0`,`group-data-[size=sm]/switch:data-unchecked:translate-x-0`,`dark:data-checked:bg-primary-foreground dark:data-unchecked:bg-foreground`)})})}export{Switch};
|
|
2
|
+
//# sourceMappingURL=switch.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"switch.js","names":["SwitchPrimitive"],"sources":["../../src/components/switch.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { Switch as SwitchPrimitive } from 'radix-ui'\n\nimport { cn } from '../lib/utils'\n\nexport type SwitchProps = React.ComponentProps<typeof SwitchPrimitive.Root> & {\n size?: 'sm' | 'default'\n}\n\nfunction Switch({ className, size = 'default', ...props }: SwitchProps) {\n return (\n <SwitchPrimitive.Root\n data-slot=\"switch\"\n data-size={size}\n className={cn(\n 'peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none',\n 'after:absolute after:-inset-x-3 after:-inset-y-2',\n 'focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50',\n 'aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20',\n 'data-[size=default]:h-[18.4px] data-[size=default]:w-8 data-[size=sm]:h-3.5 data-[size=sm]:w-6',\n 'dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40',\n 'data-checked:bg-primary data-unchecked:bg-input dark:data-unchecked:bg-input/80',\n 'data-disabled:cursor-not-allowed data-disabled:opacity-50',\n className\n )}\n {...props}\n >\n <SwitchPrimitive.Thumb\n data-slot=\"switch-thumb\"\n className={cn(\n 'pointer-events-none block rounded-full bg-background ring-0 transition-transform',\n 'group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3',\n 'group-data-[size=default]/switch:data-checked:translate-x-[calc(100%-2px)]',\n 'group-data-[size=sm]/switch:data-checked:translate-x-[calc(100%-2px)]',\n 'group-data-[size=default]/switch:data-unchecked:translate-x-0',\n 'group-data-[size=sm]/switch:data-unchecked:translate-x-0',\n 'dark:data-checked:bg-primary-foreground dark:data-unchecked:bg-foreground'\n )}\n />\n </SwitchPrimitive.Root>\n )\n}\n\nexport { Switch }\n"],"mappings":"4IAUA,SAAS,OAAO,CAAE,YAAW,OAAO,UAAW,GAAG,GAAsB,CACtE,OACE,EAACA,EAAgB,KAAjB,CACE,YAAU,SACV,YAAW,EACX,UAAW,EACT,kIACA,mDACA,4EACA,uFACA,iGACA,gFACA,kFACA,4DACA,EACD,CACD,GAAI,WAEJ,EAACA,EAAgB,MAAjB,CACE,YAAU,eACV,UAAW,EACT,mFACA,6EACA,6EACA,wEACA,gEACA,2DACA,4EACD,CACD,CAAA,CACmB,CAAA"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { t as __name } from "../chunk-IpJEthwI.js";
|
|
2
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
|
|
5
|
+
//#region src/components/table.d.ts
|
|
6
|
+
type TableProps = React.ComponentProps<'table'>;
|
|
7
|
+
type TableHeaderProps = React.ComponentProps<'thead'>;
|
|
8
|
+
type TableBodyProps = React.ComponentProps<'tbody'>;
|
|
9
|
+
type TableFooterProps = React.ComponentProps<'tfoot'>;
|
|
10
|
+
type TableRowProps = React.ComponentProps<'tr'>;
|
|
11
|
+
type TableHeadProps = React.ComponentProps<'th'>;
|
|
12
|
+
type TableCellProps = React.ComponentProps<'td'>;
|
|
13
|
+
type TableCaptionProps = React.ComponentProps<'caption'>;
|
|
14
|
+
declare function Table({
|
|
15
|
+
className,
|
|
16
|
+
...props
|
|
17
|
+
}: TableProps): react_jsx_runtime0.JSX.Element;
|
|
18
|
+
declare function TableHeader({
|
|
19
|
+
className,
|
|
20
|
+
...props
|
|
21
|
+
}: TableHeaderProps): react_jsx_runtime0.JSX.Element;
|
|
22
|
+
declare function TableBody({
|
|
23
|
+
className,
|
|
24
|
+
...props
|
|
25
|
+
}: TableBodyProps): react_jsx_runtime0.JSX.Element;
|
|
26
|
+
declare function TableFooter({
|
|
27
|
+
className,
|
|
28
|
+
...props
|
|
29
|
+
}: TableFooterProps): react_jsx_runtime0.JSX.Element;
|
|
30
|
+
declare function TableRow({
|
|
31
|
+
className,
|
|
32
|
+
...props
|
|
33
|
+
}: TableRowProps): react_jsx_runtime0.JSX.Element;
|
|
34
|
+
declare function TableHead({
|
|
35
|
+
className,
|
|
36
|
+
...props
|
|
37
|
+
}: TableHeadProps): react_jsx_runtime0.JSX.Element;
|
|
38
|
+
declare function TableCell({
|
|
39
|
+
className,
|
|
40
|
+
...props
|
|
41
|
+
}: TableCellProps): react_jsx_runtime0.JSX.Element;
|
|
42
|
+
declare function TableCaption({
|
|
43
|
+
className,
|
|
44
|
+
...props
|
|
45
|
+
}: TableCaptionProps): react_jsx_runtime0.JSX.Element;
|
|
46
|
+
//#endregion
|
|
47
|
+
export { Table, TableBody, TableBodyProps, TableCaption, TableCaptionProps, TableCell, TableCellProps, TableFooter, TableFooterProps, TableHead, TableHeadProps, TableHeader, TableHeaderProps, TableProps, TableRow, TableRowProps };
|
|
48
|
+
//# sourceMappingURL=table.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import"../chunk-IpJEthwI.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";function Table({className:n,...r}){return t(`div`,{"data-slot":`table-container`,className:`relative w-full overflow-x-auto`,children:t(`table`,{"data-slot":`table`,className:e(`w-full caption-bottom text-sm`,n),...r})})}function TableHeader({className:n,...r}){return t(`thead`,{"data-slot":`table-header`,className:e(`[&_tr]:border-b`,n),...r})}function TableBody({className:n,...r}){return t(`tbody`,{"data-slot":`table-body`,className:e(`[&_tr:last-child]:border-0`,n),...r})}function TableFooter({className:n,...r}){return t(`tfoot`,{"data-slot":`table-footer`,className:e(`border-t bg-muted/50 font-medium [&>tr]:last:border-b-0`,n),...r})}function TableRow({className:n,...r}){return t(`tr`,{"data-slot":`table-row`,className:e(`border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted`,n),...r})}function TableHead({className:n,...r}){return t(`th`,{"data-slot":`table-head`,className:e(`h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0`,n),...r})}function TableCell({className:n,...r}){return t(`td`,{"data-slot":`table-cell`,className:e(`p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0`,n),...r})}function TableCaption({className:n,...r}){return t(`caption`,{"data-slot":`table-caption`,className:e(`mt-4 text-sm text-muted-foreground`,n),...r})}export{Table,TableBody,TableCaption,TableCell,TableFooter,TableHead,TableHeader,TableRow};
|
|
2
|
+
//# sourceMappingURL=table.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"table.js","names":[],"sources":["../../src/components/table.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\nexport type TableProps = React.ComponentProps<'table'>\n\nexport type TableHeaderProps = React.ComponentProps<'thead'>\n\nexport type TableBodyProps = React.ComponentProps<'tbody'>\n\nexport type TableFooterProps = React.ComponentProps<'tfoot'>\n\nexport type TableRowProps = React.ComponentProps<'tr'>\n\nexport type TableHeadProps = React.ComponentProps<'th'>\n\nexport type TableCellProps = React.ComponentProps<'td'>\n\nexport type TableCaptionProps = React.ComponentProps<'caption'>\n\nfunction Table({ className, ...props }: TableProps) {\n return (\n <div data-slot=\"table-container\" className=\"relative w-full overflow-x-auto\">\n <table data-slot=\"table\" className={cn('w-full caption-bottom text-sm', className)} {...props} />\n </div>\n )\n}\n\nfunction TableHeader({ className, ...props }: TableHeaderProps) {\n return <thead data-slot=\"table-header\" className={cn('[&_tr]:border-b', className)} {...props} />\n}\n\nfunction TableBody({ className, ...props }: TableBodyProps) {\n return <tbody data-slot=\"table-body\" className={cn('[&_tr:last-child]:border-0', className)} {...props} />\n}\n\nfunction TableFooter({ className, ...props }: TableFooterProps) {\n return (\n <tfoot\n data-slot=\"table-footer\"\n className={cn('border-t bg-muted/50 font-medium [&>tr]:last:border-b-0', className)}\n {...props}\n />\n )\n}\n\nfunction TableRow({ className, ...props }: TableRowProps) {\n return (\n <tr\n data-slot=\"table-row\"\n className={cn('border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted', className)}\n {...props}\n />\n )\n}\n\nfunction TableHead({ className, ...props }: TableHeadProps) {\n return (\n <th\n data-slot=\"table-head\"\n className={cn(\n 'h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TableCell({ className, ...props }: TableCellProps) {\n return (\n <td\n data-slot=\"table-cell\"\n className={cn('p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0', className)}\n {...props}\n />\n )\n}\n\nfunction TableCaption({ className, ...props }: TableCaptionProps) {\n return (\n <caption data-slot=\"table-caption\" className={cn('mt-4 text-sm text-muted-foreground', className)} {...props} />\n )\n}\n\nexport { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption }\n"],"mappings":"0GAoBA,SAAS,MAAM,CAAE,YAAW,GAAG,GAAqB,CAClD,OACE,EAAC,MAAD,CAAK,YAAU,kBAAkB,UAAU,2CACzC,EAAC,QAAD,CAAO,YAAU,QAAQ,UAAW,EAAG,gCAAiC,EAAU,CAAE,GAAI,EAAS,CAAA,CAC7F,CAAA,CAIV,SAAS,YAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OAAO,EAAC,QAAD,CAAO,YAAU,eAAe,UAAW,EAAG,kBAAmB,EAAU,CAAE,GAAI,EAAS,CAAA,CAGnG,SAAS,UAAU,CAAE,YAAW,GAAG,GAAyB,CAC1D,OAAO,EAAC,QAAD,CAAO,YAAU,aAAa,UAAW,EAAG,6BAA8B,EAAU,CAAE,GAAI,EAAS,CAAA,CAG5G,SAAS,YAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OACE,EAAC,QAAD,CACE,YAAU,eACV,UAAW,EAAG,0DAA2D,EAAU,CACnF,GAAI,EACJ,CAAA,CAIN,SAAS,SAAS,CAAE,YAAW,GAAG,GAAwB,CACxD,OACE,EAAC,KAAD,CACE,YAAU,YACV,UAAW,EAAG,8EAA+E,EAAU,CACvG,GAAI,EACJ,CAAA,CAIN,SAAS,UAAU,CAAE,YAAW,GAAG,GAAyB,CAC1D,OACE,EAAC,KAAD,CACE,YAAU,aACV,UAAW,EACT,+GACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,SAAS,UAAU,CAAE,YAAW,GAAG,GAAyB,CAC1D,OACE,EAAC,KAAD,CACE,YAAU,aACV,UAAW,EAAG,mEAAoE,EAAU,CAC5F,GAAI,EACJ,CAAA,CAIN,SAAS,aAAa,CAAE,YAAW,GAAG,GAA4B,CAChE,OACE,EAAC,UAAD,CAAS,YAAU,gBAAgB,UAAW,EAAG,qCAAsC,EAAU,CAAE,GAAI,EAAS,CAAA"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { t as __name } from "../chunk-IpJEthwI.js";
|
|
2
|
+
import { Tabs as Tabs$1 } from "radix-ui";
|
|
3
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
4
|
+
import { VariantProps } from "class-variance-authority";
|
|
5
|
+
import * as React from "react";
|
|
6
|
+
import * as class_variance_authority_types0 from "class-variance-authority/types";
|
|
7
|
+
|
|
8
|
+
//#region src/components/tabs.d.ts
|
|
9
|
+
type TabsProps = React.ComponentProps<typeof Tabs$1.Root>;
|
|
10
|
+
declare function Tabs({
|
|
11
|
+
className,
|
|
12
|
+
orientation,
|
|
13
|
+
...props
|
|
14
|
+
}: TabsProps): react_jsx_runtime0.JSX.Element;
|
|
15
|
+
declare const tabsListVariants: (props?: ({
|
|
16
|
+
variant?: "default" | "line" | null | undefined;
|
|
17
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
18
|
+
type TabsListProps = React.ComponentProps<typeof Tabs$1.List> & VariantProps<typeof tabsListVariants>;
|
|
19
|
+
type TabsTriggerProps = React.ComponentProps<typeof Tabs$1.Trigger>;
|
|
20
|
+
type TabsContentProps = React.ComponentProps<typeof Tabs$1.Content>;
|
|
21
|
+
declare function TabsList({
|
|
22
|
+
className,
|
|
23
|
+
variant,
|
|
24
|
+
...props
|
|
25
|
+
}: TabsListProps): react_jsx_runtime0.JSX.Element;
|
|
26
|
+
declare function TabsTrigger({
|
|
27
|
+
className,
|
|
28
|
+
...props
|
|
29
|
+
}: TabsTriggerProps): react_jsx_runtime0.JSX.Element;
|
|
30
|
+
declare function TabsContent({
|
|
31
|
+
className,
|
|
32
|
+
...props
|
|
33
|
+
}: TabsContentProps): react_jsx_runtime0.JSX.Element;
|
|
34
|
+
//#endregion
|
|
35
|
+
export { Tabs, TabsContent, TabsContentProps, TabsList, TabsListProps, TabsProps, TabsTrigger, TabsTriggerProps, tabsListVariants };
|
|
36
|
+
//# sourceMappingURL=tabs.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import"../chunk-IpJEthwI.js";import{cn as e}from"../lib/utils.js";import{Tabs as t}from"radix-ui";import{jsx as n}from"react/jsx-runtime";import{cva as r}from"class-variance-authority";function Tabs({className:r,orientation:i=`horizontal`,...a}){return n(t.Root,{"data-slot":`tabs`,"data-orientation":i,className:e(`group/tabs flex gap-2 data-horizontal:flex-col`,r),...a})}const i=r(`group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-0.75 text-muted-foreground group-data-horizontal/tabs:h-8 group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none`,{variants:{variant:{default:`bg-muted`,line:`gap-1 bg-transparent`}},defaultVariants:{variant:`default`}});function TabsList({className:r,variant:a=`default`,...o}){return n(t.List,{"data-slot":`tabs-list`,"data-variant":a,className:e(i({variant:a}),r),...o})}function TabsTrigger({className:r,...i}){return n(t.Trigger,{"data-slot":`tabs-trigger`,className:e(`relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 dark:text-muted-foreground dark:hover:text-foreground group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`,`group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent`,`data-active:bg-background data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 dark:data-active:text-foreground`,`after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:-bottom-1.25 group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100`,r),...i})}function TabsContent({className:r,...i}){return n(t.Content,{"data-slot":`tabs-content`,className:e(`flex-1 text-sm outline-none`,r),...i})}export{Tabs,TabsContent,TabsList,TabsTrigger,i as tabsListVariants};
|
|
2
|
+
//# sourceMappingURL=tabs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tabs.js","names":["TabsPrimitive"],"sources":["../../src/components/tabs.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { Tabs as TabsPrimitive } from 'radix-ui'\n\nimport { cn } from '../lib/utils'\n\nexport type TabsProps = React.ComponentProps<typeof TabsPrimitive.Root>\n\nfunction Tabs({ className, orientation = 'horizontal', ...props }: TabsProps) {\n return (\n <TabsPrimitive.Root\n data-slot=\"tabs\"\n data-orientation={orientation}\n className={cn('group/tabs flex gap-2 data-horizontal:flex-col', className)}\n {...props}\n />\n )\n}\n\nconst tabsListVariants = cva(\n 'group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-0.75 text-muted-foreground group-data-horizontal/tabs:h-8 group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none',\n {\n variants: {\n variant: {\n default: 'bg-muted',\n line: 'gap-1 bg-transparent'\n }\n },\n defaultVariants: {\n variant: 'default'\n }\n }\n)\n\nexport type TabsListProps = React.ComponentProps<typeof TabsPrimitive.List> & VariantProps<typeof tabsListVariants>\n\nexport type TabsTriggerProps = React.ComponentProps<typeof TabsPrimitive.Trigger>\n\nexport type TabsContentProps = React.ComponentProps<typeof TabsPrimitive.Content>\n\nfunction TabsList({ className, variant = 'default', ...props }: TabsListProps) {\n return (\n <TabsPrimitive.List\n data-slot=\"tabs-list\"\n data-variant={variant}\n className={cn(tabsListVariants({ variant }), className)}\n {...props}\n />\n )\n}\n\nfunction TabsTrigger({ className, ...props }: TabsTriggerProps) {\n return (\n <TabsPrimitive.Trigger\n data-slot=\"tabs-trigger\"\n className={cn(\n \"relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 dark:text-muted-foreground dark:hover:text-foreground group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n 'group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent',\n 'data-active:bg-background data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 dark:data-active:text-foreground',\n 'after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:-bottom-1.25 group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction TabsContent({ className, ...props }: TabsContentProps) {\n return (\n <TabsPrimitive.Content\n data-slot=\"tabs-content\"\n className={cn('flex-1 text-sm outline-none', className)}\n {...props}\n />\n )\n}\n\nexport { Tabs, TabsContent, TabsList, tabsListVariants, TabsTrigger }\n"],"mappings":"yLASA,SAAS,KAAK,CAAE,YAAW,cAAc,aAAc,GAAG,GAAoB,CAC5E,OACE,EAACA,EAAc,KAAf,CACE,YAAU,OACV,mBAAkB,EAClB,UAAW,EAAG,iDAAkD,EAAU,CAC1E,GAAI,EACJ,CAAA,CAIN,MAAM,EAAmB,EACvB,yOACA,CACE,SAAU,CACR,QAAS,CACP,QAAS,WACT,KAAM,uBACP,CACF,CACD,gBAAiB,CACf,QAAS,UACV,CACF,CACF,CAQD,SAAS,SAAS,CAAE,YAAW,UAAU,UAAW,GAAG,GAAwB,CAC7E,OACE,EAACA,EAAc,KAAf,CACE,YAAU,YACV,eAAc,EACd,UAAW,EAAG,EAAiB,CAAE,UAAS,CAAC,CAAE,EAAU,CACvD,GAAI,EACJ,CAAA,CAIN,SAAS,YAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OACE,EAACA,EAAc,QAAf,CACE,YAAU,eACV,UAAW,EACT,guBACA,gQACA,oJACA,sYACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,SAAS,YAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OACE,EAACA,EAAc,QAAf,CACE,YAAU,eACV,UAAW,EAAG,8BAA+B,EAAU,CACvD,GAAI,EACJ,CAAA"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { t as __name } from "../chunk-IpJEthwI.js";
|
|
2
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import { VariantProps } from "class-variance-authority";
|
|
4
|
+
import * as React from "react";
|
|
5
|
+
import * as class_variance_authority_types0 from "class-variance-authority/types";
|
|
6
|
+
|
|
7
|
+
//#region src/components/text.d.ts
|
|
8
|
+
declare const textVariants: (props?: ({
|
|
9
|
+
size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
|
|
10
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
11
|
+
type TextProps = React.ComponentProps<'p'> & VariantProps<typeof textVariants> & {
|
|
12
|
+
asChild?: boolean;
|
|
13
|
+
};
|
|
14
|
+
declare function Text({
|
|
15
|
+
className,
|
|
16
|
+
size,
|
|
17
|
+
asChild,
|
|
18
|
+
...props
|
|
19
|
+
}: TextProps): react_jsx_runtime0.JSX.Element;
|
|
20
|
+
//#endregion
|
|
21
|
+
export { Text, TextProps, textVariants };
|
|
22
|
+
//# sourceMappingURL=text.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import"../chunk-IpJEthwI.js";import{cn as e}from"../lib/utils.js";import{Slot as t}from"radix-ui";import{jsx as n}from"react/jsx-runtime";import{cva as r}from"class-variance-authority";const i=r(`text-foreground font-normal`,{variants:{size:{xs:`text-xs leading-4`,sm:`text-sm leading-5`,md:`text-base leading-6`,lg:`text-lg leading-7`,xl:`text-xl leading-8`}},defaultVariants:{size:`md`}});function Text({className:r,size:a=`md`,asChild:o=!1,...s}){return n(o?t.Root:`p`,{"data-slot":`text`,"data-size":a,className:e(i({size:a}),r),...s})}export{Text,i as textVariants};
|
|
2
|
+
//# sourceMappingURL=text.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"text.js","names":[],"sources":["../../src/components/text.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { Slot } from 'radix-ui'\n\nimport { cn } from '../lib/utils'\n\nconst textVariants = cva('text-foreground font-normal', {\n variants: {\n size: {\n xs: 'text-xs leading-4',\n sm: 'text-sm leading-5',\n md: 'text-base leading-6',\n lg: 'text-lg leading-7',\n xl: 'text-xl leading-8'\n }\n },\n defaultVariants: {\n size: 'md'\n }\n})\n\nexport type TextProps = React.ComponentProps<'p'> &\n VariantProps<typeof textVariants> & {\n asChild?: boolean\n }\n\nfunction Text({ className, size = 'md', asChild = false, ...props }: TextProps) {\n const Comp = asChild ? Slot.Root : 'p'\n\n return <Comp data-slot=\"text\" data-size={size} className={cn(textVariants({ size }), className)} {...props} />\n}\n\nexport { Text, textVariants }\n"],"mappings":"yLAOA,MAAM,EAAe,EAAI,8BAA+B,CACtD,SAAU,CACR,KAAM,CACJ,GAAI,oBACJ,GAAI,oBACJ,GAAI,sBACJ,GAAI,oBACJ,GAAI,oBACL,CACF,CACD,gBAAiB,CACf,KAAM,KACP,CACF,CAAC,CAOF,SAAS,KAAK,CAAE,YAAW,OAAO,KAAM,UAAU,GAAO,GAAG,GAAoB,CAG9E,OAAO,EAFM,EAAU,EAAK,KAAO,IAE5B,CAAM,YAAU,OAAO,YAAW,EAAM,UAAW,EAAG,EAAa,CAAE,OAAM,CAAC,CAAE,EAAU,CAAE,GAAI,EAAS,CAAA"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { t as __name } from "../chunk-IpJEthwI.js";
|
|
2
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
|
|
5
|
+
//#region src/components/textarea.d.ts
|
|
6
|
+
type TextareaProps = React.ComponentProps<'textarea'>;
|
|
7
|
+
declare function Textarea({
|
|
8
|
+
className,
|
|
9
|
+
...props
|
|
10
|
+
}: TextareaProps): react_jsx_runtime0.JSX.Element;
|
|
11
|
+
//#endregion
|
|
12
|
+
export { Textarea, TextareaProps };
|
|
13
|
+
//# sourceMappingURL=textarea.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import"../chunk-IpJEthwI.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";function Textarea({className:n,...r}){return t(`textarea`,{"data-slot":`textarea`,className:e(`flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40`,n),...r})}export{Textarea};
|
|
2
|
+
//# sourceMappingURL=textarea.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"textarea.js","names":[],"sources":["../../src/components/textarea.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\nexport type TextareaProps = React.ComponentProps<'textarea'>\n\nfunction Textarea({ className, ...props }: TextareaProps) {\n return (\n <textarea\n data-slot=\"textarea\"\n className={cn(\n 'flex field-sizing-content min-h-16 w-full rounded-lg border border-input bg-transparent px-2.5 py-2 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40',\n className\n )}\n {...props}\n />\n )\n}\n\nexport { Textarea }\n"],"mappings":"0GAMA,SAAS,SAAS,CAAE,YAAW,GAAG,GAAwB,CACxD,OACE,EAAC,WAAD,CACE,YAAU,WACV,UAAW,EACT,yhBACA,EACD,CACD,GAAI,EACJ,CAAA"}
|
package/dist/components/theme.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import"../chunk-IpJEthwI.js";import{Button as e}from"./button.js";import{DropdownMenu as t,DropdownMenuContent as n,DropdownMenuItem as r,DropdownMenuTrigger as i}from"./dropdown-menu.js";import{IconMoon as a,IconSun as o}from"@tabler/icons-react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{createContext as l,use as u,useEffect as d,useState as f}from"react";const p=l({});function ThemeProvider({children:e,defaultTheme:t=`system`,storageKey:n=`vite-ui-theme`,...r}){let[i,a]=f(()=>localStorage.getItem(n)||t);d(()=>{let e=window.document.documentElement;if(e.classList.remove(`light`,`dark`),i===`system`){let t=window.matchMedia(`(prefers-color-scheme: dark)`).matches?`dark`:`light`;e.classList.add(t);return}e.classList.add(i)},[i]);let o={theme:i,setTheme:e=>{localStorage.setItem(n,e),a(e)}};return s(p.Provider,{...r,value:o,children:e})}const useTheme=()=>{let e=u(p);if(e===void 0||Object.keys(e).length===0)throw Error(`useTheme must be used within a ThemeProvider`);return e};function ModeToggle(l){let{setTheme:u}=useTheme();return c(t,{children:[s(i,{children:c(e,{variant:`outline`,size:`icon`,...l,children:[s(o,{className:`h-[1.2rem] w-[1.2rem] scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90`}),s(a,{className:`absolute h-[1.2rem] w-[1.2rem] scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0`}),s(`span`,{className:`sr-only`,children:`Toggle theme`})]})}),c(n,{align:`end`,children:[s(r,{onClick:()=>u(`light`),children:`Light`}),s(r,{onClick:()=>u(`dark`),children:`Dark`}),s(r,{onClick:()=>u(`system`),children:`System`})]})]})}export{ModeToggle,ThemeProvider,useTheme};
|
|
2
2
|
//# sourceMappingURL=theme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.js","names":[],"sources":["../../src/components/theme.tsx"],"sourcesContent":["import type * as React from 'react'\nimport { createContext, use, useEffect, useState } from 'react'\n\nimport { IconMoon, IconSun } from '@tabler/icons-react'\n\nimport { Button } from './button'\nimport { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from './dropdown-menu'\n\nexport type Theme = 'dark' | 'light' | 'system'\n\nexport type ThemeProviderProps = {\n children: React.ReactNode\n defaultTheme?: Theme\n storageKey?: string\n}\n\nexport type ThemeProviderState = {\n theme: Theme\n setTheme: (theme: Theme) => void\n}\n\nexport type ModeToggleProps = React.ComponentProps<typeof Button>\n\nconst ThemeProviderContext = createContext({} as ThemeProviderState)\n\nexport function ThemeProvider({\n children,\n defaultTheme = 'system',\n storageKey = 'vite-ui-theme',\n ...props\n}: ThemeProviderProps) {\n const [theme, setTheme] = useState<Theme>(() => (localStorage.getItem(storageKey) as Theme) || defaultTheme)\n\n useEffect(() => {\n const root = window.document.documentElement\n\n root.classList.remove('light', 'dark')\n\n if (theme === 'system') {\n const systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'\n\n root.classList.add(systemTheme)\n return\n }\n\n root.classList.add(theme)\n }, [theme])\n\n const value = {\n theme,\n setTheme: (theme: Theme) => {\n localStorage.setItem(storageKey, theme)\n setTheme(theme)\n }\n }\n\n return (\n <ThemeProviderContext.Provider {...props} value={value}>\n {children}\n </ThemeProviderContext.Provider>\n )\n}\n\nexport const useTheme = () => {\n const context = use(ThemeProviderContext)\n\n if (context === undefined || Object.keys(context).length === 0) {\n throw new Error('useTheme must be used within a ThemeProvider')\n }\n\n return context\n}\n\nexport function ModeToggle(props: ModeToggleProps) {\n const { setTheme } = useTheme()\n\n return (\n <DropdownMenu>\n <DropdownMenuTrigger>\n <Button variant=\"outline\" size=\"icon\" {...props}>\n <IconSun className=\"h-[1.2rem] w-[1.2rem] scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90\" />\n <IconMoon className=\"absolute h-[1.2rem] w-[1.2rem] scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0\" />\n <span className=\"sr-only\">Toggle theme</span>\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"end\">\n <DropdownMenuItem onClick={() => setTheme('light')}>Light</DropdownMenuItem>\n <DropdownMenuItem onClick={() => setTheme('dark')}>Dark</DropdownMenuItem>\n <DropdownMenuItem onClick={() => setTheme('system')}>System</DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n )\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"theme.js","names":[],"sources":["../../src/components/theme.tsx"],"sourcesContent":["import type * as React from 'react'\nimport { createContext, use, useEffect, useState } from 'react'\n\nimport { IconMoon, IconSun } from '@tabler/icons-react'\n\nimport { Button } from './button'\nimport { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from './dropdown-menu'\n\nexport type Theme = 'dark' | 'light' | 'system'\n\nexport type ThemeProviderProps = {\n children: React.ReactNode\n defaultTheme?: Theme\n storageKey?: string\n}\n\nexport type ThemeProviderState = {\n theme: Theme\n setTheme: (theme: Theme) => void\n}\n\nexport type ModeToggleProps = React.ComponentProps<typeof Button>\n\nconst ThemeProviderContext = createContext({} as ThemeProviderState)\n\nexport function ThemeProvider({\n children,\n defaultTheme = 'system',\n storageKey = 'vite-ui-theme',\n ...props\n}: ThemeProviderProps) {\n const [theme, setTheme] = useState<Theme>(() => (localStorage.getItem(storageKey) as Theme) || defaultTheme)\n\n useEffect(() => {\n const root = window.document.documentElement\n\n root.classList.remove('light', 'dark')\n\n if (theme === 'system') {\n const systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'\n\n root.classList.add(systemTheme)\n return\n }\n\n root.classList.add(theme)\n }, [theme])\n\n const value = {\n theme,\n setTheme: (theme: Theme) => {\n localStorage.setItem(storageKey, theme)\n setTheme(theme)\n }\n }\n\n return (\n <ThemeProviderContext.Provider {...props} value={value}>\n {children}\n </ThemeProviderContext.Provider>\n )\n}\n\nexport const useTheme = () => {\n const context = use(ThemeProviderContext)\n\n if (context === undefined || Object.keys(context).length === 0) {\n throw new Error('useTheme must be used within a ThemeProvider')\n }\n\n return context\n}\n\nexport function ModeToggle(props: ModeToggleProps) {\n const { setTheme } = useTheme()\n\n return (\n <DropdownMenu>\n <DropdownMenuTrigger>\n <Button variant=\"outline\" size=\"icon\" {...props}>\n <IconSun className=\"h-[1.2rem] w-[1.2rem] scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90\" />\n <IconMoon className=\"absolute h-[1.2rem] w-[1.2rem] scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0\" />\n <span className=\"sr-only\">Toggle theme</span>\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"end\">\n <DropdownMenuItem onClick={() => setTheme('light')}>Light</DropdownMenuItem>\n <DropdownMenuItem onClick={() => setTheme('dark')}>Dark</DropdownMenuItem>\n <DropdownMenuItem onClick={() => setTheme('system')}>System</DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n )\n}\n"],"mappings":"sXAuBA,MAAM,EAAuB,EAAc,EAAE,CAAuB,CAEpE,SAAgB,cAAc,CAC5B,WACA,eAAe,SACf,aAAa,gBACb,GAAG,GACkB,CACrB,GAAM,CAAC,EAAO,GAAY,MAAuB,aAAa,QAAQ,EAAW,EAAc,EAAa,CAE5G,MAAgB,CACd,IAAM,EAAO,OAAO,SAAS,gBAI7B,GAFA,EAAK,UAAU,OAAO,QAAS,OAAO,CAElC,IAAU,SAAU,CACtB,IAAM,EAAc,OAAO,WAAW,+BAA+B,CAAC,QAAU,OAAS,QAEzF,EAAK,UAAU,IAAI,EAAY,CAC/B,OAGF,EAAK,UAAU,IAAI,EAAM,EACxB,CAAC,EAAM,CAAC,CAEX,IAAM,EAAQ,CACZ,QACA,SAAW,GAAiB,CAC1B,aAAa,QAAQ,EAAY,EAAM,CACvC,EAAS,EAAM,EAElB,CAED,OACE,EAAC,EAAqB,SAAtB,CAA+B,GAAI,EAAc,QAC9C,WAC6B,CAAA,CAIpC,MAAa,aAAiB,CAC5B,IAAM,EAAU,EAAI,EAAqB,CAEzC,GAAI,IAAY,IAAA,IAAa,OAAO,KAAK,EAAQ,CAAC,SAAW,EAC3D,MAAU,MAAM,+CAA+C,CAGjE,OAAO,GAGT,SAAgB,WAAW,EAAwB,CACjD,GAAM,CAAE,YAAa,UAAU,CAE/B,OACE,EAAC,EAAD,CAAA,SAAA,CACE,EAAC,EAAD,CAAA,SACE,EAAC,EAAD,CAAQ,QAAQ,UAAU,KAAK,OAAO,GAAI,WAA1C,CACE,EAAC,EAAD,CAAS,UAAU,uFAAyF,CAAA,CAC5G,EAAC,EAAD,CAAU,UAAU,+FAAiG,CAAA,CACrH,EAAC,OAAD,CAAM,UAAU,mBAAU,eAAmB,CAAA,CACtC,GACW,CAAA,CACtB,EAAC,EAAD,CAAqB,MAAM,eAA3B,CACE,EAAC,EAAD,CAAkB,YAAe,EAAS,QAAQ,UAAE,QAAwB,CAAA,CAC5E,EAAC,EAAD,CAAkB,YAAe,EAAS,OAAO,UAAE,OAAuB,CAAA,CAC1E,EAAC,EAAD,CAAkB,YAAe,EAAS,SAAS,UAAE,SAAyB,CAAA,CAC1D,GACT,CAAA,CAAA"}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import { t as __name } from "../chunk-IpJEthwI.js";
|
|
2
|
+
import { VariantProps } from "class-variance-authority";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import * as class_variance_authority_types0 from "class-variance-authority/types";
|
|
5
|
+
|
|
6
|
+
//#region src/components/timeline.d.ts
|
|
7
|
+
declare const timelineVariants: (props?: ({
|
|
8
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
9
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
10
|
+
declare const timelineConnectorVariants: (props?: ({
|
|
11
|
+
status?: "pending" | "completed" | "in-progress" | null | undefined;
|
|
12
|
+
color?: "destructive" | "secondary" | "primary" | "muted" | "accent" | "gradient" | null | undefined;
|
|
13
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
14
|
+
declare const timelineIconVariants: (props?: ({
|
|
15
|
+
color?: "destructive" | "secondary" | "primary" | "muted" | "accent" | null | undefined;
|
|
16
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
17
|
+
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
18
|
+
type TimelineIconSize = NonNullable<VariantProps<typeof timelineIconVariants>['size']>;
|
|
19
|
+
type TimelineConnectorColor = NonNullable<VariantProps<typeof timelineConnectorVariants>['color']>;
|
|
20
|
+
type TimelineIconColor = NonNullable<VariantProps<typeof timelineIconVariants>['color']>;
|
|
21
|
+
type TimelineStatus = NonNullable<VariantProps<typeof timelineConnectorVariants>['status']>;
|
|
22
|
+
type TimelineProps = React.ComponentProps<'ol'> & VariantProps<typeof timelineVariants> & {
|
|
23
|
+
iconSize?: TimelineIconSize;
|
|
24
|
+
};
|
|
25
|
+
declare const Timeline: React.ForwardRefExoticComponent<Omit<TimelineProps, "ref"> & React.RefAttributes<HTMLOListElement>>;
|
|
26
|
+
type TimelineItemProps = React.ComponentProps<'li'> & {
|
|
27
|
+
date?: React.ReactNode;
|
|
28
|
+
title?: React.ReactNode;
|
|
29
|
+
description?: React.ReactNode;
|
|
30
|
+
icon?: React.ReactNode;
|
|
31
|
+
iconColor?: TimelineIconColor;
|
|
32
|
+
status?: TimelineStatus;
|
|
33
|
+
connectorColor?: TimelineConnectorColor;
|
|
34
|
+
showConnector?: boolean;
|
|
35
|
+
iconSize?: TimelineIconSize;
|
|
36
|
+
loading?: boolean;
|
|
37
|
+
error?: React.ReactNode;
|
|
38
|
+
};
|
|
39
|
+
declare const TimelineItem: React.ForwardRefExoticComponent<Omit<TimelineItemProps, "ref"> & React.RefAttributes<HTMLLIElement>>;
|
|
40
|
+
type TimelineTimeProps = React.ComponentProps<'time'> & {
|
|
41
|
+
date?: string | Date | number;
|
|
42
|
+
format?: Intl.DateTimeFormatOptions;
|
|
43
|
+
};
|
|
44
|
+
declare const TimelineTime: React.ForwardRefExoticComponent<Omit<TimelineTimeProps, "ref"> & React.RefAttributes<HTMLTimeElement>>;
|
|
45
|
+
type TimelineConnectorProps = React.ComponentProps<'div'> & VariantProps<typeof timelineConnectorVariants>;
|
|
46
|
+
declare const TimelineConnector: React.ForwardRefExoticComponent<Omit<TimelineConnectorProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
47
|
+
type TimelineHeaderProps = React.ComponentProps<'div'>;
|
|
48
|
+
declare const TimelineHeader: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
49
|
+
type TimelineTitleProps = React.ComponentProps<'h3'>;
|
|
50
|
+
declare const TimelineTitle: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
|
|
51
|
+
type TimelineIconProps = React.ComponentProps<'div'> & VariantProps<typeof timelineIconVariants> & {
|
|
52
|
+
icon?: React.ReactNode;
|
|
53
|
+
};
|
|
54
|
+
declare const TimelineIcon: React.ForwardRefExoticComponent<Omit<TimelineIconProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
55
|
+
type TimelineDescriptionProps = React.ComponentProps<'p'>;
|
|
56
|
+
declare const TimelineDescription: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
|
|
57
|
+
type TimelineContentProps = React.ComponentProps<'div'>;
|
|
58
|
+
declare const TimelineContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
59
|
+
type TimelineEmptyProps = React.ComponentProps<'div'>;
|
|
60
|
+
declare const TimelineEmpty: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
61
|
+
//#endregion
|
|
62
|
+
export { Timeline, TimelineConnector, TimelineConnectorColor, TimelineConnectorProps, TimelineContent, TimelineContentProps, TimelineDescription, TimelineDescriptionProps, TimelineEmpty, TimelineEmptyProps, TimelineHeader, TimelineHeaderProps, TimelineIcon, TimelineIconColor, TimelineIconProps, TimelineIconSize, TimelineItem, TimelineItemProps, TimelineProps, TimelineStatus, TimelineTime, TimelineTimeProps, TimelineTitle, TimelineTitleProps, timelineVariants };
|
|
63
|
+
//# sourceMappingURL=timeline.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import"../chunk-IpJEthwI.js";import{cn as e}from"../lib/utils.js";import{Spinner as t}from"./spinner.js";import{IconAlertCircle as n}from"@tabler/icons-react";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{cva as a}from"class-variance-authority";import*as o from"react";const s=a(`relative mx-auto m-0 flex w-full max-w-2xl min-h-150 list-none flex-col p-0 py-8`,{variants:{size:{sm:`gap-4`,md:`gap-6`,lg:`gap-8`}},defaultVariants:{size:`md`}}),c=a(`relative w-full last:mb-0`,{variants:{tone:{default:`mb-2`,error:`mb-2`}},defaultVariants:{tone:`default`}}),l=a(`w-0.5`,{variants:{status:{completed:`bg-primary`,"in-progress":`bg-accent`,pending:`bg-muted`},color:{primary:`bg-primary`,secondary:`bg-secondary`,muted:`bg-muted`,accent:`bg-accent`,destructive:`bg-destructive`,gradient:`bg-linear-to-b from-primary to-muted`}}}),u=a(`relative flex items-center justify-center rounded-full ring-8 ring-background shadow-sm`,{variants:{color:{primary:`bg-primary text-primary-foreground`,secondary:`bg-secondary text-secondary-foreground`,muted:`bg-muted text-muted-foreground`,accent:`bg-accent text-accent-foreground`,destructive:`bg-destructive text-destructive-foreground`},size:{sm:`h-8 w-8`,md:`h-10 w-10`,lg:`h-12 w-12`}},defaultVariants:{color:`primary`,size:`md`}}),d=a(`flex items-center justify-center`,{variants:{size:{sm:`h-4 w-4`,md:`h-5 w-5`,lg:`h-6 w-6`}},defaultVariants:{size:`md`}}),f=o.forwardRef(({className:t,iconSize:n,size:i=`md`,children:a,...c},l)=>{let u=o.Children.toArray(a).filter(isTimelineItemElement).length;if(u===0)return r(`ol`,{ref:l,"aria-label":`Timeline`,"data-slot":`timeline`,"data-size":i,className:e(s({size:i}),t),...c,children:r(`li`,{className:`list-none`,children:r(S,{})})});let d=0;return r(`ol`,{ref:l,"aria-label":`Timeline`,"data-slot":`timeline`,"data-size":i,className:e(s({size:i}),t),...c,children:o.Children.map(a,e=>{if(!isTimelineItemElement(e))return e;let t=d===u-1;return d+=1,o.cloneElement(e,{iconSize:e.props.iconSize??n,showConnector:e.props.showConnector??!t})})})});f.displayName=`Timeline`;const p=o.forwardRef(({className:a,children:o,date:s,title:l,description:u,icon:d,iconColor:f,status:p=`completed`,connectorColor:m,showConnector:S=!0,iconSize:C,loading:w=!1,error:T,...E},D)=>w?r(`li`,{ref:D,"aria-busy":`true`,"data-slot":`timeline-item`,"data-status":p,className:e(c(),a),...E,children:i(`div`,{className:`grid grid-cols-[minmax(auto,8rem)_auto_1fr] items-start px-4`,children:[r(`div`,{className:`pr-4 text-right`,children:r(`div`,{className:`h-4 w-24 animate-pulse rounded bg-muted`})}),i(`div`,{className:`mx-3 flex flex-col items-center justify-start gap-y-2`,children:[r(`div`,{className:`relative flex h-8 w-8 animate-pulse items-center justify-center rounded-full bg-muted ring-8 ring-background`,children:r(t,{})}),S&&r(`div`,{className:`h-full w-0.5 animate-pulse bg-muted`})]}),r(`div`,{className:`flex flex-col gap-2 pl-2`,children:i(`div`,{className:`space-y-2`,children:[r(`div`,{className:`h-4 w-24 animate-pulse rounded bg-muted`}),r(`div`,{className:`h-3 w-48 animate-pulse rounded bg-muted`})]})})]})}):T?r(`li`,{ref:D,role:`alert`,"data-slot":`timeline-item`,"data-status":`error`,className:e(c({tone:`error`}),a),...E,children:i(`div`,{className:`grid grid-cols-[minmax(auto,8rem)_auto_1fr] items-start px-4`,children:[r(`div`,{className:`pr-4 text-right`,children:r(h,{className:`text-destructive`,children:s})}),i(`div`,{className:`mx-3 flex flex-col items-center justify-start gap-y-2`,children:[r(`div`,{className:`relative flex h-8 w-8 items-center justify-center rounded-full bg-destructive/20 ring-8 ring-background`,children:r(n,{className:`h-4 w-4 text-destructive`})}),S&&r(g,{color:`destructive`,className:`h-full`})]}),i(`div`,{className:`flex flex-col gap-2 pl-2`,children:[r(_,{children:r(v,{className:`text-destructive`,children:l||`Error`})}),r(b,{className:`text-destructive`,children:T})]})]})}):o==null?r(`li`,{ref:D,"data-slot":`timeline-item`,"data-status":p,className:e(c(),a),"aria-current":p===`in-progress`?`step`:void 0,...E,children:i(`div`,{className:`grid grid-cols-[1fr_auto_1fr] items-start gap-4`,children:[r(`div`,{className:`flex flex-col justify-start pt-1`,children:r(h,{className:`pr-4 text-right`,children:s})}),i(`div`,{className:`flex flex-col items-center`,children:[r(`div`,{className:`relative z-10`,children:r(y,{icon:d,color:f??(p===`pending`?`muted`:`primary`),size:C})}),S&&r(g,{status:p,color:m,className:`mt-2 h-16`})]}),i(x,{children:[r(_,{children:r(v,{children:l})}),r(b,{children:u})]})]})}):r(`li`,{ref:D,"data-slot":`timeline-item`,"data-status":p,className:e(c(),a),"aria-current":p===`in-progress`?`step`:void 0,...E,children:o}));p.displayName=`TimelineItem`;const m={year:`numeric`,month:`short`,day:`2-digit`},h=o.forwardRef(({className:t,date:n,format:i,children:a,...s},c)=>{let l=o.useMemo(()=>getValidDate(n),[n]),u=o.useMemo(()=>l?new Intl.DateTimeFormat(`en-US`,{...m,...i}).format(l):``,[l,i]);return r(`time`,{ref:c,"data-slot":`timeline-time`,dateTime:l?.toISOString(),className:e(`text-sm font-medium tracking-tight text-muted-foreground`,t),...s,children:a||u})});h.displayName=`TimelineTime`;const g=o.forwardRef(({className:t,status:n=`completed`,color:i,...a},o)=>r(`div`,{ref:o,"data-slot":`timeline-connector`,"data-status":n,"data-color":i,className:e(l(i?{color:i}:{status:n}),t),...a}));g.displayName=`TimelineConnector`;const _=o.forwardRef(({className:t,...n},i)=>r(`div`,{ref:i,"data-slot":`timeline-header`,className:e(`flex items-center gap-4`,t),...n}));_.displayName=`TimelineHeader`;const v=o.forwardRef(({className:t,...n},i)=>r(`h3`,{ref:i,"data-slot":`timeline-title`,className:e(`font-semibold leading-none tracking-tight text-secondary-foreground`,t),...n}));v.displayName=`TimelineTitle`;const y=o.forwardRef(({className:t,color:n=`primary`,icon:i,size:a=`md`,...o},s)=>r(`div`,{ref:s,"data-slot":`timeline-icon`,"data-color":n,"data-size":a,className:e(u({color:n,size:a}),t),...o,children:i?r(`div`,{className:d({size:a}),children:i}):r(`div`,{className:e(`rounded-full`,d({size:a}))})}));y.displayName=`TimelineIcon`;const b=o.forwardRef(({className:t,...n},i)=>r(`p`,{ref:i,"data-slot":`timeline-description`,className:e(`max-w-sm text-sm text-muted-foreground`,t),...n}));b.displayName=`TimelineDescription`;const x=o.forwardRef(({className:t,...n},i)=>r(`div`,{ref:i,"data-slot":`timeline-content`,className:e(`flex flex-col gap-2 pl-2`,t),...n}));x.displayName=`TimelineContent`;const S=o.forwardRef(({className:t,children:n,...i},a)=>r(`div`,{ref:a,"data-slot":`timeline-empty`,className:e(`flex flex-col items-center justify-center p-8 text-center`,t),...i,children:r(`p`,{className:`text-sm text-muted-foreground`,children:n||`No timeline items to display`})}));S.displayName=`TimelineEmpty`;function getValidDate(e){if(e==null||e===``)return null;let t=e instanceof Date?e:new Date(e);return Number.isNaN(t.getTime())?null:t}function isTimelineItemElement(e){return o.isValidElement(e)&&e.type===p}export{f as Timeline,g as TimelineConnector,x as TimelineContent,b as TimelineDescription,S as TimelineEmpty,_ as TimelineHeader,y as TimelineIcon,p as TimelineItem,h as TimelineTime,v as TimelineTitle,s as timelineVariants};
|
|
2
|
+
//# sourceMappingURL=timeline.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"timeline.js","names":[],"sources":["../../src/components/timeline.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { IconAlertCircle } from '@tabler/icons-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\nimport { Spinner } from './spinner'\n\nconst timelineVariants = cva('relative mx-auto m-0 flex w-full max-w-2xl min-h-150 list-none flex-col p-0 py-8', {\n variants: {\n size: {\n sm: 'gap-4',\n md: 'gap-6',\n lg: 'gap-8'\n }\n },\n defaultVariants: {\n size: 'md'\n }\n})\n\nconst timelineItemVariants = cva('relative w-full last:mb-0', {\n variants: {\n tone: {\n default: 'mb-2',\n error: 'mb-2'\n }\n },\n defaultVariants: {\n tone: 'default'\n }\n})\n\nconst timelineConnectorVariants = cva('w-0.5', {\n variants: {\n status: {\n completed: 'bg-primary',\n 'in-progress': 'bg-accent',\n pending: 'bg-muted'\n },\n color: {\n primary: 'bg-primary',\n secondary: 'bg-secondary',\n muted: 'bg-muted',\n accent: 'bg-accent',\n destructive: 'bg-destructive',\n gradient: 'bg-linear-to-b from-primary to-muted'\n }\n }\n})\n\nconst timelineIconVariants = cva(\n 'relative flex items-center justify-center rounded-full ring-8 ring-background shadow-sm',\n {\n variants: {\n color: {\n primary: 'bg-primary text-primary-foreground',\n secondary: 'bg-secondary text-secondary-foreground',\n muted: 'bg-muted text-muted-foreground',\n accent: 'bg-accent text-accent-foreground',\n destructive: 'bg-destructive text-destructive-foreground'\n },\n size: {\n sm: 'h-8 w-8',\n md: 'h-10 w-10',\n lg: 'h-12 w-12'\n }\n },\n defaultVariants: {\n color: 'primary',\n size: 'md'\n }\n }\n)\n\nconst timelineIconContentVariants = cva('flex items-center justify-center', {\n variants: {\n size: {\n sm: 'h-4 w-4',\n md: 'h-5 w-5',\n lg: 'h-6 w-6'\n }\n },\n defaultVariants: {\n size: 'md'\n }\n})\n\nexport type TimelineIconSize = NonNullable<VariantProps<typeof timelineIconVariants>['size']>\nexport type TimelineConnectorColor = NonNullable<VariantProps<typeof timelineConnectorVariants>['color']>\nexport type TimelineIconColor = NonNullable<VariantProps<typeof timelineIconVariants>['color']>\nexport type TimelineStatus = NonNullable<VariantProps<typeof timelineConnectorVariants>['status']>\n\nexport type TimelineProps = React.ComponentProps<'ol'> &\n VariantProps<typeof timelineVariants> & {\n iconSize?: TimelineIconSize\n }\n\nconst Timeline = React.forwardRef<HTMLOListElement, TimelineProps>(\n ({ className, iconSize, size = 'md', children, ...props }, ref) => {\n const childArray = React.Children.toArray(children)\n const totalItems = childArray.filter(isTimelineItemElement).length\n\n if (totalItems === 0) {\n return (\n <ol\n ref={ref}\n aria-label=\"Timeline\"\n data-slot=\"timeline\"\n data-size={size}\n className={cn(timelineVariants({ size }), className)}\n {...props}\n >\n <li className=\"list-none\">\n <TimelineEmpty />\n </li>\n </ol>\n )\n }\n\n let itemIndex = 0\n\n return (\n <ol\n ref={ref}\n aria-label=\"Timeline\"\n data-slot=\"timeline\"\n data-size={size}\n className={cn(timelineVariants({ size }), className)}\n {...props}\n >\n {React.Children.map(children, (child) => {\n if (!isTimelineItemElement(child)) {\n return child\n }\n\n const isLastItem = itemIndex === totalItems - 1\n itemIndex += 1\n\n return React.cloneElement(child, {\n iconSize: child.props.iconSize ?? iconSize,\n showConnector: child.props.showConnector ?? !isLastItem\n })\n })}\n </ol>\n )\n }\n)\nTimeline.displayName = 'Timeline'\n\nexport type TimelineItemProps = React.ComponentProps<'li'> & {\n date?: React.ReactNode\n title?: React.ReactNode\n description?: React.ReactNode\n icon?: React.ReactNode\n iconColor?: TimelineIconColor\n status?: TimelineStatus\n connectorColor?: TimelineConnectorColor\n showConnector?: boolean\n iconSize?: TimelineIconSize\n loading?: boolean\n error?: React.ReactNode\n}\n\nconst TimelineItem = React.forwardRef<HTMLLIElement, TimelineItemProps>(\n (\n {\n className,\n children,\n date,\n title,\n description,\n icon,\n iconColor,\n status = 'completed',\n connectorColor,\n showConnector = true,\n iconSize,\n loading = false,\n error,\n ...props\n },\n ref\n ) => {\n if (loading) {\n return (\n <li\n ref={ref}\n aria-busy=\"true\"\n data-slot=\"timeline-item\"\n data-status={status}\n className={cn(timelineItemVariants(), className)}\n {...props}\n >\n <div className=\"grid grid-cols-[minmax(auto,8rem)_auto_1fr] items-start px-4\">\n <div className=\"pr-4 text-right\">\n <div className=\"h-4 w-24 animate-pulse rounded bg-muted\" />\n </div>\n\n <div className=\"mx-3 flex flex-col items-center justify-start gap-y-2\">\n <div className=\"relative flex h-8 w-8 animate-pulse items-center justify-center rounded-full bg-muted ring-8 ring-background\">\n <Spinner />\n </div>\n {showConnector && <div className=\"h-full w-0.5 animate-pulse bg-muted\" />}\n </div>\n\n <div className=\"flex flex-col gap-2 pl-2\">\n <div className=\"space-y-2\">\n <div className=\"h-4 w-24 animate-pulse rounded bg-muted\" />\n <div className=\"h-3 w-48 animate-pulse rounded bg-muted\" />\n </div>\n </div>\n </div>\n </li>\n )\n }\n\n if (error) {\n return (\n <li\n ref={ref}\n role=\"alert\"\n data-slot=\"timeline-item\"\n data-status=\"error\"\n className={cn(timelineItemVariants({ tone: 'error' }), className)}\n {...props}\n >\n <div className=\"grid grid-cols-[minmax(auto,8rem)_auto_1fr] items-start px-4\">\n <div className=\"pr-4 text-right\">\n <TimelineTime className=\"text-destructive\">{date}</TimelineTime>\n </div>\n\n <div className=\"mx-3 flex flex-col items-center justify-start gap-y-2\">\n <div className=\"relative flex h-8 w-8 items-center justify-center rounded-full bg-destructive/20 ring-8 ring-background\">\n <IconAlertCircle className=\"h-4 w-4 text-destructive\" />\n </div>\n {showConnector && <TimelineConnector color=\"destructive\" className=\"h-full\" />}\n </div>\n\n <div className=\"flex flex-col gap-2 pl-2\">\n <TimelineHeader>\n <TimelineTitle className=\"text-destructive\">{title || 'Error'}</TimelineTitle>\n </TimelineHeader>\n <TimelineDescription className=\"text-destructive\">{error}</TimelineDescription>\n </div>\n </div>\n </li>\n )\n }\n\n if (children != null) {\n return (\n <li\n ref={ref}\n data-slot=\"timeline-item\"\n data-status={status}\n className={cn(timelineItemVariants(), className)}\n aria-current={status === 'in-progress' ? 'step' : undefined}\n {...props}\n >\n {children}\n </li>\n )\n }\n\n return (\n <li\n ref={ref}\n data-slot=\"timeline-item\"\n data-status={status}\n className={cn(timelineItemVariants(), className)}\n aria-current={status === 'in-progress' ? 'step' : undefined}\n {...props}\n >\n <div className=\"grid grid-cols-[1fr_auto_1fr] items-start gap-4\">\n <div className=\"flex flex-col justify-start pt-1\">\n <TimelineTime className=\"pr-4 text-right\">{date}</TimelineTime>\n </div>\n\n <div className=\"flex flex-col items-center\">\n <div className=\"relative z-10\">\n <TimelineIcon\n icon={icon}\n color={iconColor ?? (status === 'pending' ? 'muted' : 'primary')}\n size={iconSize}\n />\n </div>\n {showConnector && <TimelineConnector status={status} color={connectorColor} className=\"mt-2 h-16\" />}\n </div>\n\n <TimelineContent>\n <TimelineHeader>\n <TimelineTitle>{title}</TimelineTitle>\n </TimelineHeader>\n <TimelineDescription>{description}</TimelineDescription>\n </TimelineContent>\n </div>\n </li>\n )\n }\n)\nTimelineItem.displayName = 'TimelineItem'\n\nexport type TimelineTimeProps = React.ComponentProps<'time'> & {\n date?: string | Date | number\n format?: Intl.DateTimeFormatOptions\n}\n\nconst defaultDateFormat: Intl.DateTimeFormatOptions = {\n year: 'numeric',\n month: 'short',\n day: '2-digit'\n}\n\nconst TimelineTime = React.forwardRef<HTMLTimeElement, TimelineTimeProps>(\n ({ className, date, format, children, ...props }, ref) => {\n const dateValue = React.useMemo(() => getValidDate(date), [date])\n\n const formattedDate = React.useMemo(() => {\n if (!dateValue) {\n return ''\n }\n\n return new Intl.DateTimeFormat('en-US', {\n ...defaultDateFormat,\n ...format\n }).format(dateValue)\n }, [dateValue, format])\n\n return (\n <time\n ref={ref}\n data-slot=\"timeline-time\"\n dateTime={dateValue?.toISOString()}\n className={cn('text-sm font-medium tracking-tight text-muted-foreground', className)}\n {...props}\n >\n {children || formattedDate}\n </time>\n )\n }\n)\nTimelineTime.displayName = 'TimelineTime'\n\nexport type TimelineConnectorProps = React.ComponentProps<'div'> & VariantProps<typeof timelineConnectorVariants>\n\nconst TimelineConnector = React.forwardRef<HTMLDivElement, TimelineConnectorProps>(\n ({ className, status = 'completed', color, ...props }, ref) => (\n <div\n ref={ref}\n data-slot=\"timeline-connector\"\n data-status={status}\n data-color={color}\n className={cn(color ? timelineConnectorVariants({ color }) : timelineConnectorVariants({ status }), className)}\n {...props}\n />\n )\n)\nTimelineConnector.displayName = 'TimelineConnector'\n\nexport type TimelineHeaderProps = React.ComponentProps<'div'>\n\nconst TimelineHeader = React.forwardRef<HTMLDivElement, TimelineHeaderProps>(({ className, ...props }, ref) => (\n <div ref={ref} data-slot=\"timeline-header\" className={cn('flex items-center gap-4', className)} {...props} />\n))\nTimelineHeader.displayName = 'TimelineHeader'\n\nexport type TimelineTitleProps = React.ComponentProps<'h3'>\n\nconst TimelineTitle = React.forwardRef<HTMLHeadingElement, TimelineTitleProps>(({ className, ...props }, ref) => (\n <h3\n ref={ref}\n data-slot=\"timeline-title\"\n className={cn('font-semibold leading-none tracking-tight text-secondary-foreground', className)}\n {...props}\n />\n))\nTimelineTitle.displayName = 'TimelineTitle'\n\nexport type TimelineIconProps = React.ComponentProps<'div'> &\n VariantProps<typeof timelineIconVariants> & {\n icon?: React.ReactNode\n }\n\nconst TimelineIcon = React.forwardRef<HTMLDivElement, TimelineIconProps>(\n ({ className, color = 'primary', icon, size = 'md', ...props }, ref) => (\n <div\n ref={ref}\n data-slot=\"timeline-icon\"\n data-color={color}\n data-size={size}\n className={cn(timelineIconVariants({ color, size }), className)}\n {...props}\n >\n {icon ? (\n <div className={timelineIconContentVariants({ size })}>{icon}</div>\n ) : (\n <div className={cn('rounded-full', timelineIconContentVariants({ size }))} />\n )}\n </div>\n )\n)\nTimelineIcon.displayName = 'TimelineIcon'\n\nexport type TimelineDescriptionProps = React.ComponentProps<'p'>\n\nconst TimelineDescription = React.forwardRef<HTMLParagraphElement, TimelineDescriptionProps>(\n ({ className, ...props }, ref) => (\n <p\n ref={ref}\n data-slot=\"timeline-description\"\n className={cn('max-w-sm text-sm text-muted-foreground', className)}\n {...props}\n />\n )\n)\nTimelineDescription.displayName = 'TimelineDescription'\n\nexport type TimelineContentProps = React.ComponentProps<'div'>\n\nconst TimelineContent = React.forwardRef<HTMLDivElement, TimelineContentProps>(({ className, ...props }, ref) => (\n <div ref={ref} data-slot=\"timeline-content\" className={cn('flex flex-col gap-2 pl-2', className)} {...props} />\n))\nTimelineContent.displayName = 'TimelineContent'\n\nexport type TimelineEmptyProps = React.ComponentProps<'div'>\n\nconst TimelineEmpty = React.forwardRef<HTMLDivElement, TimelineEmptyProps>(({ className, children, ...props }, ref) => (\n <div\n ref={ref}\n data-slot=\"timeline-empty\"\n className={cn('flex flex-col items-center justify-center p-8 text-center', className)}\n {...props}\n >\n <p className=\"text-sm text-muted-foreground\">{children || 'No timeline items to display'}</p>\n </div>\n))\nTimelineEmpty.displayName = 'TimelineEmpty'\n\nfunction getValidDate(date?: string | Date | number) {\n if (date == null || date === '') {\n return null\n }\n\n const parsedDate = date instanceof Date ? date : new Date(date)\n\n return Number.isNaN(parsedDate.getTime()) ? null : parsedDate\n}\n\nfunction isTimelineItemElement(child: React.ReactNode): child is React.ReactElement<TimelineItemProps> {\n return React.isValidElement(child) && child.type === TimelineItem\n}\n\nexport {\n Timeline,\n TimelineConnector,\n TimelineContent,\n TimelineDescription,\n TimelineEmpty,\n TimelineHeader,\n TimelineIcon,\n TimelineItem,\n TimelineTime,\n TimelineTitle,\n timelineVariants\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { t as __name } from "../chunk-IpJEthwI.js";
|
|
2
|
+
import { toggleVariants } from "./toggle.js";
|
|
3
|
+
import { ToggleGroup as ToggleGroup$1 } from "radix-ui";
|
|
4
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
5
|
+
import { VariantProps } from "class-variance-authority";
|
|
6
|
+
import * as React from "react";
|
|
7
|
+
|
|
8
|
+
//#region src/components/toggle-group.d.ts
|
|
9
|
+
type ToggleGroupProps = React.ComponentProps<typeof ToggleGroup$1.Root> & VariantProps<typeof toggleVariants> & {
|
|
10
|
+
spacing?: number;
|
|
11
|
+
orientation?: 'horizontal' | 'vertical';
|
|
12
|
+
};
|
|
13
|
+
type ToggleGroupItemProps = React.ComponentProps<typeof ToggleGroup$1.Item> & VariantProps<typeof toggleVariants>;
|
|
14
|
+
declare function ToggleGroup({
|
|
15
|
+
className,
|
|
16
|
+
variant,
|
|
17
|
+
size,
|
|
18
|
+
spacing,
|
|
19
|
+
orientation,
|
|
20
|
+
children,
|
|
21
|
+
...props
|
|
22
|
+
}: ToggleGroupProps): react_jsx_runtime0.JSX.Element;
|
|
23
|
+
declare function ToggleGroupItem({
|
|
24
|
+
className,
|
|
25
|
+
children,
|
|
26
|
+
variant,
|
|
27
|
+
size,
|
|
28
|
+
...props
|
|
29
|
+
}: ToggleGroupItemProps): react_jsx_runtime0.JSX.Element;
|
|
30
|
+
//#endregion
|
|
31
|
+
export { ToggleGroup, ToggleGroupItem, ToggleGroupItemProps, ToggleGroupProps };
|
|
32
|
+
//# sourceMappingURL=toggle-group.d.ts.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import"../chunk-IpJEthwI.js";import{cn as e}from"../lib/utils.js";import{toggleVariants as t}from"./toggle.js";import{ToggleGroup as n}from"radix-ui";import{jsx as r}from"react/jsx-runtime";import*as i from"react";const a=i.createContext({size:`default`,variant:`default`,spacing:0,orientation:`horizontal`});function ToggleGroup({className:t,variant:i,size:o,spacing:s=0,orientation:c=`horizontal`,children:l,...u}){return r(n.Root,{"data-slot":`toggle-group`,"data-variant":i,"data-size":o,"data-spacing":s,"data-orientation":c,style:{"--gap":s},className:e(`group/toggle-group flex w-fit flex-row items-center gap-[--spacing(var(--gap))] rounded-lg data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-vertical:flex-col data-vertical:items-stretch`,t),...u,children:r(a.Provider,{value:{variant:i,size:o,spacing:s,orientation:c},children:l})})}function ToggleGroupItem({className:o,children:s,variant:c=`default`,size:l=`default`,...u}){let d=i.useContext(a);return r(n.Item,{"data-slot":`toggle-group-item`,"data-variant":d.variant||c,"data-size":d.size||l,"data-spacing":d.spacing,className:e(`shrink-0 group-data-[spacing=0]/toggle-group:rounded-none group-data-[spacing=0]/toggle-group:px-2 focus:z-10 focus-visible:z-10 group-data-horizontal/toggle-group:data-[spacing=0]:first:rounded-l-lg group-data-vertical/toggle-group:data-[spacing=0]:first:rounded-t-lg group-data-horizontal/toggle-group:data-[spacing=0]:last:rounded-r-lg group-data-vertical/toggle-group:data-[spacing=0]:last:rounded-b-lg group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:border-l-0 group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:border-t-0 group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-l group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-t`,t({variant:d.variant||c,size:d.size||l}),o),...u,children:s})}export{ToggleGroup,ToggleGroupItem};
|
|
2
|
+
//# sourceMappingURL=toggle-group.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"toggle-group.js","names":["ToggleGroupPrimitive"],"sources":["../../src/components/toggle-group.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport type { VariantProps } from 'class-variance-authority'\nimport { ToggleGroup as ToggleGroupPrimitive } from 'radix-ui'\n\nimport { cn } from '../lib/utils'\nimport { toggleVariants } from './toggle'\n\nconst ToggleGroupContext = React.createContext<\n VariantProps<typeof toggleVariants> & {\n spacing?: number\n orientation?: 'horizontal' | 'vertical'\n }\n>({\n size: 'default',\n variant: 'default',\n spacing: 0,\n orientation: 'horizontal'\n})\n\nexport type ToggleGroupProps = React.ComponentProps<typeof ToggleGroupPrimitive.Root> &\n VariantProps<typeof toggleVariants> & {\n spacing?: number\n orientation?: 'horizontal' | 'vertical'\n }\n\nexport type ToggleGroupItemProps = React.ComponentProps<typeof ToggleGroupPrimitive.Item> &\n VariantProps<typeof toggleVariants>\n\nfunction ToggleGroup({\n className,\n variant,\n size,\n spacing = 0,\n orientation = 'horizontal',\n children,\n ...props\n}: ToggleGroupProps) {\n return (\n <ToggleGroupPrimitive.Root\n data-slot=\"toggle-group\"\n data-variant={variant}\n data-size={size}\n data-spacing={spacing}\n data-orientation={orientation}\n style={{ '--gap': spacing } as React.CSSProperties}\n className={cn(\n 'group/toggle-group flex w-fit flex-row items-center gap-[--spacing(var(--gap))] rounded-lg data-[size=sm]:rounded-[min(var(--radius-md),10px)] data-vertical:flex-col data-vertical:items-stretch',\n className\n )}\n {...props}\n >\n <ToggleGroupContext.Provider value={{ variant, size, spacing, orientation }}>\n {children}\n </ToggleGroupContext.Provider>\n </ToggleGroupPrimitive.Root>\n )\n}\n\nfunction ToggleGroupItem({\n className,\n children,\n variant = 'default',\n size = 'default',\n ...props\n}: ToggleGroupItemProps) {\n const context = React.useContext(ToggleGroupContext)\n\n return (\n <ToggleGroupPrimitive.Item\n data-slot=\"toggle-group-item\"\n data-variant={context.variant || variant}\n data-size={context.size || size}\n data-spacing={context.spacing}\n className={cn(\n 'shrink-0 group-data-[spacing=0]/toggle-group:rounded-none group-data-[spacing=0]/toggle-group:px-2 focus:z-10 focus-visible:z-10 group-data-horizontal/toggle-group:data-[spacing=0]:first:rounded-l-lg group-data-vertical/toggle-group:data-[spacing=0]:first:rounded-t-lg group-data-horizontal/toggle-group:data-[spacing=0]:last:rounded-r-lg group-data-vertical/toggle-group:data-[spacing=0]:last:rounded-b-lg group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:border-l-0 group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:border-t-0 group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-l group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-t',\n toggleVariants({\n variant: context.variant || variant,\n size: context.size || size\n }),\n className\n )}\n {...props}\n >\n {children}\n </ToggleGroupPrimitive.Item>\n )\n}\n\nexport { ToggleGroup, ToggleGroupItem }\n"],"mappings":"sNAQA,MAAM,EAAqB,EAAM,cAK/B,CACA,KAAM,UACN,QAAS,UACT,QAAS,EACT,YAAa,aACd,CAAC,CAWF,SAAS,YAAY,CACnB,YACA,UACA,OACA,UAAU,EACV,cAAc,aACd,WACA,GAAG,GACgB,CACnB,OACE,EAACA,EAAqB,KAAtB,CACE,YAAU,eACV,eAAc,EACd,YAAW,EACX,eAAc,EACd,mBAAkB,EAClB,MAAO,CAAE,QAAS,EAAS,CAC3B,UAAW,EACT,oMACA,EACD,CACD,GAAI,WAEJ,EAAC,EAAmB,SAApB,CAA6B,MAAO,CAAE,UAAS,OAAM,UAAS,cAAa,CACxE,WAC2B,CAAA,CACJ,CAAA,CAIhC,SAAS,gBAAgB,CACvB,YACA,WACA,UAAU,UACV,OAAO,UACP,GAAG,GACoB,CACvB,IAAM,EAAU,EAAM,WAAW,EAAmB,CAEpD,OACE,EAACA,EAAqB,KAAtB,CACE,YAAU,oBACV,eAAc,EAAQ,SAAW,EACjC,YAAW,EAAQ,MAAQ,EAC3B,eAAc,EAAQ,QACtB,UAAW,EACT,qvBACA,EAAe,CACb,QAAS,EAAQ,SAAW,EAC5B,KAAM,EAAQ,MAAQ,EACvB,CAAC,CACF,EACD,CACD,GAAI,EAEH,WACyB,CAAA"}
|