@mechane-ai/elements 0.8.0 → 0.10.0

package/dist/charts/cartesian.js

@@ -1,200 +1,257 @@
-import { i as e, n as t, r as n, t as r } from "../categorical-values-dGbaZ0tp.js";
-import { a as i, i as a, n as o, o as s, r as c, t as l } from "../chart-frame-DgPdIguO.js";
-import { n as u, r as d, t as f } from "../chart-input-Sac4StHN.js";
-import { t as p } from "../plot-width--OgdohB5.js";
-import { b as m } from "../src-Bc5sEhdO.js";
-import { h } from "../src-Eg_ytPjv.js";
-import { colors as g } from "../tokens.js";
-import * as _ from "@stylexjs/stylex";
-import { useEffect as v, useId as y, useMemo as b, useRef as x, useState as S } from "react";
-import { Fragment as C, jsx as w, jsxs as T } from "react/jsx-runtime";
-import { scaleBand as E, scaleLinear as D } from "@visx/scale";
-import { AreaClosed as O, Bar as k, LinePath as A } from "@visx/shape";
+import { c as e } from "../src-CBspCKfO.js";
+import { i as t, n, r, t as i } from "../categorical-values-DLRE4EEW.js";
+import { a, i as o, n as s, o as c, r as l, s as u, t as d } from "../chart-frame-et6f6Vhg.js";
+import { n as f, r as p, t as m } from "../chart-input-CdLkFomi.js";
+import { t as h } from "../plot-width--OgdohB5.js";
+import { E as g } from "../src-sU9b0oZW.js";
+import { h as _ } from "../src-Be7NLG8c.js";
+import { colors as v } from "../tokens.js";
+import * as y from "@stylexjs/stylex";
+import { useEffect as b, useId as x, useMemo as S, useRef as C, useState as w } from "react";
+import { Fragment as T, jsx as E, jsxs as D } from "react/jsx-runtime";
+import { scaleBand as O, scaleLinear as k } from "@visx/scale";
+import { AreaClosed as A, Bar as ee, LinePath as j } from "@visx/shape";
 // packages/charts/src/cartesian/bar-chart.tsx
-var ee = { plot: {
+var M = { plot: {
 	kqGvvJ: "x1we84gm",
 	$$css: !0
-} }, j = /* @__PURE__ */ new Set(["Enter", " "]);
-function M({ categories: e, series: n, domain: r, mode: i }) {
-	if (e.length > t.items || n.length > t.series) return `Choose a window with at most ${t.items} categories and ${t.series} series.`;
-	if (!d(r) || r[0] > 0 || r[1] < 0) return "The bar domain must be finite, increasing, and include zero.";
-	if (!u(e) || !u(n)) return "Bar categories and series require unique identifiers.";
-	for (let t of n) {
-		if (t.values.length !== e.length) return "Every series requires one explicit value per category.";
-		for (let e of t.values) {
+} }, N = /* @__PURE__ */ new Set(["Enter", " "]), te = 200, P = "Point, tap, or use the arrow keys to inspect values.";
+function ne({ title: e, description: t, series: n, children: i }) {
+	let a = n.map((e, t) => ({
+		id: e.id,
+		label: e.label,
+		tone: r(e.tone, t)
+	}));
+	return /* @__PURE__ */ D(l, {
+		title: e,
+		description: t,
+		children: [/* @__PURE__ */ E(o, { items: a }), i]
+	});
+}
+function F({ title: t = "Loading chart", description: n, series: r = [], height: i = te }) {
+	let a = I(i);
+	return a === void 0 ? /* @__PURE__ */ E("div", {
+		"aria-hidden": !0,
+		inert: !0,
+		children: /* @__PURE__ */ D(ne, {
+			title: t,
+			description: n,
+			series: r,
+			children: [
+				/* @__PURE__ */ E("div", {
+					...y.props(c.plot, M.plot),
+					children: /* @__PURE__ */ E(e, { height: i })
+				}),
+				/* @__PURE__ */ E("div", {
+					className: "x78zum5 x1a02dak x8zbtdt x1gkm1c7 x1mqbd49 xy8obcc xas2l8k xss6m8b xj0a0fe",
+					children: /* @__PURE__ */ D("span", {
+						className: "x1n2onr6 xeuugli",
+						children: [/* @__PURE__ */ E("span", {
+							className: "xlshs6z",
+							children: P
+						}), /* @__PURE__ */ E("span", {
+							className: "x10l6tqk x10a8y8t",
+							children: /* @__PURE__ */ E(e, { height: "100%" })
+						})]
+					})
+				}),
+				/* @__PURE__ */ E("div", {
+					className: "xlshs6z",
+					children: /* @__PURE__ */ E(d, { children: null })
+				})
+			]
+		})
+	}) : /* @__PURE__ */ E(m, {
+		title: t,
+		description: n,
+		message: a
+	});
+}
+function I(e) {
+	if (!Number.isFinite(e) || e < 48) return "Chart height must be at least 48 pixels.";
+}
+function L({ categories: e, series: t, domain: r, mode: i }) {
+	if (e.length > n.items || t.length > n.series) return `Choose a window with at most ${n.items} categories and ${n.series} series.`;
+	if (!p(r) || r[0] > 0 || r[1] < 0) return "The bar domain must be finite, increasing, and include zero.";
+	if (!f(e) || !f(t)) return "Bar categories and series require unique identifiers.";
+	for (let n of t) {
+		if (n.values.length !== e.length) return "Every series requires one explicit value per category.";
+		for (let e of n.values) {
 			if (e !== null && (!Number.isFinite(e) || e < r[0] || e > r[1])) return "Bar values must be finite and within the supplied domain.";
 			if (i === "stacked" && (e === null || e < 0)) return "Stacked bars require present nonnegative values.";
 		}
 	}
-	if (i === "stacked" && e.some((e, t) => n.reduce((e, n) => e + (n.values[t] ?? 0), 0) > r[1])) return "Stacked bar totals must fit the supplied domain.";
+	if (i === "stacked" && e.some((e, n) => t.reduce((e, t) => e + (t.values[n] ?? 0), 0) > r[1])) return "Stacked bar totals must fit the supplied domain.";
 }
-function N({ title: e, description: t, categories: o, series: u, domain: d, mode: m = "grouped", formatValue: h, selection: g, height: v = 200 }) {
-	let b = M({
-		categories: o,
-		series: u,
-		domain: d,
-		mode: m
-	}), { ref: x, width: O } = p(), A = y(), [N, P] = S(), F = o.findIndex((e) => e.id === N?.id), I = o[F];
-	if (b !== void 0 || !Number.isFinite(v) || v < 48) return /* @__PURE__ */ w(f, {
+function R({ title: e, description: t, categories: n, series: a, domain: o, mode: s = "grouped", formatValue: l, selection: f, height: p = te }) {
+	let g = L({
+		categories: n,
+		series: a,
+		domain: o,
+		mode: s
+	}) ?? I(p), { ref: _, width: v } = h(), b = x(), [S, C] = w(), A = n.findIndex((e) => e.id === S?.id), j = n[A], F = n.findIndex((e) => e.id === f?.selectedId), R = n[F], B = j ?? R, V = j === void 0 ? F : A;
+	if (g !== void 0) return /* @__PURE__ */ E(m, {
 		title: e,
 		description: t,
-		message: b ?? "Chart height must be at least 48 pixels."
+		message: g
 	});
-	let L = v - 28, R = D({
-		domain: [...d],
-		range: [L, 12]
-	}), z = Math.max(52, ...R.ticks(3).map((e) => h(e).length * 7 + 12)), B = Math.max(z + 1, O - 16), V = E({
-		domain: o.map((e) => e.id),
-		range: [z, B],
+	let H = p - 28, U = k({
+		domain: [...o],
+		range: [H, 12]
+	}), W = Math.max(52, ...U.ticks(3).map((e) => l(e).length * 7 + 12)), G = Math.max(W + 1, v - 16), K = O({
+		domain: n.map((e) => e.id),
+		range: [W, G],
 		padding: .3
-	}), H = E({
-		domain: u.map((e) => e.id),
-		range: [0, V.bandwidth()],
+	}), q = O({
+		domain: a.map((e) => e.id),
+		range: [0, K.bandwidth()],
 		padding: .08
-	}), U = Math.min(120, Math.max(40, ...o.map((e) => (e.axisLabel ?? e.label).length * 7))), W = Math.max(1, Math.ceil((U + 16) / V.step())), G = Math.max(1, Math.floor((V.step() * W - 16) / 7)), K = u.map((e, t) => ({
-		id: e.id,
-		label: e.label,
-		tone: n(e.tone, t)
-	}));
-	function q(e) {
-		let t = e.currentTarget.getBoundingClientRect(), n = (e.clientX - t.left) / t.width * O, r = Math.floor((n - z) / V.step()), i = o[Math.max(0, Math.min(o.length - 1, r))];
-		i !== void 0 && P({
-			id: i.id,
+	}), re = Math.min(120, Math.max(40, ...n.map((e) => (e.axisLabel ?? e.label).length * 7))), J = Math.max(1, Math.ceil((re + 16) / K.step())), ie = Math.max(1, Math.floor((K.step() * J - 16) / 7));
+	function Y(e) {
+		let t = e.currentTarget.getBoundingClientRect(), r = (e.clientX - t.left) / t.width * v, i = Math.floor((r - W) / K.step()), a = n[Math.max(0, Math.min(n.length - 1, i))];
+		a !== void 0 && C({
+			id: a.id,
 			source: "pointer"
 		});
 	}
-	function J(e) {
+	function ae(e) {
 		if (e.altKey || e.ctrlKey || e.metaKey) return;
 		if (e.key === "Escape") {
-			e.preventDefault(), e.stopPropagation(), P(void 0);
+			e.preventDefault(), e.stopPropagation(), C(void 0);
 			return;
 		}
-		if (j.has(e.key)) {
-			I !== void 0 && g !== void 0 && (e.preventDefault(), g.onSelect(I.id));
+		if (N.has(e.key)) {
+			j !== void 0 && f !== void 0 && (e.preventDefault(), f.onSelect(j.id));
 			return;
 		}
 		let t = {
-			ArrowRight: Math.min(o.length - 1, F + 1),
-			ArrowLeft: Math.max(0, F - 1),
+			ArrowRight: Math.min(n.length - 1, A + 1),
+			ArrowLeft: Math.max(0, A - 1),
 			Home: 0,
-			End: o.length - 1
-		}[e.key], n = t === void 0 ? void 0 : o[t];
-		n !== void 0 && (e.preventDefault(), P({
-			id: n.id,
+			End: n.length - 1
+		}[e.key], r = t === void 0 ? void 0 : n[t];
+		r !== void 0 && (e.preventDefault(), C({
+			id: r.id,
 			source: "keyboard"
 		}));
 	}
-	return /* @__PURE__ */ T(c, {
+	return /* @__PURE__ */ D(ne, {
 		title: e,
 		description: t,
+		series: a,
 		children: [
-			/* @__PURE__ */ w(a, { items: K }),
-			/* @__PURE__ */ w("div", {
-				ref: x,
-				..._.props(i.plot, ee.plot),
-				children: o.length === 0 || u.length === 0 ? /* @__PURE__ */ w("p", {
+			/* @__PURE__ */ E("div", {
+				ref: _,
+				...y.props(c.plot, M.plot),
+				children: n.length === 0 || a.length === 0 ? /* @__PURE__ */ E("p", {
 					className: "x153jb6y x1ghz6dp xy8obcc",
 					children: "No categories"
-				}) : /* @__PURE__ */ T("svg", {
+				}) : /* @__PURE__ */ D("svg", {
 					role: "img",
-					"aria-label": `${e}. Use arrow keys to inspect categories.${g === void 0 ? "" : " Press Enter to select."}`,
-					"aria-describedby": A,
+					"aria-label": `${e}. Use arrow keys to inspect categories.${f === void 0 ? "" : " Press Enter to select."}`,
+					"aria-describedby": b,
 					tabIndex: 0,
-					viewBox: `0 0 ${O} ${v}`,
-					height: v,
-					onKeyDown: J,
+					viewBox: `0 0 ${v} ${p}`,
+					height: p,
+					onKeyDown: ae,
 					onPointerMove: (e) => {
-						e.pointerType === "mouse" && q(e);
+						e.pointerType === "mouse" && Y(e);
 					},
-					onPointerDown: q,
+					onPointerDown: Y,
 					onPointerLeave: (e) => {
-						e.pointerType === "mouse" && N?.source === "pointer" && P(void 0);
+						e.pointerType === "mouse" && S?.source === "pointer" && C(void 0);
 					},
-					onBlur: () => P(void 0),
+					onBlur: () => C(void 0),
 					onClick: () => {
-						I !== void 0 && g?.onSelect(I.id);
+						j !== void 0 && f?.onSelect(j.id);
 					},
-					..._.props(i.svg, i.focus),
+					...y.props(c.svg, c.focus),
 					children: [
-						I !== void 0 && /* @__PURE__ */ w("rect", {
-							x: (V(I.id) ?? z) - (V.step() - V.bandwidth()) / 2,
+						j !== void 0 && /* @__PURE__ */ E("rect", {
+							x: (K(j.id) ?? W) - (K.step() - K.bandwidth()) / 2,
 							y: 12,
-							width: V.step(),
-							height: L - 12,
+							width: K.step(),
+							height: H - 12,
 							className: "x2wnxhi"
 						}),
-						R.ticks(3).map((e) => /* @__PURE__ */ T("g", { children: [/* @__PURE__ */ w("line", {
-							x1: z,
-							x2: B,
-							y1: R(e),
-							y2: R(e),
-							..._.props(i.grid)
-						}), /* @__PURE__ */ w("text", {
-							x: z - 8,
-							y: R(e),
+						U.ticks(3).map((e) => /* @__PURE__ */ D("g", { children: [/* @__PURE__ */ E("line", {
+							x1: W,
+							x2: G,
+							y1: U(e),
+							y2: U(e),
+							...y.props(c.grid)
+						}), /* @__PURE__ */ E("text", {
+							x: W - 8,
+							y: U(e),
 							textAnchor: "end",
 							dominantBaseline: "middle",
-							..._.props(i.label),
-							children: h(e)
+							...y.props(c.label),
+							children: l(e)
 						})] }, e)),
-						o.map((e, t) => {
-							let r = e.axisLabel ?? e.label;
-							return /* @__PURE__ */ T("g", { children: [u.map((r, a) => {
-								let o = r.values[t];
+						n.map((e, t) => {
+							let n = e.axisLabel ?? e.label;
+							return /* @__PURE__ */ D("g", { children: [a.map((n, i) => {
+								let o = n.values[t];
 								if (o == null) return null;
-								let c = m === "stacked" ? u.slice(0, a).reduce((e, n) => e + (n.values[t] ?? 0), 0) : 0, l = R(c), d = R(c + o), f = g?.selectedId === e.id || I?.id === e.id;
-								return /* @__PURE__ */ w(k, {
-									x: (V(e.id) ?? z) + (m === "stacked" ? 0 : H(r.id) ?? 0),
-									y: Math.min(l, d),
-									width: m === "stacked" ? V.bandwidth() : H.bandwidth(),
-									height: Math.max(+(o === 0), Math.abs(d - l)),
-									fill: s[n(r.tone, a)],
-									..._.props(f && i.selected)
-								}, r.id);
-							}), t % W === 0 && /* @__PURE__ */ w("text", {
-								x: (V(e.id) ?? z) + V.bandwidth() / 2,
-								y: v - 4,
+								let l = s === "stacked" ? a.slice(0, i).reduce((e, n) => e + (n.values[t] ?? 0), 0) : 0, d = U(l), p = U(l + o), m = f?.selectedId === e.id || j?.id === e.id;
+								return /* @__PURE__ */ E(ee, {
+									x: (K(e.id) ?? W) + (s === "stacked" ? 0 : q(n.id) ?? 0),
+									y: Math.min(d, p),
+									width: s === "stacked" ? K.bandwidth() : q.bandwidth(),
+									height: Math.max(+(o === 0), Math.abs(p - d)),
+									fill: u[r(n.tone, i)],
+									...y.props(m && c.selected)
+								}, n.id);
+							}), t % J === 0 && /* @__PURE__ */ E("text", {
+								x: (K(e.id) ?? W) + K.bandwidth() / 2,
+								y: p - 4,
 								textAnchor: "middle",
-								..._.props(i.label),
-								children: r.length > G ? `${r.slice(0, G - 1)}…` : r
+								...y.props(c.label),
+								children: n.length > ie ? `${n.slice(0, ie - 1)}…` : n
 							})] }, e.id);
 						})
 					]
 				})
 			}),
-			o.length > 0 && u.length > 0 && /* @__PURE__ */ w("div", {
-				id: A,
-				"aria-live": N?.source === "keyboard" ? "polite" : "off",
-				className: "x78zum5 x1a02dak x1n8ia3y x1mqbd49 xy8obcc xas2l8k xss6m8b",
-				children: I === void 0 ? /* @__PURE__ */ w("span", {
+			n.length > 0 && a.length > 0 && /* @__PURE__ */ E("div", {
+				id: b,
+				"aria-live": S?.source === "pointer" ? "off" : "polite",
+				className: "x78zum5 x1a02dak x8zbtdt x1gkm1c7 x1mqbd49 xy8obcc xas2l8k xss6m8b xj0a0fe",
+				children: B === void 0 ? /* @__PURE__ */ E("span", {
 					className: "x153jb6y x1ghz6dp xy8obcc",
-					children: "Point, tap, or use the arrow keys to inspect values."
-				}) : /* @__PURE__ */ T(C, { children: [/* @__PURE__ */ w("span", { children: I.label }), u.map((e) => /* @__PURE__ */ T("span", { children: [
+					children: P
+				}) : /* @__PURE__ */ D(T, { children: [/* @__PURE__ */ E("span", { children: B.label }), a.map((e) => /* @__PURE__ */ D("span", { children: [
 					e.label,
 					":",
 					" ",
-					e.values[F] === null || e.values[F] === void 0 ? "Unavailable" : h(e.values[F])
+					e.values[V] === null || e.values[V] === void 0 ? "Unavailable" : l(e.values[V])
 				] }, e.id))] })
 			}),
-			/* @__PURE__ */ w(l, { children: /* @__PURE__ */ w(r, {
-				items: o.map((e, t) => ({
+			/* @__PURE__ */ E(d, { children: /* @__PURE__ */ E(i, {
+				items: n.map((e, t) => ({
 					id: e.id,
 					label: e.label,
-					valueLabel: u.map((e) => `${e.label}: ${e.values[t] === null || e.values[t] === void 0 ? "Unavailable" : h(e.values[t])}`).join(" · "),
+					valueLabel: z(a, t, l),
 					tone: "neutral"
 				})),
-				selection: g
+				selection: f
 			}) })
 		]
 	});
 }
+function z(e, t, n) {
+	return e.map((e) => {
+		let r = e.values[t];
+		return `${e.label}: ${r == null ? "Unavailable" : n(r)}`;
+	}).join(" · ");
+}
 // packages/charts/src/cartesian/breakdown-bar.tsx
-var P = {
+var B = {
 	kzqmXN: "x5lhr3w",
 	kZKoxP: "x5yr21d",
 	$$css: !0
-}, F = { segment: (e, t) => [
-	P,
+}, V = { segment: (e, t) => [
+	B,
 	{
 		kWkggS: t == null ? t : "xl8spv7",
 		$$css: !0
@@ -204,56 +261,56 @@ var P = {
 		"--x-backgroundColor": t ?? void 0
 	}
 ] };
-function I({ title: t, description: i, items: a, total: o, formatValue: l, selection: u }) {
-	let d = e(a), p = a.reduce((e, t) => e + (t.value ?? 0), 0), m = 2 ** -52 * Math.max(p, o, 1) * a.length;
-	return d === void 0 ? !Number.isFinite(o) || o < 0 || p - o > m ? /* @__PURE__ */ w(f, {
-		title: t,
-		description: i,
+function H({ title: e, description: n, items: a, total: o, formatValue: s, selection: c }) {
+	let d = t(a), f = a.reduce((e, t) => e + (t.value ?? 0), 0), p = 2 ** -52 * Math.max(f, o, 1) * a.length;
+	return d === void 0 ? !Number.isFinite(o) || o < 0 || f - o > p ? /* @__PURE__ */ E(m, {
+		title: e,
+		description: n,
 		message: "The total must be finite and at least the sum of recorded values."
-	}) : /* @__PURE__ */ w(c, {
-		title: t,
-		description: i,
-		children: a.length === 0 ? /* @__PURE__ */ w("p", {
+	}) : /* @__PURE__ */ E(l, {
+		title: e,
+		description: n,
+		children: a.length === 0 ? /* @__PURE__ */ E("p", {
 			className: "x153jb6y x1ghz6dp xy8obcc",
 			children: "No values"
-		}) : /* @__PURE__ */ T(C, { children: [
-			/* @__PURE__ */ w("div", {
+		}) : /* @__PURE__ */ D(T, { children: [
+			/* @__PURE__ */ E("div", {
 				"aria-hidden": !0,
 				className: "x78zum5 x170jfvy xb3r6kr x1r7kqkb xmkeg23 x1y0btm7 x1ey3b81 x1jfksii",
-				children: a.map((e, t) => e.value === null ? null : /* @__PURE__ */ w("span", { ..._.props(F.segment(o === 0 ? 0 : e.value / o * 100, s[n(e.tone, t)])) }, e.id))
+				children: a.map((e, t) => e.value === null ? null : /* @__PURE__ */ E("span", { ...y.props(V.segment(o === 0 ? 0 : e.value / o * 100, u[r(e.tone, t)])) }, e.id))
 			}),
-			/* @__PURE__ */ w(r, {
+			/* @__PURE__ */ E(i, {
 				items: a.map((e, t) => ({
 					id: e.id,
 					label: e.label,
-					valueLabel: e.value === null ? "Unavailable" : l(e.value),
-					tone: n(e.tone, t)
+					valueLabel: e.value === null ? "Unavailable" : s(e.value),
+					tone: r(e.tone, t)
 				})),
-				selection: u
+				selection: c
 			}),
-			o - p > m && /* @__PURE__ */ T("p", {
+			o - f > p && /* @__PURE__ */ D("p", {
 				className: "x153jb6y x1ghz6dp xy8obcc",
 				children: [
 					"Unassigned portion: ",
-					l(o - p),
+					s(o - f),
 					" of ",
-					l(o)
+					s(o)
 				]
 			})
 		] })
-	}) : /* @__PURE__ */ w(f, {
-		title: t,
-		description: i,
+	}) : /* @__PURE__ */ E(m, {
+		title: e,
+		description: n,
 		message: d
 	});
 }
 // packages/charts/src/cartesian/scatter-plot.tsx
-var L = 260, R = 56, z = 20, B = 12, V = 1e3, H = {
+var U = 260, W = 56, G = 20, K = 12, q = 1e3, re = {
 	kzqmXN: "x1xc55vz",
 	kZKoxP: "xdk7pt",
 	kaIpWk: "x16rqkct",
 	$$css: !0
-}, U = {
+}, J = {
 	brush: {
 		kFalU9: "xx69xxh",
 		kkrTdU: "xsid9ct",
@@ -271,14 +328,15 @@ var L = 260, R = 56, z = 20, B = 12, V = 1e3, H = {
 		kWkggS: "xjbqb8w",
 		kkrTdU: "x1ypdohk",
 		kfzvcC: "x67bb7w",
+		k3XXqK: "x1t137rt",
 		kPJHz1: "x13qnu6",
 		kZs9gx: "x19rmrnh",
 		k7shQP: "x9v5kkp",
 		kiEn40: "x175ew0f",
-		kguI0P: "xisywhd",
-		kUjPgX: "xakijqq",
-		kFU1ZQ: "xzbfamy",
-		kRG58y: "x1cdmj33",
+		kmCx7Z: "x1e7sry0",
+		kJrEVn: "xehdg9o",
+		kLz2MD: "xp9r5ej",
+		k1CtGv: "xzgvv12",
 		$$css: !0
 	},
 	location: (e, t) => [{
@@ -290,7 +348,7 @@ var L = 260, R = 56, z = 20, B = 12, V = 1e3, H = {
 		"--x-top": ((e) => typeof e == "number" ? e + "px" : e ?? void 0)(t)
 	}],
 	dot: (e) => [
-		H,
+		re,
 		{
 			kWkggS: e == null ? e : "xl8spv7",
 			$$css: !0
@@ -305,73 +363,74 @@ var L = 260, R = 56, z = 20, B = 12, V = 1e3, H = {
 		$$css: !0
 	}
 };
-function W(e) {
-	let { title: t, description: n, points: r, xDomain: i, yDomain: a, xLabel: u, yLabel: d, formatX: m, formatY: h, selection: g, rangeSelection: v, emptyLabel: y } = e, { ref: b, width: x } = p(), S = q(e);
-	if (S !== null) return /* @__PURE__ */ w(f, {
+function ie(e) {
+	let { title: t, description: n, points: r, xDomain: i, yDomain: o, xLabel: c, yLabel: f, formatX: p, formatY: g, selection: _, rangeSelection: v, emptyLabel: b } = e, { ref: x, width: S } = h(), C = X(e);
+	if (C !== null) return /* @__PURE__ */ E(m, {
 		title: t,
 		description: n,
-		message: S
+		message: C
 	});
-	let C = D({
+	let w = k({
 		domain: [...i],
-		range: [R, Math.max(R, x - z)]
-	}), E = D({
-		domain: [...a],
-		range: [216, B]
-	});
-	return /* @__PURE__ */ T(c, {
+		range: [W, Math.max(W, S - G)]
+	}), T = k({
+		domain: [...o],
+		range: [216, K]
+	}), O = r.find((e) => e.id === _?.selectedId);
+	return /* @__PURE__ */ D(l, {
 		title: t,
 		description: n,
+		footer: _ !== void 0 && r.length > 0 ? /* @__PURE__ */ E(a, { children: O === void 0 ? "Select a point to inspect its label and coordinates." : `${O.label}, ${c}: ${p(O.x)}, ${f}: ${g(O.y)}` }) : void 0,
 		children: [
-			r.length === 0 ? /* @__PURE__ */ w("p", {
+			r.length === 0 ? /* @__PURE__ */ E("p", {
 				className: "x1ghz6dp x153jb6y",
-				children: y
-			}) : /* @__PURE__ */ T("div", {
-				ref: b,
+				children: b
+			}) : /* @__PURE__ */ D("div", {
+				ref: x,
 				className: "x1n2onr6 xeuugli",
-				children: [/* @__PURE__ */ w(G, {
-					width: x,
-					scaleX: C,
-					scaleY: E,
+				children: [/* @__PURE__ */ E(Y, {
+					width: S,
+					scaleX: w,
+					scaleY: T,
 					...e
-				}, `${i[0]}:${i[1]}:${a[0]}:${a[1]}:${x}`), g !== void 0 && /* @__PURE__ */ w("div", {
+				}, `${i[0]}:${i[1]}:${o[0]}:${o[1]}:${S}`), _ !== void 0 && /* @__PURE__ */ E("div", {
 					className: "x10l6tqk x10a8y8t x1n71m9f x47corl",
-					children: r.map((e) => /* @__PURE__ */ w("button", {
+					children: r.map((e) => /* @__PURE__ */ E("button", {
 						type: "button",
 						title: e.label,
-						"aria-label": `${e.label}, ${u}: ${m(e.x)}, ${d}: ${h(e.y)}`,
-						"aria-pressed": g.selectedId === e.id,
-						onClick: () => g.onSelect(e.id),
-						..._.props(U.target, U.location(C(e.x), E(e.y))),
-						children: /* @__PURE__ */ w("span", {
+						"aria-label": `${e.label}, ${c}: ${p(e.x)}, ${f}: ${g(e.y)}`,
+						"aria-pressed": _.selectedId === e.id,
+						onClick: () => _.onSelect(e.id),
+						...y.props(J.target, J.location(w(e.x), T(e.y))),
+						children: /* @__PURE__ */ E("span", {
 							"aria-hidden": !0,
-							..._.props(U.dot(s[e.tone]), g.selectedId === e.id && U.selected)
+							...y.props(J.dot(u[e.tone]), _.selectedId === e.id && J.selected)
 						})
 					}, e.id))
 				})]
 			}),
-			v !== void 0 && /* @__PURE__ */ w(K, {
+			v !== void 0 && /* @__PURE__ */ E(ae, {
 				...e,
 				rangeSelection: v
 			}),
-			r.length > 0 && /* @__PURE__ */ w(l, { children: r.map((e) => /* @__PURE__ */ T(o, {
-				label: `${e.label}, ${u}: ${m(e.x)}, ${d}: ${h(e.y)}`,
-				selected: g?.selectedId === e.id,
-				onSelect: g === void 0 ? void 0 : () => g.onSelect(e.id),
-				children: [/* @__PURE__ */ w("span", { children: e.label }), /* @__PURE__ */ T("span", {
-					className: "xss6m8b xuxw1ft x153jb6y",
+			r.length > 0 && /* @__PURE__ */ E(d, { children: r.map((e) => /* @__PURE__ */ D(s, {
+				label: `${e.label}, ${c}: ${p(e.x)}, ${f}: ${g(e.y)}`,
+				selected: _?.selectedId === e.id,
+				onSelect: _ === void 0 ? void 0 : () => _.onSelect(e.id),
+				children: [/* @__PURE__ */ E("span", { children: e.label }), /* @__PURE__ */ D("span", {
+					className: "xeuugli xss6m8b xj0a0fe x153jb6y",
 					children: [
-						m(e.x),
+						p(e.x),
 						" · ",
-						h(e.y)
+						g(e.y)
 					]
 				})]
 			}, e.id)) })
 		]
 	});
 }
-function G({ width: e, scaleX: t, scaleY: n, points: r, xLabel: a, yLabel: o, formatX: c, formatY: l, selection: u, rangeSelection: d }) {
-	let f = y(), [p, m] = S(null), h = p === null ? d?.value : {
+function Y({ width: e, scaleX: t, scaleY: n, points: r, xLabel: i, yLabel: a, formatX: o, formatY: s, selection: l, rangeSelection: d }) {
+	let f = x(), [p, m] = w(null), h = p === null ? d?.value : {
 		x: [Math.min(p.start.x, p.end.x), Math.max(p.start.x, p.end.x)],
 		y: [Math.min(p.start.y, p.end.y), Math.max(p.start.y, p.end.y)]
 	};
@@ -379,13 +438,13 @@ function G({ width: e, scaleX: t, scaleY: n, points: r, xLabel: a, yLabel: o, fo
 		let i = r.currentTarget.getBoundingClientRect();
 		return {
 			x: t.copy().clamp(!0).invert((r.clientX - i.left) / i.width * e),
-			y: n.copy().clamp(!0).invert((r.clientY - i.top) / i.height * L)
+			y: n.copy().clamp(!0).invert((r.clientY - i.top) / i.height * U)
 		};
 	}
-	function v(t) {
+	function _(t) {
 		if (d === void 0 || t.button !== 0 || t.pointerType === "touch") return;
-		let n = t.currentTarget.getBoundingClientRect(), r = (t.clientX - n.left) / n.width * e, i = (t.clientY - n.top) / n.height * L;
-		if (r < R || r > e - z || i < B || i > 216) return;
+		let n = t.currentTarget.getBoundingClientRect(), r = (t.clientX - n.left) / n.width * e, i = (t.clientY - n.top) / n.height * U;
+		if (r < W || r > e - G || i < K || i > 216) return;
 		let a = g(t);
 		t.currentTarget.setPointerCapture(t.pointerId), m({
 			start: a,
@@ -393,13 +452,13 @@ function G({ width: e, scaleX: t, scaleY: n, points: r, xLabel: a, yLabel: o, fo
 			pointerId: t.pointerId
 		});
 	}
-	function b(e) {
+	function v(e) {
 		p !== null && p.pointerId === e.pointerId && m({
 			...p,
 			end: g(e)
 		});
 	}
-	function x(e) {
+	function b(e) {
 		if (p === null || p.pointerId !== e.pointerId) return;
 		let t = g(e), n = {
 			x: [Math.min(p.start.x, t.x), Math.max(p.start.x, t.x)],
@@ -407,99 +466,99 @@ function G({ width: e, scaleX: t, scaleY: n, points: r, xLabel: a, yLabel: o, fo
 		};
 		m(null), e.currentTarget.releasePointerCapture(e.pointerId), d?.onChange(n);
 	}
-	return /* @__PURE__ */ T("svg", {
+	return /* @__PURE__ */ D("svg", {
 		width: e,
-		height: L,
-		viewBox: `0 0 ${e} ${L}`,
+		height: U,
+		viewBox: `0 0 ${e} ${U}`,
 		"aria-hidden": !0,
-		onPointerDown: v,
-		onPointerMove: b,
-		onPointerUp: x,
+		onPointerDown: _,
+		onPointerMove: v,
+		onPointerUp: b,
 		onPointerCancel: () => m(null),
 		onLostPointerCapture: () => m(null),
-		..._.props(i.svg, d !== void 0 && U.brush),
+		...y.props(c.svg, d !== void 0 && J.brush),
 		children: [
-			/* @__PURE__ */ w("defs", { children: /* @__PURE__ */ w("clipPath", {
+			/* @__PURE__ */ E("defs", { children: /* @__PURE__ */ E("clipPath", {
 				id: f,
-				children: /* @__PURE__ */ w("rect", {
-					x: R,
-					y: B,
-					width: Math.max(0, e - R - z),
+				children: /* @__PURE__ */ E("rect", {
+					x: W,
+					y: K,
+					width: Math.max(0, e - W - G),
 					height: 204
 				})
 			}) }),
-			t.ticks(5).map((e) => /* @__PURE__ */ T("g", { children: [/* @__PURE__ */ w("line", {
+			t.ticks(5).map((e) => /* @__PURE__ */ D("g", { children: [/* @__PURE__ */ E("line", {
 				x1: t(e),
 				x2: t(e),
-				y1: B,
+				y1: K,
 				y2: 216,
-				..._.props(i.grid)
-			}), /* @__PURE__ */ w("text", {
+				...y.props(c.grid)
+			}), /* @__PURE__ */ E("text", {
 				x: t(e),
 				y: 234,
 				textAnchor: "middle",
-				..._.props(i.label),
-				children: c(e)
+				...y.props(c.label),
+				children: o(e)
 			})] }, e)),
-			n.ticks(4).map((t) => /* @__PURE__ */ T("g", { children: [/* @__PURE__ */ w("line", {
-				x1: R,
-				x2: e - z,
+			n.ticks(4).map((t) => /* @__PURE__ */ D("g", { children: [/* @__PURE__ */ E("line", {
+				x1: W,
+				x2: e - G,
 				y1: n(t),
 				y2: n(t),
-				..._.props(i.grid)
-			}), /* @__PURE__ */ w("text", {
+				...y.props(c.grid)
+			}), /* @__PURE__ */ E("text", {
 				x: 48,
 				y: n(t) + 4,
 				textAnchor: "end",
-				..._.props(i.label),
-				children: l(t)
+				...y.props(c.label),
+				children: s(t)
 			})] }, t)),
-			/* @__PURE__ */ w("text", {
-				x: (R + e - z) / 2,
+			/* @__PURE__ */ E("text", {
+				x: (W + e - G) / 2,
 				y: 256,
 				textAnchor: "middle",
-				..._.props(i.label),
-				children: a
+				...y.props(c.label),
+				children: i
 			}),
-			/* @__PURE__ */ w("text", {
+			/* @__PURE__ */ E("text", {
 				x: 12,
 				y: 108,
 				textAnchor: "middle",
 				transform: "rotate(-90 12 108)",
-				..._.props(i.label),
-				children: o
+				...y.props(c.label),
+				children: a
 			}),
-			/* @__PURE__ */ T("g", {
+			/* @__PURE__ */ D("g", {
 				clipPath: `url(#${f})`,
-				children: [h != null && /* @__PURE__ */ w("rect", {
+				children: [h != null && /* @__PURE__ */ E("rect", {
 					x: t(h.x[0]),
 					y: n(h.y[1]),
 					width: t(h.x[1]) - t(h.x[0]),
 					height: n(h.y[0]) - n(h.y[1]),
 					className: "x1e0kj8g xv7c1pl x1tg5nk6 xnpr05h x15lqr97 x47corl"
-				}), u === void 0 && r.map((e) => /* @__PURE__ */ w("circle", {
+				}), l === void 0 && r.map((e) => /* @__PURE__ */ E("circle", {
 					cx: t(e.x),
 					cy: n(e.y),
 					r: 4,
-					fill: s[e.tone]
+					fill: u[e.tone]
 				}, e.id))]
 			})
 		]
 	});
 }
-function K({ rangeSelection: e, xDomain: t, yDomain: n, xLabel: r, yLabel: i, formatX: a, formatY: o }) {
+function ae({ rangeSelection: e, xDomain: t, yDomain: n, xLabel: r, yLabel: i, formatX: a, formatY: o }) {
 	let s = e.value ?? {
 		x: t,
 		y: n
 	};
-	return /* @__PURE__ */ T("fieldset", {
+	return /* @__PURE__ */ D("fieldset", {
 		className: "xrvj5dj x1n8ia3y x1xxf3xd xc342km x1717udv xeuugli",
 		children: [
-			/* @__PURE__ */ w("legend", {
+			/* @__PURE__ */ E("legend", {
 				className: "x153jb6y xy8obcc x1jfksii",
 				children: "Drag with a mouse, or adjust these bounds to select a coordinate range."
 			}),
-			/* @__PURE__ */ T(h.Root, {
+			/* @__PURE__ */ D(_.Root, {
 				value: s.x,
 				min: t[0],
 				max: t[1],
@@ -510,28 +569,28 @@ function K({ rangeSelection: e, xDomain: t, yDomain: n, xLabel: r, yLabel: i, fo
 					x: t,
 					y: s.y
 				}),
-				children: [/* @__PURE__ */ T("div", {
-					className: "x78zum5 x1qughib x1hnptsi x153jb6y xy8obcc",
-					children: [/* @__PURE__ */ w(h.Label, { children: r }), /* @__PURE__ */ T("span", { children: [
+				children: [/* @__PURE__ */ D("div", {
+					className: "x78zum5 x1a02dak x1qughib x1hnptsi x153jb6y xy8obcc xj0a0fe",
+					children: [/* @__PURE__ */ E(_.Label, { children: r }), /* @__PURE__ */ D("span", { children: [
 						a(s.x[0]),
 						" – ",
 						a(s.x[1])
 					] })]
-				}), /* @__PURE__ */ w(h.Control, { children: /* @__PURE__ */ T(h.Track, { children: [
-					/* @__PURE__ */ w(h.Indicator, {}),
-					/* @__PURE__ */ w(h.Thumb, {
+				}), /* @__PURE__ */ E(_.Control, { children: /* @__PURE__ */ D(_.Track, { children: [
+					/* @__PURE__ */ E(_.Indicator, {}),
+					/* @__PURE__ */ E(_.Thumb, {
 						index: 0,
 						"aria-label": `${r} minimum`,
 						getAriaValueText: (e, t) => a(t)
 					}),
-					/* @__PURE__ */ w(h.Thumb, {
+					/* @__PURE__ */ E(_.Thumb, {
 						index: 1,
 						"aria-label": `${r} maximum`,
 						getAriaValueText: (e, t) => a(t)
 					})
 				] }) })]
 			}),
-			/* @__PURE__ */ T(h.Root, {
+			/* @__PURE__ */ D(_.Root, {
 				value: s.y,
 				min: n[0],
 				max: n[1],
@@ -542,28 +601,28 @@ function K({ rangeSelection: e, xDomain: t, yDomain: n, xLabel: r, yLabel: i, fo
 					x: s.x,
 					y: t
 				}),
-				children: [/* @__PURE__ */ T("div", {
-					className: "x78zum5 x1qughib x1hnptsi x153jb6y xy8obcc",
-					children: [/* @__PURE__ */ w(h.Label, { children: i }), /* @__PURE__ */ T("span", { children: [
+				children: [/* @__PURE__ */ D("div", {
+					className: "x78zum5 x1a02dak x1qughib x1hnptsi x153jb6y xy8obcc xj0a0fe",
+					children: [/* @__PURE__ */ E(_.Label, { children: i }), /* @__PURE__ */ D("span", { children: [
 						o(s.y[0]),
 						" – ",
 						o(s.y[1])
 					] })]
-				}), /* @__PURE__ */ w(h.Control, { children: /* @__PURE__ */ T(h.Track, { children: [
-					/* @__PURE__ */ w(h.Indicator, {}),
-					/* @__PURE__ */ w(h.Thumb, {
+				}), /* @__PURE__ */ E(_.Control, { children: /* @__PURE__ */ D(_.Track, { children: [
+					/* @__PURE__ */ E(_.Indicator, {}),
+					/* @__PURE__ */ E(_.Thumb, {
 						index: 0,
 						"aria-label": `${i} minimum`,
 						getAriaValueText: (e, t) => o(t)
 					}),
-					/* @__PURE__ */ w(h.Thumb, {
+					/* @__PURE__ */ E(_.Thumb, {
 						index: 1,
 						"aria-label": `${i} maximum`,
 						getAriaValueText: (e, t) => o(t)
 					})
 				] }) })]
 			}),
-			/* @__PURE__ */ w(m, {
+			/* @__PURE__ */ E(g, {
 				type: "button",
 				disabled: e.value === null,
 				onClick: () => e.onChange(null),
@@ -572,10 +631,10 @@ function K({ rangeSelection: e, xDomain: t, yDomain: n, xLabel: r, yLabel: i, fo
 		]
 	});
 }
-function q({ points: e, xDomain: t, yDomain: n, rangeSelection: r }) {
-	if (!d(t) || !d(n)) return "Scatter domains must contain finite, increasing endpoints.";
-	if (e.length > 1e3) return `This plot exceeds the ${V}-point render limit. Supply a smaller, labelled sample.`;
-	if (!u(e)) return "Scatter points must have unique identifiers.";
+function X({ points: e, xDomain: t, yDomain: n, rangeSelection: r }) {
+	if (!p(t) || !p(n)) return "Scatter domains must contain finite, increasing endpoints.";
+	if (e.length > 1e3) return `This plot exceeds the ${q}-point render limit. Supply a smaller, labelled sample.`;
+	if (!f(e)) return "Scatter points must have unique identifiers.";
 	if (e.some((e) => !Number.isFinite(e.x) || !Number.isFinite(e.y))) return "Scatter coordinates must be finite.";
 	if (e.some((e) => {
 		let r = e.x < t[0] || e.x > t[1], i = e.y < n[0] || e.y > n[1];
@@ -585,18 +644,18 @@ function q({ points: e, xDomain: t, yDomain: n, rangeSelection: r }) {
 	let i = Number.isFinite(r.xStep) && r.xStep > 0 && r.xStep <= t[1] - t[0], a = Number.isFinite(r.yStep) && r.yStep > 0 && r.yStep <= n[1] - n[0];
 	if (!i || !a) return "Range selection steps must be finite, positive, and no larger than their domain span.";
 	let o = r.value;
-	return o === null ? null : !J(o.x, t) || !J(o.y, n) ? "The selected range must have finite, ordered bounds inside the declared domain." : null;
+	return o === null ? null : !Z(o.x, t) || !Z(o.y, n) ? "The selected range must have finite, ordered bounds inside the declared domain." : null;
 }
-function J(e, t) {
+function Z(e, t) {
 	return !e.every(Number.isFinite) || e[0] > e[1] ? !1 : e[0] >= t[0] && e[1] <= t[1];
 }
 // packages/charts/src/cartesian/time-series-data.ts
-var Y = {
+var Q = {
 	series: 12,
 	pointsPerSeries: 2e3,
 	markers: 200,
 	panels: 12
-}, te = .01, ne = [
+}, oe = .01, $ = [
 	"series1",
 	"series2",
 	"series3",
@@ -604,13 +663,13 @@ var Y = {
 	"series5",
 	"series6"
 ];
-function re({ series: e, isStacked: t, markers: n }) {
+function se({ series: e, isStacked: t, markers: n }) {
 	let r = e[0]?.points.map((e) => e.timestamp) ?? [];
-	if (e.length > Y.series || r.length > Y.pointsPerSeries || n.length > Y.markers) return `Choose a window with at most ${Y.series} series, ${Y.pointsPerSeries} observations per series, and ${Y.markers} markers.`;
-	if (!u(e) || !u(n)) return "Series and markers require unique identifiers.";
+	if (e.length > Q.series || r.length > Q.pointsPerSeries || n.length > Q.markers) return `Choose a window with at most ${Q.series} series, ${Q.pointsPerSeries} observations per series, and ${Q.markers} markers.`;
+	if (!f(e) || !f(n)) return "Series and markers require unique identifiers.";
 	for (let n of e) {
 		if (n.points.length !== r.length) return "Every series must supply the same observation timestamps.";
-		let e = X({
+		let e = de({
 			points: n.points,
 			timestamps: r,
 			isStacked: t
@@ -628,7 +687,7 @@ function re({ series: e, isStacked: t, markers: n }) {
 	if (!Number.isFinite(a) || !Number.isFinite(o)) return "The elapsed-time and value ranges must be finite.";
 	if (t && r.some((t, n) => !Number.isFinite(e.reduce((e, t) => e + (t.points[n]?.value ?? 0), 0)))) return "Stacked observation totals must be finite.";
 }
-function ie({ series: e, markers: t, timestampUnit: n, isStacked: r }) {
+function ce({ series: e, markers: t, timestampUnit: n, isStacked: r }) {
 	return JSON.stringify([
 		n,
 		r,
@@ -648,15 +707,15 @@ function ie({ series: e, markers: t, timestampUnit: n, isStacked: r }) {
 		])
 	]);
 }
-function ae(e, t, n = !1) {
+function le(e, t, n = !1) {
 	if (e !== t) return [e, t];
-	let r = Math.max(1, Math.abs(e) * te), i = n ? 0 : e - r, a = t + r;
+	let r = Math.max(1, Math.abs(e) * oe), i = n ? 0 : e - r, a = t + r;
 	return [Number.isFinite(i) ? i : e, Number.isFinite(a) ? a : t];
 }
-function oe(e, t) {
+function ue(e, t) {
 	let n = e.filter((e) => e.tone === void 0);
 	return e.map((r, i) => {
-		let a = n.findIndex((e) => e.id === r.id), o = r.tone ?? ne[a % ne.length] ?? "series1", s = r.points.map((n, r) => {
+		let a = n.findIndex((e) => e.id === r.id), o = r.tone ?? $[a % $.length] ?? "series1", s = r.points.map((n, r) => {
 			let a = t ? e.slice(0, i).reduce((e, t) => e + (t.points[r]?.value ?? 0), 0) : 0;
 			return {
 				...n,
@@ -671,7 +730,7 @@ function oe(e, t) {
 		};
 	});
 }
-function X({ points: e, timestamps: t, isStacked: n }) {
+function de({ points: e, timestamps: t, isStacked: n }) {
 	for (let [r, i] of e.entries()) {
 		let a = e[r - 1], o = a !== void 0 && i.timestamp <= a.timestamp;
 		if (!Number.isFinite(i.timestamp) || i.timestamp !== t[r] || o) return "Observation timestamps must be finite, aligned, and strictly increasing.";
@@ -680,49 +739,49 @@ function X({ points: e, timestamps: t, isStacked: n }) {
 	}
 }
 // packages/charts/src/cartesian/time-series-line.tsx
-function se({ series: e, x: t, y: n, inspectedTimestamp: r, pointRadius: a = 3 }) {
-	return /* @__PURE__ */ T(C, { children: [/* @__PURE__ */ w(A, {
+function fe({ series: e, x: t, y: n, inspectedTimestamp: r, pointRadius: i = 3 }) {
+	return /* @__PURE__ */ D(T, { children: [/* @__PURE__ */ E(j, {
 		data: [...e.points],
 		defined: (e) => e.value !== null,
 		x: (e) => t(e.timestamp),
 		y: (e) => n((e.value ?? 0) + e.base),
-		stroke: s[e.tone],
-		..._.props(i.mark)
+		stroke: u[e.tone],
+		...y.props(c.mark)
 	}), e.points.filter((t, n) => {
 		if (t.value === null) return !1;
 		let i = e.points[n - 1]?.value === null || e.points[n + 1]?.value === null;
 		return e.points.length === 1 || i || t.timestamp === r;
-	}).map((r) => /* @__PURE__ */ w("circle", {
+	}).map((r) => /* @__PURE__ */ E("circle", {
 		cx: t(r.timestamp),
 		cy: n((r.value ?? 0) + r.base),
-		r: a,
-		fill: s[e.tone]
+		r: i,
+		fill: u[e.tone]
 	}, r.timestamp))] });
 }
 // packages/charts/src/cartesian/sparkline.tsx
-function ce({ title: e, summary: t, unit: n, timestampUnit: r, series: i, valueDomain: a }) {
-	let o = y(), s = y(), c = Z({
+function pe({ title: e, summary: t, unit: n, timestampUnit: r, series: i, valueDomain: a }) {
+	let o = x(), s = x(), c = me({
 		title: e,
 		summary: t,
 		unit: n,
 		series: i,
 		valueDomain: a
 	}), l = i.points.some((e) => e.value !== null);
-	if (c !== void 0 || !l) return /* @__PURE__ */ w("span", {
+	if (c !== void 0 || !l) return /* @__PURE__ */ E("span", {
 		role: "img",
-		"aria-label": `${e}. ${c ?? "No recorded values. Missing observations remain unavailable."}`,
+		"aria-label": `${e}. ${t} Values in ${n}; timestamps in ${r}. ${c ?? "No recorded values. Missing observations remain unavailable."}`,
 		title: c ?? "No recorded values",
 		className: "x2pejg6 x10w6t97 x2lah0s xxymvpz x3nfvp2 x6s0dn4 xl56j7k x153jb6y x1hz01jw xy8obcc",
 		children: c === void 0 ? "No data" : "Invalid trend"
 	});
-	let u = i.points[0]?.timestamp ?? 0, d = i.points.at(-1)?.timestamp ?? u, f = D({
-		domain: [...ae(u, d)],
+	let u = i.points[0]?.timestamp ?? 0, d = i.points.at(-1)?.timestamp ?? u, f = k({
+		domain: [...le(u, d)],
 		range: [3, 125]
-	}), p = D({
+	}), p = k({
 		domain: [...a],
 		range: [29, 3]
-	}), m = oe([i], !1)[0];
-	return /* @__PURE__ */ T("svg", {
+	}), m = ue([i], !1)[0];
+	return /* @__PURE__ */ D("svg", {
 		role: "img",
 		"aria-labelledby": o,
 		"aria-describedby": s,
@@ -732,11 +791,11 @@ function ce({ title: e, summary: t, unit: n, timestampUnit: r, series: i, valueD
 		height: 32,
 		className: "x1rg5ohu x2pejg6 x10w6t97 x2lah0s xxymvpz",
 		children: [
-			/* @__PURE__ */ w("title", {
+			/* @__PURE__ */ E("title", {
 				id: o,
 				children: e
 			}),
-			/* @__PURE__ */ T("desc", {
+			/* @__PURE__ */ D("desc", {
 				id: s,
 				children: [
 					t,
@@ -754,7 +813,7 @@ function ce({ title: e, summary: t, unit: n, timestampUnit: r, series: i, valueD
 					"."
 				]
 			}),
-			m !== void 0 && /* @__PURE__ */ w(se, {
+			m !== void 0 && /* @__PURE__ */ E(fe, {
 				series: m,
 				x: f,
 				y: p,
@@ -763,10 +822,10 @@ function ce({ title: e, summary: t, unit: n, timestampUnit: r, series: i, valueD
 		]
 	});
 }
-function Z({ title: e, summary: t, unit: n, series: r, valueDomain: i }) {
+function me({ title: e, summary: t, unit: n, series: r, valueDomain: i }) {
 	if (e.trim() === "" || t.trim() === "" || n.trim() === "") return "A trend requires a title, a readable summary, and a value unit.";
-	if (!d(i)) return "The displayed value domain must have finite, increasing bounds.";
-	let a = re({
+	if (!p(i)) return "The displayed value domain must have finite, increasing bounds.";
+	let a = se({
 		series: [r],
 		isStacked: !1,
 		markers: []
@@ -775,71 +834,92 @@ function Z({ title: e, summary: t, unit: n, series: r, valueDomain: i }) {
 	if (r.points.some((e) => e.value !== null && (e.value < i[0] || e.value > i[1]))) return "Every recorded value must be inside the declared value domain.";
 }
 // packages/charts/src/cartesian/time-series.tsx
-var le = { plot: {
-	k7Eaqz: "xeuugli",
-	k3XXqK: "x1t137rt",
-	kInvED: "x1hl8ikr",
-	kZs9gx: "x19rmrnh",
-	k7shQP: "x9v5kkp",
-	kPJHz1: "x13qnu6",
-	$$css: !0
-} };
-function ue(e) {
-	return /* @__PURE__ */ w($, {
+var he = {
+	plot: {
+		k7Eaqz: "xeuugli",
+		k3XXqK: "x1t137rt",
+		kInvED: "x2ssjo2",
+		kZs9gx: "x19rmrnh",
+		k7shQP: "x9v5kkp",
+		kPJHz1: "x13qnu6",
+		$$css: !0
+	},
+	timeAxis: {
+		k1xSpc: "x78zum5",
+		kjj79g: "x1qughib",
+		k1C7PZ: "x8zbtdt",
+		keoZOQ: "x1c87qhr",
+		kGuDYH: "xy8obcc",
+		kLWn49: "xas2l8k",
+		kMwMTN: "x153jb6y",
+		kcqcaj: "xss6m8b",
+		$$css: !0
+	},
+	timeAxisInset: (e, t) => [{
+		kZCmMZ: e == null ? e : "xnvo3vl",
+		kwRFfy: t == null ? t : "x120eax6",
+		$$css: !0
+	}, {
+		"--x-paddingInlineStart": ((e) => typeof e == "number" ? e + "px" : e ?? void 0)(e),
+		"--x-paddingInlineEnd": ((e) => typeof e == "number" ? e + "px" : e ?? void 0)(t)
+	}]
+};
+function ge(e) {
+	return /* @__PURE__ */ E(ye, {
 		...e,
 		kind: "line",
 		stacked: !1
 	});
 }
-function Q({ stacked: e = !1, ...t }) {
-	return /* @__PURE__ */ w($, {
+function _e({ stacked: e = !1, ...t }) {
+	return /* @__PURE__ */ E(ye, {
 		...t,
 		kind: "area",
 		stacked: e
 	});
 }
-function de({ charts: e, ...t }) {
-	let n = x(null), [r, i] = S(), a = JSON.stringify(e.map((e) => [
+function ve({ charts: e, ...t }) {
+	let n = C(null), [r, i] = w(), a = JSON.stringify(e.map((e) => [
 		e.id,
 		e.title,
-		ie({
+		ce({
 			series: e.series,
 			markers: e.markers ?? [],
 			timestampUnit: t.timestampUnit,
 			isStacked: !1
 		})
 	])), o = JSON.stringify(e[0]?.series[0]?.points.map((e) => e.timestamp) ?? []), s = e.every((e) => JSON.stringify(e.series[0]?.points.map((e) => e.timestamp) ?? []) === o);
-	if (r !== void 0 && r.signature !== a && i(void 0), v(() => {
+	if (r !== void 0 && r.signature !== a && i(void 0), b(() => {
 		function e(e) {
 			e.target instanceof Node && n.current?.contains(e.target) !== !0 && i(void 0);
 		}
 		return document.addEventListener("pointerdown", e), () => document.removeEventListener("pointerdown", e);
-	}, []), !s || !u(e)) return /* @__PURE__ */ w(f, {
+	}, []), !s || !f(e)) return /* @__PURE__ */ E(m, {
 		title: "Small multiples",
 		message: "Charts need unique identifiers and aligned observation timestamps."
 	});
-	if (e.length > Y.panels) return /* @__PURE__ */ w(f, {
+	if (e.length > Q.panels) return /* @__PURE__ */ E(m, {
 		title: "Small multiples",
-		message: `Choose at most ${Y.panels} panels.`
+		message: `Choose at most ${Q.panels} panels.`
 	});
-	if (e.length === 0) return /* @__PURE__ */ w(c, {
+	if (e.length === 0) return /* @__PURE__ */ E(l, {
 		title: "Small multiples",
-		children: /* @__PURE__ */ w("p", {
+		children: /* @__PURE__ */ E("p", {
 			className: "x153jb6y",
 			children: "No charts"
 		})
 	});
-	let l = {
+	let c = {
 		value: r?.signature === a ? r : void 0,
 		onChange: (e) => i(e === void 0 ? void 0 : {
 			...e,
 			signature: a
 		})
-	}, d = Math.max(52, ...e.flatMap((e) => e.series.flatMap((t) => t.points.flatMap((t) => t.value === null || !Number.isFinite(t.value) ? [] : [e.formatValue(t.value).length * 7 + 12]))));
-	return /* @__PURE__ */ w("div", {
+	}, u = Math.max(52, ...e.flatMap((e) => e.series.flatMap((t) => t.points.flatMap((t) => t.value === null || !Number.isFinite(t.value) ? [] : [e.formatValue(t.value).length * 7 + 12]))));
+	return /* @__PURE__ */ E("div", {
 		ref: n,
 		className: "xrvj5dj x1j825kq",
-		children: e.map((e) => /* @__PURE__ */ w($, {
+		children: e.map((e) => /* @__PURE__ */ E(ye, {
 			...t,
 			title: e.title,
 			description: e.description,
@@ -848,73 +928,74 @@ function de({ charts: e, ...t }) {
 			markers: e.markers,
 			kind: "line",
 			stacked: !1,
-			sharedInspection: l,
-			axisWidth: d
+			sharedInspection: c,
+			axisWidth: u
 		}, e.id))
 	});
 }
-function $({ title: e, description: t, series: n, timestampUnit: r, formatTimestamp: o, formatValue: u, markers: d = [], height: m = 180, actions: h, kind: E, stacked: k, sharedInspection: A, axisWidth: ee }) {
-	let j = !Number.isFinite(m) || m < 48 ? "Chart height must be at least 48 pixels." : re({
+function ye({ title: e, description: t, series: n, timestampUnit: r, formatTimestamp: i, formatValue: a, markers: s = [], height: f = 180, actions: p, kind: g, stacked: _, sharedInspection: O, axisWidth: ee }) {
+	let j = !Number.isFinite(f) || f < 48 ? "Chart height must be at least 48 pixels." : se({
 		series: n,
-		isStacked: k,
-		markers: d
-	}), M = b(() => j === void 0 ? oe(n, k) : [], [
+		isStacked: _,
+		markers: s
+	}), M = S(() => j === void 0 ? ue(n, _) : [], [
 		n,
-		k,
+		_,
 		j
-	]), N = M[0]?.points ?? [], { ref: P, width: F, element: I } = p(), L = x(null), [R, z] = S(), B = ie({
+	]), N = M[0]?.points ?? [], { ref: te, width: P, element: ne } = h(), F = C(null), [I, L] = w(), R = ce({
 		series: n,
-		markers: d,
+		markers: s,
 		timestampUnit: r,
-		isStacked: k
-	}), V = A === void 0 ? R?.signature === B ? R : void 0 : A.value, H = y();
-	R !== void 0 && (R.signature !== B || j !== void 0) && z(void 0);
-	let U = A !== void 0;
-	if (v(() => {
-		if (U) return;
+		isStacked: _
+	}), z = O === void 0 ? I?.signature === R ? I : void 0 : O.value, B = x();
+	I !== void 0 && (I.signature !== R || j !== void 0) && L(void 0);
+	let V = O !== void 0;
+	if (b(() => {
+		if (V) return;
 		function e(e) {
-			e.target instanceof Node && L.current?.contains(e.target) !== !0 && z(void 0);
+			e.target instanceof Node && F.current?.contains(e.target) !== !0 && L(void 0);
 		}
 		return document.addEventListener("pointerdown", e), () => document.removeEventListener("pointerdown", e);
-	}, [U]), j !== void 0) return /* @__PURE__ */ w(f, {
+	}, [V]), j !== void 0) return /* @__PURE__ */ E(m, {
 		title: e,
 		description: t,
 		message: j
 	});
-	if (N.length === 0) return /* @__PURE__ */ w(c, {
+	if (N.length === 0) return /* @__PURE__ */ E(l, {
 		title: e,
 		description: t,
-		actions: h,
-		children: /* @__PURE__ */ w("p", {
+		actions: p,
+		children: /* @__PURE__ */ E("p", {
 			className: "x153jb6y",
 			children: "No observations"
 		})
 	});
-	let W = m - 28, G = N[0]?.timestamp ?? 0, K = N.at(-1)?.timestamp ?? G, q = M.flatMap((e) => e.points.flatMap((e) => e.value === null ? [] : [e.value + e.base])), J = E === "area" ? Math.min(0, ...q) : Math.min(...q), Y = E === "area" ? Math.max(0, ...q) : Math.max(...q), te = q.length === 0 ? 0 : J, ne = q.length === 0 ? 1 : Y, X = D({
-		domain: [...ae(te, ne, E === "area")],
-		range: [W, 12]
-	}), ce = X.ticks(3), Z = ee ?? Math.max(52, ...ce.map((e) => u(e).length * 7 + 12)), ue = Math.max(Z + 1, F - 16), Q = D({
-		domain: [...ae(G, K)],
-		range: [Z, ue]
+	let H = f - 28, U = H + 12, W = N[0]?.timestamp ?? 0, G = N.at(-1)?.timestamp ?? W, K = M.flatMap((e) => e.points.flatMap((e) => e.value === null ? [] : [e.value + e.base])), q = g === "area" ? Math.min(0, ...K) : Math.min(...K), re = g === "area" ? Math.max(0, ...K) : Math.max(...K), J = K.length === 0 ? 0 : q, ie = K.length === 0 ? 1 : re, Y = k({
+		domain: [...le(J, ie, g === "area")],
+		range: [H, 12]
+	}), ae = Y.ticks(3), X = ee ?? Math.max(52, ...ae.map((e) => a(e).length * 7 + 12)), Z = Math.max(X + 1, P - 16), Q = k({
+		domain: [...le(W, G)],
+		range: [X, Z]
 	});
-	function de(e) {
-		let t = I?.getBoundingClientRect();
+	function oe(e) {
+		let t = ne?.getBoundingClientRect();
 		if (t === void 0) return;
 		let n = Q.invert(e - t.left), r = N.find((e, t) => {
 			let r = N[t + 1];
 			return r === void 0 || n <= e.timestamp + (r.timestamp - e.timestamp) / 2;
 		});
 		r !== void 0 && $({
-			signature: B,
+			signature: R,
 			timestamp: r.timestamp,
 			source: "pointer"
 		});
 	}
 	function $(e) {
-		A === void 0 ? z(e) : A.onChange(e);
+		O === void 0 ? L(e) : O.onChange(e);
 	}
-	function fe(e) {
-		let t = N.findIndex((e) => e.timestamp === V?.timestamp), n = {
+	function de(e) {
+		if (e.altKey || e.ctrlKey || e.metaKey) return;
+		let t = N.findIndex((e) => e.timestamp === z?.timestamp), n = {
 			ArrowRight: Math.min(N.length - 1, t + 1),
 			ArrowLeft: Math.max(0, t - 1),
 			Home: 0,
@@ -922,7 +1003,7 @@ function $({ title: e, description: t, series: n, timestampUnit: r, formatTimest
 		};
 		switch (e.key) {
 			case "Escape":
-				e.preventDefault(), $(void 0);
+				e.preventDefault(), e.stopPropagation(), $(void 0);
 				break;
 			case "ArrowRight":
 			case "ArrowLeft":
@@ -931,7 +1012,7 @@ function $({ title: e, description: t, series: n, timestampUnit: r, formatTimest
 				e.preventDefault();
 				let t = N[n[e.key]];
 				t !== void 0 && $({
-					signature: B,
+					signature: R,
 					timestamp: t.timestamp,
 					source: "keyboard"
 				});
@@ -939,165 +1020,163 @@ function $({ title: e, description: t, series: n, timestampUnit: r, formatTimest
 			}
 		}
 	}
-	return /* @__PURE__ */ w("div", {
-		ref: L,
+	return /* @__PURE__ */ E("div", {
+		ref: F,
 		className: "xeuugli",
-		children: /* @__PURE__ */ T(c, {
+		children: /* @__PURE__ */ D(l, {
 			title: e,
 			description: t,
-			actions: h,
-			children: [/* @__PURE__ */ T("div", {
+			actions: p,
+			children: [/* @__PURE__ */ D("div", {
 				className: "xrvj5dj x1n8ia3y",
 				children: [
-					/* @__PURE__ */ w(a, { items: M.map(({ id: e, label: t, tone: n }) => ({
+					/* @__PURE__ */ E(o, { items: M.map(({ id: e, label: t, tone: n }) => ({
 						id: e,
 						label: t,
 						tone: n
 					})) }),
-					/* @__PURE__ */ w("div", {
-						ref: P,
-						..._.props(i.plot),
-						children: /* @__PURE__ */ T("svg", {
+					/* @__PURE__ */ D("div", {
+						ref: te,
+						...y.props(c.plot),
+						children: [/* @__PURE__ */ D("svg", {
 							role: "img",
 							"aria-label": `${e}. Use arrow keys to inspect observations.`,
-							"aria-describedby": H,
+							"aria-describedby": B,
 							tabIndex: 0,
-							viewBox: `0 0 ${F} ${m}`,
-							height: m,
-							onKeyDown: fe,
+							viewBox: `0 0 ${P} ${U}`,
+							height: U,
+							onKeyDown: de,
 							onPointerMove: (e) => {
-								e.pointerType === "mouse" && de(e.clientX);
+								e.pointerType === "mouse" && oe(e.clientX);
 							},
-							onPointerDown: (e) => de(e.clientX),
-							..._.props(i.svg, le.plot),
+							onPointerDown: (e) => oe(e.clientX),
+							...y.props(c.svg, he.plot),
 							children: [
-								ce.map((e) => /* @__PURE__ */ T("g", { children: [/* @__PURE__ */ w("line", {
-									x1: Z,
-									x2: ue,
-									y1: X(e),
-									y2: X(e),
-									..._.props(i.grid)
-								}), /* @__PURE__ */ w("text", {
-									x: Z - 8,
-									y: X(e),
+								ae.map((e) => /* @__PURE__ */ D("g", { children: [/* @__PURE__ */ E("line", {
+									x1: X,
+									x2: Z,
+									y1: Y(e),
+									y2: Y(e),
+									...y.props(c.grid)
+								}), /* @__PURE__ */ E("text", {
+									x: X - 8,
+									y: Y(e),
 									textAnchor: "end",
 									dominantBaseline: "middle",
-									..._.props(i.label),
-									children: u(e)
+									...y.props(c.label),
+									children: a(e)
 								})] }, e)),
-								M.map((e) => /* @__PURE__ */ T("g", { children: [E === "area" && /* @__PURE__ */ w(O, {
+								M.map((e) => /* @__PURE__ */ D("g", { children: [g === "area" && /* @__PURE__ */ E(A, {
 									data: [...e.points],
 									defined: (e) => e.value !== null,
 									x: (e) => Q(e.timestamp),
-									y0: (e) => X(e.base),
-									y1: (e) => X((e.value ?? 0) + e.base),
-									yScale: X,
-									fill: s[e.tone],
-									fillOpacity: k ? .65 : .15
-								}), /* @__PURE__ */ w(se, {
+									y0: (e) => Y(e.base),
+									y1: (e) => Y((e.value ?? 0) + e.base),
+									yScale: Y,
+									fill: u[e.tone],
+									fillOpacity: _ ? .65 : .15
+								}), /* @__PURE__ */ E(fe, {
 									series: e,
 									x: Q,
-									y: X,
-									inspectedTimestamp: V?.timestamp
+									y: Y,
+									inspectedTimestamp: z?.timestamp
 								})] }, e.id)),
-								d.map((e) => /* @__PURE__ */ T("g", { children: [e.kind === "time" ? /* @__PURE__ */ w("line", {
+								s.map((e) => /* @__PURE__ */ D("g", { children: [e.kind === "time" ? /* @__PURE__ */ E("line", {
 									x1: Q(e.timestamp),
 									x2: Q(e.timestamp),
 									y1: 12,
-									y2: W,
+									y2: H,
 									className: "xhq4mlf x1ntoi03 x13efnbd"
-								}) : /* @__PURE__ */ w("circle", {
+								}) : /* @__PURE__ */ E("circle", {
 									cx: Q(e.timestamp),
-									cy: X(e.value + (M.find((t) => t.id === e.seriesId)?.points.find((t) => t.timestamp === e.timestamp)?.base ?? 0)),
+									cy: Y(e.value + (M.find((t) => t.id === e.seriesId)?.points.find((t) => t.timestamp === e.timestamp)?.base ?? 0)),
 									r: 4,
-									fill: g.surface,
-									..._.props(i.selected)
-								}), /* @__PURE__ */ w("title", { children: e.kind === "point" ? `${e.label}: ${u(e.value)}` : e.label })] }, e.id)),
-								V !== void 0 && /* @__PURE__ */ w("line", {
-									x1: Q(V.timestamp),
-									x2: Q(V.timestamp),
+									fill: v.surface,
+									...y.props(c.selected)
+								}), /* @__PURE__ */ E("title", { children: e.kind === "point" ? `${e.label}: ${a(e.value)}` : e.label })] }, e.id)),
+								z !== void 0 && /* @__PURE__ */ E("line", {
+									x1: Q(z.timestamp),
+									x2: Q(z.timestamp),
 									y1: 12,
-									y2: W,
+									y2: H,
 									className: "xhq4mlf x1ntoi03 x13efnbd"
-								}),
-								/* @__PURE__ */ w("text", {
-									x: Z,
-									y: m - 4,
-									..._.props(i.label),
-									children: o(G)
-								}),
-								K !== G && /* @__PURE__ */ w("text", {
-									x: ue,
-									y: m - 4,
-									textAnchor: "end",
-									..._.props(i.label),
-									children: o(K)
 								})
 							]
-						})
+						}), /* @__PURE__ */ D("div", {
+							"aria-hidden": !0,
+							...y.props(he.timeAxis, he.timeAxisInset(X, Math.max(0, P - Z))),
+							children: [/* @__PURE__ */ E("span", {
+								className: "x1cqoux5 xeuugli xj0a0fe",
+								children: i(W)
+							}), G !== W && /* @__PURE__ */ E("span", {
+								className: "x1cqoux5 xeuugli xj0a0fe xp4054r",
+								children: i(G)
+							})]
+						})]
 					}),
-					/* @__PURE__ */ w("div", {
-						id: H,
-						"aria-live": V?.source === "keyboard" ? "polite" : "off",
-						className: "x78zum5 x1a02dak x1pha0wt x8zbtdt x1gkm1c7 xy8obcc xas2l8k x1mqbd49",
-						children: V === void 0 ? /* @__PURE__ */ w("span", {
+					/* @__PURE__ */ E("div", {
+						id: B,
+						"aria-live": z?.source === "keyboard" ? "polite" : "off",
+						className: "x78zum5 x1a02dak x1pha0wt x8zbtdt x1gkm1c7 xy8obcc xas2l8k x1mqbd49 xj0a0fe",
+						children: z === void 0 ? /* @__PURE__ */ E("span", {
 							className: "x153jb6y",
 							children: "Point, tap, or use the arrow keys to inspect values."
-						}) : /* @__PURE__ */ T(C, { children: [
-							/* @__PURE__ */ w("span", { children: o(V.timestamp) }),
-							/* @__PURE__ */ w("dl", {
-								className: "x78zum5 x1a02dak x1n8ia3y x1ghz6dp",
+						}) : /* @__PURE__ */ D(T, { children: [
+							/* @__PURE__ */ E("span", { children: i(z.timestamp) }),
+							/* @__PURE__ */ E("dl", {
+								className: "x78zum5 x1a02dak x8zbtdt x1gkm1c7 x1ghz6dp xeuugli",
 								children: M.map((e) => {
-									let t = e.points.find((e) => e.timestamp === V.timestamp);
-									return /* @__PURE__ */ T("div", {
-										className: "x78zum5 xunmzkg x1ghz6dp xss6m8b",
-										children: [/* @__PURE__ */ w("dt", { children: e.label }), /* @__PURE__ */ w("dd", {
+									let t = e.points.find((e) => e.timestamp === z.timestamp);
+									return /* @__PURE__ */ D("div", {
+										className: "x78zum5 x1a02dak xunmzkg x1ghz6dp xeuugli xss6m8b",
+										children: [/* @__PURE__ */ E("dt", { children: e.label }), /* @__PURE__ */ E("dd", {
 											className: "x1ghz6dp xbixft",
-											children: t?.value === null || t === void 0 ? "Unavailable" : u(t.value)
+											children: t?.value === null || t === void 0 ? "Unavailable" : a(t.value)
 										})]
 									}, e.id);
 								})
 							}),
-							d.filter((e) => e.timestamp === V.timestamp).map((e) => /* @__PURE__ */ w("span", { children: e.label }, e.id))
+							s.filter((e) => e.timestamp === z.timestamp).map((e) => /* @__PURE__ */ E("span", { children: e.label }, e.id))
 						] })
 					}),
-					d.length > 0 && /* @__PURE__ */ w("ul", {
-						className: "x78zum5 x1a02dak x1n8ia3y x1ghz6dp x1717udv xe8uvvx xy8obcc x153jb6y",
-						children: d.map((e) => /* @__PURE__ */ T("li", { children: [
-							o(e.timestamp),
+					s.length > 0 && /* @__PURE__ */ E("ul", {
+						className: "x78zum5 x1a02dak x1n8ia3y x1ghz6dp x1717udv xe8uvvx xy8obcc x153jb6y xj0a0fe",
+						children: s.map((e) => /* @__PURE__ */ D("li", { children: [
+							i(e.timestamp),
 							" · ",
 							e.label,
-							e.kind === "point" && ` · ${u(e.value)}`
+							e.kind === "point" && ` · ${a(e.value)}`
 						] }, e.id))
 					})
 				]
-			}), /* @__PURE__ */ w(l, { children: /* @__PURE__ */ T("table", {
+			}), /* @__PURE__ */ E(d, { children: /* @__PURE__ */ D("table", {
 				className: "xh8yej3 x1mwwwfo xy8obcc x1yc453h xss6m8b",
 				children: [
-					/* @__PURE__ */ T("caption", { children: [e, " observations"] }),
-					/* @__PURE__ */ w("thead", { children: /* @__PURE__ */ T("tr", { children: [/* @__PURE__ */ T("th", {
-						className: "x69ldcm x1yc453h xso031l x1q0q8m5 x1qndepd xo1l8bm",
+					/* @__PURE__ */ D("caption", { children: [e, " observations"] }),
+					/* @__PURE__ */ E("thead", { children: /* @__PURE__ */ D("tr", { children: [/* @__PURE__ */ D("th", {
+						scope: "col",
+						className: "x69ldcm x1yc453h xso031l x1q0q8m5 x1qndepd xj57cvi",
 						children: [
 							"Time (",
 							r,
 							")"
 						]
-					}), M.map((e) => /* @__PURE__ */ w("th", {
+					}), M.map((e) => /* @__PURE__ */ E("th", {
 						scope: "col",
-						className: "x69ldcm x1yc453h xso031l x1q0q8m5 x1qndepd xo1l8bm",
+						className: "x69ldcm x1yc453h xso031l x1q0q8m5 x1qndepd xj57cvi",
 						children: e.label
 					}, e.id))] }) }),
-					/* @__PURE__ */ w("tbody", { children: N.map((e, t) => /* @__PURE__ */ T("tr", { children: [/* @__PURE__ */ w("th", {
+					/* @__PURE__ */ E("tbody", { children: N.map((e, t) => /* @__PURE__ */ D("tr", { children: [/* @__PURE__ */ E("th", {
 						scope: "row",
-						className: "x69ldcm x1yc453h xso031l x1q0q8m5 x1qndepd xo1l8bm",
-						children: o(e.timestamp)
-					}), M.map((e) => /* @__PURE__ */ w("td", {
-						className: "x69ldcm x1yc453h xso031l x1q0q8m5 x1qndepd xo1l8bm",
-						children: e.points[t]?.value === null || e.points[t]?.value === void 0 ? "Unavailable" : u(e.points[t].value)
+						className: "x69ldcm x1yc453h xso031l x1q0q8m5 x1qndepd xj57cvi",
+						children: i(e.timestamp)
+					}), M.map((e) => /* @__PURE__ */ E("td", {
+						className: "x69ldcm x1yc453h xso031l x1q0q8m5 x1qndepd xj57cvi",
+						children: e.points[t]?.value === null || e.points[t]?.value === void 0 ? "Unavailable" : a(e.points[t].value)
 					}, e.id))] }, e.timestamp)) })
 				]
 			}) })]
 		})
 	});
 }
-export { Q as AreaChart, N as BarChart, I as BreakdownBar, ue as LineChart, V as MAX_SCATTER_POINTS, W as ScatterPlot, de as SmallMultiples, ce as Sparkline, Y as timeSeriesLimits };
+export { _e as AreaChart, R as BarChart, F as BarChartPlaceholder, H as BreakdownBar, ge as LineChart, q as MAX_SCATTER_POINTS, ie as ScatterPlot, ve as SmallMultiples, pe as Sparkline, Q as timeSeriesLimits };