shadcn-glass-ui 2.1.1 → 2.1.4

package/dist/index.js

@@ -1,14 +1,15 @@
-import { $ as BaseProgressGlass, $t as buttonGlassVariants, A as useChartHeight, At as GlassCard, B as adaptEventsOfChild, Bt as DropdownMenuGlassRadioGroup, C as sparklineContainerVariants, Ct as PopoverGlassLegacy, D as Tooltip, Dt as ModalGlass, E as Cell, Et as notificationVariants, F as selectLegendPayload, Ft as DropdownMenuGlassContent, G as SegmentedControlGlass, Gt as DropdownMenuGlassSubContent, H as isNumber, Ht as DropdownMenuGlassSeparator, I as useAppDispatch, It as DropdownMenuGlassGroup, J as progressSizes, Jt as ComboBoxGlass, K as RainbowProgressGlass, Kt as DropdownMenuGlassSubTrigger, L as useAppSelector, Lt as DropdownMenuGlassItem, M as useMargin, Mt as DropdownGlass, N as ResponsiveContainer, Nt as DropdownMenuGlass, O as setLegendSettings, Ot as modalSizes, P as useElementOffset, Pt as DropdownMenuGlassCheckboxItem, Q as StatusIndicatorGlass, Qt as ButtonGlass, R as getUniqPayload, Rt as DropdownMenuGlassLabel, S as sparklineBarVariants, St as PopoverGlassContent, T as Bar, Tt as NotificationGlass, U as useLegendPortal, Ut as DropdownMenuGlassShortcut, V as Symbols, Vt as DropdownMenuGlassRadioItem, W as Surface, Wt as DropdownMenuGlassSub, X as LanguageBarGlass, Xt as CircularProgressGlass, Y as ProfileAvatarGlass, Yt as inputVariants, Z as FlagAlertGlass, Zt as CheckboxGlass, _ as ContributionMetricsGlass, _t as SliderGlass, a as HeaderBrandingGlass, an as AvatarGlassSimple, at as insightCardVariants, b as AICardGlass, bt as PopoverGlass, c as YearCardGlass, cn as AlertGlass, ct as ExpandableHeaderGlass, d as TrustScoreDisplayGlass, dn as InteractiveCard, dt as TooltipGlassProvider, en as BadgeGlass, et as ThemeToggleGlass, f as RepositoryMetadataGlass, fn as FormFieldWrapper, ft as TooltipGlassSimple, g as MetricCardGlass, gt as TabsGlass, h as MetricsGridGlass, ht as toggleSizes, i as HeaderNavGlass, in as AvatarGlassImage, it as InsightCardGlass, j as useChartWidth, jt as cardIntensity, k as setLegendSize, kt as InputGlass, l as UserStatsLineGlass, ln as AlertGlassDescription, lt as TooltipGlass, m as RepositoryCardGlass, mn as alertVariants, mt as ToggleGlass, n as ProjectsListGlass, nn as AvatarGlass, nt as SortDropdownGlass, o as FlagsSectionGlass, on as avatarSizes, ot as insightVariantConfig, p as RepositoryHeaderGlass, pn as TouchTarget, pt as TooltipGlassTrigger, q as ProgressGlass, qt as DropdownMenuGlassTrigger, r as ProfileHeaderGlass, rn as AvatarGlassFallback, rt as SearchBoxGlass, s as CareerStatsGlass, sn as statusSizes, st as IconButtonGlass, t as TrustScoreCardGlass, tn as badgeVariants, tt as StatItemGlass, u as UserInfoGlass, un as AlertGlassTitle, ut as TooltipGlassContent, v as CircularMetricGlass, vt as SkeletonGlass, w as BarChart, wt as PopoverGlassTrigger, x as SparklineGlass, xt as PopoverGlassAnchor, y as CareerStatsHeaderGlass, yt as skeletonVariants, z as resolveDefaultProps, zt as DropdownMenuGlassPortal } from "./trust-score-card-glass-L9g0qamo.js";
+import { $ as BaseProgressGlass, $t as useLayoutEffect2, A as useChartHeight, At as modalSizes, B as adaptEventsOfChild, Bt as DropdownMenuGlassLabel, C as sparklineContainerVariants, Ct as PopoverGlassAnchor, D as Tooltip, Dt as NotificationGlass, E as Cell, Et as PopoverGlassTrigger, F as selectLegendPayload, Ft as DropdownMenuGlass, G as SegmentedControlGlass, Gt as DropdownMenuGlassShortcut, H as isNumber, Ht as DropdownMenuGlassRadioGroup, I as useAppDispatch, It as DropdownMenuGlassCheckboxItem, J as progressSizes, Jt as DropdownMenuGlassSubTrigger, K as RainbowProgressGlass, Kt as DropdownMenuGlassSub, L as useAppSelector, Lt as DropdownMenuGlassContent, M as useMargin, Mt as GlassCard, N as ResponsiveContainer, Nt as cardIntensity, O as setLegendSettings, Ot as notificationVariants, P as useElementOffset, Pt as DropdownGlass, Q as StatusIndicatorGlass, Qt as Presence, R as getUniqPayload, Rt as DropdownMenuGlassGroup, S as sparklineBarVariants, St as PopoverGlass, T as Bar, Tt as PopoverGlassLegacy, U as useLegendPortal, Ut as DropdownMenuGlassRadioItem, V as Symbols, Vt as DropdownMenuGlassPortal, W as Surface, Wt as DropdownMenuGlassSeparator, X as LanguageBarGlass, Xt as ComboBoxGlass, Y as ProfileAvatarGlass, Yt as DropdownMenuGlassTrigger, Z as FlagAlertGlass, Zt as inputVariants, _ as ContributionMetricsGlass, _n as AlertGlassTitle, _t as SliderGlass, a as HeaderBrandingGlass, an as ButtonGlass, at as insightCardVariants, b as AICardGlass, bn as TouchTarget, bt as SkeletonGlass, c as YearCardGlass, cn as badgeVariants, ct as ExpandableHeaderGlass, d as TrustScoreDisplayGlass, dn as AvatarGlassImage, dt as TooltipGlassProvider, en as useCallbackRef, et as ThemeToggleGlass, f as RepositoryMetadataGlass, fn as AvatarGlassSimple, ft as TooltipGlassSimple, g as MetricCardGlass, gn as AlertGlassDescription, gt as TabsGlass, h as MetricsGridGlass, hn as AlertGlass, ht as toggleSizes, i as HeaderNavGlass, in as CheckboxGlass, it as InsightCardGlass, j as useChartWidth, jt as InputGlass, k as setLegendSize, kt as ModalGlass, l as UserStatsLineGlass, ln as AvatarGlass, lt as TooltipGlass, m as RepositoryCardGlass, mn as statusSizes, mt as ToggleGlass, n as ProjectsListGlass, nn as composeEventHandlers, nt as SortDropdownGlass, o as FlagsSectionGlass, on as buttonGlassVariants, ot as insightVariantConfig, p as RepositoryHeaderGlass, pn as avatarSizes, pt as TooltipGlassTrigger, q as ProgressGlass, qt as DropdownMenuGlassSubContent, r as ProfileHeaderGlass, rn as CircularProgressGlass, rt as SearchBoxGlass, s as CareerStatsGlass, sn as BadgeGlass, st as IconButtonGlass, t as TrustScoreCardGlass, tn as useComposedRefs, tt as StatItemGlass, u as UserInfoGlass, un as AvatarGlassFallback, ut as TooltipGlassContent, v as CircularMetricGlass, vn as InteractiveCard, vt as useDirection, w as BarChart, wt as PopoverGlassContent, x as SparklineGlass, xn as alertVariants, xt as skeletonVariants, y as CareerStatsHeaderGlass, yn as FormFieldWrapper, yt as clamp, z as resolveDefaultProps, zt as DropdownMenuGlassItem } from "./trust-score-card-glass-zjkx4OC2.js";
 import { t as cn } from "./utils-CcyeqpKQ.js";
 import { n as useHover, t as useFocus } from "./use-focus-CX0TJJIj.js";
 import { a as getThemeConfig, i as getNextTheme, n as THEME_CONFIG, o as useTheme, r as ThemeProvider, t as THEMES } from "./theme-context-_T5r1KG4.js";
 import { n as useResponsive, t as useWallpaperTint } from "./use-wallpaper-tint-DUgmytlY.js";
 import * as React$1 from "react";
-import { createContext, forwardRef, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useState } from "react";
-import { Check } from "lucide-react";
+import { createContext, forwardRef, useCallback, useContext, useEffect, useId, useLayoutEffect, useMemo, useRef, useState } from "react";
+import { Check, ChevronDown, Menu, PanelLeft, PanelLeftClose, PanelLeftOpen, X } from "lucide-react";
 import { clsx } from "clsx";
 import { cva } from "class-variance-authority";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Slot, createSlot } from "@radix-ui/react-slot";
 import { createPortal } from "react-dom";
 const stepperRootVariants = cva("flex w-full", {
 	variants: { orientation: {
@@ -370,6 +371,413 @@ const StepperGlass = {
 	Step: StepperStep,
 	Content: StepperContent
 };
+var MOBILE_BREAKPOINT = 768;
+var SIDEBAR_COOKIE_NAME = "sidebar:state";
+var SIDEBAR_COOKIE_MAX_AGE = 3600 * 24 * 7;
+var SidebarContext = createContext(null);
+function useSidebar() {
+	const context = useContext(SidebarContext);
+	if (!context) throw new Error("useSidebar must be used within SidebarGlass.Provider. Wrap your component tree with <SidebarGlass.Provider>.");
+	return context;
+}
+const SidebarProvider = ({ children, open: controlledOpen, onOpenChange, defaultOpen = true, side = "left", variant = "sidebar", collapsible = "offcanvas", cookieName = SIDEBAR_COOKIE_NAME, keyboardShortcut = "b" }) => {
+	const [internalOpen, setInternalOpen] = useState(() => {
+		if (typeof document !== "undefined") {
+			const sidebarCookie = document.cookie.split(";").find((c) => c.trim().startsWith(`${cookieName}=`));
+			if (sidebarCookie) return sidebarCookie.split("=")[1] === "true";
+		}
+		return defaultOpen;
+	});
+	const isControlled = controlledOpen !== void 0;
+	const open = isControlled ? controlledOpen : internalOpen;
+	const setOpen = useCallback((value$1) => {
+		if (!isControlled) setInternalOpen(value$1);
+		onOpenChange?.(value$1);
+		if (typeof document !== "undefined") document.cookie = `${cookieName}=${value$1}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
+	}, [
+		isControlled,
+		onOpenChange,
+		cookieName
+	]);
+	const [openMobile, setOpenMobile] = useState(false);
+	const [isMobile, setIsMobile] = useState(() => {
+		if (typeof window === "undefined") return false;
+		return window.innerWidth < MOBILE_BREAKPOINT;
+	});
+	useEffect(() => {
+		if (typeof window === "undefined") return;
+		const checkMobile = () => {
+			const mobile = window.innerWidth < MOBILE_BREAKPOINT;
+			setIsMobile(mobile);
+			if (!mobile) setOpenMobile(false);
+		};
+		checkMobile();
+		window.addEventListener("resize", checkMobile);
+		return () => window.removeEventListener("resize", checkMobile);
+	}, []);
+	const toggleSidebar = useCallback(() => {
+		if (isMobile) setOpenMobile((prev) => !prev);
+		else setOpen(!open);
+	}, [
+		isMobile,
+		open,
+		setOpen
+	]);
+	useEffect(() => {
+		if (!keyboardShortcut) return;
+		const handleKeyDown = (e) => {
+			if (e.key === keyboardShortcut && (e.metaKey || e.ctrlKey)) {
+				e.preventDefault();
+				toggleSidebar();
+			}
+		};
+		document.addEventListener("keydown", handleKeyDown);
+		return () => document.removeEventListener("keydown", handleKeyDown);
+	}, [keyboardShortcut, toggleSidebar]);
+	const value = useMemo(() => ({
+		state: open ? "expanded" : "collapsed",
+		open,
+		setOpen,
+		openMobile,
+		setOpenMobile,
+		isMobile,
+		toggleSidebar,
+		side,
+		variant,
+		collapsible
+	}), [
+		open,
+		setOpen,
+		openMobile,
+		isMobile,
+		toggleSidebar,
+		side,
+		variant,
+		collapsible
+	]);
+	return /* @__PURE__ */ jsx(SidebarContext.Provider, {
+		value,
+		children
+	});
+};
+SidebarProvider.displayName = "SidebarGlass.Provider";
+const SidebarRoot = forwardRef(({ children, side: sideProp, variant: variantProp, collapsible: collapsibleProp, className, ...props }, ref) => {
+	const context = useSidebar();
+	const side = sideProp ?? context.side;
+	const variant = variantProp ?? context.variant;
+	const collapsible = collapsibleProp ?? context.collapsible;
+	const { state, open, openMobile, isMobile, setOpenMobile } = context;
+	if (isMobile) return /* @__PURE__ */ jsxs(ModalGlass.Root, {
+		open: openMobile,
+		onOpenChange: setOpenMobile,
+		children: [/* @__PURE__ */ jsx(ModalGlass.Overlay, {}), /* @__PURE__ */ jsx("aside", {
+			ref,
+			"data-sidebar": "sidebar",
+			"data-side": side,
+			"data-variant": variant,
+			"data-collapsible": collapsible,
+			"data-state": "expanded",
+			"data-mobile": "true",
+			className: cn("fixed inset-y-0 z-50 flex flex-col", "w-[var(--sidebar-width-mobile)]", side === "left" ? "left-0" : "right-0", className),
+			style: {
+				background: "var(--sidebar-bg)",
+				color: "var(--sidebar-foreground)",
+				borderRight: side === "left" ? "1px solid var(--sidebar-border)" : void 0,
+				borderLeft: side === "right" ? "1px solid var(--sidebar-border)" : void 0,
+				backdropFilter: "blur(var(--sidebar-backdrop-blur))",
+				WebkitBackdropFilter: "blur(var(--sidebar-backdrop-blur))",
+				boxShadow: "var(--sidebar-glow)"
+			},
+			...props,
+			children
+		})]
+	});
+	const width = !open && collapsible !== "none" && collapsible === "icon" ? "var(--sidebar-width-icon)" : "var(--sidebar-width)";
+	return /* @__PURE__ */ jsx("aside", {
+		ref,
+		"data-sidebar": "sidebar",
+		"data-side": side,
+		"data-variant": variant,
+		"data-collapsible": collapsible,
+		"data-state": state,
+		className: cn("group/sidebar relative flex flex-col", "transition-[width] duration-300 ease-in-out", collapsible === "offcanvas" && !open && "w-0 overflow-hidden", variant === "floating" && "rounded-xl m-2", variant === "inset" && "rounded-xl", className),
+		style: {
+			width: collapsible === "offcanvas" && !open ? 0 : width,
+			background: "var(--sidebar-bg)",
+			color: "var(--sidebar-foreground)",
+			borderRight: side === "left" && variant !== "floating" ? "1px solid var(--sidebar-border)" : void 0,
+			borderLeft: side === "right" && variant !== "floating" ? "1px solid var(--sidebar-border)" : void 0,
+			border: variant === "floating" ? "1px solid var(--sidebar-border)" : void 0,
+			backdropFilter: "blur(var(--sidebar-backdrop-blur))",
+			WebkitBackdropFilter: "blur(var(--sidebar-backdrop-blur))",
+			boxShadow: variant === "floating" ? "var(--sidebar-glow)" : void 0
+		},
+		...props,
+		children
+	});
+});
+SidebarRoot.displayName = "SidebarGlass.Root";
+const SidebarHeader = forwardRef(({ children, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		"data-sidebar": "header",
+		className: cn("flex shrink-0 flex-col gap-2 p-4", "border-b", className),
+		style: { borderColor: "var(--sidebar-border)" },
+		...props,
+		children
+	});
+});
+SidebarHeader.displayName = "SidebarGlass.Header";
+const SidebarContent = forwardRef(({ children, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		"data-sidebar": "content",
+		className: cn("flex flex-1 flex-col gap-4 overflow-auto p-4", "[&::-webkit-scrollbar]:w-1.5", "[&::-webkit-scrollbar-track]:bg-transparent", "[&::-webkit-scrollbar-thumb]:rounded-full", "[&::-webkit-scrollbar-thumb]:bg-white/10", className),
+		...props,
+		children
+	});
+});
+SidebarContent.displayName = "SidebarGlass.Content";
+const SidebarFooter = forwardRef(({ children, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		"data-sidebar": "footer",
+		className: cn("flex shrink-0 flex-col gap-2 p-4", "border-t", className),
+		style: { borderColor: "var(--sidebar-border)" },
+		...props,
+		children
+	});
+});
+SidebarFooter.displayName = "SidebarGlass.Footer";
+const SidebarRail = forwardRef(({ className, ...props }, ref) => {
+	const { toggleSidebar, side } = useSidebar();
+	return /* @__PURE__ */ jsx("button", {
+		ref,
+		"data-sidebar": "rail",
+		"aria-label": "Toggle Sidebar",
+		tabIndex: -1,
+		onClick: toggleSidebar,
+		className: cn("absolute inset-y-0 z-20 w-4", "hidden group-hover/sidebar:block", "-translate-x-1/2 transition-all ease-linear", "after:absolute after:inset-y-0 after:left-1/2 after:w-[2px]", "hover:after:bg-[var(--sidebar-border)]", "cursor-col-resize", side === "left" ? "-right-2" : "-left-2", className),
+		...props
+	});
+});
+SidebarRail.displayName = "SidebarGlass.Rail";
+const SidebarInset = forwardRef(({ children, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx("main", {
+		ref,
+		"data-sidebar": "inset",
+		className: cn("flex flex-1 flex-col", "min-h-screen", className),
+		...props,
+		children
+	});
+});
+SidebarInset.displayName = "SidebarGlass.Inset";
+const SidebarTrigger = forwardRef(({ asChild = false, className, children, ...props }, ref) => {
+	const { toggleSidebar } = useSidebar();
+	return /* @__PURE__ */ jsxs(asChild ? Slot : "button", {
+		ref,
+		"data-sidebar": "trigger",
+		onClick: toggleSidebar,
+		className: cn("inline-flex items-center justify-center", "h-9 w-9 rounded-lg", "text-sm font-medium", "transition-colors", "text-[var(--sidebar-foreground)]/60", "hover:bg-[var(--sidebar-accent)]", "hover:text-[var(--sidebar-accent-foreground)]", "focus-visible:outline-none focus-visible:ring-2", "focus-visible:ring-[var(--sidebar-ring)]", "disabled:pointer-events-none disabled:opacity-50", className),
+		...props,
+		children: [children ?? /* @__PURE__ */ jsx(PanelLeft, { className: "h-6 w-6" }), !children && /* @__PURE__ */ jsx("span", {
+			className: "sr-only",
+			children: "Toggle Sidebar"
+		})]
+	});
+});
+SidebarTrigger.displayName = "SidebarGlass.Trigger";
+const SidebarSeparator = forwardRef(({ className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx("hr", {
+		ref,
+		"data-sidebar": "separator",
+		className: cn("mx-4 my-2 h-px border-0", className),
+		style: { background: "var(--sidebar-border)" },
+		...props
+	});
+});
+SidebarSeparator.displayName = "SidebarGlass.Separator";
+const SidebarGroup = forwardRef(({ children, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		"data-sidebar": "group",
+		className: cn("flex flex-col gap-2 p-2", className),
+		...props,
+		children
+	});
+});
+SidebarGroup.displayName = "SidebarGlass.Group";
+const SidebarGroupLabel = forwardRef(({ children, asChild = false, className, ...props }, ref) => {
+	const { state } = useSidebar();
+	return /* @__PURE__ */ jsx(asChild ? Slot : "div", {
+		ref,
+		"data-sidebar": "group-label",
+		"data-state": state,
+		className: cn("flex h-8 shrink-0 items-center px-2", "text-xs font-medium text-[var(--sidebar-foreground)]/60", "transition-[margin,opacity] duration-200 ease-linear", "group-data-[state=collapsed]/sidebar:h-0 group-data-[state=collapsed]/sidebar:overflow-hidden", "group-data-[state=collapsed]/sidebar:opacity-0", className),
+		...props,
+		children
+	});
+});
+SidebarGroupLabel.displayName = "SidebarGlass.GroupLabel";
+const SidebarGroupAction = forwardRef(({ asChild = false, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx(asChild ? Slot : "button", {
+		ref,
+		"data-sidebar": "group-action",
+		className: cn("absolute right-2 top-2.5", "flex aspect-square w-5 items-center justify-center", "rounded-md p-0 text-[var(--sidebar-foreground)]/60", "ring-[var(--sidebar-ring)]", "transition-transform hover:bg-[var(--sidebar-accent)]", "hover:text-[var(--sidebar-foreground)]", "focus-visible:outline-none focus-visible:ring-2", "[&>svg]:size-4 [&>svg]:shrink-0", "group-data-[state=collapsed]/sidebar:hidden", "after:absolute after:-inset-2 after:md:hidden", className),
+		...props
+	});
+});
+SidebarGroupAction.displayName = "SidebarGlass.GroupAction";
+const SidebarGroupContent = forwardRef(({ children, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		"data-sidebar": "group-content",
+		className: cn("flex flex-col gap-1", className),
+		...props,
+		children
+	});
+});
+SidebarGroupContent.displayName = "SidebarGlass.GroupContent";
+const SidebarMenu = forwardRef(({ children, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx("ul", {
+		ref,
+		"data-sidebar": "menu",
+		className: cn("flex w-full flex-col gap-1", className),
+		...props,
+		children
+	});
+});
+SidebarMenu.displayName = "SidebarGlass.Menu";
+const SidebarMenuItem = forwardRef(({ children, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx("li", {
+		ref,
+		"data-sidebar": "menu-item",
+		className: cn("group/menu-item relative text-[var(--sidebar-foreground)]/60", className),
+		...props,
+		children
+	});
+});
+SidebarMenuItem.displayName = "SidebarGlass.MenuItem";
+var menuButtonSizeClasses = {
+	default: "h-8 text-sm",
+	sm: "h-7 text-xs",
+	lg: "h-10 text-sm group-data-[state=collapsed]/sidebar:!p-0"
+};
+const SidebarMenuButton = forwardRef(({ asChild = false, isActive = false, tooltip, size = "default", variant = "default", className, children, ...props }, ref) => {
+	const { state, isMobile } = useSidebar();
+	const button = /* @__PURE__ */ jsx(asChild ? Slot : "button", {
+		ref,
+		"data-sidebar": "menu-button",
+		"data-active": isActive,
+		"data-size": size,
+		className: cn("peer/menu-button flex w-full items-center gap-2", "overflow-hidden rounded-md px-2", "ring-[var(--sidebar-ring)]", "transition-[width,height,padding] duration-200 ease-linear", "focus-visible:outline-none focus-visible:ring-2", "active:bg-[var(--sidebar-accent)] active:text-[var(--sidebar-accent-foreground)]", "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", menuButtonSizeClasses[size], variant === "default" && ["hover:bg-[var(--sidebar-accent)] hover:text-[var(--sidebar-accent-foreground)]"], variant === "outline" && [
+			"bg-transparent shadow-none",
+			"hover:bg-[var(--sidebar-accent)] hover:text-[var(--sidebar-accent-foreground)]",
+			"hover:shadow-[0_0_0_1px_var(--sidebar-border)]"
+		], isActive && ["bg-[var(--sidebar-primary)] text-[var(--sidebar-primary-foreground)]", "hover:bg-[var(--sidebar-primary)] hover:text-[var(--sidebar-primary-foreground)]"], "group-data-[state=collapsed]/sidebar:w-8 group-data-[state=collapsed]/sidebar:!px-0", "group-data-[state=collapsed]/sidebar:justify-center", className),
+		...props,
+		children
+	});
+	if (!tooltip || isMobile || state === "expanded") return button;
+	return /* @__PURE__ */ jsx(TooltipGlassSimple, {
+		content: typeof tooltip === "string" ? tooltip : String(tooltip),
+		side: "right",
+		children: button
+	});
+});
+SidebarMenuButton.displayName = "SidebarGlass.MenuButton";
+const SidebarMenuAction = forwardRef(({ asChild = false, showOnHover = false, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx(asChild ? Slot : "button", {
+		ref,
+		"data-sidebar": "menu-action",
+		className: cn("absolute right-1 top-1.5", "flex aspect-square w-5 items-center justify-center", "rounded-md p-0 text-[var(--sidebar-foreground)]/60", "ring-[var(--sidebar-ring)]", "transition-transform hover:bg-[var(--sidebar-accent)]", "hover:text-[var(--sidebar-foreground)]", "focus-visible:outline-none focus-visible:ring-2", "[&>svg]:size-4 [&>svg]:shrink-0", "group-data-[state=collapsed]/sidebar:hidden", showOnHover && "peer-hover/menu-button:opacity-100 group-focus-within/menu-item:opacity-100", showOnHover && "data-[state=open]:opacity-100 md:opacity-0", "after:absolute after:-inset-2 after:md:hidden", className),
+		...props
+	});
+});
+SidebarMenuAction.displayName = "SidebarGlass.MenuAction";
+const SidebarMenuBadge = forwardRef(({ children, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		"data-sidebar": "menu-badge",
+		className: cn("pointer-events-none absolute right-1 flex h-5 min-w-5", "select-none items-center justify-center", "rounded-md px-1 text-xs font-medium tabular-nums", "text-[var(--sidebar-foreground)]/60", "group-data-[state=collapsed]/sidebar:hidden", className),
+		...props,
+		children
+	});
+});
+SidebarMenuBadge.displayName = "SidebarGlass.MenuBadge";
+const SidebarMenuSkeleton = forwardRef(({ showIcon = false, className, ...props }, ref) => {
+	const width = "70%";
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		"data-sidebar": "menu-skeleton",
+		className: cn("flex h-8 items-center gap-2 rounded-md px-2", className),
+		...props,
+		children: [showIcon && /* @__PURE__ */ jsx(SkeletonGlass, { className: "size-4 rounded-md" }), /* @__PURE__ */ jsx(SkeletonGlass, {
+			className: "h-4 max-w-[var(--skeleton-width)] flex-1",
+			style: { "--skeleton-width": width }
+		})]
+	});
+});
+SidebarMenuSkeleton.displayName = "SidebarGlass.MenuSkeleton";
+var SidebarMenuSubContext = createContext(null);
+const SidebarMenuSub = forwardRef(({ children, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx(SidebarMenuSubContext.Provider, {
+		value: { open: true },
+		children: /* @__PURE__ */ jsx("ul", {
+			ref,
+			"data-sidebar": "menu-sub",
+			className: cn("flex min-w-0 flex-col gap-1", "mx-3.5 border-l border-[var(--sidebar-border)] px-2.5 py-0.5", "group-data-[state=collapsed]/sidebar:hidden", className),
+			...props,
+			children
+		})
+	});
+});
+SidebarMenuSub.displayName = "SidebarGlass.MenuSub";
+const SidebarMenuSubItem = forwardRef(({ children, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx("li", {
+		ref,
+		"data-sidebar": "menu-sub-item",
+		className: cn(className),
+		...props,
+		children
+	});
+});
+SidebarMenuSubItem.displayName = "SidebarGlass.MenuSubItem";
+const SidebarMenuSubButton = forwardRef(({ asChild = false, isActive = false, size = "md", className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx(asChild ? Slot : "a", {
+		ref,
+		"data-sidebar": "menu-sub-button",
+		"data-active": isActive,
+		"data-size": size,
+		className: cn("flex min-w-0 items-center gap-2", "-ml-px rounded-md border-l border-transparent", "text-[var(--sidebar-foreground)]/60", "ring-[var(--sidebar-ring)]", "transition-colors", "hover:border-[var(--sidebar-border)]", "hover:bg-[var(--sidebar-accent)]", "hover:text-[var(--sidebar-accent-foreground)]", "focus-visible:outline-none focus-visible:ring-2", "active:bg-[var(--sidebar-accent)] active:text-[var(--sidebar-accent-foreground)]", "disabled:pointer-events-none disabled:opacity-50", "[&>span:last-child]:truncate", "[&>svg]:size-4 [&>svg]:shrink-0", size === "sm" && "h-7 px-2 text-xs", size === "md" && "h-8 px-2 text-sm", isActive && ["border-[var(--sidebar-primary)]", "text-[var(--sidebar-foreground)]"], className),
+		...props
+	});
+});
+SidebarMenuSubButton.displayName = "SidebarGlass.MenuSubButton";
+const SidebarGlass = {
+	Provider: SidebarProvider,
+	Root: SidebarRoot,
+	Header: SidebarHeader,
+	Content: SidebarContent,
+	Footer: SidebarFooter,
+	Rail: SidebarRail,
+	Inset: SidebarInset,
+	Trigger: SidebarTrigger,
+	Separator: SidebarSeparator,
+	Group: SidebarGroup,
+	GroupLabel: SidebarGroupLabel,
+	GroupAction: SidebarGroupAction,
+	GroupContent: SidebarGroupContent,
+	Menu: SidebarMenu,
+	MenuItem: SidebarMenuItem,
+	MenuButton: SidebarMenuButton,
+	MenuAction: SidebarMenuAction,
+	MenuBadge: SidebarMenuBadge,
+	MenuSkeleton: SidebarMenuSkeleton,
+	MenuSub: SidebarMenuSub,
+	MenuSubItem: SidebarMenuSubItem,
+	MenuSubButton: SidebarMenuSubButton
+};
 function _extends$1() {
 	return _extends$1 = Object.assign ? Object.assign.bind() : function(n) {
 		for (var e = 1; e < arguments.length; e++) {
@@ -705,6 +1113,1245 @@ function Legend(outsideProps) {
 	}))), legendPortal);
 }
 Legend.displayName = "Legend";
+var Primitive = [
+	"a",
+	"button",
+	"div",
+	"form",
+	"h2",
+	"h3",
+	"img",
+	"input",
+	"label",
+	"li",
+	"nav",
+	"ol",
+	"p",
+	"select",
+	"span",
+	"svg",
+	"ul"
+].reduce((primitive, node) => {
+	const Slot$1 = createSlot(`Primitive.${node}`);
+	const Node = React$1.forwardRef((props, forwardedRef) => {
+		const { asChild, ...primitiveProps } = props;
+		const Comp = asChild ? Slot$1 : node;
+		if (typeof window !== "undefined") window[Symbol.for("radix-ui")] = true;
+		return /* @__PURE__ */ jsx(Comp, {
+			...primitiveProps,
+			ref: forwardedRef
+		});
+	});
+	Node.displayName = `Primitive.${node}`;
+	return {
+		...primitive,
+		[node]: Node
+	};
+}, {});
+function createContextScope(scopeName, createContextScopeDeps = []) {
+	let defaultContexts = [];
+	function createContext3(rootComponentName, defaultContext) {
+		const BaseContext = React$1.createContext(defaultContext);
+		const index = defaultContexts.length;
+		defaultContexts = [...defaultContexts, defaultContext];
+		const Provider = (props) => {
+			const { scope, children, ...context } = props;
+			const Context = scope?.[scopeName]?.[index] || BaseContext;
+			const value = React$1.useMemo(() => context, Object.values(context));
+			return /* @__PURE__ */ jsx(Context.Provider, {
+				value,
+				children
+			});
+		};
+		Provider.displayName = rootComponentName + "Provider";
+		function useContext2(consumerName, scope) {
+			const Context = scope?.[scopeName]?.[index] || BaseContext;
+			const context = React$1.useContext(Context);
+			if (context) return context;
+			if (defaultContext !== void 0) return defaultContext;
+			throw new Error(`\`${consumerName}\` must be used within \`${rootComponentName}\``);
+		}
+		return [Provider, useContext2];
+	}
+	const createScope = () => {
+		const scopeContexts = defaultContexts.map((defaultContext) => {
+			return React$1.createContext(defaultContext);
+		});
+		return function useScope(scope) {
+			const contexts = scope?.[scopeName] || scopeContexts;
+			return React$1.useMemo(() => ({ [`__scope${scopeName}`]: {
+				...scope,
+				[scopeName]: contexts
+			} }), [scope, contexts]);
+		};
+	};
+	createScope.scopeName = scopeName;
+	return [createContext3, composeContextScopes(createScope, ...createContextScopeDeps)];
+}
+function composeContextScopes(...scopes) {
+	const baseScope = scopes[0];
+	if (scopes.length === 1) return baseScope;
+	const createScope = () => {
+		const scopeHooks = scopes.map((createScope2) => ({
+			useScope: createScope2(),
+			scopeName: createScope2.scopeName
+		}));
+		return function useComposedScopes(overrideScopes) {
+			const nextScopes = scopeHooks.reduce((nextScopes2, { useScope, scopeName }) => {
+				const currentScope = useScope(overrideScopes)[`__scope${scopeName}`];
+				return {
+					...nextScopes2,
+					...currentScope
+				};
+			}, {});
+			return React$1.useMemo(() => ({ [`__scope${baseScope.scopeName}`]: nextScopes }), [nextScopes]);
+		};
+	};
+	createScope.scopeName = baseScope.scopeName;
+	return createScope;
+}
+function useStateMachine(initialState, machine) {
+	return React$1.useReducer((state, event) => {
+		return machine[state][event] ?? state;
+	}, initialState);
+}
+var SCROLL_AREA_NAME = "ScrollArea";
+var [createScrollAreaContext, createScrollAreaScope] = createContextScope(SCROLL_AREA_NAME);
+var [ScrollAreaProvider, useScrollAreaContext] = createScrollAreaContext(SCROLL_AREA_NAME);
+var ScrollArea$1 = React$1.forwardRef((props, forwardedRef) => {
+	const { __scopeScrollArea, type = "hover", dir, scrollHideDelay = 600, ...scrollAreaProps } = props;
+	const [scrollArea, setScrollArea] = React$1.useState(null);
+	const [viewport, setViewport] = React$1.useState(null);
+	const [content, setContent] = React$1.useState(null);
+	const [scrollbarX, setScrollbarX] = React$1.useState(null);
+	const [scrollbarY, setScrollbarY] = React$1.useState(null);
+	const [cornerWidth, setCornerWidth] = React$1.useState(0);
+	const [cornerHeight, setCornerHeight] = React$1.useState(0);
+	const [scrollbarXEnabled, setScrollbarXEnabled] = React$1.useState(false);
+	const [scrollbarYEnabled, setScrollbarYEnabled] = React$1.useState(false);
+	const composedRefs = useComposedRefs(forwardedRef, (node) => setScrollArea(node));
+	const direction = useDirection(dir);
+	return /* @__PURE__ */ jsx(ScrollAreaProvider, {
+		scope: __scopeScrollArea,
+		type,
+		dir: direction,
+		scrollHideDelay,
+		scrollArea,
+		viewport,
+		onViewportChange: setViewport,
+		content,
+		onContentChange: setContent,
+		scrollbarX,
+		onScrollbarXChange: setScrollbarX,
+		scrollbarXEnabled,
+		onScrollbarXEnabledChange: setScrollbarXEnabled,
+		scrollbarY,
+		onScrollbarYChange: setScrollbarY,
+		scrollbarYEnabled,
+		onScrollbarYEnabledChange: setScrollbarYEnabled,
+		onCornerWidthChange: setCornerWidth,
+		onCornerHeightChange: setCornerHeight,
+		children: /* @__PURE__ */ jsx(Primitive.div, {
+			dir: direction,
+			...scrollAreaProps,
+			ref: composedRefs,
+			style: {
+				position: "relative",
+				["--radix-scroll-area-corner-width"]: cornerWidth + "px",
+				["--radix-scroll-area-corner-height"]: cornerHeight + "px",
+				...props.style
+			}
+		})
+	});
+});
+ScrollArea$1.displayName = SCROLL_AREA_NAME;
+var VIEWPORT_NAME = "ScrollAreaViewport";
+var ScrollAreaViewport = React$1.forwardRef((props, forwardedRef) => {
+	const { __scopeScrollArea, children, nonce, ...viewportProps } = props;
+	const context = useScrollAreaContext(VIEWPORT_NAME, __scopeScrollArea);
+	const composedRefs = useComposedRefs(forwardedRef, React$1.useRef(null), context.onViewportChange);
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("style", {
+		dangerouslySetInnerHTML: { __html: `[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}` },
+		nonce
+	}), /* @__PURE__ */ jsx(Primitive.div, {
+		"data-radix-scroll-area-viewport": "",
+		...viewportProps,
+		ref: composedRefs,
+		style: {
+			overflowX: context.scrollbarXEnabled ? "scroll" : "hidden",
+			overflowY: context.scrollbarYEnabled ? "scroll" : "hidden",
+			...props.style
+		},
+		children: /* @__PURE__ */ jsx("div", {
+			ref: context.onContentChange,
+			style: {
+				minWidth: "100%",
+				display: "table"
+			},
+			children
+		})
+	})] });
+});
+ScrollAreaViewport.displayName = VIEWPORT_NAME;
+var SCROLLBAR_NAME = "ScrollAreaScrollbar";
+var ScrollAreaScrollbar = React$1.forwardRef((props, forwardedRef) => {
+	const { forceMount, ...scrollbarProps } = props;
+	const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
+	const { onScrollbarXEnabledChange, onScrollbarYEnabledChange } = context;
+	const isHorizontal = props.orientation === "horizontal";
+	React$1.useEffect(() => {
+		isHorizontal ? onScrollbarXEnabledChange(true) : onScrollbarYEnabledChange(true);
+		return () => {
+			isHorizontal ? onScrollbarXEnabledChange(false) : onScrollbarYEnabledChange(false);
+		};
+	}, [
+		isHorizontal,
+		onScrollbarXEnabledChange,
+		onScrollbarYEnabledChange
+	]);
+	return context.type === "hover" ? /* @__PURE__ */ jsx(ScrollAreaScrollbarHover, {
+		...scrollbarProps,
+		ref: forwardedRef,
+		forceMount
+	}) : context.type === "scroll" ? /* @__PURE__ */ jsx(ScrollAreaScrollbarScroll, {
+		...scrollbarProps,
+		ref: forwardedRef,
+		forceMount
+	}) : context.type === "auto" ? /* @__PURE__ */ jsx(ScrollAreaScrollbarAuto, {
+		...scrollbarProps,
+		ref: forwardedRef,
+		forceMount
+	}) : context.type === "always" ? /* @__PURE__ */ jsx(ScrollAreaScrollbarVisible, {
+		...scrollbarProps,
+		ref: forwardedRef
+	}) : null;
+});
+ScrollAreaScrollbar.displayName = SCROLLBAR_NAME;
+var ScrollAreaScrollbarHover = React$1.forwardRef((props, forwardedRef) => {
+	const { forceMount, ...scrollbarProps } = props;
+	const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
+	const [visible, setVisible] = React$1.useState(false);
+	React$1.useEffect(() => {
+		const scrollArea = context.scrollArea;
+		let hideTimer = 0;
+		if (scrollArea) {
+			const handlePointerEnter = () => {
+				window.clearTimeout(hideTimer);
+				setVisible(true);
+			};
+			const handlePointerLeave = () => {
+				hideTimer = window.setTimeout(() => setVisible(false), context.scrollHideDelay);
+			};
+			scrollArea.addEventListener("pointerenter", handlePointerEnter);
+			scrollArea.addEventListener("pointerleave", handlePointerLeave);
+			return () => {
+				window.clearTimeout(hideTimer);
+				scrollArea.removeEventListener("pointerenter", handlePointerEnter);
+				scrollArea.removeEventListener("pointerleave", handlePointerLeave);
+			};
+		}
+	}, [context.scrollArea, context.scrollHideDelay]);
+	return /* @__PURE__ */ jsx(Presence, {
+		present: forceMount || visible,
+		children: /* @__PURE__ */ jsx(ScrollAreaScrollbarAuto, {
+			"data-state": visible ? "visible" : "hidden",
+			...scrollbarProps,
+			ref: forwardedRef
+		})
+	});
+});
+var ScrollAreaScrollbarScroll = React$1.forwardRef((props, forwardedRef) => {
+	const { forceMount, ...scrollbarProps } = props;
+	const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
+	const isHorizontal = props.orientation === "horizontal";
+	const debounceScrollEnd = useDebounceCallback(() => send("SCROLL_END"), 100);
+	const [state, send] = useStateMachine("hidden", {
+		hidden: { SCROLL: "scrolling" },
+		scrolling: {
+			SCROLL_END: "idle",
+			POINTER_ENTER: "interacting"
+		},
+		interacting: {
+			SCROLL: "interacting",
+			POINTER_LEAVE: "idle"
+		},
+		idle: {
+			HIDE: "hidden",
+			SCROLL: "scrolling",
+			POINTER_ENTER: "interacting"
+		}
+	});
+	React$1.useEffect(() => {
+		if (state === "idle") {
+			const hideTimer = window.setTimeout(() => send("HIDE"), context.scrollHideDelay);
+			return () => window.clearTimeout(hideTimer);
+		}
+	}, [
+		state,
+		context.scrollHideDelay,
+		send
+	]);
+	React$1.useEffect(() => {
+		const viewport = context.viewport;
+		const scrollDirection = isHorizontal ? "scrollLeft" : "scrollTop";
+		if (viewport) {
+			let prevScrollPos = viewport[scrollDirection];
+			const handleScroll = () => {
+				const scrollPos = viewport[scrollDirection];
+				if (prevScrollPos !== scrollPos) {
+					send("SCROLL");
+					debounceScrollEnd();
+				}
+				prevScrollPos = scrollPos;
+			};
+			viewport.addEventListener("scroll", handleScroll);
+			return () => viewport.removeEventListener("scroll", handleScroll);
+		}
+	}, [
+		context.viewport,
+		isHorizontal,
+		send,
+		debounceScrollEnd
+	]);
+	return /* @__PURE__ */ jsx(Presence, {
+		present: forceMount || state !== "hidden",
+		children: /* @__PURE__ */ jsx(ScrollAreaScrollbarVisible, {
+			"data-state": state === "hidden" ? "hidden" : "visible",
+			...scrollbarProps,
+			ref: forwardedRef,
+			onPointerEnter: composeEventHandlers(props.onPointerEnter, () => send("POINTER_ENTER")),
+			onPointerLeave: composeEventHandlers(props.onPointerLeave, () => send("POINTER_LEAVE"))
+		})
+	});
+});
+var ScrollAreaScrollbarAuto = React$1.forwardRef((props, forwardedRef) => {
+	const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
+	const { forceMount, ...scrollbarProps } = props;
+	const [visible, setVisible] = React$1.useState(false);
+	const isHorizontal = props.orientation === "horizontal";
+	const handleResize = useDebounceCallback(() => {
+		if (context.viewport) {
+			const isOverflowX = context.viewport.offsetWidth < context.viewport.scrollWidth;
+			const isOverflowY = context.viewport.offsetHeight < context.viewport.scrollHeight;
+			setVisible(isHorizontal ? isOverflowX : isOverflowY);
+		}
+	}, 10);
+	useResizeObserver(context.viewport, handleResize);
+	useResizeObserver(context.content, handleResize);
+	return /* @__PURE__ */ jsx(Presence, {
+		present: forceMount || visible,
+		children: /* @__PURE__ */ jsx(ScrollAreaScrollbarVisible, {
+			"data-state": visible ? "visible" : "hidden",
+			...scrollbarProps,
+			ref: forwardedRef
+		})
+	});
+});
+var ScrollAreaScrollbarVisible = React$1.forwardRef((props, forwardedRef) => {
+	const { orientation = "vertical", ...scrollbarProps } = props;
+	const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
+	const thumbRef = React$1.useRef(null);
+	const pointerOffsetRef = React$1.useRef(0);
+	const [sizes, setSizes] = React$1.useState({
+		content: 0,
+		viewport: 0,
+		scrollbar: {
+			size: 0,
+			paddingStart: 0,
+			paddingEnd: 0
+		}
+	});
+	const thumbRatio = getThumbRatio(sizes.viewport, sizes.content);
+	const commonProps = {
+		...scrollbarProps,
+		sizes,
+		onSizesChange: setSizes,
+		hasThumb: Boolean(thumbRatio > 0 && thumbRatio < 1),
+		onThumbChange: (thumb) => thumbRef.current = thumb,
+		onThumbPointerUp: () => pointerOffsetRef.current = 0,
+		onThumbPointerDown: (pointerPos) => pointerOffsetRef.current = pointerPos
+	};
+	function getScrollPosition(pointerPos, dir) {
+		return getScrollPositionFromPointer(pointerPos, pointerOffsetRef.current, sizes, dir);
+	}
+	if (orientation === "horizontal") return /* @__PURE__ */ jsx(ScrollAreaScrollbarX, {
+		...commonProps,
+		ref: forwardedRef,
+		onThumbPositionChange: () => {
+			if (context.viewport && thumbRef.current) {
+				const scrollPos = context.viewport.scrollLeft;
+				const offset = getThumbOffsetFromScroll(scrollPos, sizes, context.dir);
+				thumbRef.current.style.transform = `translate3d(${offset}px, 0, 0)`;
+			}
+		},
+		onWheelScroll: (scrollPos) => {
+			if (context.viewport) context.viewport.scrollLeft = scrollPos;
+		},
+		onDragScroll: (pointerPos) => {
+			if (context.viewport) context.viewport.scrollLeft = getScrollPosition(pointerPos, context.dir);
+		}
+	});
+	if (orientation === "vertical") return /* @__PURE__ */ jsx(ScrollAreaScrollbarY, {
+		...commonProps,
+		ref: forwardedRef,
+		onThumbPositionChange: () => {
+			if (context.viewport && thumbRef.current) {
+				const scrollPos = context.viewport.scrollTop;
+				const offset = getThumbOffsetFromScroll(scrollPos, sizes);
+				thumbRef.current.style.transform = `translate3d(0, ${offset}px, 0)`;
+			}
+		},
+		onWheelScroll: (scrollPos) => {
+			if (context.viewport) context.viewport.scrollTop = scrollPos;
+		},
+		onDragScroll: (pointerPos) => {
+			if (context.viewport) context.viewport.scrollTop = getScrollPosition(pointerPos);
+		}
+	});
+	return null;
+});
+var ScrollAreaScrollbarX = React$1.forwardRef((props, forwardedRef) => {
+	const { sizes, onSizesChange, ...scrollbarProps } = props;
+	const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
+	const [computedStyle, setComputedStyle] = React$1.useState();
+	const ref = React$1.useRef(null);
+	const composeRefs = useComposedRefs(forwardedRef, ref, context.onScrollbarXChange);
+	React$1.useEffect(() => {
+		if (ref.current) setComputedStyle(getComputedStyle(ref.current));
+	}, [ref]);
+	return /* @__PURE__ */ jsx(ScrollAreaScrollbarImpl, {
+		"data-orientation": "horizontal",
+		...scrollbarProps,
+		ref: composeRefs,
+		sizes,
+		style: {
+			bottom: 0,
+			left: context.dir === "rtl" ? "var(--radix-scroll-area-corner-width)" : 0,
+			right: context.dir === "ltr" ? "var(--radix-scroll-area-corner-width)" : 0,
+			["--radix-scroll-area-thumb-width"]: getThumbSize(sizes) + "px",
+			...props.style
+		},
+		onThumbPointerDown: (pointerPos) => props.onThumbPointerDown(pointerPos.x),
+		onDragScroll: (pointerPos) => props.onDragScroll(pointerPos.x),
+		onWheelScroll: (event, maxScrollPos) => {
+			if (context.viewport) {
+				const scrollPos = context.viewport.scrollLeft + event.deltaX;
+				props.onWheelScroll(scrollPos);
+				if (isScrollingWithinScrollbarBounds(scrollPos, maxScrollPos)) event.preventDefault();
+			}
+		},
+		onResize: () => {
+			if (ref.current && context.viewport && computedStyle) onSizesChange({
+				content: context.viewport.scrollWidth,
+				viewport: context.viewport.offsetWidth,
+				scrollbar: {
+					size: ref.current.clientWidth,
+					paddingStart: toInt(computedStyle.paddingLeft),
+					paddingEnd: toInt(computedStyle.paddingRight)
+				}
+			});
+		}
+	});
+});
+var ScrollAreaScrollbarY = React$1.forwardRef((props, forwardedRef) => {
+	const { sizes, onSizesChange, ...scrollbarProps } = props;
+	const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
+	const [computedStyle, setComputedStyle] = React$1.useState();
+	const ref = React$1.useRef(null);
+	const composeRefs = useComposedRefs(forwardedRef, ref, context.onScrollbarYChange);
+	React$1.useEffect(() => {
+		if (ref.current) setComputedStyle(getComputedStyle(ref.current));
+	}, [ref]);
+	return /* @__PURE__ */ jsx(ScrollAreaScrollbarImpl, {
+		"data-orientation": "vertical",
+		...scrollbarProps,
+		ref: composeRefs,
+		sizes,
+		style: {
+			top: 0,
+			right: context.dir === "ltr" ? 0 : void 0,
+			left: context.dir === "rtl" ? 0 : void 0,
+			bottom: "var(--radix-scroll-area-corner-height)",
+			["--radix-scroll-area-thumb-height"]: getThumbSize(sizes) + "px",
+			...props.style
+		},
+		onThumbPointerDown: (pointerPos) => props.onThumbPointerDown(pointerPos.y),
+		onDragScroll: (pointerPos) => props.onDragScroll(pointerPos.y),
+		onWheelScroll: (event, maxScrollPos) => {
+			if (context.viewport) {
+				const scrollPos = context.viewport.scrollTop + event.deltaY;
+				props.onWheelScroll(scrollPos);
+				if (isScrollingWithinScrollbarBounds(scrollPos, maxScrollPos)) event.preventDefault();
+			}
+		},
+		onResize: () => {
+			if (ref.current && context.viewport && computedStyle) onSizesChange({
+				content: context.viewport.scrollHeight,
+				viewport: context.viewport.offsetHeight,
+				scrollbar: {
+					size: ref.current.clientHeight,
+					paddingStart: toInt(computedStyle.paddingTop),
+					paddingEnd: toInt(computedStyle.paddingBottom)
+				}
+			});
+		}
+	});
+});
+var [ScrollbarProvider, useScrollbarContext] = createScrollAreaContext(SCROLLBAR_NAME);
+var ScrollAreaScrollbarImpl = React$1.forwardRef((props, forwardedRef) => {
+	const { __scopeScrollArea, sizes, hasThumb, onThumbChange, onThumbPointerUp, onThumbPointerDown, onThumbPositionChange, onDragScroll, onWheelScroll, onResize, ...scrollbarProps } = props;
+	const context = useScrollAreaContext(SCROLLBAR_NAME, __scopeScrollArea);
+	const [scrollbar, setScrollbar] = React$1.useState(null);
+	const composeRefs = useComposedRefs(forwardedRef, (node) => setScrollbar(node));
+	const rectRef = React$1.useRef(null);
+	const prevWebkitUserSelectRef = React$1.useRef("");
+	const viewport = context.viewport;
+	const maxScrollPos = sizes.content - sizes.viewport;
+	const handleWheelScroll = useCallbackRef(onWheelScroll);
+	const handleThumbPositionChange = useCallbackRef(onThumbPositionChange);
+	const handleResize = useDebounceCallback(onResize, 10);
+	function handleDragScroll(event) {
+		if (rectRef.current) onDragScroll({
+			x: event.clientX - rectRef.current.left,
+			y: event.clientY - rectRef.current.top
+		});
+	}
+	React$1.useEffect(() => {
+		const handleWheel = (event) => {
+			const element = event.target;
+			if (scrollbar?.contains(element)) handleWheelScroll(event, maxScrollPos);
+		};
+		document.addEventListener("wheel", handleWheel, { passive: false });
+		return () => document.removeEventListener("wheel", handleWheel, { passive: false });
+	}, [
+		viewport,
+		scrollbar,
+		maxScrollPos,
+		handleWheelScroll
+	]);
+	React$1.useEffect(handleThumbPositionChange, [sizes, handleThumbPositionChange]);
+	useResizeObserver(scrollbar, handleResize);
+	useResizeObserver(context.content, handleResize);
+	return /* @__PURE__ */ jsx(ScrollbarProvider, {
+		scope: __scopeScrollArea,
+		scrollbar,
+		hasThumb,
+		onThumbChange: useCallbackRef(onThumbChange),
+		onThumbPointerUp: useCallbackRef(onThumbPointerUp),
+		onThumbPositionChange: handleThumbPositionChange,
+		onThumbPointerDown: useCallbackRef(onThumbPointerDown),
+		children: /* @__PURE__ */ jsx(Primitive.div, {
+			...scrollbarProps,
+			ref: composeRefs,
+			style: {
+				position: "absolute",
+				...scrollbarProps.style
+			},
+			onPointerDown: composeEventHandlers(props.onPointerDown, (event) => {
+				if (event.button === 0) {
+					event.target.setPointerCapture(event.pointerId);
+					rectRef.current = scrollbar.getBoundingClientRect();
+					prevWebkitUserSelectRef.current = document.body.style.webkitUserSelect;
+					document.body.style.webkitUserSelect = "none";
+					if (context.viewport) context.viewport.style.scrollBehavior = "auto";
+					handleDragScroll(event);
+				}
+			}),
+			onPointerMove: composeEventHandlers(props.onPointerMove, handleDragScroll),
+			onPointerUp: composeEventHandlers(props.onPointerUp, (event) => {
+				const element = event.target;
+				if (element.hasPointerCapture(event.pointerId)) element.releasePointerCapture(event.pointerId);
+				document.body.style.webkitUserSelect = prevWebkitUserSelectRef.current;
+				if (context.viewport) context.viewport.style.scrollBehavior = "";
+				rectRef.current = null;
+			})
+		})
+	});
+});
+var THUMB_NAME = "ScrollAreaThumb";
+var ScrollAreaThumb = React$1.forwardRef((props, forwardedRef) => {
+	const { forceMount, ...thumbProps } = props;
+	const scrollbarContext = useScrollbarContext(THUMB_NAME, props.__scopeScrollArea);
+	return /* @__PURE__ */ jsx(Presence, {
+		present: forceMount || scrollbarContext.hasThumb,
+		children: /* @__PURE__ */ jsx(ScrollAreaThumbImpl, {
+			ref: forwardedRef,
+			...thumbProps
+		})
+	});
+});
+var ScrollAreaThumbImpl = React$1.forwardRef((props, forwardedRef) => {
+	const { __scopeScrollArea, style, ...thumbProps } = props;
+	const scrollAreaContext = useScrollAreaContext(THUMB_NAME, __scopeScrollArea);
+	const scrollbarContext = useScrollbarContext(THUMB_NAME, __scopeScrollArea);
+	const { onThumbPositionChange } = scrollbarContext;
+	const composedRef = useComposedRefs(forwardedRef, (node) => scrollbarContext.onThumbChange(node));
+	const removeUnlinkedScrollListenerRef = React$1.useRef(void 0);
+	const debounceScrollEnd = useDebounceCallback(() => {
+		if (removeUnlinkedScrollListenerRef.current) {
+			removeUnlinkedScrollListenerRef.current();
+			removeUnlinkedScrollListenerRef.current = void 0;
+		}
+	}, 100);
+	React$1.useEffect(() => {
+		const viewport = scrollAreaContext.viewport;
+		if (viewport) {
+			const handleScroll = () => {
+				debounceScrollEnd();
+				if (!removeUnlinkedScrollListenerRef.current) {
+					removeUnlinkedScrollListenerRef.current = addUnlinkedScrollListener(viewport, onThumbPositionChange);
+					onThumbPositionChange();
+				}
+			};
+			onThumbPositionChange();
+			viewport.addEventListener("scroll", handleScroll);
+			return () => viewport.removeEventListener("scroll", handleScroll);
+		}
+	}, [
+		scrollAreaContext.viewport,
+		debounceScrollEnd,
+		onThumbPositionChange
+	]);
+	return /* @__PURE__ */ jsx(Primitive.div, {
+		"data-state": scrollbarContext.hasThumb ? "visible" : "hidden",
+		...thumbProps,
+		ref: composedRef,
+		style: {
+			width: "var(--radix-scroll-area-thumb-width)",
+			height: "var(--radix-scroll-area-thumb-height)",
+			...style
+		},
+		onPointerDownCapture: composeEventHandlers(props.onPointerDownCapture, (event) => {
+			const thumbRect = event.target.getBoundingClientRect();
+			const x = event.clientX - thumbRect.left;
+			const y = event.clientY - thumbRect.top;
+			scrollbarContext.onThumbPointerDown({
+				x,
+				y
+			});
+		}),
+		onPointerUp: composeEventHandlers(props.onPointerUp, scrollbarContext.onThumbPointerUp)
+	});
+});
+ScrollAreaThumb.displayName = THUMB_NAME;
+var CORNER_NAME = "ScrollAreaCorner";
+var ScrollAreaCorner = React$1.forwardRef((props, forwardedRef) => {
+	const context = useScrollAreaContext(CORNER_NAME, props.__scopeScrollArea);
+	const hasBothScrollbarsVisible = Boolean(context.scrollbarX && context.scrollbarY);
+	return context.type !== "scroll" && hasBothScrollbarsVisible ? /* @__PURE__ */ jsx(ScrollAreaCornerImpl, {
+		...props,
+		ref: forwardedRef
+	}) : null;
+});
+ScrollAreaCorner.displayName = CORNER_NAME;
+var ScrollAreaCornerImpl = React$1.forwardRef((props, forwardedRef) => {
+	const { __scopeScrollArea, ...cornerProps } = props;
+	const context = useScrollAreaContext(CORNER_NAME, __scopeScrollArea);
+	const [width, setWidth] = React$1.useState(0);
+	const [height, setHeight] = React$1.useState(0);
+	const hasSize = Boolean(width && height);
+	useResizeObserver(context.scrollbarX, () => {
+		const height2 = context.scrollbarX?.offsetHeight || 0;
+		context.onCornerHeightChange(height2);
+		setHeight(height2);
+	});
+	useResizeObserver(context.scrollbarY, () => {
+		const width2 = context.scrollbarY?.offsetWidth || 0;
+		context.onCornerWidthChange(width2);
+		setWidth(width2);
+	});
+	return hasSize ? /* @__PURE__ */ jsx(Primitive.div, {
+		...cornerProps,
+		ref: forwardedRef,
+		style: {
+			width,
+			height,
+			position: "absolute",
+			right: context.dir === "ltr" ? 0 : void 0,
+			left: context.dir === "rtl" ? 0 : void 0,
+			bottom: 0,
+			...props.style
+		}
+	}) : null;
+});
+function toInt(value) {
+	return value ? parseInt(value, 10) : 0;
+}
+function getThumbRatio(viewportSize, contentSize) {
+	const ratio = viewportSize / contentSize;
+	return isNaN(ratio) ? 0 : ratio;
+}
+function getThumbSize(sizes) {
+	const ratio = getThumbRatio(sizes.viewport, sizes.content);
+	const scrollbarPadding = sizes.scrollbar.paddingStart + sizes.scrollbar.paddingEnd;
+	const thumbSize = (sizes.scrollbar.size - scrollbarPadding) * ratio;
+	return Math.max(thumbSize, 18);
+}
+function getScrollPositionFromPointer(pointerPos, pointerOffset, sizes, dir = "ltr") {
+	const thumbSizePx = getThumbSize(sizes);
+	const thumbCenter = thumbSizePx / 2;
+	const offset = pointerOffset || thumbCenter;
+	const thumbOffsetFromEnd = thumbSizePx - offset;
+	const minPointerPos = sizes.scrollbar.paddingStart + offset;
+	const maxPointerPos = sizes.scrollbar.size - sizes.scrollbar.paddingEnd - thumbOffsetFromEnd;
+	const maxScrollPos = sizes.content - sizes.viewport;
+	const scrollRange = dir === "ltr" ? [0, maxScrollPos] : [maxScrollPos * -1, 0];
+	return linearScale([minPointerPos, maxPointerPos], scrollRange)(pointerPos);
+}
+function getThumbOffsetFromScroll(scrollPos, sizes, dir = "ltr") {
+	const thumbSizePx = getThumbSize(sizes);
+	const scrollbarPadding = sizes.scrollbar.paddingStart + sizes.scrollbar.paddingEnd;
+	const scrollbar = sizes.scrollbar.size - scrollbarPadding;
+	const maxScrollPos = sizes.content - sizes.viewport;
+	const maxThumbPos = scrollbar - thumbSizePx;
+	const scrollWithoutMomentum = clamp(scrollPos, dir === "ltr" ? [0, maxScrollPos] : [maxScrollPos * -1, 0]);
+	return linearScale([0, maxScrollPos], [0, maxThumbPos])(scrollWithoutMomentum);
+}
+function linearScale(input, output) {
+	return (value) => {
+		if (input[0] === input[1] || output[0] === output[1]) return output[0];
+		const ratio = (output[1] - output[0]) / (input[1] - input[0]);
+		return output[0] + ratio * (value - input[0]);
+	};
+}
+function isScrollingWithinScrollbarBounds(scrollPos, maxScrollPos) {
+	return scrollPos > 0 && scrollPos < maxScrollPos;
+}
+var addUnlinkedScrollListener = (node, handler = () => {}) => {
+	let prevPosition = {
+		left: node.scrollLeft,
+		top: node.scrollTop
+	};
+	let rAF = 0;
+	(function loop() {
+		const position = {
+			left: node.scrollLeft,
+			top: node.scrollTop
+		};
+		const isHorizontalScroll = prevPosition.left !== position.left;
+		const isVerticalScroll = prevPosition.top !== position.top;
+		if (isHorizontalScroll || isVerticalScroll) handler();
+		prevPosition = position;
+		rAF = window.requestAnimationFrame(loop);
+	})();
+	return () => window.cancelAnimationFrame(rAF);
+};
+function useDebounceCallback(callback, delay) {
+	const handleCallback = useCallbackRef(callback);
+	const debounceTimerRef = React$1.useRef(0);
+	React$1.useEffect(() => () => window.clearTimeout(debounceTimerRef.current), []);
+	return React$1.useCallback(() => {
+		window.clearTimeout(debounceTimerRef.current);
+		debounceTimerRef.current = window.setTimeout(handleCallback, delay);
+	}, [handleCallback, delay]);
+}
+function useResizeObserver(element, onResize) {
+	const handleResize = useCallbackRef(onResize);
+	useLayoutEffect2(() => {
+		let rAF = 0;
+		if (element) {
+			const resizeObserver = new ResizeObserver(() => {
+				cancelAnimationFrame(rAF);
+				rAF = window.requestAnimationFrame(handleResize);
+			});
+			resizeObserver.observe(element);
+			return () => {
+				window.cancelAnimationFrame(rAF);
+				resizeObserver.unobserve(element);
+			};
+		}
+	}, [element, handleResize]);
+}
+var Root = ScrollArea$1;
+var Viewport = ScrollAreaViewport;
+var Corner = ScrollAreaCorner;
+function ScrollArea({ className, children, ...props }) {
+	return /* @__PURE__ */ jsxs(Root, {
+		"data-slot": "scroll-area",
+		className: cn("relative", className),
+		...props,
+		children: [
+			/* @__PURE__ */ jsx(Viewport, {
+				"data-slot": "scroll-area-viewport",
+				className: "focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1",
+				children
+			}),
+			/* @__PURE__ */ jsx(ScrollBar, {}),
+			/* @__PURE__ */ jsx(Corner, {})
+		]
+	});
+}
+function ScrollBar({ className, orientation = "vertical", ...props }) {
+	return /* @__PURE__ */ jsx(ScrollAreaScrollbar, {
+		"data-slot": "scroll-area-scrollbar",
+		orientation,
+		className: cn("flex touch-none p-px transition-colors select-none", orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent", orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent", className),
+		...props,
+		children: /* @__PURE__ */ jsx(ScrollAreaThumb, {
+			"data-slot": "scroll-area-thumb",
+			className: "bg-border relative flex-1 rounded-full"
+		})
+	});
+}
+var SplitLayoutContext = createContext(null);
+function useSplitLayout() {
+	const context = useContext(SplitLayoutContext);
+	if (!context) throw new Error("useSplitLayout must be used within SplitLayoutGlass.Provider. Wrap your component tree with <SplitLayoutGlass.Provider>.");
+	return context;
+}
+function useSplitLayoutOptional() {
+	return useContext(SplitLayoutContext);
+}
+var BREAKPOINT_VALUES = {
+	sm: 640,
+	md: 768,
+	lg: 1024,
+	xl: 1440,
+	"2xl": 1536
+};
+const SplitLayoutProvider = ({ children, selectedKey: controlledSelectedKey, onSelectedKeyChange, defaultSelectedKey = null, open: controlledOpen, onOpenChange, defaultOpen = true, breakpoint = "md", mobileMode = "stack", intensity = "medium", stickyOffset = 24, urlParamName, keyboardShortcut = "b" }) => {
+	const [internalSelectedKey, setInternalSelectedKey] = useState(() => {
+		if (urlParamName && typeof window !== "undefined") {
+			const urlValue = new URLSearchParams(window.location.search).get(urlParamName);
+			if (urlValue) return urlValue;
+		}
+		return defaultSelectedKey;
+	});
+	const isSelectedKeyControlled = controlledSelectedKey !== void 0;
+	const selectedKey = isSelectedKeyControlled ? controlledSelectedKey : internalSelectedKey;
+	const setSelectedKey = useCallback((key) => {
+		if (!isSelectedKeyControlled) setInternalSelectedKey(key);
+		onSelectedKeyChange?.(key);
+		if (urlParamName && typeof window !== "undefined") {
+			const url = new URL(window.location.href);
+			if (key) url.searchParams.set(urlParamName, key);
+			else url.searchParams.delete(urlParamName);
+			window.history.replaceState({}, "", url.toString());
+		}
+	}, [
+		isSelectedKeyControlled,
+		onSelectedKeyChange,
+		urlParamName
+	]);
+	const [internalOpen, setInternalOpen] = useState(defaultOpen);
+	const isOpenControlled = controlledOpen !== void 0;
+	const isOpen = isOpenControlled ? controlledOpen : internalOpen;
+	const setIsOpen = useCallback((open) => {
+		if (!isOpenControlled) setInternalOpen(open);
+		onOpenChange?.(open);
+	}, [isOpenControlled, onOpenChange]);
+	const [isMobileOpen, setMobileOpen] = useState(false);
+	const [isMobile, setIsMobile] = useState(() => {
+		if (typeof window === "undefined") return false;
+		return window.innerWidth < BREAKPOINT_VALUES[breakpoint];
+	});
+	useEffect(() => {
+		if (typeof window === "undefined") return;
+		const checkMobile = () => {
+			setIsMobile(window.innerWidth < BREAKPOINT_VALUES[breakpoint]);
+		};
+		checkMobile();
+		window.addEventListener("resize", checkMobile);
+		return () => window.removeEventListener("resize", checkMobile);
+	}, [breakpoint]);
+	const toggle = useCallback(() => {
+		if (isMobile) setMobileOpen((prev) => !prev);
+		else setIsOpen(!isOpen);
+	}, [
+		isMobile,
+		isOpen,
+		setIsOpen
+	]);
+	useEffect(() => {
+		if (!keyboardShortcut) return;
+		const handleKeyDown = (e) => {
+			if (e.key === "Escape" && isMobile && isMobileOpen) {
+				e.preventDefault();
+				setMobileOpen(false);
+				return;
+			}
+			if (e.key === keyboardShortcut && (e.metaKey || e.ctrlKey)) {
+				e.preventDefault();
+				toggle();
+			}
+		};
+		document.addEventListener("keydown", handleKeyDown);
+		return () => document.removeEventListener("keydown", handleKeyDown);
+	}, [
+		keyboardShortcut,
+		isMobile,
+		isMobileOpen,
+		toggle
+	]);
+	const value = useMemo(() => ({
+		selectedKey,
+		setSelectedKey,
+		isOpen,
+		setIsOpen,
+		isMobileOpen,
+		setMobileOpen,
+		isMobile,
+		breakpoint,
+		mobileMode,
+		intensity,
+		stickyOffset,
+		toggle,
+		state: isOpen ? "expanded" : "collapsed",
+		open: isOpen,
+		setOpen: setIsOpen,
+		openMobile: isMobileOpen,
+		setOpenMobile: setMobileOpen,
+		toggleSidebar: toggle
+	}), [
+		selectedKey,
+		setSelectedKey,
+		isOpen,
+		setIsOpen,
+		isMobileOpen,
+		isMobile,
+		breakpoint,
+		mobileMode,
+		intensity,
+		stickyOffset,
+		toggle
+	]);
+	return /* @__PURE__ */ jsx(SplitLayoutContext.Provider, {
+		value,
+		children
+	});
+};
+SplitLayoutProvider.displayName = "SplitLayoutGlass.Provider";
+var SplitLayoutAccordionRoot = forwardRef(({ children, label = "Content accordion", className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx(GlassCard, {
+		asChild: true,
+		intensity: useSplitLayoutOptional()?.intensity ?? "medium",
+		padding: "none",
+		className: cn("divide-y divide-white/10", className),
+		children: /* @__PURE__ */ jsx("div", {
+			ref,
+			role: "region",
+			"aria-label": label,
+			"data-split-accordion": "",
+			...props,
+			children
+		})
+	});
+});
+SplitLayoutAccordionRoot.displayName = "SplitLayoutAccordion.Root";
+var SplitLayoutAccordionItem = forwardRef(({ itemKey, trigger, children, disabled = false, className, ...props }, ref) => {
+	const { selectedKey, setSelectedKey } = useSplitLayout();
+	const isExpanded = selectedKey === itemKey;
+	const contentRef = useRef(null);
+	const [contentHeight, setContentHeight] = useState(null);
+	const triggerId = useId();
+	const contentId = useId();
+	useEffect(() => {
+		if (contentRef.current) setContentHeight(contentRef.current.scrollHeight);
+	}, [children, isExpanded]);
+	const handleToggle = useCallback(() => {
+		if (disabled) return;
+		setSelectedKey(isExpanded ? null : itemKey);
+	}, [
+		disabled,
+		isExpanded,
+		itemKey,
+		setSelectedKey
+	]);
+	const handleKeyDown = useCallback((e) => {
+		if (disabled) return;
+		switch (e.key) {
+			case "Enter":
+			case " ":
+				e.preventDefault();
+				handleToggle();
+				break;
+			case "ArrowDown":
+				e.preventDefault();
+				((e.currentTarget.parentElement?.nextElementSibling)?.querySelector("[data-accordion-trigger]"))?.focus();
+				break;
+			case "ArrowUp":
+				e.preventDefault();
+				((e.currentTarget.parentElement?.previousElementSibling)?.querySelector("[data-accordion-trigger]"))?.focus();
+				break;
+			case "Home":
+				e.preventDefault();
+				(e.currentTarget.closest("[data-split-accordion]")?.querySelector("[data-accordion-trigger]"))?.focus();
+				break;
+			case "End": {
+				e.preventDefault();
+				const triggers = e.currentTarget.closest("[data-split-accordion]")?.querySelectorAll("[data-accordion-trigger]");
+				(triggers?.[triggers.length - 1])?.focus();
+				break;
+			}
+		}
+	}, [disabled, handleToggle]);
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		"data-accordion-item": "",
+		"data-state": isExpanded ? "open" : "closed",
+		"data-disabled": disabled || void 0,
+		className: cn("overflow-hidden", disabled && "opacity-50 cursor-not-allowed", className),
+		...props,
+		children: [/* @__PURE__ */ jsxs("button", {
+			type: "button",
+			id: triggerId,
+			"data-accordion-trigger": "",
+			"aria-expanded": isExpanded,
+			"aria-controls": contentId,
+			"aria-disabled": disabled,
+			disabled,
+			onClick: handleToggle,
+			onKeyDown: handleKeyDown,
+			className: cn("flex w-full items-center justify-between gap-4", "p-4 text-left", "transition-colors duration-200", "hover:bg-white/5 focus-visible:bg-white/5", "focus:outline-none focus-visible:ring-2 focus-visible:ring-white/20 focus-visible:ring-inset", disabled && "pointer-events-none"),
+			children: [/* @__PURE__ */ jsx("div", {
+				className: "flex-1",
+				children: trigger
+			}), /* @__PURE__ */ jsx(ChevronDown, { className: cn("h-4 w-4 shrink-0 text-white/60", "transition-transform duration-300 ease-out", isExpanded && "rotate-180") })]
+		}), /* @__PURE__ */ jsx("div", {
+			id: contentId,
+			ref: contentRef,
+			role: "region",
+			"aria-labelledby": triggerId,
+			"data-accordion-content": "",
+			"data-state": isExpanded ? "open" : "closed",
+			className: cn("overflow-hidden", "transition-[max-height,opacity] duration-300 ease-out"),
+			style: {
+				maxHeight: isExpanded ? contentHeight ?? "auto" : 0,
+				opacity: isExpanded ? 1 : 0
+			},
+			children: /* @__PURE__ */ jsx("div", {
+				className: "p-4 pt-0 border-t border-white/5",
+				children
+			})
+		})]
+	});
+});
+SplitLayoutAccordionItem.displayName = "SplitLayoutAccordion.Item";
+const SplitLayoutAccordion = {
+	Root: SplitLayoutAccordionRoot,
+	Item: SplitLayoutAccordionItem
+};
+function useGridStyles(config) {
+	const { ratio = {
+		sidebar: 1,
+		main: 2
+	}, minSidebarWidth = "280px", maxSidebarWidth, gap = {
+		mobile: 16,
+		desktop: 24
+	}, stickyOffset = 24 } = config;
+	const gapMobile = typeof gap === "number" ? gap : gap.mobile ?? 16;
+	const gapDesktop = typeof gap === "number" ? gap : gap.desktop ?? 24;
+	const gridTemplate = maxSidebarWidth ? `minmax(${minSidebarWidth}, ${maxSidebarWidth}) ${ratio.main}fr` : `minmax(${minSidebarWidth}, ${ratio.sidebar}fr) ${ratio.main}fr`;
+	return { cssVars: {
+		"--grid-template": gridTemplate,
+		"--sticky-offset": `${stickyOffset}px`,
+		"--sticky-max-height": `calc(100vh - calc(${stickyOffset}px * 2))`,
+		"--gap-mobile": `${gapMobile}px`,
+		"--gap-desktop": `${gapDesktop}px`
+	} };
+}
+var SplitLayoutRoot = forwardRef(({ children, ratio = {
+	sidebar: 1,
+	main: 2
+}, minSidebarWidth = "300px", maxSidebarWidth, gap = {
+	mobile: 16,
+	desktop: 24
+}, breakpoint: breakpointProp, mobileLayout = "stack", className, ...props }, ref) => {
+	const context = useSplitLayoutOptional();
+	const breakpoint = breakpointProp ?? context?.breakpoint ?? "md";
+	const { cssVars } = useGridStyles({
+		ratio,
+		minSidebarWidth,
+		maxSidebarWidth,
+		gap,
+		stickyOffset: context?.stickyOffset ?? 24
+	});
+	const bp = breakpoint;
+	const gapClasses = {
+		sm: "gap-[var(--gap-mobile)] sm:gap-[var(--gap-desktop)]",
+		md: "gap-[var(--gap-mobile)] md:gap-[var(--gap-desktop)]",
+		lg: "gap-[var(--gap-mobile)] lg:gap-[var(--gap-desktop)]",
+		xl: "gap-[var(--gap-mobile)] xl:gap-[var(--gap-desktop)]",
+		"2xl": "gap-[var(--gap-mobile)] 2xl:gap-[var(--gap-desktop)]"
+	};
+	const gridClasses = {
+		sm: "sm:grid-cols-(--grid-template)",
+		md: "md:grid-cols-(--grid-template)",
+		lg: "lg:grid-cols-(--grid-template)",
+		xl: "xl:grid-cols-(--grid-template)",
+		"2xl": "2xl:grid-cols-(--grid-template)"
+	};
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		"data-split-layout-root": "",
+		"data-state": context?.state ?? "expanded",
+		className: cn("grid", "items-start", mobileLayout === "stack" && "grid-cols-1", mobileLayout === "main-only" && "grid-cols-1 *:data-split-sidebar:hidden", mobileLayout === "sidebar-only" && "grid-cols-1 *:data-split-main:hidden", gridClasses[bp], gapClasses[bp], className),
+		style: cssVars,
+		...props,
+		children
+	});
+});
+SplitLayoutRoot.displayName = "SplitLayoutGlass.Root";
+var SplitLayoutSidebar = forwardRef(({ children, label = "Sidebar navigation", className, ...props }, ref) => {
+	const context = useSplitLayoutOptional();
+	const breakpoint = context?.breakpoint ?? "md";
+	const intensity = context?.intensity ?? "medium";
+	const bp = breakpoint;
+	return /* @__PURE__ */ jsx(GlassCard, {
+		asChild: true,
+		intensity,
+		padding: "none",
+		className: cn("overflow-hidden rounded-xl", `${bp}:sticky`, `${bp}:top-[var(--sticky-offset)]`, `${bp}:max-h-[var(--sticky-max-height)]`, `${bp}:flex`, `${bp}:flex-col`, className),
+		children: /* @__PURE__ */ jsx("aside", {
+			ref,
+			"data-split-sidebar": "",
+			"aria-label": label,
+			...props,
+			children
+		})
+	});
+});
+SplitLayoutSidebar.displayName = "SplitLayoutGlass.Sidebar";
+var SplitLayoutSidebarHeader = forwardRef(({ children, className, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	"data-split-sidebar-header": "",
+	className: cn("shrink-0 p-4 border-b border-white/10", className),
+	...props,
+	children
+}));
+SplitLayoutSidebarHeader.displayName = "SplitLayoutGlass.SidebarHeader";
+var SplitLayoutSidebarContent = forwardRef(({ children, scrollable = true, className, ...props }, ref) => {
+	if (scrollable) {
+		const { dir, ...divProps } = props;
+		return /* @__PURE__ */ jsx(ScrollArea, {
+			ref,
+			"data-split-sidebar-content": "",
+			className: cn("flex-1 min-h-0", className),
+			...divProps,
+			children: /* @__PURE__ */ jsx("div", {
+				className: "p-4",
+				children
+			})
+		});
+	}
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		"data-split-sidebar-content": "",
+		className: cn("flex-1 min-h-0 overflow-auto p-4", className),
+		...props,
+		children
+	});
+});
+SplitLayoutSidebarContent.displayName = "SplitLayoutGlass.SidebarContent";
+var SplitLayoutSidebarFooter = forwardRef(({ children, className, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	"data-split-sidebar-footer": "",
+	className: cn("shrink-0 p-4 border-t border-white/10", className),
+	...props,
+	children
+}));
+SplitLayoutSidebarFooter.displayName = "SplitLayoutGlass.SidebarFooter";
+var SplitLayoutMain = forwardRef(({ children, label = "Main content", className, ...props }, ref) => {
+	const context = useSplitLayoutOptional();
+	const breakpoint = context?.breakpoint ?? "md";
+	const intensity = context?.intensity ?? "medium";
+	const bp = breakpoint;
+	return /* @__PURE__ */ jsx(GlassCard, {
+		asChild: true,
+		intensity,
+		padding: "none",
+		className: cn("overflow-hidden rounded-xl", `${bp}:sticky`, `${bp}:top-[var(--sticky-offset)]`, `${bp}:max-h-[var(--sticky-max-height)]`, `${bp}:flex`, `${bp}:flex-col`, className),
+		children: /* @__PURE__ */ jsx("main", {
+			ref,
+			"data-split-main": "",
+			"aria-label": label,
+			...props,
+			children
+		})
+	});
+});
+SplitLayoutMain.displayName = "SplitLayoutGlass.Main";
+var SplitLayoutMainHeader = forwardRef(({ children, className, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	"data-split-main-header": "",
+	className: cn("shrink-0 p-6 border-b border-white/10", className),
+	...props,
+	children
+}));
+SplitLayoutMainHeader.displayName = "SplitLayoutGlass.MainHeader";
+var SplitLayoutMainContent = forwardRef(({ children, scrollable = true, className, ...props }, ref) => {
+	if (scrollable) {
+		const { dir, ...divProps } = props;
+		return /* @__PURE__ */ jsx(ScrollArea, {
+			ref,
+			"data-split-main-content": "",
+			className: cn("flex-1 min-h-0", className),
+			...divProps,
+			children: /* @__PURE__ */ jsx("div", {
+				className: "p-6",
+				children
+			})
+		});
+	}
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		"data-split-main-content": "",
+		className: cn("flex-1 min-h-0 overflow-auto p-6", className),
+		...props,
+		children
+	});
+});
+SplitLayoutMainContent.displayName = "SplitLayoutGlass.MainContent";
+var SplitLayoutMainFooter = forwardRef(({ children, className, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	"data-split-main-footer": "",
+	className: cn("shrink-0 p-6 border-t border-white/10", className),
+	...props,
+	children
+}));
+SplitLayoutMainFooter.displayName = "SplitLayoutGlass.MainFooter";
+var SplitLayoutTrigger = forwardRef(({ asChild = false, showOnDesktop = false, variant = "menu", className, children, ...props }, ref) => {
+	const { toggle, isOpen, isMobileOpen, isMobile, breakpoint } = useSplitLayout();
+	const currentOpen = isMobile ? isMobileOpen : isOpen;
+	const Icon$1 = variant === "menu" ? currentOpen ? X : Menu : currentOpen ? PanelLeftClose : PanelLeftOpen;
+	const visibilityClass = showOnDesktop ? "" : `${breakpoint}:hidden`;
+	if (asChild) return /* @__PURE__ */ jsx(Slot, {
+		ref,
+		onClick: toggle,
+		"aria-label": currentOpen ? "Close sidebar" : "Open sidebar",
+		"aria-expanded": currentOpen,
+		"data-state": currentOpen ? "open" : "closed",
+		className: cn(visibilityClass, className),
+		...props,
+		children
+	});
+	return /* @__PURE__ */ jsx(ButtonGlass, {
+		ref,
+		variant: "ghost",
+		size: "icon",
+		onClick: toggle,
+		"aria-label": currentOpen ? "Close sidebar" : "Open sidebar",
+		"aria-expanded": currentOpen,
+		"data-state": currentOpen ? "open" : "closed",
+		className: cn(visibilityClass, className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(Icon$1, { className: "h-5 w-5" })
+	});
+});
+SplitLayoutTrigger.displayName = "SplitLayoutGlass.Trigger";
+const SplitLayoutGlass = {
+	Provider: SplitLayoutProvider,
+	Root: SplitLayoutRoot,
+	Sidebar: SplitLayoutSidebar,
+	SidebarHeader: SplitLayoutSidebarHeader,
+	SidebarContent: SplitLayoutSidebarContent,
+	SidebarFooter: SplitLayoutSidebarFooter,
+	Main: SplitLayoutMain,
+	MainHeader: SplitLayoutMainHeader,
+	MainContent: SplitLayoutMainContent,
+	MainFooter: SplitLayoutMainFooter,
+	Trigger: SplitLayoutTrigger
+};
 var ChartContext = React$1.createContext(null);
 function useChart() {
 	const context = React$1.useContext(ChartContext);
@@ -901,6 +2548,6 @@ const buttonVariants = cva("inline-flex items-center justify-center gap-2 whites
 		size: "default"
 	}
 });
-export { AICardGlass, AlertGlass, AlertGlassDescription, AlertGlassTitle, AvatarGlass, AvatarGlassFallback, AvatarGlassImage, AvatarGlassSimple, BadgeGlass, Bar, BarChart, BaseProgressGlass, ButtonGlass, CareerStatsGlass, CareerStatsHeaderGlass, Cell, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, CheckboxGlass, CircularMetricGlass, CircularProgressGlass, ComboBoxGlass, ContributionMetricsGlass, DropdownGlass, DropdownMenuGlass, DropdownMenuGlassCheckboxItem, DropdownMenuGlassContent, DropdownMenuGlassGroup, DropdownMenuGlassItem, DropdownMenuGlassLabel, DropdownMenuGlassPortal, DropdownMenuGlassRadioGroup, DropdownMenuGlassRadioItem, DropdownMenuGlassSeparator, DropdownMenuGlassShortcut, DropdownMenuGlassSub, DropdownMenuGlassSubContent, DropdownMenuGlassSubTrigger, DropdownMenuGlassTrigger, ExpandableHeaderGlass, FlagAlertGlass, FlagsSectionGlass, FormFieldWrapper, GlassCard, HeaderBrandingGlass, HeaderNavGlass, IconButtonGlass, InputGlass, InsightCardGlass, InteractiveCard, LanguageBarGlass, MetricCardGlass, MetricsGridGlass, ModalGlass, NotificationGlass, PopoverGlass, PopoverGlassAnchor, PopoverGlassContent, PopoverGlassLegacy, PopoverGlassTrigger, ProfileAvatarGlass, ProfileHeaderGlass, ProgressGlass, ProjectsListGlass, RainbowProgressGlass, RepositoryCardGlass, RepositoryHeaderGlass, RepositoryMetadataGlass, ResponsiveContainer, SearchBoxGlass, SegmentedControlGlass, SkeletonGlass, SliderGlass, SortDropdownGlass, SparklineGlass, StatItemGlass, StatusIndicatorGlass, StepperGlass, THEMES, THEME_CONFIG, TabsGlass, ThemeProvider, ThemeToggleGlass, ToggleGlass, TooltipGlass, TooltipGlassContent, TooltipGlassProvider, TooltipGlassSimple, TooltipGlassTrigger, TouchTarget, TrustScoreCardGlass, TrustScoreDisplayGlass, UserInfoGlass, UserStatsLineGlass, YearCardGlass, alertVariants, avatarSizes, badgeVariants, buttonGlassVariants, cardIntensity, cn, dropdownAlign, getNextTheme, getThemeConfig, inputVariants, insightCardVariants, insightVariantConfig, modalSizes, notificationVariants, progressSizes, alertVariants$1 as shadcnAlertVariants, badgeVariants$1 as shadcnBadgeVariants, buttonVariants as shadcnButtonVariants, skeletonVariants, sparklineBarVariants, sparklineContainerVariants, statusSizes, stepperConnectorVariants, stepperContentVariants, stepperDescriptionVariants, stepperIndicatorVariants, stepperLabelVariants, stepperListVariants, stepperRootVariants, stepperStepContainerVariants, toggleSizes, tooltipPositions, useChart, useFocus, useHover, useResponsive, useTheme, useWallpaperTint };
+export { AICardGlass, AlertGlass, AlertGlassDescription, AlertGlassTitle, AvatarGlass, AvatarGlassFallback, AvatarGlassImage, AvatarGlassSimple, BadgeGlass, Bar, BarChart, BaseProgressGlass, ButtonGlass, CareerStatsGlass, CareerStatsHeaderGlass, Cell, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, CheckboxGlass, CircularMetricGlass, CircularProgressGlass, ComboBoxGlass, ContributionMetricsGlass, DropdownGlass, DropdownMenuGlass, DropdownMenuGlassCheckboxItem, DropdownMenuGlassContent, DropdownMenuGlassGroup, DropdownMenuGlassItem, DropdownMenuGlassLabel, DropdownMenuGlassPortal, DropdownMenuGlassRadioGroup, DropdownMenuGlassRadioItem, DropdownMenuGlassSeparator, DropdownMenuGlassShortcut, DropdownMenuGlassSub, DropdownMenuGlassSubContent, DropdownMenuGlassSubTrigger, DropdownMenuGlassTrigger, ExpandableHeaderGlass, FlagAlertGlass, FlagsSectionGlass, FormFieldWrapper, GlassCard, HeaderBrandingGlass, HeaderNavGlass, IconButtonGlass, InputGlass, InsightCardGlass, InteractiveCard, LanguageBarGlass, MetricCardGlass, MetricsGridGlass, ModalGlass, NotificationGlass, PopoverGlass, PopoverGlassAnchor, PopoverGlassContent, PopoverGlassLegacy, PopoverGlassTrigger, ProfileAvatarGlass, ProfileHeaderGlass, ProgressGlass, ProjectsListGlass, RainbowProgressGlass, RepositoryCardGlass, RepositoryHeaderGlass, RepositoryMetadataGlass, ResponsiveContainer, SearchBoxGlass, SegmentedControlGlass, SidebarGlass, SkeletonGlass, SliderGlass, SortDropdownGlass, SparklineGlass, SplitLayoutAccordion, SplitLayoutGlass, StatItemGlass, StatusIndicatorGlass, StepperGlass, THEMES, THEME_CONFIG, TabsGlass, ThemeProvider, ThemeToggleGlass, ToggleGlass, TooltipGlass, TooltipGlassContent, TooltipGlassProvider, TooltipGlassSimple, TooltipGlassTrigger, TouchTarget, TrustScoreCardGlass, TrustScoreDisplayGlass, UserInfoGlass, UserStatsLineGlass, YearCardGlass, alertVariants, avatarSizes, badgeVariants, buttonGlassVariants, cardIntensity, cn, dropdownAlign, getNextTheme, getThemeConfig, inputVariants, insightCardVariants, insightVariantConfig, modalSizes, notificationVariants, progressSizes, alertVariants$1 as shadcnAlertVariants, badgeVariants$1 as shadcnBadgeVariants, buttonVariants as shadcnButtonVariants, skeletonVariants, sparklineBarVariants, sparklineContainerVariants, statusSizes, stepperConnectorVariants, stepperContentVariants, stepperDescriptionVariants, stepperIndicatorVariants, stepperLabelVariants, stepperListVariants, stepperRootVariants, stepperStepContainerVariants, toggleSizes, tooltipPositions, useChart, useFocus, useHover, useResponsive, useSidebar, useSplitLayout, useSplitLayoutOptional, useTheme, useWallpaperTint };
 
 //# sourceMappingURL=index.js.map