@mesob/ui 0.0.2
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/dist/components/accordion.d.ts +10 -0
- package/dist/components/accordion.js +74 -0
- package/dist/components/accordion.js.map +1 -0
- package/dist/components/alert-dialog.d.ts +17 -0
- package/dist/components/alert-dialog.js +187 -0
- package/dist/components/alert-dialog.js.map +1 -0
- package/dist/components/alert.d.ts +13 -0
- package/dist/components/alert.js +74 -0
- package/dist/components/alert.js.map +1 -0
- package/dist/components/animated-tabs.d.ts +26 -0
- package/dist/components/animated-tabs.js +290 -0
- package/dist/components/animated-tabs.js.map +1 -0
- package/dist/components/aspect-ratio.d.ts +6 -0
- package/dist/components/aspect-ratio.js +14 -0
- package/dist/components/aspect-ratio.js.map +1 -0
- package/dist/components/avatar.d.ts +9 -0
- package/dist/components/avatar.js +63 -0
- package/dist/components/avatar.js.map +1 -0
- package/dist/components/badge.d.ts +13 -0
- package/dist/components/badge.js +48 -0
- package/dist/components/badge.js.map +1 -0
- package/dist/components/breadcrumb.d.ts +14 -0
- package/dist/components/breadcrumb.js +110 -0
- package/dist/components/breadcrumb.js.map +1 -0
- package/dist/components/button-group.d.ts +17 -0
- package/dist/components/button-group.js +106 -0
- package/dist/components/button-group.js.map +1 -0
- package/dist/components/button.d.ts +14 -0
- package/dist/components/button.js +60 -0
- package/dist/components/button.js.map +1 -0
- package/dist/components/calendar.d.ts +13 -0
- package/dist/components/calendar.js +254 -0
- package/dist/components/calendar.js.map +1 -0
- package/dist/components/card.d.ts +12 -0
- package/dist/components/card.js +98 -0
- package/dist/components/card.js.map +1 -0
- package/dist/components/carousel.d.ts +24 -0
- package/dist/components/carousel.js +260 -0
- package/dist/components/carousel.js.map +1 -0
- package/dist/components/chart.d.ts +43 -0
- package/dist/components/chart.js +261 -0
- package/dist/components/chart.js.map +1 -0
- package/dist/components/checkbox.d.ts +7 -0
- package/dist/components/checkbox.js +41 -0
- package/dist/components/checkbox.js.map +1 -0
- package/dist/components/collapsible.d.ts +8 -0
- package/dist/components/collapsible.js +38 -0
- package/dist/components/collapsible.js.map +1 -0
- package/dist/components/command.d.ts +22 -0
- package/dist/components/command.js +281 -0
- package/dist/components/command.js.map +1 -0
- package/dist/components/context-menu.d.ts +28 -0
- package/dist/components/context-menu.js +233 -0
- package/dist/components/context-menu.js.map +1 -0
- package/dist/components/data-table/index.d.ts +46 -0
- package/dist/components/data-table/index.js +639 -0
- package/dist/components/data-table/index.js.map +1 -0
- package/dist/components/dialog.d.ts +18 -0
- package/dist/components/dialog.js +146 -0
- package/dist/components/dialog.js.map +1 -0
- package/dist/components/drawer.d.ts +16 -0
- package/dist/components/drawer.js +138 -0
- package/dist/components/drawer.js.map +1 -0
- package/dist/components/dropdown-menu.d.ts +28 -0
- package/dist/components/dropdown-menu.js +241 -0
- package/dist/components/dropdown-menu.js.map +1 -0
- package/dist/components/empty.d.ts +15 -0
- package/dist/components/empty.js +110 -0
- package/dist/components/empty.js.map +1 -0
- package/dist/components/entity/index.d.ts +160 -0
- package/dist/components/entity/index.js +1671 -0
- package/dist/components/entity/index.js.map +1 -0
- package/dist/components/field.d.ts +30 -0
- package/dist/components/field.js +279 -0
- package/dist/components/field.js.map +1 -0
- package/dist/components/form.d.ts +28 -0
- package/dist/components/form.js +150 -0
- package/dist/components/form.js.map +1 -0
- package/dist/components/hover-card.d.ts +9 -0
- package/dist/components/hover-card.js +48 -0
- package/dist/components/hover-card.js.map +1 -0
- package/dist/components/input-group.d.ts +20 -0
- package/dist/components/input-group.js +257 -0
- package/dist/components/input-group.js.map +1 -0
- package/dist/components/input-otp.d.ts +14 -0
- package/dist/components/input-otp.js +76 -0
- package/dist/components/input-otp.js.map +1 -0
- package/dist/components/input.d.ts +6 -0
- package/dist/components/input.js +29 -0
- package/dist/components/input.js.map +1 -0
- package/dist/components/item.d.ts +28 -0
- package/dist/components/item.js +220 -0
- package/dist/components/item.js.map +1 -0
- package/dist/components/jiret-logo.d.ts +13 -0
- package/dist/components/jiret-logo.js +80 -0
- package/dist/components/jiret-logo.js.map +1 -0
- package/dist/components/kbd.d.ts +6 -0
- package/dist/components/kbd.js +39 -0
- package/dist/components/kbd.js.map +1 -0
- package/dist/components/label.d.ts +7 -0
- package/dist/components/label.js +32 -0
- package/dist/components/label.js.map +1 -0
- package/dist/components/menubar.d.ts +29 -0
- package/dist/components/menubar.js +261 -0
- package/dist/components/menubar.js.map +1 -0
- package/dist/components/navigation-menu.d.ts +18 -0
- package/dist/components/navigation-menu.js +178 -0
- package/dist/components/navigation-menu.js.map +1 -0
- package/dist/components/pagination.d.ts +18 -0
- package/dist/components/pagination.js +160 -0
- package/dist/components/pagination.js.map +1 -0
- package/dist/components/popover.d.ts +10 -0
- package/dist/components/popover.js +54 -0
- package/dist/components/popover.js.map +1 -0
- package/dist/components/powered-by.d.ts +5 -0
- package/dist/components/powered-by.js +98 -0
- package/dist/components/powered-by.js.map +1 -0
- package/dist/components/progress.d.ts +7 -0
- package/dist/components/progress.js +41 -0
- package/dist/components/progress.js.map +1 -0
- package/dist/components/radio-group.d.ts +8 -0
- package/dist/components/radio-group.js +55 -0
- package/dist/components/radio-group.js.map +1 -0
- package/dist/components/resizable.d.ts +11 -0
- package/dist/components/resizable.js +58 -0
- package/dist/components/resizable.js.map +1 -0
- package/dist/components/scroll-area.d.ts +8 -0
- package/dist/components/scroll-area.js +70 -0
- package/dist/components/scroll-area.js.map +1 -0
- package/dist/components/section/index.d.ts +14 -0
- package/dist/components/section/index.js +139 -0
- package/dist/components/section/index.js.map +1 -0
- package/dist/components/select.d.ts +18 -0
- package/dist/components/select.js +181 -0
- package/dist/components/select.js.map +1 -0
- package/dist/components/separator.d.ts +7 -0
- package/dist/components/separator.js +36 -0
- package/dist/components/separator.js.map +1 -0
- package/dist/components/sheet.d.ts +16 -0
- package/dist/components/sheet.js +136 -0
- package/dist/components/sheet.js.map +1 -0
- package/dist/components/sidebar.d.ts +75 -0
- package/dist/components/sidebar.js +909 -0
- package/dist/components/sidebar.js.map +1 -0
- package/dist/components/skeleton.d.ts +5 -0
- package/dist/components/skeleton.js +23 -0
- package/dist/components/skeleton.js.map +1 -0
- package/dist/components/slider.d.ts +7 -0
- package/dist/components/slider.js +76 -0
- package/dist/components/slider.js.map +1 -0
- package/dist/components/sonner.d.ts +6 -0
- package/dist/components/sonner.js +41 -0
- package/dist/components/sonner.js.map +1 -0
- package/dist/components/spinner.d.ts +6 -0
- package/dist/components/spinner.js +28 -0
- package/dist/components/spinner.js.map +1 -0
- package/dist/components/spotlight-search.d.ts +25 -0
- package/dist/components/spotlight-search.js +387 -0
- package/dist/components/spotlight-search.js.map +1 -0
- package/dist/components/switch.d.ts +7 -0
- package/dist/components/switch.js +41 -0
- package/dist/components/switch.js.map +1 -0
- package/dist/components/table.d.ts +13 -0
- package/dist/components/table.js +124 -0
- package/dist/components/table.js.map +1 -0
- package/dist/components/tabs.d.ts +10 -0
- package/dist/components/tabs.js +77 -0
- package/dist/components/tabs.js.map +1 -0
- package/dist/components/textarea.d.ts +6 -0
- package/dist/components/textarea.js +26 -0
- package/dist/components/textarea.js.map +1 -0
- package/dist/components/theme-toggle.d.ts +8 -0
- package/dist/components/theme-toggle.js +86 -0
- package/dist/components/theme-toggle.js.map +1 -0
- package/dist/components/toggle-group.d.ts +14 -0
- package/dist/components/toggle-group.js +102 -0
- package/dist/components/toggle-group.js.map +1 -0
- package/dist/components/toggle.d.ts +13 -0
- package/dist/components/toggle.js +53 -0
- package/dist/components/toggle.js.map +1 -0
- package/dist/components/tooltip.d.ts +10 -0
- package/dist/components/tooltip.js +65 -0
- package/dist/components/tooltip.js.map +1 -0
- package/dist/hooks/use-mobile.d.ts +3 -0
- package/dist/hooks/use-mobile.js +22 -0
- package/dist/hooks/use-mobile.js.map +1 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +10 -0
- package/dist/index.js.map +1 -0
- package/dist/lib/utils.d.ts +5 -0
- package/dist/lib/utils.js +10 -0
- package/dist/lib/utils.js.map +1 -0
- package/package.json +123 -0
- package/src/styles/globals.css +125 -0
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as AccordionPrimitive from '@radix-ui/react-accordion';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
|
|
5
|
+
declare function Accordion({ ...props }: React.ComponentProps<typeof AccordionPrimitive.Root>): react_jsx_runtime.JSX.Element;
|
|
6
|
+
declare function AccordionItem({ className, ...props }: React.ComponentProps<typeof AccordionPrimitive.Item>): react_jsx_runtime.JSX.Element;
|
|
7
|
+
declare function AccordionTrigger({ className, children, ...props }: React.ComponentProps<typeof AccordionPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
|
|
8
|
+
declare function AccordionContent({ className, children, ...props }: React.ComponentProps<typeof AccordionPrimitive.Content>): react_jsx_runtime.JSX.Element;
|
|
9
|
+
|
|
10
|
+
export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/lib/utils.ts
|
|
4
|
+
import { clsx } from "clsx";
|
|
5
|
+
import { twMerge } from "tailwind-merge";
|
|
6
|
+
function cn(...inputs) {
|
|
7
|
+
return twMerge(clsx(inputs));
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
// src/components/accordion.tsx
|
|
11
|
+
import * as AccordionPrimitive from "@radix-ui/react-accordion";
|
|
12
|
+
import { IconChevronDown } from "@tabler/icons-react";
|
|
13
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
14
|
+
function Accordion({
|
|
15
|
+
...props
|
|
16
|
+
}) {
|
|
17
|
+
return /* @__PURE__ */ jsx(AccordionPrimitive.Root, { "data-slot": "accordion", ...props });
|
|
18
|
+
}
|
|
19
|
+
function AccordionItem({
|
|
20
|
+
className,
|
|
21
|
+
...props
|
|
22
|
+
}) {
|
|
23
|
+
return /* @__PURE__ */ jsx(
|
|
24
|
+
AccordionPrimitive.Item,
|
|
25
|
+
{
|
|
26
|
+
"data-slot": "accordion-item",
|
|
27
|
+
className: cn("border-b last:border-b-0", className),
|
|
28
|
+
...props
|
|
29
|
+
}
|
|
30
|
+
);
|
|
31
|
+
}
|
|
32
|
+
function AccordionTrigger({
|
|
33
|
+
className,
|
|
34
|
+
children,
|
|
35
|
+
...props
|
|
36
|
+
}) {
|
|
37
|
+
return /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
|
|
38
|
+
AccordionPrimitive.Trigger,
|
|
39
|
+
{
|
|
40
|
+
"data-slot": "accordion-trigger",
|
|
41
|
+
className: cn(
|
|
42
|
+
"focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180",
|
|
43
|
+
className
|
|
44
|
+
),
|
|
45
|
+
...props,
|
|
46
|
+
children: [
|
|
47
|
+
children,
|
|
48
|
+
/* @__PURE__ */ jsx(IconChevronDown, { className: "text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200" })
|
|
49
|
+
]
|
|
50
|
+
}
|
|
51
|
+
) });
|
|
52
|
+
}
|
|
53
|
+
function AccordionContent({
|
|
54
|
+
className,
|
|
55
|
+
children,
|
|
56
|
+
...props
|
|
57
|
+
}) {
|
|
58
|
+
return /* @__PURE__ */ jsx(
|
|
59
|
+
AccordionPrimitive.Content,
|
|
60
|
+
{
|
|
61
|
+
"data-slot": "accordion-content",
|
|
62
|
+
className: "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm",
|
|
63
|
+
...props,
|
|
64
|
+
children: /* @__PURE__ */ jsx("div", { className: cn("pt-0 pb-4", className), children })
|
|
65
|
+
}
|
|
66
|
+
);
|
|
67
|
+
}
|
|
68
|
+
export {
|
|
69
|
+
Accordion,
|
|
70
|
+
AccordionContent,
|
|
71
|
+
AccordionItem,
|
|
72
|
+
AccordionTrigger
|
|
73
|
+
};
|
|
74
|
+
//# sourceMappingURL=accordion.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/accordion.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","'use client';\n\nimport { cn } from '@mesob/ui/lib/utils';\nimport * as AccordionPrimitive from '@radix-ui/react-accordion';\nimport { IconChevronDown } from '@tabler/icons-react';\nimport type * as React from 'react';\n\nfunction Accordion({\n ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Root>) {\n return <AccordionPrimitive.Root data-slot=\"accordion\" {...props} />;\n}\n\nfunction AccordionItem({\n className,\n ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Item>) {\n return (\n <AccordionPrimitive.Item\n data-slot=\"accordion-item\"\n className={cn('border-b last:border-b-0', className)}\n {...props}\n />\n );\n}\n\nfunction AccordionTrigger({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Trigger>) {\n return (\n <AccordionPrimitive.Header className=\"flex\">\n <AccordionPrimitive.Trigger\n data-slot=\"accordion-trigger\"\n className={cn(\n 'focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180',\n className,\n )}\n {...props}\n >\n {children}\n <IconChevronDown className=\"text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200\" />\n </AccordionPrimitive.Trigger>\n </AccordionPrimitive.Header>\n );\n}\n\nfunction AccordionContent({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Content>) {\n return (\n <AccordionPrimitive.Content\n data-slot=\"accordion-content\"\n className=\"data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm\"\n {...props}\n >\n <div className={cn('pt-0 pb-4', className)}>{children}</div>\n </AccordionPrimitive.Content>\n );\n}\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent };\n"],"mappings":";;;AAAA,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACFA,YAAY,wBAAwB;AACpC,SAAS,uBAAuB;AAMvB,cAuBH,YAvBG;AAHT,SAAS,UAAU;AAAA,EACjB,GAAG;AACL,GAAyD;AACvD,SAAO,oBAAoB,yBAAnB,EAAwB,aAAU,aAAa,GAAG,OAAO;AACnE;AAEA,SAAS,cAAc;AAAA,EACrB;AAAA,EACA,GAAG;AACL,GAAyD;AACvD,SACE;AAAA,IAAoB;AAAA,IAAnB;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,4BAA4B,SAAS;AAAA,MAClD,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,iBAAiB;AAAA,EACxB;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA4D;AAC1D,SACE,oBAAoB,2BAAnB,EAA0B,WAAU,QACnC;AAAA,IAAoB;AAAA,IAAnB;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,QACD,oBAAC,mBAAgB,WAAU,+GAA8G;AAAA;AAAA;AAAA,EAC3I,GACF;AAEJ;AAEA,SAAS,iBAAiB;AAAA,EACxB;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA4D;AAC1D,SACE;AAAA,IAAoB;AAAA,IAAnB;AAAA,MACC,aAAU;AAAA,MACV,WAAU;AAAA,MACT,GAAG;AAAA,MAEJ,8BAAC,SAAI,WAAW,GAAG,aAAa,SAAS,GAAI,UAAS;AAAA;AAAA,EACxD;AAEJ;","names":[]}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
|
|
5
|
+
declare function AlertDialog({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Root>): react_jsx_runtime.JSX.Element;
|
|
6
|
+
declare function AlertDialogTrigger({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
|
|
7
|
+
declare function AlertDialogPortal({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Portal>): react_jsx_runtime.JSX.Element;
|
|
8
|
+
declare function AlertDialogOverlay({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>): react_jsx_runtime.JSX.Element;
|
|
9
|
+
declare function AlertDialogContent({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Content>): react_jsx_runtime.JSX.Element;
|
|
10
|
+
declare function AlertDialogHeader({ className, ...props }: React.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
11
|
+
declare function AlertDialogFooter({ className, ...props }: React.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
12
|
+
declare function AlertDialogTitle({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Title>): react_jsx_runtime.JSX.Element;
|
|
13
|
+
declare function AlertDialogDescription({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Description>): react_jsx_runtime.JSX.Element;
|
|
14
|
+
declare function AlertDialogAction({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Action>): react_jsx_runtime.JSX.Element;
|
|
15
|
+
declare function AlertDialogCancel({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Cancel>): react_jsx_runtime.JSX.Element;
|
|
16
|
+
|
|
17
|
+
export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger };
|
|
@@ -0,0 +1,187 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/lib/utils.ts
|
|
4
|
+
import { clsx } from "clsx";
|
|
5
|
+
import { twMerge } from "tailwind-merge";
|
|
6
|
+
function cn(...inputs) {
|
|
7
|
+
return twMerge(clsx(inputs));
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
// src/components/button.tsx
|
|
11
|
+
import { Slot } from "@radix-ui/react-slot";
|
|
12
|
+
import { cva } from "class-variance-authority";
|
|
13
|
+
import { jsx } from "react/jsx-runtime";
|
|
14
|
+
var buttonVariants = cva(
|
|
15
|
+
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
|
16
|
+
{
|
|
17
|
+
variants: {
|
|
18
|
+
variant: {
|
|
19
|
+
default: "bg-primary text-primary-foreground hover:bg-primary/90",
|
|
20
|
+
destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
|
|
21
|
+
outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
|
|
22
|
+
secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
|
|
23
|
+
ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
|
|
24
|
+
link: "text-primary underline-offset-4 hover:underline"
|
|
25
|
+
},
|
|
26
|
+
size: {
|
|
27
|
+
default: "h-9 px-4 py-2 has-[>svg]:px-3",
|
|
28
|
+
sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
|
|
29
|
+
lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
|
|
30
|
+
icon: "size-9",
|
|
31
|
+
"icon-sm": "size-8",
|
|
32
|
+
"icon-lg": "size-10"
|
|
33
|
+
}
|
|
34
|
+
},
|
|
35
|
+
defaultVariants: {
|
|
36
|
+
variant: "default",
|
|
37
|
+
size: "default"
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
);
|
|
41
|
+
|
|
42
|
+
// src/components/alert-dialog.tsx
|
|
43
|
+
import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
|
|
44
|
+
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
45
|
+
function AlertDialog({
|
|
46
|
+
...props
|
|
47
|
+
}) {
|
|
48
|
+
return /* @__PURE__ */ jsx2(AlertDialogPrimitive.Root, { "data-slot": "alert-dialog", ...props });
|
|
49
|
+
}
|
|
50
|
+
function AlertDialogTrigger({
|
|
51
|
+
...props
|
|
52
|
+
}) {
|
|
53
|
+
return /* @__PURE__ */ jsx2(AlertDialogPrimitive.Trigger, { "data-slot": "alert-dialog-trigger", ...props });
|
|
54
|
+
}
|
|
55
|
+
function AlertDialogPortal({
|
|
56
|
+
...props
|
|
57
|
+
}) {
|
|
58
|
+
return /* @__PURE__ */ jsx2(AlertDialogPrimitive.Portal, { "data-slot": "alert-dialog-portal", ...props });
|
|
59
|
+
}
|
|
60
|
+
function AlertDialogOverlay({
|
|
61
|
+
className,
|
|
62
|
+
...props
|
|
63
|
+
}) {
|
|
64
|
+
return /* @__PURE__ */ jsx2(
|
|
65
|
+
AlertDialogPrimitive.Overlay,
|
|
66
|
+
{
|
|
67
|
+
"data-slot": "alert-dialog-overlay",
|
|
68
|
+
className: cn(
|
|
69
|
+
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
|
|
70
|
+
className
|
|
71
|
+
),
|
|
72
|
+
...props
|
|
73
|
+
}
|
|
74
|
+
);
|
|
75
|
+
}
|
|
76
|
+
function AlertDialogContent({
|
|
77
|
+
className,
|
|
78
|
+
...props
|
|
79
|
+
}) {
|
|
80
|
+
return /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [
|
|
81
|
+
/* @__PURE__ */ jsx2(AlertDialogOverlay, {}),
|
|
82
|
+
/* @__PURE__ */ jsx2(
|
|
83
|
+
AlertDialogPrimitive.Content,
|
|
84
|
+
{
|
|
85
|
+
"data-slot": "alert-dialog-content",
|
|
86
|
+
className: cn(
|
|
87
|
+
"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg",
|
|
88
|
+
className
|
|
89
|
+
),
|
|
90
|
+
...props
|
|
91
|
+
}
|
|
92
|
+
)
|
|
93
|
+
] });
|
|
94
|
+
}
|
|
95
|
+
function AlertDialogHeader({
|
|
96
|
+
className,
|
|
97
|
+
...props
|
|
98
|
+
}) {
|
|
99
|
+
return /* @__PURE__ */ jsx2(
|
|
100
|
+
"div",
|
|
101
|
+
{
|
|
102
|
+
"data-slot": "alert-dialog-header",
|
|
103
|
+
className: cn("flex flex-col gap-2 text-center sm:text-left", className),
|
|
104
|
+
...props
|
|
105
|
+
}
|
|
106
|
+
);
|
|
107
|
+
}
|
|
108
|
+
function AlertDialogFooter({
|
|
109
|
+
className,
|
|
110
|
+
...props
|
|
111
|
+
}) {
|
|
112
|
+
return /* @__PURE__ */ jsx2(
|
|
113
|
+
"div",
|
|
114
|
+
{
|
|
115
|
+
"data-slot": "alert-dialog-footer",
|
|
116
|
+
className: cn(
|
|
117
|
+
"flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
|
|
118
|
+
className
|
|
119
|
+
),
|
|
120
|
+
...props
|
|
121
|
+
}
|
|
122
|
+
);
|
|
123
|
+
}
|
|
124
|
+
function AlertDialogTitle({
|
|
125
|
+
className,
|
|
126
|
+
...props
|
|
127
|
+
}) {
|
|
128
|
+
return /* @__PURE__ */ jsx2(
|
|
129
|
+
AlertDialogPrimitive.Title,
|
|
130
|
+
{
|
|
131
|
+
"data-slot": "alert-dialog-title",
|
|
132
|
+
className: cn("text-lg font-semibold", className),
|
|
133
|
+
...props
|
|
134
|
+
}
|
|
135
|
+
);
|
|
136
|
+
}
|
|
137
|
+
function AlertDialogDescription({
|
|
138
|
+
className,
|
|
139
|
+
...props
|
|
140
|
+
}) {
|
|
141
|
+
return /* @__PURE__ */ jsx2(
|
|
142
|
+
AlertDialogPrimitive.Description,
|
|
143
|
+
{
|
|
144
|
+
"data-slot": "alert-dialog-description",
|
|
145
|
+
className: cn("text-muted-foreground text-sm", className),
|
|
146
|
+
...props
|
|
147
|
+
}
|
|
148
|
+
);
|
|
149
|
+
}
|
|
150
|
+
function AlertDialogAction({
|
|
151
|
+
className,
|
|
152
|
+
...props
|
|
153
|
+
}) {
|
|
154
|
+
return /* @__PURE__ */ jsx2(
|
|
155
|
+
AlertDialogPrimitive.Action,
|
|
156
|
+
{
|
|
157
|
+
className: cn(buttonVariants(), className),
|
|
158
|
+
...props
|
|
159
|
+
}
|
|
160
|
+
);
|
|
161
|
+
}
|
|
162
|
+
function AlertDialogCancel({
|
|
163
|
+
className,
|
|
164
|
+
...props
|
|
165
|
+
}) {
|
|
166
|
+
return /* @__PURE__ */ jsx2(
|
|
167
|
+
AlertDialogPrimitive.Cancel,
|
|
168
|
+
{
|
|
169
|
+
className: cn(buttonVariants({ variant: "outline" }), className),
|
|
170
|
+
...props
|
|
171
|
+
}
|
|
172
|
+
);
|
|
173
|
+
}
|
|
174
|
+
export {
|
|
175
|
+
AlertDialog,
|
|
176
|
+
AlertDialogAction,
|
|
177
|
+
AlertDialogCancel,
|
|
178
|
+
AlertDialogContent,
|
|
179
|
+
AlertDialogDescription,
|
|
180
|
+
AlertDialogFooter,
|
|
181
|
+
AlertDialogHeader,
|
|
182
|
+
AlertDialogOverlay,
|
|
183
|
+
AlertDialogPortal,
|
|
184
|
+
AlertDialogTitle,
|
|
185
|
+
AlertDialogTrigger
|
|
186
|
+
};
|
|
187
|
+
//# sourceMappingURL=alert-dialog.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/button.tsx","../../src/components/alert-dialog.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","import { cn } from '@mesob/ui/lib/utils';\nimport { Slot } from '@radix-ui/react-slot';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type * as React from 'react';\n\nconst buttonVariants = cva(\n \"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n {\n variants: {\n variant: {\n default: 'bg-primary text-primary-foreground hover:bg-primary/90',\n destructive:\n 'bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',\n outline:\n 'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',\n secondary:\n 'bg-secondary text-secondary-foreground hover:bg-secondary/80',\n ghost:\n 'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',\n link: 'text-primary underline-offset-4 hover:underline',\n },\n size: {\n default: 'h-9 px-4 py-2 has-[>svg]:px-3',\n sm: 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',\n lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',\n icon: 'size-9',\n 'icon-sm': 'size-8',\n 'icon-lg': 'size-10',\n },\n },\n defaultVariants: {\n variant: 'default',\n size: 'default',\n },\n },\n);\n\nfunction Button({\n className,\n variant,\n size,\n asChild = false,\n ...props\n}: React.ComponentProps<'button'> &\n VariantProps<typeof buttonVariants> & {\n asChild?: boolean;\n }) {\n const Comp = asChild ? Slot : 'button';\n\n return (\n <Comp\n data-slot=\"button\"\n className={cn(buttonVariants({ variant, size, className }))}\n {...props}\n />\n );\n}\n\nexport { Button, buttonVariants };\n","'use client';\n\nimport { buttonVariants } from '@mesob/ui/components/button';\nimport { cn } from '@mesob/ui/lib/utils';\nimport * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';\nimport type * as React from 'react';\n\nfunction AlertDialog({\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Root>) {\n return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />;\n}\n\nfunction AlertDialogTrigger({\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>) {\n return (\n <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />\n );\n}\n\nfunction AlertDialogPortal({\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Portal>) {\n return (\n <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />\n );\n}\n\nfunction AlertDialogOverlay({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>) {\n return (\n <AlertDialogPrimitive.Overlay\n data-slot=\"alert-dialog-overlay\"\n className={cn(\n 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction AlertDialogContent({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Content>) {\n return (\n <AlertDialogPortal>\n <AlertDialogOverlay />\n <AlertDialogPrimitive.Content\n data-slot=\"alert-dialog-content\"\n className={cn(\n 'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg',\n className,\n )}\n {...props}\n />\n </AlertDialogPortal>\n );\n}\n\nfunction AlertDialogHeader({\n className,\n ...props\n}: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"alert-dialog-header\"\n className={cn('flex flex-col gap-2 text-center sm:text-left', className)}\n {...props}\n />\n );\n}\n\nfunction AlertDialogFooter({\n className,\n ...props\n}: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"alert-dialog-footer\"\n className={cn(\n 'flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction AlertDialogTitle({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {\n return (\n <AlertDialogPrimitive.Title\n data-slot=\"alert-dialog-title\"\n className={cn('text-lg font-semibold', className)}\n {...props}\n />\n );\n}\n\nfunction AlertDialogDescription({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {\n return (\n <AlertDialogPrimitive.Description\n data-slot=\"alert-dialog-description\"\n className={cn('text-muted-foreground text-sm', className)}\n {...props}\n />\n );\n}\n\nfunction AlertDialogAction({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Action>) {\n return (\n <AlertDialogPrimitive.Action\n className={cn(buttonVariants(), className)}\n {...props}\n />\n );\n}\n\nfunction AlertDialogCancel({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Cancel>) {\n return (\n <AlertDialogPrimitive.Cancel\n className={cn(buttonVariants({ variant: 'outline' }), className)}\n {...props}\n />\n );\n}\n\nexport {\n AlertDialog,\n AlertDialogPortal,\n AlertDialogOverlay,\n AlertDialogTrigger,\n AlertDialogContent,\n AlertDialogHeader,\n AlertDialogFooter,\n AlertDialogTitle,\n AlertDialogDescription,\n AlertDialogAction,\n AlertDialogCancel,\n};\n"],"mappings":"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","names":["jsx"]}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
3
|
+
import { VariantProps } from 'class-variance-authority';
|
|
4
|
+
import * as React from 'react';
|
|
5
|
+
|
|
6
|
+
declare const alertVariants: (props?: ({
|
|
7
|
+
variant?: "default" | "destructive" | null | undefined;
|
|
8
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
9
|
+
declare function Alert({ className, variant, ...props }: React.ComponentProps<'div'> & VariantProps<typeof alertVariants>): react_jsx_runtime.JSX.Element;
|
|
10
|
+
declare function AlertTitle({ className, ...props }: React.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
11
|
+
declare function AlertDescription({ className, ...props }: React.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
|
|
12
|
+
|
|
13
|
+
export { Alert, AlertDescription, AlertTitle };
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
// src/lib/utils.ts
|
|
2
|
+
import { clsx } from "clsx";
|
|
3
|
+
import { twMerge } from "tailwind-merge";
|
|
4
|
+
function cn(...inputs) {
|
|
5
|
+
return twMerge(clsx(inputs));
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
// src/components/alert.tsx
|
|
9
|
+
import { cva } from "class-variance-authority";
|
|
10
|
+
import { jsx } from "react/jsx-runtime";
|
|
11
|
+
var alertVariants = cva(
|
|
12
|
+
"relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current",
|
|
13
|
+
{
|
|
14
|
+
variants: {
|
|
15
|
+
variant: {
|
|
16
|
+
default: "bg-card text-card-foreground",
|
|
17
|
+
destructive: "text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90"
|
|
18
|
+
}
|
|
19
|
+
},
|
|
20
|
+
defaultVariants: {
|
|
21
|
+
variant: "default"
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
);
|
|
25
|
+
function Alert({
|
|
26
|
+
className,
|
|
27
|
+
variant,
|
|
28
|
+
...props
|
|
29
|
+
}) {
|
|
30
|
+
return /* @__PURE__ */ jsx(
|
|
31
|
+
"div",
|
|
32
|
+
{
|
|
33
|
+
"data-slot": "alert",
|
|
34
|
+
role: "alert",
|
|
35
|
+
className: cn(alertVariants({ variant }), className),
|
|
36
|
+
...props
|
|
37
|
+
}
|
|
38
|
+
);
|
|
39
|
+
}
|
|
40
|
+
function AlertTitle({ className, ...props }) {
|
|
41
|
+
return /* @__PURE__ */ jsx(
|
|
42
|
+
"div",
|
|
43
|
+
{
|
|
44
|
+
"data-slot": "alert-title",
|
|
45
|
+
className: cn(
|
|
46
|
+
"col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight",
|
|
47
|
+
className
|
|
48
|
+
),
|
|
49
|
+
...props
|
|
50
|
+
}
|
|
51
|
+
);
|
|
52
|
+
}
|
|
53
|
+
function AlertDescription({
|
|
54
|
+
className,
|
|
55
|
+
...props
|
|
56
|
+
}) {
|
|
57
|
+
return /* @__PURE__ */ jsx(
|
|
58
|
+
"div",
|
|
59
|
+
{
|
|
60
|
+
"data-slot": "alert-description",
|
|
61
|
+
className: cn(
|
|
62
|
+
"text-muted-foreground col-start-2 grid justify-items-start gap-1 text-sm [&_p]:leading-relaxed",
|
|
63
|
+
className
|
|
64
|
+
),
|
|
65
|
+
...props
|
|
66
|
+
}
|
|
67
|
+
);
|
|
68
|
+
}
|
|
69
|
+
export {
|
|
70
|
+
Alert,
|
|
71
|
+
AlertDescription,
|
|
72
|
+
AlertTitle
|
|
73
|
+
};
|
|
74
|
+
//# sourceMappingURL=alert.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/lib/utils.ts","../../src/components/alert.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n","import { cn } from '@mesob/ui/lib/utils';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type * as React from 'react';\n\nconst alertVariants = cva(\n 'relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current',\n {\n variants: {\n variant: {\n default: 'bg-card text-card-foreground',\n destructive:\n 'text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90',\n },\n },\n defaultVariants: {\n variant: 'default',\n },\n },\n);\n\nfunction Alert({\n className,\n variant,\n ...props\n}: React.ComponentProps<'div'> & VariantProps<typeof alertVariants>) {\n return (\n <div\n data-slot=\"alert\"\n role=\"alert\"\n className={cn(alertVariants({ variant }), className)}\n {...props}\n />\n );\n}\n\nfunction AlertTitle({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"alert-title\"\n className={cn(\n 'col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction AlertDescription({\n className,\n ...props\n}: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"alert-description\"\n className={cn(\n 'text-muted-foreground col-start-2 grid justify-items-start gap-1 text-sm [&_p]:leading-relaxed',\n className,\n )}\n {...props}\n />\n );\n}\n\nexport { Alert, AlertTitle, AlertDescription };\n"],"mappings":";AAAA,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACJA,SAAS,WAA8B;AAyBnC;AAtBJ,IAAM,gBAAgB;AAAA,EACpB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA,QACT,aACE;AAAA,MACJ;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,IACX;AAAA,EACF;AACF;AAEA,SAAS,MAAM;AAAA,EACb;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAqE;AACnE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,WAAW,GAAG,cAAc,EAAE,QAAQ,CAAC,GAAG,SAAS;AAAA,MAClD,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,MAAM,GAAgC;AACxE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,iBAAiB;AAAA,EACxB;AAAA,EACA,GAAG;AACL,GAAgC;AAC9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ReactNode, ComponentType } from 'react';
|
|
3
|
+
|
|
4
|
+
type AnimatedTabItem = {
|
|
5
|
+
name: string;
|
|
6
|
+
value: string;
|
|
7
|
+
href?: string;
|
|
8
|
+
content?: ReactNode;
|
|
9
|
+
};
|
|
10
|
+
type LinkComponentProps = {
|
|
11
|
+
href: string;
|
|
12
|
+
className?: string;
|
|
13
|
+
children: ReactNode;
|
|
14
|
+
ref?: React.Ref<HTMLAnchorElement>;
|
|
15
|
+
};
|
|
16
|
+
type AnimatedTabsProps = {
|
|
17
|
+
tabs: AnimatedTabItem[];
|
|
18
|
+
activeTab?: string;
|
|
19
|
+
defaultTab?: string;
|
|
20
|
+
onTabChange?: (value: string) => void;
|
|
21
|
+
className?: string;
|
|
22
|
+
linkComponent?: ComponentType<LinkComponentProps>;
|
|
23
|
+
};
|
|
24
|
+
declare function AnimatedTabs({ tabs, activeTab: controlledActiveTab, defaultTab, onTabChange, className, linkComponent: LinkComponent, }: AnimatedTabsProps): react_jsx_runtime.JSX.Element;
|
|
25
|
+
|
|
26
|
+
export { type AnimatedTabItem, AnimatedTabs };
|