themelia-react-ui 2.0.6 → 3.0.0

package/dist/navigation-C0Be5C3i.js

@@ -0,0 +1,304 @@
+"use client";
+import { useStrings as e } from "./lib/strings.js";
+import { t } from "./utils-BVbAG2J6.js";
+import { c as n, o as r } from "./typography-C0dELqYV.js";
+import { t as i } from "./focus-recipes-DSkiUvUp.js";
+import { n as a } from "./buttons-pZVgPTZn.js";
+import { t as o } from "./structure-DElaQwwN.js";
+import { i as s } from "./tone-recipes-BPsRAvhu.js";
+import { t as c } from "./interaction-recipes-DmuS1ase.js";
+import { n as l } from "./number-NFWKIoiK.js";
+import { t as u } from "./badge-oGiXblW7.js";
+import { c as d, i as f, n as p, o as m, r as h, t as g, u as _ } from "./item-GJ9mvCcg.js";
+import { m as v } from "./hooks-DHfeSMAO.js";
+import { t as y } from "./normalize-layout-path-BmEgg6fu.js";
+import { Fragment as b, forwardRef as x, useCallback as S, useEffect as C, useId as w, useMemo as T, useRef as E, useState as D } from "react";
+import { Fragment as O, jsx as k, jsxs as A } from "react/jsx-runtime";
+import { Check as j, ChevronDown as M, ChevronRight as N } from "lucide-react";
+//#region src/components/layout/navigation/breadcrumb-progress/types.ts
+var P = {
+	stepLabel: "Step",
+	ofLabel: "of",
+	completedLabel: "completed",
+	upcomingLabel: "upcoming"
+};
+//#endregion
+//#region src/components/layout/navigation/breadcrumb-progress/breadcrumb-progress.tsx
+function F({ steps: i, currentIndex: o, onStepClick: u, className: d, strings: f }) {
+	let p = e(P, f), m = i.length;
+	if (m === 0) return null;
+	let h = Math.min(m, Math.max(1, o + 1)), g = p.formatProgress?.(h, m) ?? `${p.stepLabel} ${h} ${p.ofLabel} ${m}`;
+	return /* @__PURE__ */ A("div", {
+		className: t("breadcrumb-progress--component @container/breadcrumb-progress", "w-full", d),
+		children: [/* @__PURE__ */ A("div", {
+			className: "flex items-center justify-between mb-space-md",
+			children: [/* @__PURE__ */ k(r, { children: g }), /* @__PURE__ */ k(l, {
+				value: Math.round(h / m * 100),
+				scaled: !0,
+				size: "xs",
+				weight: "semibold"
+			})]
+		}), /* @__PURE__ */ k("ol", {
+			className: "m-0 list-none p-0 font-sans flex items-center gap-space-md",
+			children: i.map((e, r) => {
+				let l = r < o, d = r === o, f = !!u && (l || d), m = p.formatStepLabel?.(r + 1, e.label) ?? `${p.stepLabel} ${r + 1}: ${e.label}`, h = l ? p.completedLabel : d ? void 0 : p.upcomingLabel, g = h ? `${m}, ${h}` : m, _ = /* @__PURE__ */ A(O, { children: [/* @__PURE__ */ k(n, {
+					tag: "span",
+					size: "xs",
+					weight: "semibold",
+					"aria-hidden": "true",
+					className: t("flex size-6 shrink-0 items-center justify-center rounded-full tabular-nums", l && "bg-success text-success-foreground", d && `bg-primary text-primary-foreground ring-4 ${s.primary.halo}`, !l && !d && "bg-muted text-muted-foreground"),
+					children: l ? /* @__PURE__ */ k(j, { className: "size-icon-md" }) : r + 1
+				}), /* @__PURE__ */ A("div", {
+					"aria-hidden": "true",
+					className: "hidden min-w-0 @3xl/breadcrumb-progress:block",
+					children: [/* @__PURE__ */ k(n, {
+						weight: "semibold",
+						className: t(!d && !l && "text-muted-foreground"),
+						children: e.label
+					}), !!e.hint && /* @__PURE__ */ k(n, {
+						size: "xs",
+						type: "discrete",
+						className: "truncate",
+						children: e.hint
+					})]
+				})] });
+				return /* @__PURE__ */ A("li", {
+					"aria-current": d && !f ? "step" : void 0,
+					className: "flex min-w-0 flex-1 items-center gap-space-md",
+					children: [f ? /* @__PURE__ */ k(a, {
+						type: "button",
+						"aria-label": g,
+						"aria-current": d ? "step" : void 0,
+						onClick: () => u?.(e.id, r),
+						tone: "secondary",
+						buttonStyle: "ghost",
+						size: "md",
+						className: t("min-w-0 justify-start gap-space-md text-left transition-colors", c.rowHover),
+						children: _
+					}) : /* @__PURE__ */ A("span", {
+						className: "breadcrumb-progress--step box-border inline-flex min-h-action min-w-0 max-w-full items-center gap-space-md border border-transparent px-control text-left",
+						children: [/* @__PURE__ */ k(n, {
+							tag: "span",
+							size: "inherit",
+							className: "sr-only",
+							children: g
+						}), _]
+					}), r < i.length - 1 && /* @__PURE__ */ k("div", { className: t("h-px flex-1", l ? "bg-success" : "bg-border") })]
+				}, e.id);
+			})
+		})]
+	});
+}
+F.displayName = "BreadcrumbProgress";
+//#endregion
+//#region src/components/layout/navigation/category-nav/category-nav.tsx
+function I({ title: e, items: n, activeId: r, onSelect: i, className: a }) {
+	return /* @__PURE__ */ k("nav", {
+		"data-component": "category-nav",
+		"data-slot": "category-nav",
+		"aria-label": e,
+		className: t("category-nav--component min-w-0", a),
+		children: /* @__PURE__ */ k(m, {
+			role: "group",
+			children: n.map((e) => {
+				let n = e.icon, a = e.id === r;
+				return /* @__PURE__ */ A(g, {
+					render: i ? /* @__PURE__ */ k("button", { type: "button" }) : void 0,
+					onClick: i ? () => i(e.id) : void 0,
+					"aria-pressed": i ? a : void 0,
+					"aria-current": !i && a ? !0 : void 0,
+					"data-state": a ? "active" : "inactive",
+					className: t("rounded-radius px-space-md transition-colors", i && "cursor-pointer", a ? c.rowCurrent : i && c.rowHover),
+					children: [
+						!!n && /* @__PURE__ */ k(d, {
+							variant: "icon",
+							className: t(a ? "text-accent-foreground" : "text-muted-foreground"),
+							children: /* @__PURE__ */ k(n, {})
+						}),
+						/* @__PURE__ */ A(h, { children: [/* @__PURE__ */ k(_, {
+							bold: a,
+							children: e.label
+						}), !!e.hint && /* @__PURE__ */ k(f, {
+							clamp: 1,
+							children: e.hint
+						})] }),
+						/* @__PURE__ */ A(p, { children: [typeof e.count == "number" && /* @__PURE__ */ k(u, {
+							tone: "secondary",
+							className: "tabular-nums",
+							children: e.count
+						}), /* @__PURE__ */ k(N, { className: t("size-icon shrink-0 text-muted-foreground", a && "text-accent-foreground") })] })
+					]
+				}, e.id);
+			})
+		})
+	});
+}
+I.displayName = "CategoryNav";
+//#endregion
+//#region src/components/layout/navigation/section-nav/section-nav.tsx
+var L = { navigationLabel: "Section navigation" }, R = 150, z = x(function({ items: r, rootMargin: a = "-40% 0px -50% 0px", className: s, onSelect: l, updateHash: u = !1, strings: d, "aria-label": f, ...p }, m) {
+	let h = e(L, d), [g, _] = D(r[0]?.id ?? null), v = E(null), y = E(void 0), b = r.map((e) => e.id).join("\0"), x = S(() => {
+		clearTimeout(y.current), y.current = setTimeout(() => {
+			v.current && (v.current.settled = !0);
+		}, R);
+	}, []);
+	return C(() => {
+		let e = () => {
+			let e = v.current;
+			e && (e.settled ? v.current = null : x());
+		};
+		return document.addEventListener("scroll", e, {
+			capture: !0,
+			passive: !0
+		}), () => {
+			document.removeEventListener("scroll", e, { capture: !0 }), clearTimeout(y.current);
+		};
+	}, [x]), C(() => {
+		if (typeof IntersectionObserver > "u") return;
+		let e = b ? b.split("\0") : [], t = /* @__PURE__ */ new Map(), n = new IntersectionObserver((n) => {
+			if (n.forEach((e) => t.set(e.target.id, e.isIntersecting)), v.current) return;
+			let r = e.find((e) => t.get(e));
+			r && _(r);
+		}, {
+			rootMargin: a,
+			threshold: 0
+		});
+		return e.forEach((e) => {
+			let t = document.getElementById(e);
+			t && n.observe(t);
+		}), () => n.disconnect();
+	}, [b, a]), /* @__PURE__ */ k("nav", {
+		ref: m,
+		className: t("section-nav--component", s),
+		"aria-label": f ?? h.navigationLabel,
+		...p,
+		children: /* @__PURE__ */ k(o, {
+			gap: "2xs",
+			className: "section-nav--items",
+			children: r.map((e) => {
+				let r = e.icon, a = g === e.id;
+				return /* @__PURE__ */ A("a", {
+					href: `#${e.id}`,
+					"aria-current": a ? "location" : void 0,
+					onClick: (t) => {
+						t.preventDefault(), v.current = {
+							id: e.id,
+							settled: !1
+						}, x();
+						let n = document.getElementById(e.id);
+						if (n) {
+							let t = typeof window.matchMedia == "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+							n.scrollIntoView({
+								behavior: t ? "auto" : "smooth",
+								block: "start"
+							}), n.tabIndex < 0 && !n.hasAttribute("tabindex") && n.setAttribute("tabindex", "-1"), n.focus({ preventScroll: !0 }), u && window.history.replaceState(window.history.state, "", `#${e.id}`);
+						}
+						_(e.id), l?.(e.id);
+					},
+					className: t(`flex items-center gap-space-md rounded-radius px-space-md py-row-y transition-colors outline-none ${i.edge}`, a ? c.rowCurrent : `text-muted-foreground ${c.rowHover}`),
+					children: [!!r && /* @__PURE__ */ k(r, { className: "size-icon-md shrink-0" }), /* @__PURE__ */ k(n, {
+						tag: "span",
+						type: "inherit",
+						weight: a ? "semibold" : "medium",
+						children: e.label
+					})]
+				}, e.id);
+			})
+		})
+	});
+});
+z.displayName = "SectionNav";
+//#endregion
+//#region src/components/layout/navigation/side-nav.tsx
+var B = { navigationLabel: "Side navigation" };
+function V(e) {
+	return typeof e == "string" || typeof e == "number" || typeof e == "bigint";
+}
+var H = x(function({ items: s, groups: l, currentPath: d, renderLink: f, className: p, itemClassName: m, activeItemClassName: h, strings: g, "aria-label": _, ...x }, S) {
+	let C = e(B, g), E = v({ renderLink: f }), j = T(() => l ?? [{
+		id: "side-nav-items",
+		items: s ?? [],
+		collapsible: !1
+	}], [l, s]), N = T(() => {
+		if (d === void 0) return null;
+		let e = y(d);
+		return j.flatMap((e) => e.items.map((e) => y(e.href))).filter((t) => e === t || e.startsWith(`${t}/`)).sort((e, t) => t.length - e.length)[0] ?? null;
+	}, [d, j]), [P, F] = D(() => Object.fromEntries(j.map((e) => [e.id, !!e.defaultCollapsed]))), I = w(), L = (e) => F((t) => ({
+		...t,
+		[e]: !t[e]
+	})), R = h && h.length > 0 ? h : c.rowCurrent;
+	return /* @__PURE__ */ k("nav", {
+		ref: S,
+		"aria-label": _ ?? C.navigationLabel,
+		className: t("side-nav--component", p),
+		...x,
+		children: /* @__PURE__ */ k(o, {
+			gap: "xl",
+			className: "side-nav--groups",
+			children: j.map((e) => {
+				let s = e.collapsible !== !1 && P[e.id], l = !!e.label, d = !s, f = `${I}${e.id}`;
+				return /* @__PURE__ */ A(o, {
+					gap: "2xs",
+					className: "side-nav--group",
+					children: [!!l && (e.collapsible === !1 ? V(e.label) ? /* @__PURE__ */ k(r, {
+						tag: "div",
+						className: "px-row-x py-row-y",
+						children: e.label
+					}) : e.label : /* @__PURE__ */ A(a, {
+						type: "button",
+						tone: "secondary",
+						buttonStyle: "ghost",
+						size: "sm",
+						fullWidth: !0,
+						onClick: () => L(e.id),
+						className: t("h-auto min-h-action-sm justify-between px-row-x py-row-y", "text-muted-foreground", "hover:text-foreground transition-colors"),
+						"aria-expanded": !s,
+						"aria-controls": s ? void 0 : f,
+						children: [V(e.label) ? /* @__PURE__ */ k(r, {
+							tag: "span",
+							children: e.label
+						}) : e.label, /* @__PURE__ */ k(M, {
+							className: t("size-icon-md transition-transform", s && "-rotate-90"),
+							"aria-hidden": "true"
+						})]
+					})), !!d && /* @__PURE__ */ k(o, {
+						id: f,
+						gap: "2xs",
+						className: "side-nav--items",
+						children: e.items.map((e) => {
+							let r = e.icon, a = y(e.href) === N;
+							return /* @__PURE__ */ k(b, { children: E({
+								href: e.href,
+								active: a,
+								disabled: e.disabled,
+								"aria-current": a ? "page" : void 0,
+								className: t("group flex items-center gap-space-md rounded-radius px-row-x py-row-y", "text-sm transition-colors", `focus-visible:outline-none ${i.edge}`, c.rowHover, e.disabled && "pointer-events-none opacity-50", a && R, m),
+								children: /* @__PURE__ */ A(O, { children: [
+									!!r && /* @__PURE__ */ k(r, { className: t("size-icon shrink-0", a ? "text-accent-foreground" : "text-muted-foreground") }),
+									V(e.label) ? /* @__PURE__ */ k(n, {
+										tag: "span",
+										size: "inherit",
+										weight: "medium",
+										lineHeight: "tight",
+										className: "min-w-0 flex-1 truncate text-inherit",
+										children: e.label
+									}) : e.label,
+									!!e.badge && /* @__PURE__ */ k(u, {
+										tone: "secondary",
+										className: "shrink-0",
+										children: e.badge
+									})
+								] })
+							}) }, e.href);
+						})
+					})]
+				}, e.id);
+			})
+		})
+	});
+});
+H.displayName = "SideNav";
+//#endregion
+export { I as a, L as i, B as n, F as o, z as r, P as s, H as t };
+
+//# sourceMappingURL=navigation-C0Be5C3i.js.map

package/dist/navigation-C0Be5C3i.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigation-C0Be5C3i.js","names":["_Fragment","_Fragment","Text","DisplayLabel","focusRecipes","Button","Stack","toneRecipes","interactionRecipes","Percent","Badge","ItemMedia","ItemDescription","ItemActions","ItemGroup","ItemContent","Item","ItemTitle","useLayoutLinkRenderer","normalizeLayoutPath","Fragment$1","defaultBreadcrumbProgressStrings","BreadcrumbProgress","stringsProp","strings","useStrings","total","steps","position","currentIndex","progress","cn","className","isCompleted","idx","isCurrent","isClickable","onStepClick","stepName","step","stateLabel","accessibleName","content","Check","CategoryNav","title","items","Icon","it","active","activeId","onSelect","ChevronRight","defaultSectionNavStrings","SCROLL_SETTLE_MS","SectionNav","forwardRef","ariaLabel","rootProps","setActive","useState","clickLock","useRef","settleTimer","sectionIds","scheduleSettle","useCallback","useEffect","onScroll","lock","ids","intersecting","obs","entries","entry","next","id","el","rootMargin","isActive","e","target","reduceMotion","updateHash","defaultSideNavStrings","isSimpleText","value","SideNav","groupsProp","linkRenderer","groups","useMemo","activeNormalized","currentPath","activePath","group","item","path","b","a","collapsed","setCollapsed","g","groupIdPrefix","useId","toggleGroup","prev","resolvedActive","activeItemClassName","isCollapsed","showLabel","shouldRenderItems","itemsId","ChevronDown","Fragment","itemClassName"],"sources":["../src/components/layout/navigation/breadcrumb-progress/types.ts","../src/components/layout/navigation/breadcrumb-progress/breadcrumb-progress.tsx","../src/components/layout/navigation/category-nav/category-nav.tsx","../src/components/layout/navigation/section-nav/section-nav.tsx","../src/components/layout/navigation/side-nav.tsx"],"sourcesContent":["import type { StringsProp } from '../../../../lib/strings';\n\nexport interface BreadcrumbProgressStep {\n\t/** Stable identity for this entry. */\n\tid: string;\n\t/** Display label. */\n\tlabel: string;\n\t/** Short guidance shown beneath the control. */\n\thint?: string;\n}\n\nexport interface BreadcrumbProgressStrings {\n\tstepLabel: string;\n\tofLabel: string;\n\t/** State named after a completed step for assistive technology. */\n\tcompletedLabel: string;\n\t/** State named after a step that is not reachable yet. */\n\tupcomingLabel: string;\n\t/** Formats the position line. Defaults to `{stepLabel} {current} {ofLabel} {total}`; supply it where that word order does not fit. */\n\tformatProgress?: (current: number, total: number) => string;\n\t/** Formats one step's accessible name. Defaults to `{stepLabel} {position}: {label}`. */\n\tformatStepLabel?: (position: number, label: string) => string;\n}\n\nexport const defaultBreadcrumbProgressStrings: BreadcrumbProgressStrings = {\n\tstepLabel: 'Step',\n\tofLabel: 'of',\n\tcompletedLabel: 'completed',\n\tupcomingLabel: 'upcoming',\n};\n\nexport interface BreadcrumbProgressProps {\n\t/** Steps in the flow, in order. */\n\tsteps: BreadcrumbProgressStep[];\n\t/** Zero-based position of the active step. */\n\tcurrentIndex: number;\n\t/** Makes completed and current steps buttons. Without it the trail is display-only text. */\n\tonStepClick?: (id: string, index: number) => void;\n\tclassName?: string;\n\t/** Overrides this surface's own copy. */\n\tstrings?: StringsProp<BreadcrumbProgressStrings>;\n}\n","/**\n * BreadcrumbProgress — wizard / multi-step navigation with completed,\n * current, and upcoming states. Click any completed step to jump back.\n */\nimport { Check } from 'lucide-react';\nimport { Button } from '../../../base/buttons';\nimport { Percent } from '../../../primitives';\nimport { DisplayLabel, Text } from '../../../typography';\nimport { useStrings } from '../../../../lib/strings';\nimport { cn } from '../../../../lib/utils';\n\nimport {\n\tdefaultBreadcrumbProgressStrings,\n\ttype BreadcrumbProgressProps,\n} from './types';\nimport { interactionRecipes } from '../../../../lib/interaction-recipes';\nimport { toneRecipes } from '../../../../lib/tone-recipes';\n\nexport function BreadcrumbProgress({ steps, currentIndex, onStepClick, className, strings: stringsProp }: BreadcrumbProgressProps) {\n\tconst strings = useStrings(defaultBreadcrumbProgressStrings, stringsProp);\n\tconst total = steps.length;\n\t// An empty flow has no position to report.\n\tif (total === 0) return null;\n\n\tconst position = Math.min(total, Math.max(1, currentIndex + 1));\n\tconst progress = strings.formatProgress?.(position, total) ?? `${strings.stepLabel} ${position} ${strings.ofLabel} ${total}`;\n\n\treturn (\n\t\t<div className={cn('breadcrumb-progress--component @container/breadcrumb-progress', 'w-full', className)}>\n\t\t\t<div className=\"flex items-center justify-between mb-space-md\">\n\t\t\t\t<DisplayLabel>{progress}</DisplayLabel>\n\t\t\t\t<Percent value={Math.round((position / total) * 100)} scaled size=\"xs\" weight=\"semibold\" />\n\t\t\t</div>\n\t\t\t<ol className=\"m-0 list-none p-0 font-sans flex items-center gap-space-md\">\n\t\t\t\t{steps.map((step, idx) => {\n\t\t\t\t\tconst isCompleted = idx < currentIndex;\n\t\t\t\t\tconst isCurrent = idx === currentIndex;\n\t\t\t\t\tconst isClickable = !!onStepClick && (isCompleted || isCurrent);\n\t\t\t\t\tconst stepName = strings.formatStepLabel?.(idx + 1, step.label) ?? `${strings.stepLabel} ${idx + 1}: ${step.label}`;\n\t\t\t\t\t// The current step is stated with aria-current; the other states are named.\n\t\t\t\t\tconst stateLabel = isCompleted ? strings.completedLabel : isCurrent ? undefined : strings.upcomingLabel;\n\t\t\t\t\tconst accessibleName = stateLabel ? `${stepName}, ${stateLabel}` : stepName;\n\t\t\t\t\tconst content = (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\t\ttag=\"span\"\n\t\t\t\t\t\t\t\tsize=\"xs\"\n\t\t\t\t\t\t\t\tweight=\"semibold\"\n\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t'flex size-6 shrink-0 items-center justify-center rounded-full tabular-nums',\n\t\t\t\t\t\t\t\t\tisCompleted && 'bg-success text-success-foreground',\n\t\t\t\t\t\t\t\t\tisCurrent && `bg-primary text-primary-foreground ring-4 ${toneRecipes.primary.halo}`,\n\t\t\t\t\t\t\t\t\t!isCompleted && !isCurrent && 'bg-muted text-muted-foreground',\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{isCompleted ? <Check className=\"size-icon-md\" /> : idx + 1}\n\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t{/* Labels show once the trail itself is wide enough, wherever it is embedded. */}\n\t\t\t\t\t\t\t<div aria-hidden=\"true\" className=\"hidden min-w-0 @3xl/breadcrumb-progress:block\">\n\t\t\t\t\t\t\t\t<Text weight=\"semibold\" className={cn(!isCurrent && !isCompleted && 'text-muted-foreground')}>{step.label}</Text>\n\t\t\t\t\t\t\t\t{!!step.hint && <Text size=\"xs\" type=\"discrete\" className=\"truncate\">{step.hint}</Text>}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</>\n\t\t\t\t\t);\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<li\n\t\t\t\t\t\t\tkey={step.id}\n\t\t\t\t\t\t\taria-current={isCurrent && !isClickable ? 'step' : undefined}\n\t\t\t\t\t\t\tclassName=\"flex min-w-0 flex-1 items-center gap-space-md\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{isClickable ? (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\taria-label={accessibleName}\n\t\t\t\t\t\t\t\t\taria-current={isCurrent ? 'step' : undefined}\n\t\t\t\t\t\t\t\t\tonClick={() => onStepClick?.(step.id, idx)}\n\t\t\t\t\t\t\t\t\ttone=\"secondary\"\n\t\t\t\t\t\t\t\t\tbuttonStyle=\"ghost\"\n\t\t\t\t\t\t\t\t\tsize=\"md\"\n\t\t\t\t\t\t\t\t\tclassName={cn('min-w-0 justify-start gap-space-md text-left transition-colors', interactionRecipes.rowHover)}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{content}\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t// A step that cannot be visited is text; it keeps the button's box so the trail stays aligned.\n\t\t\t\t\t\t\t\t<span className=\"breadcrumb-progress--step box-border inline-flex min-h-action min-w-0 max-w-full items-center gap-space-md border border-transparent px-control text-left\">\n\t\t\t\t\t\t\t\t\t<Text tag=\"span\" size=\"inherit\" className=\"sr-only\">{accessibleName}</Text>\n\t\t\t\t\t\t\t\t\t{content}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t{idx < steps.length - 1 && (\n\t\t\t\t\t\t\t\t<div className={cn('h-px flex-1', isCompleted ? 'bg-success' : 'bg-border')} />\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</li>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</ol>\n\t\t</div>\n\t);\n}\n\nBreadcrumbProgress.displayName = 'BreadcrumbProgress';\n","/**\n * CategoryNav — vertical icon + label list with optional count badge per row.\n * Use as a sidebar nav for filtering or category browsing.\n */\nimport { ChevronRight } from 'lucide-react';\nimport { Badge } from '../../../base/badge';\nimport {\n\tItem,\n\tItemActions,\n\tItemContent,\n\tItemDescription,\n\tItemGroup,\n\tItemMedia,\n\tItemTitle,\n} from '../../../base/item';\nimport { cn } from '../../../../lib/utils';\n\nimport type { CategoryNavProps } from './types';\nimport { interactionRecipes } from '../../../../lib/interaction-recipes';\n\nexport function CategoryNav({ title, items, activeId, onSelect, className }: CategoryNavProps) {\n\treturn (\n\t\t<nav\n\t\t\tdata-component=\"category-nav\"\n\t\t\tdata-slot=\"category-nav\"\n\t\t\taria-label={title}\n\t\t\tclassName={cn('category-nav--component min-w-0', className)}\n\t\t>\n\t\t\t<ItemGroup role=\"group\">\n\t\t\t\t{items.map((it) => {\n\t\t\t\t\tconst Icon = it.icon;\n\t\t\t\t\tconst active = it.id === activeId;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Item\n\t\t\t\t\t\t\tkey={it.id}\n\t\t\t\t\t\t\t// Not `size=\"sm\"`. That maps to the primitive `xs` scale, which\n\t\t\t\t\t\t\t// shrinks media icons to 12px for a genuinely compact row — but\n\t\t\t\t\t\t\t// this row carries a title, a description and a badge and stands\n\t\t\t\t\t\t\t// 58px tall. The result was a 12px leading icon beside a 16px\n\t\t\t\t\t\t\t// chevron, because a `size-` class opts an icon out of that\n\t\t\t\t\t\t\t// scaling rule. The default scale matches `base/item`'s own\n\t\t\t\t\t\t\t// reference row at the same height.\n\t\t\t\t\t\t\trender={onSelect ? <button type=\"button\" /> : undefined}\n\t\t\t\t\t\t\tonClick={onSelect ? () => onSelect(it.id) : undefined}\n\t\t\t\t\t\t\taria-pressed={onSelect ? active : undefined}\n\t\t\t\t\t\t\taria-current={!onSelect && active ? true : undefined}\n\t\t\t\t\t\t\tdata-state={active ? 'active' : 'inactive'}\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t// The selected tint spans the row, so the row needs horizontal\n\t\t\t\t\t\t\t\t// padding of its own or the icon sits 1px from the tint's edge.\n\t\t\t\t\t\t\t\t// `px-space-md` is what `SectionNav` uses for the same job.\n\t\t\t\t\t\t\t\t'rounded-radius px-space-md transition-colors',\n\t\t\t\t\t\t\t\tonSelect && 'cursor-pointer',\n\t\t\t\t\t\t\t\tactive ? interactionRecipes.rowCurrent : onSelect && interactionRecipes.rowHover,\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{!!Icon && (\n\t\t\t\t\t\t\t\t<ItemMedia variant=\"icon\" className={cn(active ? 'text-accent-foreground' : 'text-muted-foreground')}>\n\t\t\t\t\t\t\t\t\t<Icon />\n\t\t\t\t\t\t\t\t</ItemMedia>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t<ItemContent>\n\t\t\t\t\t\t\t\t<ItemTitle bold={active}>{it.label}</ItemTitle>\n\t\t\t\t\t\t\t\t{!!it.hint && <ItemDescription clamp={1}>{it.hint}</ItemDescription>}\n\t\t\t\t\t\t\t</ItemContent>\n\t\t\t\t\t\t\t<ItemActions>\n\t\t\t\t\t\t\t\t{typeof it.count === 'number' && (\n\t\t\t\t\t\t\t\t\t<Badge tone=\"secondary\" className=\"tabular-nums\">\n\t\t\t\t\t\t\t\t\t\t{it.count}\n\t\t\t\t\t\t\t\t\t</Badge>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t<ChevronRight\n\t\t\t\t\t\t\t\t\tclassName={cn('size-icon shrink-0 text-muted-foreground', active && 'text-accent-foreground')}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</ItemActions>\n\t\t\t\t\t\t</Item>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</ItemGroup>\n\t\t</nav>\n\t);\n}\n\nCategoryNav.displayName = 'CategoryNav';\n","/**\n * SectionNav — sticky in-page anchor nav. Pass a list of section ids; the active one\n * is tracked via IntersectionObserver and the matching item is highlighted. Click to\n * scroll to that section and move focus into it. Pure JS — no router required.\n * Where IntersectionObserver does not exist, the current entry follows clicks only.\n *\n * A click owns the current state: the clicked section stays current while the smooth\n * scroll it started passes other sections, after that scroll settles (including when\n * the last sections are too short to reach the top), and until the reader scrolls\n * again. Only then does the observer resume.\n */\nimport { forwardRef, useCallback, useEffect, useRef, useState, type ComponentPropsWithoutRef } from 'react';\nimport type { LucideIcon } from 'lucide-react';\nimport { Text } from '../../../typography';\nimport { Stack } from '../../../base/structure';\nimport { useStrings, type StringsProp } from '../../../../lib/strings';\nimport { cn } from '../../../../lib/utils';\nimport { interactionRecipes } from '../../../../lib/interaction-recipes';\nimport { focusRecipes } from '../../../../lib/focus-recipes';\n\nexport interface SectionNavStrings {\n\tnavigationLabel: string;\n}\n\nexport const defaultSectionNavStrings: SectionNavStrings = {\n\tnavigationLabel: 'Section navigation',\n};\n\n/** Quiet time after the last scroll event before a click's smooth scroll counts as settled. */\nconst SCROLL_SETTLE_MS = 150;\n\nexport interface SectionNavItem {\n\t/** Stable identity for this entry. */\n\tid: string;\n\t/** Display label. */\n\tlabel: string;\n\t/** Leading glyph. */\n\ticon?: LucideIcon;\n}\n\nexport interface SectionNavProps extends Omit<ComponentPropsWithoutRef<'nav'>, 'children' | 'onSelect'> {\n\t/** Entries to render, in order. */\n\titems: SectionNavItem[];\n\trootMargin?: string;\n\tonSelect?: (id: string) => void;\n\t/**\n\t * Records the activated section in the URL hash with `history.replaceState`,\n\t * so the position can be shared and restored. Leave it off under a hash\n\t * router, where the hash is the route. @default false\n\t */\n\tupdateHash?: boolean;\n\t/** Overrides this surface's own copy. */\n\tstrings?: StringsProp<SectionNavStrings>;\n}\n\nexport const SectionNav = forwardRef<HTMLElement, SectionNavProps>(function SectionNav({\n\titems,\n\trootMargin = '-40% 0px -50% 0px',\n\tclassName,\n\tonSelect,\n\tupdateHash = false,\n\tstrings: stringsProp,\n\t'aria-label': ariaLabel,\n\t...rootProps\n}, ref) {\n\tconst strings = useStrings(defaultSectionNavStrings, stringsProp);\n\tconst [active, setActive] = useState<string | null>(items[0]?.id ?? null);\n\t// The section a click selected, and whether the scroll it started has settled.\n\tconst clickLock = useRef<{ id: string; settled: boolean } | null>(null);\n\tconst settleTimer = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n\t// Observe by identity, not array instance, so a re-render keeps the observer.\n\tconst sectionIds = items.map((it) => it.id).join('\\u0000');\n\n\tconst scheduleSettle = useCallback(() => {\n\t\tclearTimeout(settleTimer.current);\n\t\tsettleTimer.current = setTimeout(() => {\n\t\t\tif (clickLock.current) clickLock.current.settled = true;\n\t\t}, SCROLL_SETTLE_MS);\n\t}, []);\n\n\tuseEffect(() => {\n\t\t// Scroll events do not bubble, so listen in the capture phase to hear every\n\t\t// scrolling ancestor that scrollIntoView moves.\n\t\tconst onScroll = () => {\n\t\t\tconst lock = clickLock.current;\n\t\t\tif (!lock) return;\n\t\t\t// A scroll after the click's own scroll settled is the reader's: release.\n\t\t\tif (lock.settled) clickLock.current = null;\n\t\t\telse scheduleSettle();\n\t\t};\n\t\tdocument.addEventListener('scroll', onScroll, { capture: true, passive: true });\n\t\treturn () => {\n\t\t\tdocument.removeEventListener('scroll', onScroll, { capture: true });\n\t\t\tclearTimeout(settleTimer.current);\n\t\t};\n\t}, [scheduleSettle]);\n\n\tuseEffect(() => {\n\t\t// Without the observer (older runtimes, unit tests) the current entry follows clicks.\n\t\tif (typeof IntersectionObserver === 'undefined') return;\n\t\tconst ids = sectionIds ? sectionIds.split('\\u0000') : [];\n\t\tconst intersecting = new Map<string, boolean>();\n\t\tconst obs = new IntersectionObserver(\n\t\t\t(entries) => {\n\t\t\t\tentries.forEach((entry) => intersecting.set(entry.target.id, entry.isIntersecting));\n\t\t\t\tif (clickLock.current) return;\n\t\t\t\t// The first section in reading order inside the observed band is current.\n\t\t\t\tconst next = ids.find((id) => intersecting.get(id));\n\t\t\t\tif (next) setActive(next);\n\t\t\t},\n\t\t\t{ rootMargin, threshold: 0 },\n\t\t);\n\t\tids.forEach((id) => {\n\t\t\tconst el = document.getElementById(id);\n\t\t\tif (el) obs.observe(el);\n\t\t});\n\t\treturn () => obs.disconnect();\n\t}, [sectionIds, rootMargin]);\n\n\treturn (\n\t\t<nav\n\t\t\tref={ref}\n\t\t\tclassName={cn('section-nav--component', className)}\n\t\t\taria-label={ariaLabel ?? strings.navigationLabel}\n\t\t\t{...rootProps}\n\t\t>\n\t\t\t<Stack gap=\"2xs\" className=\"section-nav--items\">\n\t\t\t\t{items.map((it) => {\n\t\t\t\tconst Icon = it.icon;\n\t\t\t\tconst isActive = active === it.id;\n\t\t\t\treturn (\n\t\t\t\t\t<a\n\t\t\t\t\t\tkey={it.id}\n\t\t\t\t\t\thref={`#${it.id}`}\n\t\t\t\t\t\taria-current={isActive ? 'location' : undefined}\n\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\tclickLock.current = { id: it.id, settled: false };\n\t\t\t\t\t\t\t// Settles on its own when the target is already in place and nothing scrolls.\n\t\t\t\t\t\t\tscheduleSettle();\n\t\t\t\t\t\t\tconst target = document.getElementById(it.id);\n\t\t\t\t\t\t\tif (target) {\n\t\t\t\t\t\t\t\tconst reduceMotion = typeof window.matchMedia === 'function' && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n\t\t\t\t\t\t\t\ttarget.scrollIntoView({ behavior: reduceMotion ? 'auto' : 'smooth', block: 'start' });\n\t\t\t\t\t\t\t\t// Focus follows the scroll, so the next Tab continues inside the section.\n\t\t\t\t\t\t\t\tif (target.tabIndex < 0 && !target.hasAttribute('tabindex')) target.setAttribute('tabindex', '-1');\n\t\t\t\t\t\t\t\ttarget.focus({ preventScroll: true });\n\t\t\t\t\t\t\t\tif (updateHash) window.history.replaceState(window.history.state, '', `#${it.id}`);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsetActive(it.id);\n\t\t\t\t\t\t\tonSelect?.(it.id);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t`flex items-center gap-space-md rounded-radius px-space-md py-row-y transition-colors outline-none ${focusRecipes.edge}`,\n\t\t\t\t\t\t\tisActive ? interactionRecipes.rowCurrent : `text-muted-foreground ${interactionRecipes.rowHover}`,\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{!!Icon && <Icon className=\"size-icon-md shrink-0\" />}\n\t\t\t\t\t\t<Text tag=\"span\" type=\"inherit\" weight={isActive ? 'semibold' : 'medium'}>{it.label}</Text>\n\t\t\t\t\t</a>\n\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</Stack>\n\t\t</nav>\n\t);\n});\n\nSectionNav.displayName = 'SectionNav';\n","/**\n * SideNav — collapsible vertical sidebar navigation. Items can be grouped\n * with a heading and optionally collapsed; each item supports an icon, badge,\n * and active-state highlight. The active item is matched by deepest path\n * prefix so nested routes still highlight their parent group.\n *\n * Pass `items` for the short flat-list default. Use `groups` only when the\n * navigation needs headings or collapsible sections.\n */\nimport { ChevronDown, type LucideIcon } from 'lucide-react';\nimport { Fragment, forwardRef, useId, useMemo, useState, type ComponentPropsWithoutRef, type ReactNode } from 'react';\n\nimport { Badge } from '../../base/badge';\nimport { Button } from '../../base/buttons';\nimport { Stack } from '../../base/structure';\nimport { DisplayLabel, Text } from '../../typography';\nimport { useStrings, type StringsProp } from '../../../lib/strings';\nimport { cn } from '../../../lib/utils';\nimport { focusRecipes } from '../../../lib/focus-recipes';\nimport { interactionRecipes } from '../../../lib/interaction-recipes';\nimport { useLayoutLinkRenderer } from '../hooks';\nimport type { LayoutNavigationAdapter } from '../layout.types';\nimport { normalizeLayoutPath } from '../normalize-layout-path';\n\nexport interface SideNavStrings {\n\tnavigationLabel: string;\n}\n\nexport const defaultSideNavStrings: SideNavStrings = {\n\tnavigationLabel: 'Side navigation',\n};\n\nexport interface SideNavItem {\n\t/** Display label. */\n\tlabel: ReactNode;\n\t/** Destination for the entry, when it navigates. */\n\thref: string;\n\t/** Leading glyph. */\n\ticon?: LucideIcon;\n\t/** Chip rendered beside the label. */\n\tbadge?: ReactNode;\n\t/** Disables the control. */\n\tdisabled?: boolean;\n}\n\nexport interface SideNavGroup {\n\t/** Stable identity for this entry. */\n\tid: string;\n\t/** Display label. */\n\tlabel?: ReactNode;\n\t/** Entries to render, in order. */\n\titems: SideNavItem[];\n\tdefaultCollapsed?: boolean;\n\tcollapsible?: boolean;\n}\n\ninterface SideNavSharedProps extends Omit<ComponentPropsWithoutRef<'nav'>, 'children'>, LayoutNavigationAdapter {\n\t/** Path supplied by the app. Omit it to leave every entry unmarked. */\n\tcurrentPath?: string;\n\titemClassName?: string;\n\tactiveItemClassName?: string;\n\t/** Overrides this surface's own copy. */\n\tstrings?: StringsProp<SideNavStrings>;\n}\n\nexport type SideNavProps = SideNavSharedProps & (\n\t| {\n\t\t/** Short default for one flat navigation list. */\n\t\titems: SideNavItem[];\n\t\t/** Sections of the settings navigation. */\n\t\tgroups?: never;\n\t}\n\t| {\n\t\t/** Grouped navigation with optional headings and collapse behavior. */\n\t\tgroups: SideNavGroup[];\n\t\titems?: never;\n\t}\n);\n\nfunction isSimpleText(value: ReactNode): value is string | number | bigint {\n\treturn typeof value === 'string' || typeof value === 'number' || typeof value === 'bigint';\n}\n\nexport const SideNav = forwardRef<HTMLElement, SideNavProps>(function SideNav({\n\titems,\n\tgroups: groupsProp,\n\tcurrentPath,\n\trenderLink,\n\tclassName,\n\titemClassName,\n\tactiveItemClassName,\n\tstrings: stringsProp,\n\t'aria-label': ariaLabel,\n\t...rootProps\n}, ref) {\n\tconst strings = useStrings(defaultSideNavStrings, stringsProp);\n\tconst linkRenderer = useLayoutLinkRenderer({ renderLink });\n\tconst groups = useMemo<SideNavGroup[]>(\n\t\t() => groupsProp ?? [\n\t\t\t{ id: 'side-nav-items', items: items ?? [], collapsible: false },\n\t\t],\n\t\t[groupsProp, items],\n\t);\n\tconst activeNormalized = useMemo(() => {\n\t\tif (currentPath === undefined) return null;\n\t\tconst activePath = normalizeLayoutPath(currentPath);\n\t\treturn groups\n\t\t\t.flatMap((group) => group.items.map((item) => normalizeLayoutPath(item.href)))\n\t\t\t.filter((path) => activePath === path || activePath.startsWith(`${path}/`))\n\t\t\t.sort((a, b) => b.length - a.length)[0] ?? null;\n\t}, [currentPath, groups]);\n\n\tconst [collapsed, setCollapsed] = useState<Record<string, boolean>>(() =>\n\t\tObject.fromEntries(groups.map((g) => [g.id, Boolean(g.defaultCollapsed)])),\n\t);\n\n\tconst groupIdPrefix = useId();\n\tconst toggleGroup = (id: string) =>\n\t\tsetCollapsed((prev) => ({ ...prev, [id]: !prev[id] }));\n\n\tconst resolvedActive =\n\t\tactiveItemClassName && activeItemClassName.length > 0\n\t\t\t? activeItemClassName\n\t\t\t: interactionRecipes.rowCurrent;\n\n\treturn (\n\t\t<nav\n\t\t\tref={ref}\n\t\t\taria-label={ariaLabel ?? strings.navigationLabel}\n\t\t\tclassName={cn('side-nav--component', className)}\n\t\t\t{...rootProps}\n\t\t>\n\t\t\t<Stack gap=\"xl\" className=\"side-nav--groups\">\n\t\t\t\t{groups.map((group) => {\n\t\t\t\tconst isCollapsed = group.collapsible !== false && collapsed[group.id];\n\t\t\t\tconst showLabel = !!group.label;\n\t\t\t\tconst shouldRenderItems = !isCollapsed;\n\t\t\t\tconst itemsId = `${groupIdPrefix}${group.id}`;\n\n\t\t\t\treturn (\n\t\t\t\t\t<Stack key={group.id} gap=\"2xs\" className=\"side-nav--group\">\n\t\t\t\t\t\t{!!showLabel && (\n\t\t\t\t\t\t\tgroup.collapsible !== false ? (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\ttone=\"secondary\"\n\t\t\t\t\t\t\t\t\tbuttonStyle=\"ghost\"\n\t\t\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\t\t\tfullWidth\n\t\t\t\t\t\t\t\t\tonClick={() => toggleGroup(group.id)}\n\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t'h-auto min-h-action-sm justify-between px-row-x py-row-y',\n\t\t\t\t\t\t\t\t\t\t'text-muted-foreground',\n\t\t\t\t\t\t\t\t\t\t'hover:text-foreground transition-colors',\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\taria-expanded={!isCollapsed}\n\t\t\t\t\t\t\t\t\t// The list is unmounted while collapsed, so it is referenced only when present.\n\t\t\t\t\t\t\t\t\taria-controls={isCollapsed ? undefined : itemsId}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{isSimpleText(group.label) ? (\n\t\t\t\t\t\t\t\t\t\t<DisplayLabel tag=\"span\">\n\t\t\t\t\t\t\t\t\t\t\t{group.label}\n\t\t\t\t\t\t\t\t\t\t</DisplayLabel>\n\t\t\t\t\t\t\t\t\t) : group.label}\n\t\t\t\t\t\t\t\t\t<ChevronDown\n\t\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\t'size-icon-md transition-transform',\n\t\t\t\t\t\t\t\t\t\t\tisCollapsed && '-rotate-90',\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\tisSimpleText(group.label) ? (\n\t\t\t\t\t\t\t\t\t<DisplayLabel tag=\"div\" className=\"px-row-x py-row-y\">\n\t\t\t\t\t\t\t\t\t\t{group.label}\n\t\t\t\t\t\t\t\t\t</DisplayLabel>\n\t\t\t\t\t\t\t\t) : group.label\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{!!shouldRenderItems && (\n\t\t\t\t\t\t\t<Stack id={itemsId} gap=\"2xs\" className=\"side-nav--items\">\n\t\t\t\t\t\t\t\t{group.items.map((item) => {\n\t\t\t\t\t\t\t\t\tconst Icon = item.icon;\n\t\t\t\t\t\t\t\t\tconst itemPath = normalizeLayoutPath(item.href);\n\t\t\t\t\t\t\t\t\tconst isActive = itemPath === activeNormalized;\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<Fragment key={item.href}>\n\t\t\t\t\t\t\t\t\t\t\t{linkRenderer({\n\t\t\t\t\t\t\t\t\t\t\t\thref: item.href,\n\t\t\t\t\t\t\t\t\t\t\t\tactive: isActive,\n\t\t\t\t\t\t\t\t\t\t\t\tdisabled: item.disabled,\n\t\t\t\t\t\t\t\t\t\t\t\t'aria-current': isActive ? 'page' : undefined,\n\t\t\t\t\t\t\t\t\t\t\t\tclassName: cn(\n\t\t\t\t\t\t\t\t\t\t\t\t\t'group flex items-center gap-space-md rounded-radius px-row-x py-row-y',\n\t\t\t\t\t\t\t\t\t\t\t\t\t'text-sm transition-colors',\n\t\t\t\t\t\t\t\t\t\t\t\t\t`focus-visible:outline-none ${focusRecipes.edge}`,\n\t\t\t\t\t\t\t\t\t\t\t\t\tinteractionRecipes.rowHover,\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.disabled && 'pointer-events-none opacity-50',\n\t\t\t\t\t\t\t\t\t\t\t\t\tisActive && resolvedActive,\n\t\t\t\t\t\t\t\t\t\t\t\t\titemClassName,\n\t\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t\tchildren: <>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{!!Icon && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<Icon className={cn(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'size-icon shrink-0',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tisActive ? 'text-accent-foreground' : 'text-muted-foreground',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)} />\n\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t{isSimpleText(item.label) ? (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<Text tag=\"span\" size=\"inherit\" weight=\"medium\" lineHeight=\"tight\" className=\"min-w-0 flex-1 truncate text-inherit\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{item.label}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t\t\t\t\t\t) : item.label}\n\t\t\t\t\t\t\t\t\t\t\t\t\t{!!item.badge && <Badge tone=\"secondary\" className=\"shrink-0\">{item.badge}</Badge>}\n\t\t\t\t\t\t\t\t\t\t\t\t</>,\n\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</Stack>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</Stack>\n\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</Stack>\n\t\t</nav>\n\t);\n});\n\nSideNav.displayName = 'SideNav';\n"],"mappings":"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"}