@mechane-ai/elements 0.0.0-stage → 0.4.1

package/dist/charts/cartesian.js

@@ -0,0 +1,1040 @@
+import { i as e, n as t, r as n, t as r } from "../categorical-values-cMX7Mykq.js";
+import { a as i, i as a, n as o, o as s, r as c, t as l } from "../chart-frame-bX0VLC_W.js";
+import { n as u, r as d, t as f } from "../chart-input-qnM44oen.js";
+import { t as p } from "../plot-width--OgdohB5.js";
+import { b as m } from "../src-CbYaLvhD.js";
+import { m as h } from "../src-CvpS9XIR.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";
+// packages/charts/src/cartesian/bar-chart.tsx
+var ee = { plot: {
+	kqGvvJ: "x1we84gm",
+	$$css: !0
+} };
+function j({ 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) {
+			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.";
+}
+function M({ title: e, description: t, categories: o, series: l, domain: u, mode: d = "grouped", formatValue: m, selection: h, height: g = 200 }) {
+	let v = j({
+		categories: o,
+		series: l,
+		domain: u,
+		mode: d
+	}), { ref: y, width: b } = p();
+	if (v !== void 0 || !Number.isFinite(g) || g < 48) return /* @__PURE__ */ w(f, {
+		title: e,
+		description: t,
+		message: v ?? "Chart height must be at least 48 pixels."
+	});
+	let x = g - 28, S = D({
+		domain: [...u],
+		range: [x, 12]
+	}), C = Math.max(52, ...S.ticks(3).map((e) => m(e).length * 7 + 12)), O = Math.max(C + 1, b - 16), A = E({
+		domain: o.map((e) => e.id),
+		range: [C, O],
+		padding: .3
+	}), M = E({
+		domain: l.map((e) => e.id),
+		range: [0, A.bandwidth()],
+		padding: .08
+	}), N = Math.max(1, Math.ceil(56 / A.step())), P = Math.max(1, Math.floor(A.step() * N / 12) - 1), F = l.map((e, t) => ({
+		id: e.id,
+		label: e.label,
+		tone: n(e.tone, t)
+	}));
+	return /* @__PURE__ */ T(c, {
+		title: e,
+		description: t,
+		children: [
+			/* @__PURE__ */ w(a, { items: F }),
+			/* @__PURE__ */ w("div", {
+				ref: y,
+				..._.props(i.plot, ee.plot),
+				children: o.length === 0 || l.length === 0 ? /* @__PURE__ */ w("p", {
+					className: "x153jb6y x1ghz6dp xy8obcc",
+					children: "No categories"
+				}) : /* @__PURE__ */ T("svg", {
+					role: "img",
+					"aria-label": e,
+					viewBox: `0 0 ${b} ${g}`,
+					height: g,
+					..._.props(i.svg),
+					children: [S.ticks(3).map((e) => /* @__PURE__ */ T("g", { children: [/* @__PURE__ */ w("line", {
+						x1: C,
+						x2: O,
+						y1: S(e),
+						y2: S(e),
+						..._.props(i.grid)
+					}), /* @__PURE__ */ w("text", {
+						x: C - 8,
+						y: S(e),
+						textAnchor: "end",
+						dominantBaseline: "middle",
+						..._.props(i.label),
+						children: m(e)
+					})] }, e)), o.map((e, t) => /* @__PURE__ */ T("g", { children: [l.map((r, a) => {
+						let o = r.values[t];
+						if (o == null) return null;
+						let c = d === "stacked" ? l.slice(0, a).reduce((e, n) => e + (n.values[t] ?? 0), 0) : 0, u = S(c), f = S(c + o);
+						return /* @__PURE__ */ w(k, {
+							x: (A(e.id) ?? C) + (d === "stacked" ? 0 : M(r.id) ?? 0),
+							y: Math.min(u, f),
+							width: d === "stacked" ? A.bandwidth() : M.bandwidth(),
+							height: Math.max(+(o === 0), Math.abs(f - u)),
+							fill: s[n(r.tone, a)],
+							..._.props(h?.selectedId === e.id && i.selected),
+							children: /* @__PURE__ */ T("title", { children: [
+								e.label,
+								" · ",
+								r.label,
+								": ",
+								m(o)
+							] })
+						}, r.id);
+					}), t % N === 0 && /* @__PURE__ */ w("text", {
+						x: (A(e.id) ?? C) + A.bandwidth() / 2,
+						y: g - 4,
+						textAnchor: "middle",
+						..._.props(i.label),
+						children: e.label.length > P ? `${e.label.slice(0, P)}…` : e.label
+					})] }, e.id))]
+				})
+			}),
+			/* @__PURE__ */ w(r, {
+				items: o.map((e, t) => ({
+					id: e.id,
+					label: e.label,
+					valueLabel: l.map((e) => `${e.label}: ${e.values[t] === null || e.values[t] === void 0 ? "Unavailable" : m(e.values[t])}`).join(" · "),
+					tone: "neutral"
+				})),
+				selection: h
+			})
+		]
+	});
+}
+// packages/charts/src/cartesian/breakdown-bar.tsx
+var N = {
+	kzqmXN: "x5lhr3w",
+	kZKoxP: "x5yr21d",
+	$$css: !0
+}, P = { segment: (e, t) => [
+	N,
+	{
+		kWkggS: t == null ? t : "xl8spv7",
+		$$css: !0
+	},
+	{
+		"--x-width": ((e) => typeof e == "number" ? e + "px" : e ?? void 0)(`${e}%`),
+		"--x-backgroundColor": t ?? void 0
+	}
+] };
+function F({ 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,
+		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", {
+			className: "x153jb6y x1ghz6dp xy8obcc",
+			children: "No values"
+		}) : /* @__PURE__ */ T(C, { children: [
+			/* @__PURE__ */ w("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(P.segment(o === 0 ? 0 : e.value / o * 100, s[n(e.tone, t)])) }, e.id))
+			}),
+			/* @__PURE__ */ w(r, {
+				items: a.map((e, t) => ({
+					id: e.id,
+					label: e.label,
+					valueLabel: e.value === null ? "Unavailable" : l(e.value),
+					tone: n(e.tone, t)
+				})),
+				selection: u
+			}),
+			o - p > m && /* @__PURE__ */ T("p", {
+				className: "x153jb6y x1ghz6dp xy8obcc",
+				children: [
+					"Unassigned portion: ",
+					l(o - p),
+					" of ",
+					l(o)
+				]
+			})
+		] })
+	}) : /* @__PURE__ */ w(f, {
+		title: t,
+		description: i,
+		message: d
+	});
+}
+// packages/charts/src/cartesian/scatter-plot.tsx
+var I = 260, L = 56, R = 20, z = 12, B = 1e3, V = {
+	kzqmXN: "x1xc55vz",
+	kZKoxP: "xdk7pt",
+	kaIpWk: "x16rqkct",
+	$$css: !0
+}, H = {
+	brush: {
+		kFalU9: "xx69xxh",
+		kkrTdU: "xsid9ct",
+		$$css: !0
+	},
+	target: {
+		kVAEAm: "x10l6tqk",
+		k1xSpc: "xrvj5dj",
+		kgQiWS: "x1ku5rj1",
+		kzqmXN: "x187nhsf",
+		kZKoxP: "xn3w4p2",
+		k3aq6I: "x11lhmoz",
+		kMzoRj: "xc342km",
+		kmVPX3: "x1717udv",
+		kWkggS: "xjbqb8w",
+		kkrTdU: "x1ypdohk",
+		kfzvcC: "x67bb7w",
+		kPJHz1: "x13qnu6",
+		kZs9gx: "x19rmrnh",
+		k7shQP: "x9v5kkp",
+		kiEn40: "x175ew0f",
+		kguI0P: "xisywhd",
+		kUjPgX: "xakijqq",
+		kFU1ZQ: "xzbfamy",
+		kRG58y: "x1cdmj33",
+		$$css: !0
+	},
+	location: (e, t) => [{
+		kbCHJM: e == null ? e : "xgq9j65",
+		k87sOh: t == null ? t : "xjbys53",
+		$$css: !0
+	}, {
+		"--x-left": ((e) => typeof e == "number" ? e + "px" : e ?? void 0)(e),
+		"--x-top": ((e) => typeof e == "number" ? e + "px" : e ?? void 0)(t)
+	}],
+	dot: (e) => [
+		V,
+		{
+			kWkggS: e == null ? e : "xl8spv7",
+			$$css: !0
+		},
+		{ "--x-backgroundColor": e ?? void 0 }
+	],
+	selected: {
+		kMeerF: "x12ei19c",
+		kjBf7l: "xj5pgkc",
+		k3XXqK: "xaatb59",
+		kInvED: "x1ewu8gn",
+		$$css: !0
+	}
+};
+function U(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 = K(e);
+	if (S !== null) return /* @__PURE__ */ w(f, {
+		title: t,
+		description: n,
+		message: S
+	});
+	let C = D({
+		domain: [...i],
+		range: [L, Math.max(L, x - R)]
+	}), E = D({
+		domain: [...a],
+		range: [216, z]
+	});
+	return /* @__PURE__ */ T(c, {
+		title: t,
+		description: n,
+		children: [
+			r.length === 0 ? /* @__PURE__ */ w("p", {
+				className: "x1ghz6dp x153jb6y",
+				children: y
+			}) : /* @__PURE__ */ T("div", {
+				ref: b,
+				className: "x1n2onr6 xeuugli",
+				children: [/* @__PURE__ */ w(W, {
+					width: x,
+					scaleX: C,
+					scaleY: E,
+					...e
+				}, `${i[0]}:${i[1]}:${a[0]}:${a[1]}:${x}`), g !== void 0 && /* @__PURE__ */ w("div", {
+					className: "x10l6tqk x10a8y8t x1n71m9f x47corl",
+					children: r.map((e) => /* @__PURE__ */ w("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(H.target, H.location(C(e.x), E(e.y))),
+						children: /* @__PURE__ */ w("span", {
+							"aria-hidden": !0,
+							..._.props(H.dot(s[e.tone]), g.selectedId === e.id && H.selected)
+						})
+					}, e.id))
+				})]
+			}),
+			v !== void 0 && /* @__PURE__ */ w(G, {
+				...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",
+					children: [
+						m(e.x),
+						" · ",
+						h(e.y)
+					]
+				})]
+			}, e.id)) })
+		]
+	});
+}
+function W({ 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 : {
+		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)]
+	};
+	function g(r) {
+		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 * I)
+		};
+	}
+	function v(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 * I;
+		if (r < L || r > e - R || i < z || i > 216) return;
+		let a = g(t);
+		t.currentTarget.setPointerCapture(t.pointerId), m({
+			start: a,
+			end: a,
+			pointerId: t.pointerId
+		});
+	}
+	function b(e) {
+		p !== null && p.pointerId === e.pointerId && m({
+			...p,
+			end: g(e)
+		});
+	}
+	function x(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)],
+			y: [Math.min(p.start.y, t.y), Math.max(p.start.y, t.y)]
+		};
+		m(null), e.currentTarget.releasePointerCapture(e.pointerId), d?.onChange(n);
+	}
+	return /* @__PURE__ */ T("svg", {
+		width: e,
+		height: I,
+		viewBox: `0 0 ${e} ${I}`,
+		"aria-hidden": !0,
+		onPointerDown: v,
+		onPointerMove: b,
+		onPointerUp: x,
+		onPointerCancel: () => m(null),
+		onLostPointerCapture: () => m(null),
+		..._.props(i.svg, d !== void 0 && H.brush),
+		children: [
+			/* @__PURE__ */ w("defs", { children: /* @__PURE__ */ w("clipPath", {
+				id: f,
+				children: /* @__PURE__ */ w("rect", {
+					x: L,
+					y: z,
+					width: Math.max(0, e - L - R),
+					height: 204
+				})
+			}) }),
+			t.ticks(5).map((e) => /* @__PURE__ */ T("g", { children: [/* @__PURE__ */ w("line", {
+				x1: t(e),
+				x2: t(e),
+				y1: z,
+				y2: 216,
+				..._.props(i.grid)
+			}), /* @__PURE__ */ w("text", {
+				x: t(e),
+				y: 234,
+				textAnchor: "middle",
+				..._.props(i.label),
+				children: c(e)
+			})] }, e)),
+			n.ticks(4).map((t) => /* @__PURE__ */ T("g", { children: [/* @__PURE__ */ w("line", {
+				x1: L,
+				x2: e - R,
+				y1: n(t),
+				y2: n(t),
+				..._.props(i.grid)
+			}), /* @__PURE__ */ w("text", {
+				x: 48,
+				y: n(t) + 4,
+				textAnchor: "end",
+				..._.props(i.label),
+				children: l(t)
+			})] }, t)),
+			/* @__PURE__ */ w("text", {
+				x: (L + e - R) / 2,
+				y: 256,
+				textAnchor: "middle",
+				..._.props(i.label),
+				children: a
+			}),
+			/* @__PURE__ */ w("text", {
+				x: 12,
+				y: 108,
+				textAnchor: "middle",
+				transform: "rotate(-90 12 108)",
+				..._.props(i.label),
+				children: o
+			}),
+			/* @__PURE__ */ T("g", {
+				clipPath: `url(#${f})`,
+				children: [h != null && /* @__PURE__ */ w("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", {
+					cx: t(e.x),
+					cy: n(e.y),
+					r: 4,
+					fill: s[e.tone]
+				}, e.id))]
+			})
+		]
+	});
+}
+function G({ 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", {
+		className: "xrvj5dj x1n8ia3y x1xxf3xd xc342km x1717udv xeuugli",
+		children: [
+			/* @__PURE__ */ w("legend", {
+				className: "x153jb6y xy8obcc x1jfksii",
+				children: "Drag with a mouse, or adjust these bounds to select a coordinate range."
+			}),
+			/* @__PURE__ */ T(h.Root, {
+				value: s.x,
+				min: t[0],
+				max: t[1],
+				step: e.xStep,
+				locale: e.locale,
+				thumbCollisionBehavior: "none",
+				onValueChange: (t) => e.onChange({
+					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: [
+						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, {
+						index: 0,
+						"aria-label": `${r} minimum`,
+						getAriaValueText: (e, t) => a(t)
+					}),
+					/* @__PURE__ */ w(h.Thumb, {
+						index: 1,
+						"aria-label": `${r} maximum`,
+						getAriaValueText: (e, t) => a(t)
+					})
+				] }) })]
+			}),
+			/* @__PURE__ */ T(h.Root, {
+				value: s.y,
+				min: n[0],
+				max: n[1],
+				step: e.yStep,
+				locale: e.locale,
+				thumbCollisionBehavior: "none",
+				onValueChange: (t) => e.onChange({
+					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: [
+						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, {
+						index: 0,
+						"aria-label": `${i} minimum`,
+						getAriaValueText: (e, t) => o(t)
+					}),
+					/* @__PURE__ */ w(h.Thumb, {
+						index: 1,
+						"aria-label": `${i} maximum`,
+						getAriaValueText: (e, t) => o(t)
+					})
+				] }) })]
+			}),
+			/* @__PURE__ */ w(m, {
+				type: "button",
+				disabled: e.value === null,
+				onClick: () => e.onChange(null),
+				children: "Clear range"
+			})
+		]
+	});
+}
+function K({ 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 ${B}-point render limit. Supply a smaller, labelled sample.`;
+	if (!u(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];
+		return r || i;
+	})) return "Scatter coordinates fall outside the declared domain. Widen the domain or supply a labelled window of points.";
+	if (r === void 0) return null;
+	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 : !q(o.x, t) || !q(o.y, n) ? "The selected range must have finite, ordered bounds inside the declared domain." : null;
+}
+function q(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 J = {
+	series: 12,
+	pointsPerSeries: 2e3,
+	markers: 200,
+	panels: 12
+}, te = .01, ne = [
+	"series1",
+	"series2",
+	"series3",
+	"series4",
+	"series5",
+	"series6"
+];
+function re({ series: e, isStacked: t, markers: n }) {
+	let r = e[0]?.points.map((e) => e.timestamp) ?? [];
+	if (e.length > J.series || r.length > J.pointsPerSeries || n.length > J.markers) return `Choose a window with at most ${J.series} series, ${J.pointsPerSeries} observations per series, and ${J.markers} markers.`;
+	if (!u(e) || !u(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 = se({
+			points: n.points,
+			timestamps: r,
+			isStacked: t
+		});
+		if (e !== void 0) return e;
+	}
+	for (let t of n) {
+		if (!r.includes(t.timestamp)) return "Every marker must align with an observation timestamp.";
+		if (t.kind === "point") {
+			let n = e.find((e) => e.id === t.seriesId)?.points.find((e) => e.timestamp === t.timestamp);
+			if (n === void 0 || n.value !== t.value) return "Point markers must reference the recorded series value.";
+		}
+	}
+	let i = e.flatMap((e) => e.points.flatMap((e) => e.value === null ? [] : [e.value])), a = Math.max(0, ...i) - Math.min(0, ...i), o = (r.at(-1) ?? 0) - (r[0] ?? 0);
+	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 }) {
+	return JSON.stringify([
+		n,
+		r,
+		e.map((e) => [
+			e.id,
+			e.label,
+			e.tone,
+			e.points.map((e) => [e.timestamp, e.value])
+		]),
+		t.map((e) => [
+			e.id,
+			e.kind,
+			e.timestamp,
+			e.label,
+			e.seriesId,
+			e.value
+		])
+	]);
+}
+function ae(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;
+	return [Number.isFinite(i) ? i : e, Number.isFinite(a) ? a : t];
+}
+function oe(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 = t ? e.slice(0, i).reduce((e, t) => e + (t.points[r]?.value ?? 0), 0) : 0;
+			return {
+				...n,
+				base: a
+			};
+		});
+		return {
+			id: r.id,
+			label: r.label,
+			tone: o,
+			points: s
+		};
+	});
+}
+function se({ 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.";
+		if (i.value !== null && !Number.isFinite(i.value)) return "Observations must be finite numbers or explicit missing values.";
+		if (n && (i.value === null || i.value < 0)) return "Stacked observations must be present and nonnegative.";
+	}
+}
+// packages/charts/src/cartesian/time-series-line.tsx
+function ce({ series: e, x: t, y: n, inspectedTimestamp: r, pointRadius: a = 3 }) {
+	return /* @__PURE__ */ T(C, { children: [/* @__PURE__ */ w(A, {
+		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)
+	}), 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", {
+		cx: t(r.timestamp),
+		cy: n((r.value ?? 0) + r.base),
+		r: a,
+		fill: s[e.tone]
+	}, r.timestamp))] });
+}
+// packages/charts/src/cartesian/sparkline.tsx
+function Y({ title: e, summary: t, unit: n, timestampUnit: r, series: i, valueDomain: a }) {
+	let o = y(), s = y(), c = le({
+		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", {
+		role: "img",
+		"aria-label": `${e}. ${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)],
+		range: [3, 125]
+	}), p = D({
+		domain: [...a],
+		range: [29, 3]
+	}), m = oe([i], !1)[0];
+	return /* @__PURE__ */ T("svg", {
+		role: "img",
+		"aria-labelledby": o,
+		"aria-describedby": s,
+		focusable: "false",
+		viewBox: "0 0 128 32",
+		width: 128,
+		height: 32,
+		className: "x1rg5ohu x2pejg6 x10w6t97 x2lah0s xxymvpz",
+		children: [
+			/* @__PURE__ */ w("title", {
+				id: o,
+				children: e
+			}),
+			/* @__PURE__ */ T("desc", {
+				id: s,
+				children: [
+					t,
+					" Values in ",
+					n,
+					"; timestamps in ",
+					r,
+					". Displayed value domain: ",
+					a[0],
+					" to",
+					" ",
+					a[1],
+					" ",
+					n,
+					"."
+				]
+			}),
+			m !== void 0 && /* @__PURE__ */ w(ce, {
+				series: m,
+				x: f,
+				y: p,
+				pointRadius: 2
+			})
+		]
+	});
+}
+function le({ 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({
+		series: [r],
+		isStacked: !1,
+		markers: []
+	});
+	if (a !== void 0) return a;
+	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 ue = { plot: {
+	k7Eaqz: "xeuugli",
+	kInvED: "x1hl8ikr",
+	kZs9gx: "x19rmrnh",
+	k7shQP: "x9v5kkp",
+	kPJHz1: "x13qnu6",
+	$$css: !0
+} };
+function X(e) {
+	return /* @__PURE__ */ w($, {
+		...e,
+		kind: "line",
+		stacked: !1
+	});
+}
+function Z({ stacked: e = !1, ...t }) {
+	return /* @__PURE__ */ w($, {
+		...t,
+		kind: "area",
+		stacked: e
+	});
+}
+function Q({ charts: e, ...t }) {
+	let n = x(null), [r, i] = S(), a = JSON.stringify(e.map((e) => [
+		e.id,
+		e.title,
+		ie({
+			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(() => {
+		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, {
+		title: "Small multiples",
+		message: "Charts need unique identifiers and aligned observation timestamps."
+	});
+	if (e.length > J.panels) return /* @__PURE__ */ w(f, {
+		title: "Small multiples",
+		message: `Choose at most ${J.panels} panels.`
+	});
+	if (e.length === 0) return /* @__PURE__ */ w(c, {
+		title: "Small multiples",
+		children: /* @__PURE__ */ w("p", {
+			className: "x153jb6y",
+			children: "No charts"
+		})
+	});
+	let l = {
+		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", {
+		ref: n,
+		className: "xrvj5dj x1j825kq",
+		children: e.map((e) => /* @__PURE__ */ w($, {
+			...t,
+			title: e.title,
+			description: e.description,
+			series: e.series,
+			formatValue: e.formatValue,
+			markers: e.markers,
+			kind: "line",
+			stacked: !1,
+			sharedInspection: l,
+			axisWidth: d
+		}, 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({
+		series: n,
+		isStacked: k,
+		markers: d
+	}), M = b(() => j === void 0 ? oe(n, k) : [], [
+		n,
+		k,
+		j
+	]), N = M[0]?.points ?? [], { ref: P, width: F, element: I } = p(), L = x(null), [R, z] = S(), B = ie({
+		series: n,
+		markers: d,
+		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;
+		function e(e) {
+			e.target instanceof Node && L.current?.contains(e.target) !== !0 && z(void 0);
+		}
+		return document.addEventListener("pointerdown", e), () => document.removeEventListener("pointerdown", e);
+	}, [U]), j !== void 0) return /* @__PURE__ */ w(f, {
+		title: e,
+		description: t,
+		message: j
+	});
+	if (N.length === 0) return /* @__PURE__ */ w(c, {
+		title: e,
+		description: t,
+		actions: h,
+		children: /* @__PURE__ */ w("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), te = E === "area" ? Math.max(0, ...q) : Math.max(...q), ne = q.length === 0 ? 0 : J, se = q.length === 0 ? 1 : te, Y = D({
+		domain: [...ae(ne, se, E === "area")],
+		range: [W, 12]
+	}), le = Y.ticks(3), X = ee ?? Math.max(52, ...le.map((e) => u(e).length * 7 + 12)), Z = Math.max(X + 1, F - 16), Q = D({
+		domain: [...ae(G, K)],
+		range: [X, Z]
+	});
+	function $(e) {
+		let t = I?.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 && de({
+			signature: B,
+			timestamp: r.timestamp,
+			source: "pointer"
+		});
+	}
+	function de(e) {
+		A === void 0 ? z(e) : A.onChange(e);
+	}
+	function fe(e) {
+		let t = N.findIndex((e) => e.timestamp === V?.timestamp), n = {
+			ArrowRight: Math.min(N.length - 1, t + 1),
+			ArrowLeft: Math.max(0, t - 1),
+			Home: 0,
+			End: N.length - 1
+		};
+		switch (e.key) {
+			case "Escape":
+				e.preventDefault(), de(void 0);
+				break;
+			case "ArrowRight":
+			case "ArrowLeft":
+			case "Home":
+			case "End": {
+				e.preventDefault();
+				let t = N[n[e.key]];
+				t !== void 0 && de({
+					signature: B,
+					timestamp: t.timestamp,
+					source: "keyboard"
+				});
+				break;
+			}
+		}
+	}
+	return /* @__PURE__ */ w("div", {
+		ref: L,
+		className: "xeuugli",
+		children: /* @__PURE__ */ T(c, {
+			title: e,
+			description: t,
+			actions: h,
+			children: [/* @__PURE__ */ T("div", {
+				className: "xrvj5dj x1n8ia3y",
+				children: [
+					/* @__PURE__ */ w(a, { 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", {
+							role: "img",
+							"aria-label": `${e}. Use arrow keys to inspect observations.`,
+							"aria-describedby": H,
+							tabIndex: 0,
+							viewBox: `0 0 ${F} ${m}`,
+							height: m,
+							onKeyDown: fe,
+							onPointerMove: (e) => {
+								e.pointerType === "mouse" && $(e.clientX);
+							},
+							onPointerDown: (e) => $(e.clientX),
+							..._.props(i.svg, ue.plot),
+							children: [
+								le.map((e) => /* @__PURE__ */ T("g", { children: [/* @__PURE__ */ w("line", {
+									x1: X,
+									x2: Z,
+									y1: Y(e),
+									y2: Y(e),
+									..._.props(i.grid)
+								}), /* @__PURE__ */ w("text", {
+									x: X - 8,
+									y: Y(e),
+									textAnchor: "end",
+									dominantBaseline: "middle",
+									..._.props(i.label),
+									children: u(e)
+								})] }, e)),
+								M.map((e) => /* @__PURE__ */ T("g", { children: [E === "area" && /* @__PURE__ */ w(O, {
+									data: [...e.points],
+									defined: (e) => e.value !== null,
+									x: (e) => Q(e.timestamp),
+									y0: (e) => Y(e.base),
+									y1: (e) => Y((e.value ?? 0) + e.base),
+									yScale: Y,
+									fill: s[e.tone],
+									fillOpacity: k ? .65 : .15
+								}), /* @__PURE__ */ w(ce, {
+									series: e,
+									x: Q,
+									y: Y,
+									inspectedTimestamp: V?.timestamp
+								})] }, e.id)),
+								d.map((e) => /* @__PURE__ */ T("g", { children: [e.kind === "time" ? /* @__PURE__ */ w("line", {
+									x1: Q(e.timestamp),
+									x2: Q(e.timestamp),
+									y1: 12,
+									y2: W,
+									className: "xhq4mlf x1ntoi03 x13efnbd"
+								}) : /* @__PURE__ */ w("circle", {
+									cx: Q(e.timestamp),
+									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),
+									y1: 12,
+									y2: W,
+									className: "xhq4mlf x1ntoi03 x13efnbd"
+								}),
+								/* @__PURE__ */ w("text", {
+									x: X,
+									y: m - 4,
+									..._.props(i.label),
+									children: o(G)
+								}),
+								K !== G && /* @__PURE__ */ w("text", {
+									x: Z,
+									y: m - 4,
+									textAnchor: "end",
+									..._.props(i.label),
+									children: o(K)
+								})
+							]
+						})
+					}),
+					/* @__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", {
+							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",
+								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", {
+											className: "x1ghz6dp xbixft",
+											children: t?.value === null || t === void 0 ? "Unavailable" : u(t.value)
+										})]
+									}, e.id);
+								})
+							}),
+							d.filter((e) => e.timestamp === V.timestamp).map((e) => /* @__PURE__ */ w("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),
+							" · ",
+							e.label,
+							e.kind === "point" && ` · ${u(e.value)}`
+						] }, e.id))
+					})
+				]
+			}), /* @__PURE__ */ w(l, { children: /* @__PURE__ */ T("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",
+						children: [
+							"Time (",
+							r,
+							")"
+						]
+					}), M.map((e) => /* @__PURE__ */ w("th", {
+						scope: "col",
+						className: "x69ldcm x1yc453h xso031l x1q0q8m5 x1qndepd xo1l8bm",
+						children: e.label
+					}, e.id))] }) }),
+					/* @__PURE__ */ w("tbody", { children: N.map((e, t) => /* @__PURE__ */ T("tr", { children: [/* @__PURE__ */ w("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)
+					}, e.id))] }, e.timestamp)) })
+				]
+			}) })]
+		})
+	});
+}
+export { Z as AreaChart, M as BarChart, F as BreakdownBar, X as LineChart, B as MAX_SCATTER_POINTS, U as ScatterPlot, Q as SmallMultiples, Y as Sparkline, J as timeSeriesLimits };