@mechane-ai/ui 0.2.2 → 0.3.0

package/dist/cartesian-Bwt6ZnF5.js

@@ -0,0 +1,847 @@
+import { colors as e } from "./tokens.js";
+import { a as t, c as n, i as r, l as i, n as a, o, r as s, s as c, t as l } from "./chart-input-Bti0gyzz.js";
+import { t as u } from "./plot-width--OgdohB5.js";
+import * as d from "@stylexjs/stylex";
+import { useEffect as f, useId as p, useMemo as m, useRef as h, useState as g } from "react";
+import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
+import { scaleBand as b, scaleLinear as x } from "@visx/scale";
+import { AreaClosed as S, Bar as C, LinePath as w } from "@visx/shape";
+import { Treemap as T, hierarchy as E } from "@visx/hierarchy";
+// packages/charts/src/cartesian/time-series-data.ts
+var D = {
+	series: 12,
+	pointsPerSeries: 2e3,
+	markers: 200,
+	panels: 12
+}, O = .01, k = [
+	"series1",
+	"series2",
+	"series3",
+	"series4",
+	"series5",
+	"series6"
+];
+function A({ series: e, isStacked: t, markers: n }) {
+	let r = e[0]?.points.map((e) => e.timestamp) ?? [];
+	if (e.length > D.series || r.length > D.pointsPerSeries || n.length > D.markers) return `Choose a window with at most ${D.series} series, ${D.pointsPerSeries} observations per series, and ${D.markers} markers.`;
+	if (!a(e) || !a(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 = N({
+			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])), o = Math.max(0, ...i) - Math.min(0, ...i), s = (r.at(-1) ?? 0) - (r[0] ?? 0);
+	if (!Number.isFinite(o) || !Number.isFinite(s)) 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 j({ 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 M(e, t, n = !1) {
+	if (e !== t) return [e, t];
+	let r = Math.max(1, Math.abs(e) * O), i = n ? 0 : e - r, a = t + r;
+	return [Number.isFinite(i) ? i : e, Number.isFinite(a) ? a : t];
+}
+function ee(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 ?? k[a % k.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 N({ 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 te({ series: e, x: t, y: r, inspectedTimestamp: a, pointRadius: o = 3 }) {
+	return /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v(w, {
+		data: [...e.points],
+		defined: (e) => e.value !== null,
+		x: (e) => t(e.timestamp),
+		y: (e) => r((e.value ?? 0) + e.base),
+		stroke: i[e.tone],
+		...d.props(n.mark)
+	}), e.points.filter((t, n) => {
+		if (t.value === null) return !1;
+		let r = e.points[n - 1]?.value === null || e.points[n + 1]?.value === null;
+		return e.points.length === 1 || r || t.timestamp === a;
+	}).map((n) => /* @__PURE__ */ v("circle", {
+		cx: t(n.timestamp),
+		cy: r((n.value ?? 0) + n.base),
+		r: o,
+		fill: i[e.tone]
+	}, n.timestamp))] });
+}
+// packages/charts/src/cartesian/time-series.tsx
+var ne = { plot: {
+	k7Eaqz: "xeuugli",
+	kInvED: "x1hl8ikr",
+	kZs9gx: "x1m2ab5f",
+	k7shQP: "x9v5kkp",
+	kPJHz1: "xnktsf1",
+	$$css: !0
+} };
+function re(e) {
+	return /* @__PURE__ */ v(I, {
+		...e,
+		kind: "line",
+		stacked: !1
+	});
+}
+function P({ stacked: e = !1, ...t }) {
+	return /* @__PURE__ */ v(I, {
+		...t,
+		kind: "area",
+		stacked: e
+	});
+}
+function F({ charts: e, ...t }) {
+	let n = h(null), [r, i] = g(), s = JSON.stringify(e.map((e) => [
+		e.id,
+		e.title,
+		j({
+			series: e.series,
+			markers: e.markers ?? [],
+			timestampUnit: t.timestampUnit,
+			isStacked: !1
+		})
+	])), c = JSON.stringify(e[0]?.series[0]?.points.map((e) => e.timestamp) ?? []), u = e.every((e) => JSON.stringify(e.series[0]?.points.map((e) => e.timestamp) ?? []) === c);
+	if (r !== void 0 && r.signature !== s && i(void 0), f(() => {
+		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);
+	}, []), !u || !a(e)) return /* @__PURE__ */ v(l, {
+		title: "Small multiples",
+		message: "Charts need unique identifiers and aligned observation timestamps."
+	});
+	if (e.length > D.panels) return /* @__PURE__ */ v(l, {
+		title: "Small multiples",
+		message: `Choose at most ${D.panels} panels.`
+	});
+	if (e.length === 0) return /* @__PURE__ */ v(o, {
+		title: "Small multiples",
+		children: /* @__PURE__ */ v("p", {
+			className: "xv9cywu",
+			children: "No charts"
+		})
+	});
+	let d = {
+		value: r?.signature === s ? r : void 0,
+		onChange: (e) => i(e === void 0 ? void 0 : {
+			...e,
+			signature: s
+		})
+	}, p = 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__ */ v("div", {
+		ref: n,
+		className: "xrvj5dj x179h1ev",
+		children: e.map((e) => /* @__PURE__ */ v(I, {
+			...t,
+			title: e.title,
+			description: e.description,
+			series: e.series,
+			formatValue: e.formatValue,
+			markers: e.markers,
+			kind: "line",
+			stacked: !1,
+			sharedInspection: d,
+			axisWidth: p
+		}, e.id))
+	});
+}
+function I({ title: t, description: a, series: s, timestampUnit: b, formatTimestamp: C, formatValue: w, markers: T = [], height: E = 180, actions: D, kind: O, stacked: k, sharedInspection: N, axisWidth: re }) {
+	let P = !Number.isFinite(E) || E < 48 ? "Chart height must be at least 48 pixels." : A({
+		series: s,
+		isStacked: k,
+		markers: T
+	}), F = m(() => P === void 0 ? ee(s, k) : [], [
+		s,
+		k,
+		P
+	]), I = F[0]?.points ?? [], { ref: ie, width: L, element: R } = u(), z = h(null), [B, V] = g(), H = j({
+		series: s,
+		markers: T,
+		timestampUnit: b,
+		isStacked: k
+	}), U = N === void 0 ? B?.signature === H ? B : void 0 : N.value, W = p();
+	B !== void 0 && (B.signature !== H || P !== void 0) && V(void 0);
+	let G = N !== void 0;
+	if (f(() => {
+		if (G) return;
+		function e(e) {
+			e.target instanceof Node && z.current?.contains(e.target) !== !0 && V(void 0);
+		}
+		return document.addEventListener("pointerdown", e), () => document.removeEventListener("pointerdown", e);
+	}, [G]), P !== void 0) return /* @__PURE__ */ v(l, {
+		title: t,
+		description: a,
+		message: P
+	});
+	if (I.length === 0) return /* @__PURE__ */ v(o, {
+		title: t,
+		description: a,
+		actions: D,
+		children: /* @__PURE__ */ v("p", {
+			className: "xv9cywu",
+			children: "No observations"
+		})
+	});
+	let K = E - 28, q = I[0]?.timestamp ?? 0, J = I.at(-1)?.timestamp ?? q, Y = F.flatMap((e) => e.points.flatMap((e) => e.value === null ? [] : [e.value + e.base])), ae = O === "area" ? Math.min(0, ...Y) : Math.min(...Y), oe = O === "area" ? Math.max(0, ...Y) : Math.max(...Y), se = Y.length === 0 ? 0 : ae, ce = Y.length === 0 ? 1 : oe, X = x({
+		domain: [...M(se, ce, O === "area")],
+		range: [K, 12]
+	}), le = X.ticks(3), Z = re ?? Math.max(52, ...le.map((e) => w(e).length * 7 + 12)), Q = Math.max(Z + 1, L - 16), $ = x({
+		domain: [...M(q, J)],
+		range: [Z, Q]
+	});
+	function ue(e) {
+		let t = R?.getBoundingClientRect();
+		if (t === void 0) return;
+		let n = $.invert(e - t.left), r = I.find((e, t) => {
+			let r = I[t + 1];
+			return r === void 0 || n <= e.timestamp + (r.timestamp - e.timestamp) / 2;
+		});
+		r !== void 0 && de({
+			signature: H,
+			timestamp: r.timestamp,
+			source: "pointer"
+		});
+	}
+	function de(e) {
+		N === void 0 ? V(e) : N.onChange(e);
+	}
+	function fe(e) {
+		let t = I.findIndex((e) => e.timestamp === U?.timestamp), n = {
+			ArrowRight: Math.min(I.length - 1, t + 1),
+			ArrowLeft: Math.max(0, t - 1),
+			Home: 0,
+			End: I.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 = I[n[e.key]];
+				t !== void 0 && de({
+					signature: H,
+					timestamp: t.timestamp,
+					source: "keyboard"
+				});
+				break;
+			}
+		}
+	}
+	return /* @__PURE__ */ v("div", {
+		ref: z,
+		className: "xeuugli",
+		children: /* @__PURE__ */ y(o, {
+			title: t,
+			description: a,
+			actions: D,
+			children: [/* @__PURE__ */ y("div", {
+				className: "xrvj5dj xtmze7h",
+				children: [
+					/* @__PURE__ */ v(c, { items: F.map(({ id: e, label: t, tone: n }) => ({
+						id: e,
+						label: t,
+						tone: n
+					})) }),
+					/* @__PURE__ */ v("div", {
+						ref: ie,
+						...d.props(n.plot),
+						children: /* @__PURE__ */ y("svg", {
+							role: "img",
+							"aria-label": `${t}. Use arrow keys to inspect observations.`,
+							"aria-describedby": W,
+							tabIndex: 0,
+							viewBox: `0 0 ${L} ${E}`,
+							height: E,
+							onKeyDown: fe,
+							onPointerMove: (e) => {
+								e.pointerType === "mouse" && ue(e.clientX);
+							},
+							onPointerDown: (e) => ue(e.clientX),
+							...d.props(n.svg, ne.plot),
+							children: [
+								le.map((e) => /* @__PURE__ */ y("g", { children: [/* @__PURE__ */ v("line", {
+									x1: Z,
+									x2: Q,
+									y1: X(e),
+									y2: X(e),
+									...d.props(n.grid)
+								}), /* @__PURE__ */ v("text", {
+									x: Z - 8,
+									y: X(e),
+									textAnchor: "end",
+									dominantBaseline: "middle",
+									...d.props(n.label),
+									children: w(e)
+								})] }, e)),
+								F.map((e) => /* @__PURE__ */ y("g", { children: [O === "area" && /* @__PURE__ */ v(S, {
+									data: [...e.points],
+									defined: (e) => e.value !== null,
+									x: (e) => $(e.timestamp),
+									y0: (e) => X(e.base),
+									y1: (e) => X((e.value ?? 0) + e.base),
+									yScale: X,
+									fill: i[e.tone],
+									fillOpacity: k ? .65 : .15
+								}), /* @__PURE__ */ v(te, {
+									series: e,
+									x: $,
+									y: X,
+									inspectedTimestamp: U?.timestamp
+								})] }, e.id)),
+								T.map((t) => /* @__PURE__ */ y("g", { children: [t.kind === "time" ? /* @__PURE__ */ v("line", {
+									x1: $(t.timestamp),
+									x2: $(t.timestamp),
+									y1: 12,
+									y2: K,
+									className: "x1ce36ez x1ntoi03 x13efnbd"
+								}) : /* @__PURE__ */ v("circle", {
+									cx: $(t.timestamp),
+									cy: X(t.value + (F.find((e) => e.id === t.seriesId)?.points.find((e) => e.timestamp === t.timestamp)?.base ?? 0)),
+									r: 4,
+									fill: e.surface,
+									...d.props(n.selected)
+								}), /* @__PURE__ */ v("title", { children: t.kind === "point" ? `${t.label}: ${w(t.value)}` : t.label })] }, t.id)),
+								U !== void 0 && /* @__PURE__ */ v("line", {
+									x1: $(U.timestamp),
+									x2: $(U.timestamp),
+									y1: 12,
+									y2: K,
+									className: "x1ce36ez x1ntoi03 x13efnbd"
+								}),
+								/* @__PURE__ */ v("text", {
+									x: Z,
+									y: E - 4,
+									...d.props(n.label),
+									children: C(q)
+								}),
+								J !== q && /* @__PURE__ */ v("text", {
+									x: Q,
+									y: E - 4,
+									textAnchor: "end",
+									...d.props(n.label),
+									children: C(J)
+								})
+							]
+						})
+					}),
+					/* @__PURE__ */ v("div", {
+						id: W,
+						"aria-live": U?.source === "keyboard" ? "polite" : "off",
+						className: "xrvj5dj xzwl0l2 x15kvu8p xmkeg23 x1y0btm7 x1yww3zy x1m7rfvg xut3y95 x21xpn4",
+						children: U === void 0 ? /* @__PURE__ */ v("span", {
+							className: "xv9cywu",
+							children: "Point, tap, or use the arrow keys to inspect values."
+						}) : /* @__PURE__ */ y(_, { children: [
+							/* @__PURE__ */ v("span", { children: C(U.timestamp) }),
+							/* @__PURE__ */ v("dl", {
+								className: "x78zum5 x1a02dak xtmze7h x1ghz6dp",
+								children: F.map((e) => {
+									let t = e.points.find((e) => e.timestamp === U.timestamp);
+									return /* @__PURE__ */ y("div", {
+										className: "x78zum5 xzwl0l2 x1ghz6dp xss6m8b",
+										children: [/* @__PURE__ */ v("dt", { children: e.label }), /* @__PURE__ */ v("dd", {
+											className: "x1ghz6dp xgl13c",
+											children: t?.value === null || t === void 0 ? "Unavailable" : w(t.value)
+										})]
+									}, e.id);
+								})
+							}),
+							T.filter((e) => e.timestamp === U.timestamp).map((e) => /* @__PURE__ */ v("span", { children: e.label }, e.id))
+						] })
+					}),
+					T.length > 0 && /* @__PURE__ */ v("ul", {
+						className: "x78zum5 x1a02dak xtmze7h x1ghz6dp x1717udv xe8uvvx xut3y95 xv9cywu",
+						children: T.map((e) => /* @__PURE__ */ y("li", { children: [
+							C(e.timestamp),
+							" · ",
+							e.label,
+							e.kind === "point" && ` · ${w(e.value)}`
+						] }, e.id))
+					})
+				]
+			}), /* @__PURE__ */ v(r, { children: /* @__PURE__ */ y("table", {
+				className: "xh8yej3 x1mwwwfo xut3y95 x1yc453h xss6m8b",
+				children: [
+					/* @__PURE__ */ y("caption", { children: [t, " observations"] }),
+					/* @__PURE__ */ v("thead", { children: /* @__PURE__ */ y("tr", { children: [/* @__PURE__ */ y("th", {
+						className: "x15kvu8p x1yc453h xso031l x1q0q8m5 x7a6td9 xo1l8bm",
+						children: [
+							"Time (",
+							b,
+							")"
+						]
+					}), F.map((e) => /* @__PURE__ */ v("th", {
+						scope: "col",
+						className: "x15kvu8p x1yc453h xso031l x1q0q8m5 x7a6td9 xo1l8bm",
+						children: e.label
+					}, e.id))] }) }),
+					/* @__PURE__ */ v("tbody", { children: I.map((e, t) => /* @__PURE__ */ y("tr", { children: [/* @__PURE__ */ v("th", {
+						scope: "row",
+						className: "x15kvu8p x1yc453h xso031l x1q0q8m5 x7a6td9 xo1l8bm",
+						children: C(e.timestamp)
+					}), F.map((e) => /* @__PURE__ */ v("td", {
+						className: "x15kvu8p x1yc453h xso031l x1q0q8m5 x7a6td9 xo1l8bm",
+						children: e.points[t]?.value === null || e.points[t]?.value === void 0 ? "Unavailable" : w(e.points[t].value)
+					}, e.id))] }, e.timestamp)) })
+				]
+			}) })]
+		})
+	});
+}
+// packages/charts/src/cartesian/sparkline.tsx
+function ie({ title: e, summary: t, unit: n, timestampUnit: r, series: i, valueDomain: a }) {
+	let o = p(), s = p(), c = L({
+		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__ */ v("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 xv9cywu xoedhln xut3y95",
+		children: c === void 0 ? "No data" : "Invalid trend"
+	});
+	let u = i.points[0]?.timestamp ?? 0, d = i.points.at(-1)?.timestamp ?? u, f = x({
+		domain: [...M(u, d)],
+		range: [3, 125]
+	}), m = x({
+		domain: [...a],
+		range: [29, 3]
+	}), h = ee([i], !1)[0];
+	return /* @__PURE__ */ y("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__ */ v("title", {
+				id: o,
+				children: e
+			}),
+			/* @__PURE__ */ y("desc", {
+				id: s,
+				children: [
+					t,
+					" Values in ",
+					n,
+					"; timestamps in ",
+					r,
+					". Displayed value domain: ",
+					a[0],
+					" to",
+					" ",
+					a[1],
+					" ",
+					n,
+					"."
+				]
+			}),
+			h !== void 0 && /* @__PURE__ */ v(te, {
+				series: h,
+				x: f,
+				y: m,
+				pointRadius: 2
+			})
+		]
+	});
+}
+function L({ 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 (!s(i)) return "The displayed value domain must have finite, increasing bounds.";
+	let a = A({
+		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/categorical.tsx
+var R = {
+	items: 200,
+	series: 12
+}, z = [
+	"series1",
+	"series2",
+	"series3",
+	"series4",
+	"series5",
+	"series6"
+], B = {
+	kzqmXN: "x5lhr3w",
+	kZKoxP: "x5yr21d",
+	$$css: !0
+}, V = {
+	kzqmXN: "x1xc55vz",
+	kZKoxP: "xdk7pt",
+	kmuXW: "x2lah0s",
+	$$css: !0
+}, H = {
+	segment: (e, t) => [
+		B,
+		{
+			kWkggS: t == null ? t : "xl8spv7",
+			$$css: !0
+		},
+		{
+			"--x-width": ((e) => typeof e == "number" ? e + "px" : e ?? void 0)(`${e}%`),
+			"--x-backgroundColor": t ?? void 0
+		}
+	],
+	swatch: (e) => [
+		V,
+		{
+			kWkggS: e == null ? e : "xl8spv7",
+			$$css: !0
+		},
+		{ "--x-backgroundColor": e ?? void 0 }
+	],
+	plot: {
+		kqGvvJ: "xedx3ju",
+		$$css: !0
+	},
+	treeRect: {
+		kjVXCG: "x7x9j5w",
+		kfJifR: "xnpr05h",
+		$$css: !0
+	}
+};
+function U(e, t) {
+	return e ?? z[t % z.length] ?? "series1";
+}
+function W(e) {
+	if (e.length > R.items) return `Choose a window with at most ${R.items} items.`;
+	if (!a(e)) return "Every breakdown item needs a unique identifier.";
+	if (e.some((e) => e.value !== null && (!Number.isFinite(e.value) || e.value < 0))) return "Breakdown values must be finite and nonnegative, or explicitly missing.";
+	if (!Number.isFinite(e.reduce((e, t) => e + (t.value ?? 0), 0))) return "The sum of recorded values must be finite.";
+}
+function G({ items: e, selection: n }) {
+	return /* @__PURE__ */ v("ul", {
+		className: "xrvj5dj x1ghz6dp x1717udv xe8uvvx",
+		children: e.map((e) => /* @__PURE__ */ v("li", { children: /* @__PURE__ */ y(t, {
+			label: `${e.label}: ${e.valueLabel}`,
+			selected: n?.selectedId === e.id,
+			onSelect: n === void 0 ? void 0 : () => n.onSelect(e.id),
+			children: [/* @__PURE__ */ y("span", {
+				className: "x78zum5 x6s0dn4 xf0fr40 xeuugli",
+				children: [/* @__PURE__ */ v("span", {
+					"aria-hidden": !0,
+					...d.props(H.swatch(i[e.tone]))
+				}), e.label]
+			}), /* @__PURE__ */ v("span", {
+				className: "xv9cywu xp4054r",
+				children: e.valueLabel
+			})]
+		}) }, e.id))
+	});
+}
+function K({ title: e, description: t, items: n, total: r, formatValue: a, selection: s }) {
+	let c = W(n), u = n.reduce((e, t) => e + (t.value ?? 0), 0), f = 2 ** -52 * Math.max(u, r, 1) * n.length;
+	return c === void 0 ? !Number.isFinite(r) || r < 0 || u - r > f ? /* @__PURE__ */ v(l, {
+		title: e,
+		description: t,
+		message: "The total must be finite and at least the sum of recorded values."
+	}) : /* @__PURE__ */ v(o, {
+		title: e,
+		description: t,
+		children: n.length === 0 ? /* @__PURE__ */ v("p", {
+			className: "xv9cywu x1ghz6dp xut3y95",
+			children: "No values"
+		}) : /* @__PURE__ */ y(_, { children: [
+			/* @__PURE__ */ v("div", {
+				"aria-hidden": !0,
+				className: "x78zum5 x170jfvy xb3r6kr x1m7rfvg xmkeg23 x1y0btm7 x1yww3zy xegg4c4",
+				children: n.map((e, t) => e.value === null ? null : /* @__PURE__ */ v("span", { ...d.props(H.segment(r === 0 ? 0 : e.value / r * 100, i[U(e.tone, t)])) }, e.id))
+			}),
+			/* @__PURE__ */ v(G, {
+				items: n.map((e, t) => ({
+					id: e.id,
+					label: e.label,
+					valueLabel: e.value === null ? "Unavailable" : a(e.value),
+					tone: U(e.tone, t)
+				})),
+				selection: s
+			}),
+			r - u > f && /* @__PURE__ */ y("p", {
+				className: "xv9cywu x1ghz6dp xut3y95",
+				children: [
+					"Unassigned portion: ",
+					a(r - u),
+					" of ",
+					a(r)
+				]
+			})
+		] })
+	}) : /* @__PURE__ */ v(l, {
+		title: e,
+		description: t,
+		message: c
+	});
+}
+function q({ title: e, description: t, items: r, formatValue: a, selection: s, height: c = 180 }) {
+	let f = W(r), p = r.reduce((e, t) => e + (t.value ?? 0), 0), { ref: m, width: h } = u();
+	if (f !== void 0 || !Number.isFinite(c) || c < 48) return /* @__PURE__ */ v(l, {
+		title: e,
+		description: t,
+		message: f ?? "Chart height must be at least 48 pixels."
+	});
+	let g = r.flatMap((e, t) => e.value === null || e.value === 0 ? [] : [{
+		id: e.id,
+		label: e.label,
+		value: e.value,
+		tone: U(e.tone, t)
+	}]), _ = E({
+		id: "root",
+		label: e,
+		value: 0,
+		tone: "neutral",
+		children: g
+	}, (e) => e.children === void 0 ? void 0 : [...e.children]).sum((e) => e.value);
+	return /* @__PURE__ */ y(o, {
+		title: e,
+		description: t,
+		children: [
+			/* @__PURE__ */ v("div", {
+				ref: m,
+				...d.props(n.plot),
+				children: p === 0 ? /* @__PURE__ */ v("p", {
+					className: "xv9cywu x1ghz6dp xut3y95",
+					children: "No positive values to size the areas"
+				}) : /* @__PURE__ */ v("svg", {
+					role: "img",
+					"aria-label": `${e}. Areas compare recorded values.`,
+					viewBox: `0 0 ${h} ${c}`,
+					height: c,
+					...d.props(n.svg),
+					children: /* @__PURE__ */ v(T, {
+						root: _,
+						size: [h, c],
+						paddingInner: 2,
+						children: (e) => e.leaves().map((e) => {
+							let t = e.x1 - e.x0 > 96 && e.y1 - e.y0 > 40;
+							return /* @__PURE__ */ y("g", { children: [
+								/* @__PURE__ */ v("rect", {
+									x: e.x0,
+									y: e.y0,
+									width: e.x1 - e.x0,
+									height: e.y1 - e.y0,
+									fill: i[e.data.tone],
+									fillOpacity: .18,
+									...d.props(H.treeRect, s?.selectedId === e.data.id && n.selected)
+								}),
+								/* @__PURE__ */ y("title", { children: [
+									e.data.label,
+									": ",
+									a(e.data.value)
+								] }),
+								t && /* @__PURE__ */ y("svg", {
+									x: e.x0,
+									y: e.y0,
+									width: e.x1 - e.x0,
+									height: e.y1 - e.y0,
+									overflow: "hidden",
+									children: [/* @__PURE__ */ v("text", {
+										x: 8,
+										y: 18,
+										className: "x49x0gd xoedhln xut3y95",
+										children: e.data.label.slice(0, Math.floor((e.x1 - e.x0 - 16) / 7))
+									}), a(e.data.value).length * 12 < e.x1 - e.x0 - 16 && /* @__PURE__ */ v("text", {
+										x: 8,
+										y: 34,
+										className: "x49x0gd xoedhln xut3y95",
+										children: a(e.data.value)
+									})]
+								})
+							] }, e.data.id);
+						})
+					})
+				})
+			}),
+			/* @__PURE__ */ v(G, {
+				items: r.map((e, t) => ({
+					id: e.id,
+					label: e.label,
+					valueLabel: e.value === null ? "Unavailable" : a(e.value),
+					tone: U(e.tone, t)
+				})),
+				selection: s
+			}),
+			r.some((e) => e.value === null) && /* @__PURE__ */ v("p", {
+				className: "xv9cywu x1ghz6dp xut3y95",
+				children: "Unavailable values have no area."
+			})
+		]
+	});
+}
+function J({ categories: e, series: t, domain: n, mode: r }) {
+	if (e.length > R.items || t.length > R.series) return `Choose a window with at most ${R.items} categories and ${R.series} series.`;
+	if (!s(n) || n[0] > 0 || n[1] < 0) return "The bar domain must be finite, increasing, and include zero.";
+	if (!a(e) || !a(t)) return "Bar categories and series require unique identifiers.";
+	for (let i of t) {
+		if (i.values.length !== e.length) return "Every series requires one explicit value per category.";
+		for (let e of i.values) {
+			if (e !== null && (!Number.isFinite(e) || e < n[0] || e > n[1])) return "Bar values must be finite and within the supplied domain.";
+			if (r === "stacked" && (e === null || e < 0)) return "Stacked bars require present nonnegative values.";
+		}
+	}
+	if (r === "stacked" && e.some((e, r) => t.reduce((e, t) => e + (t.values[r] ?? 0), 0) > n[1])) return "Stacked bar totals must fit the supplied domain.";
+}
+function Y({ title: e, description: t, categories: r, series: a, domain: s, mode: f = "grouped", formatValue: p, selection: m, height: h = 200 }) {
+	let g = J({
+		categories: r,
+		series: a,
+		domain: s,
+		mode: f
+	}), { ref: _, width: S } = u();
+	if (g !== void 0 || !Number.isFinite(h) || h < 48) return /* @__PURE__ */ v(l, {
+		title: e,
+		description: t,
+		message: g ?? "Chart height must be at least 48 pixels."
+	});
+	let w = h - 28, T = x({
+		domain: [...s],
+		range: [w, 12]
+	}), E = Math.max(52, ...T.ticks(3).map((e) => p(e).length * 7 + 12)), D = Math.max(E + 1, S - 16), O = b({
+		domain: r.map((e) => e.id),
+		range: [E, D],
+		padding: .3
+	}), k = b({
+		domain: a.map((e) => e.id),
+		range: [0, O.bandwidth()],
+		padding: .08
+	}), A = Math.max(1, Math.ceil(56 / O.step())), j = Math.max(1, Math.floor(O.step() * A / 12) - 1), M = a.map((e, t) => ({
+		id: e.id,
+		label: e.label,
+		tone: U(e.tone, t)
+	}));
+	return /* @__PURE__ */ y(o, {
+		title: e,
+		description: t,
+		children: [
+			/* @__PURE__ */ v(c, { items: M }),
+			/* @__PURE__ */ v("div", {
+				ref: _,
+				...d.props(n.plot, H.plot),
+				children: r.length === 0 || a.length === 0 ? /* @__PURE__ */ v("p", {
+					className: "xv9cywu x1ghz6dp xut3y95",
+					children: "No categories"
+				}) : /* @__PURE__ */ y("svg", {
+					role: "img",
+					"aria-label": e,
+					viewBox: `0 0 ${S} ${h}`,
+					height: h,
+					...d.props(n.svg),
+					children: [T.ticks(3).map((e) => /* @__PURE__ */ y("g", { children: [/* @__PURE__ */ v("line", {
+						x1: E,
+						x2: D,
+						y1: T(e),
+						y2: T(e),
+						...d.props(n.grid)
+					}), /* @__PURE__ */ v("text", {
+						x: E - 8,
+						y: T(e),
+						textAnchor: "end",
+						dominantBaseline: "middle",
+						...d.props(n.label),
+						children: p(e)
+					})] }, e)), r.map((e, t) => /* @__PURE__ */ y("g", { children: [a.map((r, o) => {
+						let s = r.values[t];
+						if (s == null) return null;
+						let c = f === "stacked" ? a.slice(0, o).reduce((e, n) => e + (n.values[t] ?? 0), 0) : 0, l = T(c), u = T(c + s);
+						return /* @__PURE__ */ v(C, {
+							x: (O(e.id) ?? E) + (f === "stacked" ? 0 : k(r.id) ?? 0),
+							y: Math.min(l, u),
+							width: f === "stacked" ? O.bandwidth() : k.bandwidth(),
+							height: Math.max(+(s === 0), Math.abs(u - l)),
+							fill: i[U(r.tone, o)],
+							...d.props(m?.selectedId === e.id && n.selected),
+							children: /* @__PURE__ */ y("title", { children: [
+								e.label,
+								" · ",
+								r.label,
+								": ",
+								p(s)
+							] })
+						}, r.id);
+					}), t % A === 0 && /* @__PURE__ */ v("text", {
+						x: (O(e.id) ?? E) + O.bandwidth() / 2,
+						y: h - 4,
+						textAnchor: "middle",
+						...d.props(n.label),
+						children: e.label.length > j ? `${e.label.slice(0, j)}…` : e.label
+					})] }, e.id))]
+				})
+			}),
+			/* @__PURE__ */ v(G, {
+				items: r.map((e, t) => ({
+					id: e.id,
+					label: e.label,
+					valueLabel: a.map((e) => `${e.label}: ${e.values[t] === null || e.values[t] === void 0 ? "Unavailable" : p(e.values[t])}`).join(" · "),
+					tone: "neutral"
+				})),
+				selection: m
+			})
+		]
+	});
+}
+export { P as a, D as c, ie as i, K as n, re as o, q as r, F as s, Y as t };