tembro 3.0.0 → 3.1.5

package/dist/src/components/layout/app-sidebar.js

@@ -0,0 +1,493 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { Tooltip as t } from "../ui/tooltip/index.js";
+import { useIsMobile as n } from "../../hooks/use-is-mobile.js";
+import { ControllableDetails as r } from "./controllable-details.js";
+import * as i from "react";
+import { ChevronRightIcon as a, MenuIcon as o, XIcon as s } from "lucide-react";
+import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/layout/app-sidebar.tsx
+var d = 1024, f = "18rem", p = "4.75rem", m = "min(88vw, 22rem)";
+function h({ active: t, disabled: n }) {
+	return e("border border-transparent bg-transparent text-[color:color-mix(in_oklch,var(--sidebar-foreground),transparent_6%)] hover:border-[color:var(--aui-sidebar-item-active-border)] hover:bg-[color:var(--aui-sidebar-item-hover-bg)] hover:text-[color:var(--sidebar-foreground)] focus-visible:border-[color:var(--sidebar-ring)] focus-visible:bg-[color:var(--aui-sidebar-item-hover-bg)] focus-visible:text-[color:var(--sidebar-foreground)] focus-visible:shadow-[0_0_0_3px_color-mix(in_oklch,var(--sidebar-ring),transparent_82%)]", t && "border-[color:var(--aui-sidebar-item-active-border)] bg-[color:var(--aui-sidebar-item-active-bg)] text-[color:var(--aui-sidebar-item-active-fg)] shadow-[inset_0_1px_0_rgba(255,255,255,0.08),0_10px_24px_color-mix(in_oklch,var(--sidebar-primary),transparent_88%)]", n && "hover:border-transparent hover:bg-transparent hover:text-[color:color-mix(in_oklch,var(--sidebar-foreground),transparent_6%)]");
+}
+function g(e) {
+	return e.items?.some((e) => !e.hidden) ?? !1;
+}
+function _(e) {
+	return e.active ? !0 : e.items?.some((e) => _(e)) ?? !1;
+}
+function v(e, t) {
+	e.onSelect?.(), t?.(e);
+}
+function y({ item: n, collapsed: r, depth: i, itemSize: a, activeIndicator: o, onItemSelect: s, renderLink: d }) {
+	let f = {
+		"aria-current": n.current ?? (n.active ? "page" : void 0),
+		"aria-disabled": n.disabled || void 0,
+		"data-slot": "app-sidebar-item",
+		"data-active": n.active || void 0,
+		"data-disabled": n.disabled || void 0,
+		"data-depth": String(i),
+		"data-size": a,
+		"data-active-indicator": o,
+		className: e("flex items-center gap-2 border border-transparent text-sm font-medium outline-none transition-[background-color,border-color,color,box-shadow] data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50", h({
+			active: n.active,
+			disabled: n.disabled
+		}), r && "justify-center px-2")
+	}, p = /* @__PURE__ */ u(c, { children: [
+		n.icon && /* @__PURE__ */ l("span", {
+			className: "shrink-0",
+			children: n.icon
+		}),
+		!r && /* @__PURE__ */ l("span", {
+			className: "min-w-0 flex-1 truncate",
+			children: n.label
+		}),
+		!r && n.badge && /* @__PURE__ */ l("span", {
+			className: "shrink-0",
+			children: n.badge
+		})
+	] }), m = (e) => r ? /* @__PURE__ */ l(t, {
+		content: n.tooltip ?? n.label,
+		side: "right",
+		children: /* @__PURE__ */ l("span", {
+			className: "block",
+			children: e
+		})
+	}) : e;
+	return n.href?.startsWith("/") ? m(d ? /* @__PURE__ */ l(c, { children: d({
+		item: n,
+		href: n.href,
+		...f,
+		onClick: (e) => {
+			if (n.disabled) {
+				e.preventDefault();
+				return;
+			}
+			v(n, s);
+		},
+		children: p
+	}) }) : /* @__PURE__ */ l("a", {
+		href: n.href,
+		...f,
+		onClick: (e) => {
+			if (n.disabled) {
+				e.preventDefault();
+				return;
+			}
+			v(n, s);
+		},
+		children: p
+	})) : n.href ? m(/* @__PURE__ */ l("button", {
+		type: "button",
+		...f,
+		className: e(f.className, "w-full"),
+		onClick: () => {
+			if (n.disabled) return;
+			let e = n.href;
+			if (e) {
+				if (v(n, s), e.startsWith("http")) {
+					window.open(e, "_blank", "noopener,noreferrer");
+					return;
+				}
+				window.location.assign(e);
+			}
+		},
+		children: p
+	})) : m(/* @__PURE__ */ l("button", {
+		type: "button",
+		disabled: n.disabled,
+		...f,
+		onClick: () => {
+			n.disabled || v(n, s);
+		},
+		children: p
+	}));
+}
+function b({ items: n, collapsed: o, depth: s, showSectionLabels: c, itemSize: d, activeIndicator: f, onItemSelect: p, renderLink: m }) {
+	return n.map((n) => {
+		if (n.hidden) return null;
+		let v = g(n), x = _(n), S = c && !o && s === 0 && n.sectionLabel;
+		if (!v) return /* @__PURE__ */ u(i.Fragment, { children: [S ? /* @__PURE__ */ l("div", {
+			"data-slot": "app-sidebar-group-label",
+			className: "px-2.5 pb-1 pt-3 text-[11px] font-semibold uppercase tracking-[0.14em] text-[color:color-mix(in_oklch,var(--sidebar-foreground),transparent_42%)] first:pt-0",
+			children: n.sectionLabel
+		}) : null, /* @__PURE__ */ l(y, {
+			item: n,
+			collapsed: o,
+			depth: s,
+			itemSize: d,
+			activeIndicator: f,
+			onItemSelect: p,
+			renderLink: m
+		})] }, n.key);
+		let C = n.defaultExpanded ?? x;
+		return /* @__PURE__ */ u("div", {
+			"data-slot": "app-sidebar-group",
+			"data-depth": s,
+			children: [S && /* @__PURE__ */ l("div", {
+				"data-slot": "app-sidebar-group-label",
+				className: "px-2.5 pb-1 pt-3 text-[11px] font-semibold uppercase tracking-[0.14em] text-[color:color-mix(in_oklch,var(--sidebar-foreground),transparent_42%)] first:pt-0",
+				children: n.sectionLabel
+			}), /* @__PURE__ */ u(r, {
+				"data-slot": "app-sidebar-group-details",
+				open: n.expanded,
+				defaultOpen: C,
+				className: "group/app-sidebar-details",
+				onOpenChange: n.onExpandedChange,
+				children: [/* @__PURE__ */ u("summary", {
+					"data-slot": "app-sidebar-group-trigger",
+					"data-size": d,
+					"data-active": x || void 0,
+					"data-active-indicator": f,
+					className: e("flex list-none items-center gap-2 border border-transparent text-sm font-medium outline-none transition-[background-color,border-color,color,box-shadow]", h({ active: x }), o ? "justify-center px-2" : "px-2.5"),
+					children: [
+						n.icon ? o ? /* @__PURE__ */ l(t, {
+							content: n.tooltip ?? n.label,
+							side: "right",
+							children: /* @__PURE__ */ l("span", {
+								className: "shrink-0",
+								children: n.icon
+							})
+						}) : /* @__PURE__ */ l("span", {
+							className: "shrink-0",
+							children: n.icon
+						}) : null,
+						!o && /* @__PURE__ */ l("span", {
+							className: "min-w-0 flex-1 truncate",
+							children: n.label
+						}),
+						!o && n.badge && /* @__PURE__ */ l("span", {
+							className: "shrink-0",
+							children: n.badge
+						}),
+						!o && /* @__PURE__ */ l(a, {
+							"data-slot": "app-sidebar-group-chevron",
+							className: "ml-auto size-3.5 shrink-0 text-[color:color-mix(in_oklch,var(--sidebar-foreground),transparent_42%)] transition-transform group-open/app-sidebar-details:rotate-90"
+						})
+					]
+				}), /* @__PURE__ */ l("div", {
+					"data-slot": "app-sidebar-group-content",
+					className: e("mt-1 flex flex-col gap-1", !o && "pl-3"),
+					children: /* @__PURE__ */ l(b, {
+						items: n.items ?? [],
+						collapsed: o,
+						depth: s + 1,
+						showSectionLabels: c,
+						itemSize: d,
+						activeIndicator: f,
+						onItemSelect: p,
+						renderLink: m
+					})
+				})]
+			})]
+		}, n.key);
+	});
+}
+function x({ item: n, collapsed: r, onItemSelect: i }) {
+	let a = /* @__PURE__ */ u("button", {
+		type: "button",
+		"data-slot": "app-sidebar-action",
+		"data-active": n.active || void 0,
+		"data-disabled": n.disabled || void 0,
+		className: e("flex min-h-9 items-center gap-2 rounded-lg border border-transparent px-2.5 text-sm font-medium outline-none transition-[background-color,border-color,color,box-shadow] data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50", h({
+			active: n.active,
+			disabled: n.disabled
+		}), r && "justify-center px-2"),
+		disabled: n.disabled,
+		onClick: () => {
+			n.disabled || v(n, i);
+		},
+		children: [
+			n.icon ? /* @__PURE__ */ l("span", {
+				className: "shrink-0",
+				children: n.icon
+			}) : null,
+			r ? null : /* @__PURE__ */ l("span", {
+				className: "min-w-0 flex-1 truncate",
+				children: n.label
+			}),
+			!r && n.badge ? /* @__PURE__ */ l("span", {
+				className: "shrink-0",
+				children: n.badge
+			}) : null
+		]
+	});
+	return r ? /* @__PURE__ */ l(t, {
+		content: n.tooltip ?? n.label,
+		side: "right",
+		children: /* @__PURE__ */ l("span", {
+			className: "block",
+			children: a
+		})
+	}) : a;
+}
+function S({ account: n, collapsed: r, onAfterSelect: i }) {
+	let a = /* @__PURE__ */ u("button", {
+		type: "button",
+		"data-slot": "app-sidebar-account",
+		className: e("flex w-full items-center gap-3 rounded-[min(var(--radius-xl),16px)] border border-transparent text-left transition-[background-color,border-color,color,box-shadow]", h({}), r ? "justify-center px-2 py-2.5" : "px-3 py-2.5"),
+		onClick: () => {
+			if (n.onSelect?.(), i?.(), n.href) {
+				if (n.href.startsWith("http")) {
+					window.open(n.href, "_blank", "noopener,noreferrer");
+					return;
+				}
+				window.location.assign(n.href);
+			}
+		},
+		children: [n.avatar ? /* @__PURE__ */ l("span", {
+			"data-slot": "app-sidebar-account-avatar",
+			className: "inline-flex size-9 shrink-0 items-center justify-center overflow-hidden rounded-full border border-border/65 bg-muted/45 text-sm font-semibold",
+			children: n.avatar
+		}) : null, r ? null : /* @__PURE__ */ u("span", {
+			className: "min-w-0 flex-1",
+			children: [/* @__PURE__ */ l("span", {
+				"data-slot": "app-sidebar-account-label",
+				className: "block truncate text-sm font-semibold text-[color:var(--sidebar-foreground)]",
+				children: n.label
+			}), n.description ? /* @__PURE__ */ l("span", {
+				"data-slot": "app-sidebar-account-description",
+				className: "block truncate text-xs text-[color:color-mix(in_oklch,var(--sidebar-foreground),transparent_36%)]",
+				children: n.description
+			}) : null]
+		})]
+	});
+	return r ? /* @__PURE__ */ l(t, {
+		content: n.tooltip ?? n.label,
+		side: "right",
+		children: /* @__PURE__ */ l("span", {
+			className: "block",
+			children: a
+		})
+	}) : a;
+}
+function C({ className: n, style: r, header: a, footer: o, items: d = [], collapsed: m = !1, width: h = f, collapsedWidth: g = p, collapsedRail: _, railItems: v = [], footerAccount: y, secondaryActions: C = [], footerSecondary: w, footerClassName: T, tooltipOnCollapsed: E, showSectionLabels: D = !0, itemSize: O = "md", activeIndicator: k = "bar", navigationLabel: A = "Primary navigation", onItemSelect: j, renderItem: M, renderLink: N, children: P, mobile: F, mobileTitle: I, mobileDescription: L, mobileCloseLabel: R = "Close navigation", onRequestClose: z, closeOnSelect: B = !0, ...V }) {
+	let H = d.filter((e) => !e.hidden), U = v.filter((e) => !e.hidden), W = C.filter((e) => !e.hidden), G = i.useCallback((e) => {
+		j?.(e), F && B && z?.();
+	}, [
+		B,
+		F,
+		j,
+		z
+	]), K = F && (I || L || z);
+	return /* @__PURE__ */ u("aside", {
+		"data-slot": "app-sidebar",
+		"data-collapsed": m || void 0,
+		"data-mobile": F || void 0,
+		className: e("flex h-full min-h-0 flex-col overflow-hidden", n),
+		style: {
+			width: m ? g : h,
+			minWidth: m ? g : h,
+			...r
+		},
+		...V,
+		children: [
+			(a || K) && /* @__PURE__ */ l("div", {
+				"data-slot": "app-sidebar-header",
+				className: "shrink-0 border-b p-3",
+				children: /* @__PURE__ */ u("div", {
+					className: "flex items-start gap-3",
+					children: [/* @__PURE__ */ u("div", {
+						className: "min-w-0 flex-1",
+						children: [a ?? null, K ? /* @__PURE__ */ u("div", {
+							className: e(a && "mt-3"),
+							children: [I ? /* @__PURE__ */ l("p", {
+								className: "text-sm font-semibold text-foreground",
+								children: I
+							}) : null, L ? /* @__PURE__ */ l("p", {
+								className: "mt-1 text-xs leading-5 text-muted-foreground",
+								children: L
+							}) : null]
+						}) : null]
+					}), F && z ? /* @__PURE__ */ l("button", {
+						type: "button",
+						"aria-label": R,
+						"data-slot": "app-sidebar-mobile-close",
+						className: "inline-flex size-9 shrink-0 items-center justify-center rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg-alt)] text-[color:var(--aui-page-foreground)] transition hover:bg-[color:var(--aui-control-bg)]",
+						onClick: z,
+						children: /* @__PURE__ */ l(s, { className: "size-4" })
+					}) : null]
+				})
+			}),
+			/* @__PURE__ */ u("nav", {
+				"data-slot": "app-sidebar-nav",
+				"aria-label": A,
+				className: "flex min-h-0 flex-1 flex-col gap-1 overflow-y-auto overscroll-contain p-2",
+				children: [P ?? H.map((e) => {
+					if (!M) return null;
+					let n = M(e, { collapsed: m });
+					return !m || !E ? /* @__PURE__ */ l(i.Fragment, { children: n }, e.key) : /* @__PURE__ */ l(t, {
+						content: e.tooltip ?? e.label,
+						side: "right",
+						children: /* @__PURE__ */ l("span", {
+							className: "block",
+							children: n
+						})
+					}, e.key);
+				}), !P && !M && /* @__PURE__ */ l(b, {
+					items: H,
+					collapsed: m,
+					depth: 0,
+					showSectionLabels: D,
+					itemSize: O,
+					activeIndicator: k,
+					onItemSelect: G,
+					renderLink: N
+				})]
+			}),
+			(y || w || o || W.length > 0 || m && (_ || U.length > 0)) && /* @__PURE__ */ u("div", {
+				"data-slot": "app-sidebar-footer",
+				className: e("shrink-0 border-t p-3", T),
+				children: [
+					m ? /* @__PURE__ */ u(c, { children: [U.length > 0 ? /* @__PURE__ */ l("div", {
+						"data-slot": "app-sidebar-rail-actions",
+						className: "grid gap-2",
+						children: U.map((e) => /* @__PURE__ */ l(x, {
+							item: e,
+							collapsed: !0,
+							onItemSelect: G
+						}, e.key))
+					}) : null, _ ? /* @__PURE__ */ l("div", {
+						"data-slot": "app-sidebar-rail",
+						children: _
+					}) : null] }) : null,
+					!m && y ? /* @__PURE__ */ l("div", {
+						"data-slot": "app-sidebar-account-wrap",
+						className: "mb-3",
+						children: /* @__PURE__ */ l(S, {
+							account: y,
+							collapsed: !1,
+							onAfterSelect: () => {
+								F && B && z?.();
+							}
+						})
+					}) : null,
+					!m && W.length > 0 ? /* @__PURE__ */ l("div", {
+						"data-slot": "app-sidebar-secondary-actions",
+						className: "mb-3 grid gap-2",
+						children: W.map((e) => /* @__PURE__ */ l(x, {
+							item: e,
+							collapsed: !1,
+							onItemSelect: G
+						}, e.key))
+					}) : null,
+					!m && w ? /* @__PURE__ */ l("div", {
+						"data-slot": "app-sidebar-footer-secondary",
+						className: "mb-3",
+						children: w
+					}) : null,
+					m && y ? /* @__PURE__ */ l("div", {
+						"data-slot": "app-sidebar-account-wrap",
+						children: /* @__PURE__ */ l(S, {
+							account: y,
+							collapsed: !0,
+							onAfterSelect: () => {
+								F && B && z?.();
+							}
+						})
+					}) : null,
+					!m && o
+				]
+			})
+		]
+	});
+}
+function w({ className: t, header: r, footer: a, items: s = [], collapsed: h = !1, width: g = f, collapsedWidth: _ = p, mobileWidth: v = m, collapsedRail: y, railItems: b = [], footerAccount: x, secondaryActions: S = [], footerSecondary: w, tooltipOnCollapsed: T = !0, showSectionLabels: E = !0, itemSize: D = "md", activeIndicator: O = "bar", navigationLabel: k = "Primary navigation", responsive: A = !0, mobileBreakpoint: j = d, mobileOpen: M, defaultMobileOpen: N = !1, onMobileOpenChange: P, mobileTitle: F, mobileDescription: I, mobileToggleLabel: L = "Open navigation", mobileCloseLabel: R = "Close navigation", mobileToggleIcon: z, showMobileToggle: B = !0, closeOnSelect: V = !0, mobileToggleClassName: H, mobilePanelClassName: U, mobileOverlayClassName: W, renderMobileToggle: G, onItemSelect: K, renderItem: q, renderLink: J, children: Y, ...ee }) {
+	let te = n(j), X = A && te, [ne, re] = i.useState(N), Z = M ?? ne, Q = i.useCallback((e) => {
+		M ?? re(e), P?.(e);
+	}, [M, P]);
+	i.useEffect(() => {
+		!X && Z && Q(!1);
+	}, [
+		X,
+		Z,
+		Q
+	]), i.useEffect(() => {
+		if (!X || !Z) return;
+		let e = document.body.style.overflow;
+		document.body.style.overflow = "hidden";
+		let t = (e) => {
+			e.key === "Escape" && Q(!1);
+		};
+		return window.addEventListener("keydown", t), () => {
+			document.body.style.overflow = e, window.removeEventListener("keydown", t);
+		};
+	}, [
+		X,
+		Z,
+		Q
+	]);
+	let $ = {
+		className: t,
+		header: r,
+		footer: a,
+		items: s,
+		collapsed: h,
+		width: g,
+		collapsedWidth: _,
+		collapsedRail: y,
+		railItems: b,
+		footerAccount: x,
+		secondaryActions: S,
+		footerSecondary: w,
+		tooltipOnCollapsed: T,
+		showSectionLabels: E,
+		itemSize: D,
+		activeIndicator: O,
+		navigationLabel: k,
+		mobileCloseLabel: R,
+		closeOnSelect: V,
+		onItemSelect: K,
+		renderItem: q,
+		renderLink: J,
+		children: Y,
+		...ee
+	};
+	if (!A || !X) return /* @__PURE__ */ l(C, { ...$ });
+	let ie = /* @__PURE__ */ u("button", {
+		type: "button",
+		"aria-label": Z ? R : L,
+		"data-slot": "app-sidebar-mobile-trigger",
+		"data-state": Z ? "open" : "closed",
+		className: e("inline-flex min-h-10 items-center gap-2 rounded-xl border border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] px-3 text-sm font-medium text-[color:var(--aui-page-foreground)] shadow-sm transition hover:bg-[color:var(--aui-page-bg-alt)]", H),
+		onClick: () => Q(!Z),
+		children: [/* @__PURE__ */ l("span", {
+			className: "inline-flex size-8 items-center justify-center rounded-lg bg-[color:var(--aui-page-bg-alt)]",
+			children: z ?? /* @__PURE__ */ l(o, { className: "size-4" })
+		}), /* @__PURE__ */ l("span", { children: Z ? R : L })]
+	});
+	return /* @__PURE__ */ u(c, { children: [B ? G ? G({
+		open: Z,
+		setOpen: Q
+	}) : ie : null, /* @__PURE__ */ u("div", {
+		"data-slot": "app-sidebar-mobile-root",
+		className: "relative z-40",
+		children: [/* @__PURE__ */ l("button", {
+			type: "button",
+			"aria-label": "Dismiss navigation",
+			"data-slot": "app-sidebar-mobile-overlay",
+			"data-state": Z ? "open" : "closed",
+			className: e("fixed inset-0 z-40 bg-black/45 transition-opacity duration-200", Z ? "opacity-100" : "pointer-events-none opacity-0", W),
+			onClick: () => Q(!1)
+		}), /* @__PURE__ */ l(C, {
+			...$,
+			mobile: !0,
+			collapsed: !1,
+			mobileTitle: F,
+			mobileDescription: I,
+			onRequestClose: () => Q(!1),
+			"data-state": Z ? "open" : "closed",
+			role: "dialog",
+			"aria-modal": "true",
+			"aria-label": typeof F == "string" ? F : "Navigation",
+			className: e("fixed inset-y-0 left-0 z-50 max-w-[22rem] border-r border-[color:var(--aui-divider)] bg-[color:var(--aui-page-bg)] shadow-2xl transition-transform duration-200 ease-out", Z ? "translate-x-0" : "-translate-x-full", U, t),
+			style: {
+				width: v,
+				minWidth: v
+			}
+		})]
+	})] });
+}
+//#endregion
+export { w as Sidebar };

package/dist/src/components/layout/breadcrumbs.cjs

@@ -0,0 +1 @@
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("lucide-react"),i=require("react/jsx-runtime");function a(e,t,n){if(e.length<=t||t<3)return e;let r=e[0],i=Math.max(t-2,1),a=e.slice(-i);return[r,{key:`__collapsed__`,label:n},...a]}function o({className:e,items:o,maxItems:s,collapseLabel:c=`…`,separator:l=(0,i.jsx)(r.ChevronRightIcon,{className:`size-3.5`}),wrap:u=!1,currentItemLabel:d,renderLink:f,...p}){let m=n.useMemo(()=>typeof s==`number`?a(o,s,c):o,[c,o,s]);return(0,i.jsx)(`nav`,{"data-slot":`breadcrumbs`,"aria-label":`Breadcrumb`,className:t.cn(`flex min-w-0 items-center gap-1 overflow-x-auto text-sm text-muted-foreground`,u?`flex-wrap`:`whitespace-nowrap`,e),...p,children:m.map((e,r)=>{let a=e.key===`__collapsed__`,o=r===m.length-1,s=e.current||o;return(0,i.jsxs)(n.Fragment,{children:[r>0&&(0,i.jsx)(`span`,{className:`shrink-0 opacity-60`,children:l}),a?(0,i.jsx)(`span`,{"data-slot":`breadcrumbs-collapsed`,className:`shrink-0 rounded-full border border-border/65 px-2 py-0.5 text-xs text-muted-foreground`,children:e.label}):e.href&&!s?f?f({item:e,href:e.href,"data-slot":`breadcrumbs-link`,className:`truncate rounded-[var(--radius-sm)] px-1 py-0.5 transition-colors hover:bg-accent/55 hover:text-foreground`,onClick:()=>e.onSelect?.(),children:(0,i.jsxs)(`span`,{className:`inline-flex min-w-0 items-center gap-1.5`,children:[e.icon?(0,i.jsx)(`span`,{className:`shrink-0`,children:e.icon}):null,(0,i.jsx)(`span`,{className:`truncate`,children:e.label})]})}):(0,i.jsx)(`a`,{href:e.href,"data-slot":`breadcrumbs-link`,className:`truncate rounded-[var(--radius-sm)] px-1 py-0.5 transition-colors hover:bg-accent/55 hover:text-foreground`,onClick:()=>e.onSelect?.(),children:(0,i.jsxs)(`span`,{className:`inline-flex min-w-0 items-center gap-1.5`,children:[e.icon?(0,i.jsx)(`span`,{className:`shrink-0`,children:e.icon}):null,(0,i.jsx)(`span`,{className:`truncate`,children:e.label})]})}):(0,i.jsxs)(`span`,{"data-slot":`breadcrumbs-current`,"aria-current":s?e.currentLabel??d??`page`:void 0,className:t.cn(`inline-flex min-w-0 items-center gap-1.5 truncate rounded-[var(--radius-sm)] px-1 py-0.5`,s&&`bg-accent/45 font-medium text-foreground`),children:[e.icon?(0,i.jsx)(`span`,{className:`shrink-0`,children:e.icon}):null,(0,i.jsx)(`span`,{className:`truncate`,children:e.label})]})]},e.key)})})}exports.Breadcrumbs=o;

package/dist/src/components/layout/breadcrumbs.js

@@ -0,0 +1,86 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import * as t from "react";
+import { ChevronRightIcon as n } from "lucide-react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/layout/breadcrumbs.tsx
+function a(e, t, n) {
+	if (e.length <= t || t < 3) return e;
+	let r = e[0], i = Math.max(t - 2, 1), a = e.slice(-i);
+	return [
+		r,
+		{
+			key: "__collapsed__",
+			label: n
+		},
+		...a
+	];
+}
+function o({ className: o, items: s, maxItems: c, collapseLabel: l = "…", separator: u = /* @__PURE__ */ r(n, { className: "size-3.5" }), wrap: d = !1, currentItemLabel: f, renderLink: p, ...m }) {
+	let h = t.useMemo(() => typeof c == "number" ? a(s, c, l) : s, [
+		l,
+		s,
+		c
+	]);
+	return /* @__PURE__ */ r("nav", {
+		"data-slot": "breadcrumbs",
+		"aria-label": "Breadcrumb",
+		className: e("flex min-w-0 items-center gap-1 overflow-x-auto text-sm text-muted-foreground", d ? "flex-wrap" : "whitespace-nowrap", o),
+		...m,
+		children: h.map((n, a) => {
+			let o = n.key === "__collapsed__", s = a === h.length - 1, c = n.current || s;
+			return /* @__PURE__ */ i(t.Fragment, { children: [a > 0 && /* @__PURE__ */ r("span", {
+				className: "shrink-0 opacity-60",
+				children: u
+			}), o ? /* @__PURE__ */ r("span", {
+				"data-slot": "breadcrumbs-collapsed",
+				className: "shrink-0 rounded-full border border-border/65 px-2 py-0.5 text-xs text-muted-foreground",
+				children: n.label
+			}) : n.href && !c ? p ? p({
+				item: n,
+				href: n.href,
+				"data-slot": "breadcrumbs-link",
+				className: "truncate rounded-[var(--radius-sm)] px-1 py-0.5 transition-colors hover:bg-accent/55 hover:text-foreground",
+				onClick: () => n.onSelect?.(),
+				children: /* @__PURE__ */ i("span", {
+					className: "inline-flex min-w-0 items-center gap-1.5",
+					children: [n.icon ? /* @__PURE__ */ r("span", {
+						className: "shrink-0",
+						children: n.icon
+					}) : null, /* @__PURE__ */ r("span", {
+						className: "truncate",
+						children: n.label
+					})]
+				})
+			}) : /* @__PURE__ */ r("a", {
+				href: n.href,
+				"data-slot": "breadcrumbs-link",
+				className: "truncate rounded-[var(--radius-sm)] px-1 py-0.5 transition-colors hover:bg-accent/55 hover:text-foreground",
+				onClick: () => n.onSelect?.(),
+				children: /* @__PURE__ */ i("span", {
+					className: "inline-flex min-w-0 items-center gap-1.5",
+					children: [n.icon ? /* @__PURE__ */ r("span", {
+						className: "shrink-0",
+						children: n.icon
+					}) : null, /* @__PURE__ */ r("span", {
+						className: "truncate",
+						children: n.label
+					})]
+				})
+			}) : /* @__PURE__ */ i("span", {
+				"data-slot": "breadcrumbs-current",
+				"aria-current": c ? n.currentLabel ?? f ?? "page" : void 0,
+				className: e("inline-flex min-w-0 items-center gap-1.5 truncate rounded-[var(--radius-sm)] px-1 py-0.5", c && "bg-accent/45 font-medium text-foreground"),
+				children: [n.icon ? /* @__PURE__ */ r("span", {
+					className: "shrink-0",
+					children: n.icon
+				}) : null, /* @__PURE__ */ r("span", {
+					className: "truncate",
+					children: n.label
+				})]
+			})] }, n.key);
+		})
+	});
+}
+//#endregion
+export { o as Breadcrumbs };

package/dist/src/components/layout/controllable-details.cjs

@@ -0,0 +1 @@
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs");let t=require("react");t=e.__toESM(t,1);let n=require("react/jsx-runtime");function r({open:e,defaultOpen:r=!1,onOpenChange:i,children:a,...o}){let[s,c]=t.useState(r),l=e!==void 0;return(0,n.jsx)(`details`,{...o,open:l?e:s,onToggle:e=>{let t=e.currentTarget.open;l||c(t),i?.(t)},children:a})}exports.ControllableDetails=r;

package/dist/src/components/layout/controllable-details.js

@@ -0,0 +1,18 @@
+"use client";
+import * as e from "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/layout/controllable-details.tsx
+function n({ open: n, defaultOpen: r = !1, onOpenChange: i, children: a, ...o }) {
+	let [s, c] = e.useState(r), l = n !== void 0;
+	return /* @__PURE__ */ t("details", {
+		...o,
+		open: l ? n : s,
+		onToggle: (e) => {
+			let t = e.currentTarget.open;
+			l || c(t), i?.(t);
+		},
+		children: a
+	});
+}
+//#endregion
+export { n as ControllableDetails };

package/dist/src/components/layout/demo.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../showcase/create-demo.cjs");var t=e.createShowcaseDemoRegistry([e.component(`app-header`,`AppHeader`,`layout`,`Sticky product header with left, center and right slots.`)]);exports.layoutShowcaseDemoRegistry=t;

package/dist/src/components/layout/demo.js

@@ -0,0 +1,5 @@
+import { component as e, createShowcaseDemoRegistry as t } from "../../showcase/create-demo.js";
+//#region src/components/layout/demo.tsx
+var n = t([e("app-header", "AppHeader", "layout", "Sticky product header with left, center and right slots.")]);
+//#endregion
+export { n as layoutShowcaseDemoRegistry };

package/dist/src/components/layout/index.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./app-sidebar.cjs"),t=require("./breadcrumbs.cjs"),n=require("./section.cjs"),r=require("./app-header.cjs");exports.AppHeader=r.AppHeader,exports.Breadcrumbs=t.Breadcrumbs,exports.Section=n.Section,exports.Sidebar=e.Sidebar,exports.SplitLayout=n.SplitLayout,exports.Toolbar=n.Toolbar;

package/dist/src/components/layout/index.js

@@ -0,0 +1,5 @@
+import { Sidebar as e } from "./app-sidebar.js";
+import { Breadcrumbs as t } from "./breadcrumbs.js";
+import { Section as n, SplitLayout as r, Toolbar as i } from "./section.js";
+import { AppHeader as a } from "./app-header.js";
+export { a as AppHeader, t as Breadcrumbs, n as Section, e as Sidebar, r as SplitLayout, i as Toolbar };

package/dist/src/components/layout/page-container.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");var i={sm:`max-w-3xl`,md:`max-w-5xl`,lg:`max-w-6xl`,xl:`max-w-7xl`,default:`max-w-7xl`,full:`max-w-none`};function a({className:e,size:n=`default`,...a}){return(0,r.jsx)(`div`,{"data-slot":`page-container`,className:t.cn(`mx-auto flex w-full flex-col gap-4`,i[n],e),...a})}exports.PageContainer=a;

package/dist/src/components/layout/page-container.js

@@ -0,0 +1,21 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/components/layout/page-container.tsx
+var n = {
+	sm: "max-w-3xl",
+	md: "max-w-5xl",
+	lg: "max-w-6xl",
+	xl: "max-w-7xl",
+	default: "max-w-7xl",
+	full: "max-w-none"
+};
+function r({ className: r, size: i = "default", ...a }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "page-container",
+		className: e("mx-auto flex w-full flex-col gap-4", n[i], r),
+		...a
+	});
+}
+//#endregion
+export { r as PageContainer };

package/dist/src/components/layout/page-header.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("class-variance-authority"),i=require("react/jsx-runtime");var a=(0,r.cva)(`flex flex-col border transition-[background-color,border-color,box-shadow]`,{variants:{variant:{default:`border-border/75 bg-card/96 shadow-sm ring-1 ring-foreground/5`,elevated:`border-border/70 bg-card shadow-[0_1px_2px_rgba(15,23,42,0.06),0_18px_45px_rgba(15,23,42,0.08)] ring-1 ring-foreground/5`,outline:`border-border bg-transparent shadow-none`,ghost:`border-transparent bg-transparent shadow-none`,soft:`border-transparent bg-muted/45 shadow-none`},size:{sm:`gap-3 rounded-[var(--radius-2xl)] p-4`,default:`gap-4 rounded-[var(--radius-3xl)] p-5`,lg:`gap-5 rounded-[calc(var(--radius-3xl)*1.1)] p-6`},tone:{neutral:``,info:`border-blue-500/20 bg-[linear-gradient(180deg,color-mix(in_oklch,var(--card),oklch(0.94_0.03_235)_28%),var(--card))]`,success:`border-emerald-500/20 bg-[linear-gradient(180deg,color-mix(in_oklch,var(--card),oklch(0.94_0.04_155)_30%),var(--card))]`,warning:`border-amber-500/24 bg-[linear-gradient(180deg,color-mix(in_oklch,var(--card),oklch(0.94_0.05_85)_30%),var(--card))]`,danger:`border-destructive/24 bg-[linear-gradient(180deg,color-mix(in_oklch,var(--card),var(--destructive)_8%),var(--card))]`}},defaultVariants:{variant:`default`,size:`default`,tone:`neutral`}});function o({className:e,variant:n,size:r,tone:o,title:s,description:c,eyebrow:l,breadcrumbs:u,actions:d,meta:f,leading:p,footer:m,sticky:h=!1,titleClassName:g,descriptionClassName:_,actionsClassName:v,children:y,...b}){return(0,i.jsxs)(`div`,{"data-slot":`page-header`,"data-sticky":h||void 0,className:t.cn(a({variant:n,size:r,tone:o}),h&&`sticky top-0 z-30 bg-background/92 backdrop-blur supports-[backdrop-filter]:bg-background/78`,e),...b,children:[u&&(0,i.jsx)(`div`,{className:`text-sm text-muted-foreground/95`,children:u}),(0,i.jsxs)(`div`,{className:`flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between`,children:[(0,i.jsxs)(`div`,{className:`flex min-w-0 gap-4`,children:[p?(0,i.jsx)(`div`,{className:`shrink-0`,children:p}):null,(0,i.jsxs)(`div`,{className:`min-w-0 space-y-2`,children:[l&&(0,i.jsx)(`div`,{className:`text-[11px] font-semibold uppercase tracking-[0.24em] text-muted-foreground`,children:l}),s&&(0,i.jsx)(`h1`,{className:t.cn(`truncate text-3xl font-semibold tracking-[-0.03em] text-foreground`,r===`sm`&&`text-2xl`,r===`lg`&&`text-4xl`,g),children:s}),c&&(0,i.jsx)(`p`,{className:t.cn(`max-w-3xl text-sm leading-7 text-muted-foreground`,_),children:c}),f&&(0,i.jsx)(`div`,{className:`pt-1 text-sm text-muted-foreground`,children:f})]})]}),d&&(0,i.jsx)(`div`,{className:t.cn(`flex shrink-0 flex-wrap items-center gap-2.5`,v),children:d})]}),y,m&&(0,i.jsx)(`div`,{"data-slot":`page-header-footer`,className:`border-t border-border/70 pt-4`,children:m})]})}exports.PageHeader=o,exports.pageHeaderVariants=a;