@lilt-ui/charts 0.9.1 → 0.10.0

package/dist/{report-context-CkzH-r8B.js → report-context-UrwaoLYZ.js}

@@ -1,57 +1,64 @@
-import { createContext as e, useContext as t, useEffect as n, useLayoutEffect as r, useMemo as i, useRef as a, useState as o } from "react";
-import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
-import { AnimatePresence as u, animate as d, motion as f, useMotionValue as p, useMotionValueEvent as m, useReducedMotion as h, useTransform as g } from "motion/react";
-import { extent as _, min as v } from "d3-array";
-import { animate as y } from "motion";
-import ee from "@number-flow/react";
+import { createContext as e, useContext as t, useEffect as n, useId as r, useLayoutEffect as i, useMemo as a, useRef as o, useState as s } from "react";
+import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
+import { AnimatePresence as d, animate as f, motion as p, useMotionValue as m, useMotionValueEvent as h, useReducedMotion as g, useTransform as _ } from "motion/react";
+import { extent as v, min as y } from "d3-array";
+import { animate as b } from "motion";
+import x from "@number-flow/react";
 //#region src/motion/use-chart-motion.ts
-var b = [
+var S = [
 	.22,
 	1,
 	.36,
 	1
 ];
-function x(e) {
-	let [t, r] = o(!1);
+function C(e) {
+	let [t, r] = s(!1);
 	return n(() => {
 		if (typeof window > "u" || !window.matchMedia) return;
 		let e = window.matchMedia("(prefers-reduced-motion: reduce)"), t = () => r(e.matches);
 		return t(), e.addEventListener?.("change", t), () => e.removeEventListener?.("change", t);
 	}, []), e === "none" || t;
 }
-function S(e, t) {
-	let [n, i] = o(e.active ? +!!t : 1), s = a(e.key), c = e.active && e.key !== s.current;
-	return r(() => {
-		if (s.current = e.key, !e.active || t) {
-			i(1);
+function w(e, t) {
+	let [n, r] = s(e.active ? +!!t : 1), a = o(e.key), c = e.active && e.key !== a.current;
+	return i(() => {
+		if (a.current = e.key, !e.active || t) {
+			r(1);
 			return;
 		}
-		i(0);
-		let n = y(0, 1, {
-			duration: e.duration / 1e3,
-			ease: b,
-			onUpdate: (e) => i(e),
-			onComplete: () => i(1)
+		r(0);
+		let n = b(0, 1, {
+			...e.spring ? {
+				type: "spring",
+				duration: e.duration / 1e3,
+				bounce: .18
+			} : {
+				duration: e.duration / 1e3,
+				ease: S
+			},
+			onUpdate: (e) => r(e),
+			onComplete: () => r(1)
 		});
 		return () => n.stop();
 	}, [
 		t,
 		e.active,
 		e.duration,
-		e.key
-	]), t ? 1 : c ? 0 : Math.max(0, Math.min(1, n));
+		e.key,
+		e.spring
+	]), t ? 1 : c ? 0 : Math.max(0, e.spring ? n : Math.min(1, n));
 }
 //#endregion
 //#region src/interaction/pin-glyphs.tsx
-var C = "M9 4.5h6l-1 5 3 3v2H7v-2l3-3-1-5ZM12 14.5v7";
-function w({ release: e }) {
-	return /* @__PURE__ */ c("svg", {
+var T = "M9 4.5h6l-1 5 3 3v2H7v-2l3-3-1-5ZM12 14.5v7";
+function E({ release: e }) {
+	return /* @__PURE__ */ l("svg", {
 		className: e ? "lilt-chart__pin-glyph lilt-chart__pin-glyph--release" : "lilt-chart__pin-glyph",
 		viewBox: "0 0 24 24",
 		fill: "none",
 		"aria-hidden": "true",
-		children: /* @__PURE__ */ c("path", {
-			d: e ? `${C}M4.5 5.5l15 15` : C,
+		children: /* @__PURE__ */ l("path", {
+			d: e ? `${T}M4.5 5.5l15 15` : T,
 			stroke: "currentColor",
 			strokeLinecap: "round",
 			strokeLinejoin: "round",
@@ -59,22 +66,22 @@ function w({ release: e }) {
 		})
 	});
 }
-function T({ release: e = !1 }) {
-	return /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(w, {}), e ? /* @__PURE__ */ c(w, { release: !0 }) : null] });
+function D({ release: e = !1 }) {
+	return /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l(E, {}), e ? /* @__PURE__ */ l(E, { release: !0 }) : null] });
 }
 //#endregion
 //#region src/motion/number-format.ts
-var E = /* @__PURE__ */ new WeakMap();
-function D(e) {
+var O = /* @__PURE__ */ new WeakMap();
+function k(e) {
 	let t = (t) => e.format(t);
-	return E.set(t, e), t;
+	return O.set(t, e), t;
 }
-function te(e) {
-	return e instanceof Intl.NumberFormat ? e : E.get(e);
+function ee(e) {
+	return e instanceof Intl.NumberFormat ? e : O.get(e);
 }
 //#endregion
 //#region src/motion/animated-number.tsx
-var O = /\p{Decimal_Number}/u, k = /* @__PURE__ */ new Set([
+var A = /\p{Decimal_Number}/u, j = /* @__PURE__ */ new Set([
 	"integer",
 	"group",
 	"decimal",
@@ -82,10 +89,10 @@ var O = /\p{Decimal_Number}/u, k = /* @__PURE__ */ new Set([
 	"nan",
 	"infinity"
 ]);
-function A(e, t) {
+function te(e, t) {
 	let n = [];
 	if (t?.length && t.map((e) => e.value).join("") === e) {
-		let e = t.findIndex((e) => k.has(e.type)), r = t.length - 1 - [...t].reverse().findIndex((e) => k.has(e.type)), i = t.filter((e) => e.type === "integer").reduce((e, t) => e + Array.from(t.value).length, 0), a = 0, o = /* @__PURE__ */ new Map();
+		let e = t.findIndex((e) => j.has(e.type)), r = t.length - 1 - [...t].reverse().findIndex((e) => j.has(e.type)), i = t.filter((e) => e.type === "integer").reduce((e, t) => e + Array.from(t.value).length, 0), a = 0, o = /* @__PURE__ */ new Map();
 		t.forEach((t, s) => {
 			let c = e < 0 || s < e ? "prefix" : s > r ? "suffix" : "number";
 			for (let e of Array.from(t.value)) {
@@ -101,15 +108,15 @@ function A(e, t) {
 				n.push({
 					key: r,
 					char: e,
-					digit: O.test(e),
+					digit: A.test(e),
 					role: c
 				});
 			}
 		});
 	} else {
-		let t = Array.from(e), r = t.findIndex((e) => O.test(e)), i = t.length - 1 - [...t].reverse().findIndex((e) => O.test(e));
+		let t = Array.from(e), r = t.findIndex((e) => A.test(e)), i = t.length - 1 - [...t].reverse().findIndex((e) => A.test(e));
 		t.forEach((e, a) => {
-			let o = O.test(e);
+			let o = A.test(e);
 			r < 0 || a < r ? n.push({
 				key: `prefix-${a}`,
 				char: e,
@@ -141,15 +148,15 @@ function re(e, t, n) {
 	let r = ((t - e) % 10 + 10) % 10;
 	return r === 0 ? e : n > 0 ? e + r : e - (10 - r);
 }
-var ie = 240, j = .16, M = {
+var ie = 240, M = .16, N = {
 	duration: .1,
 	ease: "easeOut"
-}, N = [
+}, P = [
 	.16,
 	1,
 	.3,
 	1
-], P = {
+], ae = {
 	type: "spring",
 	stiffness: 420,
 	damping: 34,
@@ -157,13 +164,13 @@ var ie = 240, j = .16, M = {
 }, F = (e) => Math.min(e, 6) * .024;
 function I({ cell: e, change: t, style: n }) {
 	let r = n === "slide" ? .72 : 0;
-	return /* @__PURE__ */ c("span", {
+	return /* @__PURE__ */ l("span", {
 		className: "lilt-number__cell",
 		"data-digit": e.digit || void 0,
-		children: /* @__PURE__ */ c(u, {
+		children: /* @__PURE__ */ l(d, {
 			initial: !1,
 			custom: t,
-			children: /* @__PURE__ */ c(f.span, {
+			children: /* @__PURE__ */ l(p.span, {
 				className: "lilt-number__glyph",
 				custom: t,
 				variants: {
@@ -187,7 +194,7 @@ function I({ cell: e, change: t, style: n }) {
 					leave: ({ direction: e, live: t }) => t ? {
 						y: `${-e * r * 55}%`,
 						opacity: 0,
-						transition: M
+						transition: N
 					} : {
 						y: `${-e * r * 100}%`,
 						opacity: 0,
@@ -199,14 +206,14 @@ function I({ cell: e, change: t, style: n }) {
 				animate: "rest",
 				exit: "leave",
 				transition: t.live ? {
-					duration: j,
-					ease: N
+					duration: M,
+					ease: P
 				} : {
 					delay: F(e.place),
-					y: P,
+					y: ae,
 					default: {
 						duration: .26,
-						ease: N
+						ease: P
 					}
 				},
 				children: e.char
@@ -215,19 +222,19 @@ function I({ cell: e, change: t, style: n }) {
 	});
 }
 var L = Array.from({ length: 30 }, (e, t) => String(t % 10));
-function ae({ cell: e, change: t }) {
-	let r = Number(e.char), i = p(10 + r), o = a(t);
-	o.current = t, n(() => {
+function oe({ cell: e, change: t }) {
+	let r = Number(e.char), i = m(10 + r), a = o(t);
+	a.current = t, n(() => {
 		let t = i.get();
 		(t < 5 || t >= 25) && (t = 10 + (t % 10 + 10) % 10, i.jump(t));
-		let { direction: n, live: a } = o.current, s = re(t, r, n);
+		let { direction: n, live: o } = a.current, s = re(t, r, n);
 		if (s === t) return;
-		let c = d(i, s, {
+		let c = f(i, s, {
 			type: "spring",
-			stiffness: a ? 320 : 190,
-			damping: a ? 32 : 26,
+			stiffness: o ? 320 : 190,
+			damping: o ? 32 : 26,
 			mass: .9,
-			delay: a ? 0 : F(e.place),
+			delay: o ? 0 : F(e.place),
 			onComplete: () => i.jump(10 + r)
 		});
 		return () => c.stop();
@@ -236,48 +243,48 @@ function ae({ cell: e, change: t }) {
 		r,
 		i
 	]);
-	let s = g(i, (e) => `${-e / L.length * 100}%`);
-	return /* @__PURE__ */ l("span", {
+	let s = _(i, (e) => `${-e / L.length * 100}%`);
+	return /* @__PURE__ */ u("span", {
 		className: "lilt-number__cell lilt-number__cell--reel",
 		"data-digit": !0,
-		children: [/* @__PURE__ */ c("span", {
+		children: [/* @__PURE__ */ l("span", {
 			className: "lilt-number__glyph lilt-number__sizer",
 			"aria-hidden": "true",
 			children: e.char
-		}), /* @__PURE__ */ c(f.span, {
+		}), /* @__PURE__ */ l(p.span, {
 			className: "lilt-number__reel",
 			style: { y: s },
-			children: L.map((e, t) => /* @__PURE__ */ c("span", { children: e }, t))
+			children: L.map((e, t) => /* @__PURE__ */ l("span", { children: e }, t))
 		})]
 	});
 }
-var oe = "0123456789";
-function se({ cell: e, live: t }) {
-	let [r, i] = o(null), s = a(e.char), l = a(t);
-	return l.current = t, n(() => {
-		if (s.current === e.char) return;
-		s.current = e.char;
-		let t = 0, n = l.current ? 2 : 5 + Math.min(e.place, 6), r = window.setInterval(() => {
-			t += 1, i(t >= n ? null : oe[Math.floor(Math.random() * 10)]), t >= n && window.clearInterval(r);
+var se = "0123456789";
+function ce({ cell: e, live: t }) {
+	let [r, i] = s(null), a = o(e.char), c = o(t);
+	return c.current = t, n(() => {
+		if (a.current === e.char) return;
+		a.current = e.char;
+		let t = 0, n = c.current ? 2 : 5 + Math.min(e.place, 6), r = window.setInterval(() => {
+			t += 1, i(t >= n ? null : se[Math.floor(Math.random() * 10)]), t >= n && window.clearInterval(r);
 		}, 36);
 		return () => {
 			window.clearInterval(r), i(null);
 		};
-	}, [e.char, e.place]), /* @__PURE__ */ c("span", {
+	}, [e.char, e.place]), /* @__PURE__ */ l("span", {
 		className: "lilt-number__cell",
 		"data-digit": e.digit || void 0,
 		"data-scrambling": r !== null || void 0,
-		children: /* @__PURE__ */ c("span", {
+		children: /* @__PURE__ */ l("span", {
 			className: "lilt-number__glyph",
 			children: r ?? e.char
 		})
 	});
 }
 function R({ cell: e }) {
-	return /* @__PURE__ */ c("span", {
+	return /* @__PURE__ */ l("span", {
 		className: "lilt-number__cell",
 		"data-digit": e.digit || void 0,
-		children: /* @__PURE__ */ c("span", {
+		children: /* @__PURE__ */ l("span", {
 			className: "lilt-number__glyph",
 			children: e.char
 		})
@@ -288,7 +295,7 @@ var z = [
 	1.45,
 	.64,
 	1
-], ce = {
+], le = {
 	enter: (e) => e ? {
 		y: "16%",
 		opacity: .4,
@@ -303,37 +310,37 @@ var z = [
 		opacity: 1,
 		filter: "blur(0px)"
 	}
-}, le = { leave: (e) => e ? {
+}, ue = { leave: (e) => e ? {
 	y: "-16%",
 	opacity: 0,
-	transition: M
+	transition: N
 } : {
 	y: "-32%",
 	opacity: 0,
 	filter: "blur(2px)",
 	transition: {
 		duration: .3,
-		ease: N
+		ease: P
 	}
 } };
-function ue({ cells: e, live: t }) {
+function de({ cells: e, live: t }) {
 	let n = e.map((e) => e.char).join("");
-	return /* @__PURE__ */ c("span", {
+	return /* @__PURE__ */ l("span", {
 		className: "lilt-number__pop-host",
-		children: /* @__PURE__ */ c(u, {
+		children: /* @__PURE__ */ l(d, {
 			mode: "popLayout",
 			initial: !1,
 			custom: t,
-			children: /* @__PURE__ */ c(f.span, {
+			children: /* @__PURE__ */ l(p.span, {
 				className: "lilt-number__pop",
-				variants: le,
+				variants: ue,
 				initial: "enter",
 				animate: "visible",
 				exit: "leave",
-				children: e.map((e, n) => /* @__PURE__ */ c(f.span, {
+				children: e.map((e, n) => /* @__PURE__ */ l(p.span, {
 					className: "lilt-number__pop-char",
 					custom: t,
-					variants: ce,
+					variants: le,
 					transition: t ? {
 						duration: .22,
 						ease: z
@@ -348,18 +355,18 @@ function ue({ cells: e, live: t }) {
 		})
 	});
 }
-function de(e, t, r) {
-	let i = p(e), s = a(r);
-	s.current = r;
-	let [c, l] = o(e);
-	return m(i, "change", l), n(() => {
+function fe(e, t, r) {
+	let i = m(e), a = o(r);
+	a.current = r;
+	let [c, l] = s(e);
+	return h(i, "change", l), n(() => {
 		if (!t) {
 			i.jump(e);
 			return;
 		}
-		let n = d(i, e, {
-			duration: s.current ? .24 : .62,
-			ease: N
+		let n = f(i, e, {
+			duration: a.current ? .24 : .62,
+			ease: P
 		});
 		return () => n.stop();
 	}, [
@@ -368,8 +375,8 @@ function de(e, t, r) {
 		e
 	]), t ? ne(c, e) : e;
 }
-function B(e) {
-	let [t, n] = o({
+function pe(e) {
+	let [t, n] = s({
 		value: e,
 		at: 0,
 		direction: 1,
@@ -389,25 +396,25 @@ function B(e) {
 		live: t.live
 	};
 }
-function V({ value: e, format: t = String, className: n, motion: r = "auto", variant: a = "count" }) {
-	let o = !h() && r !== "none", d = te(t), p = (e) => t instanceof Intl.NumberFormat ? t.format(e) : t(e), m = (e) => A(p(e), d?.formatToParts(e)), g = a === "flow" && !d ? "slide" : a, _ = i(() => {
-		if (!d) return;
-		let { locale: e, ...t } = d.resolvedOptions();
+function B({ value: e, format: t = String, className: n, motion: r = "auto", variant: i = "count" }) {
+	let o = !g() && r !== "none", s = ee(t), f = (e) => t instanceof Intl.NumberFormat ? t.format(e) : t(e), m = (e) => te(f(e), s?.formatToParts(e)), h = i === "flow" && !s ? "slide" : i, _ = a(() => {
+		if (!s) return;
+		let { locale: e, ...t } = s.resolvedOptions();
 		return {
 			locale: e,
 			options: t
 		};
-	}, [d]), v = p(e), y = B(e), b = de(e, o && g === "count", y.live), x = ["lilt-number", n].filter(Boolean).join(" ");
-	if (g === "flow" && _) return /* @__PURE__ */ l("span", {
-		className: x,
+	}, [s]), v = f(e), y = pe(e), b = fe(e, o && h === "count", y.live), S = ["lilt-number", n].filter(Boolean).join(" ");
+	if (h === "flow" && _) return /* @__PURE__ */ u("span", {
+		className: S,
 		"data-variant": "flow",
-		children: [/* @__PURE__ */ c("span", {
+		children: [/* @__PURE__ */ l("span", {
 			className: "lilt-chart__sr-only",
 			children: v
-		}), /* @__PURE__ */ c("span", {
+		}), /* @__PURE__ */ l("span", {
 			"aria-hidden": "true",
 			className: "lilt-number__flow",
-			children: /* @__PURE__ */ c(ee, {
+			children: /* @__PURE__ */ l(x, {
 				value: e,
 				locales: _.locale,
 				format: _.options,
@@ -416,29 +423,29 @@ function V({ value: e, format: t = String, className: n, motion: r = "auto", var
 			})
 		})]
 	});
-	let S = m(g === "count" ? b : e), C = (e) => o ? e.role === "number" ? g === "count" ? /* @__PURE__ */ c(R, { cell: e }) : g === "roll" ? /[0-9]/.test(e.char) ? /* @__PURE__ */ c(ae, {
+	let C = m(h === "count" ? b : e), w = (e) => o ? e.role === "number" ? h === "count" ? /* @__PURE__ */ l(R, { cell: e }) : h === "roll" ? /[0-9]/.test(e.char) ? /* @__PURE__ */ l(oe, {
 		cell: e,
 		change: y
-	}) : /* @__PURE__ */ c(I, {
+	}) : /* @__PURE__ */ l(I, {
 		cell: e,
 		change: y,
 		style: "fade"
-	}) : g === "scramble" ? /[0-9]/.test(e.char) ? /* @__PURE__ */ c(se, {
+	}) : h === "scramble" ? /[0-9]/.test(e.char) ? /* @__PURE__ */ l(ce, {
 		cell: e,
 		live: y.live
-	}) : /* @__PURE__ */ c(I, {
+	}) : /* @__PURE__ */ l(I, {
 		cell: e,
 		change: y,
 		style: "fade"
-	}) : /* @__PURE__ */ c(I, {
+	}) : /* @__PURE__ */ l(I, {
 		cell: e,
 		change: y,
 		style: "slide"
-	}) : /* @__PURE__ */ c(I, {
+	}) : /* @__PURE__ */ l(I, {
 		cell: e,
 		change: y,
 		style: "fade"
-	}) : /* @__PURE__ */ c(R, { cell: e }), w = (e) => /* @__PURE__ */ c(f.span, {
+	}) : /* @__PURE__ */ l(R, { cell: e }), T = (e) => /* @__PURE__ */ l(p.span, {
 		className: "lilt-number__place",
 		custom: y.live,
 		initial: o ? {
@@ -454,114 +461,296 @@ function V({ value: e, format: t = String, className: n, motion: r = "auto", var
 			opacity: 0
 		} : void 0,
 		transition: {
-			duration: y.live ? j : .32,
-			ease: N
+			duration: y.live ? M : .32,
+			ease: P
 		},
-		children: C(e)
-	}, e.key), T = g === "pop" && o, E = S.filter((e) => e.role === "prefix"), D = S.filter((e) => e.role === "number"), O = S.filter((e) => e.role === "suffix");
-	return /* @__PURE__ */ l("span", {
-		className: x,
-		"data-variant": a,
-		children: [/* @__PURE__ */ c("span", {
+		children: w(e)
+	}, e.key), E = h === "pop" && o, D = C.filter((e) => e.role === "prefix"), O = C.filter((e) => e.role === "number"), k = C.filter((e) => e.role === "suffix");
+	return /* @__PURE__ */ u("span", {
+		className: S,
+		"data-variant": i,
+		children: [/* @__PURE__ */ l("span", {
 			className: "lilt-chart__sr-only",
 			children: v
-		}), /* @__PURE__ */ c("span", {
+		}), /* @__PURE__ */ l("span", {
 			"aria-hidden": "true",
 			className: "lilt-number__characters",
-			children: T ? /* @__PURE__ */ l(s, { children: [
-				/* @__PURE__ */ c(u, {
+			children: E ? /* @__PURE__ */ u(c, { children: [
+				/* @__PURE__ */ l(d, {
 					initial: !1,
-					children: E.map(w)
+					children: D.map(T)
 				}),
-				/* @__PURE__ */ c(ue, {
-					cells: D,
+				/* @__PURE__ */ l(de, {
+					cells: O,
 					live: y.live
 				}),
-				/* @__PURE__ */ c(u, {
+				/* @__PURE__ */ l(d, {
 					initial: !1,
-					children: O.map(w)
+					children: k.map(T)
 				})
-			] }) : /* @__PURE__ */ c(u, {
+			] }) : /* @__PURE__ */ l(d, {
 				initial: !1,
-				children: S.map(w)
+				children: C.map(T)
 			})
 		})]
 	});
 }
 //#endregion
+//#region src/cards/range-select.tsx
+var V = e(null);
+function me({ rangeSelect: e, children: t }) {
+	return /* @__PURE__ */ l(V.Provider, {
+		value: e ?? null,
+		children: t
+	});
+}
+function he() {
+	return t(V);
+}
+var H = [
+	.23,
+	1,
+	.32,
+	1
+];
+function ge({ value: e, options: t, onValueChange: i, "aria-label": a }) {
+	let c = r(), f = g(), [m, h] = s(!1), _ = Math.max(0, t.findIndex((t) => t.id === e)), [v, y] = s(_), b = o(null), x = o(null), S = o(null), C = t[_], w = (e = _) => {
+		y(e), h(!0);
+	}, T = (e = !0) => {
+		h(!1), e && x.current?.focus();
+	}, E = (n) => {
+		let r = t[n];
+		r && r.id !== e && i(r.id), T();
+	};
+	return n(() => {
+		if (!m) return;
+		S.current?.focus();
+		let e = (e) => {
+			b.current?.contains(e.target) || T(!1);
+		};
+		return document.addEventListener("pointerdown", e), () => document.removeEventListener("pointerdown", e);
+	}, [m]), /* @__PURE__ */ u("span", {
+		ref: b,
+		className: "lilt-card__range lilt-card__range--select",
+		"data-value": C?.id,
+		"data-open": m || void 0,
+		children: [/* @__PURE__ */ u("button", {
+			ref: x,
+			type: "button",
+			className: "lilt-range-select__trigger",
+			"aria-haspopup": "listbox",
+			"aria-expanded": m,
+			"aria-controls": m ? `${c}-list` : void 0,
+			"aria-label": `${a}: ${C?.label ?? ""}`,
+			onClick: () => m ? T() : w(),
+			onKeyDown: (e) => {
+				(e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), w(e.key === "ArrowDown" ? Math.min(t.length - 1, _ + 1) : Math.max(0, _ - 1)));
+			},
+			children: [/* @__PURE__ */ l("span", {
+				className: "lilt-range-select__value",
+				children: /* @__PURE__ */ l(d, {
+					mode: "popLayout",
+					initial: !1,
+					children: /* @__PURE__ */ l(p.span, {
+						initial: f ? { opacity: 0 } : {
+							opacity: 0,
+							y: 4,
+							filter: "blur(3px)"
+						},
+						animate: {
+							opacity: 1,
+							y: 0,
+							filter: "blur(0px)"
+						},
+						exit: f ? { opacity: 0 } : {
+							opacity: 0,
+							y: -4,
+							filter: "blur(3px)"
+						},
+						transition: {
+							duration: .2,
+							ease: H
+						},
+						children: C?.label
+					}, C?.id)
+				})
+			}), /* @__PURE__ */ l("svg", {
+				"aria-hidden": "true",
+				viewBox: "0 0 12 12",
+				width: "12",
+				height: "12",
+				children: /* @__PURE__ */ l("path", {
+					d: "M3 4.5 6 7.5 9 4.5",
+					fill: "none",
+					stroke: "currentColor",
+					strokeWidth: "1.5"
+				})
+			})]
+		}), /* @__PURE__ */ l(d, { children: m ? /* @__PURE__ */ l(p.ul, {
+			ref: S,
+			id: `${c}-list`,
+			role: "listbox",
+			tabIndex: -1,
+			"aria-label": a,
+			"aria-activedescendant": `${c}-option-${v}`,
+			className: "lilt-range-select__list",
+			onKeyDown: (e) => {
+				let n = (n) => {
+					e.preventDefault(), y(Math.max(0, Math.min(t.length - 1, n)));
+				};
+				if (e.key === "ArrowDown") n(v + 1);
+				else if (e.key === "ArrowUp") n(v - 1);
+				else if (e.key === "Home") n(0);
+				else if (e.key === "End") n(t.length - 1);
+				else if (e.key === "Enter" || e.key === " ") e.preventDefault(), E(v);
+				else if (e.key === "Escape") e.preventDefault(), T();
+				else if (e.key === "Tab") T(!1);
+				else if (e.key.length === 1) {
+					let r = e.key.toLowerCase(), i = t.findIndex((e, t) => t > v && e.label.toLowerCase().startsWith(r)), a = i >= 0 ? i : t.findIndex((e) => e.label.toLowerCase().startsWith(r));
+					a >= 0 && n(a);
+				}
+			},
+			initial: f ? { opacity: 0 } : {
+				opacity: 0,
+				scale: .96,
+				y: -4,
+				filter: "blur(4px)"
+			},
+			animate: {
+				opacity: 1,
+				scale: 1,
+				y: 0,
+				filter: "blur(0px)"
+			},
+			exit: f ? {
+				opacity: 0,
+				transition: { duration: .1 }
+			} : {
+				opacity: 0,
+				scale: .97,
+				filter: "blur(3px)",
+				transition: { duration: .12 }
+			},
+			transition: {
+				duration: .18,
+				ease: H
+			},
+			children: t.map((e, t) => /* @__PURE__ */ u("li", {
+				id: `${c}-option-${t}`,
+				role: "option",
+				"data-value": e.id,
+				"aria-selected": t === _,
+				className: "lilt-range-select__option",
+				"data-active": t === v || void 0,
+				onPointerMove: () => y(t),
+				onClick: () => E(t),
+				children: [
+					t === v ? /* @__PURE__ */ l(p.span, {
+						layoutId: f ? void 0 : `${c}-highlight`,
+						className: "lilt-range-select__highlight",
+						transition: {
+							type: "spring",
+							duration: .3,
+							bounce: 0
+						}
+					}) : null,
+					/* @__PURE__ */ l("span", {
+						className: "lilt-range-select__label",
+						children: e.label
+					}),
+					t === _ ? /* @__PURE__ */ l("svg", {
+						"aria-hidden": "true",
+						className: "lilt-range-select__check",
+						viewBox: "0 0 12 12",
+						width: "12",
+						height: "12",
+						children: /* @__PURE__ */ l("path", {
+							d: "M2.5 6.5 5 9l4.5-6",
+							fill: "none",
+							stroke: "currentColor",
+							strokeWidth: "1.6"
+						})
+					}) : null
+				]
+			}, e.id))
+		}) : null })]
+	});
+}
+//#endregion
 //#region src/cards/chart-card.tsx
-var H = e("count");
-function U(...e) {
+var U = e("count");
+function W(...e) {
 	return e.filter(Boolean).join(" ");
 }
-var W = e(null);
-function fe({ children: e, surface: n = "elevated", palette: r, motion: i, numberStyle: a = "count", badge: o, className: s, style: u, "aria-label": d }) {
-	let f = t(W), p = f?.badge ?? o, m = p != null && p !== !1, h = m || f !== null, g = {
+var G = e(null);
+function _e({ children: e, surface: n = "elevated", palette: r, motion: i, numberStyle: a = "count", badge: o, className: s, style: c, "aria-label": d, onKeyDown: f }) {
+	let p = t(G), m = p?.badge ?? o, h = m != null && m !== !1, g = h || p !== null, _ = {
 		"data-lilt-chart": "",
 		"data-lilt-palette": r,
 		"data-motion": i === "none" ? "none" : void 0,
-		style: u
-	}, _ = /* @__PURE__ */ c("section", {
-		...h ? { "data-lilt-chart": "" } : g,
+		style: c
+	}, v = /* @__PURE__ */ l("section", {
+		...g ? { "data-lilt-chart": "" } : _,
 		"data-surface": n,
-		"data-tone": f?.tone ?? void 0,
-		className: U("lilt-card", !h && s),
+		"data-tone": p?.tone ?? void 0,
+		className: W("lilt-card", !g && s),
 		"aria-label": d,
-		children: /* @__PURE__ */ c(W.Provider, {
+		onKeyDown: f,
+		children: /* @__PURE__ */ l(G.Provider, {
 			value: null,
 			children: e
 		})
 	});
-	return /* @__PURE__ */ c(H.Provider, {
+	return /* @__PURE__ */ l(U.Provider, {
 		value: a,
-		children: h ? /* @__PURE__ */ l("div", {
-			...g,
-			className: U("lilt-card-frame", s),
-			"data-tabbed": m || void 0,
+		children: g ? /* @__PURE__ */ u("div", {
+			..._,
+			className: W("lilt-card-frame", s),
+			"data-tabbed": h || void 0,
 			children: [
-				m ? /* @__PURE__ */ c(G, { children: p }) : null,
-				f?.handle,
-				_
+				h ? /* @__PURE__ */ l(K, { children: m }) : null,
+				p?.handle,
+				v
 			]
-		}) : _
+		}) : v
 	});
 }
-function G({ children: e, className: t }) {
-	return /* @__PURE__ */ c("div", {
+function K({ children: e, className: t }) {
+	return /* @__PURE__ */ l("div", {
 		"data-lilt-chart": "",
-		className: U("lilt-card-badge", t),
+		className: W("lilt-card-badge", t),
 		children: e
 	});
 }
-function pe({ children: e, aside: t, className: n }) {
-	return /* @__PURE__ */ l("header", {
-		className: U("lilt-card__header", n),
-		children: [/* @__PURE__ */ c("div", {
+function ve({ children: e, aside: t, className: n }) {
+	return /* @__PURE__ */ u("header", {
+		className: W("lilt-card__header", n),
+		children: [/* @__PURE__ */ l("div", {
 			className: "lilt-card__heading",
 			children: e
-		}), t ? /* @__PURE__ */ c("div", {
+		}), t ? /* @__PURE__ */ l("div", {
 			className: "lilt-card__aside",
 			children: t
 		}) : null]
 	});
 }
-function me({ children: e }) {
-	return /* @__PURE__ */ c("p", {
+function ye({ children: e }) {
+	return /* @__PURE__ */ l("p", {
 		className: "lilt-card__title",
 		children: e
 	});
 }
-function he({ value: e, format: n, children: r, loading: i = !1, motion: a }) {
-	let o = t(H);
-	return /* @__PURE__ */ l("div", {
+function be({ value: e, format: n, children: r, loading: i = !1, motion: a }) {
+	let o = t(U);
+	return /* @__PURE__ */ u("div", {
 		className: "lilt-card__value-row",
-		children: [/* @__PURE__ */ c("strong", {
+		children: [/* @__PURE__ */ l("strong", {
 			className: "lilt-card__value",
 			"data-loading": i || void 0,
-			children: i ? /* @__PURE__ */ c("span", {
+			children: i ? /* @__PURE__ */ l("span", {
 				className: "lilt-card__skeleton",
 				"aria-label": "Loading"
-			}) : e === null ? "—" : /* @__PURE__ */ c(V, {
+			}) : e === null ? "—" : /* @__PURE__ */ l(B, {
 				value: e,
 				format: n,
 				variant: o,
@@ -570,71 +759,60 @@ function he({ value: e, format: n, children: r, loading: i = !1, motion: a }) {
 		}), r]
 	});
 }
-var ge = (e) => `${e >= 0 ? "+" : ""}${(e * 100).toFixed(1)}%`;
-function _e({ value: e, tone: t = "default", format: n = ge }) {
+var xe = (e) => `${e >= 0 ? "+" : ""}${(e * 100).toFixed(1)}%`;
+function Se({ value: e, tone: t = "default", format: n = xe }) {
 	let r = e > 0 ? "up" : e < 0 ? "down" : "flat";
-	return /* @__PURE__ */ c("span", {
+	return /* @__PURE__ */ l("span", {
 		className: "lilt-card__delta",
 		"data-tone": t === "neutral" || r === "flat" ? "neutral" : r === "up" == (t === "default") ? "positive" : "negative",
 		children: n(e)
 	});
 }
-function ve({ children: e }) {
-	return /* @__PURE__ */ c("span", {
+function Ce({ children: e }) {
+	return /* @__PURE__ */ l("span", {
 		className: "lilt-card__caption",
 		children: e
 	});
 }
-function ye({ label: e, options: t, value: n, onValueChange: r }) {
-	return !t || t.length < 2 ? /* @__PURE__ */ c("span", {
+function we({ label: e, options: t, value: n, onValueChange: r }) {
+	let i = he();
+	if (!t || t.length < 2) return /* @__PURE__ */ l("span", {
 		className: "lilt-card__range",
 		children: e ?? t?.[0]?.label
-	}) : /* @__PURE__ */ l("span", {
-		className: "lilt-card__range lilt-card__range--select",
-		children: [/* @__PURE__ */ c("select", {
-			"aria-label": "Period",
-			value: n,
-			onChange: (e) => r?.(e.target.value),
-			children: t.map((e) => /* @__PURE__ */ c("option", {
-				value: e.id,
-				children: e.label
-			}, e.id))
-		}), /* @__PURE__ */ c("svg", {
-			"aria-hidden": "true",
-			viewBox: "0 0 12 12",
-			width: "12",
-			height: "12",
-			children: /* @__PURE__ */ c("path", {
-				d: "M3 4.5 6 7.5 9 4.5",
-				fill: "none",
-				stroke: "currentColor",
-				strokeWidth: "1.5"
-			})
-		})]
 	});
+	let a = {
+		value: n ?? t[0].id,
+		options: t,
+		onValueChange: (e) => r?.(e),
+		"aria-label": "Period"
+	};
+	return i ? /* @__PURE__ */ l("span", {
+		className: "lilt-card__range-slot",
+		children: /* @__PURE__ */ l(i, { ...a })
+	}) : /* @__PURE__ */ l(ge, { ...a });
 }
 //#endregion
 //#region src/watch/engine/robust.ts
-function K(e) {
+function q(e) {
 	if (e.length === 0) return null;
 	let t = [...e].sort((e, t) => e - t), n = t.length >> 1;
 	return t.length % 2 == 1 ? t[n] : (t[n - 1] + t[n]) / 2;
 }
-function be(e, t) {
-	let n = K(e.map((e) => Math.abs(e - t)));
+function Te(e, t) {
+	let n = q(e.map((e) => Math.abs(e - t)));
 	return n === null ? 0 : n * 1.4826;
 }
 //#endregion
 //#region src/watch/engine/normal.ts
-var q = 1440, xe = 256, Se = 12;
-function Ce({ data: e, x: t, value: n, normal: r }) {
+var J = 1440, Ee = 256, De = 12;
+function Oe({ data: e, x: t, value: n, normal: r }) {
 	let i = (e, t) => {
 		let n = e[t];
 		return typeof n == "number" && Number.isFinite(n) ? n : null;
 	}, a = e.map((e) => i(e, n));
 	if (r.around !== void 0 && r.tolerance === void 0) throw Error("Lilt Charts: `normal.around` needs a `tolerance`.");
 	if (r.given !== void 0 && r.learn === void 0) throw Error("Lilt Charts: `normal.given` needs `learn`.");
-	let o = r.learn === void 0 ? null : De(r.learn), s = o ? Oe(e, t, o) : null, c = r.given === void 0 ? null : Z(r.given, e, i), l = /* @__PURE__ */ new Map(), u = [], d = Object.entries(r.rules ?? {}).map(([e, t]) => typeof t == "function" ? {
+	let o = r.learn === void 0 ? null : Me(r.learn), s = o ? Ne(e, t, o) : null, c = r.given === void 0 ? null : Fe(r.given, e, i), l = /* @__PURE__ */ new Map(), u = [], d = Object.entries(r.rules ?? {}).map(([e, t]) => typeof t == "function" ? {
 		id: e,
 		test: t
 	} : {
@@ -651,36 +829,36 @@ function Ce({ data: e, x: t, value: n, normal: r }) {
 			h = {
 				lower: e ?? null,
 				upper: t ?? null
-			}, p && f !== null && (t !== void 0 && f > t && m.push(J("limit", "max", n, "above", t, f, Y(t))), e !== void 0 && f < e && m.push(J("limit", "min", n, "below", e, f, Y(e))));
+			}, p && f !== null && (t !== void 0 && f > t && m.push(Y("limit", "max", n, "above", t, f, X(t))), e !== void 0 && f < e && m.push(Y("limit", "min", n, "below", e, f, X(e))));
 		}
 		if (r.around !== void 0 && r.tolerance !== void 0) {
 			let e = i(t, r.around);
 			if (e !== null) {
-				let t = we(r.tolerance, e), n = {
+				let t = ke(r.tolerance, e), n = {
 					lower: e - t,
 					upper: e + t
 				};
-				if (h = X(h, n), g = e, p && f !== null) {
+				if (h = Z(h, n), g = e, p && f !== null) {
 					let e = r.aroundSeverity ?? "warning";
-					f > n.upper ? m.push(J("around", "around", e, "above", n.upper, f, t)) : f < n.lower && m.push(J("around", "around", e, "below", n.lower, f, t));
+					f > n.upper ? m.push(Y("around", "around", e, "above", n.upper, f, t)) : f < n.lower && m.push(Y("around", "around", e, "below", n.lower, f, t));
 				}
 			}
 		}
 		if (o && s) {
-			let e = Ae(s(t), c ? c(t) : ""), r = e === null ? void 0 : l.get(e), i = r?.values;
+			let e = Ie(s(t), c ? c(t) : ""), r = e === null ? void 0 : l.get(e), i = r?.values;
 			if (r && i && i.length >= o.minSamples) {
-				let e = K(i);
+				let e = q(i);
 				_ = [...r.rows];
-				let t = u.length >= Se ? K(u) * 1.4826 : 0, n = Math.max(be(i, e), Math.abs(e) * Math.max(t, .02), 1e-9) * o.width, a = {
+				let t = u.length >= De ? q(u) * 1.4826 : 0, n = Math.max(Te(i, e), Math.abs(e) * Math.max(t, .02), 1e-9) * o.width, a = {
 					lower: e - n,
 					upper: e + n
 				};
-				h = X(h, a), g = e, p && f !== null && (f > a.upper ? m.push(J("learned", "learned", o.severity, "above", a.upper, f, n)) : f < a.lower && m.push(J("learned", "learned", o.severity, "below", a.lower, f, n)));
+				h = Z(h, a), g = e, p && f !== null && (f > a.upper ? m.push(Y("learned", "learned", o.severity, "above", a.upper, f, n)) : f < a.lower && m.push(Y("learned", "learned", o.severity, "below", a.lower, f, n)));
 			}
 			if (e !== null && p && f !== null) {
 				if (g !== null && i && i.length >= o.minSamples) {
-					let e = K(i);
-					e !== 0 && (u.push(Math.abs(f - e) / Math.abs(e)), u.length > xe && u.shift());
+					let e = q(i);
+					e !== 0 && (u.push(Math.abs(f - e) / Math.abs(e)), u.length > Ee && u.shift());
 				}
 				let t = l.get(e) ?? {
 					values: [],
@@ -716,7 +894,7 @@ function Ce({ data: e, x: t, value: n, normal: r }) {
 		};
 	});
 }
-function J(e, t, n, r, i, a, o) {
+function Y(e, t, n, r, i, a, o) {
 	return {
 		source: e,
 		id: t,
@@ -726,19 +904,19 @@ function J(e, t, n, r, i, a, o) {
 		score: 1 + Math.abs(a - i) / Math.max(o, 1e-9)
 	};
 }
-var Y = (e) => e === 0 ? 1 : Math.abs(e) * .1;
-function we(e, t) {
+var X = (e) => e === 0 ? 1 : Math.abs(e) * .1;
+function ke(e, t) {
 	return typeof e == "number" ? Math.abs(e) : Math.abs(t) * Math.abs(Number.parseFloat(e)) / 100;
 }
-function X(e, t) {
-	let n = Te(e.lower, t.lower), r = Ee(e.upper, t.upper);
+function Z(e, t) {
+	let n = Ae(e.lower, t.lower), r = je(e.upper, t.upper);
 	return n !== null && r !== null && n > r ? e : {
 		lower: n,
 		upper: r
 	};
 }
-var Te = (e, t) => e === null ? t : t === null ? e : Math.max(e, t), Ee = (e, t) => e === null ? t : t === null ? e : Math.min(e, t);
-function De(e) {
+var Ae = (e, t) => e === null ? t : t === null ? e : Math.max(e, t), je = (e, t) => e === null ? t : t === null ? e : Math.min(e, t);
+function Me(e) {
 	return {
 		width: 3,
 		history: 8,
@@ -748,7 +926,7 @@ function De(e) {
 		...typeof e == "string" ? { period: e } : e
 	};
 }
-function Oe(e, t, n) {
+function Ne(e, t, n) {
 	if (n.period === "all") return () => "all";
 	let r = (e) => {
 		let r = e[t];
@@ -756,7 +934,7 @@ function Oe(e, t, n) {
 		if (typeof r == "number" && Number.isFinite(r)) return r;
 		if (r == null) return null;
 		throw Error(`Lilt Charts: learning by '${n.period}' needs dates or epoch milliseconds in '${t}'.`);
-	}, i = n.slotMinutes ?? ke(e.map(r));
+	}, i = n.slotMinutes ?? Pe(e.map(r));
 	return (e) => {
 		let t = r(e);
 		if (t === null) return null;
@@ -764,22 +942,22 @@ function Oe(e, t, n) {
 		return n.period === "week" ? `${a.getUTCDay()}:${s}` : String(s);
 	};
 }
-function ke(e) {
+function Pe(e) {
 	let t = e.filter((e) => e !== null), n = [];
 	for (let e = 1; e < t.length; e += 1) {
 		let r = t[e] - t[e - 1];
 		r > 0 && n.push(r);
 	}
-	let r = K(n);
-	return r === null ? q : Math.min(q, Math.max(1, Math.round(r / 6e4)));
+	let r = q(n);
+	return r === null ? J : Math.min(J, Math.max(1, Math.round(r / 6e4)));
 }
-function Z(e, t, n) {
+function Fe(e, t, n) {
 	let { key: r, step: i } = typeof e == "string" ? {
 		key: e,
 		step: void 0
 	} : e, a = i;
 	if (a === void 0) {
-		let e = t.map((e) => n(e, r)).filter((e) => e !== null), [i, o] = _(e), s = i === void 0 || o === void 0 ? 0 : o - i;
+		let e = t.map((e) => n(e, r)).filter((e) => e !== null), [i, o] = v(e), s = i === void 0 || o === void 0 ? 0 : o - i;
 		a = s > 0 ? s / 8 : 1;
 	}
 	return (e) => {
@@ -787,16 +965,16 @@ function Z(e, t, n) {
 		return t === null ? null : String(Math.floor(t / a));
 	};
 }
-function Ae(e, t) {
+function Ie(e, t) {
 	return e === null || t === null ? null : t === "" ? e : `${e}|${t}`;
 }
 //#endregion
 //#region src/watch/engine/status.ts
-function je(e, { enter: t = 2, exit: n = 3 } = {}) {
+function Le(e, { enter: t = 2, exit: n = 3 } = {}) {
 	let r = [], i = !1, a = null, o = null, s = [], c = 0, l = 0, u = 0, d = 0, f = [];
 	for (let p of e) {
 		let e = p.flags.length > 0;
-		p.judged && (e || p.value !== null) && (e ? (d = 0, l === 0 && (u = p.index, f = []), l += 1, f.push(p), !i && l >= t ? (i = !0, o = u, a = Me(f), c = Math.max(...f.map((e) => e.score)), s = p.flags, r.push({
+		p.judged && (e || p.value !== null) && (e ? (d = 0, l === 0 && (u = p.index, f = []), l += 1, f.push(p), !i && l >= t ? (i = !0, o = u, a = Re(f), c = Math.max(...f.map((e) => e.score)), s = p.flags, r.push({
 			type: "activated",
 			index: p.index,
 			severity: a,
@@ -820,10 +998,10 @@ function je(e, { enter: t = 2, exit: n = 3 } = {}) {
 		events: r
 	};
 }
-var Me = (e) => e.some((e) => e.severity === "critical") ? "critical" : "warning";
+var Re = (e) => e.some((e) => e.severity === "critical") ? "critical" : "warning";
 //#endregion
 //#region src/watch/engine/describe.ts
-function Ne(e, { formatValue: t = String, aroundLabel: n = "reference" } = {}) {
+function ze(e, { formatValue: t = String, aroundLabel: n = "reference" } = {}) {
 	let r = e.direction === "above";
 	switch (e.source) {
 		case "limit": return `${r ? "Above max" : "Below min"} ${t(e.bound)}`;
@@ -862,11 +1040,11 @@ function Q(e, t) {
 	};
 }
 var $ = (e) => typeof e == "number" && Number.isFinite(e);
-function Pe({ data: e, points: t, indices: n, breakdown: r, fallback: i = 6 }) {
+function Be({ data: e, points: t, indices: n, breakdown: r, fallback: i = 6 }) {
 	if (!n.length) return null;
 	let a = {}, o = {}, s = (e, t, n) => {
 		e[t] !== null && (e[t] = n === null ? null : (e[t] ?? 0) + n);
-	}, c = v(n) ?? Infinity, l = [];
+	}, c = y(n) ?? Infinity, l = [];
 	for (let e = c - 1; e >= 0 && l.length < i; --e) {
 		let n = t[e];
 		n?.judged && n.value !== null && n.flags.length === 0 && l.push(e);
@@ -877,12 +1055,12 @@ function Pe({ data: e, points: t, indices: n, breakdown: r, fallback: i = 6 }) {
 		let c = r(n), u = (t[i]?.basis?.length ? t[i].basis : l).map((t) => r(e[t])), d = /* @__PURE__ */ new Set([...Object.keys(c), ...u.flatMap(Object.keys)]);
 		for (let e of d) {
 			let t = c[e];
-			s(a, e, $(t) ? t : null), s(o, e, K(u.map((t) => t[e]).filter($)));
+			s(a, e, $(t) ? t : null), s(o, e, q(u.map((t) => t[e]).filter($)));
 		}
 	}
 	return Q(a, o);
 }
-function Fe(e, { lead: t = .5 } = {}) {
+function Ve(e, { lead: t = .5 } = {}) {
 	if (!e || e.delta === 0) return null;
 	let [n, r] = e.parts;
 	if (!n || n.share <= 0) return null;
@@ -891,6 +1069,6 @@ function Fe(e, { lead: t = .5 } = {}) {
 }
 //#endregion
 //#region src/watch/board/report-context.ts
-var Ie = e(null);
+var He = e(null);
 //#endregion
-export { x as S, V as _, Ne as a, b, G as c, ve as d, _e as f, he as g, me as h, Pe as i, W as l, ye as m, Fe as n, je as o, pe as p, Q as r, Ce as s, Ie as t, fe as u, D as v, S as x, T as y };
+export { C, w as S, me as _, ze as a, D as b, K as c, Ce as d, Se as f, be as g, ye as h, Be as i, G as l, we as m, Ve as n, Le as o, ve as p, Q as r, Oe as s, He as t, _e as u, B as v, S as x, k as y };