@loopstack/loopstack-studio 0.21.0-rc.0 → 0.21.0

package/dist/components/ui/sidebar.js

@@ -0,0 +1,557 @@
+"use client";
+import { useIsMobile } from "../../hooks/use-mobile.js";
+import { cn } from "../../lib/utils.js";
+import { Button } from "./button.js";
+import { Input } from "./input.js";
+import { Separator } from "./separator.js";
+import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle } from "./sheet.js";
+import { Skeleton } from "./skeleton.js";
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "./tooltip.js";
+import { c } from "react/compiler-runtime";
+import * as React$1 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { PanelLeftIcon } from "lucide-react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+var SIDEBAR_COOKIE_NAME = "sidebar_state", SIDEBAR_COOKIE_MAX_AGE = 3600 * 24 * 7, SIDEBAR_WIDTH = "16rem", SIDEBAR_WIDTH_MOBILE = "18rem", SIDEBAR_WIDTH_ICON = "3rem", SIDEBAR_KEYBOARD_SHORTCUT = "b", SidebarContext = React$1.createContext(null);
+function useSidebar() {
+	let t = React$1.useContext(SidebarContext);
+	if (!t) throw Error("useSidebar must be used within a SidebarProvider.");
+	return t;
+}
+function SidebarProvider(m) {
+	let h = c(36), g, _, v, y, b, x, S;
+	h[0] === m ? (g = h[1], _ = h[2], v = h[3], y = h[4], b = h[5], x = h[6], S = h[7]) : ({defaultOpen: S, open: v, onOpenChange: b, className: _, style: x, children: g, ...y} = m, h[0] = m, h[1] = g, h[2] = _, h[3] = v, h[4] = y, h[5] = b, h[6] = x, h[7] = S);
+	let C = S === void 0 ? !0 : S, w = useIsMobile(), [E, O] = React$1.useState(!1), [k, A] = React$1.useState(C), j = v ?? k, F;
+	h[8] !== j || h[9] !== b ? (F = (t) => {
+		let p = typeof t == "function" ? t(j) : t;
+		b ? b(p) : A(p), document.cookie = `${SIDEBAR_COOKIE_NAME}=${p}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
+	}, h[8] = j, h[9] = b, h[10] = F) : F = h[10];
+	let z = F, B;
+	h[11] !== w || h[12] !== z ? (B = () => w ? O(_temp) : z(_temp2), h[11] = w, h[12] = z, h[13] = B) : B = h[13];
+	let U = B, W, G;
+	h[14] === U ? (W = h[15], G = h[16]) : (W = () => {
+		let t = (t) => {
+			t.key === SIDEBAR_KEYBOARD_SHORTCUT && (t.metaKey || t.ctrlKey) && (t.preventDefault(), U());
+		};
+		return window.addEventListener("keydown", t), () => window.removeEventListener("keydown", t);
+	}, G = [U], h[14] = U, h[15] = W, h[16] = G), React$1.useEffect(W, G);
+	let K = j ? "expanded" : "collapsed", q;
+	h[17] !== w || h[18] !== j || h[19] !== E || h[20] !== z || h[21] !== K || h[22] !== U ? (q = {
+		state: K,
+		open: j,
+		setOpen: z,
+		isMobile: w,
+		openMobile: E,
+		setOpenMobile: O,
+		toggleSidebar: U
+	}, h[17] = w, h[18] = j, h[19] = E, h[20] = z, h[21] = K, h[22] = U, h[23] = q) : q = h[23];
+	let J = q, Y;
+	h[24] === x ? Y = h[25] : (Y = {
+		"--sidebar-width": SIDEBAR_WIDTH,
+		"--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
+		...x
+	}, h[24] = x, h[25] = Y);
+	let X = Y, Z;
+	h[26] === _ ? Z = h[27] : (Z = cn("group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full", _), h[26] = _, h[27] = Z);
+	let Q;
+	h[28] !== g || h[29] !== y || h[30] !== X || h[31] !== Z ? (Q = /* @__PURE__ */ jsx(TooltipProvider, {
+		delayDuration: 0,
+		children: /* @__PURE__ */ jsx("div", {
+			"data-slot": "sidebar-wrapper",
+			style: X,
+			className: Z,
+			...y,
+			children: g
+		})
+	}), h[28] = g, h[29] = y, h[30] = X, h[31] = Z, h[32] = Q) : Q = h[32];
+	let $;
+	return h[33] !== J || h[34] !== Q ? ($ = /* @__PURE__ */ jsx(SidebarContext.Provider, {
+		value: J,
+		children: Q
+	}), h[33] = J, h[34] = Q, h[35] = $) : $ = h[35], $;
+}
+function _temp2(t) {
+	return !t;
+}
+function _temp(t) {
+	return !t;
+}
+function Sidebar(t) {
+	let m = c(46), h, g, S, C, w, T;
+	m[0] === t ? (h = m[1], g = m[2], S = m[3], C = m[4], w = m[5], T = m[6]) : ({side: C, variant: w, collapsible: T, className: g, children: h, ...S} = t, m[0] = t, m[1] = h, m[2] = g, m[3] = S, m[4] = C, m[5] = w, m[6] = T);
+	let E = C === void 0 ? "left" : C, D = w === void 0 ? "sidebar" : w, k = T === void 0 ? "offcanvas" : T, { isMobile: A, state: j, openMobile: M, setOpenMobile: N } = useSidebar();
+	if (k === "none") {
+		let t;
+		m[7] === g ? t = m[8] : (t = cn("bg-sidebar text-sidebar-foreground flex h-full w-(--sidebar-width) flex-col", g), m[7] = g, m[8] = t);
+		let _;
+		return m[9] !== h || m[10] !== S || m[11] !== t ? (_ = /* @__PURE__ */ jsx("div", {
+			"data-slot": "sidebar",
+			className: t,
+			...S,
+			children: h
+		}), m[9] = h, m[10] = S, m[11] = t, m[12] = _) : _ = m[12], _;
+	}
+	if (A) {
+		let t;
+		m[13] === Symbol.for("react.memo_cache_sentinel") ? (t = { "--sidebar-width": SIDEBAR_WIDTH_MOBILE }, m[13] = t) : t = m[13];
+		let p;
+		m[14] === Symbol.for("react.memo_cache_sentinel") ? (p = /* @__PURE__ */ jsxs(SheetHeader, {
+			className: "sr-only",
+			children: [/* @__PURE__ */ jsx(SheetTitle, { children: "Sidebar" }), /* @__PURE__ */ jsx(SheetDescription, { children: "Displays the mobile sidebar." })]
+		}), m[14] = p) : p = m[14];
+		let g;
+		m[15] === h ? g = m[16] : (g = /* @__PURE__ */ jsx("div", {
+			className: "flex h-full w-full flex-col",
+			children: h
+		}), m[15] = h, m[16] = g);
+		let C;
+		m[17] !== E || m[18] !== g ? (C = /* @__PURE__ */ jsxs(SheetContent, {
+			"data-sidebar": "sidebar",
+			"data-slot": "sidebar",
+			"data-mobile": "true",
+			className: "bg-sidebar text-sidebar-foreground w-(--sidebar-width) p-0 [&>button]:hidden",
+			style: t,
+			side: E,
+			children: [p, g]
+		}), m[17] = E, m[18] = g, m[19] = C) : C = m[19];
+		let w;
+		return m[20] !== M || m[21] !== S || m[22] !== N || m[23] !== C ? (w = /* @__PURE__ */ jsx(Sheet, {
+			open: M,
+			onOpenChange: N,
+			...S,
+			children: C
+		}), m[20] = M, m[21] = S, m[22] = N, m[23] = C, m[24] = w) : w = m[24], w;
+	}
+	let P = j === "collapsed" ? k : "", I = D === "floating" || D === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)", L;
+	m[25] === I ? L = m[26] : (L = cn("relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear", "group-data-[collapsible=offcanvas]:w-0", "group-data-[side=right]:rotate-180", I), m[25] = I, m[26] = L);
+	let R;
+	m[27] === L ? R = m[28] : (R = /* @__PURE__ */ jsx("div", {
+		"data-slot": "sidebar-gap",
+		className: L
+	}), m[27] = L, m[28] = R);
+	let B = E === "left" ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]" : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]", V = D === "floating" || D === "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", H;
+	m[29] !== g || m[30] !== B || m[31] !== V ? (H = cn("fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex", B, V, g), m[29] = g, m[30] = B, m[31] = V, m[32] = H) : H = m[32];
+	let U;
+	m[33] === h ? U = m[34] : (U = /* @__PURE__ */ jsx("div", {
+		"data-sidebar": "sidebar",
+		"data-slot": "sidebar-inner",
+		className: "bg-sidebar group-data-[variant=floating]:border-sidebar-border flex h-full w-full flex-col group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:shadow-sm",
+		children: h
+	}), m[33] = h, m[34] = U);
+	let W;
+	m[35] !== S || m[36] !== H || m[37] !== U ? (W = /* @__PURE__ */ jsx("div", {
+		"data-slot": "sidebar-container",
+		className: H,
+		...S,
+		children: U
+	}), m[35] = S, m[36] = H, m[37] = U, m[38] = W) : W = m[38];
+	let G;
+	return m[39] !== E || m[40] !== j || m[41] !== W || m[42] !== P || m[43] !== R || m[44] !== D ? (G = /* @__PURE__ */ jsxs("div", {
+		className: "group peer text-sidebar-foreground hidden md:block",
+		"data-state": j,
+		"data-collapsible": P,
+		"data-variant": D,
+		"data-side": E,
+		"data-slot": "sidebar",
+		children: [R, W]
+	}), m[39] = E, m[40] = j, m[41] = W, m[42] = P, m[43] = R, m[44] = D, m[45] = G) : G = m[45], G;
+}
+function SidebarTrigger(t) {
+	let h = c(15), g, _, v;
+	h[0] === t ? (g = h[1], _ = h[2], v = h[3]) : ({className: g, onClick: _, ...v} = t, h[0] = t, h[1] = g, h[2] = _, h[3] = v);
+	let { toggleSidebar: y } = useSidebar(), b;
+	h[4] === g ? b = h[5] : (b = cn("size-7", g), h[4] = g, h[5] = b);
+	let x;
+	h[6] !== _ || h[7] !== y ? (x = (t) => {
+		_?.(t), y();
+	}, h[6] = _, h[7] = y, h[8] = x) : x = h[8];
+	let S, C;
+	h[9] === Symbol.for("react.memo_cache_sentinel") ? (S = /* @__PURE__ */ jsx(PanelLeftIcon, {}), C = /* @__PURE__ */ jsx("span", {
+		className: "sr-only",
+		children: "Toggle Sidebar"
+	}), h[9] = S, h[10] = C) : (S = h[9], C = h[10]);
+	let w;
+	return h[11] !== v || h[12] !== b || h[13] !== x ? (w = /* @__PURE__ */ jsxs(Button, {
+		"data-sidebar": "trigger",
+		"data-slot": "sidebar-trigger",
+		variant: "ghost",
+		size: "icon",
+		className: b,
+		onClick: x,
+		...v,
+		children: [S, C]
+	}), h[11] = v, h[12] = b, h[13] = x, h[14] = w) : w = h[14], w;
+}
+function SidebarRail(t) {
+	let m = c(9), h, g;
+	m[0] === t ? (h = m[1], g = m[2]) : ({className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g);
+	let { toggleSidebar: _ } = useSidebar(), v;
+	m[3] === h ? v = m[4] : (v = cn("hover:after:bg-sidebar-border absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] sm:flex", "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", "hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full", "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2", "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2", h), m[3] = h, m[4] = v);
+	let y;
+	return m[5] !== g || m[6] !== v || m[7] !== _ ? (y = /* @__PURE__ */ jsx("button", {
+		"data-sidebar": "rail",
+		"data-slot": "sidebar-rail",
+		"aria-label": "Toggle Sidebar",
+		tabIndex: -1,
+		onClick: _,
+		title: "Toggle Sidebar",
+		className: v,
+		...g
+	}), m[5] = g, m[6] = v, m[7] = _, m[8] = y) : y = m[8], y;
+}
+function SidebarInset(t) {
+	let m = c(8), h, g;
+	m[0] === t ? (h = m[1], g = m[2]) : ({className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g);
+	let _;
+	m[3] === h ? _ = m[4] : (_ = cn("bg-background relative flex w-full flex-1 flex-col overflow-auto", "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", h), m[3] = h, m[4] = _);
+	let v;
+	return m[5] !== g || m[6] !== _ ? (v = /* @__PURE__ */ jsx("main", {
+		"data-slot": "sidebar-inset",
+		className: _,
+		...g
+	}), m[5] = g, m[6] = _, m[7] = v) : v = m[7], v;
+}
+function SidebarInsetDiv(t) {
+	let m = c(8), h, g;
+	m[0] === t ? (h = m[1], g = m[2]) : ({className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g);
+	let _;
+	m[3] === h ? _ = m[4] : (_ = cn("bg-background relative flex w-full flex-1 flex-col overflow-auto", "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", h), m[3] = h, m[4] = _);
+	let v;
+	return m[5] !== g || m[6] !== _ ? (v = /* @__PURE__ */ jsx("div", {
+		"data-slot": "sidebar-inset",
+		className: _,
+		...g
+	}), m[5] = g, m[6] = _, m[7] = v) : v = m[7], v;
+}
+function SidebarInput(t) {
+	let m = c(8), g, _;
+	m[0] === t ? (g = m[1], _ = m[2]) : ({className: g, ..._} = t, m[0] = t, m[1] = g, m[2] = _);
+	let v;
+	m[3] === g ? v = m[4] : (v = cn("bg-background h-8 w-full shadow-none", g), m[3] = g, m[4] = v);
+	let y;
+	return m[5] !== _ || m[6] !== v ? (y = /* @__PURE__ */ jsx(Input, {
+		"data-slot": "sidebar-input",
+		"data-sidebar": "input",
+		className: v,
+		..._
+	}), m[5] = _, m[6] = v, m[7] = y) : y = m[7], y;
+}
+function SidebarHeader(t) {
+	let m = c(8), h, g;
+	m[0] === t ? (h = m[1], g = m[2]) : ({className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g);
+	let _;
+	m[3] === h ? _ = m[4] : (_ = cn("flex flex-col gap-2 p-2", h), m[3] = h, m[4] = _);
+	let v;
+	return m[5] !== g || m[6] !== _ ? (v = /* @__PURE__ */ jsx("div", {
+		"data-slot": "sidebar-header",
+		"data-sidebar": "header",
+		className: _,
+		...g
+	}), m[5] = g, m[6] = _, m[7] = v) : v = m[7], v;
+}
+function SidebarFooter(t) {
+	let m = c(8), h, g;
+	m[0] === t ? (h = m[1], g = m[2]) : ({className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g);
+	let _;
+	m[3] === h ? _ = m[4] : (_ = cn("flex flex-col gap-2 p-2", h), m[3] = h, m[4] = _);
+	let v;
+	return m[5] !== g || m[6] !== _ ? (v = /* @__PURE__ */ jsx("div", {
+		"data-slot": "sidebar-footer",
+		"data-sidebar": "footer",
+		className: _,
+		...g
+	}), m[5] = g, m[6] = _, m[7] = v) : v = m[7], v;
+}
+function SidebarSeparator(t) {
+	let m = c(8), h, _;
+	m[0] === t ? (h = m[1], _ = m[2]) : ({className: h, ..._} = t, m[0] = t, m[1] = h, m[2] = _);
+	let v;
+	m[3] === h ? v = m[4] : (v = cn("bg-sidebar-border mx-2 w-auto", h), m[3] = h, m[4] = v);
+	let y;
+	return m[5] !== _ || m[6] !== v ? (y = /* @__PURE__ */ jsx(Separator, {
+		"data-slot": "sidebar-separator",
+		"data-sidebar": "separator",
+		className: v,
+		..._
+	}), m[5] = _, m[6] = v, m[7] = y) : y = m[7], y;
+}
+function SidebarContent(t) {
+	let m = c(8), h, g;
+	m[0] === t ? (h = m[1], g = m[2]) : ({className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g);
+	let _;
+	m[3] === h ? _ = m[4] : (_ = cn("flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden", h), m[3] = h, m[4] = _);
+	let v;
+	return m[5] !== g || m[6] !== _ ? (v = /* @__PURE__ */ jsx("div", {
+		"data-slot": "sidebar-content",
+		"data-sidebar": "content",
+		className: _,
+		...g
+	}), m[5] = g, m[6] = _, m[7] = v) : v = m[7], v;
+}
+function SidebarGroup(t) {
+	let m = c(8), h, g;
+	m[0] === t ? (h = m[1], g = m[2]) : ({className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g);
+	let _;
+	m[3] === h ? _ = m[4] : (_ = cn("relative flex w-full min-w-0 flex-col p-2", h), m[3] = h, m[4] = _);
+	let v;
+	return m[5] !== g || m[6] !== _ ? (v = /* @__PURE__ */ jsx("div", {
+		"data-slot": "sidebar-group",
+		"data-sidebar": "group",
+		className: _,
+		...g
+	}), m[5] = g, m[6] = _, m[7] = v) : v = m[7], v;
+}
+function SidebarGroupLabel(t) {
+	let m = c(10), h, g, _;
+	m[0] === t ? (h = m[1], g = m[2], _ = m[3]) : ({className: h, asChild: _, ...g} = t, m[0] = t, m[1] = h, m[2] = g, m[3] = _);
+	let v = _ !== void 0 && _ ? Slot : "div", y;
+	m[4] === h ? y = m[5] : (y = cn("text-sidebar-foreground/70 ring-sidebar-ring flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium outline-hidden transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0", h), m[4] = h, m[5] = y);
+	let b;
+	return m[6] !== v || m[7] !== g || m[8] !== y ? (b = /* @__PURE__ */ jsx(v, {
+		"data-slot": "sidebar-group-label",
+		"data-sidebar": "group-label",
+		className: y,
+		...g
+	}), m[6] = v, m[7] = g, m[8] = y, m[9] = b) : b = m[9], b;
+}
+function SidebarGroupAction(t) {
+	let m = c(10), h, g, _;
+	m[0] === t ? (h = m[1], g = m[2], _ = m[3]) : ({className: h, asChild: _, ...g} = t, m[0] = t, m[1] = h, m[2] = g, m[3] = _);
+	let v = _ !== void 0 && _ ? Slot : "button", y;
+	m[4] === h ? y = m[5] : (y = cn("text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", "after:absolute after:-inset-2 md:after:hidden", "group-data-[collapsible=icon]:hidden", h), m[4] = h, m[5] = y);
+	let b;
+	return m[6] !== v || m[7] !== g || m[8] !== y ? (b = /* @__PURE__ */ jsx(v, {
+		"data-slot": "sidebar-group-action",
+		"data-sidebar": "group-action",
+		className: y,
+		...g
+	}), m[6] = v, m[7] = g, m[8] = y, m[9] = b) : b = m[9], b;
+}
+function SidebarGroupContent(t) {
+	let m = c(8), h, g;
+	m[0] === t ? (h = m[1], g = m[2]) : ({className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g);
+	let _;
+	m[3] === h ? _ = m[4] : (_ = cn("w-full text-sm", h), m[3] = h, m[4] = _);
+	let v;
+	return m[5] !== g || m[6] !== _ ? (v = /* @__PURE__ */ jsx("div", {
+		"data-slot": "sidebar-group-content",
+		"data-sidebar": "group-content",
+		className: _,
+		...g
+	}), m[5] = g, m[6] = _, m[7] = v) : v = m[7], v;
+}
+function SidebarMenu(t) {
+	let m = c(8), h, g;
+	m[0] === t ? (h = m[1], g = m[2]) : ({className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g);
+	let _;
+	m[3] === h ? _ = m[4] : (_ = cn("flex w-full min-w-0 flex-col gap-1", h), m[3] = h, m[4] = _);
+	let v;
+	return m[5] !== g || m[6] !== _ ? (v = /* @__PURE__ */ jsx("ul", {
+		"data-slot": "sidebar-menu",
+		"data-sidebar": "menu",
+		className: _,
+		...g
+	}), m[5] = g, m[6] = _, m[7] = v) : v = m[7], v;
+}
+function SidebarMenuItem(t) {
+	let m = c(8), h, g;
+	m[0] === t ? (h = m[1], g = m[2]) : ({className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g);
+	let _;
+	m[3] === h ? _ = m[4] : (_ = cn("group/menu-item relative", h), m[3] = h, m[4] = _);
+	let v;
+	return m[5] !== g || m[6] !== _ ? (v = /* @__PURE__ */ jsx("li", {
+		"data-slot": "sidebar-menu-item",
+		"data-sidebar": "menu-item",
+		className: _,
+		...g
+	}), m[5] = g, m[6] = _, m[7] = v) : v = m[7], v;
+}
+var sidebarMenuButtonVariants = cva("peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-hidden ring-sidebar-ring transition-[width,height,padding] 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 group-has-data-[sidebar=menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0", {
+	variants: {
+		variant: {
+			default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
+			outline: "bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]"
+		},
+		size: {
+			default: "h-8 text-sm",
+			sm: "h-7 text-xs",
+			lg: "h-12 text-sm group-data-[collapsible=icon]:p-0!"
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		size: "default"
+	}
+});
+function SidebarMenuButton(t) {
+	let m = c(28), h, g, _, v, y, b, x;
+	m[0] === t ? (h = m[1], g = m[2], _ = m[3], v = m[4], y = m[5], b = m[6], x = m[7]) : ({asChild: _, isActive: v, variant: y, size: b, tooltip: x, className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g, m[3] = _, m[4] = v, m[5] = y, m[6] = b, m[7] = x);
+	let S = _ === void 0 ? !1 : _, T = v === void 0 ? !1 : v, D = y === void 0 ? "default" : y, k = b === void 0 ? "default" : b, j = S ? Slot : "button", { isMobile: M, state: N } = useSidebar(), P;
+	m[8] !== h || m[9] !== k || m[10] !== D ? (P = cn(sidebarMenuButtonVariants({
+		variant: D,
+		size: k
+	}), h), m[8] = h, m[9] = k, m[10] = D, m[11] = P) : P = m[11];
+	let F;
+	m[12] !== j || m[13] !== T || m[14] !== g || m[15] !== k || m[16] !== P ? (F = /* @__PURE__ */ jsx(j, {
+		"data-slot": "sidebar-menu-button",
+		"data-sidebar": "menu-button",
+		"data-size": k,
+		"data-active": T,
+		className: P,
+		...g
+	}), m[12] = j, m[13] = T, m[14] = g, m[15] = k, m[16] = P, m[17] = F) : F = m[17];
+	let I = F;
+	if (!x) return I;
+	if (typeof x == "string") {
+		let t;
+		m[18] === x ? t = m[19] : (t = { children: x }, m[18] = x, m[19] = t), x = t;
+	}
+	let L;
+	m[20] === I ? L = m[21] : (L = /* @__PURE__ */ jsx(TooltipTrigger, {
+		asChild: !0,
+		children: I
+	}), m[20] = I, m[21] = L);
+	let R = N !== "collapsed" || M, B;
+	m[22] !== R || m[23] !== x ? (B = /* @__PURE__ */ jsx(TooltipContent, {
+		side: "right",
+		align: "center",
+		hidden: R,
+		...x
+	}), m[22] = R, m[23] = x, m[24] = B) : B = m[24];
+	let V;
+	return m[25] !== L || m[26] !== B ? (V = /* @__PURE__ */ jsxs(Tooltip, { children: [L, B] }), m[25] = L, m[26] = B, m[27] = V) : V = m[27], V;
+}
+function SidebarMenuDiv(t) {
+	let m = c(28), h, g, _, v, y, b, x;
+	m[0] === t ? (h = m[1], g = m[2], _ = m[3], v = m[4], y = m[5], b = m[6], x = m[7]) : ({asChild: _, isActive: v, variant: y, size: b, tooltip: x, className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g, m[3] = _, m[4] = v, m[5] = y, m[6] = b, m[7] = x);
+	let S = _ === void 0 ? !1 : _, T = v === void 0 ? !1 : v, D = y === void 0 ? "default" : y, k = b === void 0 ? "default" : b, j = S ? Slot : "div", { isMobile: M, state: N } = useSidebar(), P;
+	m[8] !== h || m[9] !== k || m[10] !== D ? (P = cn(sidebarMenuButtonVariants({
+		variant: D,
+		size: k
+	}), h), m[8] = h, m[9] = k, m[10] = D, m[11] = P) : P = m[11];
+	let F;
+	m[12] !== j || m[13] !== T || m[14] !== g || m[15] !== k || m[16] !== P ? (F = /* @__PURE__ */ jsx(j, {
+		"data-slot": "sidebar-menu-button",
+		"data-sidebar": "menu-button",
+		"data-size": k,
+		"data-active": T,
+		className: P,
+		...g
+	}), m[12] = j, m[13] = T, m[14] = g, m[15] = k, m[16] = P, m[17] = F) : F = m[17];
+	let I = F;
+	if (!x) return I;
+	if (typeof x == "string") {
+		let t;
+		m[18] === x ? t = m[19] : (t = { children: x }, m[18] = x, m[19] = t), x = t;
+	}
+	let L;
+	m[20] === I ? L = m[21] : (L = /* @__PURE__ */ jsx(TooltipTrigger, {
+		asChild: !0,
+		children: I
+	}), m[20] = I, m[21] = L);
+	let R = N !== "collapsed" || M, B;
+	m[22] !== R || m[23] !== x ? (B = /* @__PURE__ */ jsx(TooltipContent, {
+		side: "right",
+		align: "center",
+		hidden: R,
+		...x
+	}), m[22] = R, m[23] = x, m[24] = B) : B = m[24];
+	let V;
+	return m[25] !== L || m[26] !== B ? (V = /* @__PURE__ */ jsxs(Tooltip, { children: [L, B] }), m[25] = L, m[26] = B, m[27] = V) : V = m[27], V;
+}
+function SidebarMenuAction(t) {
+	let m = c(12), h, g, _, v;
+	m[0] === t ? (h = m[1], g = m[2], _ = m[3], v = m[4]) : ({className: h, asChild: _, showOnHover: v, ...g} = t, m[0] = t, m[1] = h, m[2] = g, m[3] = _, m[4] = v);
+	let y = _ === void 0 ? !1 : _, b = v === void 0 ? !1 : v, x = y ? Slot : "button", S = b && "peer-data-[active=true]/menu-button:text-sidebar-accent-foreground group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 md:opacity-0", C;
+	m[5] !== h || m[6] !== S ? (C = cn("text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0", "after:absolute after:-inset-2 md:after:hidden", "peer-data-[size=sm]/menu-button:top-1", "peer-data-[size=default]/menu-button:top-1.5", "peer-data-[size=lg]/menu-button:top-2.5", "group-data-[collapsible=icon]:hidden", S, h), m[5] = h, m[6] = S, m[7] = C) : C = m[7];
+	let w;
+	return m[8] !== x || m[9] !== g || m[10] !== C ? (w = /* @__PURE__ */ jsx(x, {
+		"data-slot": "sidebar-menu-action",
+		"data-sidebar": "menu-action",
+		className: C,
+		...g
+	}), m[8] = x, m[9] = g, m[10] = C, m[11] = w) : w = m[11], w;
+}
+function SidebarMenuBadge(t) {
+	let m = c(8), h, g;
+	m[0] === t ? (h = m[1], g = m[2]) : ({className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g);
+	let _;
+	m[3] === h ? _ = m[4] : (_ = cn("text-sidebar-foreground pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums select-none", "peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground", "peer-data-[size=sm]/menu-button:top-1", "peer-data-[size=default]/menu-button:top-1.5", "peer-data-[size=lg]/menu-button:top-2.5", "group-data-[collapsible=icon]:hidden", h), m[3] = h, m[4] = _);
+	let v;
+	return m[5] !== g || m[6] !== _ ? (v = /* @__PURE__ */ jsx("div", {
+		"data-slot": "sidebar-menu-badge",
+		"data-sidebar": "menu-badge",
+		className: _,
+		...g
+	}), m[5] = g, m[6] = _, m[7] = v) : v = m[7], v;
+}
+function SidebarMenuSkeleton(t) {
+	let m = c(14), h, g, _;
+	m[0] === t ? (h = m[1], g = m[2], _ = m[3]) : ({className: h, showIcon: _, ...g} = t, m[0] = t, m[1] = h, m[2] = g, m[3] = _);
+	let v = _ === void 0 ? !1 : _, y = `${Math.floor(Math.random() * 40) + 50}%`, b;
+	m[4] === h ? b = m[5] : (b = cn("flex h-8 items-center gap-2 rounded-md px-2", h), m[4] = h, m[5] = b);
+	let x;
+	m[6] === v ? x = m[7] : (x = v && /* @__PURE__ */ jsx(Skeleton, {
+		className: "size-4 rounded-md",
+		"data-sidebar": "menu-skeleton-icon"
+	}), m[6] = v, m[7] = x);
+	let C;
+	m[8] === Symbol.for("react.memo_cache_sentinel") ? (C = { "--skeleton-width": y }, m[8] = C) : C = m[8];
+	let w;
+	m[9] === Symbol.for("react.memo_cache_sentinel") ? (w = /* @__PURE__ */ jsx(Skeleton, {
+		className: "h-4 max-w-(--skeleton-width) flex-1",
+		"data-sidebar": "menu-skeleton-text",
+		style: C
+	}), m[9] = w) : w = m[9];
+	let T;
+	return m[10] !== g || m[11] !== b || m[12] !== x ? (T = /* @__PURE__ */ jsxs("div", {
+		"data-slot": "sidebar-menu-skeleton",
+		"data-sidebar": "menu-skeleton",
+		className: b,
+		...g,
+		children: [x, w]
+	}), m[10] = g, m[11] = b, m[12] = x, m[13] = T) : T = m[13], T;
+}
+function SidebarMenuSub(t) {
+	let m = c(8), h, g;
+	m[0] === t ? (h = m[1], g = m[2]) : ({className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g);
+	let _;
+	m[3] === h ? _ = m[4] : (_ = cn("border-sidebar-border mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l px-2.5 py-0.5", "group-data-[collapsible=icon]:hidden", h), m[3] = h, m[4] = _);
+	let v;
+	return m[5] !== g || m[6] !== _ ? (v = /* @__PURE__ */ jsx("ul", {
+		"data-slot": "sidebar-menu-sub",
+		"data-sidebar": "menu-sub",
+		className: _,
+		...g
+	}), m[5] = g, m[6] = _, m[7] = v) : v = m[7], v;
+}
+function SidebarMenuSubItem(t) {
+	let m = c(8), h, g;
+	m[0] === t ? (h = m[1], g = m[2]) : ({className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g);
+	let _;
+	m[3] === h ? _ = m[4] : (_ = cn("group/menu-sub-item relative", h), m[3] = h, m[4] = _);
+	let v;
+	return m[5] !== g || m[6] !== _ ? (v = /* @__PURE__ */ jsx("li", {
+		"data-slot": "sidebar-menu-sub-item",
+		"data-sidebar": "menu-sub-item",
+		className: _,
+		...g
+	}), m[5] = g, m[6] = _, m[7] = v) : v = m[7], v;
+}
+function SidebarMenuSubButton(t) {
+	let m = c(16), h, g, _, v, y;
+	m[0] === t ? (h = m[1], g = m[2], _ = m[3], v = m[4], y = m[5]) : ({asChild: _, size: v, isActive: y, className: h, ...g} = t, m[0] = t, m[1] = h, m[2] = g, m[3] = _, m[4] = v, m[5] = y);
+	let b = _ === void 0 ? !1 : _, x = v === void 0 ? "md" : v, S = y === void 0 ? !1 : y, C = b ? Slot : "a", w = x === "sm" && "text-xs", T = x === "md" && "text-sm", E;
+	m[6] !== h || m[7] !== w || m[8] !== T ? (E = cn("text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0", "data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground", w, T, "group-data-[collapsible=icon]:hidden", h), m[6] = h, m[7] = w, m[8] = T, m[9] = E) : E = m[9];
+	let D;
+	return m[10] !== C || m[11] !== S || m[12] !== g || m[13] !== x || m[14] !== E ? (D = /* @__PURE__ */ jsx(C, {
+		"data-slot": "sidebar-menu-sub-button",
+		"data-sidebar": "menu-sub-button",
+		"data-size": x,
+		"data-active": S,
+		className: E,
+		...g
+	}), m[10] = C, m[11] = S, m[12] = g, m[13] = x, m[14] = E, m[15] = D) : D = m[15], D;
+}
+export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarInsetDiv, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuDiv, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar };

package/dist/components/ui/skeleton.js

@@ -0,0 +1,16 @@
+import { cn } from "../../lib/utils.js";
+import { c } from "react/compiler-runtime";
+import { jsx } from "react/jsx-runtime";
+function Skeleton(r) {
+	let i = c(8), a, o;
+	i[0] === r ? (a = i[1], o = i[2]) : ({className: a, ...o} = r, i[0] = r, i[1] = a, i[2] = o);
+	let s;
+	i[3] === a ? s = i[4] : (s = cn("bg-accent animate-pulse rounded-md", a), i[3] = a, i[4] = s);
+	let l;
+	return i[5] !== o || i[6] !== s ? (l = /* @__PURE__ */ jsx("div", {
+		"data-slot": "skeleton",
+		className: s,
+		...o
+	}), i[5] = o, i[6] = s, i[7] = l) : l = i[7], l;
+}
+export { Skeleton };