@howells/hairline 0.0.0-stage → 0.2.0

package/lib/charts/basics/dot-heat.js

@@ -0,0 +1,174 @@
+"use client";
+import { useHover as e } from "../hooks.js";
+import { Plot as t, Tooltip as n } from "../core.js";
+import { noteOf as r, stagger as i } from "../util.js";
+import { DimGroup as a, HitRect as o } from "../hover.js";
+import { RING_STEP as s } from "../marks.js";
+import { FootNote as c } from "../plot-note.js";
+import { ChartSvg as l } from "../svg.js";
+import { Label as u } from "../text.js";
+import { inkWidth as d } from "./util-b.js";
+import { DotRing as f } from "../texture.js";
+import { dotHeatDemo as p } from "./dot-heat.data.js";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
+//#region src/charts/basics/dot-heat.tsx
+var g = 2.5, _ = .75, v = 4, y = (e, t, n, r) => {
+	let i = e.radius(t[n]?.[r] ?? 0), a = i + v;
+	for (let i of [
+		-1,
+		0,
+		1
+	]) for (let o of [
+		-1,
+		0,
+		1
+	]) {
+		let s = t[n + i]?.[r + o];
+		if ((i !== 0 || o !== 0) && s !== void 0 && s > 0) {
+			let t = Math.hypot(i * e.rowH, o * e.colW);
+			a = Math.min(a, t - e.radius(s) - g - _);
+		}
+	}
+	return Math.max(i + g + _, a);
+}, b = (e, t) => t.hi > t.lo ? (e - t.lo) / (t.hi - t.lo) : 1, x = (e, t, n) => {
+	if (n) return "fill-hero";
+	if (e <= 0) return "fill-l5";
+	let r = b(e, t);
+	return r >= 2 / 3 ? "fill-l2" : r >= 1 / 3 ? "fill-l3" : "fill-l4";
+}, S = 14, C = 2, w = (e, t, n) => e <= 0 ? 1 : Math.sqrt(C ** 2 + b(e, t) * (n ** 2 - C ** 2)), T = (e) => Math.min(e * .44, (e - g * 2 - _ * 2) / 2), E = (e, t, n, r, i, a) => {
+	let o = i ? 62 : 34, s = n.columns.length, c = n.values.map((e) => e[s - 1] ?? 0), l = d(n.columns[s - 1] ?? "") / 2, u = (t) => {
+		let i = S + Math.max(...n.rows.map((e) => d(t ? e.slice(0, 2) : e))), o = (e) => Math.max(w(Math.max(...c), r, T(e)), (s - 1) % (t ? a * 2 : a) == 0 ? l : 0), u = (e - i - 4) / s;
+		for (let t = 0; t < 4; t += 1) u = (e - i - 4 - o(u)) / (s - .5);
+		return {
+			colRoom: u,
+			labelW: i,
+			reach: o
+		};
+	}, f = !1, p = u(!1);
+	Math.min(p.colRoom, 58) < 34 && (f = !0, p = u(!0));
+	let { colRoom: m, labelW: h } = p, g = Math.min((t - 40 - o) / n.rows.length, m * 1.15), _ = g * n.rows.length, v = Math.min(m, g * 1.05, 58), y = (e - h - (s - .5) * v - p.reach(v)) / 2 + h, b = Math.min(v, g), x = T(b);
+	return {
+		cell: b,
+		colW: v,
+		cx: (e) => y + (e + .5) * v,
+		cy: (e) => 40 + (e + .5) * g,
+		gridBottom: 40 + _,
+		height: Math.round(40 + _ + o),
+		narrow: f,
+		radius: (e) => w(e, r, x),
+		rowH: g,
+		top: 40,
+		x0: y
+	};
+}, D = (e) => {
+	let [t] = e;
+	for (let n of e) (t === void 0 || n.v > t.v) && (t = n);
+	return t === void 0 ? [0, 0] : [t.r, t.c];
+}, O = (e) => {
+	let { grid: t } = e, n = t.narrow ? e.every * 2 : e.every;
+	return /* @__PURE__ */ h("g", { children: [e.data.rows.map((e, n) => /* @__PURE__ */ m(u, {
+		anchor: "end",
+		middle: !0,
+		muted: !0,
+		voice: "label",
+		x: t.x0 - S,
+		y: t.cy(n),
+		children: t.narrow ? e.slice(0, 2) : e
+	}, e)), e.data.columns.map((e, r) => r % n === 0 ? /* @__PURE__ */ m(u, {
+		anchor: "middle",
+		voice: "axis",
+		x: t.cx(r),
+		y: t.gridBottom + 18,
+		children: e
+	}, e) : null)] });
+}, k = (e) => {
+	let { grid: t } = e;
+	return /* @__PURE__ */ m("g", { children: e.cells.map((n, r) => /* @__PURE__ */ h(a, {
+		dim: e.dim(r),
+		onPointerEnter: () => {
+			e.onHover(r, t.cx(n.c), t.top - 2);
+		},
+		children: [/* @__PURE__ */ m("circle", {
+			className: `pop ${x(n.v, e.span, n.id === e.hero)}`,
+			cx: t.cx(n.c),
+			cy: t.cy(n.r),
+			r: t.radius(n.v),
+			style: i(n.r + n.c, "mark")
+		}), /* @__PURE__ */ m(o, {
+			height: t.rowH,
+			width: t.colW,
+			x: t.cx(n.c) - t.colW / 2,
+			y: t.cy(n.r) - t.rowH / 2
+		})]
+	}, n.id)) });
+}, A = (i) => {
+	let a = i.data ?? p, o = i.height ?? 460, u = i.format ?? String, d = e(), g = a.values.flatMap((e, t) => e.map((e, n) => ({
+		c: n,
+		id: `${a.rows[t]}-${a.columns[n]}`,
+		r: t,
+		v: e
+	}))), _ = g.flatMap((e) => e.v > 0 ? [e.v] : []), v = _.length === 0 ? {
+		hi: 1,
+		lo: 1
+	} : {
+		hi: Math.max(..._),
+		lo: Math.min(..._)
+	}, [b, x] = i.highlight ?? D(g), S = a.values[b]?.[x] ?? 0, C = `${a.rows[b]}-${a.columns[x]}`, w = `Values by ${a.rows.length} rows by ${a.columns.length} columns; peak ${u(S)} at ${a.rows[b]} ${a.columns[x]}`;
+	return /* @__PURE__ */ m(t, {
+		overlay: d.at === null ? null : /* @__PURE__ */ h(n, {
+			x: d.at.x,
+			y: d.at.y,
+			children: [
+				/* @__PURE__ */ h("b", { children: [
+					a.rows[g[d.at.key].r],
+					" ",
+					a.columns[g[d.at.key].c]
+				] }),
+				" ",
+				"· ",
+				u(g[d.at.key].v)
+			]
+		}),
+		children: (e) => {
+			let t = E(e, o, a, v, r(i) !== void 0, i.labelEvery ?? 2);
+			return /* @__PURE__ */ h(l, {
+				height: t.height,
+				label: w,
+				leave: d.clear,
+				width: e,
+				children: [
+					/* @__PURE__ */ m(O, {
+						data: a,
+						every: i.labelEvery ?? 2,
+						grid: t
+					}),
+					/* @__PURE__ */ m(k, {
+						cells: g,
+						grid: t,
+						dim: d.dim,
+						hero: C,
+						span: v,
+						onHover: (e, t, n) => {
+							d.show(e, t, n);
+						}
+					}),
+					/* @__PURE__ */ m(f, {
+						className: "fade pointer-events-none",
+						tone: "fill-l2",
+						cx: t.cx(x),
+						cy: t.cy(b),
+						r: y(t, a.values, b, x),
+						step: s.mark
+					}),
+					/* @__PURE__ */ m(c, {
+						height: t.height,
+						text: r(i),
+						width: e
+					})
+				]
+			});
+		}
+	});
+};
+//#endregion
+export { A as DotHeat };

package/lib/charts/basics/dumbbell-queue.js

@@ -0,0 +1,203 @@
+"use client";
+import { plural as e } from "../../lib/format.js";
+import { resolveFormat as t } from "../../schema/format.js";
+import { keyOf as n } from "../../schema/key.js";
+import { useHover as r } from "../hooks.js";
+import { Plot as i, Tooltip as a } from "../core.js";
+import { countingUnit as o, noteOf as s, stagger as c } from "../util.js";
+import { DimGroup as l, HitRect as u, TipText as d } from "../hover.js";
+import { DOT as f } from "../marks.js";
+import { Dot as p, Ring as m } from "../markers.js";
+import { FootNote as h } from "../plot-note.js";
+import { HRule as g } from "../rules.js";
+import { chartTable as _, plotOptions as v, scoped as y } from "../shared-options.js";
+import { ChartSvg as b } from "../svg.js";
+import { Label as x } from "../text.js";
+import { inkWidth as S, maxIndex as C } from "./util-b.js";
+import { scaleLinear as w } from "d3-scale";
+import { jsx as T, jsxs as E } from "react/jsx-runtime";
+//#region src/charts/basics/dumbbell-queue.tsx
+var D = 2, O = (e, t, n, r) => {
+	let i = e.after <= e.before ? t(e.before) : t(e.after);
+	return n + 2 + S(i, r);
+}, k = (e, t, n, r, i, a) => {
+	let o = Math.max(0, ...n.map((e) => S(e.label, a))), s = D + Math.min(e * .32, Math.ceil(o)), c = r ? 74 : 44, l = n.flatMap((e) => [e.before, e.after]), u = Math.min(0, ...l) * 1.04, d = Math.max(0, ...l) * 1.04, p = d > u ? d - u : 1, m = e < 420 ? "md" : "lg", h = f[m], g = s + 12, _ = Math.min(e - D, ...n.map((t) => {
+		let n = (Math.max(t.before, t.after) - u) / p;
+		return n > 0 ? g + (e - D - O(t, i, h, a) - g) / n : Infinity;
+	})), v = Math.max(g, _);
+	return {
+		dotR: h,
+		dotSize: m,
+		labelW: s,
+		pitch: (t - 36 - c) / Math.max(1, n.length - 1),
+		top: 36,
+		x: w().domain([u, u + p]).range([g, v])
+	};
+}, A = 8, j = (e) => {
+	let { datum: t, layout: n } = e, r = n.x(t.after), i = n.x(t.before), a = Math.sign(r - i), o = i + a * (n.dotR + 3), s = r - a * (n.dotR + 3), l = Math.round(Math.abs(t.before - t.after) / e.unit), u = e.alert === "rise" ? t.after > t.before : t.after < t.before, d = Array.from({ length: l }, (e, n) => ({
+		id: `${t.label}-rung-${n}`,
+		k: n,
+		x: Math.round(o + (n + .5) / l * (s - o)) - 1
+	}));
+	return /* @__PURE__ */ T("g", {
+		className: u ? "fill-alert" : "fill-l4",
+		children: d.map((t) => /* @__PURE__ */ T("rect", {
+			className: !u && (t.k + 1) % 5 == 0 ? "grow-y fill-l2" : "grow-y",
+			height: A,
+			style: c(e.index * 3 + t.k * .6, "mark"),
+			width: 2,
+			x: t.x,
+			y: e.y - A / 2
+		}, t.id))
+	});
+}, M = (e) => {
+	let { datum: t, layout: n } = e, r = Math.round(n.top + e.index * n.pitch), i = n.x(t.after), a = n.x(t.before), o = i <= a, s = n.dotR, d = Math.round(Math.abs(t.before - t.after) / e.unit);
+	return /* @__PURE__ */ E(l, {
+		dim: e.dim,
+		onPointerEnter: () => {
+			e.onHover((i + a) / 2, r - 16);
+		},
+		children: [
+			/* @__PURE__ */ T(u, {
+				height: n.pitch,
+				width: e.width,
+				x: 0,
+				y: r - n.pitch / 2
+			}),
+			/* @__PURE__ */ T(g, {
+				kind: "rule",
+				x0: Math.round(n.x(0)),
+				x1: Math.round(n.x.range()[1]),
+				y: r
+			}),
+			/* @__PURE__ */ T(x, {
+				anchor: "end",
+				middle: !0,
+				muted: !0,
+				voice: "label",
+				x: n.labelW,
+				y: r,
+				children: t.label
+			}),
+			/* @__PURE__ */ T(j, {
+				alert: e.alert,
+				datum: t,
+				index: e.index,
+				layout: n,
+				unit: e.unit,
+				y: r
+			}),
+			/* @__PURE__ */ T(m, {
+				className: "pop stroke-l3",
+				cx: a,
+				cy: r + .5,
+				size: n.dotSize,
+				style: c(e.index * 3, "mark")
+			}),
+			/* @__PURE__ */ T(p, {
+				className: e.hero ? "pop fill-hero" : "pop fill-l3",
+				cx: i,
+				cy: r + .5,
+				size: n.dotSize,
+				style: c(e.index * 3 + d * .6, "mark")
+			}),
+			/* @__PURE__ */ T(x, {
+				anchor: o ? "end" : "start",
+				order: e.index + 4,
+				tier: "mark",
+				voice: "value",
+				x: i + (o ? -s - 2 : s + 2),
+				y: r - 12,
+				children: e.format(t.after)
+			}),
+			/* @__PURE__ */ T(x, {
+				anchor: o ? "start" : "end",
+				order: e.index + 4,
+				tier: "mark",
+				voice: "axis",
+				x: a + (o ? s + 2 : -s - 2),
+				y: r - 12,
+				children: e.format(t.before)
+			})
+		]
+	});
+}, N = (e, t) => e.after <= e.before ? `${t(e.before - e.after)} less` : `${t(e.after - e.before)} more`, P = (t, n) => {
+	if (t.length === 0) return "No data.";
+	let r = t[C(t.map((e) => Math.abs(e.before - e.after)))];
+	return `${e(t.length, "row")}. Biggest change: ${r.label}, ${n(r.before)} to ${n(r.after)}. The data table lists every row.`;
+}, F = (e) => {
+	let t = /* @__PURE__ */ new Map();
+	return e.map((e) => {
+		let r = n(e), i = t.get(r) ?? 0;
+		return t.set(r, i + 1), `${r}#${i}`;
+	});
+}, I = (e) => {
+	let c = (e.data ?? []).filter((e) => Number.isFinite(e.before) && Number.isFinite(e.after)), l = e.height ?? 380, u = t(e.format), f = o(e.unit !== void 0 && e.unit > 0 ? e.unit : 1, Math.max(0, ...c.map((e) => Math.abs(e.before - e.after)))), p = e.alert ?? "rise", m = e.ends ?? ["0", "Units"], g = F(c), y = e.emphasis === void 0 ? C(c.map((e) => Math.abs(e.before - e.after))) : c.findIndex((t) => n(t) === e.emphasis), S = r(), w = e.title ?? (c.length === 0 ? "No data" : c.map((e) => `${e.label}: ${u(e.before)} to ${u(e.after)}`).join(", "));
+	return /* @__PURE__ */ T(i, {
+		...v(e),
+		initialWidth: e.initialWidth,
+		table: _(e, e.title ?? "Before and after", [
+			"Label",
+			"Before",
+			"After"
+		], c.map((e) => [
+			e.label,
+			u(e.before),
+			u(e.after)
+		])),
+		width: e.width,
+		overlay: S.at === null ? null : /* @__PURE__ */ T(a, {
+			x: S.at.x,
+			y: S.at.y,
+			children: /* @__PURE__ */ T(d, {
+				facts: [`${u(c[S.at.key].before)} → ${u(c[S.at.key].after)}`, N(c[S.at.key], u)],
+				lead: c[S.at.key].label
+			})
+		}),
+		children: (t) => {
+			let n = k(t, l, c, s(e) !== void 0, u, e.metrics), r = l - (s(e) === void 0 ? 10 : 40);
+			return /* @__PURE__ */ E(b, {
+				desc: P(c, u),
+				height: l,
+				label: w,
+				leave: S.clear,
+				width: t,
+				children: [
+					c.map((e, r) => /* @__PURE__ */ T(M, {
+						alert: p,
+						datum: e,
+						dim: S.dim(r),
+						format: u,
+						hero: y === r,
+						index: r,
+						layout: n,
+						onHover: S.showAt(r),
+						unit: f,
+						width: t
+					}, g[r])),
+					/* @__PURE__ */ T(x, {
+						voice: "axis",
+						x: n.x.range()[0],
+						y: r,
+						children: m[0]
+					}),
+					/* @__PURE__ */ T(x, {
+						anchor: "end",
+						voice: "axis",
+						x: n.x.range()[1],
+						y: r,
+						children: m[1]
+					}),
+					/* @__PURE__ */ T(h, {
+						height: l,
+						metrics: e.metrics,
+						text: s(e),
+						width: t
+					})
+				]
+			});
+		}
+	});
+}, L = (e) => y(e.idPrefix, /* @__PURE__ */ T(I, { ...e }));
+//#endregion
+export { L as DumbbellQueue };

package/lib/charts/basics/hairline-area.js

@@ -0,0 +1,208 @@
+"use client";
+import { axisFormat as e, fmtInt as t, monthTickLabels as n, plural as r } from "../../lib/format.js";
+import { resolveDateFormat as i, resolveFormat as a } from "../../schema/format.js";
+import { useHover as o } from "../hooks.js";
+import { Plot as s, Tooltip as c } from "../core.js";
+import { noteOf as l, sansWidth as u, stagger as d } from "../util.js";
+import { TipText as f } from "../hover.js";
+import "../marks.js";
+import { Dot as p } from "../markers.js";
+import { FootNote as m } from "../plot-note.js";
+import { HRule as h } from "../rules.js";
+import { chartTable as g, plotOptions as _, pointerX as v, scoped as y } from "../shared-options.js";
+import { ChartSvg as ee } from "../svg.js";
+import { Label as b } from "../text.js";
+import { paint as te, useTextureIds as x } from "../texture-ids.js";
+import { Stipple as ne } from "../texture.js";
+import { ValueGrid as re } from "../value-grid.js";
+import { DailyEmpty as S } from "./daily-empty.js";
+import { heroOf as C, isLive as w, reactKeyOf as T, readingRows as E, readingsOf as D, seriesOf as O, valueAt as k } from "./daily-readings.js";
+import { dailyFloor as A } from "./util-a.js";
+import { scaleLinear as j } from "d3-scale";
+import { Fragment as M, jsx as N, jsxs as P } from "react/jsx-runtime";
+import { area as F, line as I } from "d3-shape";
+//#region src/charts/basics/hairline-area.tsx
+var L = (e, t) => e ? "grow-y fill-hero" : t ? "grow-y fill-l2" : "grow-y fill-l4", R = 120, z = (e, t, n) => (n.monthly ? e.date.getUTCDate() === 1 : e.date.getUTCDay() === 1) || t === n.hero || t === n.hover, B = ({ frame: e, hero: t, hover: n, live: r, readings: i }) => /* @__PURE__ */ N("g", { children: r.map((r) => {
+	let a = i.length > R;
+	if (!z(i[r], r, {
+		hero: t,
+		hover: n,
+		monthly: a
+	})) return null;
+	let o = Math.round(e.y(k(i, r))), s = Math.round(e.floor);
+	return /* @__PURE__ */ N("rect", {
+		className: `transition-tone ${L(r === t, r === n)}`,
+		height: Math.max(0, s - o),
+		style: d(r, "fine"),
+		width: 2,
+		x: Math.round(e.x(r)) - 1,
+		y: o
+	}, T(i[r], r));
+}) }), V = ({ frame: e, readings: t }) => {
+	let r = t.length > R ? 3 : 1, i = t.flatMap((e, t) => e.date.getUTCDate() === 1 && e.date.getUTCMonth() % r === 0 ? [t] : []), a = i.includes(0) ? i : [0, ...i], o = n(a.map((e) => t[e].date));
+	return /* @__PURE__ */ N("g", { children: a.map((n, r) => /* @__PURE__ */ N(b, {
+		anchor: r === 0 ? "start" : "middle",
+		dx: r === 0 ? -6 : 0,
+		voice: "axis",
+		x: e.x(n),
+		y: e.floor + 20,
+		children: o[r]
+	}, T(t[n], n))) });
+}, H = (e, t, n) => {
+	let r = n?.at(-1);
+	if (r !== void 0 && r > 0) return j().domain([0, r]).range([t, 40]);
+	let i = Math.min(0, e.lo), a = Math.max(i + 1, e.hi);
+	return j().domain([i, a]).nice(4).range([t, 40]);
+}, U = (e, t) => {
+	let [n] = e;
+	for (let r of e) Math.abs(r - t) < Math.abs(n - t) && (n = r);
+	return n;
+}, W = ({ format: e, frame: t, value: n, x: r }) => /* @__PURE__ */ P(M, { children: [/* @__PURE__ */ N(p, {
+	className: "pop fill-hero",
+	cx: r,
+	cy: t.y(n),
+	size: "md",
+	style: d(40, "fine")
+}), /* @__PURE__ */ N(b, {
+	anchor: "middle",
+	order: 10,
+	voice: "value",
+	x: r,
+	y: t.y(n) - 13,
+	children: e(n)
+})] }), G = (e, t) => ({
+	fill: F().defined(w).x((e, n) => t.x(n)).y0(Math.round(t.floor)).y1((e) => t.y(e.value ?? 0))(e) ?? "",
+	path: I().defined(w).x((e, n) => t.x(n)).y((e) => t.y(e.value ?? 0))(e) ?? ""
+}), K = (e, t) => {
+	let n = Math.min(e - 16, t + 48), r = Math.round((e - n) / 2);
+	return [r, r + n];
+}, q = (e, t, n) => {
+	let r = t < 0 ? 0 : Math.ceil(u(n(k(e, t)), 12) / 2) + 2;
+	return t === 0 ? Math.max(8, r) : 8;
+}, J = ({ clear: t, stipple: n, emphasis: i, fmtDate: a, format: o, height: s, hover: c, maxWidth: l, metrics: u, note: f, readings: g, show: _, title: y, ticks: b, wholeNumbers: x, width: w }) => {
+	let T = O(g), { live: E } = T, D = A(s, f, w, u);
+	if (E.length === 0) return /* @__PURE__ */ N(S, {
+		floor: D,
+		height: s,
+		name: y,
+		width: w
+	});
+	let M = E.map((e) => k(g, e)), F = Math.max(...M), I = E[M.indexOf(F)], L = C(g, E, i, I), R = g.length - 1, [z, J] = K(w, l), Y = q(g, L, o), X = {
+		floor: D,
+		x: j().domain([0, Math.max(1, R)]).range([z + Y, J - 48]),
+		y: H({
+			hi: F,
+			lo: Math.min(...M)
+		}, D, b)
+	}, { fill: Z, path: ie } = G(g, X), Q = b ?? X.y.ticks(4), [ae] = E, $ = a(g[I].date), oe = `Daily values, ${a(g[ae].date)} to ${a(g[E.at(-1) ?? 0].date)}: peak ${o(F)} on ${$}`, se = `${r(E.length, "reading")}. Peak ${o(F)} on ${$}. The data table lists every reading.`;
+	return /* @__PURE__ */ P(ee, {
+		className: "touch-pan-y",
+		height: s,
+		desc: se,
+		label: y ?? oe,
+		leave: t,
+		onPointerMove: (e) => {
+			let t = v(e, w), n = X.x.invert(t), r = U(E, n), i = r === L ? 16 : 10;
+			_(r, X.x(r), X.y(k(g, r)) - i);
+		},
+		width: w,
+		children: [
+			/* @__PURE__ */ N("defs", { children: /* @__PURE__ */ N(ne, {
+				id: n,
+				tone: "fill-l3"
+			}) }),
+			/* @__PURE__ */ N(re, {
+				labelFloor: !0,
+				side: "right",
+				floor: D,
+				format: e(o, x, Q),
+				ticks: Q,
+				x0: z,
+				x1: J,
+				y: X.y
+			}),
+			/* @__PURE__ */ N("path", {
+				className: "fade",
+				d: Z,
+				fill: te(n),
+				style: d(2, "series")
+			}),
+			/* @__PURE__ */ N(B, {
+				frame: X,
+				hero: L,
+				hover: c,
+				...T
+			}),
+			/* @__PURE__ */ N(h, {
+				x0: z,
+				x1: J,
+				y: D
+			}),
+			/* @__PURE__ */ N("path", {
+				className: "draw stroke-l3 stroke-medium cap-round fill-none",
+				d: ie,
+				pathLength: 1,
+				style: d(4, "series")
+			}),
+			c === null || c === L ? null : /* @__PURE__ */ N(p, {
+				className: "fill-l2",
+				cx: X.x(c),
+				cy: X.y(k(g, c)),
+				size: "sm"
+			}),
+			L < 0 ? null : /* @__PURE__ */ N(W, {
+				format: o,
+				frame: X,
+				value: k(g, L),
+				x: X.x(L)
+			}),
+			/* @__PURE__ */ N(V, {
+				frame: X,
+				readings: g
+			}),
+			/* @__PURE__ */ N(m, {
+				gutter: 12,
+				height: s,
+				metrics: u,
+				text: f,
+				width: w
+			})
+		]
+	});
+}, Y = (e) => {
+	let n = D(e.data ?? []), r = e.format === void 0 ? t : a(e.format), u = i(e.dateFormat), { at: d, clear: p, key: m, show: h } = o(), v = x("daily")("stipple"), y = d === null ? void 0 : n[d.key];
+	return /* @__PURE__ */ N(s, {
+		initialWidth: e.initialWidth,
+		width: e.width,
+		..._(e),
+		table: g(e, e.title ?? "Daily values", ["Date", "Value"], E(n, u, r)),
+		overlay: d === null || y === void 0 ? null : /* @__PURE__ */ N(c, {
+			x: d.x,
+			y: d.y,
+			children: /* @__PURE__ */ N(f, {
+				facts: [r(y.value ?? 0)],
+				lead: u(y.date)
+			})
+		}),
+		children: (t) => /* @__PURE__ */ N(J, {
+			clear: p,
+			emphasis: e.emphasis,
+			stipple: v,
+			fmtDate: u,
+			format: r,
+			height: e.height ?? 440,
+			hover: m,
+			maxWidth: e.maxWidth ?? 640,
+			metrics: e.metrics,
+			note: l(e),
+			readings: n,
+			show: h,
+			title: e.title,
+			ticks: e.ticks,
+			wholeNumbers: e.format === void 0,
+			width: t
+		})
+	});
+}, X = (e) => y(e.idPrefix, /* @__PURE__ */ N(Y, { ...e }));
+//#endregion
+export { X as HairlineArea };