@nocoo/basalt 3.2.1 → 3.2.4

package/dist/components/sidebar.js

@@ -2,36 +2,40 @@
 import { cn as e } from "../utils/cn.js";
 import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
 import { FOCUS_INSET as n, OVERLAY_LAYER as r, OVERLAY_MOTION as i } from "./overlay.js";
-import { Dialog as a, DialogOverlay as o, DialogPortal as s } from "./dialog.js";
-import { Collapsible as c, CollapsibleContent as l, CollapsibleTrigger as u } from "./collapsible.js";
-import { useHoverHighlight as d } from "../utils/use-hover-highlight.js";
-import { SkeletonLine as f } from "./skeleton-line.js";
-import { NAV_ITEM_CLASS as p, NAV_LIST_CLASS as m, NAV_ROW_CLASS as h } from "../utils/navigation.js";
-import { createContext as g, useCallback as _, useContext as v, useLayoutEffect as y, useRef as b, useState as x } from "react";
-import { ChevronUp as S, Search as C } from "lucide-react";
-import { jsx as w, jsxs as T } from "react/jsx-runtime";
-import * as E from "@radix-ui/react-dialog";
-//#region src/components/sidebar.tsx
-var D = g(null);
-function O() {
-	let e = v(D);
+import { Button as a } from "./button.js";
+import { Dialog as o, DialogOverlay as s, DialogPortal as c } from "./dialog.js";
+import { Collapsible as l, CollapsibleContent as u, CollapsibleTrigger as d } from "./collapsible.js";
+import { useHoverHighlight as f } from "../utils/use-hover-highlight.js";
+import { Tooltip as p, TooltipContent as m, TooltipProvider as h, TooltipTrigger as g } from "./tooltip.js";
+import { SkeletonLine as _ } from "./skeleton-line.js";
+import { Link as v } from "./link.js";
+import { NAV_ITEM_CLASS as y, NAV_LIST_CLASS as b, NAV_ROW_CLASS as x } from "../utils/navigation.js";
+import { createContext as S, useCallback as C, useContext as w, useLayoutEffect as T, useRef as E, useState as D } from "react";
+import { Slot as O } from "@radix-ui/react-slot";
+import { ChevronUp as k, PanelLeft as A, Search as j } from "lucide-react";
+import { jsx as M, jsxs as N } from "react/jsx-runtime";
+import * as P from "@radix-ui/react-dialog";
+// src/components/sidebar.tsx
+var F = S(null);
+function I() {
+	let e = w(F);
 	if (!e) throw Error("useSidebar must be used within SidebarProvider");
 	return e;
 }
-function k({ collapsed: e, defaultCollapsed: t = !1, onCollapsedChange: n, side: r = "left", loading: i = !1, peek: a = !1, overlay: o = !1, defaultWidth: s = 260, children: c }) {
-	let [l, u] = x(t), [d, f] = x(!1), [p, m] = x(() => A(s)), h = _((e) => {
-		m(A(e));
-	}, []), g = b(null), v = b(e ?? t), S = b(o), C = e ?? l;
-	y(() => {
-		o && !C && (v.current || !S.current) && document.activeElement instanceof HTMLElement && (g.current = document.activeElement), v.current = C, S.current = o;
+function L({ collapsed: e, defaultCollapsed: t = !1, onCollapsedChange: n, side: r = "left", loading: i = !1, peek: a = !1, overlay: o = !1, defaultWidth: s = 260, children: c }) {
+	let [l, u] = D(t), [d, f] = D(!1), [p, m] = D(() => R(s)), h = C((e) => {
+		m(R(e));
+	}, []), g = E(null), _ = E(e ?? t), v = E(o), y = e ?? l;
+	T(() => {
+		o && !y && (_.current || !v.current) && document.activeElement instanceof HTMLElement && (g.current = document.activeElement), _.current = y, v.current = o;
 	});
-	let T = _((t) => {
+	let b = C((t) => {
 		!t && document.activeElement instanceof HTMLElement && (g.current = document.activeElement), e === void 0 && u(t), n?.(t);
 	}, [e, n]);
-	return /* @__PURE__ */ w(D.Provider, {
+	return /* @__PURE__ */ M(F.Provider, {
 		value: {
-			collapsed: C,
-			setCollapsed: T,
+			collapsed: y,
+			setCollapsed: b,
 			side: r,
 			loading: i,
 			peek: a,
@@ -45,11 +49,11 @@ function k({ collapsed: e, defaultCollapsed: t = !1, onCollapsedChange: n, side:
 		children: c
 	});
 }
-function A(e) {
+function R(e) {
 	return Math.min(400, Math.max(180, e));
 }
-function j({ side: t, width: n, onWidth: r }) {
-	return /* @__PURE__ */ w("div", {
+function z({ side: t, width: n, onWidth: r }) {
+	return /* @__PURE__ */ M("div", {
 		role: "separator",
 		"aria-orientation": "vertical",
 		"aria-valuenow": n,
@@ -62,7 +66,7 @@ function j({ side: t, width: n, onWidth: r }) {
 			e.preventDefault(), e.currentTarget.setPointerCapture(e.pointerId);
 			let i = e.clientX, a = n, o = e.currentTarget, s = (e) => {
 				let n = t === "right" ? i - e.clientX : e.clientX - i;
-				r(A(a + n));
+				r(R(a + n));
 			}, c = () => {
 				o.removeEventListener("pointermove", s), o.removeEventListener("pointerup", c), o.removeEventListener("pointercancel", c);
 			};
@@ -72,47 +76,47 @@ function j({ side: t, width: n, onWidth: r }) {
 			if (e.key !== "ArrowLeft" && e.key !== "ArrowRight") return;
 			e.preventDefault();
 			let i = e.key === "ArrowRight" ? 1 : -1;
-			r(A(n + (t === "right" ? -i * 8 : i * 8)));
+			r(R(n + (t === "right" ? -i * 8 : i * 8)));
 		}
 	});
 }
-function M({ collapsed: n, className: c, children: l, onMouseEnter: u, onMouseLeave: d, style: p, ...m }) {
-	let h = v(D), g = h ? h.collapsed && !(h.peek && h.peeking) : n ?? !1, _ = h?.side ?? "left", y = h?.overlay ?? !1, b = h?.width ?? 260, x = h?.loading ? /* @__PURE__ */ T("div", {
-		className: "flex flex-col gap-basalt-space-lg p-basalt-space-lg",
+function B({ collapsed: n, resizable: a = !0, className: l, children: u, onMouseEnter: d, onMouseLeave: f, style: p, ...m }) {
+	let h = w(F), g = h ? h.collapsed && !(h.peek && h.peeking) : n ?? !1, v = h?.side ?? "left", y = h?.overlay ?? !1, b = h?.width ?? 260, x = h?.loading ? /* @__PURE__ */ N("div", {
+		className: "flex flex-col gap-basalt-space-lg px-basalt-layout-lg py-basalt-space-lg",
 		role: "status",
 		"aria-live": "polite",
 		children: [
-			/* @__PURE__ */ w(f, {}),
-			/* @__PURE__ */ w(f, {}),
-			/* @__PURE__ */ w(f, {})
+			/* @__PURE__ */ M(_, {}),
+			/* @__PURE__ */ M(_, {}),
+			/* @__PURE__ */ M(_, {})
 		]
-	}) : l, S = h && !g ? /* @__PURE__ */ w(j, {
-		side: _,
+	}) : u, S = h && a && !g ? /* @__PURE__ */ M(z, {
+		side: v,
 		width: h.width,
 		onWidth: h.setWidth
-	}) : null, C = e(t, "relative flex shrink-0 flex-col bg-basalt-background text-basalt-base text-basalt-foreground", i, c);
-	return y && h ? /* @__PURE__ */ w(a, {
+	}) : null, C = e(t, "relative flex shrink-0 flex-col bg-basalt-background text-basalt-base text-basalt-foreground", i, l);
+	return y && h ? /* @__PURE__ */ M(o, {
 		open: !h.collapsed,
 		onOpenChange: (e) => h.setCollapsed(!e),
-		children: /* @__PURE__ */ T(s, { children: [/* @__PURE__ */ w(o, {}), /* @__PURE__ */ T(E.Content, {
+		children: /* @__PURE__ */ N(c, { children: [/* @__PURE__ */ M(s, {}), /* @__PURE__ */ N(P.Content, {
 			"data-basalt-sidebar": "",
 			"aria-label": "Sidebar",
 			"data-overlay": "",
-			"data-side": _,
+			"data-side": v,
 			"aria-busy": h.loading || void 0,
-			onMouseEnter: u,
-			onMouseLeave: d,
+			onMouseEnter: d,
+			onMouseLeave: f,
 			ref: (e) => {
 				e && document.activeElement instanceof HTMLElement && !e.contains(document.activeElement) && (h.lastFocusRef.current = document.activeElement);
 			},
 			onOpenAutoFocus: (e) => {
 				let t = "relatedTarget" in e ? e.relatedTarget : null;
-				t instanceof HTMLElement && (h.lastFocusRef.current = t);
+				t instanceof HTMLElement && (h.lastFocusRef.current = t), e.target instanceof HTMLElement && (e.preventDefault(), e.target.focus());
 			},
 			onCloseAutoFocus: (e) => {
 				e.preventDefault(), h.lastFocusRef.current?.focus();
 			},
-			className: e(C, r, "fixed inset-y-0 overflow-hidden shadow-md", _ === "right" ? "right-0" : "left-0"),
+			className: e(C, r, "fixed inset-y-0 overflow-hidden shadow-md", v === "right" ? "right-0" : "left-0"),
 			style: {
 				width: b,
 				...p
@@ -120,18 +124,18 @@ function M({ collapsed: n, className: c, children: l, onMouseEnter: u, onMouseLe
 			...m,
 			children: [x, S]
 		})] })
-	}) : /* @__PURE__ */ T("aside", {
+	}) : /* @__PURE__ */ N("aside", {
 		"data-basalt-sidebar": "",
 		"data-collapsed": g ? "" : void 0,
-		"data-side": _,
+		"data-side": v,
 		"aria-busy": h?.loading || void 0,
 		onMouseEnter: (e) => {
-			h?.peek && h.collapsed && h.setPeeking(!0), u?.(e);
+			h?.peek && h.collapsed && h.setPeeking(!0), d?.(e);
 		},
 		onMouseLeave: (e) => {
-			h?.peek && h.setPeeking(!1), d?.(e);
+			h?.peek && h.setPeeking(!1), f?.(e);
 		},
-		className: e(C, "sticky overflow-hidden transition-[width] basalt-motion duration-basalt-normal ease-basalt", _ === "right" ? "order-last" : void 0, g && "w-basalt-rail"),
+		className: e(C, "sticky overflow-hidden transition-[width] basalt-motion duration-basalt-normal ease-basalt", v === "right" ? "order-last" : void 0, g && "w-basalt-rail"),
 		style: g ? p : {
 			width: b,
 			...p
@@ -140,121 +144,219 @@ function M({ collapsed: n, className: c, children: l, onMouseEnter: u, onMouseLe
 		children: [x, S]
 	});
 }
-var N = "min-h-[calc(var(--basalt-line-row)+2*var(--basalt-space-lg))] py-basalt-space-lg";
-function P({ className: t, ...n }) {
-	return /* @__PURE__ */ w("div", {
+var V = "min-h-[calc(var(--basalt-line-row)+2*var(--basalt-space-lg))] py-basalt-space-lg";
+function H({ className: t, ...n }) {
+	return /* @__PURE__ */ M("div", {
 		"data-slot": "sidebar-header",
-		className: e("flex h-basalt-14 shrink-0 items-center gap-basalt-row-gap px-basalt-nav-inset", t),
+		className: e("flex h-basalt-14 shrink-0 items-center gap-basalt-row-gap px-basalt-layout-lg", t),
 		...n
 	});
 }
-function F({ shortcut: n = "⌘K", className: r, children: i, ...a }) {
-	return /* @__PURE__ */ T("button", {
+function U({ logo: t, name: n, version: r, action: i, className: a, ...o }) {
+	return /* @__PURE__ */ N("div", {
+		"data-slot": "sidebar-brand",
+		className: e("relative flex h-full min-w-0 flex-1 items-center gap-basalt-row-gap", a),
+		...o,
+		children: [
+			/* @__PURE__ */ M("span", {
+				"data-slot": "sidebar-brand-logo",
+				className: "flex w-basalt-sidebar-brand-slot shrink-0 items-center justify-center",
+				children: t
+			}),
+			/* @__PURE__ */ N("div", {
+				className: "flex min-w-0 flex-1 items-center gap-basalt-row-gap overflow-hidden whitespace-nowrap",
+				children: [/* @__PURE__ */ M("span", {
+					className: "min-w-0 flex-1 truncate text-basalt-base font-semibold",
+					children: n
+				}), r == null ? null : /* @__PURE__ */ M("span", {
+					className: "shrink-0 text-basalt-sm text-basalt-muted-foreground",
+					children: r
+				})]
+			}),
+			i ? /* @__PURE__ */ M("div", {
+				"data-slot": "sidebar-brand-action",
+				className: "basalt-sidebar-brand-action",
+				children: i
+			}) : null
+		]
+	});
+}
+function W({ "aria-label": e, expandLabel: t = "Expand sidebar", collapseLabel: n = "Collapse sidebar", onClick: r, variant: i = "ghost", ...o }) {
+	let { collapsed: s, setCollapsed: c, side: l } = I(), u = e ?? (s ? t : n);
+	return /* @__PURE__ */ M(h, { children: /* @__PURE__ */ N(p, { children: [/* @__PURE__ */ M(g, {
+		asChild: !0,
+		children: /* @__PURE__ */ M(a, {
+			...o,
+			variant: i,
+			size: "icon-sm",
+			"aria-expanded": !s,
+			"aria-label": u,
+			onClick: (e) => {
+				r?.(e), e.defaultPrevented || c(!s);
+			},
+			children: /* @__PURE__ */ M(A, { "aria-hidden": "true" })
+		})
+	}), /* @__PURE__ */ M(m, {
+		side: l === "right" ? "left" : "right",
+		children: u
+	})] }) });
+}
+function G({ shortcut: n = "⌘K", className: r, children: i, ...a }) {
+	return /* @__PURE__ */ N("button", {
 		type: "button",
-		className: e(t, h, N, "w-full cursor-pointer bg-basalt-secondary transition-colors basalt-motion hover:bg-basalt-hover", r),
+		className: e(t, x, V, "w-full cursor-pointer bg-basalt-secondary transition-colors basalt-motion hover:bg-basalt-hover", r),
 		...a,
 		children: [
-			/* @__PURE__ */ w(C, {
+			/* @__PURE__ */ M(j, {
 				className: "h-basalt-4 w-basalt-4 text-basalt-muted-foreground",
 				strokeWidth: 1.5
 			}),
-			/* @__PURE__ */ w("span", {
+			/* @__PURE__ */ M("span", {
 				className: "flex-1 text-left text-basalt-base text-basalt-muted-foreground",
 				children: i
 			}),
-			/* @__PURE__ */ w("kbd", {
+			/* @__PURE__ */ M("kbd", {
 				className: "pointer-events-none hidden rounded-basalt-sm border border-basalt-border bg-basalt-card px-basalt-space-md py-basalt-space-xs text-basalt-sm font-medium text-basalt-muted-foreground sm:inline-block",
 				children: n
 			})
 		]
 	});
 }
-function I({ className: t, ...n }) {
-	let r = d(void 0, { restoreOnPointerLeave: !1 });
-	return /* @__PURE__ */ w("nav", {
+function K({ className: t, ...n }) {
+	let r = f(void 0, { restoreOnPointerLeave: !1 });
+	return /* @__PURE__ */ M("nav", {
 		ref: r,
 		"data-slot": "sidebar-nav",
-		className: e(m, "min-h-0 flex-1 flex-col overflow-y-auto overscroll-y-contain", t),
+		className: e(b, "basalt-sidebar-nav min-h-0 flex-1 flex-col overflow-y-auto overscroll-y-contain", t),
 		...n
 	});
 }
-function L({ className: t, ...n }) {
-	return /* @__PURE__ */ w("p", {
+function q({ className: t, ...n }) {
+	return /* @__PURE__ */ M("p", {
 		"data-slot": "sidebar-partition",
 		className: e("shrink-0 px-basalt-row-x pt-basalt-layout pb-basalt-space-lg text-basalt-sm font-semibold tracking-wide text-basalt-foreground uppercase", t),
 		...n
 	});
 }
-function R({ active: t = !1, className: n, ...r }) {
-	return /* @__PURE__ */ w("button", {
-		type: "button",
-		"aria-current": t ? "page" : void 0,
+function J(e) {
+	if (e.asChild && e.disabled) throw Error("Sidebar asChild rows do not support disabled; use a native button row");
+}
+function Y(t) {
+	J(t);
+	let n = e(y, V, "w-full text-inherit no-underline hover:no-underline", t.className);
+	if (typeof t.href == "string") {
+		let { href: e, active: r = !1, children: i, className: a, ...o } = t;
+		return /* @__PURE__ */ M(v, {
+			...o,
+			href: e,
+			"aria-current": r ? "page" : void 0,
+			"data-basalt-hover-item": "",
+			"data-sidebar-row": "",
+			"data-hover-selected": r,
+			className: n,
+			children: i
+		});
+	}
+	let { asChild: r = !1, type: i = "button", active: a = !1, children: o, className: s, ...c } = t, l = {
+		"aria-current": a ? "page" : void 0,
 		"data-basalt-hover-item": "",
 		"data-sidebar-row": "",
-		"data-hover-selected": t,
-		className: e(p, N, "w-full", n),
-		...r
+		"data-hover-selected": a,
+		className: n
+	};
+	return r ? /* @__PURE__ */ M(O, {
+		...c,
+		...l,
+		children: o
+	}) : /* @__PURE__ */ M("button", {
+		...c,
+		type: i,
+		...l,
+		children: o
 	});
 }
-function z({ active: t = !1, className: n, ...r }) {
-	return /* @__PURE__ */ w("button", {
-		type: "button",
-		"aria-current": t ? "page" : void 0,
+function X(t) {
+	J(t);
+	let n = e(y, V, "relative w-basalt-control justify-center text-inherit no-underline hover:no-underline", t.className);
+	if (typeof t.href == "string") {
+		let { href: e, active: r = !1, children: i, className: a, ...o } = t;
+		return /* @__PURE__ */ M(v, {
+			...o,
+			href: e,
+			"aria-current": r ? "page" : void 0,
+			"data-basalt-hover-item": "",
+			"data-sidebar-row": "",
+			"data-hover-selected": r,
+			className: n,
+			children: i
+		});
+	}
+	let { asChild: r = !1, type: i = "button", active: a = !1, children: o, className: s, ...c } = t, l = {
+		"aria-current": a ? "page" : void 0,
 		"data-basalt-hover-item": "",
 		"data-sidebar-row": "",
-		"data-hover-selected": t,
-		className: e(p, N, "relative w-basalt-control justify-center", n),
-		...r
+		"data-hover-selected": a,
+		className: n
+	};
+	return r ? /* @__PURE__ */ M(O, {
+		...c,
+		...l,
+		children: o
+	}) : /* @__PURE__ */ M("button", {
+		...c,
+		type: i,
+		...l,
+		children: o
 	});
 }
-function B({ label: t, defaultOpen: r = !0, children: a }) {
-	let [o, s] = x(r);
-	return /* @__PURE__ */ T(c, {
+function Z({ label: t, defaultOpen: r = !0, children: a }) {
+	let [o, s] = D(r);
+	return /* @__PURE__ */ N(l, {
 		open: o,
 		onOpenChange: s,
 		"data-slot": "sidebar-group",
 		className: "shrink-0 pt-basalt-layout-sm",
-		children: [/* @__PURE__ */ w(u, {
+		children: [/* @__PURE__ */ M(d, {
 			asChild: !0,
-			children: /* @__PURE__ */ T("button", {
+			children: /* @__PURE__ */ N("button", {
 				type: "button",
 				"data-slot": "sidebar-group-label",
 				className: e("flex w-full cursor-pointer items-center justify-between gap-basalt-row-gap rounded-basalt-md px-basalt-row-x py-basalt-space-lg text-left text-basalt-sm font-semibold leading-basalt-row tracking-wide text-basalt-muted-foreground uppercase transition-colors basalt-motion hover:text-basalt-foreground", n),
-				children: [/* @__PURE__ */ w("span", {
+				children: [/* @__PURE__ */ M("span", {
 					className: "min-w-0 truncate",
 					children: t
-				}), /* @__PURE__ */ w(S, {
+				}), /* @__PURE__ */ M(k, {
 					className: e("h-basalt-4 w-basalt-4 text-basalt-muted-foreground transition-transform basalt-motion duration-basalt-normal", i, !o && "rotate-180"),
 					strokeWidth: 1.5
 				})]
 			})
-		}), /* @__PURE__ */ w(l, {
+		}), /* @__PURE__ */ M(u, {
 			unstyled: !0,
-			children: /* @__PURE__ */ w("div", {
+			children: /* @__PURE__ */ M("div", {
 				className: "flex flex-col gap-basalt-nav-gap pt-basalt-nav-gap",
 				children: a
 			})
 		})]
 	});
 }
-function V({ className: t, ...n }) {
-	return /* @__PURE__ */ w("div", {
+function Q({ className: t, ...n }) {
+	return /* @__PURE__ */ M("div", {
 		"data-slot": "sidebar-footer",
-		className: e("flex shrink-0 flex-col gap-basalt-content-gap px-basalt-layout pt-basalt-space-lg pb-basalt-layout", t),
+		className: e("flex shrink-0 flex-col gap-basalt-content-gap px-basalt-layout-lg pt-basalt-space-lg pb-basalt-layout", t),
 		...n
 	});
 }
-function H({ name: t, email: n, avatar: r, action: i, className: a }) {
-	return /* @__PURE__ */ T("div", {
+function $({ name: t, email: n, avatar: r, action: i, className: a }) {
+	return /* @__PURE__ */ N("div", {
 		className: e("flex items-center gap-basalt-space-lg", a),
 		children: [
 			r,
-			/* @__PURE__ */ T("div", {
+			/* @__PURE__ */ N("div", {
 				className: "min-w-0 flex-1",
-				children: [/* @__PURE__ */ w("p", {
+				children: [/* @__PURE__ */ M("p", {
 					className: "truncate text-basalt-base font-medium text-basalt-foreground",
 					children: t
-				}), n ? /* @__PURE__ */ w("p", {
+				}), n ? /* @__PURE__ */ M("p", {
 					className: "truncate text-basalt-sm text-basalt-muted-foreground",
 					children: n
 				}) : null]
@@ -263,15 +365,14 @@ function H({ name: t, email: n, avatar: r, action: i, className: a }) {
 		]
 	});
 }
-function U({ mobileSurface: t = "inset", className: n, ...r }) {
-	return /* @__PURE__ */ w("div", {
+function ee({ mobileSurface: t = "inset", className: n, ...r }) {
+	return /* @__PURE__ */ M("div", {
 		"data-basalt-surface-root": "",
 		"data-basalt-island": t,
 		className: e("min-h-0 min-w-0 flex-1 bg-basalt-card text-basalt-card-foreground md:rounded-basalt-island md:p-basalt-layout-lg lg:px-basalt-layout-xl", t === "inset" ? "rounded-basalt-lg p-basalt-layout shadow-sm ring-1 ring-basalt-border/40" : "md:shadow-sm md:ring-1 md:ring-basalt-border/40", n),
 		...r
 	});
 }
-//#endregion
-export { U as ContentIsland, M as Sidebar, V as SidebarFooter, B as SidebarGroup, P as SidebarHeader, z as SidebarIconItem, R as SidebarItem, I as SidebarNav, L as SidebarPartition, k as SidebarProvider, F as SidebarSearch, H as SidebarUser, O as useSidebar };
+export { ee as ContentIsland, B as Sidebar, U as SidebarBrand, Q as SidebarFooter, Z as SidebarGroup, H as SidebarHeader, X as SidebarIconItem, Y as SidebarItem, K as SidebarNav, q as SidebarPartition, L as SidebarProvider, G as SidebarSearch, W as SidebarToggle, $ as SidebarUser, I as useSidebar };
 
 //# sourceMappingURL=sidebar.js.map

package/dist/components/sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar.js","names":["DialogPrimitive","SidebarContext","createContext","useSidebar","context","useContext","SidebarProvider","uncontrolled","setUncontrolled","useState","defaultCollapsed","peeking","setPeeking","width","setWidthState","clampSidebarWidth","defaultWidth","setWidth","useCallback","next","lastFocusRef","useRef","prevCollapsed","collapsed","prevOverlay","overlay","resolved","setCollapsed","onCollapsedChange","SidebarResize","cn","side","event","startX","startWidth","target","onMove","delta","move","onUp","dir","Sidebar","collapsedProp","props","body","SkeletonLine","children","resize","frameClass","BASALT_UI_CLASS","OVERLAY_MOTION","className","Dialog","open","DialogPortal","DialogOverlay","node","from","OVERLAY_LAYER","style","onMouseEnter","onMouseLeave","SIDEBAR_ROW_CLASS","SidebarHeader","SidebarSearch","NAV_ROW_CLASS","Search","shortcut","SidebarNav","highlightRef","useHoverHighlight","NAV_LIST_CLASS","SidebarPartition","SidebarItem","active","NAV_ITEM_CLASS","SidebarIconItem","SidebarGroup","setOpen","defaultOpen","Collapsible","CollapsibleTrigger","FOCUS_INSET","label","ChevronUp","CollapsibleContent","SidebarFooter","SidebarUser","avatar","name","email","action","ContentIsland","mobileSurface"],"sources":["../../src/components/sidebar.tsx"],"sourcesContent":["import * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport { ChevronUp, Search } from \"lucide-react\";\nimport {\n\ttype ButtonHTMLAttributes,\n\tcreateContext,\n\ttype HTMLAttributes,\n\ttype ReactNode,\n\ttype PointerEvent as ReactPointerEvent,\n\ttype RefObject,\n\tuseCallback,\n\tuseContext,\n\tuseLayoutEffect,\n\tuseRef,\n\tuseState,\n} from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { NAV_ITEM_CLASS, NAV_LIST_CLASS, NAV_ROW_CLASS } from \"../utils/navigation\";\nimport { useHoverHighlight } from \"../utils/use-hover-highlight\";\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from \"./collapsible\";\nimport { Dialog, DialogOverlay, DialogPortal } from \"./dialog\";\nimport { FOCUS_INSET, OVERLAY_LAYER, OVERLAY_MOTION } from \"./overlay\";\nimport { SkeletonLine } from \"./skeleton-line\";\n\nexport type SidebarSide = \"left\" | \"right\";\n\nexport interface SidebarContextValue {\n\t/**\n\t * Whether the sidebar is currently collapsed.\n\t */\n\tcollapsed: boolean;\n\t/**\n\t * Callback to update the collapsed state.\n\t */\n\tsetCollapsed: (next: boolean) => void;\n\t/**\n\t * Which edge the sidebar occupies.\n\t */\n\tside: SidebarSide;\n\t/**\n\t * Whether the sidebar is currently displaying a loading skeleton.\n\t */\n\tloading: boolean;\n\t/**\n\t * Whether the sidebar rail expands on pointer hover.\n\t */\n\tpeek: boolean;\n\t/**\n\t * Whether the sidebar is actively hovering in peek preview mode.\n\t */\n\tpeeking: boolean;\n\t/**\n\t * Callback to update the peek preview state.\n\t */\n\tsetPeeking: (next: boolean) => void;\n\t/**\n\t * Whether the sidebar is rendering as a modal overlay drawer instead of in-flow layout chrome.\n\t */\n\toverlay: boolean;\n\t/**\n\t * Current expanded width in pixels, clamped between 180 and 400.\n\t */\n\twidth: number;\n\t/**\n\t * Callback to update the sidebar width. Value is clamped between 180 and 400 pixels.\n\t */\n\tsetWidth: (next: number) => void;\n\t/**\n\t * Reference to the last active element that held focus before opening the sidebar drawer.\n\t */\n\tlastFocusRef: RefObject<HTMLElement | null>;\n}\n\nconst SidebarContext = createContext<SidebarContextValue | null>(null);\n\n/**\n * Accesses the sidebar context value. Must be used within a `SidebarProvider`; throws an error if called outside.\n * Returns the active sidebar state and control callbacks.\n */\nexport function useSidebar(): SidebarContextValue {\n\tconst context = useContext(SidebarContext);\n\tif (!context) {\n\t\tthrow new Error(\"useSidebar must be used within SidebarProvider\");\n\t}\n\treturn context;\n}\n\nexport type SidebarProviderProps = {\n\t/**\n\t * The controlled collapsed state.\n\t */\n\tcollapsed?: boolean;\n\t/**\n\t * The uncontrolled initial collapsed state.\n\t * @default false\n\t */\n\tdefaultCollapsed?: boolean;\n\t/**\n\t * Called when the collapsed state changes.\n\t */\n\tonCollapsedChange?: (collapsed: boolean) => void;\n\t/**\n\t * Which edge the sidebar occupies.\n\t * @default left\n\t */\n\tside?: SidebarSide;\n\t/**\n\t * Replace the nav with a loading skeleton.\n\t * @default false\n\t */\n\tloading?: boolean;\n\t/**\n\t * Expand the collapsed rail on hover.\n\t * @default false\n\t */\n\tpeek?: boolean;\n\t/**\n\t * Render as an overlay instead of in-flow chrome.\n\t * @default false\n\t */\n\toverlay?: boolean;\n\t/**\n\t * Initial expanded width in pixels, clamped between 180 and 400.\n\t * @default 260\n\t */\n\tdefaultWidth?: number;\n\t/**\n\t * Sidebar chrome and page content.\n\t */\n\tchildren: ReactNode;\n};\n\nexport function SidebarProvider({\n\tcollapsed,\n\tdefaultCollapsed = false,\n\tonCollapsedChange,\n\tside = \"left\",\n\tloading = false,\n\tpeek = false,\n\toverlay = false,\n\tdefaultWidth = 260,\n\tchildren,\n}: SidebarProviderProps) {\n\tconst [uncontrolled, setUncontrolled] = useState(defaultCollapsed);\n\tconst [peeking, setPeeking] = useState(false);\n\tconst [width, setWidthState] = useState(() => clampSidebarWidth(defaultWidth));\n\tconst setWidth = useCallback((next: number) => {\n\t\tsetWidthState(clampSidebarWidth(next));\n\t}, []);\n\tconst lastFocusRef = useRef<HTMLElement | null>(null);\n\tconst prevCollapsed = useRef(collapsed ?? defaultCollapsed);\n\tconst prevOverlay = useRef(overlay);\n\tconst resolved = collapsed ?? uncontrolled;\n\tuseLayoutEffect(() => {\n\t\tif (\n\t\t\toverlay &&\n\t\t\t!resolved &&\n\t\t\t(prevCollapsed.current || !prevOverlay.current) &&\n\t\t\tdocument.activeElement instanceof HTMLElement\n\t\t) {\n\t\t\tlastFocusRef.current = document.activeElement;\n\t\t}\n\t\tprevCollapsed.current = resolved;\n\t\tprevOverlay.current = overlay;\n\t});\n\tconst setCollapsed = useCallback(\n\t\t(next: boolean) => {\n\t\t\tif (!next && document.activeElement instanceof HTMLElement) {\n\t\t\t\tlastFocusRef.current = document.activeElement;\n\t\t\t}\n\t\t\tif (collapsed === undefined) {\n\t\t\t\tsetUncontrolled(next);\n\t\t\t}\n\t\t\tonCollapsedChange?.(next);\n\t\t},\n\t\t[collapsed, onCollapsedChange],\n\t);\n\treturn (\n\t\t<SidebarContext.Provider\n\t\t\tvalue={{\n\t\t\t\tcollapsed: resolved,\n\t\t\t\tsetCollapsed,\n\t\t\t\tside,\n\t\t\t\tloading,\n\t\t\t\tpeek,\n\t\t\t\tpeeking,\n\t\t\t\tsetPeeking,\n\t\t\t\toverlay,\n\t\t\t\twidth,\n\t\t\t\tsetWidth,\n\t\t\t\tlastFocusRef,\n\t\t\t}}\n\t\t>\n\t\t\t{children}\n\t\t</SidebarContext.Provider>\n\t);\n}\n\nexport type SidebarProps = HTMLAttributes<HTMLElement> & {\n\t/**\n\t * Collapse the rail when no provider is present.\n\t * @default false\n\t */\n\tcollapsed?: boolean;\n};\n\nfunction clampSidebarWidth(next: number) {\n\treturn Math.min(400, Math.max(180, next));\n}\n\nfunction SidebarResize({\n\tside,\n\twidth,\n\tonWidth,\n}: {\n\tside: SidebarSide;\n\twidth: number;\n\tonWidth: (next: number) => void;\n}) {\n\tconst onPointerDown = (event: ReactPointerEvent<HTMLDivElement>) => {\n\t\tevent.preventDefault();\n\t\tevent.currentTarget.setPointerCapture(event.pointerId);\n\t\tconst startX = event.clientX;\n\t\tconst startWidth = width;\n\t\tconst target = event.currentTarget;\n\t\tconst onMove = (move: PointerEvent) => {\n\t\t\tconst delta = side === \"right\" ? startX - move.clientX : move.clientX - startX;\n\t\t\tonWidth(clampSidebarWidth(startWidth + delta));\n\t\t};\n\t\tconst onUp = () => {\n\t\t\ttarget.removeEventListener(\"pointermove\", onMove);\n\t\t\ttarget.removeEventListener(\"pointerup\", onUp);\n\t\t\ttarget.removeEventListener(\"pointercancel\", onUp);\n\t\t};\n\t\ttarget.addEventListener(\"pointermove\", onMove);\n\t\ttarget.addEventListener(\"pointerup\", onUp);\n\t\ttarget.addEventListener(\"pointercancel\", onUp);\n\t};\n\treturn (\n\t\t<div\n\t\t\trole=\"separator\"\n\t\t\taria-orientation=\"vertical\"\n\t\t\taria-valuenow={width}\n\t\t\taria-valuemin={180}\n\t\t\taria-valuemax={400}\n\t\t\taria-label=\"Resize sidebar\"\n\t\t\ttabIndex={0}\n\t\t\tclassName={cn(\n\t\t\t\t\"absolute top-0 h-full w-basalt-1 cursor-col-resize bg-transparent\",\n\t\t\t\tside === \"right\" ? \"left-0\" : \"right-0\",\n\t\t\t)}\n\t\t\tonPointerDown={onPointerDown}\n\t\t\tonKeyDown={(event) => {\n\t\t\t\tif (event.key !== \"ArrowLeft\" && event.key !== \"ArrowRight\") {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst dir = event.key === \"ArrowRight\" ? 1 : -1;\n\t\t\t\tconst delta = side === \"right\" ? -dir * 8 : dir * 8;\n\t\t\t\tonWidth(clampSidebarWidth(width + delta));\n\t\t\t}}\n\t\t/>\n\t);\n}\n\nexport function Sidebar({\n\tcollapsed: collapsedProp,\n\tclassName,\n\tchildren,\n\tonMouseEnter,\n\tonMouseLeave,\n\tstyle,\n\t...props\n}: SidebarProps) {\n\tconst context = useContext(SidebarContext);\n\tconst collapsed = context\n\t\t? context.collapsed && !(context.peek && context.peeking)\n\t\t: (collapsedProp ?? false);\n\tconst side = context?.side ?? \"left\";\n\tconst overlay = context?.overlay ?? false;\n\tconst width = context?.width ?? 260;\n\tconst body = context?.loading ? (\n\t\t<div\n\t\t\tclassName=\"flex flex-col gap-basalt-space-lg p-basalt-space-lg\"\n\t\t\trole=\"status\"\n\t\t\taria-live=\"polite\"\n\t\t>\n\t\t\t<SkeletonLine />\n\t\t\t<SkeletonLine />\n\t\t\t<SkeletonLine />\n\t\t</div>\n\t) : (\n\t\tchildren\n\t);\n\tconst resize =\n\t\tcontext && !collapsed ? (\n\t\t\t<SidebarResize side={side} width={context.width} onWidth={context.setWidth} />\n\t\t) : null;\n\tconst frameClass = cn(\n\t\tBASALT_UI_CLASS,\n\t\t\"relative flex shrink-0 flex-col bg-basalt-background text-basalt-base text-basalt-foreground\",\n\t\tOVERLAY_MOTION,\n\t\tclassName,\n\t);\n\tif (overlay && context) {\n\t\treturn (\n\t\t\t<Dialog open={!context.collapsed} onOpenChange={(open) => context.setCollapsed(!open)}>\n\t\t\t\t<DialogPortal>\n\t\t\t\t\t<DialogOverlay />\n\t\t\t\t\t<DialogPrimitive.Content\n\t\t\t\t\t\tdata-basalt-sidebar=\"\"\n\t\t\t\t\t\taria-label=\"Sidebar\"\n\t\t\t\t\t\tdata-overlay=\"\"\n\t\t\t\t\t\tdata-side={side}\n\t\t\t\t\t\taria-busy={context.loading || undefined}\n\t\t\t\t\t\tonMouseEnter={onMouseEnter}\n\t\t\t\t\t\tonMouseLeave={onMouseLeave}\n\t\t\t\t\t\tref={(node) => {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tnode &&\n\t\t\t\t\t\t\t\tdocument.activeElement instanceof HTMLElement &&\n\t\t\t\t\t\t\t\t!node.contains(document.activeElement)\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tcontext.lastFocusRef.current = document.activeElement;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonOpenAutoFocus={(event) => {\n\t\t\t\t\t\t\tconst from = \"relatedTarget\" in event ? event.relatedTarget : null;\n\t\t\t\t\t\t\tif (from instanceof HTMLElement) {\n\t\t\t\t\t\t\t\tcontext.lastFocusRef.current = from;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonCloseAutoFocus={(event) => {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tcontext.lastFocusRef.current?.focus();\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\tframeClass,\n\t\t\t\t\t\t\tOVERLAY_LAYER,\n\t\t\t\t\t\t\t\"fixed inset-y-0 overflow-hidden shadow-md\",\n\t\t\t\t\t\t\tside === \"right\" ? \"right-0\" : \"left-0\",\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tstyle={{ width, ...style }}\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t>\n\t\t\t\t\t\t{body}\n\t\t\t\t\t\t{resize}\n\t\t\t\t\t</DialogPrimitive.Content>\n\t\t\t\t</DialogPortal>\n\t\t\t</Dialog>\n\t\t);\n\t}\n\treturn (\n\t\t<aside\n\t\t\tdata-basalt-sidebar=\"\"\n\t\t\tdata-collapsed={collapsed ? \"\" : undefined}\n\t\t\tdata-side={side}\n\t\t\taria-busy={context?.loading || undefined}\n\t\t\tonMouseEnter={(event) => {\n\t\t\t\tif (context?.peek && context.collapsed) {\n\t\t\t\t\tcontext.setPeeking(true);\n\t\t\t\t}\n\t\t\t\tonMouseEnter?.(event);\n\t\t\t}}\n\t\t\tonMouseLeave={(event) => {\n\t\t\t\tif (context?.peek) {\n\t\t\t\t\tcontext.setPeeking(false);\n\t\t\t\t}\n\t\t\t\tonMouseLeave?.(event);\n\t\t\t}}\n\t\t\tclassName={cn(\n\t\t\t\tframeClass,\n\t\t\t\t\"sticky overflow-hidden transition-[width] basalt-motion duration-basalt-normal ease-basalt\",\n\t\t\t\tside === \"right\" ? \"order-last\" : undefined,\n\t\t\t\tcollapsed && \"w-basalt-rail\",\n\t\t\t)}\n\t\t\tstyle={!collapsed ? { width, ...style } : style}\n\t\t\t{...props}\n\t\t>\n\t\t\t{body}\n\t\t\t{resize}\n\t\t</aside>\n\t);\n}\n\nconst SIDEBAR_ROW_CLASS =\n\t\"min-h-[calc(var(--basalt-line-row)+2*var(--basalt-space-lg))] py-basalt-space-lg\";\n\nexport interface SidebarHeaderProps extends HTMLAttributes<HTMLDivElement> {}\n\nexport function SidebarHeader({ className, ...props }: SidebarHeaderProps) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-header\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex h-basalt-14 shrink-0 items-center gap-basalt-row-gap px-basalt-nav-inset\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * Props for `SidebarSearch`. Renders a native `<button>` element and accepts all standard button HTML attributes and click handlers.\n */\nexport interface SidebarSearchProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n\t/**\n\t * Shortcut key display label rendered inside the trailing kbd tag. Note: this is a visual label only and does not register a global keyboard shortcut.\n\t * @default \"⌘K\"\n\t */\n\tshortcut?: string;\n}\n\nexport function SidebarSearch({\n\tshortcut = \"⌘K\",\n\tclassName,\n\tchildren,\n\t...props\n}: SidebarSearchProps) {\n\treturn (\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\tclassName={cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\tNAV_ROW_CLASS,\n\t\t\t\tSIDEBAR_ROW_CLASS,\n\t\t\t\t\"w-full cursor-pointer bg-basalt-secondary transition-colors basalt-motion hover:bg-basalt-hover\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<Search className=\"h-basalt-4 w-basalt-4 text-basalt-muted-foreground\" strokeWidth={1.5} />\n\t\t\t<span className=\"flex-1 text-left text-basalt-base text-basalt-muted-foreground\">\n\t\t\t\t{children}\n\t\t\t</span>\n\t\t\t<kbd className=\"pointer-events-none hidden rounded-basalt-sm border border-basalt-border bg-basalt-card px-basalt-space-md py-basalt-space-xs text-basalt-sm font-medium text-basalt-muted-foreground sm:inline-block\">\n\t\t\t\t{shortcut}\n\t\t\t</kbd>\n\t\t</button>\n\t);\n}\n\nexport interface SidebarNavProps extends HTMLAttributes<HTMLElement> {}\n\nexport function SidebarNav({ className, ...props }: SidebarNavProps) {\n\tconst highlightRef = useHoverHighlight(undefined, { restoreOnPointerLeave: false });\n\treturn (\n\t\t<nav\n\t\t\tref={highlightRef}\n\t\t\tdata-slot=\"sidebar-nav\"\n\t\t\tclassName={cn(\n\t\t\t\tNAV_LIST_CLASS,\n\t\t\t\t\"min-h-0 flex-1 flex-col overflow-y-auto overscroll-y-contain\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport interface SidebarPartitionProps extends HTMLAttributes<HTMLParagraphElement> {}\n\nexport function SidebarPartition({ className, ...props }: SidebarPartitionProps) {\n\treturn (\n\t\t<p\n\t\t\tdata-slot=\"sidebar-partition\"\n\t\t\tclassName={cn(\n\t\t\t\t\"shrink-0 px-basalt-row-x pt-basalt-layout pb-basalt-space-lg text-basalt-sm font-semibold tracking-wide text-basalt-foreground uppercase\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport type SidebarItemProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n\t/**\n\t * Mark the item as the current page.\n\t * @default false\n\t */\n\tactive?: boolean;\n};\n\nexport function SidebarItem({ active = false, className, ...props }: SidebarItemProps) {\n\treturn (\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\taria-current={active ? \"page\" : undefined}\n\t\t\tdata-basalt-hover-item=\"\"\n\t\t\tdata-sidebar-row=\"\"\n\t\t\tdata-hover-selected={active}\n\t\t\tclassName={cn(NAV_ITEM_CLASS, SIDEBAR_ROW_CLASS, \"w-full\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * Props for `SidebarIconItem`. Accepts standard button HTML attributes. The caller is responsible for providing accessible labeling via `aria-label` or `aria-labelledby` as icon buttons do not automatically generate accessible names.\n */\nexport interface SidebarIconItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n\t/**\n\t * Mark the icon button as active page item.\n\t * @default false\n\t */\n\tactive?: boolean;\n}\n\nexport function SidebarIconItem({ active = false, className, ...props }: SidebarIconItemProps) {\n\treturn (\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\taria-current={active ? \"page\" : undefined}\n\t\t\tdata-basalt-hover-item=\"\"\n\t\t\tdata-sidebar-row=\"\"\n\t\t\tdata-hover-selected={active}\n\t\t\tclassName={cn(\n\t\t\t\tNAV_ITEM_CLASS,\n\t\t\t\tSIDEBAR_ROW_CLASS,\n\t\t\t\t\"relative w-basalt-control justify-center\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\n/**\n * Props for `SidebarGroup`. Uncontrolled collapsible section that accepts only the documented properties. It does not accept controlled open props or arbitrary DOM attributes.\n */\nexport interface SidebarGroupProps {\n\t/**\n\t * Section label displayed on the group trigger.\n\t */\n\tlabel: ReactNode;\n\t/**\n\t * Uncontrolled initial open state for the collapsible group.\n\t * @default true\n\t */\n\tdefaultOpen?: boolean;\n\t/**\n\t * Navigation items rendered inside the group.\n\t */\n\tchildren: ReactNode;\n}\n\nexport function SidebarGroup({ label, defaultOpen = true, children }: SidebarGroupProps) {\n\tconst [open, setOpen] = useState(defaultOpen);\n\treturn (\n\t\t<Collapsible\n\t\t\topen={open}\n\t\t\tonOpenChange={setOpen}\n\t\t\tdata-slot=\"sidebar-group\"\n\t\t\tclassName=\"shrink-0 pt-basalt-layout-sm\"\n\t\t>\n\t\t\t<CollapsibleTrigger asChild>\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tdata-slot=\"sidebar-group-label\"\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"flex w-full cursor-pointer items-center justify-between gap-basalt-row-gap rounded-basalt-md px-basalt-row-x py-basalt-space-lg text-left text-basalt-sm font-semibold leading-basalt-row tracking-wide text-basalt-muted-foreground uppercase transition-colors basalt-motion hover:text-basalt-foreground\",\n\t\t\t\t\t\tFOCUS_INSET,\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<span className=\"min-w-0 truncate\">{label}</span>\n\t\t\t\t\t<ChevronUp\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"h-basalt-4 w-basalt-4 text-basalt-muted-foreground transition-transform basalt-motion duration-basalt-normal\",\n\t\t\t\t\t\t\tOVERLAY_MOTION,\n\t\t\t\t\t\t\t!open && \"rotate-180\",\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tstrokeWidth={1.5}\n\t\t\t\t\t/>\n\t\t\t\t</button>\n\t\t\t</CollapsibleTrigger>\n\t\t\t<CollapsibleContent unstyled>\n\t\t\t\t<div className=\"flex flex-col gap-basalt-nav-gap pt-basalt-nav-gap\">{children}</div>\n\t\t\t</CollapsibleContent>\n\t\t</Collapsible>\n\t);\n}\n\nexport interface SidebarFooterProps extends HTMLAttributes<HTMLDivElement> {}\n\nexport function SidebarFooter({ className, ...props }: SidebarFooterProps) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-footer\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex shrink-0 flex-col gap-basalt-content-gap px-basalt-layout pt-basalt-space-lg pb-basalt-layout\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport interface SidebarUserProps {\n\t/**\n\t * User display name.\n\t */\n\tname: ReactNode;\n\t/**\n\t * Optional user email or secondary text.\n\t */\n\temail?: ReactNode;\n\t/**\n\t * Avatar element slot.\n\t */\n\tavatar?: ReactNode;\n\t/**\n\t * Trailing action slot (e.g. settings or logout button).\n\t */\n\taction?: ReactNode;\n\t/**\n\t * Additional CSS class name.\n\t */\n\tclassName?: string;\n}\n\nexport function SidebarUser({ name, email, avatar, action, className }: SidebarUserProps) {\n\treturn (\n\t\t<div className={cn(\"flex items-center gap-basalt-space-lg\", className)}>\n\t\t\t{avatar}\n\t\t\t<div className=\"min-w-0 flex-1\">\n\t\t\t\t<p className=\"truncate text-basalt-base font-medium text-basalt-foreground\">{name}</p>\n\t\t\t\t{email ? (\n\t\t\t\t\t<p className=\"truncate text-basalt-sm text-basalt-muted-foreground\">{email}</p>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t\t{action}\n\t\t</div>\n\t);\n}\n\nexport interface ContentIslandProps extends HTMLAttributes<HTMLDivElement> {\n\t/** Mobile surface treatment; desktop remains an inset L1 island. @default \"inset\" */\n\tmobileSurface?: \"inset\" | \"edge-to-edge\";\n}\n\nexport function ContentIsland({\n\tmobileSurface = \"inset\",\n\tclassName,\n\t...props\n}: ContentIslandProps) {\n\treturn (\n\t\t<div\n\t\t\tdata-basalt-surface-root=\"\"\n\t\t\tdata-basalt-island={mobileSurface}\n\t\t\tclassName={cn(\n\t\t\t\t\"min-h-0 min-w-0 flex-1 bg-basalt-card text-basalt-card-foreground md:rounded-basalt-island md:p-basalt-layout-lg lg:px-basalt-layout-xl\",\n\t\t\t\tmobileSurface === \"inset\"\n\t\t\t\t\t? \"rounded-basalt-lg p-basalt-layout shadow-sm ring-1 ring-basalt-border/40\"\n\t\t\t\t\t: \"md:shadow-sm md:ring-1 md:ring-basalt-border/40\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"file":"sidebar.js","names":["DialogPrimitive","SidebarContext","createContext","useSidebar","context","useContext","SidebarProvider","uncontrolled","setUncontrolled","useState","defaultCollapsed","peeking","setPeeking","width","setWidthState","clampSidebarWidth","defaultWidth","setWidth","useCallback","next","lastFocusRef","useRef","prevCollapsed","collapsed","prevOverlay","overlay","resolved","setCollapsed","onCollapsedChange","SidebarResize","cn","side","event","startX","startWidth","target","onMove","delta","move","onUp","dir","Sidebar","collapsedProp","props","body","SkeletonLine","children","resize","resizable","frameClass","BASALT_UI_CLASS","OVERLAY_MOTION","className","Dialog","open","DialogPortal","DialogOverlay","node","from","OVERLAY_LAYER","style","onMouseEnter","onMouseLeave","SIDEBAR_ROW_CLASS","SidebarHeader","SidebarBrand","logo","name","version","action","SidebarToggle","ariaLabel","label","expandLabel","collapseLabel","TooltipProvider","Tooltip","TooltipTrigger","Button","onClick","PanelLeft","TooltipContent","SidebarSearch","NAV_ROW_CLASS","Search","shortcut","SidebarNav","highlightRef","useHoverHighlight","NAV_LIST_CLASS","SidebarPartition","rejectDisabledAsChild","SidebarItem","rowClass","NAV_ITEM_CLASS","_className","linkProps","Link","active","buttonProps","sharedProps","asChild","Slot","SidebarIconItem","SidebarGroup","setOpen","defaultOpen","Collapsible","CollapsibleTrigger","FOCUS_INSET","ChevronUp","CollapsibleContent","SidebarFooter","SidebarUser","avatar","email","ContentIsland","mobileSurface"],"sources":["../../src/components/sidebar.tsx"],"sourcesContent":["import * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { ChevronUp, PanelLeft, Search } from \"lucide-react\";\nimport {\n\ttype AnchorHTMLAttributes,\n\ttype ButtonHTMLAttributes,\n\tcreateContext,\n\ttype HTMLAttributes,\n\ttype ReactNode,\n\ttype PointerEvent as ReactPointerEvent,\n\ttype RefObject,\n\tuseCallback,\n\tuseContext,\n\tuseLayoutEffect,\n\tuseRef,\n\tuseState,\n} from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { NAV_ITEM_CLASS, NAV_LIST_CLASS, NAV_ROW_CLASS } from \"../utils/navigation\";\nimport { useHoverHighlight } from \"../utils/use-hover-highlight\";\nimport { Button, type ButtonProps } from \"./button\";\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from \"./collapsible\";\nimport { Dialog, DialogOverlay, DialogPortal } from \"./dialog\";\nimport { Link } from \"./link\";\nimport { FOCUS_INSET, OVERLAY_LAYER, OVERLAY_MOTION } from \"./overlay\";\nimport { SkeletonLine } from \"./skeleton-line\";\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from \"./tooltip\";\n\nexport type SidebarSide = \"left\" | \"right\";\n\nexport interface SidebarContextValue {\n\t/**\n\t * Whether the sidebar is currently collapsed.\n\t */\n\tcollapsed: boolean;\n\t/**\n\t * Callback to update the collapsed state.\n\t */\n\tsetCollapsed: (next: boolean) => void;\n\t/**\n\t * Which edge the sidebar occupies.\n\t */\n\tside: SidebarSide;\n\t/**\n\t * Whether the sidebar is currently displaying a loading skeleton.\n\t */\n\tloading: boolean;\n\t/**\n\t * Whether the sidebar rail expands on pointer hover.\n\t */\n\tpeek: boolean;\n\t/**\n\t * Whether the sidebar is actively hovering in peek preview mode.\n\t */\n\tpeeking: boolean;\n\t/**\n\t * Callback to update the peek preview state.\n\t */\n\tsetPeeking: (next: boolean) => void;\n\t/**\n\t * Whether the sidebar is rendering as a modal overlay drawer instead of in-flow layout chrome.\n\t */\n\toverlay: boolean;\n\t/**\n\t * Current expanded width in pixels, clamped between 180 and 400.\n\t */\n\twidth: number;\n\t/**\n\t * Callback to update the sidebar width. Value is clamped between 180 and 400 pixels.\n\t */\n\tsetWidth: (next: number) => void;\n\t/**\n\t * Reference to the last active element that held focus before opening the sidebar drawer.\n\t */\n\tlastFocusRef: RefObject<HTMLElement | null>;\n}\n\nconst SidebarContext = createContext<SidebarContextValue | null>(null);\n\n/**\n * Accesses the sidebar context value. Must be used within a `SidebarProvider`; throws an error if called outside.\n * Returns the active sidebar state and control callbacks.\n */\nexport function useSidebar(): SidebarContextValue {\n\tconst context = useContext(SidebarContext);\n\tif (!context) {\n\t\tthrow new Error(\"useSidebar must be used within SidebarProvider\");\n\t}\n\treturn context;\n}\n\nexport type SidebarProviderProps = {\n\t/**\n\t * The controlled collapsed state.\n\t */\n\tcollapsed?: boolean;\n\t/**\n\t * The uncontrolled initial collapsed state.\n\t * @default false\n\t */\n\tdefaultCollapsed?: boolean;\n\t/**\n\t * Called when the collapsed state changes.\n\t */\n\tonCollapsedChange?: (collapsed: boolean) => void;\n\t/**\n\t * Which edge the sidebar occupies.\n\t * @default left\n\t */\n\tside?: SidebarSide;\n\t/**\n\t * Replace the nav with a loading skeleton.\n\t * @default false\n\t */\n\tloading?: boolean;\n\t/**\n\t * Expand the collapsed rail on hover.\n\t * @default false\n\t */\n\tpeek?: boolean;\n\t/**\n\t * Render as an overlay instead of in-flow chrome.\n\t * @default false\n\t */\n\toverlay?: boolean;\n\t/**\n\t * Initial expanded width in pixels, clamped between 180 and 400.\n\t * @default 260\n\t */\n\tdefaultWidth?: number;\n\t/**\n\t * Sidebar chrome and page content.\n\t */\n\tchildren: ReactNode;\n};\n\nexport function SidebarProvider({\n\tcollapsed,\n\tdefaultCollapsed = false,\n\tonCollapsedChange,\n\tside = \"left\",\n\tloading = false,\n\tpeek = false,\n\toverlay = false,\n\tdefaultWidth = 260,\n\tchildren,\n}: SidebarProviderProps) {\n\tconst [uncontrolled, setUncontrolled] = useState(defaultCollapsed);\n\tconst [peeking, setPeeking] = useState(false);\n\tconst [width, setWidthState] = useState(() => clampSidebarWidth(defaultWidth));\n\tconst setWidth = useCallback((next: number) => {\n\t\tsetWidthState(clampSidebarWidth(next));\n\t}, []);\n\tconst lastFocusRef = useRef<HTMLElement | null>(null);\n\tconst prevCollapsed = useRef(collapsed ?? defaultCollapsed);\n\tconst prevOverlay = useRef(overlay);\n\tconst resolved = collapsed ?? uncontrolled;\n\tuseLayoutEffect(() => {\n\t\tif (\n\t\t\toverlay &&\n\t\t\t!resolved &&\n\t\t\t(prevCollapsed.current || !prevOverlay.current) &&\n\t\t\tdocument.activeElement instanceof HTMLElement\n\t\t) {\n\t\t\tlastFocusRef.current = document.activeElement;\n\t\t}\n\t\tprevCollapsed.current = resolved;\n\t\tprevOverlay.current = overlay;\n\t});\n\tconst setCollapsed = useCallback(\n\t\t(next: boolean) => {\n\t\t\tif (!next && document.activeElement instanceof HTMLElement) {\n\t\t\t\tlastFocusRef.current = document.activeElement;\n\t\t\t}\n\t\t\tif (collapsed === undefined) {\n\t\t\t\tsetUncontrolled(next);\n\t\t\t}\n\t\t\tonCollapsedChange?.(next);\n\t\t},\n\t\t[collapsed, onCollapsedChange],\n\t);\n\treturn (\n\t\t<SidebarContext.Provider\n\t\t\tvalue={{\n\t\t\t\tcollapsed: resolved,\n\t\t\t\tsetCollapsed,\n\t\t\t\tside,\n\t\t\t\tloading,\n\t\t\t\tpeek,\n\t\t\t\tpeeking,\n\t\t\t\tsetPeeking,\n\t\t\t\toverlay,\n\t\t\t\twidth,\n\t\t\t\tsetWidth,\n\t\t\t\tlastFocusRef,\n\t\t\t}}\n\t\t>\n\t\t\t{children}\n\t\t</SidebarContext.Provider>\n\t);\n}\n\nexport type SidebarProps = HTMLAttributes<HTMLElement> & {\n\t/**\n\t * Collapse the rail when no provider is present.\n\t * @default false\n\t */\n\tcollapsed?: boolean;\n\t/**\n\t * Show the resize handle for an expanded provider-backed sidebar.\n\t * @default true\n\t */\n\tresizable?: boolean;\n};\n\nfunction clampSidebarWidth(next: number) {\n\treturn Math.min(400, Math.max(180, next));\n}\n\nfunction SidebarResize({\n\tside,\n\twidth,\n\tonWidth,\n}: {\n\tside: SidebarSide;\n\twidth: number;\n\tonWidth: (next: number) => void;\n}) {\n\tconst onPointerDown = (event: ReactPointerEvent<HTMLDivElement>) => {\n\t\tevent.preventDefault();\n\t\tevent.currentTarget.setPointerCapture(event.pointerId);\n\t\tconst startX = event.clientX;\n\t\tconst startWidth = width;\n\t\tconst target = event.currentTarget;\n\t\tconst onMove = (move: PointerEvent) => {\n\t\t\tconst delta = side === \"right\" ? startX - move.clientX : move.clientX - startX;\n\t\t\tonWidth(clampSidebarWidth(startWidth + delta));\n\t\t};\n\t\tconst onUp = () => {\n\t\t\ttarget.removeEventListener(\"pointermove\", onMove);\n\t\t\ttarget.removeEventListener(\"pointerup\", onUp);\n\t\t\ttarget.removeEventListener(\"pointercancel\", onUp);\n\t\t};\n\t\ttarget.addEventListener(\"pointermove\", onMove);\n\t\ttarget.addEventListener(\"pointerup\", onUp);\n\t\ttarget.addEventListener(\"pointercancel\", onUp);\n\t};\n\treturn (\n\t\t<div\n\t\t\trole=\"separator\"\n\t\t\taria-orientation=\"vertical\"\n\t\t\taria-valuenow={width}\n\t\t\taria-valuemin={180}\n\t\t\taria-valuemax={400}\n\t\t\taria-label=\"Resize sidebar\"\n\t\t\ttabIndex={0}\n\t\t\tclassName={cn(\n\t\t\t\t\"absolute top-0 h-full w-basalt-1 cursor-col-resize bg-transparent\",\n\t\t\t\tside === \"right\" ? \"left-0\" : \"right-0\",\n\t\t\t)}\n\t\t\tonPointerDown={onPointerDown}\n\t\t\tonKeyDown={(event) => {\n\t\t\t\tif (event.key !== \"ArrowLeft\" && event.key !== \"ArrowRight\") {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst dir = event.key === \"ArrowRight\" ? 1 : -1;\n\t\t\t\tconst delta = side === \"right\" ? -dir * 8 : dir * 8;\n\t\t\t\tonWidth(clampSidebarWidth(width + delta));\n\t\t\t}}\n\t\t/>\n\t);\n}\n\nexport function Sidebar({\n\tcollapsed: collapsedProp,\n\tresizable = true,\n\tclassName,\n\tchildren,\n\tonMouseEnter,\n\tonMouseLeave,\n\tstyle,\n\t...props\n}: SidebarProps) {\n\tconst context = useContext(SidebarContext);\n\tconst collapsed = context\n\t\t? context.collapsed && !(context.peek && context.peeking)\n\t\t: (collapsedProp ?? false);\n\tconst side = context?.side ?? \"left\";\n\tconst overlay = context?.overlay ?? false;\n\tconst width = context?.width ?? 260;\n\tconst body = context?.loading ? (\n\t\t<div\n\t\t\tclassName=\"flex flex-col gap-basalt-space-lg px-basalt-layout-lg py-basalt-space-lg\"\n\t\t\trole=\"status\"\n\t\t\taria-live=\"polite\"\n\t\t>\n\t\t\t<SkeletonLine />\n\t\t\t<SkeletonLine />\n\t\t\t<SkeletonLine />\n\t\t</div>\n\t) : (\n\t\tchildren\n\t);\n\tconst resize =\n\t\tcontext && resizable && !collapsed ? (\n\t\t\t<SidebarResize side={side} width={context.width} onWidth={context.setWidth} />\n\t\t) : null;\n\tconst frameClass = cn(\n\t\tBASALT_UI_CLASS,\n\t\t\"relative flex shrink-0 flex-col bg-basalt-background text-basalt-base text-basalt-foreground\",\n\t\tOVERLAY_MOTION,\n\t\tclassName,\n\t);\n\tif (overlay && context) {\n\t\treturn (\n\t\t\t<Dialog open={!context.collapsed} onOpenChange={(open) => context.setCollapsed(!open)}>\n\t\t\t\t<DialogPortal>\n\t\t\t\t\t<DialogOverlay />\n\t\t\t\t\t<DialogPrimitive.Content\n\t\t\t\t\t\tdata-basalt-sidebar=\"\"\n\t\t\t\t\t\taria-label=\"Sidebar\"\n\t\t\t\t\t\tdata-overlay=\"\"\n\t\t\t\t\t\tdata-side={side}\n\t\t\t\t\t\taria-busy={context.loading || undefined}\n\t\t\t\t\t\tonMouseEnter={onMouseEnter}\n\t\t\t\t\t\tonMouseLeave={onMouseLeave}\n\t\t\t\t\t\tref={(node) => {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tnode &&\n\t\t\t\t\t\t\t\tdocument.activeElement instanceof HTMLElement &&\n\t\t\t\t\t\t\t\t!node.contains(document.activeElement)\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tcontext.lastFocusRef.current = document.activeElement;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonOpenAutoFocus={(event) => {\n\t\t\t\t\t\t\tconst from = \"relatedTarget\" in event ? event.relatedTarget : null;\n\t\t\t\t\t\t\tif (from instanceof HTMLElement) {\n\t\t\t\t\t\t\t\tcontext.lastFocusRef.current = from;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif (event.target instanceof HTMLElement) {\n\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\tevent.target.focus();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonCloseAutoFocus={(event) => {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tcontext.lastFocusRef.current?.focus();\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\tframeClass,\n\t\t\t\t\t\t\tOVERLAY_LAYER,\n\t\t\t\t\t\t\t\"fixed inset-y-0 overflow-hidden shadow-md\",\n\t\t\t\t\t\t\tside === \"right\" ? \"right-0\" : \"left-0\",\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tstyle={{ width, ...style }}\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t>\n\t\t\t\t\t\t{body}\n\t\t\t\t\t\t{resize}\n\t\t\t\t\t</DialogPrimitive.Content>\n\t\t\t\t</DialogPortal>\n\t\t\t</Dialog>\n\t\t);\n\t}\n\treturn (\n\t\t<aside\n\t\t\tdata-basalt-sidebar=\"\"\n\t\t\tdata-collapsed={collapsed ? \"\" : undefined}\n\t\t\tdata-side={side}\n\t\t\taria-busy={context?.loading || undefined}\n\t\t\tonMouseEnter={(event) => {\n\t\t\t\tif (context?.peek && context.collapsed) {\n\t\t\t\t\tcontext.setPeeking(true);\n\t\t\t\t}\n\t\t\t\tonMouseEnter?.(event);\n\t\t\t}}\n\t\t\tonMouseLeave={(event) => {\n\t\t\t\tif (context?.peek) {\n\t\t\t\t\tcontext.setPeeking(false);\n\t\t\t\t}\n\t\t\t\tonMouseLeave?.(event);\n\t\t\t}}\n\t\t\tclassName={cn(\n\t\t\t\tframeClass,\n\t\t\t\t\"sticky overflow-hidden transition-[width] basalt-motion duration-basalt-normal ease-basalt\",\n\t\t\t\tside === \"right\" ? \"order-last\" : undefined,\n\t\t\t\tcollapsed && \"w-basalt-rail\",\n\t\t\t)}\n\t\t\tstyle={!collapsed ? { width, ...style } : style}\n\t\t\t{...props}\n\t\t>\n\t\t\t{body}\n\t\t\t{resize}\n\t\t</aside>\n\t);\n}\n\nconst SIDEBAR_ROW_CLASS =\n\t\"min-h-[calc(var(--basalt-line-row)+2*var(--basalt-space-lg))] py-basalt-space-lg\";\n\nexport interface SidebarHeaderProps extends HTMLAttributes<HTMLDivElement> {}\n\nexport function SidebarHeader({ className, ...props }: SidebarHeaderProps) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-header\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex h-basalt-14 shrink-0 items-center gap-basalt-row-gap px-basalt-layout-lg\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport interface SidebarBrandProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n\t/** Brand mark rendered in the fixed collapsed-rail slot. */\n\tlogo: ReactNode;\n\t/** Product or workspace name. */\n\tname: ReactNode;\n\t/** Optional version or release metadata, rendered at the auxiliary type size. */\n\tversion?: ReactNode;\n\t/** Optional trailing action, conventionally a `SidebarToggle`. */\n\taction?: ReactNode;\n}\n\nexport function SidebarBrand({\n\tlogo,\n\tname,\n\tversion,\n\taction,\n\tclassName,\n\t...props\n}: SidebarBrandProps) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-brand\"\n\t\t\tclassName={cn(\n\t\t\t\t\"relative flex h-full min-w-0 flex-1 items-center gap-basalt-row-gap\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span\n\t\t\t\tdata-slot=\"sidebar-brand-logo\"\n\t\t\t\tclassName=\"flex w-basalt-sidebar-brand-slot shrink-0 items-center justify-center\"\n\t\t\t>\n\t\t\t\t{logo}\n\t\t\t</span>\n\t\t\t<div className=\"flex min-w-0 flex-1 items-center gap-basalt-row-gap overflow-hidden whitespace-nowrap\">\n\t\t\t\t<span className=\"min-w-0 flex-1 truncate text-basalt-base font-semibold\">{name}</span>\n\t\t\t\t{version != null ? (\n\t\t\t\t\t<span className=\"shrink-0 text-basalt-sm text-basalt-muted-foreground\">{version}</span>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t\t{action ? (\n\t\t\t\t<div data-slot=\"sidebar-brand-action\" className=\"basalt-sidebar-brand-action\">\n\t\t\t\t\t{action}\n\t\t\t\t</div>\n\t\t\t) : null}\n\t\t</div>\n\t);\n}\n\nexport interface SidebarToggleProps\n\textends Omit<ButtonProps, \"children\" | \"size\" | \"aria-expanded\"> {\n\t/** Accessible label while the sidebar is collapsed. @default \"Expand sidebar\" */\n\texpandLabel?: string;\n\t/** Accessible label while the sidebar is expanded. @default \"Collapse sidebar\" */\n\tcollapseLabel?: string;\n}\n\nexport function SidebarToggle({\n\t\"aria-label\": ariaLabel,\n\texpandLabel = \"Expand sidebar\",\n\tcollapseLabel = \"Collapse sidebar\",\n\tonClick,\n\tvariant = \"ghost\",\n\t...props\n}: SidebarToggleProps) {\n\tconst { collapsed, setCollapsed, side } = useSidebar();\n\tconst label = ariaLabel ?? (collapsed ? expandLabel : collapseLabel);\n\treturn (\n\t\t<TooltipProvider>\n\t\t\t<Tooltip>\n\t\t\t\t<TooltipTrigger asChild>\n\t\t\t\t\t<Button\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t\tvariant={variant}\n\t\t\t\t\t\tsize=\"icon-sm\"\n\t\t\t\t\t\taria-expanded={!collapsed}\n\t\t\t\t\t\taria-label={label}\n\t\t\t\t\t\tonClick={(event) => {\n\t\t\t\t\t\t\tonClick?.(event);\n\t\t\t\t\t\t\tif (!event.defaultPrevented) setCollapsed(!collapsed);\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<PanelLeft aria-hidden=\"true\" />\n\t\t\t\t\t</Button>\n\t\t\t\t</TooltipTrigger>\n\t\t\t\t<TooltipContent side={side === \"right\" ? \"left\" : \"right\"}>{label}</TooltipContent>\n\t\t\t</Tooltip>\n\t\t</TooltipProvider>\n\t);\n}\n\n/**\n * Props for `SidebarSearch`. Renders a native `<button>` element and accepts all standard button HTML attributes and click handlers.\n */\nexport interface SidebarSearchProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n\t/**\n\t * Shortcut key display label rendered inside the trailing kbd tag. Note: this is a visual label only and does not register a global keyboard shortcut.\n\t * @default \"⌘K\"\n\t */\n\tshortcut?: string;\n}\n\nexport function SidebarSearch({\n\tshortcut = \"⌘K\",\n\tclassName,\n\tchildren,\n\t...props\n}: SidebarSearchProps) {\n\treturn (\n\t\t<button\n\t\t\ttype=\"button\"\n\t\t\tclassName={cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\tNAV_ROW_CLASS,\n\t\t\t\tSIDEBAR_ROW_CLASS,\n\t\t\t\t\"w-full cursor-pointer bg-basalt-secondary transition-colors basalt-motion hover:bg-basalt-hover\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<Search className=\"h-basalt-4 w-basalt-4 text-basalt-muted-foreground\" strokeWidth={1.5} />\n\t\t\t<span className=\"flex-1 text-left text-basalt-base text-basalt-muted-foreground\">\n\t\t\t\t{children}\n\t\t\t</span>\n\t\t\t<kbd className=\"pointer-events-none hidden rounded-basalt-sm border border-basalt-border bg-basalt-card px-basalt-space-md py-basalt-space-xs text-basalt-sm font-medium text-basalt-muted-foreground sm:inline-block\">\n\t\t\t\t{shortcut}\n\t\t\t</kbd>\n\t\t</button>\n\t);\n}\n\nexport interface SidebarNavProps extends HTMLAttributes<HTMLElement> {}\n\nexport function SidebarNav({ className, ...props }: SidebarNavProps) {\n\tconst highlightRef = useHoverHighlight(undefined, { restoreOnPointerLeave: false });\n\treturn (\n\t\t<nav\n\t\t\tref={highlightRef}\n\t\t\tdata-slot=\"sidebar-nav\"\n\t\t\tclassName={cn(\n\t\t\t\tNAV_LIST_CLASS,\n\t\t\t\t\"basalt-sidebar-nav min-h-0 flex-1 flex-col overflow-y-auto overscroll-y-contain\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport interface SidebarPartitionProps extends HTMLAttributes<HTMLParagraphElement> {}\n\nexport function SidebarPartition({ className, ...props }: SidebarPartitionProps) {\n\treturn (\n\t\t<p\n\t\t\tdata-slot=\"sidebar-partition\"\n\t\t\tclassName={cn(\n\t\t\t\t\"shrink-0 px-basalt-row-x pt-basalt-layout pb-basalt-space-lg text-basalt-sm font-semibold tracking-wide text-basalt-foreground uppercase\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\ntype SidebarRowProps = {\n\t/** Mark the item as the current page. @default false */\n\tactive?: boolean;\n\t/** Item content. */\n\tchildren?: ReactNode;\n\t/** Additional CSS classes. */\n\tclassName?: string;\n};\n\ntype SidebarButtonRowProps = Omit<\n\tButtonHTMLAttributes<HTMLButtonElement>,\n\t\"children\" | \"className\" | \"disabled\"\n> &\n\tSidebarRowProps & {\n\t\tasChild?: false;\n\t\tdisabled?: boolean;\n\t\thref?: never;\n\t};\n\ntype SidebarSlotRowProps = Omit<\n\tButtonHTMLAttributes<HTMLButtonElement>,\n\t\"children\" | \"className\" | \"disabled\"\n> &\n\tSidebarRowProps & {\n\t\t/** Render the item onto its single enabled child element. */\n\t\tasChild: true;\n\t\tdisabled?: never;\n\t\thref?: never;\n\t};\n\ntype SidebarLinkRowProps = Omit<\n\tAnchorHTMLAttributes<HTMLAnchorElement>,\n\t\"children\" | \"className\" | \"href\"\n> &\n\tSidebarRowProps & {\n\t\t/** Application route interpreted by LinkProvider. */\n\t\thref: string;\n\t\tasChild?: never;\n\t};\n\nexport type SidebarItemProps = SidebarButtonRowProps | SidebarSlotRowProps | SidebarLinkRowProps;\n\nfunction rejectDisabledAsChild(props: { asChild?: boolean; disabled?: boolean }) {\n\tif (props.asChild && props.disabled) {\n\t\tthrow new Error(\"Sidebar asChild rows do not support disabled; use a native button row\");\n\t}\n}\n\nexport function SidebarItem(props: SidebarItemProps) {\n\trejectDisabledAsChild(props);\n\tconst rowClass = cn(\n\t\tNAV_ITEM_CLASS,\n\t\tSIDEBAR_ROW_CLASS,\n\t\t\"w-full text-inherit no-underline hover:no-underline\",\n\t\tprops.className,\n\t);\n\tif (typeof props.href === \"string\") {\n\t\tconst { href, active = false, children, className: _className, ...linkProps } = props;\n\t\treturn (\n\t\t\t<Link\n\t\t\t\t{...linkProps}\n\t\t\t\thref={href}\n\t\t\t\taria-current={active ? \"page\" : undefined}\n\t\t\t\tdata-basalt-hover-item=\"\"\n\t\t\t\tdata-sidebar-row=\"\"\n\t\t\t\tdata-hover-selected={active}\n\t\t\t\tclassName={rowClass}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</Link>\n\t\t);\n\t}\n\tconst {\n\t\tasChild = false,\n\t\ttype = \"button\",\n\t\tactive = false,\n\t\tchildren,\n\t\tclassName: _className,\n\t\t...buttonProps\n\t} = props;\n\tconst sharedProps = {\n\t\t\"aria-current\": active ? (\"page\" as const) : undefined,\n\t\t\"data-basalt-hover-item\": \"\",\n\t\t\"data-sidebar-row\": \"\",\n\t\t\"data-hover-selected\": active,\n\t\tclassName: rowClass,\n\t};\n\tif (asChild) {\n\t\treturn (\n\t\t\t<Slot {...buttonProps} {...sharedProps}>\n\t\t\t\t{children}\n\t\t\t</Slot>\n\t\t);\n\t}\n\treturn (\n\t\t<button {...buttonProps} type={type} {...sharedProps}>\n\t\t\t{children}\n\t\t</button>\n\t);\n}\n\nexport type SidebarIconItemProps =\n\t| SidebarButtonRowProps\n\t| SidebarSlotRowProps\n\t| SidebarLinkRowProps;\n\nexport function SidebarIconItem(props: SidebarIconItemProps) {\n\trejectDisabledAsChild(props);\n\tconst rowClass = cn(\n\t\tNAV_ITEM_CLASS,\n\t\tSIDEBAR_ROW_CLASS,\n\t\t\"relative w-basalt-control justify-center text-inherit no-underline hover:no-underline\",\n\t\tprops.className,\n\t);\n\tif (typeof props.href === \"string\") {\n\t\tconst { href, active = false, children, className: _className, ...linkProps } = props;\n\t\treturn (\n\t\t\t<Link\n\t\t\t\t{...linkProps}\n\t\t\t\thref={href}\n\t\t\t\taria-current={active ? \"page\" : undefined}\n\t\t\t\tdata-basalt-hover-item=\"\"\n\t\t\t\tdata-sidebar-row=\"\"\n\t\t\t\tdata-hover-selected={active}\n\t\t\t\tclassName={rowClass}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</Link>\n\t\t);\n\t}\n\tconst {\n\t\tasChild = false,\n\t\ttype = \"button\",\n\t\tactive = false,\n\t\tchildren,\n\t\tclassName: _className,\n\t\t...buttonProps\n\t} = props;\n\tconst sharedProps = {\n\t\t\"aria-current\": active ? (\"page\" as const) : undefined,\n\t\t\"data-basalt-hover-item\": \"\",\n\t\t\"data-sidebar-row\": \"\",\n\t\t\"data-hover-selected\": active,\n\t\tclassName: rowClass,\n\t};\n\tif (asChild) {\n\t\treturn (\n\t\t\t<Slot {...buttonProps} {...sharedProps}>\n\t\t\t\t{children}\n\t\t\t</Slot>\n\t\t);\n\t}\n\treturn (\n\t\t<button {...buttonProps} type={type} {...sharedProps}>\n\t\t\t{children}\n\t\t</button>\n\t);\n}\n\n/**\n * Props for `SidebarGroup`. Uncontrolled collapsible section that accepts only the documented properties. It does not accept controlled open props or arbitrary DOM attributes.\n */\nexport interface SidebarGroupProps {\n\t/**\n\t * Section label displayed on the group trigger.\n\t */\n\tlabel: ReactNode;\n\t/**\n\t * Uncontrolled initial open state for the collapsible group.\n\t * @default true\n\t */\n\tdefaultOpen?: boolean;\n\t/**\n\t * Navigation items rendered inside the group.\n\t */\n\tchildren: ReactNode;\n}\n\nexport function SidebarGroup({ label, defaultOpen = true, children }: SidebarGroupProps) {\n\tconst [open, setOpen] = useState(defaultOpen);\n\treturn (\n\t\t<Collapsible\n\t\t\topen={open}\n\t\t\tonOpenChange={setOpen}\n\t\t\tdata-slot=\"sidebar-group\"\n\t\t\tclassName=\"shrink-0 pt-basalt-layout-sm\"\n\t\t>\n\t\t\t<CollapsibleTrigger asChild>\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tdata-slot=\"sidebar-group-label\"\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"flex w-full cursor-pointer items-center justify-between gap-basalt-row-gap rounded-basalt-md px-basalt-row-x py-basalt-space-lg text-left text-basalt-sm font-semibold leading-basalt-row tracking-wide text-basalt-muted-foreground uppercase transition-colors basalt-motion hover:text-basalt-foreground\",\n\t\t\t\t\t\tFOCUS_INSET,\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<span className=\"min-w-0 truncate\">{label}</span>\n\t\t\t\t\t<ChevronUp\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"h-basalt-4 w-basalt-4 text-basalt-muted-foreground transition-transform basalt-motion duration-basalt-normal\",\n\t\t\t\t\t\t\tOVERLAY_MOTION,\n\t\t\t\t\t\t\t!open && \"rotate-180\",\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tstrokeWidth={1.5}\n\t\t\t\t\t/>\n\t\t\t\t</button>\n\t\t\t</CollapsibleTrigger>\n\t\t\t<CollapsibleContent unstyled>\n\t\t\t\t<div className=\"flex flex-col gap-basalt-nav-gap pt-basalt-nav-gap\">{children}</div>\n\t\t\t</CollapsibleContent>\n\t\t</Collapsible>\n\t);\n}\n\nexport interface SidebarFooterProps extends HTMLAttributes<HTMLDivElement> {}\n\nexport function SidebarFooter({ className, ...props }: SidebarFooterProps) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"sidebar-footer\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex shrink-0 flex-col gap-basalt-content-gap px-basalt-layout-lg pt-basalt-space-lg pb-basalt-layout\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport interface SidebarUserProps {\n\t/**\n\t * User display name.\n\t */\n\tname: ReactNode;\n\t/**\n\t * Optional user email or secondary text.\n\t */\n\temail?: ReactNode;\n\t/**\n\t * Avatar element slot.\n\t */\n\tavatar?: ReactNode;\n\t/**\n\t * Trailing action slot (e.g. settings or logout button).\n\t */\n\taction?: ReactNode;\n\t/**\n\t * Additional CSS class name.\n\t */\n\tclassName?: string;\n}\n\nexport function SidebarUser({ name, email, avatar, action, className }: SidebarUserProps) {\n\treturn (\n\t\t<div className={cn(\"flex items-center gap-basalt-space-lg\", className)}>\n\t\t\t{avatar}\n\t\t\t<div className=\"min-w-0 flex-1\">\n\t\t\t\t<p className=\"truncate text-basalt-base font-medium text-basalt-foreground\">{name}</p>\n\t\t\t\t{email ? (\n\t\t\t\t\t<p className=\"truncate text-basalt-sm text-basalt-muted-foreground\">{email}</p>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t\t{action}\n\t\t</div>\n\t);\n}\n\nexport interface ContentIslandProps extends HTMLAttributes<HTMLDivElement> {\n\t/** Mobile surface treatment; desktop remains an inset L1 island. @default \"inset\" */\n\tmobileSurface?: \"inset\" | \"edge-to-edge\";\n}\n\nexport function ContentIsland({\n\tmobileSurface = \"inset\",\n\tclassName,\n\t...props\n}: ContentIslandProps) {\n\treturn (\n\t\t<div\n\t\t\tdata-basalt-surface-root=\"\"\n\t\t\tdata-basalt-island={mobileSurface}\n\t\t\tclassName={cn(\n\t\t\t\t\"min-h-0 min-w-0 flex-1 bg-basalt-card text-basalt-card-foreground md:rounded-basalt-island md:p-basalt-layout-lg lg:px-basalt-layout-xl\",\n\t\t\t\tmobileSurface === \"inset\"\n\t\t\t\t\t? \"rounded-basalt-lg p-basalt-layout shadow-sm ring-1 ring-basalt-border/40\"\n\t\t\t\t\t: \"md:shadow-sm md:ring-1 md:ring-basalt-border/40\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n"],"mappings":"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"}