@almanaclabs/blaze-ui 0.3.2 → 0.4.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 +23 -0
- package/dist/components/accordion/accordion.js +53 -0
- package/dist/components/alert/alert.js +43 -0
- package/dist/components/alert-dialog/alert-dialog.js +94 -0
- package/dist/components/aspect-ratio/aspect-ratio.js +13 -0
- package/dist/components/attachment/attachment.js +104 -0
- package/dist/components/avatar/avatar.js +50 -0
- package/dist/components/badge/badge.js +29 -0
- package/dist/components/breadcrumb/breadcrumb.js +72 -0
- package/dist/components/bubble/bubble.js +73 -0
- package/dist/components/button/button.js +46 -0
- package/dist/components/button-group/button-group.js +41 -0
- package/dist/components/calendar/calendar.js +92 -0
- package/dist/components/card/card.js +56 -0
- package/dist/components/carousel/carousel.js +110 -0
- package/dist/components/chart/chart.js +131 -0
- package/dist/components/checkbox/checkbox.js +20 -0
- package/dist/components/collapsible/collapsible.js +23 -0
- package/dist/components/combobox/combobox.js +165 -0
- package/dist/components/data-table/data-table.js +30 -0
- package/dist/components/date-picker/date-picker.js +39 -0
- package/dist/components/dialog/dialog.js +92 -0
- package/dist/components/drawer/drawer.js +121 -0
- package/dist/components/dropdown-menu/dropdown-menu.js +136 -0
- package/dist/components/empty/empty.js +59 -0
- package/dist/components/field/field.js +107 -0
- package/dist/components/hover-card/hover-card.js +36 -0
- package/dist/components/input/input.js +15 -0
- package/dist/components/input-group/input-group.js +77 -0
- package/dist/components/item/item.js +121 -0
- package/dist/components/label/label.js +13 -0
- package/dist/components/marker/marker.js +43 -0
- package/dist/components/message/message.js +49 -0
- package/dist/components/native-select/native-select.js +39 -0
- package/dist/components/pagination/pagination.js +80 -0
- package/dist/components/popover/popover.js +54 -0
- package/dist/components/progress/progress.js +45 -0
- package/dist/components/questionnaire/questionnaire-primitive.js +353 -0
- package/dist/components/questionnaire/questionnaire.js +169 -0
- package/dist/components/radio-group/radio-group.js +26 -0
- package/dist/components/scroll-area/scroll-area.js +37 -0
- package/dist/components/select/select.js +98 -0
- package/dist/components/separator/separator.js +15 -0
- package/dist/components/sheet/sheet.js +89 -0
- package/dist/components/sidebar/sidebar.js +358 -0
- package/dist/components/skeleton/skeleton.js +12 -0
- package/dist/components/slider/slider.js +37 -0
- package/dist/components/spinner/spinner.js +15 -0
- package/dist/components/switch/switch.js +19 -0
- package/dist/components/table/table.js +66 -0
- package/dist/components/tabs/tabs.js +46 -0
- package/dist/components/textarea/textarea.js +13 -0
- package/dist/components/toast/toast.js +116 -0
- package/dist/components/toggle/toggle.js +35 -0
- package/dist/components/toggle-group/toggle-group.js +52 -0
- package/dist/components/tooltip/tooltip.js +41 -0
- package/dist/hooks/use-mobile.js +14 -0
- package/dist/index.js +56 -3699
- package/dist/lib/utils.js +8 -0
- package/dist/recipes/recipe-runtime.d.ts +6 -0
- package/dist/recipes/recipe-runtime.d.ts.map +1 -0
- package/package.json +2 -1
- package/recipes/README.md +22 -0
- package/recipes/manifest.json +12 -0
- package/recipes/workspace-shell/README.md +41 -0
- package/recipes/workspace-shell/workspace-shell.tsx +386 -0
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { cn as e } from "../../lib/utils.js";
|
|
2
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
3
|
+
import { Separator as n } from "@base-ui/react/separator";
|
|
4
|
+
//#region src/components/separator/separator.tsx
|
|
5
|
+
var r = "shrink-0 bg-border data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-px data-[orientation=vertical]:self-stretch";
|
|
6
|
+
function i({ className: i, orientation: a = "horizontal", ...o }) {
|
|
7
|
+
return /* @__PURE__ */ t(n, {
|
|
8
|
+
"data-slot": "separator",
|
|
9
|
+
orientation: a,
|
|
10
|
+
className: typeof i == "function" ? (t) => e(r, i(t)) : e(r, i),
|
|
11
|
+
...o
|
|
12
|
+
});
|
|
13
|
+
}
|
|
14
|
+
//#endregion
|
|
15
|
+
export { i as Separator };
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn as e } from "../../lib/utils.js";
|
|
3
|
+
import { Button as t } from "../button/button.js";
|
|
4
|
+
import { jsx as n, jsxs as r } from "react/jsx-runtime";
|
|
5
|
+
import "react";
|
|
6
|
+
import { IconX as i } from "@tabler/icons-react";
|
|
7
|
+
import { Dialog as a } from "@base-ui/react/dialog";
|
|
8
|
+
//#region src/components/sheet/sheet.tsx
|
|
9
|
+
function o({ ...e }) {
|
|
10
|
+
return /* @__PURE__ */ n(a.Root, {
|
|
11
|
+
"data-slot": "sheet",
|
|
12
|
+
...e
|
|
13
|
+
});
|
|
14
|
+
}
|
|
15
|
+
function s({ ...e }) {
|
|
16
|
+
return /* @__PURE__ */ n(a.Trigger, {
|
|
17
|
+
"data-slot": "sheet-trigger",
|
|
18
|
+
...e
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
function c({ ...e }) {
|
|
22
|
+
return /* @__PURE__ */ n(a.Close, {
|
|
23
|
+
"data-slot": "sheet-close",
|
|
24
|
+
...e
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
function l({ ...e }) {
|
|
28
|
+
return /* @__PURE__ */ n(a.Portal, {
|
|
29
|
+
"data-slot": "sheet-portal",
|
|
30
|
+
...e
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
function u({ className: t, ...r }) {
|
|
34
|
+
return /* @__PURE__ */ n(a.Backdrop, {
|
|
35
|
+
"data-slot": "sheet-overlay",
|
|
36
|
+
className: e("fixed inset-0 z-50 bg-foreground/10 transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 supports-backdrop-filter:backdrop-blur-xs", t),
|
|
37
|
+
...r
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
function d({ className: o, children: s, side: c = "right", showCloseButton: d = !0, ...f }) {
|
|
41
|
+
return /* @__PURE__ */ r(l, { children: [/* @__PURE__ */ n(u, {}), /* @__PURE__ */ r(a.Popup, {
|
|
42
|
+
"data-slot": "sheet-content",
|
|
43
|
+
"data-side": c,
|
|
44
|
+
className: e("fixed z-50 flex flex-col gap-4 bg-popover bg-clip-padding text-sm text-popover-foreground shadow-lg transition duration-200 ease-in-out data-ending-style:opacity-0 data-starting-style:opacity-0 data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-[2.5rem] data-[side=bottom]:data-starting-style:translate-y-[2.5rem] data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:translate-x-[-2.5rem] data-[side=left]:data-starting-style:translate-x-[-2.5rem] data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-[2.5rem] data-[side=right]:data-starting-style:translate-x-[2.5rem] data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=top]:data-ending-style:translate-y-[-2.5rem] data-[side=top]:data-starting-style:translate-y-[-2.5rem] data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm", o),
|
|
45
|
+
...f,
|
|
46
|
+
children: [s, d && /* @__PURE__ */ r(a.Close, {
|
|
47
|
+
"data-slot": "sheet-close",
|
|
48
|
+
render: /* @__PURE__ */ n(t, {
|
|
49
|
+
variant: "ghost",
|
|
50
|
+
className: "absolute top-3 right-3",
|
|
51
|
+
size: "icon-sm"
|
|
52
|
+
}),
|
|
53
|
+
children: [/* @__PURE__ */ n(i, {}), /* @__PURE__ */ n("span", {
|
|
54
|
+
className: "sr-only",
|
|
55
|
+
children: "Close"
|
|
56
|
+
})]
|
|
57
|
+
})]
|
|
58
|
+
})] });
|
|
59
|
+
}
|
|
60
|
+
function f({ className: t, ...r }) {
|
|
61
|
+
return /* @__PURE__ */ n("div", {
|
|
62
|
+
"data-slot": "sheet-header",
|
|
63
|
+
className: e("flex flex-col gap-0.5 p-4", t),
|
|
64
|
+
...r
|
|
65
|
+
});
|
|
66
|
+
}
|
|
67
|
+
function p({ className: t, ...r }) {
|
|
68
|
+
return /* @__PURE__ */ n("div", {
|
|
69
|
+
"data-slot": "sheet-footer",
|
|
70
|
+
className: e("mt-auto flex flex-col gap-2 p-4", t),
|
|
71
|
+
...r
|
|
72
|
+
});
|
|
73
|
+
}
|
|
74
|
+
function m({ className: t, ...r }) {
|
|
75
|
+
return /* @__PURE__ */ n(a.Title, {
|
|
76
|
+
"data-slot": "sheet-title",
|
|
77
|
+
className: e("font-heading text-base font-medium text-foreground", t),
|
|
78
|
+
...r
|
|
79
|
+
});
|
|
80
|
+
}
|
|
81
|
+
function h({ className: t, ...r }) {
|
|
82
|
+
return /* @__PURE__ */ n(a.Description, {
|
|
83
|
+
"data-slot": "sheet-description",
|
|
84
|
+
className: e("text-sm text-muted-foreground", t),
|
|
85
|
+
...r
|
|
86
|
+
});
|
|
87
|
+
}
|
|
88
|
+
//#endregion
|
|
89
|
+
export { o as Sheet, c as SheetClose, d as SheetContent, h as SheetDescription, p as SheetFooter, f as SheetHeader, m as SheetTitle, s as SheetTrigger };
|
|
@@ -0,0 +1,358 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn as e } from "../../lib/utils.js";
|
|
3
|
+
import { Button as t } from "../button/button.js";
|
|
4
|
+
import { Separator as n } from "../separator/separator.js";
|
|
5
|
+
import { Input as r } from "../input/input.js";
|
|
6
|
+
import { Sheet as i, SheetContent as a, SheetDescription as o, SheetHeader as s, SheetTitle as c } from "../sheet/sheet.js";
|
|
7
|
+
import { useIsMobile as l } from "../../hooks/use-mobile.js";
|
|
8
|
+
import { Skeleton as u } from "../skeleton/skeleton.js";
|
|
9
|
+
import { Tooltip as d, TooltipContent as f, TooltipTrigger as p } from "../tooltip/tooltip.js";
|
|
10
|
+
import { cva as m } from "class-variance-authority";
|
|
11
|
+
import { jsx as h, jsxs as g } from "react/jsx-runtime";
|
|
12
|
+
import * as _ from "react";
|
|
13
|
+
import { IconLayoutSidebar as v } from "@tabler/icons-react";
|
|
14
|
+
import { mergeProps as y } from "@base-ui/react/merge-props";
|
|
15
|
+
import { useRender as b } from "@base-ui/react/use-render";
|
|
16
|
+
//#region src/components/sidebar/sidebar.tsx
|
|
17
|
+
var x = "sidebar_state", S = 604800, C = "16rem", w = "18rem", T = "3rem", E = "b", D = _.createContext(null);
|
|
18
|
+
function O() {
|
|
19
|
+
let e = _.useContext(D);
|
|
20
|
+
if (!e) throw Error("useSidebar must be used within a SidebarProvider.");
|
|
21
|
+
return e;
|
|
22
|
+
}
|
|
23
|
+
function k({ defaultOpen: t = !0, open: n, onOpenChange: r, className: i, style: a, children: o, ...s }) {
|
|
24
|
+
let c = l(), [u, d] = _.useState(!1), [f, p] = _.useState(t), m = n ?? f, g = _.useCallback((e) => {
|
|
25
|
+
let t = typeof e == "function" ? e(m) : e;
|
|
26
|
+
r ? r(t) : p(t), document.cookie = `${x}=${t}; path=/; max-age=${S}`;
|
|
27
|
+
}, [r, m]), v = _.useCallback(() => c ? d((e) => !e) : g((e) => !e), [
|
|
28
|
+
c,
|
|
29
|
+
g,
|
|
30
|
+
d
|
|
31
|
+
]);
|
|
32
|
+
_.useEffect(() => {
|
|
33
|
+
let e = (e) => {
|
|
34
|
+
e.key === E && (e.metaKey || e.ctrlKey) && (e.preventDefault(), v());
|
|
35
|
+
};
|
|
36
|
+
return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
|
|
37
|
+
}, [v]);
|
|
38
|
+
let y = m ? "expanded" : "collapsed", b = _.useMemo(() => ({
|
|
39
|
+
state: y,
|
|
40
|
+
open: m,
|
|
41
|
+
setOpen: g,
|
|
42
|
+
isMobile: c,
|
|
43
|
+
openMobile: u,
|
|
44
|
+
setOpenMobile: d,
|
|
45
|
+
toggleSidebar: v
|
|
46
|
+
}), [
|
|
47
|
+
y,
|
|
48
|
+
m,
|
|
49
|
+
g,
|
|
50
|
+
c,
|
|
51
|
+
u,
|
|
52
|
+
d,
|
|
53
|
+
v
|
|
54
|
+
]);
|
|
55
|
+
return /* @__PURE__ */ h(D.Provider, {
|
|
56
|
+
value: b,
|
|
57
|
+
children: /* @__PURE__ */ h("div", {
|
|
58
|
+
"data-slot": "sidebar-wrapper",
|
|
59
|
+
style: {
|
|
60
|
+
"--sidebar-width": C,
|
|
61
|
+
"--sidebar-width-icon": T,
|
|
62
|
+
...a
|
|
63
|
+
},
|
|
64
|
+
className: e("group/sidebar-wrapper flex min-h-svh w-full has-data-[variant=inset]:bg-sidebar", i),
|
|
65
|
+
...s,
|
|
66
|
+
children: o
|
|
67
|
+
})
|
|
68
|
+
});
|
|
69
|
+
}
|
|
70
|
+
function A({ side: t = "left", variant: n = "sidebar", collapsible: r = "offcanvas", className: l, children: u, dir: d, ...f }) {
|
|
71
|
+
let { isMobile: p, state: m, openMobile: _, setOpenMobile: v } = O();
|
|
72
|
+
return r === "none" ? /* @__PURE__ */ h("div", {
|
|
73
|
+
"data-slot": "sidebar",
|
|
74
|
+
className: e("flex h-full w-(--sidebar-width) flex-col bg-sidebar text-sidebar-foreground", l),
|
|
75
|
+
...f,
|
|
76
|
+
children: u
|
|
77
|
+
}) : p ? /* @__PURE__ */ h(i, {
|
|
78
|
+
open: _,
|
|
79
|
+
onOpenChange: v,
|
|
80
|
+
...f,
|
|
81
|
+
children: /* @__PURE__ */ g(a, {
|
|
82
|
+
dir: d,
|
|
83
|
+
"data-sidebar": "sidebar",
|
|
84
|
+
"data-slot": "sidebar",
|
|
85
|
+
"data-mobile": "true",
|
|
86
|
+
className: "w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden",
|
|
87
|
+
style: { "--sidebar-width": w },
|
|
88
|
+
side: t,
|
|
89
|
+
children: [/* @__PURE__ */ g(s, {
|
|
90
|
+
className: "sr-only",
|
|
91
|
+
children: [/* @__PURE__ */ h(c, { children: "Sidebar" }), /* @__PURE__ */ h(o, { children: "Displays the mobile sidebar." })]
|
|
92
|
+
}), /* @__PURE__ */ h("div", {
|
|
93
|
+
className: "flex h-full w-full flex-col",
|
|
94
|
+
children: u
|
|
95
|
+
})]
|
|
96
|
+
})
|
|
97
|
+
}) : /* @__PURE__ */ g("div", {
|
|
98
|
+
className: "group peer hidden text-sidebar-foreground md:block",
|
|
99
|
+
"data-state": m,
|
|
100
|
+
"data-collapsible": m === "collapsed" ? r : "",
|
|
101
|
+
"data-variant": n,
|
|
102
|
+
"data-side": t,
|
|
103
|
+
"data-slot": "sidebar",
|
|
104
|
+
children: [/* @__PURE__ */ h("div", {
|
|
105
|
+
"data-slot": "sidebar-gap",
|
|
106
|
+
className: e("relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear", "group-data-[collapsible=offcanvas]:w-0", "group-data-[side=right]:rotate-180", n === "floating" || n === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)")
|
|
107
|
+
}), /* @__PURE__ */ h("div", {
|
|
108
|
+
"data-slot": "sidebar-container",
|
|
109
|
+
"data-side": t,
|
|
110
|
+
className: e("fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear data-[side=left]:left-0 data-[side=left]:group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)] data-[side=right]:right-0 data-[side=right]:group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)] md:flex", n === "floating" || n === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l", l),
|
|
111
|
+
...f,
|
|
112
|
+
children: /* @__PURE__ */ h("div", {
|
|
113
|
+
"data-sidebar": "sidebar",
|
|
114
|
+
"data-slot": "sidebar-inner",
|
|
115
|
+
className: "flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:shadow-sm group-data-[variant=floating]:ring-1 group-data-[variant=floating]:ring-sidebar-border",
|
|
116
|
+
children: u
|
|
117
|
+
})
|
|
118
|
+
})]
|
|
119
|
+
});
|
|
120
|
+
}
|
|
121
|
+
function j({ className: n, onClick: r, ...i }) {
|
|
122
|
+
let { toggleSidebar: a } = O();
|
|
123
|
+
return /* @__PURE__ */ g(t, {
|
|
124
|
+
"data-sidebar": "trigger",
|
|
125
|
+
"data-slot": "sidebar-trigger",
|
|
126
|
+
variant: "ghost",
|
|
127
|
+
size: "icon-sm",
|
|
128
|
+
className: e(n),
|
|
129
|
+
onClick: (e) => {
|
|
130
|
+
r?.(e), a();
|
|
131
|
+
},
|
|
132
|
+
...i,
|
|
133
|
+
children: [/* @__PURE__ */ h(v, {}), /* @__PURE__ */ h("span", {
|
|
134
|
+
className: "sr-only",
|
|
135
|
+
children: "Toggle Sidebar"
|
|
136
|
+
})]
|
|
137
|
+
});
|
|
138
|
+
}
|
|
139
|
+
function M({ className: t, ...n }) {
|
|
140
|
+
let { toggleSidebar: r } = O();
|
|
141
|
+
return /* @__PURE__ */ h("button", {
|
|
142
|
+
"data-sidebar": "rail",
|
|
143
|
+
"data-slot": "sidebar-rail",
|
|
144
|
+
"aria-label": "Toggle Sidebar",
|
|
145
|
+
tabIndex: -1,
|
|
146
|
+
onClick: r,
|
|
147
|
+
title: "Toggle Sidebar",
|
|
148
|
+
className: e("absolute inset-y-0 z-20 hidden w-4 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:start-1/2 after:w-[2px] hover:after:bg-sidebar-border sm:flex ltr:-translate-x-1/2 rtl:-translate-x-1/2", "in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize", "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize", "group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full hover:group-data-[collapsible=offcanvas]:bg-sidebar", "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2", "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2", t),
|
|
149
|
+
...n
|
|
150
|
+
});
|
|
151
|
+
}
|
|
152
|
+
function N({ className: t, ...n }) {
|
|
153
|
+
return /* @__PURE__ */ h("main", {
|
|
154
|
+
"data-slot": "sidebar-inset",
|
|
155
|
+
className: e("relative flex w-full flex-1 flex-col bg-background md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2", t),
|
|
156
|
+
...n
|
|
157
|
+
});
|
|
158
|
+
}
|
|
159
|
+
function P({ className: t, ...n }) {
|
|
160
|
+
return /* @__PURE__ */ h(r, {
|
|
161
|
+
"data-slot": "sidebar-input",
|
|
162
|
+
"data-sidebar": "input",
|
|
163
|
+
className: e("h-8 w-full bg-background shadow-none", t),
|
|
164
|
+
...n
|
|
165
|
+
});
|
|
166
|
+
}
|
|
167
|
+
function F({ className: t, ...n }) {
|
|
168
|
+
return /* @__PURE__ */ h("div", {
|
|
169
|
+
"data-slot": "sidebar-header",
|
|
170
|
+
"data-sidebar": "header",
|
|
171
|
+
className: e("flex flex-col gap-2 p-2", t),
|
|
172
|
+
...n
|
|
173
|
+
});
|
|
174
|
+
}
|
|
175
|
+
function I({ className: t, ...n }) {
|
|
176
|
+
return /* @__PURE__ */ h("div", {
|
|
177
|
+
"data-slot": "sidebar-footer",
|
|
178
|
+
"data-sidebar": "footer",
|
|
179
|
+
className: e("flex flex-col gap-2 p-2", t),
|
|
180
|
+
...n
|
|
181
|
+
});
|
|
182
|
+
}
|
|
183
|
+
function L({ className: t, ...r }) {
|
|
184
|
+
return /* @__PURE__ */ h(n, {
|
|
185
|
+
"data-slot": "sidebar-separator",
|
|
186
|
+
"data-sidebar": "separator",
|
|
187
|
+
className: e("mx-2 w-auto bg-sidebar-border", t),
|
|
188
|
+
...r
|
|
189
|
+
});
|
|
190
|
+
}
|
|
191
|
+
function R({ className: t, ...n }) {
|
|
192
|
+
return /* @__PURE__ */ h("div", {
|
|
193
|
+
"data-slot": "sidebar-content",
|
|
194
|
+
"data-sidebar": "content",
|
|
195
|
+
className: e("no-scrollbar flex min-h-0 flex-1 flex-col gap-0 overflow-auto group-data-[collapsible=icon]:overflow-hidden", t),
|
|
196
|
+
...n
|
|
197
|
+
});
|
|
198
|
+
}
|
|
199
|
+
function z({ className: t, ...n }) {
|
|
200
|
+
return /* @__PURE__ */ h("div", {
|
|
201
|
+
"data-slot": "sidebar-group",
|
|
202
|
+
"data-sidebar": "group",
|
|
203
|
+
className: e("relative flex w-full min-w-0 flex-col p-2", t),
|
|
204
|
+
...n
|
|
205
|
+
});
|
|
206
|
+
}
|
|
207
|
+
function B({ className: t, render: n, ...r }) {
|
|
208
|
+
return b({
|
|
209
|
+
defaultTagName: "div",
|
|
210
|
+
props: y({ className: e("flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 ring-sidebar-ring outline-hidden transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", t) }, r),
|
|
211
|
+
render: n,
|
|
212
|
+
state: {
|
|
213
|
+
slot: "sidebar-group-label",
|
|
214
|
+
sidebar: "group-label"
|
|
215
|
+
}
|
|
216
|
+
});
|
|
217
|
+
}
|
|
218
|
+
function V({ className: t, render: n, ...r }) {
|
|
219
|
+
return b({
|
|
220
|
+
defaultTagName: "button",
|
|
221
|
+
props: y({ className: e("absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform group-data-[collapsible=icon]:hidden after:absolute after:-inset-2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 md:after:hidden [&>svg]:size-4 [&>svg]:shrink-0", t) }, r),
|
|
222
|
+
render: n,
|
|
223
|
+
state: {
|
|
224
|
+
slot: "sidebar-group-action",
|
|
225
|
+
sidebar: "group-action"
|
|
226
|
+
}
|
|
227
|
+
});
|
|
228
|
+
}
|
|
229
|
+
function H({ className: t, ...n }) {
|
|
230
|
+
return /* @__PURE__ */ h("div", {
|
|
231
|
+
"data-slot": "sidebar-group-content",
|
|
232
|
+
"data-sidebar": "group-content",
|
|
233
|
+
className: e("w-full text-sm", t),
|
|
234
|
+
...n
|
|
235
|
+
});
|
|
236
|
+
}
|
|
237
|
+
function U({ className: t, ...n }) {
|
|
238
|
+
return /* @__PURE__ */ h("ul", {
|
|
239
|
+
"data-slot": "sidebar-menu",
|
|
240
|
+
"data-sidebar": "menu",
|
|
241
|
+
className: e("flex w-full min-w-0 flex-col gap-0", t),
|
|
242
|
+
...n
|
|
243
|
+
});
|
|
244
|
+
}
|
|
245
|
+
function W({ className: t, ...n }) {
|
|
246
|
+
return /* @__PURE__ */ h("li", {
|
|
247
|
+
"data-slot": "sidebar-menu-item",
|
|
248
|
+
"data-sidebar": "menu-item",
|
|
249
|
+
className: e("group/menu-item relative", t),
|
|
250
|
+
...n
|
|
251
|
+
});
|
|
252
|
+
}
|
|
253
|
+
var G = m("peer/menu-button group/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:font-medium data-active:text-sidebar-accent-foreground [&_svg]:size-4 [&_svg]:shrink-0 [&>span:last-child]:truncate", {
|
|
254
|
+
variants: {
|
|
255
|
+
variant: {
|
|
256
|
+
default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
|
|
257
|
+
outline: "bg-background shadow-[0_0_0_1px_var(--sidebar-border)] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_var(--sidebar-accent)]"
|
|
258
|
+
},
|
|
259
|
+
size: {
|
|
260
|
+
default: "h-8 text-sm",
|
|
261
|
+
sm: "h-7 text-xs",
|
|
262
|
+
lg: "h-12 text-sm group-data-[collapsible=icon]:p-0!"
|
|
263
|
+
}
|
|
264
|
+
},
|
|
265
|
+
defaultVariants: {
|
|
266
|
+
variant: "default",
|
|
267
|
+
size: "default"
|
|
268
|
+
}
|
|
269
|
+
});
|
|
270
|
+
function K({ render: t, isActive: n = !1, variant: r = "default", size: i = "default", tooltip: a, className: o, ...s }) {
|
|
271
|
+
let { isMobile: c, state: l } = O(), u = b({
|
|
272
|
+
defaultTagName: "button",
|
|
273
|
+
props: y({ className: e(G({
|
|
274
|
+
variant: r,
|
|
275
|
+
size: i
|
|
276
|
+
}), o) }, s),
|
|
277
|
+
render: a ? /* @__PURE__ */ h(p, { render: t }) : t,
|
|
278
|
+
state: {
|
|
279
|
+
slot: "sidebar-menu-button",
|
|
280
|
+
sidebar: "menu-button",
|
|
281
|
+
size: i,
|
|
282
|
+
active: n
|
|
283
|
+
}
|
|
284
|
+
});
|
|
285
|
+
return a ? (typeof a == "string" && (a = { children: a }), /* @__PURE__ */ g(d, { children: [u, /* @__PURE__ */ h(f, {
|
|
286
|
+
side: "right",
|
|
287
|
+
align: "center",
|
|
288
|
+
hidden: l !== "collapsed" || c,
|
|
289
|
+
...a
|
|
290
|
+
})] })) : u;
|
|
291
|
+
}
|
|
292
|
+
function q({ className: t, render: n, showOnHover: r = !1, ...i }) {
|
|
293
|
+
return b({
|
|
294
|
+
defaultTagName: "button",
|
|
295
|
+
props: y({ className: e("absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground ring-sidebar-ring outline-hidden transition-transform group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 after:absolute after:-inset-2 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 md:after:hidden [&>svg]:size-4 [&>svg]:shrink-0", r && "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 peer-data-active/menu-button:text-sidebar-accent-foreground aria-expanded:opacity-100 md:opacity-0", t) }, i),
|
|
296
|
+
render: n,
|
|
297
|
+
state: {
|
|
298
|
+
slot: "sidebar-menu-action",
|
|
299
|
+
sidebar: "menu-action"
|
|
300
|
+
}
|
|
301
|
+
});
|
|
302
|
+
}
|
|
303
|
+
function J({ className: t, ...n }) {
|
|
304
|
+
return /* @__PURE__ */ h("div", {
|
|
305
|
+
"data-slot": "sidebar-menu-badge",
|
|
306
|
+
"data-sidebar": "menu-badge",
|
|
307
|
+
className: e("pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium text-sidebar-foreground tabular-nums select-none group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 peer-data-active/menu-button:text-sidebar-accent-foreground", t),
|
|
308
|
+
...n
|
|
309
|
+
});
|
|
310
|
+
}
|
|
311
|
+
function Y({ className: t, showIcon: n = !1, ...r }) {
|
|
312
|
+
let [i] = _.useState(() => `${Math.floor(Math.random() * 40) + 50}%`);
|
|
313
|
+
return /* @__PURE__ */ g("div", {
|
|
314
|
+
"data-slot": "sidebar-menu-skeleton",
|
|
315
|
+
"data-sidebar": "menu-skeleton",
|
|
316
|
+
className: e("flex h-8 items-center gap-2 rounded-md px-2", t),
|
|
317
|
+
...r,
|
|
318
|
+
children: [n && /* @__PURE__ */ h(u, {
|
|
319
|
+
className: "size-4 rounded-md",
|
|
320
|
+
"data-sidebar": "menu-skeleton-icon"
|
|
321
|
+
}), /* @__PURE__ */ h(u, {
|
|
322
|
+
className: "h-4 max-w-(--skeleton-width) flex-1",
|
|
323
|
+
"data-sidebar": "menu-skeleton-text",
|
|
324
|
+
style: { "--skeleton-width": i }
|
|
325
|
+
})]
|
|
326
|
+
});
|
|
327
|
+
}
|
|
328
|
+
function X({ className: t, ...n }) {
|
|
329
|
+
return /* @__PURE__ */ h("ul", {
|
|
330
|
+
"data-slot": "sidebar-menu-sub",
|
|
331
|
+
"data-sidebar": "menu-sub",
|
|
332
|
+
className: e("mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l border-sidebar-border px-2.5 py-0.5 group-data-[collapsible=icon]:hidden", t),
|
|
333
|
+
...n
|
|
334
|
+
});
|
|
335
|
+
}
|
|
336
|
+
function Z({ className: t, ...n }) {
|
|
337
|
+
return /* @__PURE__ */ h("li", {
|
|
338
|
+
"data-slot": "sidebar-menu-sub-item",
|
|
339
|
+
"data-sidebar": "menu-sub-item",
|
|
340
|
+
className: e("group/menu-sub-item relative", t),
|
|
341
|
+
...n
|
|
342
|
+
});
|
|
343
|
+
}
|
|
344
|
+
function Q({ render: t, size: n = "md", isActive: r = !1, className: i, ...a }) {
|
|
345
|
+
return b({
|
|
346
|
+
defaultTagName: "a",
|
|
347
|
+
props: y({ className: e("flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground ring-sidebar-ring outline-hidden group-data-[collapsible=icon]:hidden hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[size=md]:text-sm data-[size=sm]:text-xs data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground", i) }, a),
|
|
348
|
+
render: t,
|
|
349
|
+
state: {
|
|
350
|
+
slot: "sidebar-menu-sub-button",
|
|
351
|
+
sidebar: "menu-sub-button",
|
|
352
|
+
size: n,
|
|
353
|
+
active: r
|
|
354
|
+
}
|
|
355
|
+
});
|
|
356
|
+
}
|
|
357
|
+
//#endregion
|
|
358
|
+
export { A as Sidebar, R as SidebarContent, I as SidebarFooter, z as SidebarGroup, V as SidebarGroupAction, H as SidebarGroupContent, B as SidebarGroupLabel, F as SidebarHeader, P as SidebarInput, N as SidebarInset, U as SidebarMenu, q as SidebarMenuAction, J as SidebarMenuBadge, K as SidebarMenuButton, W as SidebarMenuItem, Y as SidebarMenuSkeleton, X as SidebarMenuSub, Q as SidebarMenuSubButton, Z as SidebarMenuSubItem, k as SidebarProvider, M as SidebarRail, L as SidebarSeparator, j as SidebarTrigger, O as useSidebar };
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { cn as e } from "../../lib/utils.js";
|
|
2
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
3
|
+
//#region src/components/skeleton/skeleton.tsx
|
|
4
|
+
function n({ className: n, ...r }) {
|
|
5
|
+
return /* @__PURE__ */ t("div", {
|
|
6
|
+
"data-slot": "skeleton",
|
|
7
|
+
className: e("animate-pulse rounded-md bg-muted", n),
|
|
8
|
+
...r
|
|
9
|
+
});
|
|
10
|
+
}
|
|
11
|
+
//#endregion
|
|
12
|
+
export { n as Skeleton };
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { cn as e } from "../../lib/utils.js";
|
|
2
|
+
import { jsx as t, jsxs as n } from "react/jsx-runtime";
|
|
3
|
+
import { Slider as r } from "@base-ui/react/slider";
|
|
4
|
+
//#region src/components/slider/slider.tsx
|
|
5
|
+
function i({ className: i, defaultValue: a, value: o, min: s = 0, max: c = 100, "aria-label": l = "Slider", "aria-labelledby": u, ...d }) {
|
|
6
|
+
let f = Array.isArray(o) ? o : Array.isArray(a) ? a : [s, c];
|
|
7
|
+
return /* @__PURE__ */ t(r.Root, {
|
|
8
|
+
className: e("data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full", i),
|
|
9
|
+
"data-slot": "slider",
|
|
10
|
+
defaultValue: a,
|
|
11
|
+
value: o,
|
|
12
|
+
min: s,
|
|
13
|
+
max: c,
|
|
14
|
+
thumbAlignment: "edge",
|
|
15
|
+
"aria-label": l,
|
|
16
|
+
"aria-labelledby": u,
|
|
17
|
+
...d,
|
|
18
|
+
children: /* @__PURE__ */ n(r.Control, {
|
|
19
|
+
className: "relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-40 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col",
|
|
20
|
+
children: [/* @__PURE__ */ t(r.Track, {
|
|
21
|
+
"data-slot": "slider-track",
|
|
22
|
+
className: "relative grow overflow-hidden rounded-full bg-muted select-none data-[orientation=horizontal]:h-1 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1",
|
|
23
|
+
children: /* @__PURE__ */ t(r.Indicator, {
|
|
24
|
+
"data-slot": "slider-range",
|
|
25
|
+
className: "bg-primary select-none data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full"
|
|
26
|
+
})
|
|
27
|
+
}), Array.from({ length: f.length }, (e, n) => /* @__PURE__ */ t(r.Thumb, {
|
|
28
|
+
"data-slot": "slider-thumb",
|
|
29
|
+
"aria-label": l && f.length > 1 ? `${l} ${n + 1}` : l,
|
|
30
|
+
"aria-labelledby": u,
|
|
31
|
+
className: "relative block size-3 shrink-0 rounded-full border border-ring bg-background 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"
|
|
32
|
+
}, n))]
|
|
33
|
+
})
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
//#endregion
|
|
37
|
+
export { i as Slider };
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { cn as e } from "../../lib/utils.js";
|
|
2
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
3
|
+
import { IconLoader2 as n } from "@tabler/icons-react";
|
|
4
|
+
//#region src/components/spinner/spinner.tsx
|
|
5
|
+
function r({ className: r, ...i }) {
|
|
6
|
+
return /* @__PURE__ */ t(n, {
|
|
7
|
+
"data-slot": "spinner",
|
|
8
|
+
role: "status",
|
|
9
|
+
"aria-label": "Loading",
|
|
10
|
+
className: e("size-4 animate-spin", r),
|
|
11
|
+
...i
|
|
12
|
+
});
|
|
13
|
+
}
|
|
14
|
+
//#endregion
|
|
15
|
+
export { r as Spinner };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn as e } from "../../lib/utils.js";
|
|
3
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
4
|
+
import { Switch as n } from "@base-ui/react/switch";
|
|
5
|
+
//#region src/components/switch/switch.tsx
|
|
6
|
+
function r({ className: r, size: i = "default", ...a }) {
|
|
7
|
+
return /* @__PURE__ */ t(n.Root, {
|
|
8
|
+
"data-slot": "switch",
|
|
9
|
+
"data-size": i,
|
|
10
|
+
className: e("peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none group-has-[:focus-visible]/field-label:border-transparent group-has-[:focus-visible]/field-label:ring-0 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-[32px] data-[size=sm]:h-[14px] data-[size=sm]:w-[24px] 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),
|
|
11
|
+
...a,
|
|
12
|
+
children: /* @__PURE__ */ t(n.Thumb, {
|
|
13
|
+
"data-slot": "switch-thumb",
|
|
14
|
+
className: "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)] dark:data-checked:bg-primary-foreground group-data-[size=default]/switch:data-unchecked:translate-x-0 group-data-[size=sm]/switch:data-unchecked:translate-x-0 dark:data-unchecked:bg-foreground"
|
|
15
|
+
})
|
|
16
|
+
});
|
|
17
|
+
}
|
|
18
|
+
//#endregion
|
|
19
|
+
export { r as Switch };
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
import { cn as e } from "../../lib/utils.js";
|
|
2
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
3
|
+
import "react";
|
|
4
|
+
//#region src/components/table/table.tsx
|
|
5
|
+
function n({ className: n, ...r }) {
|
|
6
|
+
return /* @__PURE__ */ t("div", {
|
|
7
|
+
"data-slot": "table-container",
|
|
8
|
+
className: "relative w-full overflow-x-auto",
|
|
9
|
+
children: /* @__PURE__ */ t("table", {
|
|
10
|
+
"data-slot": "table",
|
|
11
|
+
className: e("w-full caption-bottom text-sm", n),
|
|
12
|
+
...r
|
|
13
|
+
})
|
|
14
|
+
});
|
|
15
|
+
}
|
|
16
|
+
function r({ className: n, ...r }) {
|
|
17
|
+
return /* @__PURE__ */ t("thead", {
|
|
18
|
+
"data-slot": "table-header",
|
|
19
|
+
className: e("[&_tr]:border-b", n),
|
|
20
|
+
...r
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
function i({ className: n, ...r }) {
|
|
24
|
+
return /* @__PURE__ */ t("tbody", {
|
|
25
|
+
"data-slot": "table-body",
|
|
26
|
+
className: e("[&_tr:last-child]:border-0", n),
|
|
27
|
+
...r
|
|
28
|
+
});
|
|
29
|
+
}
|
|
30
|
+
function a({ className: n, ...r }) {
|
|
31
|
+
return /* @__PURE__ */ t("tfoot", {
|
|
32
|
+
"data-slot": "table-footer",
|
|
33
|
+
className: e("border-t bg-muted/50 font-medium [&>tr]:last:border-b-0", n),
|
|
34
|
+
...r
|
|
35
|
+
});
|
|
36
|
+
}
|
|
37
|
+
function o({ className: n, ...r }) {
|
|
38
|
+
return /* @__PURE__ */ t("tr", {
|
|
39
|
+
"data-slot": "table-row",
|
|
40
|
+
className: e("border-b transition-colors hover:bg-muted/50 has-aria-expanded:bg-muted/50 data-[state=selected]:bg-muted", n),
|
|
41
|
+
...r
|
|
42
|
+
});
|
|
43
|
+
}
|
|
44
|
+
function s({ className: n, ...r }) {
|
|
45
|
+
return /* @__PURE__ */ t("th", {
|
|
46
|
+
"data-slot": "table-head",
|
|
47
|
+
className: e("h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0", n),
|
|
48
|
+
...r
|
|
49
|
+
});
|
|
50
|
+
}
|
|
51
|
+
function c({ className: n, ...r }) {
|
|
52
|
+
return /* @__PURE__ */ t("td", {
|
|
53
|
+
"data-slot": "table-cell",
|
|
54
|
+
className: e("p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0", n),
|
|
55
|
+
...r
|
|
56
|
+
});
|
|
57
|
+
}
|
|
58
|
+
function l({ className: n, ...r }) {
|
|
59
|
+
return /* @__PURE__ */ t("caption", {
|
|
60
|
+
"data-slot": "table-caption",
|
|
61
|
+
className: e("mt-4 text-sm text-muted-foreground", n),
|
|
62
|
+
...r
|
|
63
|
+
});
|
|
64
|
+
}
|
|
65
|
+
//#endregion
|
|
66
|
+
export { n as Table, i as TableBody, l as TableCaption, c as TableCell, a as TableFooter, s as TableHead, r as TableHeader, o as TableRow };
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn as e } from "../../lib/utils.js";
|
|
3
|
+
import { cva as t } from "class-variance-authority";
|
|
4
|
+
import { jsx as n } from "react/jsx-runtime";
|
|
5
|
+
import { Tabs as r } from "@base-ui/react/tabs";
|
|
6
|
+
//#region src/components/tabs/tabs.tsx
|
|
7
|
+
function i({ className: t, orientation: i = "horizontal", ...a }) {
|
|
8
|
+
return /* @__PURE__ */ n(r.Root, {
|
|
9
|
+
"data-slot": "tabs",
|
|
10
|
+
"data-orientation": i,
|
|
11
|
+
orientation: i,
|
|
12
|
+
className: e("group/tabs flex gap-2 data-[orientation=horizontal]:flex-col", t),
|
|
13
|
+
...a
|
|
14
|
+
});
|
|
15
|
+
}
|
|
16
|
+
var a = t("group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-muted-foreground group-data-[orientation=horizontal]/tabs:h-8 group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col data-[variant=line]:rounded-none", {
|
|
17
|
+
variants: { variant: {
|
|
18
|
+
default: "bg-muted",
|
|
19
|
+
line: "gap-1 bg-transparent"
|
|
20
|
+
} },
|
|
21
|
+
defaultVariants: { variant: "default" }
|
|
22
|
+
});
|
|
23
|
+
function o({ className: t, variant: i = "default", ...o }) {
|
|
24
|
+
return /* @__PURE__ */ n(r.List, {
|
|
25
|
+
"data-slot": "tabs-list",
|
|
26
|
+
"data-variant": i,
|
|
27
|
+
className: e(a({ variant: i }), t),
|
|
28
|
+
...o
|
|
29
|
+
});
|
|
30
|
+
}
|
|
31
|
+
function s({ className: t, ...i }) {
|
|
32
|
+
return /* @__PURE__ */ n(r.Tab, {
|
|
33
|
+
"data-slot": "tabs-trigger",
|
|
34
|
+
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-[orientation=vertical]/tabs:w-full group-data-[orientation=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 has-data-[icon=inline-end]:pr-1 has-data-[icon=inline-start]:pl-1 aria-disabled:pointer-events-none aria-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-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100", t),
|
|
35
|
+
...i
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
function c({ className: t, ...i }) {
|
|
39
|
+
return /* @__PURE__ */ n(r.Panel, {
|
|
40
|
+
"data-slot": "tabs-content",
|
|
41
|
+
className: e("flex-1 text-sm outline-none", t),
|
|
42
|
+
...i
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
//#endregion
|
|
46
|
+
export { i as Tabs, c as TabsContent, o as TabsList, s as TabsTrigger, a as tabsListVariants };
|