@goliapkg/gds 1.4.3 → 1.5.0

package/dist/{l3-atoms-BxDg3rXt.js → l3-atoms-LtIFAn9Y.js}

@@ -8,12 +8,33 @@ import { t as l } from "./avatar-l3SaMCmU.js";
 import { n as u } from "./resize-handle-ilSc7QRM.js";
 import { t as d } from "./switch-DC85Os9r.js";
 import { r as f } from "./dom-17XgfxMq.js";
-import { forwardRef as p, useCallback as m, useEffect as h, useMemo as g, useRef as _, useState as v } from "react";
-import { jsx as y, jsxs as b } from "react/jsx-runtime";
+import { Children as p, forwardRef as m, useCallback as h, useEffect as g, useMemo as _, useRef as v, useState as y } from "react";
+import { jsx as b, jsxs as x } from "react/jsx-runtime";
+//#region src/l3-atoms/animated-border.tsx
+var S = {
+	dash: "border-2 border-dashed border-accent/40 animate-[dash-march_1s_linear_infinite]",
+	gradient: "border-0 bg-gradient-to-r from-accent via-success to-accent bg-[length:200%_100%] animate-[gradient-shift_3s_ease_infinite] p-[2px]",
+	pulse: "border-2 border-accent animate-[border-pulse_2s_ease-in-out_infinite]"
+};
+function ee({ children: t, className: n, variant: r = "gradient" }) {
+	return r === "gradient" ? /* @__PURE__ */ b("div", {
+		className: e("rounded-lg", S.gradient, n),
+		"data-component": "animated-border",
+		children: /* @__PURE__ */ b("div", {
+			className: "rounded-[calc(0.5rem-2px)] bg-bg",
+			children: t
+		})
+	}) : /* @__PURE__ */ b("div", {
+		className: e("rounded-lg", S[r], n),
+		"data-component": "animated-border",
+		children: t
+	});
+}
+//#endregion
 //#region src/l3-atoms/animated-counter.tsx
-var x = (e) => Number.isInteger(e) ? e.toLocaleString() : e.toLocaleString(void 0, { maximumFractionDigits: 2 }), S = p(function({ className: t, duration: n = 500, format: r = x, prefix: i, suffix: a, value: o, ...s }, c) {
-	let [l, u] = v(o), d = _(o), f = _(0);
-	return h(() => {
+var C = (e) => Number.isInteger(e) ? e.toLocaleString() : e.toLocaleString(void 0, { maximumFractionDigits: 2 }), w = m(function({ className: t, duration: n = 500, format: r = C, prefix: i, suffix: a, value: o, ...s }, c) {
+	let [l, u] = y(o), d = v(o), f = v(0);
+	return g(() => {
 		let e = d.current, t = o;
 		if (d.current = t, e === t) return;
 		let r = performance.now(), i = t - e, a = (o) => {
@@ -21,29 +42,29 @@ var x = (e) => Number.isInteger(e) ? e.toLocaleString() : e.toLocaleString(void
 			u(e + i * (1 - (1 - c) ** 3)), c < 1 ? f.current = requestAnimationFrame(a) : u(t);
 		};
 		return f.current = requestAnimationFrame(a), () => cancelAnimationFrame(f.current);
-	}, [o, n]), /* @__PURE__ */ b("span", {
+	}, [o, n]), /* @__PURE__ */ x("span", {
 		className: e("tabular-nums select-none", t),
 		"data-component": "animated-counter",
 		ref: c,
 		...s,
 		children: [
-			i !== void 0 && /* @__PURE__ */ y("span", { children: i }),
+			i !== void 0 && /* @__PURE__ */ b("span", { children: i }),
 			r(l),
-			a !== void 0 && /* @__PURE__ */ y("span", { children: a })
+			a !== void 0 && /* @__PURE__ */ b("span", { children: a })
 		]
 	});
 });
 //#endregion
 //#region src/l3-atoms/animated-number.tsx
-function ee(e) {
+function T(e) {
 	return e.toLocaleString();
 }
 function te(e) {
 	return 1 - (1 - e) ** 3;
 }
-var ne = p(function({ value: t, duration: n = 500, format: r = ee, className: i }, a) {
-	let [o, s] = v(t), c = _(t);
-	return h(() => {
+var ne = m(function({ value: t, duration: n = 500, format: r = T, className: i }, a) {
+	let [o, s] = y(t), c = v(t);
+	return g(() => {
 		let e = c.current;
 		if (c.current = t, n <= 0) {
 			s(t);
@@ -55,19 +76,19 @@ var ne = p(function({ value: t, duration: n = 500, format: r = ee, className: i
 			s(e + (t - e) * te(l)), l < 1 && (i = requestAnimationFrame(a));
 		}
 		return i = requestAnimationFrame(a), () => cancelAnimationFrame(i);
-	}, [t, n]), /* @__PURE__ */ y("span", {
+	}, [t, n]), /* @__PURE__ */ b("span", {
 		ref: a,
 		className: e("tabular-nums", i),
 		"data-component": "animated-number",
 		children: r(o)
 	});
-}), re = p(function({ count: t, maxCount: n = 99, className: r, ...i }, o) {
+}), re = m(function({ count: t, maxCount: n = 99, className: r, ...i }, o) {
 	let s = t !== void 0 && t > 0;
-	return /* @__PURE__ */ b("span", {
+	return /* @__PURE__ */ x("span", {
 		className: e("relative inline-flex", r),
 		"data-component": "avatar-badge",
 		ref: o,
-		children: [/* @__PURE__ */ y(l, { ...i }), s && /* @__PURE__ */ y(a, {
+		children: [/* @__PURE__ */ b(l, { ...i }), s && /* @__PURE__ */ b(a, {
 			className: "absolute -top-1 -right-1 z-10",
 			count: t,
 			countMax: n
@@ -85,8 +106,8 @@ function ie(e) {
 	}
 	return t.push(3, 1, 1, 1, 3), t;
 }
-var ae = p(function({ value: t, width: n = 200, height: r = 60, showValue: i = !0, color: a = "currentColor", className: o }, s) {
-	let c = g(() => ie(t), [t]), l = c.reduce((e, t) => e + t, 0), u = i ? r - 16 : r, d = n / l, f = 0, p = [];
+var ae = m(function({ value: t, width: n = 200, height: r = 60, showValue: i = !0, color: a = "currentColor", className: o }, s) {
+	let c = _(() => ie(t), [t]), l = c.reduce((e, t) => e + t, 0), u = i ? r - 16 : r, d = n / l, f = 0, p = [];
 	for (let e = 0; e < c.length; e++) {
 		let t = c[e] * d;
 		e % 2 == 0 && p.push({
@@ -94,7 +115,7 @@ var ae = p(function({ value: t, width: n = 200, height: r = 60, showValue: i = !
 			w: t
 		}), f += t;
 	}
-	return /* @__PURE__ */ b("svg", {
+	return /* @__PURE__ */ x("svg", {
 		ref: s,
 		width: n,
 		height: r,
@@ -104,13 +125,13 @@ var ae = p(function({ value: t, width: n = 200, height: r = 60, showValue: i = !
 		"data-testid": "barcode-svg",
 		role: "img",
 		"aria-label": `Barcode: ${t}`,
-		children: [p.map((e, t) => /* @__PURE__ */ y("rect", {
+		children: [p.map((e, t) => /* @__PURE__ */ b("rect", {
 			x: e.x,
 			y: 0,
 			width: e.w,
 			height: u,
 			fill: a
-		}, t)), i && /* @__PURE__ */ y("text", {
+		}, t)), i && /* @__PURE__ */ b("text", {
 			x: n / 2,
 			y: r - 2,
 			textAnchor: "middle",
@@ -125,145 +146,145 @@ var ae = p(function({ value: t, width: n = 200, height: r = 60, showValue: i = !
 	default: "animate-pulse",
 	fast: "animate-pulse [animation-duration:0.5s]",
 	slow: "animate-pulse [animation-duration:3s]"
-}, C = p(function({ active: t = !0, children: n, className: r, speed: i = "default", ...a }, o) {
-	return /* @__PURE__ */ y("span", {
+}, se = m(function({ active: t = !0, children: n, className: r, speed: i = "default", ...a }, o) {
+	return /* @__PURE__ */ b("span", {
 		className: e(t && oe[i], r),
 		"data-component": "blinking",
 		ref: o,
 		...a,
 		children: n
 	});
-}), se = {
+}), ce = {
 	default: "h-2 w-2",
 	lg: "h-3 w-3",
 	sm: "h-1.5 w-1.5"
-}, ce = p(function({ className: t, color: n, count: r = 3, size: i = "default", ...a }, o) {
+}, le = m(function({ className: t, color: n, count: r = 3, size: i = "default", ...a }, o) {
 	let s = Array.from({ length: r }, (e, t) => t);
-	return /* @__PURE__ */ y("div", {
+	return /* @__PURE__ */ b("div", {
 		className: e("inline-flex items-center gap-1", t),
 		"data-component": "bounce-dot",
 		ref: o,
 		role: "status",
 		...a,
-		children: s.map((t) => /* @__PURE__ */ y("span", {
-			className: e("animate-[bounce-dot_1.4s_ease-in-out_infinite] rounded-full bg-fg-muted", se[i]),
+		children: s.map((t) => /* @__PURE__ */ b("span", {
+			className: e("animate-[bounce-dot_1.4s_ease-in-out_infinite] rounded-full bg-fg-muted", ce[i]),
 			style: {
 				animationDelay: `${t * 160}ms`,
 				...n === void 0 ? {} : { backgroundColor: n }
 			}
 		}, t))
 	});
-}), le = p(function({ className: t, disabled: n = !1, onChange: r, options: i, selectAll: a = !1, value: o, ...s }, c) {
+}), ue = m(function({ className: t, disabled: n = !1, onChange: r, options: i, selectAll: a = !1, value: o, ...s }, c) {
 	let l = i.length > 0 && i.every((e) => o.includes(e.value)), d = (e, t) => {
 		r(t ? [...o, e] : o.filter((t) => t !== e));
 	}, f = (e) => {
 		r(e ? i.map((e) => e.value) : []);
 	};
-	return /* @__PURE__ */ b("div", {
+	return /* @__PURE__ */ x("div", {
 		ref: c,
 		className: e("flex flex-col gds-gap", t),
 		"data-component": "checkbox-group",
 		role: "group",
 		...s,
-		children: [a && /* @__PURE__ */ y(u, {
+		children: [a && /* @__PURE__ */ b(u, {
 			checked: l,
 			disabled: n,
 			label: "Select all",
 			onChange: f
-		}), i.map((e) => /* @__PURE__ */ y(u, {
+		}), i.map((e) => /* @__PURE__ */ b(u, {
 			checked: o.includes(e.value),
 			disabled: n,
 			label: e.label,
 			onChange: (t) => d(e.value, t)
 		}, e.value))]
 	});
-}), w = n("rounded-md", {
+}), E = n("rounded-md", {
 	defaultVariants: { size: "default" },
 	variants: { size: {
 		default: "h-10 w-10",
 		lg: "h-14 w-14",
 		sm: "h-7 w-7"
 	} }
-}), T = p(function({ className: t, color: n, copyable: r = !1, label: a, size: o, ...s }, c) {
-	let [l, u] = v(!1), d = _(null), f = m(async () => {
+}), de = m(function({ className: t, color: n, copyable: r = !1, label: a, size: o, ...s }, c) {
+	let [l, u] = y(!1), d = v(null), f = h(async () => {
 		r && (await navigator.clipboard.writeText(n), u(!0), d.current !== null && clearTimeout(d.current), d.current = setTimeout(() => {
 			u(!1), d.current = null;
 		}, 2e3));
-	}, [n, r]), p = /* @__PURE__ */ y("span", {
-		className: e(w({ size: o }), "block"),
+	}, [n, r]), p = /* @__PURE__ */ b("span", {
+		className: e(E({ size: o }), "block"),
 		style: { backgroundColor: n }
 	});
-	return /* @__PURE__ */ b("span", {
+	return /* @__PURE__ */ x("span", {
 		className: e("inline-flex flex-col items-center gap-1", t),
 		"data-component": "color-swatch",
 		ref: c,
 		...s,
 		children: [
-			r ? /* @__PURE__ */ y("button", {
+			r ? /* @__PURE__ */ b("button", {
 				"aria-label": `Copy ${n}`,
 				className: e("rounded-md select-none", i),
 				onClick: f,
 				type: "button",
 				children: p
 			}) : p,
-			/* @__PURE__ */ y("span", {
+			/* @__PURE__ */ b("span", {
 				className: "font-mono text-[10px] text-fg-muted",
 				children: l ? "Copied!" : n
 			}),
-			a !== void 0 && /* @__PURE__ */ y("span", {
+			a !== void 0 && /* @__PURE__ */ b("span", {
 				className: "text-[10px] text-fg-muted/60",
 				children: a
 			})
 		]
 	});
-}), ue = p(function({ text: t, label: n = "Copy", copiedLabel: i = "Copied!", variant: a = "default", size: o = "default", className: s }, c) {
-	let [l, u] = v(!1), d = _(null);
-	h(() => () => {
+}), fe = m(function({ text: t, label: n = "Copy", copiedLabel: i = "Copied!", variant: a = "default", size: o = "default", className: s }, c) {
+	let [l, u] = y(!1), d = v(null);
+	g(() => () => {
 		d.current !== null && clearTimeout(d.current);
 	}, []);
-	let f = m(() => {
+	let f = h(() => {
 		navigator.clipboard.writeText(t).catch(() => {}), u(!0), d.current !== null && clearTimeout(d.current), d.current = setTimeout(() => u(!1), 1500);
 	}, [t]);
-	return /* @__PURE__ */ y(r, {
+	return /* @__PURE__ */ b(r, {
 		ref: c,
 		variant: a === "ghost" ? "ghost" : "secondary",
 		size: o,
 		className: e(s),
 		onClick: f,
 		"data-component": "copy-button",
-		icon: l ? /* @__PURE__ */ y("svg", {
+		icon: l ? /* @__PURE__ */ b("svg", {
 			width: "14",
 			height: "14",
 			viewBox: "0 0 14 14",
 			fill: "none",
 			stroke: "currentColor",
 			strokeWidth: "2",
-			children: /* @__PURE__ */ y("path", { d: "M2 7l3 3 7-7" })
-		}) : /* @__PURE__ */ b("svg", {
+			children: /* @__PURE__ */ b("path", { d: "M2 7l3 3 7-7" })
+		}) : /* @__PURE__ */ x("svg", {
 			width: "14",
 			height: "14",
 			viewBox: "0 0 14 14",
 			fill: "none",
 			stroke: "currentColor",
 			strokeWidth: "1.5",
-			children: [/* @__PURE__ */ y("rect", {
+			children: [/* @__PURE__ */ b("rect", {
 				x: "4",
 				y: "4",
 				width: "8",
 				height: "8",
 				rx: "1.5"
-			}), /* @__PURE__ */ y("path", { d: "M10 4V2.5A1.5 1.5 0 008.5 1h-6A1.5 1.5 0 001 2.5v6A1.5 1.5 0 002.5 10H4" })]
+			}), /* @__PURE__ */ b("path", { d: "M10 4V2.5A1.5 1.5 0 008.5 1h-6A1.5 1.5 0 001 2.5v6A1.5 1.5 0 002.5 10H4" })]
 		}),
 		children: l ? i : n
 	});
-}), de = {
+}), pe = {
 	accent: "bg-accent text-accent-fg",
 	danger: "bg-danger text-white",
 	success: "bg-success text-white"
-}, fe = p(function({ className: t, count: n, max: r = 99, variant: i = "danger", ...a }, o) {
+}, me = m(function({ className: t, count: n, max: r = 99, variant: i = "danger", ...a }, o) {
 	let s = n > r ? `${r}+` : String(n);
-	return /* @__PURE__ */ y("span", {
-		className: e("inline-flex min-w-5 select-none items-center justify-center rounded-full px-1.5 py-0.5 text-[10px] font-bold leading-none", de[i], t),
+	return /* @__PURE__ */ b("span", {
+		className: e("inline-flex min-w-5 select-none items-center justify-center rounded-full px-1.5 py-0.5 text-[10px] font-bold leading-none", pe[i], t),
 		"data-component": "count-badge",
 		"data-variant": i,
 		ref: o,
@@ -273,19 +294,19 @@ var ae = p(function({ value: t, width: n = 200, height: r = 60, showValue: i = !
 });
 //#endregion
 //#region src/l3-atoms/count-up.tsx
-function pe(e, t, n) {
+function he(e, t, n) {
 	let r = e.toFixed(t);
 	if (n === "") return r;
 	let [i, a] = r.split("."), o = i.replace(/\B(?=(\d{3})+(?!\d))/g, n);
 	return a === void 0 ? o : `${o}.${a}`;
 }
-function me(e) {
+function ge(e) {
 	let t = e - 1;
 	return t * t * t + 1;
 }
-var he = p(function({ value: t, duration: n = 1500, decimals: r = 0, prefix: i, suffix: a, separator: o = ",", className: s }, c) {
-	let [l, u] = v(0);
-	return h(() => {
+var _e = m(function({ value: t, duration: n = 1500, decimals: r = 0, prefix: i, suffix: a, separator: o = ",", className: s }, c) {
+	let [l, u] = y(0);
+	return g(() => {
 		if (n <= 0) {
 			u(t);
 			return;
@@ -293,23 +314,23 @@ var he = p(function({ value: t, duration: n = 1500, decimals: r = 0, prefix: i,
 		let e = performance.now(), r;
 		function i(a) {
 			let o = a - e, s = Math.min(o / n, 1);
-			u(me(s) * t), s < 1 && (r = requestAnimationFrame(i));
+			u(ge(s) * t), s < 1 && (r = requestAnimationFrame(i));
 		}
 		return r = requestAnimationFrame(i), () => cancelAnimationFrame(r);
-	}, [t, n]), /* @__PURE__ */ b("span", {
+	}, [t, n]), /* @__PURE__ */ x("span", {
 		ref: c,
 		className: e("tabular-nums", s),
 		"data-component": "count-up",
 		children: [
 			i ?? "",
-			pe(l, r, o),
+			he(l, r, o),
 			a ?? ""
 		]
 	});
 });
 //#endregion
 //#region src/l3-atoms/countdown.tsx
-function E(e) {
+function D(e) {
 	let t = Math.max(0, e - Date.now()), n = Math.floor(t / 1e3 % 60), r = Math.floor(t / 1e3 / 60 % 60), i = Math.floor(t / 1e3 / 60 / 60 % 24);
 	return {
 		days: Math.floor(t / 1e3 / 60 / 60 / 24),
@@ -319,15 +340,15 @@ function E(e) {
 		total: t
 	};
 }
-function D(e) {
+function O(e) {
 	return e.toString().padStart(2, "0");
 }
-var O = p(function({ targetDate: t, onComplete: n, showDays: r = !0, showSeconds: i = !0, className: a }, o) {
-	let s = new Date(t).getTime(), [c, l] = v(() => E(s));
-	h(() => {
+var k = m(function({ targetDate: t, onComplete: n, showDays: r = !0, showSeconds: i = !0, className: a }, o) {
+	let s = new Date(t).getTime(), [c, l] = y(() => D(s));
+	g(() => {
 		if (c.total <= 0) return;
 		let e = setInterval(() => {
-			let t = E(s);
+			let t = D(s);
 			l(t), t.total <= 0 && (clearInterval(e), n !== void 0 && n());
 		}, 1e3);
 		return () => clearInterval(e);
@@ -339,67 +360,67 @@ var O = p(function({ targetDate: t, onComplete: n, showDays: r = !0, showSeconds
 	let u = [];
 	return r && u.push({
 		label: "D",
-		value: D(c.days)
+		value: O(c.days)
 	}), u.push({
 		label: "H",
-		value: D(c.hours)
+		value: O(c.hours)
 	}), u.push({
 		label: "M",
-		value: D(c.minutes)
+		value: O(c.minutes)
 	}), i && u.push({
 		label: "S",
-		value: D(c.seconds)
-	}), /* @__PURE__ */ y("div", {
+		value: O(c.seconds)
+	}), /* @__PURE__ */ b("div", {
 		ref: o,
 		className: e("inline-flex items-center gap-1", a),
 		"data-component": "countdown",
-		children: u.map((e, t) => /* @__PURE__ */ b("div", {
+		children: u.map((e, t) => /* @__PURE__ */ x("div", {
 			className: "flex items-center gap-1",
-			children: [t > 0 && /* @__PURE__ */ y("span", {
+			children: [t > 0 && /* @__PURE__ */ b("span", {
 				className: "text-fg-muted gds-text-body",
 				"data-testid": "separator",
 				children: ":"
-			}), /* @__PURE__ */ y("span", {
+			}), /* @__PURE__ */ b("span", {
 				className: "inline-flex items-center justify-center rounded bg-bg-tertiary px-1.5 py-0.5 tabular-nums gds-radius-button gds-text-body text-fg",
 				"data-testid": `segment-${e.label}`,
 				children: e.value
 			})]
 		}, e.label))
 	});
-}), k = n("inline-flex select-none items-center justify-center rounded-full text-[10px] font-bold text-accent-fg min-w-[18px] h-[18px] px-1", {
+}), A = n("inline-flex select-none items-center justify-center rounded-full text-[10px] font-bold text-accent-fg min-w-[18px] h-[18px] px-1", {
 	defaultVariants: { variant: "default" },
 	variants: { variant: {
 		danger: "bg-danger animate-pulse",
 		default: "bg-accent"
 	} }
-}), A = p(function({ className: t, count: n, max: r = 99, variant: i, ...a }, o) {
+}), j = m(function({ className: t, count: n, max: r = 99, variant: i, ...a }, o) {
 	if (n <= 0) return null;
 	let s = n > r ? `${r}+` : String(n);
-	return /* @__PURE__ */ y("span", {
-		className: e(k({ variant: i }), t),
+	return /* @__PURE__ */ b("span", {
+		className: e(A({ variant: i }), t),
 		"data-component": "countdown-badge",
 		ref: o,
 		...a,
 		children: s
 	});
-}), j = p(function({ children: t, className: n, offset: r, smooth: i = !0, ...a }, o) {
-	let s = _(null), [c, l] = v({
+}), M = m(function({ children: t, className: n, offset: r, smooth: i = !0, ...a }, o) {
+	let s = v(null), [c, l] = y({
 		x: 0,
 		y: 0
-	}), u = r?.x ?? 0, d = r?.y ?? 0, p = m((e) => {
+	}), u = r?.x ?? 0, d = r?.y ?? 0, p = h((e) => {
 		let t = s.current?.getBoundingClientRect();
 		t !== void 0 && l({
 			x: e.clientX - t.left + u,
 			y: e.clientY - t.top + d
 		});
 	}, [u, d]);
-	return /* @__PURE__ */ y("div", {
+	return /* @__PURE__ */ b("div", {
 		className: e("relative", n),
 		"data-component": "cursor-follow",
 		onMouseMove: p,
 		ref: f(s, o),
 		...a,
-		children: /* @__PURE__ */ y("div", {
+		children: /* @__PURE__ */ b("div", {
 			className: "pointer-events-none absolute",
 			style: {
 				transform: `translate(${c.x}px, ${c.y}px)`,
@@ -408,9 +429,9 @@ var O = p(function({ targetDate: t, onComplete: n, showDays: r = !0, showSeconds
 			children: t
 		})
 	});
-}), M = p(function({ className: t, inverted: n = !1, unit: r, value: i, ...a }, o) {
+}), N = m(function({ className: t, inverted: n = !1, unit: r, value: i, ...a }, o) {
 	let s = i > 0, c = i < 0, l = (n ? c : s) ? "text-success" : (n ? s : c) ? "text-danger" : "text-fg-muted", u = `${s ? "↑" : c ? "↓" : ""}${s ? "+" : ""}${i}${r === void 0 ? "" : r}`;
-	return /* @__PURE__ */ y("span", {
+	return /* @__PURE__ */ b("span", {
 		className: e("inline-flex items-center gap-0.5 text-sm font-medium tabular-nums", l, t),
 		"data-component": "diff-indicator",
 		"data-direction": s ? "up" : c ? "down" : "neutral",
@@ -418,25 +439,25 @@ var O = p(function({ targetDate: t, onComplete: n, showDays: r = !0, showSeconds
 		...a,
 		children: u
 	});
-}), N = {
+}), P = {
 	accent: "bg-accent shadow-[0_0_6px_var(--color-accent)]",
 	success: "bg-success shadow-[0_0_6px_var(--color-success)]",
 	warning: "bg-warning shadow-[0_0_6px_var(--color-warning)]",
 	danger: "bg-danger shadow-[0_0_6px_var(--color-danger)]"
-}, P = {
+}, F = {
 	sm: "h-1.5 w-1.5",
 	default: "h-2.5 w-2.5",
 	lg: "h-3.5 w-3.5"
-}, F = p(function({ color: t = "accent", size: n = "default", className: r, ...i }, a) {
-	return /* @__PURE__ */ y("span", {
+}, I = m(function({ color: t = "accent", size: n = "default", className: r, ...i }, a) {
+	return /* @__PURE__ */ b("span", {
 		ref: a,
-		className: e("inline-block rounded-full", N[t], P[n], r),
+		className: e("inline-block rounded-full", P[t], F[n], r),
 		"data-component": "glow-dot",
 		"data-variant": t,
 		...i
 	});
-}), I = p(function({ children: t, className: n, from: r = "#6366f1", to: i = "#ec4899", ...a }, o) {
-	return /* @__PURE__ */ y("span", {
+}), ve = m(function({ children: t, className: n, from: r = "#6366f1", to: i = "#ec4899", ...a }, o) {
+	return /* @__PURE__ */ b("span", {
 		className: e("inline-block bg-clip-text text-transparent", n),
 		"data-component": "gradient-text",
 		ref: o,
@@ -444,9 +465,9 @@ var O = p(function({ targetDate: t, onComplete: n, showDays: r = !0, showSeconds
 		...a,
 		children: t
 	});
-}), L = p(function({ className: t, color: n = "var(--color-accent)", max: r = 100, showValue: i = !1, size: a = 32, value: o, ...s }, c) {
+}), ye = m(function({ className: t, color: n = "var(--color-accent)", max: r = 100, showValue: i = !1, size: a = 32, value: o, ...s }, c) {
 	let l = r > 0 ? Math.min(Math.max(o / r, 0), 1) : 0;
-	return /* @__PURE__ */ y("div", {
+	return /* @__PURE__ */ b("div", {
 		className: e("inline-flex items-center justify-center rounded text-[10px] font-medium", t),
 		"data-component": "heat-cell",
 		ref: c,
@@ -457,98 +478,98 @@ var O = p(function({ targetDate: t, onComplete: n, showDays: r = !0, showSeconds
 			width: a
 		},
 		...s,
-		children: i && /* @__PURE__ */ y("span", {
+		children: i && /* @__PURE__ */ b("span", {
 			className: "text-white mix-blend-difference",
 			children: o
 		})
 	});
-}), R = p(function({ className: t, keys: n, ...r }, i) {
-	return /* @__PURE__ */ y("span", {
+}), be = m(function({ className: t, keys: n, ...r }, i) {
+	return /* @__PURE__ */ b("span", {
 		className: e("inline-flex items-center gap-1", t),
 		"data-component": "hotkey",
 		ref: i,
 		...r,
-		children: n.map((e, t) => /* @__PURE__ */ b("span", {
+		children: n.map((e, t) => /* @__PURE__ */ x("span", {
 			className: "contents",
-			children: [t > 0 && /* @__PURE__ */ y("span", {
+			children: [t > 0 && /* @__PURE__ */ b("span", {
 				className: "text-[10px] text-fg-muted",
 				children: "+"
-			}), /* @__PURE__ */ y(o, { children: e })]
+			}), /* @__PURE__ */ b(o, { children: e })]
 		}, t))
 	});
-}), ge = {
+}), xe = {
 	bottom: "top-full left-1/2 -translate-x-1/2 mt-2",
 	left: "right-full top-1/2 -translate-y-1/2 mr-2",
 	right: "left-full top-1/2 -translate-y-1/2 ml-2",
 	top: "bottom-full left-1/2 -translate-x-1/2 mb-2"
-}, _e = {
+}, Se = {
 	bottom: "bottom-full left-1/2 -translate-x-1/2 border-b-bg-tertiary border-x-transparent border-t-transparent border-4",
 	left: "left-full top-1/2 -translate-y-1/2 border-l-bg-tertiary border-y-transparent border-r-transparent border-4",
 	right: "right-full top-1/2 -translate-y-1/2 border-r-bg-tertiary border-y-transparent border-l-transparent border-4",
 	top: "top-full left-1/2 -translate-x-1/2 border-t-bg-tertiary border-x-transparent border-b-transparent border-4"
-}, z = p(function({ children: n, className: r, content: i, delay: a = 300, glass: o, interactive: s = !1, maxWidth: c, placement: l = "top", ...u }, d) {
-	let [f, p] = v(!1), h = _(void 0), g = _(void 0), x = m(() => {
-		clearTimeout(g.current), h.current = setTimeout(() => p(!0), a);
-	}, [a]), S = m(() => {
-		clearTimeout(h.current), s ? g.current = setTimeout(() => p(!1), 150) : p(!1);
+}, L = m(function({ children: n, className: r, content: i, delay: a = 300, glass: o, interactive: s = !1, maxWidth: c, placement: l = "top", ...u }, d) {
+	let [f, p] = y(!1), m = v(void 0), g = v(void 0), _ = h(() => {
+		clearTimeout(g.current), m.current = setTimeout(() => p(!0), a);
+	}, [a]), S = h(() => {
+		clearTimeout(m.current), s ? g.current = setTimeout(() => p(!1), 150) : p(!1);
 	}, [s]);
-	return /* @__PURE__ */ b("div", {
+	return /* @__PURE__ */ x("div", {
 		className: e("relative inline-flex", r),
 		"data-component": "tooltip",
 		"data-state": f ? "open" : "closed",
-		onMouseEnter: x,
+		onMouseEnter: _,
 		onMouseLeave: S,
 		ref: d,
 		...u,
-		children: [n, f && /* @__PURE__ */ b("div", {
+		children: [n, f && /* @__PURE__ */ x("div", {
 			className: e("pointer-events-none absolute z-50 animate-popup whitespace-nowrap gds-radius-tooltip gds-pad-x-sm gds-pad-y-sm gds-text-label text-fg", s && "pointer-events-auto", o === !0 ? t(o) : "bg-bg-tertiary", o === !0 && "border border-white/10"),
-			onMouseEnter: s ? x : void 0,
+			onMouseEnter: s ? _ : void 0,
 			onMouseLeave: s ? S : void 0,
 			style: c === void 0 ? void 0 : {
 				maxWidth: c,
 				whiteSpace: "normal"
 			},
-			children: [/* @__PURE__ */ y("span", { className: e("absolute", _e[l]) }), /* @__PURE__ */ y("span", {
-				className: (ge[l], ""),
+			children: [/* @__PURE__ */ b("span", { className: e("absolute", Se[l]) }), /* @__PURE__ */ b("span", {
+				className: (xe[l], ""),
 				children: i
 			})]
 		})]
 	});
-}), ve = {
+}), Ce = {
 	default: "h-4 w-4",
 	sm: "h-3.5 w-3.5"
-}, ye = p(function({ className: t, content: n, size: r = "default", ...i }, a) {
-	return /* @__PURE__ */ y(z, {
+}, we = m(function({ className: t, content: n, size: r = "default", ...i }, a) {
+	return /* @__PURE__ */ b(L, {
 		content: n,
 		ref: a,
 		...i,
-		children: /* @__PURE__ */ y("span", {
+		children: /* @__PURE__ */ b("span", {
 			className: e("inline-flex cursor-help items-center text-fg-muted/60 hover:text-fg-muted", t),
 			"data-component": "info-tip",
-			children: /* @__PURE__ */ b("svg", {
-				className: ve[r],
+			children: /* @__PURE__ */ x("svg", {
+				className: Ce[r],
 				fill: "none",
 				stroke: "currentColor",
 				strokeWidth: "2",
 				viewBox: "0 0 24 24",
-				children: [/* @__PURE__ */ y("circle", {
+				children: [/* @__PURE__ */ b("circle", {
 					cx: "12",
 					cy: "12",
 					r: "10"
-				}), /* @__PURE__ */ y("path", { d: "M12 16v-4M12 8h.01" })]
+				}), /* @__PURE__ */ b("path", { d: "M12 16v-4M12 8h.01" })]
 			})
 		})
 	});
-}), be = p(function({ label: t, value: n, mono: r = !1, className: i, ...a }, o) {
-	return /* @__PURE__ */ b("div", {
+}), Te = m(function({ label: t, value: n, mono: r = !1, className: i, ...a }, o) {
+	return /* @__PURE__ */ x("div", {
 		ref: o,
 		className: e("inline-flex items-baseline gap-1.5 gds-text-body", i),
 		"data-component": "key-value",
 		...a,
-		children: [/* @__PURE__ */ y("span", {
+		children: [/* @__PURE__ */ b("span", {
 			className: "shrink-0 text-fg-muted gds-text-caption",
 			children: t
-		}), /* @__PURE__ */ y("span", {
+		}), /* @__PURE__ */ b("span", {
 			className: e("text-fg", r && "font-mono"),
 			children: n
 		})]
@@ -556,7 +577,7 @@ var O = p(function({ targetDate: t, onComplete: n, showDays: r = !0, showSeconds
 });
 //#endregion
 //#region src/l3-atoms/keyboard-shortcut.tsx
-function xe(e) {
+function Ee(e) {
 	let t = e.toLowerCase().split("+"), n = {
 		ctrl: !1,
 		meta: !1,
@@ -569,7 +590,7 @@ function xe(e) {
 		mainKey: r
 	};
 }
-function Se(e) {
+function De(e) {
 	return {
 		ctrl: "Ctrl",
 		meta: "⌘",
@@ -578,8 +599,8 @@ function Se(e) {
 		alt: "Alt"
 	}[e.toLowerCase()] ?? e.toUpperCase();
 }
-var Ce = p(function({ keys: t, onTrigger: n, showBadge: r = !1, disabled: i = !1, className: a }, s) {
-	let { modifiers: c, mainKey: l } = xe(t), u = m((e) => {
+var Oe = m(function({ keys: t, onTrigger: n, showBadge: r = !1, disabled: i = !1, className: a }, s) {
+	let { modifiers: c, mainKey: l } = Ee(t), u = h((e) => {
 		i || e.ctrlKey === c.ctrl && e.metaKey === c.meta && e.shiftKey === c.shift && e.altKey === c.alt && e.key.toLowerCase() === l && (e.preventDefault(), n());
 	}, [
 		i,
@@ -590,33 +611,33 @@ var Ce = p(function({ keys: t, onTrigger: n, showBadge: r = !1, disabled: i = !1
 		l,
 		n
 	]);
-	if (h(() => (window.addEventListener("keydown", u), () => window.removeEventListener("keydown", u)), [u]), !r) return null;
-	let d = t.split("+").map((e, t) => /* @__PURE__ */ y(o, { children: Se(e) }, t));
-	return /* @__PURE__ */ y("span", {
+	if (g(() => (window.addEventListener("keydown", u), () => window.removeEventListener("keydown", u)), [u]), !r) return null;
+	let d = t.split("+").map((e, t) => /* @__PURE__ */ b(o, { children: De(e) }, t));
+	return /* @__PURE__ */ b("span", {
 		ref: s,
 		className: e("inline-flex items-center gap-1", a),
 		"data-component": "keyboard-shortcut",
 		children: d
 	});
-}), we = p(function({ className: t, label: n = "LIVE", ...r }, i) {
-	return /* @__PURE__ */ b("span", {
+}), ke = m(function({ className: t, label: n = "LIVE", ...r }, i) {
+	return /* @__PURE__ */ x("span", {
 		className: e("inline-flex items-center gap-1.5", t),
 		"data-component": "live-dot",
 		ref: i,
 		...r,
-		children: [/* @__PURE__ */ b("span", {
+		children: [/* @__PURE__ */ x("span", {
 			className: "relative flex h-2 w-2",
-			children: [/* @__PURE__ */ y("span", { className: "absolute inline-flex h-full w-full animate-ping rounded-full bg-danger opacity-75" }), /* @__PURE__ */ y("span", { className: "relative inline-flex h-2 w-2 rounded-full bg-danger" })]
-		}), /* @__PURE__ */ y("span", {
+			children: [/* @__PURE__ */ b("span", { className: "absolute inline-flex h-full w-full animate-ping rounded-full bg-danger opacity-75" }), /* @__PURE__ */ b("span", { className: "relative inline-flex h-2 w-2 rounded-full bg-danger" })]
+		}), /* @__PURE__ */ b("span", {
 			className: "text-xs font-bold uppercase tracking-wide text-danger",
 			children: n
 		})]
 	});
-}), Te = p(function({ children: t, strength: n = .3, radius: r = 100, className: i }, a) {
-	let o = _(null), [s, c] = v({
+}), Ae = m(function({ children: t, strength: n = .3, radius: r = 100, className: i }, a) {
+	let o = v(null), [s, c] = y({
 		x: 0,
 		y: 0
-	}), l = m((e) => {
+	}), l = h((e) => {
 		let t = o.current;
 		if (t === null) return;
 		let i = t.getBoundingClientRect(), a = i.left + i.width / 2, s = i.top + i.height / 2, l = e.clientX - a, u = e.clientY - s;
@@ -631,13 +652,13 @@ var Ce = p(function({ keys: t, onTrigger: n, showBadge: r = !1, disabled: i = !1
 			x: l * n,
 			y: u * n
 		});
-	}, [n, r]), u = m(() => {
+	}, [n, r]), u = h(() => {
 		c({
 			x: 0,
 			y: 0
 		});
 	}, []);
-	return /* @__PURE__ */ y("div", {
+	return /* @__PURE__ */ b("div", {
 		ref: f(o, a),
 		"data-component": "magnetic-button",
 		className: e("inline-block", i),
@@ -649,19 +670,19 @@ var Ce = p(function({ keys: t, onTrigger: n, showBadge: r = !1, disabled: i = !1
 		onMouseLeave: u,
 		children: t
 	});
-}), Ee = p(function({ children: t, speed: n = 30, direction: r = "left", pauseOnHover: i = !0, className: a }, o) {
-	let s = _(null), [c, l] = v(10);
-	h(() => {
+}), je = m(function({ children: t, speed: n = 30, direction: r = "left", pauseOnHover: i = !0, className: a }, o) {
+	let s = v(null), [c, l] = y(10);
+	g(() => {
 		if (s.current === null) return;
 		let e = s.current.scrollWidth / 2;
 		e > 0 && l(e / n);
 	}, [n, t]);
 	let u = r === "left" ? "0%" : "-50%", d = r === "left" ? "-50%" : "0%";
-	return /* @__PURE__ */ y("div", {
+	return /* @__PURE__ */ b("div", {
 		ref: o,
 		className: e("overflow-hidden", a),
 		"data-component": "marquee",
-		children: /* @__PURE__ */ b("div", {
+		children: /* @__PURE__ */ x("div", {
 			ref: s,
 			className: e("inline-flex will-change-transform", i && "hover:[animation-play-state:paused]"),
 			style: {
@@ -669,109 +690,157 @@ var Ce = p(function({ keys: t, onTrigger: n, showBadge: r = !1, disabled: i = !1
 				"--marquee-from": u,
 				"--marquee-to": d
 			},
-			children: [/* @__PURE__ */ y("div", {
+			children: [/* @__PURE__ */ b("div", {
 				className: "flex shrink-0",
 				children: t
-			}), /* @__PURE__ */ y("div", {
+			}), /* @__PURE__ */ b("div", {
 				className: "flex shrink-0",
 				"aria-hidden": !0,
 				children: t
 			})]
 		})
 	});
-}), B = n("overflow-hidden gds-radius-badge bg-bg-tertiary", {
+}), R = n("overflow-hidden gds-radius-badge bg-bg-tertiary", {
 	defaultVariants: { size: "default" },
 	variants: { size: {
 		default: "h-2.5",
 		lg: "h-4",
 		sm: "h-1.5"
 	} }
-}), De = {
+}), Me = {
 	danger: "bg-danger",
 	default: "bg-accent",
 	success: "bg-success",
 	warning: "bg-warning"
 };
-function Oe(e) {
+function Ne(e) {
 	return e >= .8 ? "bg-danger" : e >= .6 ? "bg-warning" : e >= .4 ? "bg-accent" : "bg-success";
 }
-var ke = p(function({ className: t, label: n, max: r = 100, min: i = 0, showValue: a = !0, size: o, value: s, variant: c = "auto", ...l }, u) {
-	let d = r - i, f = d > 0 ? Math.max(0, Math.min(1, (s - i) / d)) : 0, p = c === "auto" ? Oe(f) : De[c] ?? "bg-accent";
-	return /* @__PURE__ */ b("div", {
+var Pe = m(function({ className: t, label: n, max: r = 100, min: i = 0, showValue: a = !0, size: o, value: s, variant: c = "auto", ...l }, u) {
+	let d = r - i, f = d > 0 ? Math.max(0, Math.min(1, (s - i) / d)) : 0, p = c === "auto" ? Ne(f) : Me[c] ?? "bg-accent";
+	return /* @__PURE__ */ x("div", {
 		className: e("w-full", t),
 		"data-component": "meter",
 		ref: u,
 		...l,
-		children: [(n !== void 0 || a) && /* @__PURE__ */ b("div", {
+		children: [(n !== void 0 || a) && /* @__PURE__ */ x("div", {
 			className: "mb-1 flex items-center justify-between",
-			children: [n !== void 0 && /* @__PURE__ */ y("span", {
+			children: [n !== void 0 && /* @__PURE__ */ b("span", {
 				className: "gds-text-body font-medium text-fg",
 				children: n
-			}), a && /* @__PURE__ */ b("span", {
+			}), a && /* @__PURE__ */ x("span", {
 				className: "font-mono gds-text-label text-fg-muted tabular-nums",
 				children: [Math.round(f * 100), "%"]
 			})]
-		}), /* @__PURE__ */ y("div", {
+		}), /* @__PURE__ */ b("div", {
 			"aria-label": n,
 			"aria-valuemax": r,
 			"aria-valuemin": i,
 			"aria-valuenow": s,
-			className: B({ size: o }),
+			className: R({ size: o }),
 			role: "meter",
-			children: /* @__PURE__ */ y("div", {
+			children: /* @__PURE__ */ b("div", {
 				className: e("h-full gds-radius-badge transition-all duration-500", p),
 				style: { width: `${f * 100}%` }
 			})
 		})]
 	});
-}), Ae = p(function({ className: t, label: n, online: r, ...i }, a) {
-	let o = r ? "bg-success" : "bg-fg-muted/40", s = n ?? (r ? "Online" : "Offline");
+}), Fe = m(function({ className: t, format: n = String, value: r }, i) {
+	let a = _(() => n(r).split(""), [r, n]);
 	return /* @__PURE__ */ b("span", {
+		className: e("inline-flex items-center tabular-nums select-none", t),
+		"data-component": "number-flow",
+		ref: i,
+		children: a.map((e, t) => e >= "0" && e <= "9" ? /* @__PURE__ */ b("span", {
+			className: "inline-block overflow-hidden",
+			style: { lineHeight: 1 },
+			children: /* @__PURE__ */ b("span", {
+				className: "inline-block transition-transform duration-300 ease-out",
+				children: e
+			})
+		}, `${t}-slot`) : /* @__PURE__ */ b("span", { children: e }, `${t}-static`))
+	});
+}), Ie = m(function({ className: t, label: n, online: r, ...i }, a) {
+	let o = r ? "bg-success" : "bg-fg-muted/40", s = n ?? (r ? "Online" : "Offline");
+	return /* @__PURE__ */ x("span", {
 		className: e("inline-flex items-center gds-gap-sm", t),
 		"data-component": "online-indicator",
 		ref: a,
 		...i,
-		children: [/* @__PURE__ */ y("span", { className: e("h-2 w-2 shrink-0 rounded-full", o) }), /* @__PURE__ */ y("span", {
+		children: [/* @__PURE__ */ b("span", { className: e("h-2 w-2 shrink-0 rounded-full", o) }), /* @__PURE__ */ b("span", {
 			className: "gds-text-label text-fg-muted",
 			children: s
 		})]
 	});
-}), je = p(function({ className: t, precision: n = 1, showSign: r = !1, value: i, ...a }, o) {
+});
+//#endregion
+//#region src/l3-atoms/orbit.tsx
+function Le({ children: t, className: n, duration: r = 10, radius: i = 100 }) {
+	let a = t.length;
+	return /* @__PURE__ */ b("div", {
+		className: e("relative select-none", n),
+		"data-component": "orbit",
+		style: {
+			height: i * 2,
+			width: i * 2
+		},
+		children: t.map((e, t) => {
+			let n = 360 / a * t;
+			return /* @__PURE__ */ b("div", {
+				className: "absolute top-1/2 left-1/2",
+				style: {
+					animation: `orbit-spin ${r}s linear infinite`,
+					animationDelay: `${-(r / a) * t}s`,
+					height: 0,
+					width: 0
+				},
+				children: /* @__PURE__ */ b("div", {
+					className: "-translate-x-1/2 -translate-y-1/2",
+					style: { transform: `rotate(${n}deg) translateX(${i}px) rotate(-${n}deg)` },
+					children: e
+				})
+			}, t);
+		})
+	});
+}
+//#endregion
+//#region src/l3-atoms/percentage.tsx
+var Re = m(function({ className: t, precision: n = 1, showSign: r = !1, value: i, ...a }, o) {
 	let s = i > 0, c = s ? "text-success" : i < 0 ? "text-danger" : "text-fg-muted", l = `${r && s ? "+" : ""}${i.toFixed(n)}%`;
-	return /* @__PURE__ */ y("span", {
+	return /* @__PURE__ */ b("span", {
 		className: e("inline-flex tabular-nums text-sm font-medium", c, t),
 		"data-component": "percentage",
 		ref: o,
 		...a,
 		children: l
 	});
-}), Me = {
+}), ze = {
 	default: "h-16 w-16 text-lg",
 	lg: "h-20 w-20 text-xl",
 	sm: "h-12 w-12 text-sm"
-}, V = {
+}, z = {
 	default: 3,
 	lg: 3.5,
 	sm: 2.5
-}, Ne = p(function({ className: t, size: n = "default", value: r, ...i }, a) {
-	let o = Math.max(0, Math.min(100, r)), s = g(() => o >= 80 ? "text-success" : o >= 50 ? "text-warning" : "text-danger", [o]), c = 2 * Math.PI * 18, l = c - o / 100 * c;
-	return /* @__PURE__ */ b("div", {
-		className: e("relative inline-flex items-center justify-center select-none", Me[n], t),
+}, Be = m(function({ className: t, size: n = "default", value: r, ...i }, a) {
+	let o = Math.max(0, Math.min(100, r)), s = _(() => o >= 80 ? "text-success" : o >= 50 ? "text-warning" : "text-danger", [o]), c = 2 * Math.PI * 18, l = c - o / 100 * c;
+	return /* @__PURE__ */ x("div", {
+		className: e("relative inline-flex items-center justify-center select-none", ze[n], t),
 		"data-component": "percentage-circle",
 		ref: a,
 		...i,
-		children: [/* @__PURE__ */ b("svg", {
+		children: [/* @__PURE__ */ x("svg", {
 			className: "absolute inset-0 h-full w-full -rotate-90",
 			viewBox: "0 0 40 40",
-			children: [/* @__PURE__ */ y("circle", {
+			children: [/* @__PURE__ */ b("circle", {
 				className: "text-fg-muted/10",
 				cx: "20",
 				cy: "20",
 				fill: "none",
 				r: 18,
 				stroke: "currentColor",
-				strokeWidth: V[n]
-			}), /* @__PURE__ */ y("circle", {
+				strokeWidth: z[n]
+			}), /* @__PURE__ */ b("circle", {
 				className: e("transition-all duration-500", s),
 				cx: "20",
 				cy: "20",
@@ -781,16 +850,16 @@ var ke = p(function({ className: t, label: n, max: r = 100, min: i = 0, showValu
 				strokeDasharray: c,
 				strokeDashoffset: l,
 				strokeLinecap: "round",
-				strokeWidth: V[n]
+				strokeWidth: z[n]
 			})]
-		}), /* @__PURE__ */ b("span", {
+		}), /* @__PURE__ */ x("span", {
 			className: e("font-mono font-bold", s),
 			children: [o, "%"]
 		})]
 	});
-}), Pe = p(function({ className: t, currency: n = "¥", showSign: r = !1, value: i, ...a }, o) {
+}), Ve = m(function({ className: t, currency: n = "¥", showSign: r = !1, value: i, ...a }, o) {
 	let s = i < 0, c = i > 0, l = s ? "text-danger" : c ? "text-success" : "text-fg", u = r && c ? "+" : "", d = Math.abs(i).toLocaleString();
-	return /* @__PURE__ */ b("span", {
+	return /* @__PURE__ */ x("span", {
 		className: e("tabular-nums", l, t),
 		"data-component": "price",
 		ref: o,
@@ -801,14 +870,14 @@ var ke = p(function({ className: t, label: n, max: r = 100, min: i = 0, showValu
 			d
 		]
 	});
-}), Fe = {
+}), He = {
 	accent: "stroke-accent",
 	danger: "stroke-danger",
 	success: "stroke-success",
 	warning: "stroke-warning"
-}, Ie = p(function({ value: t, size: n = 64, strokeWidth: r = 4, showValue: i = !0, variant: a = "accent", className: o }, s) {
-	let c = (n - r) / 2, l = 2 * Math.PI * c, u = Math.max(0, Math.min(100, t)), d = l * (1 - u / 100), f = n / 2, p = Fe[a] ?? "stroke-accent";
-	return /* @__PURE__ */ b("svg", {
+}, Ue = m(function({ value: t, size: n = 64, strokeWidth: r = 4, showValue: i = !0, variant: a = "accent", className: o }, s) {
+	let c = (n - r) / 2, l = 2 * Math.PI * c, u = Math.max(0, Math.min(100, t)), d = l * (1 - u / 100), f = n / 2, p = He[a] ?? "stroke-accent";
+	return /* @__PURE__ */ x("svg", {
 		ref: s,
 		className: e("shrink-0", o),
 		"data-component": "progress-circle",
@@ -816,7 +885,7 @@ var ke = p(function({ className: t, label: n, max: r = 100, min: i = 0, showValu
 		viewBox: `0 0 ${n} ${n}`,
 		width: n,
 		children: [
-			/* @__PURE__ */ y("circle", {
+			/* @__PURE__ */ b("circle", {
 				className: "stroke-border/30",
 				cx: f,
 				cy: f,
@@ -824,7 +893,7 @@ var ke = p(function({ className: t, label: n, max: r = 100, min: i = 0, showValu
 				r: c,
 				strokeWidth: r
 			}),
-			/* @__PURE__ */ y("circle", {
+			/* @__PURE__ */ b("circle", {
 				className: e("transition-all duration-500", p),
 				cx: f,
 				cy: f,
@@ -839,7 +908,7 @@ var ke = p(function({ className: t, label: n, max: r = 100, min: i = 0, showValu
 					transformOrigin: "center"
 				}
 			}),
-			i && /* @__PURE__ */ b("text", {
+			i && /* @__PURE__ */ x("text", {
 				className: "fill-fg font-medium",
 				dominantBaseline: "central",
 				fontSize: n * .22,
@@ -850,9 +919,9 @@ var ke = p(function({ className: t, label: n, max: r = 100, min: i = 0, showValu
 			})
 		]
 	});
-}), Le = p(function({ className: t, size: n = 48, strokeWidth: r = 4, value: i, ...a }, o) {
+}), We = m(function({ className: t, size: n = 48, strokeWidth: r = 4, value: i, ...a }, o) {
 	let s = Math.max(0, Math.min(100, i)), c = (n - r) / 2, l = 2 * Math.PI * c, u = l * (1 - s / 100), d = n / 2;
-	return /* @__PURE__ */ b("div", {
+	return /* @__PURE__ */ x("div", {
 		"aria-valuemax": 100,
 		"aria-valuemin": 0,
 		"aria-valuenow": s,
@@ -861,19 +930,19 @@ var ke = p(function({ className: t, label: n, max: r = 100, min: i = 0, showValu
 		ref: o,
 		role: "progressbar",
 		...a,
-		children: [/* @__PURE__ */ b("svg", {
+		children: [/* @__PURE__ */ x("svg", {
 			className: "rotate-[-90deg]",
 			height: n,
 			viewBox: `0 0 ${n} ${n}`,
 			width: n,
-			children: [/* @__PURE__ */ y("circle", {
+			children: [/* @__PURE__ */ b("circle", {
 				className: "stroke-bg-tertiary",
 				cx: d,
 				cy: d,
 				fill: "none",
 				r: c,
 				strokeWidth: r
-			}), /* @__PURE__ */ y("circle", {
+			}), /* @__PURE__ */ b("circle", {
 				className: "stroke-accent transition-all duration-500",
 				cx: d,
 				cy: d,
@@ -884,44 +953,44 @@ var ke = p(function({ className: t, label: n, max: r = 100, min: i = 0, showValu
 				strokeLinecap: "round",
 				strokeWidth: r
 			})]
-		}), /* @__PURE__ */ b("span", {
+		}), /* @__PURE__ */ x("span", {
 			className: "absolute font-mono text-xs font-bold text-fg",
 			style: { fontSize: n * .22 },
 			children: [s, "%"]
 		})]
 	});
-}), H = {
+}), B = {
 	accent: "bg-accent",
 	danger: "bg-danger",
 	success: "bg-success",
 	warning: "bg-warning"
-}, Re = {
+}, Ge = {
 	default: "h-2.5 w-2.5",
 	lg: "h-3.5 w-3.5",
 	sm: "h-2 w-2"
-}, ze = p(function({ className: t, color: n = "success", label: r, size: i = "default", ...a }, o) {
-	return /* @__PURE__ */ b("span", {
+}, Ke = m(function({ className: t, color: n = "success", label: r, size: i = "default", ...a }, o) {
+	return /* @__PURE__ */ x("span", {
 		className: e("inline-flex items-center", r !== void 0 && "gds-gap-sm", t),
 		"data-component": "pulse-indicator",
 		ref: o,
 		...a,
-		children: [/* @__PURE__ */ b("span", {
+		children: [/* @__PURE__ */ x("span", {
 			className: "relative inline-flex",
-			children: [/* @__PURE__ */ y("span", { className: e("rounded-full", H[n], Re[i]) }), /* @__PURE__ */ y("span", { className: e("absolute inset-0 animate-ping rounded-full opacity-50", H[n]) })]
-		}), r !== void 0 && /* @__PURE__ */ y("span", {
+			children: [/* @__PURE__ */ b("span", { className: e("rounded-full", B[n], Ge[i]) }), /* @__PURE__ */ b("span", { className: e("absolute inset-0 animate-ping rounded-full opacity-50", B[n]) })]
+		}), r !== void 0 && /* @__PURE__ */ b("span", {
 			className: "gds-text-label text-fg-muted",
 			children: r
 		})]
 	});
-}), Be = p(function({ active: t = !0, className: n, color: r, count: i = 3, size: a = 80, ...o }, s) {
-	if (!t) return /* @__PURE__ */ y("div", {
+}), qe = m(function({ active: t = !0, className: n, color: r, count: i = 3, size: a = 80, ...o }, s) {
+	if (!t) return /* @__PURE__ */ b("div", {
 		className: e("relative inline-flex", n),
 		"data-component": "pulse-ring",
 		ref: s,
 		...o
 	});
 	let c = Array.from({ length: i }, (e, t) => t);
-	return /* @__PURE__ */ b("div", {
+	return /* @__PURE__ */ x("div", {
 		className: e("relative inline-flex items-center justify-center", n),
 		"data-component": "pulse-ring",
 		ref: s,
@@ -930,28 +999,28 @@ var ke = p(function({ className: t, label: n, max: r = 100, min: i = 0, showValu
 			width: a
 		},
 		...o,
-		children: [c.map((e) => /* @__PURE__ */ y("span", {
+		children: [c.map((e) => /* @__PURE__ */ b("span", {
 			className: "absolute inset-0 rounded-full border-2 opacity-0",
 			style: {
 				animation: `gds-pulse-ring ${1.5 + i * .2}s ease-out ${1.5 / i * e}s infinite`,
 				borderColor: r ?? "var(--color-accent)"
 			}
-		}, e)), /* @__PURE__ */ y("style", { children: "\n          @keyframes gds-pulse-ring {\n            0% { transform: scale(0.3); opacity: 0.8; }\n            100% { transform: scale(1); opacity: 0; }\n          }\n        " })]
+		}, e)), /* @__PURE__ */ b("style", { children: "\n          @keyframes gds-pulse-ring {\n            0% { transform: scale(0.3); opacity: 0.8; }\n            100% { transform: scale(1); opacity: 0; }\n          }\n        " })]
 	});
 });
 //#endregion
 //#region src/l3-atoms/qr-code.tsx
-function Ve(e) {
+function Je(e) {
 	let t = 5381;
 	for (let n = 0; n < e.length; n++) t = (t << 5) + t + e.charCodeAt(n) | 0;
 	return Math.abs(t);
 }
-function He(e) {
+function Ye(e) {
 	let t = e;
 	return () => (t = t * 1103515245 + 12345 & 2147483647, t / 2147483647);
 }
-var U = 21, W = 1;
-function G(e, t) {
+var V = 21, H = 1;
+function U(e, t) {
 	let n = [];
 	for (let r = 0; r < 7; r++) for (let i = 0; i < 7; i++) (r === 0 || r === 6 || i === 0 || i === 6 || r >= 2 && r <= 4 && i >= 2 && i <= 4) && n.push({
 		x: e + i,
@@ -959,40 +1028,40 @@ function G(e, t) {
 	});
 	return n;
 }
-var Ue = p(function({ value: t, size: n = 128, color: r = "currentColor", bgColor: i = "transparent", className: a }, o) {
-	let s = g(() => {
+var Xe = m(function({ value: t, size: n = 128, color: r = "currentColor", bgColor: i = "transparent", className: a }, o) {
+	let s = _(() => {
 		let e = [];
-		e.push(...G(0, 0)), e.push(...G(U - 7, 0)), e.push(...G(0, U - 7));
-		let n = He(Ve(t));
-		for (let t = 0; t < U; t++) for (let r = 0; r < U; r++) t < 8 && r < 8 || t < 8 && r >= U - 8 || t >= U - 8 && r < 8 || n() > .55 && e.push({
+		e.push(...U(0, 0)), e.push(...U(V - 7, 0)), e.push(...U(0, V - 7));
+		let n = Ye(Je(t));
+		for (let t = 0; t < V; t++) for (let r = 0; r < V; r++) t < 8 && r < 8 || t < 8 && r >= V - 8 || t >= V - 8 && r < 8 || n() > .55 && e.push({
 			x: r,
 			y: t
 		});
 		return e;
 	}, [t]);
-	return /* @__PURE__ */ b("svg", {
+	return /* @__PURE__ */ x("svg", {
 		ref: o,
 		width: n,
 		height: n,
-		viewBox: `0 0 ${U} ${U}`,
+		viewBox: `0 0 ${V} ${V}`,
 		className: e("shrink-0", a),
 		"data-component": "qr-code",
 		"data-testid": "qr-code-svg",
 		role: "img",
 		"aria-label": `QR code for: ${t}`,
-		children: [/* @__PURE__ */ y("rect", {
-			width: U,
-			height: U,
+		children: [/* @__PURE__ */ b("rect", {
+			width: V,
+			height: V,
 			fill: i
-		}), s.map((e, t) => /* @__PURE__ */ y("rect", {
+		}), s.map((e, t) => /* @__PURE__ */ b("rect", {
 			x: e.x,
 			y: e.y,
-			width: W,
-			height: W,
+			width: H,
+			height: H,
 			fill: r
 		}, t))]
 	});
-}), K = n("inline-flex shrink-0 select-none items-center justify-center rounded-full transition-transform active:scale-95 hover:scale-105", {
+}), W = n("inline-flex shrink-0 select-none items-center justify-center rounded-full transition-transform active:scale-95 hover:scale-105", {
 	defaultVariants: {
 		size: "default",
 		variant: "primary"
@@ -1008,11 +1077,11 @@ var Ue = p(function({ value: t, size: n = 128, color: r = "currentColor", bgColo
 			sm: "h-9 w-9"
 		}
 	}
-}), We = p(function({ className: t, disabled: n, icon: r, label: a, onClick: o, size: s, variant: c, ...l }, u) {
-	return /* @__PURE__ */ b("div", {
+}), Ze = m(function({ className: t, disabled: n, icon: r, label: a, onClick: o, size: s, variant: c, ...l }, u) {
+	return /* @__PURE__ */ x("div", {
 		className: "inline-flex flex-col items-center gap-1",
-		children: [/* @__PURE__ */ y("button", {
-			className: e(K({
+		children: [/* @__PURE__ */ b("button", {
+			className: e(W({
 				size: s,
 				variant: c
 			}), i, n === !0 && "pointer-events-none opacity-40", t),
@@ -1023,17 +1092,17 @@ var Ue = p(function({ value: t, size: n = 128, color: r = "currentColor", bgColo
 			ref: u,
 			type: "button",
 			...l,
-			children: /* @__PURE__ */ y("span", {
+			children: /* @__PURE__ */ b("span", {
 				className: "gds-icon-child",
 				children: r
 			})
-		}), a !== void 0 && /* @__PURE__ */ y("span", {
+		}), a !== void 0 && /* @__PURE__ */ b("span", {
 			className: "select-none text-[10px] text-fg-muted",
 			children: a
 		})]
 	});
-}), Ge = p(function({ className: t, direction: n = "vertical", disabled: r = !1, onChange: a, options: o, value: s, ...c }, l) {
-	return /* @__PURE__ */ y("div", {
+}), Qe = m(function({ className: t, direction: n = "vertical", disabled: r = !1, onChange: a, options: o, value: s, ...c }, l) {
+	return /* @__PURE__ */ b("div", {
 		className: e("flex gds-gap", n === "vertical" ? "flex-col" : "flex-row flex-wrap", t),
 		"data-component": "radio-group",
 		ref: l,
@@ -1041,45 +1110,45 @@ var Ue = p(function({ value: t, size: n = 128, color: r = "currentColor", bgColo
 		...c,
 		children: o.map((t) => {
 			let n = t.value === s, o = r || t.disabled === !0;
-			return /* @__PURE__ */ b("button", {
+			return /* @__PURE__ */ x("button", {
 				"aria-checked": n,
 				className: e("inline-flex select-none items-center gds-gap-sm gds-text-body", i, o && "cursor-not-allowed opacity-50"),
 				disabled: o,
 				onClick: () => a?.(t.value),
 				role: "radio",
 				type: "button",
-				children: [/* @__PURE__ */ y("span", {
+				children: [/* @__PURE__ */ b("span", {
 					className: e("inline-flex gds-icon shrink-0 items-center justify-center gds-radius-badge border transition-colors", n ? "border-accent" : "border-border hover:border-accent/50"),
-					children: n && /* @__PURE__ */ y("span", { className: "h-2 w-2 gds-radius-badge bg-accent" })
-				}), /* @__PURE__ */ y("span", {
+					children: n && /* @__PURE__ */ b("span", { className: "h-2 w-2 gds-radius-badge bg-accent" })
+				}), /* @__PURE__ */ b("span", {
 					className: "text-fg",
 					children: t.label
 				})]
 			}, t.value);
 		})
 	});
-}), q = {
+}), G = {
 	default: "gds-sq-xs",
 	lg: "gds-sq-sm",
 	sm: "gds-icon"
 };
-function J({ filled: t }) {
-	return /* @__PURE__ */ y("svg", {
-		className: e(q.default, t ? "fill-warning text-warning" : "text-fg-muted/20"),
+function K({ filled: t }) {
+	return /* @__PURE__ */ b("svg", {
+		className: e(G.default, t ? "fill-warning text-warning" : "text-fg-muted/20"),
 		fill: t ? "currentColor" : "none",
 		stroke: "currentColor",
 		strokeWidth: 1.5,
 		viewBox: "0 0 24 24",
-		children: /* @__PURE__ */ y("path", {
+		children: /* @__PURE__ */ b("path", {
 			d: "M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z",
 			strokeLinecap: "round",
 			strokeLinejoin: "round"
 		})
 	});
 }
-var Ke = p(function({ className: t, max: n = 5, onChange: r, readonly: a = !1, renderStar: o, size: s = "default", value: c, ...l }, u) {
-	let [d, f] = v(null), p = m(() => f(null), []);
-	return /* @__PURE__ */ y("div", {
+var $e = m(function({ className: t, max: n = 5, onChange: r, readonly: a = !1, renderStar: o, size: s = "default", value: c, ...l }, u) {
+	let [d, f] = y(null), p = h(() => f(null), []);
+	return /* @__PURE__ */ b("div", {
 		className: e("inline-flex gds-gap-xs", t),
 		"data-component": "rating",
 		onMouseLeave: a ? void 0 : p,
@@ -1088,17 +1157,17 @@ var Ke = p(function({ className: t, max: n = 5, onChange: r, readonly: a = !1, r
 		...l,
 		children: Array.from({ length: n }, (t, n) => {
 			let l = n + 1, u = d === null ? l <= c : l <= d;
-			return a ? /* @__PURE__ */ y("span", {
-				className: q[s],
-				children: o === void 0 ? /* @__PURE__ */ y(J, { filled: u }) : o(u, n)
-			}, n) : /* @__PURE__ */ y("button", {
+			return a ? /* @__PURE__ */ b("span", {
+				className: G[s],
+				children: o === void 0 ? /* @__PURE__ */ b(K, { filled: u }) : o(u, n)
+			}, n) : /* @__PURE__ */ b("button", {
 				className: e("transition-transform hover:scale-110", i),
 				onClick: () => r?.(l),
 				onMouseEnter: () => f(l),
 				type: "button",
-				children: /* @__PURE__ */ y("span", {
-					className: q[s],
-					children: o === void 0 ? /* @__PURE__ */ y(J, { filled: u }) : o(u, n)
+				children: /* @__PURE__ */ b("span", {
+					className: G[s],
+					children: o === void 0 ? /* @__PURE__ */ b(K, { filled: u }) : o(u, n)
 				})
 			}, n);
 		})
@@ -1106,7 +1175,7 @@ var Ke = p(function({ className: t, max: n = 5, onChange: r, readonly: a = !1, r
 });
 //#endregion
 //#region src/l3-atoms/relative-time.tsx
-function Y(e) {
+function q(e) {
 	let t = e instanceof Date ? e : new Date(e), n = Date.now() - t.getTime(), r = Math.floor(n / 1e3);
 	if (r < 60) return "just now";
 	let i = Math.floor(r / 60);
@@ -1119,18 +1188,18 @@ function Y(e) {
 	let s = Math.floor(o / 30);
 	return s < 12 ? `${s}mo ago` : `${Math.floor(s / 12)}y ago`;
 }
-function qe(e) {
+function et(e) {
 	return e.toLocaleString();
 }
-var Je = p(function({ className: t, date: n, prefix: r, ...i }, a) {
-	let [o, s] = v(() => Y(n)), c = _(null);
-	h(() => (s(Y(n)), c.current = setInterval(() => {
-		s(Y(n));
+var tt = m(function({ className: t, date: n, prefix: r, ...i }, a) {
+	let [o, s] = y(() => q(n)), c = v(null);
+	g(() => (s(q(n)), c.current = setInterval(() => {
+		s(q(n));
 	}, 3e4), () => {
 		c.current !== null && clearInterval(c.current);
 	}), [n]);
-	let l = n instanceof Date ? n : new Date(n), u = qe(l);
-	return /* @__PURE__ */ y("time", {
+	let l = n instanceof Date ? n : new Date(n), u = et(l);
+	return /* @__PURE__ */ b("time", {
 		className: e("font-mono text-fg-muted", t),
 		"data-component": "relative-time",
 		dateTime: l.toISOString(),
@@ -1139,26 +1208,26 @@ var Je = p(function({ className: t, date: n, prefix: r, ...i }, a) {
 		...i,
 		children: r === void 0 ? o : `${r} ${o}`
 	});
-}), Ye = {
+}), nt = {
 	accent: "bg-accent text-accent-fg",
 	danger: "bg-danger text-white",
 	success: "bg-success text-white",
 	warning: "bg-warning text-white"
-}, Xe = p(function({ children: t, label: n, variant: r = "accent", position: i = "top-right", className: a, ...o }, s) {
+}, rt = m(function({ children: t, label: n, variant: r = "accent", position: i = "top-right", className: a, ...o }, s) {
 	let c = i === "top-right";
-	return /* @__PURE__ */ b("div", {
+	return /* @__PURE__ */ x("div", {
 		ref: s,
 		className: e("relative overflow-hidden", a),
 		"data-component": "ribbon",
 		...o,
-		children: [/* @__PURE__ */ y("div", {
-			className: e("pointer-events-none absolute top-3 z-10 px-6 py-0.5 text-[10px] font-bold uppercase tracking-wider shadow-sm", Ye[r], c ? "-right-6 rotate-45" : "-left-6 -rotate-45"),
+		children: [/* @__PURE__ */ b("div", {
+			className: e("pointer-events-none absolute top-3 z-10 px-6 py-0.5 text-[10px] font-bold uppercase tracking-wider shadow-sm", nt[r], c ? "-right-6 rotate-45" : "-left-6 -rotate-45"),
 			children: n
 		}), t]
 	});
-}), Ze = p(function({ className: t, color: n, position: r = "top-right", text: i, ...a }, o) {
+}), it = m(function({ className: t, color: n, position: r = "top-right", text: i, ...a }, o) {
 	let s = r === "top-right";
-	return /* @__PURE__ */ y("div", {
+	return /* @__PURE__ */ b("div", {
 		className: e("absolute top-0 z-10 overflow-hidden", s ? "right-0" : "left-0", t),
 		"data-component": "ribbon-banner",
 		ref: o,
@@ -1167,7 +1236,7 @@ var Je = p(function({ className: t, date: n, prefix: r, ...i }, a) {
 			width: 80
 		},
 		...a,
-		children: /* @__PURE__ */ y("div", {
+		children: /* @__PURE__ */ b("div", {
 			className: "flex items-center justify-center text-xs font-bold text-accent-fg select-none",
 			style: {
 				backgroundColor: n ?? "var(--color-accent)",
@@ -1181,25 +1250,25 @@ var Je = p(function({ className: t, date: n, prefix: r, ...i }, a) {
 			children: i
 		})
 	});
-}), Qe = 0, $e = p(function({ children: t, color: n = "currentColor", disabled: r = !1, className: i }, a) {
-	let [o, s] = v([]), c = m((e) => {
+}), at = 0, ot = m(function({ children: t, color: n = "currentColor", disabled: r = !1, className: i }, a) {
+	let [o, s] = y([]), c = h((e) => {
 		if (r) return;
 		let t = e.currentTarget.getBoundingClientRect(), n = e.clientX - t.left, i = e.clientY - t.top, a = Math.max(t.width, t.height) * 2;
 		s((e) => [...e, {
-			id: Qe++,
+			id: at++,
 			x: n,
 			y: i,
 			size: a
 		}]);
-	}, [r]), l = m((e) => {
+	}, [r]), l = h((e) => {
 		s((t) => t.filter((t) => t.id !== e));
 	}, []);
-	return /* @__PURE__ */ b("div", {
+	return /* @__PURE__ */ x("div", {
 		ref: a,
 		"data-component": "ripple-effect",
 		className: e("relative overflow-hidden", i),
 		onPointerDown: c,
-		children: [t, o.map((e) => /* @__PURE__ */ y("span", {
+		children: [t, o.map((e) => /* @__PURE__ */ b("span", {
 			className: "pointer-events-none absolute animate-ripple rounded-full",
 			style: {
 				left: e.x - e.size / 2,
@@ -1211,18 +1280,18 @@ var Je = p(function({ className: t, date: n, prefix: r, ...i }, a) {
 			onAnimationEnd: () => l(e.id)
 		}, e.id))]
 	});
-}), et = p(function({ className: t, color: n, height: r = 3, ...i }, a) {
-	let [o, s] = v(0), c = m(() => {
+}), st = m(function({ className: t, color: n, height: r = 3, ...i }, a) {
+	let [o, s] = y(0), c = h(() => {
 		let e = document.documentElement.scrollTop, t = document.documentElement.scrollHeight - document.documentElement.clientHeight;
 		t > 0 && s(e / t * 100);
 	}, []);
-	return h(() => (window.addEventListener("scroll", c, { passive: !0 }), () => window.removeEventListener("scroll", c)), [c]), /* @__PURE__ */ y("div", {
+	return g(() => (window.addEventListener("scroll", c, { passive: !0 }), () => window.removeEventListener("scroll", c)), [c]), /* @__PURE__ */ b("div", {
 		className: e("fixed top-0 right-0 left-0 z-50", t),
 		"data-component": "scroll-progress",
 		ref: a,
 		style: { height: `${r}px` },
 		...i,
-		children: /* @__PURE__ */ y("div", {
+		children: /* @__PURE__ */ b("div", {
 			className: "h-full bg-accent transition-[width] duration-100 ease-out",
 			style: {
 				width: `${o}%`,
@@ -1230,12 +1299,12 @@ var Je = p(function({ className: t, date: n, prefix: r, ...i }, a) {
 			}
 		})
 	});
-}), tt = p(function({ threshold: t = 300, smooth: n = !0, className: r }, a) {
-	let [o, s] = v(() => typeof window > "u" ? !1 : window.scrollY >= t);
-	return h(() => {
+}), ct = m(function({ threshold: t = 300, smooth: n = !0, className: r }, a) {
+	let [o, s] = y(() => typeof window > "u" ? !1 : window.scrollY >= t);
+	return g(() => {
 		let e = () => s(window.scrollY >= t);
 		return window.addEventListener("scroll", e, { passive: !0 }), () => window.removeEventListener("scroll", e);
-	}, [t]), o ? /* @__PURE__ */ y("button", {
+	}, [t]), o ? /* @__PURE__ */ b("button", {
 		ref: a,
 		type: "button",
 		"aria-label": "Scroll to top",
@@ -1245,7 +1314,7 @@ var Je = p(function({ className: t, date: n, prefix: r, ...i }, a) {
 		}),
 		className: e("fixed bottom-6 right-6 z-40 flex h-10 w-10 items-center justify-center rounded-full bg-accent text-accent-fg shadow-lg transition-opacity hover:bg-accent/90", i, r),
 		"data-component": "scroll-to-top",
-		children: /* @__PURE__ */ y("svg", {
+		children: /* @__PURE__ */ b("svg", {
 			width: "16",
 			height: "16",
 			viewBox: "0 0 16 16",
@@ -1254,14 +1323,14 @@ var Je = p(function({ className: t, date: n, prefix: r, ...i }, a) {
 			strokeWidth: "2",
 			strokeLinecap: "round",
 			strokeLinejoin: "round",
-			children: /* @__PURE__ */ y("path", { d: "M8 12V4M4 7l4-3 4 3" })
+			children: /* @__PURE__ */ b("path", { d: "M8 12V4M4 7l4-3 4 3" })
 		})
 	}) : null;
-}), nt = {
+}), lt = {
 	default: "px-3 py-1.5 text-xs",
 	sm: "px-2 py-1 text-[11px]"
-}, rt = p(function({ options: n, value: r, onChange: a, size: o = "default", disabled: s, glass: c, className: l, ...u }, d) {
-	return /* @__PURE__ */ y("div", {
+}, ut = m(function({ options: n, value: r, onChange: a, size: o = "default", disabled: s, glass: c, className: l, ...u }, d) {
+	return /* @__PURE__ */ b("div", {
 		ref: d,
 		className: e("inline-flex select-none gds-radius-button bg-bg-tertiary p-0.5", c === !0 && t(c), s === !0 && "pointer-events-none opacity-50", l),
 		"data-component": "segmented-control",
@@ -1270,7 +1339,7 @@ var Je = p(function({ className: t, date: n, prefix: r, ...i }, a) {
 		...u,
 		children: n.map((t) => {
 			let n = t.value === r;
-			return /* @__PURE__ */ y("button", {
+			return /* @__PURE__ */ b("button", {
 				type: "button",
 				role: "radio",
 				"aria-checked": n,
@@ -1278,75 +1347,75 @@ var Je = p(function({ className: t, date: n, prefix: r, ...i }, a) {
 				onClick: () => {
 					n || a(t.value);
 				},
-				className: e("gds-radius-button transition-all", nt[o ?? "default"], i, n ? "bg-bg font-medium text-fg gds-shadow-sm" : "text-fg-muted hover:text-fg"),
+				className: e("gds-radius-button transition-all", lt[o ?? "default"], i, n ? "bg-bg font-medium text-fg gds-shadow-sm" : "text-fg-muted hover:text-fg"),
 				children: t.label
 			}, t.value);
 		})
 	});
-}), it = p(function({ className: t, description: n, keys: r, ...i }, a) {
-	return /* @__PURE__ */ b("span", {
+}), dt = m(function({ className: t, description: n, keys: r, ...i }, a) {
+	return /* @__PURE__ */ x("span", {
 		className: e("inline-flex items-center gap-2", t),
 		"data-component": "shortcut-display",
 		ref: a,
 		...i,
-		children: [/* @__PURE__ */ y("span", {
+		children: [/* @__PURE__ */ b("span", {
 			className: "inline-flex items-center gap-0.5",
-			children: r.map((e, t) => /* @__PURE__ */ y(o, { children: e }, t))
-		}), n !== void 0 && /* @__PURE__ */ y("span", {
+			children: r.map((e, t) => /* @__PURE__ */ b(o, { children: e }, t))
+		}), n !== void 0 && /* @__PURE__ */ b("span", {
 			className: "text-xs text-fg-muted",
 			children: n
 		})]
 	});
-}), at = {
-	"avatar-text": () => /* @__PURE__ */ b("div", {
+}), ft = {
+	"avatar-text": () => /* @__PURE__ */ x("div", {
 		className: "flex items-center gap-3",
-		children: [/* @__PURE__ */ y(c, { variant: "circle" }), /* @__PURE__ */ b("div", {
+		children: [/* @__PURE__ */ b(c, { variant: "circle" }), /* @__PURE__ */ x("div", {
 			className: "flex flex-1 flex-col gap-2",
-			children: [/* @__PURE__ */ y(c, {
+			children: [/* @__PURE__ */ b(c, {
 				variant: "text",
 				width: "60%"
-			}), /* @__PURE__ */ y(c, {
+			}), /* @__PURE__ */ b(c, {
 				variant: "text",
 				width: "40%"
 			})]
 		})]
 	}),
-	card: () => /* @__PURE__ */ b("div", {
+	card: () => /* @__PURE__ */ x("div", {
 		className: "flex flex-col gap-3",
 		children: [
-			/* @__PURE__ */ y(c, { variant: "rect" }),
-			/* @__PURE__ */ y(c, { variant: "text" }),
-			/* @__PURE__ */ y(c, {
+			/* @__PURE__ */ b(c, { variant: "rect" }),
+			/* @__PURE__ */ b(c, { variant: "text" }),
+			/* @__PURE__ */ b(c, {
 				variant: "text",
 				width: "80%"
 			}),
-			/* @__PURE__ */ y(c, {
+			/* @__PURE__ */ b(c, {
 				variant: "text",
 				width: "50%"
 			})
 		]
 	}),
-	"form-field": () => /* @__PURE__ */ b("div", {
+	"form-field": () => /* @__PURE__ */ x("div", {
 		className: "flex flex-col gap-2",
-		children: [/* @__PURE__ */ y(c, {
+		children: [/* @__PURE__ */ b(c, {
 			variant: "text",
 			width: "30%"
-		}), /* @__PURE__ */ y(c, {
+		}), /* @__PURE__ */ b(c, {
 			variant: "rect",
 			height: 36
 		})]
 	})
-}, ot = p(function({ className: t, count: n = 1, variant: r = "avatar-text" }, i) {
-	let a = at[r];
-	return /* @__PURE__ */ y("div", {
+}, pt = m(function({ className: t, count: n = 1, variant: r = "avatar-text" }, i) {
+	let a = ft[r];
+	return /* @__PURE__ */ b("div", {
 		ref: i,
 		className: e("flex flex-col gap-4", t),
 		"data-component": "skeleton-group",
 		"data-variant": r,
-		children: Array.from({ length: n }, (e, t) => /* @__PURE__ */ y("div", { children: a() }, t))
+		children: Array.from({ length: n }, (e, t) => /* @__PURE__ */ b("div", { children: a() }, t))
 	});
-}), st = "M12 0l3 9 9 3-9 3-3 9-3-9-9-3 9-3z";
-function ct(e, t) {
+}), mt = "M12 0l3 9 9 3-9 3-3 9-3-9-9-3 9-3z";
+function ht(e, t) {
 	let n = 360 / t * e * Math.PI / 180, r = 70 + e % 3 * 15;
 	return {
 		position: "absolute",
@@ -1359,66 +1428,85 @@ function ct(e, t) {
 		opacity: 0
 	};
 }
-var lt = p(function({ children: t, active: n = !0, count: r = 3, color: i = "var(--gds-accent)", className: a }, o) {
+var gt = m(function({ children: t, active: n = !0, count: r = 3, color: i = "var(--gds-accent)", className: a }, o) {
 	let s = Array.from({ length: r }, (e, t) => t);
-	return /* @__PURE__ */ b("span", {
+	return /* @__PURE__ */ x("span", {
 		ref: o,
 		className: e("relative inline-block", a),
 		"data-component": "sparkle",
 		children: [
 			t,
-			n && s.map((e) => /* @__PURE__ */ y("svg", {
+			n && s.map((e) => /* @__PURE__ */ b("svg", {
 				viewBox: "0 0 24 24",
 				fill: i,
-				style: ct(e, r),
+				style: ht(e, r),
 				"aria-hidden": "true",
-				children: /* @__PURE__ */ y("path", { d: st })
+				children: /* @__PURE__ */ b("path", { d: mt })
 			}, e)),
-			n && /* @__PURE__ */ y("style", { children: "\n            @keyframes gds-sparkle {\n              0%, 100% { opacity: 0; transform: scale(0) rotate(0deg); }\n              50% { opacity: 1; transform: scale(1) rotate(180deg); }\n            }\n          " })
+			n && /* @__PURE__ */ b("style", { children: "\n            @keyframes gds-sparkle {\n              0%, 100% { opacity: 0; transform: scale(0) rotate(0deg); }\n              50% { opacity: 1; transform: scale(1) rotate(180deg); }\n            }\n          " })
 		]
 	});
-}), ut = {
+}), _t = {
+	fade: "animate-[stagger-fade_0.4s_ease_both]",
+	scale: "animate-[stagger-scale_0.4s_ease_both]",
+	"slide-up": "animate-[stagger-slide-up_0.4s_ease_both]"
+};
+function vt({ animation: t = "fade", children: n, className: r, delay: i = 80 }) {
+	let a = p.toArray(n);
+	return /* @__PURE__ */ b("div", {
+		className: e("", r),
+		"data-component": "stagger",
+		children: a.map((e, n) => /* @__PURE__ */ b("div", {
+			className: _t[t],
+			style: { animationDelay: `${n * i}ms` },
+			children: e
+		}, n))
+	});
+}
+//#endregion
+//#region src/l3-atoms/star-rating.tsx
+var yt = {
 	sm: 14,
 	default: 18,
 	lg: 24
-}, X = "M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z";
-function dt({ fill: e, s: t, color: n }) {
+}, J = "M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z";
+function bt({ fill: e, s: t, color: n }) {
 	let r = `half-${Math.random().toString(36).slice(2, 8)}`;
-	return e === "full" ? /* @__PURE__ */ y("svg", {
+	return e === "full" ? /* @__PURE__ */ b("svg", {
 		width: t,
 		height: t,
 		viewBox: "0 0 24 24",
 		fill: n,
 		stroke: n,
 		strokeWidth: 1,
-		children: /* @__PURE__ */ y("path", { d: X })
-	}) : e === "half" ? /* @__PURE__ */ b("svg", {
+		children: /* @__PURE__ */ b("path", { d: J })
+	}) : e === "half" ? /* @__PURE__ */ x("svg", {
 		width: t,
 		height: t,
 		viewBox: "0 0 24 24",
 		stroke: n,
 		strokeWidth: 1,
 		children: [
-			/* @__PURE__ */ y("defs", { children: /* @__PURE__ */ y("clipPath", {
+			/* @__PURE__ */ b("defs", { children: /* @__PURE__ */ b("clipPath", {
 				id: r,
-				children: /* @__PURE__ */ y("rect", {
+				children: /* @__PURE__ */ b("rect", {
 					x: "0",
 					y: "0",
 					width: "12",
 					height: "24"
 				})
 			}) }),
-			/* @__PURE__ */ y("path", {
-				d: X,
+			/* @__PURE__ */ b("path", {
+				d: J,
 				fill: "none"
 			}),
-			/* @__PURE__ */ y("path", {
-				d: X,
+			/* @__PURE__ */ b("path", {
+				d: J,
 				fill: n,
 				clipPath: `url(#${r})`
 			})
 		]
-	}) : /* @__PURE__ */ y("svg", {
+	}) : /* @__PURE__ */ b("svg", {
 		width: t,
 		height: t,
 		viewBox: "0 0 24 24",
@@ -1426,12 +1514,12 @@ function dt({ fill: e, s: t, color: n }) {
 		stroke: "currentColor",
 		strokeWidth: 1,
 		className: "text-fg-muted/30",
-		children: /* @__PURE__ */ y("path", { d: X })
+		children: /* @__PURE__ */ b("path", { d: J })
 	});
 }
-var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "currentColor", className: a }, o) {
-	let s = ut[r], c = i === "currentColor" ? "var(--color-warning)" : i;
-	return /* @__PURE__ */ y("div", {
+var xt = m(function({ value: t, max: n = 5, size: r = "default", color: i = "currentColor", className: a }, o) {
+	let s = yt[r], c = i === "currentColor" ? "var(--color-warning)" : i;
+	return /* @__PURE__ */ b("div", {
 		ref: o,
 		className: e("inline-flex items-center gap-0.5", a),
 		"data-component": "star-rating",
@@ -1439,100 +1527,100 @@ var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "cur
 		"aria-label": `${t} out of ${n} stars`,
 		children: Array.from({ length: n }, (e, n) => {
 			let r = t - n;
-			return /* @__PURE__ */ y(dt, {
+			return /* @__PURE__ */ b(bt, {
 				fill: r >= 1 ? "full" : r >= .5 ? "half" : "empty",
 				s,
 				color: c
 			}, n);
 		})
 	});
-}), Z = {
+}), Y = {
 	active: "bg-success/10 text-success",
 	draft: "bg-fg-muted/10 text-fg-muted",
 	error: "bg-danger/10 text-danger",
 	inactive: "bg-fg-muted/10 text-fg-muted",
 	pending: "bg-warning/10 text-warning",
 	warning: "bg-warning/10 text-warning"
-}, pt = p(function({ className: n, glass: r, icon: i, label: a, size: o = "default", status: s, ...c }, l) {
+}, St = m(function({ className: n, glass: r, icon: i, label: a, size: o = "default", status: s, ...c }, l) {
 	let u = a ?? s;
-	return /* @__PURE__ */ b("span", {
-		className: e("inline-flex select-none items-center gds-gap-xs gds-radius-badge font-medium", o === "sm" ? "gds-pad-x-sm py-px gds-text-caption" : "gds-pad-x-sm gds-pad-y-sm gds-text-body", Z[s], t(r), r === !0 && "border border-white/10 bg-white/5", n),
+	return /* @__PURE__ */ x("span", {
+		className: e("inline-flex select-none items-center gds-gap-xs gds-radius-badge font-medium", o === "sm" ? "gds-pad-x-sm py-px gds-text-caption" : "gds-pad-x-sm gds-pad-y-sm gds-text-body", Y[s], t(r), r === !0 && "border border-white/10 bg-white/5", n),
 		"data-component": "status-badge",
 		"data-state": s,
 		ref: l,
 		...c,
-		children: [i !== void 0 && /* @__PURE__ */ y("span", {
+		children: [i !== void 0 && /* @__PURE__ */ b("span", {
 			className: "gds-icon-child-sm",
 			children: i
 		}), u]
 	});
-}), mt = {
-	status: Z,
+}), Ct = {
+	status: Y,
 	size: {
 		default: "gds-pad-x-sm gds-pad-y-sm gds-text-body",
 		sm: "gds-pad-x-sm py-px gds-text-caption"
 	}
-}, Q = {
+}, X = {
 	connected: "bg-success",
 	connecting: "bg-warning animate-pulse",
 	disconnected: "bg-danger"
-}, ht = p(function({ className: t, label: n, status: r, ...i }, a) {
-	return /* @__PURE__ */ b("span", {
+}, wt = m(function({ className: t, label: n, status: r, ...i }, a) {
+	return /* @__PURE__ */ x("span", {
 		className: e("inline-flex items-center gds-gap-sm", t),
 		"data-component": "status-dot",
 		"data-state": r,
 		ref: a,
 		...i,
-		children: [/* @__PURE__ */ y("span", { className: e("h-2 w-2 shrink-0 rounded-full", Q[r]) }), n !== void 0 && /* @__PURE__ */ y("span", {
+		children: [/* @__PURE__ */ b("span", { className: e("h-2 w-2 shrink-0 rounded-full", X[r]) }), n !== void 0 && /* @__PURE__ */ b("span", {
 			className: "gds-text-label text-fg-muted",
 			children: n
 		})]
 	});
-}), gt = { status: Q }, _t = p(function({ className: t, disabled: n = !1, items: r, onChange: i }, a) {
-	return /* @__PURE__ */ y("div", {
+}), Tt = { status: X }, Et = m(function({ className: t, disabled: n = !1, items: r, onChange: i }, a) {
+	return /* @__PURE__ */ b("div", {
 		ref: a,
 		className: e("flex flex-col gap-3", t),
 		"data-component": "switch-group",
 		role: "group",
-		children: r.map((e) => /* @__PURE__ */ b("div", {
+		children: r.map((e) => /* @__PURE__ */ x("div", {
 			className: "flex items-center justify-between gap-4 gds-pad-x gds-pad-y-sm",
-			children: [/* @__PURE__ */ b("div", {
+			children: [/* @__PURE__ */ x("div", {
 				className: "min-w-0 flex-1",
-				children: [/* @__PURE__ */ y("div", {
+				children: [/* @__PURE__ */ b("div", {
 					className: "gds-text-body font-medium text-fg",
 					children: e.label
-				}), e.description !== void 0 && /* @__PURE__ */ y("div", {
+				}), e.description !== void 0 && /* @__PURE__ */ b("div", {
 					className: "mt-0.5 gds-text-caption text-fg-muted",
 					children: e.description
 				})]
-			}), /* @__PURE__ */ y(d, {
+			}), /* @__PURE__ */ b(d, {
 				checked: e.checked,
 				disabled: n,
 				onChange: (t) => i(e.id, t)
 			})]
 		}, e.id))
 	});
-}), vt = {
+}), Dt = {
 	accent: "bg-accent/15 text-accent",
 	danger: "bg-danger/15 text-danger",
 	muted: "bg-fg-muted/10 text-fg-muted",
 	success: "bg-success/15 text-success",
 	warning: "bg-warning/15 text-warning"
-}, yt = {
+}, Ot = {
 	default: "px-1.5 py-0.5 text-[10px]",
 	sm: "px-1 py-px text-[9px]"
-}, bt = p(function({ className: t, label: n, size: r = "default", variant: i = "accent", ...a }, o) {
-	return /* @__PURE__ */ y("span", {
-		className: e("inline-flex select-none items-center rounded-full font-bold uppercase leading-none tracking-wider", vt[i], yt[r], t),
+}, kt = m(function({ className: t, label: n, size: r = "default", variant: i = "accent", ...a }, o) {
+	return /* @__PURE__ */ b("span", {
+		className: e("inline-flex select-none items-center rounded-full font-bold uppercase leading-none tracking-wider", Dt[i], Ot[r], t),
 		"data-component": "text-badge",
 		"data-variant": i,
 		ref: o,
 		...a,
 		children: n
 	});
-}), xt = p(function({ children: t, className: n, effect: r, gradientFrom: i, gradientTo: a, style: o, ...s }, c) {
+}), At = m(function({ children: t, className: n, effect: r, gradientFrom: i, gradientTo: a, style: o, ...s }, c) {
 	let l = i ?? "var(--gds-accent)", u = a ?? "var(--gds-success)";
-	return r === "gradient" ? /* @__PURE__ */ y("span", {
+	return r === "gradient" ? /* @__PURE__ */ b("span", {
 		className: e("bg-clip-text text-transparent", n),
 		"data-component": "text-effect",
 		"data-variant": r,
@@ -1543,7 +1631,7 @@ var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "cur
 		},
 		...s,
 		children: t
-	}) : r === "highlight" ? /* @__PURE__ */ y("span", {
+	}) : r === "highlight" ? /* @__PURE__ */ b("span", {
 		className: e("box-decoration-clone bg-accent/20 px-1", n),
 		"data-component": "text-effect",
 		"data-variant": r,
@@ -1551,7 +1639,7 @@ var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "cur
 		style: o,
 		...s,
 		children: t
-	}) : /* @__PURE__ */ y("span", {
+	}) : /* @__PURE__ */ b("span", {
 		className: e(n),
 		"data-component": "text-effect",
 		"data-variant": r,
@@ -1563,40 +1651,40 @@ var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "cur
 		...s,
 		children: t
 	});
-}), St = p(function({ className: t, error: n, maxLength: r, onChange: i, value: a, ...o }, c) {
+}), jt = m(function({ className: t, error: n, maxLength: r, onChange: i, value: a, ...o }, c) {
 	let l = a.length, u = r !== void 0 && l >= r * .9;
-	return /* @__PURE__ */ b("div", {
+	return /* @__PURE__ */ x("div", {
 		className: e("flex flex-col", t),
 		"data-component": "textarea-counter",
-		children: [/* @__PURE__ */ y(s, {
+		children: [/* @__PURE__ */ b(s, {
 			error: n ?? u,
 			maxLength: r,
 			onChange: (e) => i(e.target.value),
 			ref: c,
 			value: a,
 			...o
-		}), /* @__PURE__ */ y("div", {
+		}), /* @__PURE__ */ b("div", {
 			className: e("mt-1 text-right text-[11px]", u ? "text-danger" : "text-fg-muted"),
 			children: r === void 0 ? l : `${l} / ${r}`
 		})]
 	});
-}), Ct = {
+}), Mt = {
 	default: "h-8 w-8",
 	sm: "h-6 w-6"
-}, wt = {
+}, Nt = {
 	default: 16,
 	sm: 14
-}, Tt = p(function({ mode: t, onChange: n, size: r = "default", className: a }, o) {
-	let s = t === "dark", c = wt[r];
-	return /* @__PURE__ */ y("button", {
+}, Pt = m(function({ mode: t, onChange: n, size: r = "default", className: a }, o) {
+	let s = t === "dark", c = Nt[r];
+	return /* @__PURE__ */ b("button", {
 		ref: o,
 		type: "button",
 		"aria-label": s ? "Switch to light mode" : "Switch to dark mode",
 		onClick: () => n(s ? "light" : "dark"),
-		className: e("inline-flex items-center justify-center rounded-full text-fg-muted transition-colors hover:text-fg select-none", Ct[r], i, a),
+		className: e("inline-flex items-center justify-center rounded-full text-fg-muted transition-colors hover:text-fg select-none", Mt[r], i, a),
 		"data-component": "theme-toggle",
 		"data-state": t,
-		children: s ? /* @__PURE__ */ b("svg", {
+		children: s ? /* @__PURE__ */ x("svg", {
 			width: c,
 			height: c,
 			viewBox: "0 0 16 16",
@@ -1605,12 +1693,12 @@ var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "cur
 			strokeWidth: "1.5",
 			strokeLinecap: "round",
 			className: "transition-transform duration-200",
-			children: [/* @__PURE__ */ y("circle", {
+			children: [/* @__PURE__ */ b("circle", {
 				cx: "8",
 				cy: "8",
 				r: "3"
-			}), /* @__PURE__ */ y("path", { d: "M8 1v2M8 13v2M1 8h2M13 8h2M3.05 3.05l1.41 1.41M11.54 11.54l1.41 1.41M3.05 12.95l1.41-1.41M11.54 4.46l1.41-1.41" })]
-		}) : /* @__PURE__ */ y("svg", {
+			}), /* @__PURE__ */ b("path", { d: "M8 1v2M8 13v2M1 8h2M13 8h2M3.05 3.05l1.41 1.41M11.54 11.54l1.41 1.41M3.05 12.95l1.41-1.41M11.54 4.46l1.41-1.41" })]
+		}) : /* @__PURE__ */ b("svg", {
 			width: c,
 			height: c,
 			viewBox: "0 0 16 16",
@@ -1619,14 +1707,14 @@ var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "cur
 			strokeWidth: "1.5",
 			strokeLinecap: "round",
 			className: "transition-transform duration-200",
-			children: /* @__PURE__ */ y("path", { d: "M13.5 8.5a5.5 5.5 0 01-7-7A5.5 5.5 0 108 14a5.48 5.48 0 005.5-5.5z" })
+			children: /* @__PURE__ */ b("path", { d: "M13.5 8.5a5.5 5.5 0 01-7-7A5.5 5.5 0 108 14a5.48 5.48 0 005.5-5.5z" })
 		})
 	});
-}), $ = { size: {
+}), Z = { size: {
 	sm: "px-2 py-1 text-[11px]",
 	default: "px-3 py-1.5 text-xs",
 	lg: "px-4 py-2 text-sm"
-} }, Et = $, Dt = p(function({ items: t, value: n, onChange: r, exclusive: a, size: o = "default", disabled: s, className: c, ...l }, u) {
+} }, Q = Z, Ft = m(function({ items: t, value: n, onChange: r, exclusive: a, size: o = "default", disabled: s, className: c, ...l }, u) {
 	function d(e) {
 		if (a === !0) {
 			n.includes(e) || r([e]);
@@ -1634,7 +1722,7 @@ var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "cur
 		}
 		n.includes(e) ? r(n.filter((t) => t !== e)) : r([...n, e]);
 	}
-	return /* @__PURE__ */ y("div", {
+	return /* @__PURE__ */ b("div", {
 		ref: u,
 		className: e("inline-flex select-none overflow-hidden gds-radius-button border border-border bg-bg", s === !0 && "pointer-events-none opacity-50", c),
 		"data-component": "toggle-group",
@@ -1643,9 +1731,9 @@ var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "cur
 		...l,
 		children: t.map((r, a) => {
 			let c = n.includes(r.value), l = a === t.length - 1;
-			return /* @__PURE__ */ y("button", {
+			return /* @__PURE__ */ b("button", {
 				"aria-pressed": c,
-				className: e("transition-colors", $.size[o ?? "default"], !l && "border-r border-border", i, c ? "bg-accent/10 text-accent" : "text-fg-muted hover:bg-bg-tertiary"),
+				className: e("transition-colors", Z.size[o ?? "default"], !l && "border-r border-border", i, c ? "bg-accent/10 text-accent" : "text-fg-muted hover:bg-bg-tertiary"),
 				disabled: s,
 				onClick: () => d(r.value),
 				type: "button",
@@ -1653,18 +1741,18 @@ var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "cur
 			}, r.value);
 		})
 	});
-}), Ot = {
+}), It = {
 	sm: 12,
 	default: 16
-}, kt = p(function({ className: t, direction: n, size: r = "default", ...i }, a) {
-	let o = Ot[r];
-	return /* @__PURE__ */ y("span", {
+}, Lt = m(function({ className: t, direction: n, size: r = "default", ...i }, a) {
+	let o = It[r];
+	return /* @__PURE__ */ b("span", {
 		className: e("inline-flex", n === "up" ? "text-success" : n === "down" ? "text-danger" : "text-fg-muted", t),
 		"data-component": "trend-arrow",
 		"data-direction": n,
 		ref: a,
 		...i,
-		children: /* @__PURE__ */ b("svg", {
+		children: /* @__PURE__ */ x("svg", {
 			fill: "none",
 			height: o,
 			stroke: "currentColor",
@@ -1674,31 +1762,58 @@ var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "cur
 			viewBox: "0 0 24 24",
 			width: o,
 			children: [
-				n === "up" && /* @__PURE__ */ y("path", { d: "M12 19V5M5 12l7-7 7 7" }),
-				n === "down" && /* @__PURE__ */ y("path", { d: "M12 5v14M19 12l-7 7-7-7" }),
-				n === "flat" && /* @__PURE__ */ y("path", { d: "M5 12h14" })
+				n === "up" && /* @__PURE__ */ b("path", { d: "M12 19V5M5 12l7-7 7 7" }),
+				n === "down" && /* @__PURE__ */ b("path", { d: "M12 5v14M19 12l-7 7-7-7" }),
+				n === "flat" && /* @__PURE__ */ b("path", { d: "M5 12h14" })
 			]
 		})
 	});
-}), At = p(function({ className: t, items: n, max: r = 3, moreLabel: i, ...a }, o) {
+});
+//#endregion
+//#region src/l3-atoms/trend-indicator.tsx
+function Rt({ className: t, inverse: n = !1, label: r, value: i }) {
+	let a = i > 0, o = i < 0, s = i === 0 ? "text-fg-muted" : a ? n ? "text-danger" : "text-success" : n ? "text-success" : "text-danger", c = a ? "▲" : o ? "▼" : "─", l = a ? "+" : "";
+	return /* @__PURE__ */ x("span", {
+		className: e("inline-flex items-center gap-1 text-sm font-medium select-none", s, t),
+		"data-component": "trend-indicator",
+		children: [
+			/* @__PURE__ */ b("span", {
+				className: "text-[10px]",
+				children: c
+			}),
+			/* @__PURE__ */ x("span", { children: [
+				l,
+				i,
+				"%"
+			] }),
+			r !== void 0 && /* @__PURE__ */ b("span", {
+				className: "text-xs font-normal text-fg-muted",
+				children: r
+			})
+		]
+	});
+}
+//#endregion
+//#region src/l3-atoms/truncated-list.tsx
+var zt = m(function({ className: t, items: n, max: r = 3, moreLabel: i, ...a }, o) {
 	let s = n.slice(0, r), c = n.length - r;
-	return /* @__PURE__ */ b("div", {
+	return /* @__PURE__ */ x("div", {
 		className: e("inline-flex flex-wrap items-center gds-gap-sm", t),
 		"data-component": "truncated-list",
 		ref: o,
 		...a,
-		children: [s.map((e, t) => /* @__PURE__ */ y("span", { children: e }, t)), c > 0 && /* @__PURE__ */ y("span", {
+		children: [s.map((e, t) => /* @__PURE__ */ b("span", { children: e }, t)), c > 0 && /* @__PURE__ */ b("span", {
 			className: "gds-text-label text-fg-muted",
 			children: i === void 0 ? `+${c} more` : i(c)
 		})]
 	});
-}), jt = p(function({ text: t, speed: n = 50, delay: r = 0, cursor: i = !0, onComplete: a, className: o }, s) {
-	let [c, l] = v(0), [u, d] = v(r <= 0);
-	return h(() => {
+}), Bt = m(function({ text: t, speed: n = 50, delay: r = 0, cursor: i = !0, onComplete: a, className: o }, s) {
+	let [c, l] = y(0), [u, d] = y(r <= 0);
+	return g(() => {
 		if (r <= 0) return;
 		let e = setTimeout(() => d(!0), r);
 		return () => clearTimeout(e);
-	}, [r]), h(() => {
+	}, [r]), g(() => {
 		if (!u) return;
 		if (c >= t.length) {
 			a !== void 0 && a();
@@ -1712,62 +1827,62 @@ var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "cur
 		n,
 		u,
 		a
-	]), h(() => {
+	]), g(() => {
 		l(0), r <= 0 && d(!0);
-	}, [t, r]), /* @__PURE__ */ b("span", {
+	}, [t, r]), /* @__PURE__ */ x("span", {
 		ref: s,
 		className: e(o),
 		"data-component": "typewriter",
-		children: [t.slice(0, c), i && /* @__PURE__ */ y("span", {
+		children: [t.slice(0, c), i && /* @__PURE__ */ b("span", {
 			className: "inline-block animate-pulse",
 			"data-testid": "cursor",
 			"aria-hidden": !0,
 			children: "|"
 		})]
 	});
-}), Mt = {
+}), Vt = {
 	default: "text-accent",
 	gold: "text-warning",
 	official: "text-success"
-}, Nt = {
+}, Ht = {
 	default: 16,
 	sm: 12
-}, Pt = p(function({ className: t, size: n = "default", variant: r = "default", ...i }, a) {
-	let o = Nt[n];
-	return /* @__PURE__ */ y("span", {
-		className: e("inline-flex shrink-0 items-center", Mt[r], t),
+}, Ut = m(function({ className: t, size: n = "default", variant: r = "default", ...i }, a) {
+	let o = Ht[n];
+	return /* @__PURE__ */ b("span", {
+		className: e("inline-flex shrink-0 items-center", Vt[r], t),
 		"data-component": "verified-badge",
 		"data-variant": r,
 		ref: a,
 		...i,
-		children: /* @__PURE__ */ y("svg", {
+		children: /* @__PURE__ */ b("svg", {
 			fill: "currentColor",
 			height: o,
 			viewBox: "0 0 24 24",
 			width: o,
-			children: /* @__PURE__ */ y("path", { d: "M12 1l3.09 2.26L19 3.27l.01 3.91L22 10.18 19.82 13l.18 3.91-3.91 1.01L13.09 21 12 23l-3.09-2.26L5 21.73l-.01-3.91L2 14.82 4.18 12l-.18-3.91 3.91-1.01L10.91 4 12 1zm-1.5 12.5l5-5-1.41-1.41L10.5 10.67 8.41 8.59 7 10l3.5 3.5z" })
+			children: /* @__PURE__ */ b("path", { d: "M12 1l3.09 2.26L19 3.27l.01 3.91L22 10.18 19.82 13l.18 3.91-3.91 1.01L13.09 21 12 23l-3.09-2.26L5 21.73l-.01-3.91L2 14.82 4.18 12l-.18-3.91 3.91-1.01L10.91 4 12 1zm-1.5 12.5l5-5-1.41-1.41L10.5 10.67 8.41 8.59 7 10l3.5 3.5z" })
 		})
 	});
-}), Ft = p(function({ value: t, onChange: n, min: r, max: a, step: o = 1, disabled: s = !1, className: c, ...l }, u) {
+}), Wt = m(function({ value: t, onChange: n, min: r, max: a, step: o = 1, disabled: s = !1, className: c, ...l }, u) {
 	let d = r !== void 0 && t <= r, f = a !== void 0 && t >= a;
-	return /* @__PURE__ */ b("div", {
+	return /* @__PURE__ */ x("div", {
 		ref: u,
 		className: e("inline-flex items-center gap-1 select-none", c),
 		"data-component": "visual-counter",
 		...l,
 		children: [
-			/* @__PURE__ */ y("button", {
+			/* @__PURE__ */ b("button", {
 				type: "button",
 				className: e("flex h-7 w-7 items-center justify-center rounded-md border border-border text-fg-muted transition-colors hover:bg-bg-tertiary disabled:opacity-40", i),
 				disabled: s || d,
 				onClick: () => n(Math.max(r ?? -Infinity, t - o)),
 				children: "−"
 			}),
-			/* @__PURE__ */ y("span", {
+			/* @__PURE__ */ b("span", {
 				className: "min-w-[2rem] text-center tabular-nums gds-text text-fg",
 				children: t
 			}),
-			/* @__PURE__ */ y("button", {
+			/* @__PURE__ */ b("button", {
 				type: "button",
 				className: e("flex h-7 w-7 items-center justify-center rounded-md border border-border text-fg-muted transition-colors hover:bg-bg-tertiary disabled:opacity-40", i),
 				disabled: s || f,
@@ -1776,13 +1891,30 @@ var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "cur
 			})
 		]
 	});
-}), It = p(function({ children: t, className: n, duration: r = 300, scale: i = 1.1, ...a }, o) {
-	return /* @__PURE__ */ y("div", {
+}), $ = 10;
+function Gt({ className: t, onChange: n, value: r }) {
+	let i = Math.round(r / 100 * $), a = h((e) => {
+		n(Math.round((e + 1) / $ * 100));
+	}, [n]);
+	return /* @__PURE__ */ b("div", {
+		className: e("inline-flex flex-col-reverse items-center gap-1 select-none", t),
+		"data-component": "volume-slider",
+		children: Array.from({ length: $ }, (t, n) => /* @__PURE__ */ b("button", {
+			className: e("h-2 w-8 cursor-pointer rounded-sm transition-colors", n < i ? "bg-accent" : "bg-bg-tertiary"),
+			onClick: () => a(n),
+			type: "button"
+		}, n))
+	});
+}
+//#endregion
+//#region src/l3-atoms/zoom-on-hover.tsx
+var Kt = m(function({ children: t, className: n, duration: r = 300, scale: i = 1.1, ...a }, o) {
+	return /* @__PURE__ */ b("div", {
 		className: e("overflow-hidden", n),
 		"data-component": "zoom-on-hover",
 		ref: o,
 		...a,
-		children: /* @__PURE__ */ y("div", {
+		children: /* @__PURE__ */ b("div", {
 			className: "transition-transform ease-out",
 			style: { transitionDuration: `${r}ms` },
 			onMouseEnter: (e) => {
@@ -1796,6 +1928,6 @@ var ft = p(function({ value: t, max: n = 5, size: r = "default", color: i = "cur
 	});
 });
 //#endregion
-export { L as $, Ke as A, Ne as B, rt as C, Ze as D, $e as E, Be as F, Ee as G, Ae as H, ze as I, Ce as J, Te as K, Le as L, We as M, K as N, Xe as O, Ue as P, R as Q, Ie as R, it as S, et as T, ke as U, je as V, B as W, ye as X, be as Y, z as Z, pt as _, ne as _t, At as a, k as at, lt as b, $ as c, fe as ct, St as d, w as dt, I as et, xt as f, le as ft, gt as g, re as gt, ht as h, ae as ht, jt as i, A as it, Ge as j, Je as k, Et as l, ue as lt, _t as m, C as mt, Ft as n, M as nt, kt as o, O as ot, bt as p, ce as pt, we as q, Pt as r, j as rt, Dt as s, he as st, It as t, F as tt, Tt as u, T as ut, mt as v, S as vt, tt as w, ot as x, ft as y, Pe as z };
+export { Oe as $, it as A, We as B, gt as C, w as Ct, ct as D, ut as E, Ze as F, Le as G, Ve as H, W as I, Pe as J, Ie as K, Xe as L, tt as M, $e as N, st as O, Qe as P, ke as Q, qe as R, vt as S, ne as St, dt as T, Be as U, Ue as V, Re as W, je as X, R as Y, Ae as Z, wt as _, ue as _t, Bt as a, ve as at, Ct as b, ae as bt, Lt as c, M as ct, Q as d, k as dt, Te as et, Pt as f, _e as ft, Et as g, E as gt, kt as h, de as ht, Ut as i, ye as it, rt as j, ot as k, Ft as l, j as lt, At as m, fe as mt, Gt as n, L as nt, zt as o, I as ot, jt as p, me as pt, Fe as q, Wt as r, be as rt, Rt as s, N as st, Kt as t, we as tt, Z as u, A as ut, Tt as v, le as vt, pt as w, ee as wt, xt as x, re as xt, St as y, se as yt, Ke as z };
 
-//# sourceMappingURL=l3-atoms-BxDg3rXt.js.map
+//# sourceMappingURL=l3-atoms-LtIFAn9Y.js.map