@dowel-ui/react 0.5.0 → 0.8.0

package/dist/components/dither-canvas/dither-engine.js

@@ -0,0 +1,243 @@
+//#region src/components/dither-canvas/dither-engine.ts
+/** Default cell pitch in CSS pixels, as amicro's donut draws it. */
+const DITHER_CELL = 4.6;
+function clamp(value, min, max) {
+	return Math.min(max, Math.max(min, value));
+}
+function lerp(from, to, t) {
+	return from + (to - from) * t;
+}
+/** Hermite ease between two edges; 0 below `edge0`, 1 above `edge1`. */
+function smoothstep(edge0, edge1, value) {
+	if (edge0 === edge1) return value < edge0 ? 0 : 1;
+	const x = clamp((value - edge0) / (edge1 - edge0), 0, 1);
+	return x * x * (3 - 2 * x);
+}
+/**
+* Deterministic per-cell hash in [0, 1).
+*
+* Coordinates are quantised to 1/100 px so the float noise in a cell's centre
+* never changes its jitter. `seed` gives a second, independent field (the
+* particle layer uses one) from the same cell.
+*/
+function hash2(x, y, seed = 0) {
+	let h = Math.imul(Math.round(x * 100) | 0, 668265261) ^ Math.imul(Math.round(y * 100) | 0, 374761393);
+	h = Math.imul(h ^ Math.imul(seed | 0, 2654435761), 2246822507);
+	h ^= h >>> 13;
+	h = Math.imul(h, 3266489909);
+	h ^= h >>> 16;
+	return (h >>> 0) / 4294967296;
+}
+/**
+* amicro's shimmer: a sum of sines eased into 0..1. Pass the raw terms (each
+* in −1..1) so each chart keeps its own wave; with no terms — the reduced-motion
+* case — it is the neutral 0.5.
+*/
+function shimmer(...waves) {
+	let sum = 0;
+	for (const wave of waves) sum += wave;
+	return smoothstep(-1.5, 1.5, sum);
+}
+/** The two-sine drift amicro's device donut and revenue fill share. */
+function drift(x, y, time) {
+	return shimmer(Math.sin(x * .05 + time), Math.sin(y * .05 + time * .7));
+}
+/**
+* The drawn square for one cell: centred, side `cell × density`, never larger
+* than the cell. Returns null when the density leaves nothing to draw.
+*/
+function cellSquare(x, y, cell, density) {
+	const size = cell * clamp(density, 0, 1);
+	if (size <= .05) return null;
+	return [
+		x + (cell - size) / 2,
+		y + (cell - size) / 2,
+		size
+	];
+}
+/**
+* Visits every cell overlapping `bounds`, on a grid anchored at the canvas
+* origin. Anchoring matters: a grid anchored to each shape would swim as the
+* shape animates, and two shapes would not share cells.
+*/
+function forEachCell(bounds, cell, visit) {
+	if (cell <= 0 || bounds.width <= 0 || bounds.height <= 0) return;
+	const x0 = Math.floor(bounds.x / cell) * cell;
+	const y0 = Math.floor(bounds.y / cell) * cell;
+	const x1 = bounds.x + bounds.width;
+	const y1 = bounds.y + bounds.height;
+	for (let x = x0; x < x1; x += cell) for (let y = y0; y < y1; y += cell) visit(x, y);
+}
+/**
+* Fills a region with dithered cells. Saves and restores the context, so the
+* clip, colour and alpha never leak into the next shape. Returns the number of
+* squares drawn.
+*/
+function ditherFill(ctx, options) {
+	const cell = options.cell ?? 4.6;
+	let drawn = 0;
+	ctx.save();
+	if (options.clip) ctx.clip(options.clip);
+	if (options.color !== void 0) ctx.fillStyle = options.color;
+	if (options.alpha !== void 0) ctx.globalAlpha *= clamp(options.alpha, 0, 1);
+	forEachCell(options.bounds, cell, (x, y) => {
+		const square = cellSquare(x, y, cell, options.density(x + cell / 2, y + cell / 2, x, y));
+		if (!square) return;
+		ctx.fillRect(square[0], square[1], square[2], square[2]);
+		drawn += 1;
+	});
+	ctx.restore();
+	return drawn;
+}
+/**
+* Turns a colour reference into a CSS value:
+* `"primary"` and `"--color-primary"` become `var(--color-primary)`; anything
+* else (`var(…)`, `color-mix(…)`, `currentColor`) is passed through.
+*/
+function tokenToCss(token) {
+	if (token.startsWith("--")) return `var(${token})`;
+	if (/^[a-z][a-z0-9-]*$/.test(token) && token !== "currentcolor" && token !== "transparent") return `var(--color-${token})`;
+	return token;
+}
+/**
+* Resolves a colour token to a concrete value a canvas accepts, as seen from
+* `element` — so a theme scoped to a subtree applies. A hidden probe element
+* lets the browser do the resolving, which also settles `color-mix()` and
+* nested `var()`s that a canvas fillStyle would reject.
+*/
+function resolveColor(element, token) {
+	const css = tokenToCss(token);
+	const doc = element.ownerDocument;
+	const view = doc.defaultView;
+	if (!view) return css;
+	const host = element.parentElement ?? doc.body;
+	const probe = doc.createElement("span");
+	probe.style.display = "none";
+	probe.style.color = css;
+	host.appendChild(probe);
+	const resolved = view.getComputedStyle(probe).color;
+	probe.remove();
+	if (resolved && !resolved.includes("var(")) return resolved;
+	const name = /^var\((--[\w-]+)\)$/.exec(css)?.[1];
+	return (name ? view.getComputedStyle(element).getPropertyValue(name).trim() : "") || css;
+}
+/**
+* Default series colours: one hue — the theme's primary — stepped toward the
+* card surface, as amicro's monochrome ramp is. Status tokens (success,
+* warning, destructive) are deliberately absent: they mean state, not series.
+* Identity never rests on colour alone; every chart also names each series in
+* a legend, its readout and its data table.
+*/
+const DITHER_PALETTE = [
+	"primary",
+	"color-mix(in oklab, var(--color-primary) 72%, var(--color-card))",
+	"color-mix(in oklab, var(--color-primary) 50%, var(--color-card))",
+	"color-mix(in oklab, var(--color-primary) 34%, var(--color-card))",
+	"color-mix(in oklab, var(--color-primary) 22%, var(--color-card))",
+	"muted-foreground"
+];
+/** The colour for series `index`: its own if given, else the palette in order. */
+function seriesColor(index, color) {
+	return color ?? DITHER_PALETTE[index % DITHER_PALETTE.length] ?? "primary";
+}
+/** amicro's number spring (motion's useSpring at 190 / 27 / 0.7). */
+const DEFAULT_SPRING = {
+	stiffness: 190,
+	damping: 27,
+	mass: .7,
+	precision: .001
+};
+/**
+* A damped spring for canvas values. Integrated in fixed sub-steps, so a long
+* frame (a tab coming back into view) cannot make it explode. Under reduced
+* motion `step` jumps straight to the target: the settled value, drawn once.
+*/
+function createSpring(initial, config = {}) {
+	const { stiffness, damping, mass, precision } = {
+		...DEFAULT_SPRING,
+		...config
+	};
+	let value = initial;
+	let target = initial;
+	let velocity = 0;
+	return {
+		get value() {
+			return value;
+		},
+		get target() {
+			return target;
+		},
+		get velocity() {
+			return velocity;
+		},
+		set(next) {
+			target = next;
+		},
+		jump(next) {
+			value = next;
+			target = next;
+			velocity = 0;
+		},
+		step(dt, reducedMotion = false) {
+			if (reducedMotion) {
+				value = target;
+				velocity = 0;
+				return false;
+			}
+			let remaining = clamp(dt, 0, .1);
+			while (remaining > 0) {
+				const h = Math.min(remaining, 1 / 240);
+				const force = -stiffness * (value - target) - damping * velocity;
+				velocity += force / mass * h;
+				value += velocity * h;
+				remaining -= h;
+			}
+			const scale = Math.max(1, Math.abs(target));
+			if (Math.abs(value - target) < precision * scale && Math.abs(velocity) < precision * scale) {
+				value = target;
+				velocity = 0;
+				return false;
+			}
+			return true;
+		}
+	};
+}
+/**
+* Resamples `values` to `length` points by nearest index, so a 7-point series
+* can morph into a 30-point one without a jump to zero (amicro's range switch).
+*/
+function resample(values, length) {
+	if (length <= 0) return [];
+	if (values.length === 0) return Array.from({ length }, () => 0);
+	if (values.length === length) return [...values];
+	return Array.from({ length }, (_, index) => {
+		const t = length === 1 ? 0 : index / (length - 1);
+		return values[Math.round(t * (values.length - 1))] ?? 0;
+	});
+}
+/** A list of springs that animates an array of values together. */
+function createSprings(initial, config = {}) {
+	let springs = initial.map((value) => createSpring(value, config));
+	const list = {
+		get values() {
+			return springs.map((spring) => spring.value);
+		},
+		set(targets) {
+			if (targets.length !== springs.length) springs = resample(list.values, targets.length).map((value) => createSpring(value, config));
+			targets.forEach((target, index) => springs[index]?.set(target));
+		},
+		jump(targets) {
+			springs = targets.map((value) => createSpring(value, config));
+		},
+		step(dt, reducedMotion = false) {
+			let moving = false;
+			for (const spring of springs) moving = spring.step(dt, reducedMotion) || moving;
+			return moving;
+		}
+	};
+	return list;
+}
+//#endregion
+export { DEFAULT_SPRING, DITHER_CELL, DITHER_PALETTE, cellSquare, clamp, createSpring, createSprings, ditherFill, drift, forEachCell, hash2, lerp, resample, resolveColor, seriesColor, shimmer, smoothstep, tokenToCss };
+
+//# sourceMappingURL=dither-engine.js.map

package/dist/components/dither-canvas/dither-engine.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dither-engine.js","names":[],"sources":["../../../src/components/dither-canvas/dither-engine.ts"],"sourcesContent":["// Ported from amicro \"Dither Charts\" (MIT, © 2026 Syed Subhan Uddin). See THIRD_PARTY_NOTICES.md.\n\n/*\n * The pure half of the dither engine: no React, no DOM beyond the canvas\n * context it is handed. Everything a dither chart needs to decide *how big a\n * cell is* lives here, so it can be unit-tested without a canvas.\n *\n * The technique, as amicro draws it: the plot is a grid of fixed cells\n * (~4.6 CSS px). Each cell is drawn as one small square, centred in the cell,\n * whose side is `cell × density`. Density is built from three ingredients —\n * a shape term (distance, fill level) eased with smoothstep, a time-based sum of\n * sines for shimmer, and a per-cell hash for jitter — and the region is clipped\n * to the shape's path. amicro's hash was `fract(sin(…) × 43758)` and two charts\n * used Math.random; this one is an integer hash, so a frame is the same on every\n * machine and every render (and a test can assert it).\n */\n\n/** Default cell pitch in CSS pixels, as amicro's donut draws it. */\nexport const DITHER_CELL = 4.6;\n\n/** Axis-aligned rectangle in CSS pixels. */\nexport interface DitherBounds {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n}\n\nexport function clamp(value: number, min: number, max: number): number {\n  return Math.min(max, Math.max(min, value));\n}\n\nexport function lerp(from: number, to: number, t: number): number {\n  return from + (to - from) * t;\n}\n\n/** Hermite ease between two edges; 0 below `edge0`, 1 above `edge1`. */\nexport function smoothstep(edge0: number, edge1: number, value: number): number {\n  if (edge0 === edge1) return value < edge0 ? 0 : 1;\n  const x = clamp((value - edge0) / (edge1 - edge0), 0, 1);\n  return x * x * (3 - 2 * x);\n}\n\n/**\n * Deterministic per-cell hash in [0, 1).\n *\n * Coordinates are quantised to 1/100 px so the float noise in a cell's centre\n * never changes its jitter. `seed` gives a second, independent field (the\n * particle layer uses one) from the same cell.\n */\nexport function hash2(x: number, y: number, seed = 0): number {\n  let h =\n    Math.imul(Math.round(x * 100) | 0, 0x27d4eb2d) ^\n    Math.imul(Math.round(y * 100) | 0, 0x165667b1);\n  h = Math.imul(h ^ Math.imul(seed | 0, 0x9e3779b1), 0x85ebca6b);\n  h ^= h >>> 13;\n  h = Math.imul(h, 0xc2b2ae35);\n  h ^= h >>> 16;\n  return (h >>> 0) / 4294967296;\n}\n\n/**\n * amicro's shimmer: a sum of sines eased into 0..1. Pass the raw terms (each\n * in −1..1) so each chart keeps its own wave; with no terms — the reduced-motion\n * case — it is the neutral 0.5.\n */\nexport function shimmer(...waves: number[]): number {\n  let sum = 0;\n  for (const wave of waves) sum += wave;\n  return smoothstep(-1.5, 1.5, sum);\n}\n\n/** The two-sine drift amicro's device donut and revenue fill share. */\nexport function drift(x: number, y: number, time: number): number {\n  return shimmer(Math.sin(x * 0.05 + time), Math.sin(y * 0.05 + time * 0.7));\n}\n\n/**\n * The drawn square for one cell: centred, side `cell × density`, never larger\n * than the cell. Returns null when the density leaves nothing to draw.\n */\nexport function cellSquare(\n  x: number,\n  y: number,\n  cell: number,\n  density: number,\n): [x: number, y: number, size: number] | null {\n  const size = cell * clamp(density, 0, 1);\n  if (size <= 0.05) return null;\n  return [x + (cell - size) / 2, y + (cell - size) / 2, size];\n}\n\n/**\n * Visits every cell overlapping `bounds`, on a grid anchored at the canvas\n * origin. Anchoring matters: a grid anchored to each shape would swim as the\n * shape animates, and two shapes would not share cells.\n */\nexport function forEachCell(\n  bounds: DitherBounds,\n  cell: number,\n  visit: (x: number, y: number) => void,\n): void {\n  if (cell <= 0 || bounds.width <= 0 || bounds.height <= 0) return;\n  const x0 = Math.floor(bounds.x / cell) * cell;\n  const y0 = Math.floor(bounds.y / cell) * cell;\n  const x1 = bounds.x + bounds.width;\n  const y1 = bounds.y + bounds.height;\n  for (let x = x0; x < x1; x += cell) {\n    for (let y = y0; y < y1; y += cell) visit(x, y);\n  }\n}\n\n/**\n * Density function for one cell. `cx`/`cy` are the cell's centre and `x`/`y`\n * its top-left corner, both in CSS pixels. Return 0..1 — the fraction of the\n * cell the square covers; 0 or less skips the cell.\n */\nexport type DitherDensity = (cx: number, cy: number, x: number, y: number) => number;\n\nexport interface DitherFillOptions {\n  /** Region to scan. Keep it tight: every cell in it runs `density`. */\n  bounds: DitherBounds;\n  density: DitherDensity;\n  /** Cell pitch in CSS pixels. Defaults to DITHER_CELL. */\n  cell?: number;\n  /** Clip region — usually a Path2D from `makePath`. Omit to fill the bounds. */\n  clip?: Path2D | null;\n  /** Resolved colour (`frame.color(\"primary\")`). Omit to keep the current fillStyle. */\n  color?: string;\n  /** Multiplies the current globalAlpha for this fill. */\n  alpha?: number;\n}\n\n/**\n * Fills a region with dithered cells. Saves and restores the context, so the\n * clip, colour and alpha never leak into the next shape. Returns the number of\n * squares drawn.\n */\nexport function ditherFill(ctx: CanvasRenderingContext2D, options: DitherFillOptions): number {\n  const cell = options.cell ?? DITHER_CELL;\n  let drawn = 0;\n  ctx.save();\n  if (options.clip) ctx.clip(options.clip);\n  if (options.color !== undefined) ctx.fillStyle = options.color;\n  if (options.alpha !== undefined) ctx.globalAlpha *= clamp(options.alpha, 0, 1);\n  forEachCell(options.bounds, cell, (x, y) => {\n    const square = cellSquare(x, y, cell, options.density(x + cell / 2, y + cell / 2, x, y));\n    if (!square) return;\n    ctx.fillRect(square[0], square[1], square[2], square[2]);\n    drawn += 1;\n  });\n  ctx.restore();\n  return drawn;\n}\n\n/* Colour ------------------------------------------------------------------ */\n\n/**\n * Turns a colour reference into a CSS value:\n * `\"primary\"` and `\"--color-primary\"` become `var(--color-primary)`; anything\n * else (`var(…)`, `color-mix(…)`, `currentColor`) is passed through.\n */\nexport function tokenToCss(token: string): string {\n  if (token.startsWith(\"--\")) return `var(${token})`;\n  if (/^[a-z][a-z0-9-]*$/.test(token) && token !== \"currentcolor\" && token !== \"transparent\") {\n    return `var(--color-${token})`;\n  }\n  return token;\n}\n\n/**\n * Resolves a colour token to a concrete value a canvas accepts, as seen from\n * `element` — so a theme scoped to a subtree applies. A hidden probe element\n * lets the browser do the resolving, which also settles `color-mix()` and\n * nested `var()`s that a canvas fillStyle would reject.\n */\nexport function resolveColor(element: Element, token: string): string {\n  const css = tokenToCss(token);\n  const doc = element.ownerDocument;\n  const view = doc.defaultView;\n  if (!view) return css;\n  const host = element.parentElement ?? doc.body;\n  const probe = doc.createElement(\"span\");\n  probe.style.display = \"none\";\n  probe.style.color = css;\n  host.appendChild(probe);\n  const resolved = view.getComputedStyle(probe).color;\n  probe.remove();\n  if (resolved && !resolved.includes(\"var(\")) return resolved;\n  // No resolution (a detached element, or a DOM without CSS): fall back to the\n  // custom property's own value, then to the expression itself.\n  const name = /^var\\((--[\\w-]+)\\)$/.exec(css)?.[1];\n  const raw = name ? view.getComputedStyle(element).getPropertyValue(name).trim() : \"\";\n  return raw || css;\n}\n\n/**\n * Default series colours: one hue — the theme's primary — stepped toward the\n * card surface, as amicro's monochrome ramp is. Status tokens (success,\n * warning, destructive) are deliberately absent: they mean state, not series.\n * Identity never rests on colour alone; every chart also names each series in\n * a legend, its readout and its data table.\n */\nexport const DITHER_PALETTE: readonly string[] = [\n  \"primary\",\n  \"color-mix(in oklab, var(--color-primary) 72%, var(--color-card))\",\n  \"color-mix(in oklab, var(--color-primary) 50%, var(--color-card))\",\n  \"color-mix(in oklab, var(--color-primary) 34%, var(--color-card))\",\n  \"color-mix(in oklab, var(--color-primary) 22%, var(--color-card))\",\n  \"muted-foreground\",\n];\n\n/** The colour for series `index`: its own if given, else the palette in order. */\nexport function seriesColor(index: number, color?: string): string {\n  return color ?? DITHER_PALETTE[index % DITHER_PALETTE.length] ?? \"primary\";\n}\n\n/* Value animation ---------------------------------------------------------- */\n\nexport interface SpringConfig {\n  stiffness?: number;\n  damping?: number;\n  mass?: number;\n  /** Distance and speed below which the spring snaps to rest. */\n  precision?: number;\n}\n\nexport interface Spring {\n  readonly value: number;\n  readonly target: number;\n  readonly velocity: number;\n  /** Aims the spring at a new target; it moves on the next `step`. */\n  set(target: number): void;\n  /** Places the spring at rest on `value`. */\n  jump(value: number): void;\n  /** Advances by `dt` seconds. Returns true while still moving. */\n  step(dt: number, reducedMotion?: boolean): boolean;\n}\n\n/** amicro's number spring (motion's useSpring at 190 / 27 / 0.7). */\nexport const DEFAULT_SPRING: Required<SpringConfig> = {\n  stiffness: 190,\n  damping: 27,\n  mass: 0.7,\n  precision: 0.001,\n};\n\n/**\n * A damped spring for canvas values. Integrated in fixed sub-steps, so a long\n * frame (a tab coming back into view) cannot make it explode. Under reduced\n * motion `step` jumps straight to the target: the settled value, drawn once.\n */\nexport function createSpring(initial: number, config: SpringConfig = {}): Spring {\n  const { stiffness, damping, mass, precision } = { ...DEFAULT_SPRING, ...config };\n  let value = initial;\n  let target = initial;\n  let velocity = 0;\n  return {\n    get value() {\n      return value;\n    },\n    get target() {\n      return target;\n    },\n    get velocity() {\n      return velocity;\n    },\n    set(next) {\n      target = next;\n    },\n    jump(next) {\n      value = next;\n      target = next;\n      velocity = 0;\n    },\n    step(dt, reducedMotion = false) {\n      if (reducedMotion) {\n        value = target;\n        velocity = 0;\n        return false;\n      }\n      let remaining = clamp(dt, 0, 0.1);\n      while (remaining > 0) {\n        const h = Math.min(remaining, 1 / 240);\n        const force = -stiffness * (value - target) - damping * velocity;\n        velocity += (force / mass) * h;\n        value += velocity * h;\n        remaining -= h;\n      }\n      const scale = Math.max(1, Math.abs(target));\n      if (\n        Math.abs(value - target) < precision * scale &&\n        Math.abs(velocity) < precision * scale\n      ) {\n        value = target;\n        velocity = 0;\n        return false;\n      }\n      return true;\n    },\n  };\n}\n\nexport interface SpringList {\n  readonly values: number[];\n  /** Aims at new targets. A different length resamples the current values. */\n  set(targets: readonly number[]): void;\n  jump(targets: readonly number[]): void;\n  step(dt: number, reducedMotion?: boolean): boolean;\n}\n\n/**\n * Resamples `values` to `length` points by nearest index, so a 7-point series\n * can morph into a 30-point one without a jump to zero (amicro's range switch).\n */\nexport function resample(values: readonly number[], length: number): number[] {\n  if (length <= 0) return [];\n  if (values.length === 0) return Array.from({ length }, () => 0);\n  if (values.length === length) return [...values];\n  return Array.from({ length }, (_, index) => {\n    const t = length === 1 ? 0 : index / (length - 1);\n    return values[Math.round(t * (values.length - 1))] ?? 0;\n  });\n}\n\n/** A list of springs that animates an array of values together. */\nexport function createSprings(\n  initial: readonly number[],\n  config: SpringConfig = {},\n): SpringList {\n  let springs = initial.map((value) => createSpring(value, config));\n  const list: SpringList = {\n    get values() {\n      return springs.map((spring) => spring.value);\n    },\n    set(targets) {\n      if (targets.length !== springs.length) {\n        springs = resample(list.values, targets.length).map((value) =>\n          createSpring(value, config),\n        );\n      }\n      targets.forEach((target, index) => springs[index]?.set(target));\n    },\n    jump(targets) {\n      springs = targets.map((value) => createSpring(value, config));\n    },\n    step(dt, reducedMotion = false) {\n      let moving = false;\n      for (const spring of springs) moving = spring.step(dt, reducedMotion) || moving;\n      return moving;\n    },\n  };\n  return list;\n}\n"],"mappings":"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"}

package/dist/components/dither-canvas/dither-geometry.d.ts

@@ -0,0 +1,73 @@
+//#region src/components/dither-canvas/dither-geometry.d.ts
+interface PathSink {
+  moveTo(x: number, y: number): void;
+  lineTo(x: number, y: number): void;
+  arc(x: number, y: number, radius: number, start: number, end: number, ccw?: boolean): void;
+  arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void;
+  bezierCurveTo(c1x: number, c1y: number, c2x: number, c2y: number, x: number, y: number): void;
+  closePath(): void;
+}
+interface Point {
+  x: number;
+  y: number;
+}
+/**
+ * Builds a Path2D from a tracer. Returns null where Path2D does not exist
+ * (server rendering, some test DOMs), so callers simply skip the clip.
+ */
+declare function makePath(trace: (sink: PathSink) => void): Path2D | null;
+/** Normalises an angle into [0, 2π). */
+declare function normalizeAngle(angle: number): number;
+interface Wedge {
+  index: number;
+  /** Fraction of the whole, 0..1. */
+  share: number;
+  start: number;
+  end: number;
+  mid: number;
+}
+/**
+ * Splits a circle into wedges, clockwise from 12 o'clock by default, leaving
+ * `gap` radians between neighbours (amicro's graph donut uses 0.07).
+ * Negative and non-finite values count as zero.
+ */
+declare function pieWedges(values: readonly number[], options?: {
+  start?: number;
+  gap?: number;
+}): Wedge[];
+/** True when `angle` lies within the wedge's sweep. */
+declare function angleInWedge(angle: number, start: number, end: number): boolean;
+/**
+ * The wedge under a point, or null — hit-testing for a donut from pointer
+ * coordinates, so hover never needs to read pixels back.
+ */
+declare function wedgeAt(wedges: readonly Wedge[], center: Point, inner: number, outer: number, point: Point): number | null;
+/** A plain annular sector (amicro's device donut). */
+declare function traceWedge(sink: PathSink, center: Point, inner: number, outer: number, start: number, end: number): void;
+/** An annular sector with rounded corners (amicro's graph donut). */
+declare function traceRoundedWedge(sink: PathSink, center: Point, inner: number, outer: number, start: number, end: number, radius: number): void;
+/** A rectangle with separate top and bottom corner radii (a stacked segment). */
+declare function traceRoundedRect(sink: PathSink, x: number, y: number, width: number, height: number, radiusTop: number, radiusBottom?: number): void;
+/**
+ * Tangents for a monotone cubic spline (Fritsch–Carlson). Monotone means the
+ * curve never overshoots its data: a smooth line that invents a dip below zero
+ * between two positive days is lying.
+ */
+declare function monotoneTangents(points: readonly Point[]): number[];
+/**
+ * Traces a monotone spline through `points`. With `baseline`, it closes the
+ * shape down to that y — the region under the line, ready to clip a fill.
+ */
+declare function traceSpline(sink: PathSink, points: readonly Point[], baseline?: number): void;
+/** Traces straight segments through `points`, optionally closed to a baseline. */
+declare function tracePolyline(sink: PathSink, points: readonly Point[], baseline?: number): void;
+/** Linear interpolation of a series at fractional index `at` (0..length−1). */
+declare function valueAt(values: readonly number[], at: number): number;
+/**
+ * A round axis maximum just above `value`: 1, 2 or 5 × 10ⁿ, with 5% headroom
+ * (amicro's getAxisMax). Zero and negatives give 1.
+ */
+declare function niceMax(value: number): number;
+//#endregion
+export { PathSink, Point, Wedge, angleInWedge, makePath, monotoneTangents, niceMax, normalizeAngle, pieWedges, tracePolyline, traceRoundedRect, traceRoundedWedge, traceSpline, traceWedge, valueAt, wedgeAt };
+//# sourceMappingURL=dither-geometry.d.ts.map

package/dist/components/dither-canvas/dither-geometry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dither-geometry.d.ts","names":[],"sources":["../../../src/components/dither-canvas/dither-geometry.ts"],"mappings":";UASiB;EACf,OAAO,WAAW;EAClB,OAAO,WAAW;EAClB,IAAI,WAAW,WAAW,gBAAgB,eAAe,aAAa;EACtE,MAAM,YAAY,YAAY,YAAY,YAAY;EACtD,cAAc,aAAa,aAAa,aAAa,aAAa,WAAW;EAC7E;;UAGe;EACf;EACA;;;;;;iBAOc,SAAS,QAAQ,MAAM,oBAAoB;;iBAU3C,eAAe;UAId;EACf;;EAEA;EACA;EACA;EACA;;;;;;;iBAQc,UACd,2BACA;EAAW;EAAgB;IAC1B;;iBAuBa,aAAa,eAAe,eAAe;;;;;iBAS3C,QACd,iBAAiB,SACjB,QAAQ,OACR,eACA,eACA,OAAO;;iBAcO,WACd,MAAM,UACN,QAAQ,OACR,eACA,eACA,eACA;;iBAWc,kBACd,MAAM,UACN,QAAQ,OACR,eACA,eACA,eACA,aACA;;iBA0Bc,iBACd,MAAM,UACN,WACA,WACA,eACA,gBACA,mBACA;;;;;;iBAsBc,iBAAiB,iBAAiB;;;;;iBAwClC,YAAY,MAAM,UAAU,iBAAiB,SAAS;;iBA2BtD,cACd,MAAM,UACN,iBAAiB,SACjB;;iBAec,QAAQ,2BAA2B;;;;;iBAcnC,QAAQ"}

package/dist/components/dither-canvas/dither-geometry.js

@@ -0,0 +1,205 @@
+//#region src/components/dither-canvas/dither-geometry.ts
+/**
+* Builds a Path2D from a tracer. Returns null where Path2D does not exist
+* (server rendering, some test DOMs), so callers simply skip the clip.
+*/
+function makePath(trace) {
+	if (typeof Path2D === "undefined") return null;
+	const path = new Path2D();
+	trace(path);
+	return path;
+}
+const TAU = Math.PI * 2;
+/** Normalises an angle into [0, 2π). */
+function normalizeAngle(angle) {
+	return (angle % TAU + TAU) % TAU;
+}
+/**
+* Splits a circle into wedges, clockwise from 12 o'clock by default, leaving
+* `gap` radians between neighbours (amicro's graph donut uses 0.07).
+* Negative and non-finite values count as zero.
+*/
+function pieWedges(values, options = {}) {
+	const start = options.start ?? -Math.PI / 2;
+	const gap = options.gap ?? 0;
+	const clean = values.map((value) => Number.isFinite(value) && value > 0 ? value : 0);
+	const total = clean.reduce((sum, value) => sum + value, 0);
+	let cursor = start;
+	return clean.map((value, index) => {
+		const share = total > 0 ? value / total : 0;
+		const sweep = share * TAU;
+		const half = sweep > gap ? gap / 2 : sweep / 2;
+		const wedge = {
+			index,
+			share,
+			start: cursor + half,
+			end: cursor + sweep - half,
+			mid: cursor + sweep / 2
+		};
+		cursor += sweep;
+		return wedge;
+	});
+}
+/** True when `angle` lies within the wedge's sweep. */
+function angleInWedge(angle, start, end) {
+	if (end <= start) return false;
+	return normalizeAngle(angle - start) <= end - start;
+}
+/**
+* The wedge under a point, or null — hit-testing for a donut from pointer
+* coordinates, so hover never needs to read pixels back.
+*/
+function wedgeAt(wedges, center, inner, outer, point) {
+	const dx = point.x - center.x;
+	const dy = point.y - center.y;
+	const distance = Math.hypot(dx, dy);
+	if (distance < inner || distance > outer) return null;
+	const angle = Math.atan2(dy, dx);
+	const hit = wedges.find((wedge) => wedge.share > 0 && angleInWedge(angle, wedge.start, wedge.end));
+	return hit ? hit.index : null;
+}
+/** A plain annular sector (amicro's device donut). */
+function traceWedge(sink, center, inner, outer, start, end) {
+	if (end - start <= 1e-4) return;
+	sink.moveTo(center.x + outer * Math.cos(start), center.y + outer * Math.sin(start));
+	sink.arc(center.x, center.y, outer, start, end);
+	sink.lineTo(center.x + inner * Math.cos(end), center.y + inner * Math.sin(end));
+	sink.arc(center.x, center.y, inner, end, start, true);
+	sink.closePath();
+}
+/** An annular sector with rounded corners (amicro's graph donut). */
+function traceRoundedWedge(sink, center, inner, outer, start, end, radius) {
+	const sweep = end - start;
+	if (sweep <= .001) return;
+	const r = Math.max(0, Math.min(radius, (outer - inner) / 2, sweep * inner / 2));
+	if (r === 0) {
+		traceWedge(sink, center, inner, outer, start, end);
+		return;
+	}
+	const { x: cx, y: cy } = center;
+	const at = (distance, angle) => [cx + distance * Math.cos(angle), cy + distance * Math.sin(angle)];
+	const [isx, isy] = at(inner, start + r / inner);
+	sink.moveTo(isx, isy);
+	sink.arc(cx, cy, inner, start + r / inner, end - r / inner);
+	sink.arcTo(...at(inner, end), ...at(outer, end), r);
+	sink.arcTo(...at(outer, end), ...at(outer, end - r / outer), r);
+	sink.arc(cx, cy, outer, end - r / outer, start + r / outer, true);
+	sink.arcTo(...at(outer, start), ...at(inner, start), r);
+	sink.arcTo(...at(inner, start), isx, isy, r);
+	sink.closePath();
+}
+/** A rectangle with separate top and bottom corner radii (a stacked segment). */
+function traceRoundedRect(sink, x, y, width, height, radiusTop, radiusBottom = radiusTop) {
+	if (width <= 0 || height <= 0) return;
+	const top = Math.max(0, Math.min(radiusTop, width / 2, height / 2));
+	const bottom = Math.max(0, Math.min(radiusBottom, width / 2, height / 2));
+	sink.moveTo(x + top, y);
+	sink.lineTo(x + width - top, y);
+	sink.arcTo(x + width, y, x + width, y + top, top);
+	sink.lineTo(x + width, y + height - bottom);
+	sink.arcTo(x + width, y + height, x + width - bottom, y + height, bottom);
+	sink.lineTo(x + bottom, y + height);
+	sink.arcTo(x, y + height, x, y + height - bottom, bottom);
+	sink.lineTo(x, y + top);
+	sink.arcTo(x, y, x + top, y, top);
+	sink.closePath();
+}
+/**
+* Tangents for a monotone cubic spline (Fritsch–Carlson). Monotone means the
+* curve never overshoots its data: a smooth line that invents a dip below zero
+* between two positive days is lying.
+*/
+function monotoneTangents(points) {
+	const n = points.length;
+	if (n < 2) return points.map(() => 0);
+	const slopes = [];
+	for (let i = 0; i < n - 1; i++) {
+		const a = points[i];
+		const b = points[i + 1];
+		const dx = b.x - a.x;
+		slopes.push(dx === 0 ? 0 : (b.y - a.y) / dx);
+	}
+	const tangents = points.map((_, i) => {
+		if (i === 0) return slopes[0] ?? 0;
+		if (i === n - 1) return slopes[n - 2] ?? 0;
+		const left = slopes[i - 1] ?? 0;
+		const right = slopes[i] ?? 0;
+		return left * right <= 0 ? 0 : (left + right) / 2;
+	});
+	for (let i = 0; i < n - 1; i++) {
+		const slope = slopes[i] ?? 0;
+		if (slope === 0) {
+			tangents[i] = 0;
+			tangents[i + 1] = 0;
+			continue;
+		}
+		const a = (tangents[i] ?? 0) / slope;
+		const b = (tangents[i + 1] ?? 0) / slope;
+		const s = a * a + b * b;
+		if (s > 9) {
+			const t = 3 / Math.sqrt(s);
+			tangents[i] = t * a * slope;
+			tangents[i + 1] = t * b * slope;
+		}
+	}
+	return tangents;
+}
+/**
+* Traces a monotone spline through `points`. With `baseline`, it closes the
+* shape down to that y — the region under the line, ready to clip a fill.
+*/
+function traceSpline(sink, points, baseline) {
+	const first = points[0];
+	const last = points[points.length - 1];
+	if (!first || !last) return;
+	const tangents = monotoneTangents(points);
+	sink.moveTo(first.x, first.y);
+	for (let i = 0; i < points.length - 1; i++) {
+		const a = points[i];
+		const b = points[i + 1];
+		const third = (b.x - a.x) / 3;
+		sink.bezierCurveTo(a.x + third, a.y + third * (tangents[i] ?? 0), b.x - third, b.y - third * (tangents[i + 1] ?? 0), b.x, b.y);
+	}
+	if (baseline !== void 0) {
+		sink.lineTo(last.x, baseline);
+		sink.lineTo(first.x, baseline);
+		sink.closePath();
+	}
+}
+/** Traces straight segments through `points`, optionally closed to a baseline. */
+function tracePolyline(sink, points, baseline) {
+	const first = points[0];
+	const last = points[points.length - 1];
+	if (!first || !last) return;
+	sink.moveTo(first.x, first.y);
+	for (const point of points.slice(1)) sink.lineTo(point.x, point.y);
+	if (baseline !== void 0) {
+		sink.lineTo(last.x, baseline);
+		sink.lineTo(first.x, baseline);
+		sink.closePath();
+	}
+}
+/** Linear interpolation of a series at fractional index `at` (0..length−1). */
+function valueAt(values, at) {
+	if (values.length === 0) return 0;
+	const clamped = Math.min(values.length - 1, Math.max(0, at));
+	const i0 = Math.floor(clamped);
+	const i1 = Math.min(i0 + 1, values.length - 1);
+	const a = values[i0] ?? 0;
+	return a + ((values[i1] ?? 0) - a) * (clamped - i0);
+}
+/**
+* A round axis maximum just above `value`: 1, 2 or 5 × 10ⁿ, with 5% headroom
+* (amicro's getAxisMax). Zero and negatives give 1.
+*/
+function niceMax(value) {
+	if (!(value > 0)) return 1;
+	const target = value * 1.05;
+	const power = 10 ** Math.floor(Math.log10(target));
+	const normalized = target / power;
+	return (normalized <= 1 ? 1 : normalized <= 2 ? 2 : normalized <= 5 ? 5 : 10) * power;
+}
+//#endregion
+export { angleInWedge, makePath, monotoneTangents, niceMax, normalizeAngle, pieWedges, tracePolyline, traceRoundedRect, traceRoundedWedge, traceSpline, traceWedge, valueAt, wedgeAt };
+
+//# sourceMappingURL=dither-geometry.js.map

package/dist/components/dither-canvas/dither-geometry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dither-geometry.js","names":[],"sources":["../../../src/components/dither-canvas/dither-geometry.ts"],"sourcesContent":["// Ported from amicro \"Dither Charts\" (MIT, © 2026 Syed Subhan Uddin). See THIRD_PARTY_NOTICES.md.\n\n/*\n * Shape geometry for dither charts. Every tracer writes to a `PathSink` — the\n * subset of the path API that both CanvasRenderingContext2D and Path2D share —\n * so the same function builds a clip region, strokes an outline, or records\n * its commands in a test.\n */\n\nexport interface PathSink {\n  moveTo(x: number, y: number): void;\n  lineTo(x: number, y: number): void;\n  arc(x: number, y: number, radius: number, start: number, end: number, ccw?: boolean): void;\n  arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void;\n  bezierCurveTo(c1x: number, c1y: number, c2x: number, c2y: number, x: number, y: number): void;\n  closePath(): void;\n}\n\nexport interface Point {\n  x: number;\n  y: number;\n}\n\n/**\n * Builds a Path2D from a tracer. Returns null where Path2D does not exist\n * (server rendering, some test DOMs), so callers simply skip the clip.\n */\nexport function makePath(trace: (sink: PathSink) => void): Path2D | null {\n  if (typeof Path2D === \"undefined\") return null;\n  const path = new Path2D();\n  trace(path);\n  return path;\n}\n\nconst TAU = Math.PI * 2;\n\n/** Normalises an angle into [0, 2π). */\nexport function normalizeAngle(angle: number): number {\n  return ((angle % TAU) + TAU) % TAU;\n}\n\nexport interface Wedge {\n  index: number;\n  /** Fraction of the whole, 0..1. */\n  share: number;\n  start: number;\n  end: number;\n  mid: number;\n}\n\n/**\n * Splits a circle into wedges, clockwise from 12 o'clock by default, leaving\n * `gap` radians between neighbours (amicro's graph donut uses 0.07).\n * Negative and non-finite values count as zero.\n */\nexport function pieWedges(\n  values: readonly number[],\n  options: { start?: number; gap?: number } = {},\n): Wedge[] {\n  const start = options.start ?? -Math.PI / 2;\n  const gap = options.gap ?? 0;\n  const clean = values.map((value) => (Number.isFinite(value) && value > 0 ? value : 0));\n  const total = clean.reduce((sum, value) => sum + value, 0);\n  let cursor = start;\n  return clean.map((value, index) => {\n    const share = total > 0 ? value / total : 0;\n    const sweep = share * TAU;\n    const half = sweep > gap ? gap / 2 : sweep / 2;\n    const wedge = {\n      index,\n      share,\n      start: cursor + half,\n      end: cursor + sweep - half,\n      mid: cursor + sweep / 2,\n    };\n    cursor += sweep;\n    return wedge;\n  });\n}\n\n/** True when `angle` lies within the wedge's sweep. */\nexport function angleInWedge(angle: number, start: number, end: number): boolean {\n  if (end <= start) return false;\n  return normalizeAngle(angle - start) <= end - start;\n}\n\n/**\n * The wedge under a point, or null — hit-testing for a donut from pointer\n * coordinates, so hover never needs to read pixels back.\n */\nexport function wedgeAt(\n  wedges: readonly Wedge[],\n  center: Point,\n  inner: number,\n  outer: number,\n  point: Point,\n): number | null {\n  const dx = point.x - center.x;\n  const dy = point.y - center.y;\n  const distance = Math.hypot(dx, dy);\n  if (distance < inner || distance > outer) return null;\n  const angle = Math.atan2(dy, dx);\n  const hit = wedges.find(\n    (wedge) => wedge.share > 0 && angleInWedge(angle, wedge.start, wedge.end),\n  );\n  return hit ? hit.index : null;\n}\n\n/** A plain annular sector (amicro's device donut). */\nexport function traceWedge(\n  sink: PathSink,\n  center: Point,\n  inner: number,\n  outer: number,\n  start: number,\n  end: number,\n): void {\n  if (end - start <= 0.0001) return;\n  sink.moveTo(center.x + outer * Math.cos(start), center.y + outer * Math.sin(start));\n  sink.arc(center.x, center.y, outer, start, end);\n  sink.lineTo(center.x + inner * Math.cos(end), center.y + inner * Math.sin(end));\n  sink.arc(center.x, center.y, inner, end, start, true);\n  sink.closePath();\n}\n\n/** An annular sector with rounded corners (amicro's graph donut). */\nexport function traceRoundedWedge(\n  sink: PathSink,\n  center: Point,\n  inner: number,\n  outer: number,\n  start: number,\n  end: number,\n  radius: number,\n): void {\n  const sweep = end - start;\n  if (sweep <= 0.001) return;\n  const r = Math.max(0, Math.min(radius, (outer - inner) / 2, (sweep * inner) / 2));\n  if (r === 0) {\n    traceWedge(sink, center, inner, outer, start, end);\n    return;\n  }\n  const { x: cx, y: cy } = center;\n  const at = (distance: number, angle: number): [number, number] => [\n    cx + distance * Math.cos(angle),\n    cy + distance * Math.sin(angle),\n  ];\n  const [isx, isy] = at(inner, start + r / inner);\n  sink.moveTo(isx, isy);\n  sink.arc(cx, cy, inner, start + r / inner, end - r / inner);\n  sink.arcTo(...at(inner, end), ...at(outer, end), r);\n  sink.arcTo(...at(outer, end), ...at(outer, end - r / outer), r);\n  sink.arc(cx, cy, outer, end - r / outer, start + r / outer, true);\n  sink.arcTo(...at(outer, start), ...at(inner, start), r);\n  sink.arcTo(...at(inner, start), isx, isy, r);\n  sink.closePath();\n}\n\n/** A rectangle with separate top and bottom corner radii (a stacked segment). */\nexport function traceRoundedRect(\n  sink: PathSink,\n  x: number,\n  y: number,\n  width: number,\n  height: number,\n  radiusTop: number,\n  radiusBottom = radiusTop,\n): void {\n  if (width <= 0 || height <= 0) return;\n  const top = Math.max(0, Math.min(radiusTop, width / 2, height / 2));\n  const bottom = Math.max(0, Math.min(radiusBottom, width / 2, height / 2));\n  sink.moveTo(x + top, y);\n  sink.lineTo(x + width - top, y);\n  sink.arcTo(x + width, y, x + width, y + top, top);\n  sink.lineTo(x + width, y + height - bottom);\n  sink.arcTo(x + width, y + height, x + width - bottom, y + height, bottom);\n  sink.lineTo(x + bottom, y + height);\n  sink.arcTo(x, y + height, x, y + height - bottom, bottom);\n  sink.lineTo(x, y + top);\n  sink.arcTo(x, y, x + top, y, top);\n  sink.closePath();\n}\n\n/**\n * Tangents for a monotone cubic spline (Fritsch–Carlson). Monotone means the\n * curve never overshoots its data: a smooth line that invents a dip below zero\n * between two positive days is lying.\n */\nexport function monotoneTangents(points: readonly Point[]): number[] {\n  const n = points.length;\n  if (n < 2) return points.map(() => 0);\n  const slopes: number[] = [];\n  for (let i = 0; i < n - 1; i++) {\n    const a = points[i] as Point;\n    const b = points[i + 1] as Point;\n    const dx = b.x - a.x;\n    slopes.push(dx === 0 ? 0 : (b.y - a.y) / dx);\n  }\n  const tangents = points.map((_, i) => {\n    if (i === 0) return slopes[0] ?? 0;\n    if (i === n - 1) return slopes[n - 2] ?? 0;\n    const left = slopes[i - 1] ?? 0;\n    const right = slopes[i] ?? 0;\n    return left * right <= 0 ? 0 : (left + right) / 2;\n  });\n  for (let i = 0; i < n - 1; i++) {\n    const slope = slopes[i] ?? 0;\n    if (slope === 0) {\n      tangents[i] = 0;\n      tangents[i + 1] = 0;\n      continue;\n    }\n    const a = (tangents[i] ?? 0) / slope;\n    const b = (tangents[i + 1] ?? 0) / slope;\n    const s = a * a + b * b;\n    if (s > 9) {\n      const t = 3 / Math.sqrt(s);\n      tangents[i] = t * a * slope;\n      tangents[i + 1] = t * b * slope;\n    }\n  }\n  return tangents;\n}\n\n/**\n * Traces a monotone spline through `points`. With `baseline`, it closes the\n * shape down to that y — the region under the line, ready to clip a fill.\n */\nexport function traceSpline(sink: PathSink, points: readonly Point[], baseline?: number): void {\n  const first = points[0];\n  const last = points[points.length - 1];\n  if (!first || !last) return;\n  const tangents = monotoneTangents(points);\n  sink.moveTo(first.x, first.y);\n  for (let i = 0; i < points.length - 1; i++) {\n    const a = points[i] as Point;\n    const b = points[i + 1] as Point;\n    const third = (b.x - a.x) / 3;\n    sink.bezierCurveTo(\n      a.x + third,\n      a.y + third * (tangents[i] ?? 0),\n      b.x - third,\n      b.y - third * (tangents[i + 1] ?? 0),\n      b.x,\n      b.y,\n    );\n  }\n  if (baseline !== undefined) {\n    sink.lineTo(last.x, baseline);\n    sink.lineTo(first.x, baseline);\n    sink.closePath();\n  }\n}\n\n/** Traces straight segments through `points`, optionally closed to a baseline. */\nexport function tracePolyline(\n  sink: PathSink,\n  points: readonly Point[],\n  baseline?: number,\n): void {\n  const first = points[0];\n  const last = points[points.length - 1];\n  if (!first || !last) return;\n  sink.moveTo(first.x, first.y);\n  for (const point of points.slice(1)) sink.lineTo(point.x, point.y);\n  if (baseline !== undefined) {\n    sink.lineTo(last.x, baseline);\n    sink.lineTo(first.x, baseline);\n    sink.closePath();\n  }\n}\n\n/** Linear interpolation of a series at fractional index `at` (0..length−1). */\nexport function valueAt(values: readonly number[], at: number): number {\n  if (values.length === 0) return 0;\n  const clamped = Math.min(values.length - 1, Math.max(0, at));\n  const i0 = Math.floor(clamped);\n  const i1 = Math.min(i0 + 1, values.length - 1);\n  const a = values[i0] ?? 0;\n  const b = values[i1] ?? 0;\n  return a + (b - a) * (clamped - i0);\n}\n\n/**\n * A round axis maximum just above `value`: 1, 2 or 5 × 10ⁿ, with 5% headroom\n * (amicro's getAxisMax). Zero and negatives give 1.\n */\nexport function niceMax(value: number): number {\n  if (!(value > 0)) return 1;\n  const target = value * 1.05;\n  const power = 10 ** Math.floor(Math.log10(target));\n  const normalized = target / power;\n  const step = normalized <= 1 ? 1 : normalized <= 2 ? 2 : normalized <= 5 ? 5 : 10;\n  return step * power;\n}\n"],"mappings":"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"}

package/dist/components/dither-canvas/dither-scrubber.d.ts

@@ -0,0 +1,64 @@
+import { ComponentPropsWithRef, FocusEvent, KeyboardEvent, PointerEvent, ReactNode } from "react";
+//#region src/components/dither-canvas/dither-scrubber.d.ts
+/** The index under a pointer: `clientX` across `rect`, rounded to a point. */
+declare function indexFromPointer(clientX: number, rect: {
+  left: number;
+  width: number;
+}, count: number): number;
+/** The index a key moves to, or null when the key is not a slider key. */
+declare function indexFromKey(key: string, current: number, count: number): number | null;
+interface DitherScrubberOptions {
+  /** Number of points. */
+  count: number;
+  /** Controlled cursor index; null hides the cursor. */
+  index?: number | null;
+  defaultIndex?: number | null;
+  onIndexChange?: (index: number | null) => void;
+}
+interface DitherScrubberProps {
+  role: "slider";
+  tabIndex: number;
+  "aria-valuemin": number;
+  "aria-valuemax": number;
+  "aria-valuenow": number;
+  "aria-orientation": "horizontal";
+  onKeyDown: (event: KeyboardEvent<HTMLElement>) => void;
+  onPointerMove: (event: PointerEvent<HTMLElement>) => void;
+  onPointerLeave: (event: PointerEvent<HTMLElement>) => void;
+  onFocus: (event: FocusEvent<HTMLElement>) => void;
+  onBlur: (event: FocusEvent<HTMLElement>) => void;
+}
+interface DitherScrubber {
+  /** The cursor's point, or null when neither pointer nor focus is on the plot. */
+  index: number | null;
+  /** The point the slider reports: the cursor, or the latest point at rest. */
+  valueIndex: number;
+  setIndex: (index: number | null) => void;
+  /** Spread onto the plot overlay. Add aria-label and aria-valuetext yourself. */
+  sliderProps: DitherScrubberProps;
+}
+/** State and slider props for a keyboard-operable chart cursor. */
+declare function useDitherScrubber({ count, index: controlled, defaultIndex, onIndexChange }: DitherScrubberOptions): DitherScrubber;
+interface DitherCursorProps extends Omit<ComponentPropsWithRef<"div">, "children"> {
+  scrubber: DitherScrubber;
+  /** Names the slider, e.g. "Members by day". */
+  label: string;
+  /** What the slider announces for the current point, e.g. "Jul 3: 24". */
+  valueText: string;
+  /** Cursor position across the plot, 0..1. */
+  x: number;
+  /** Point position down the plot, 0..1 from the top; null draws no dot. */
+  y?: number | null;
+  /** Readout content, shown beside the cursor. */
+  readout?: ReactNode;
+}
+/**
+ * The scrubber's overlay: an invisible slider covering its positioned parent,
+ * plus the cursor line, point and readout while a point is active. All real
+ * DOM — the readout is text, not pixels. Place it after the chart's role="img"
+ * element, not inside it: a slider inside an image would be hidden.
+ */
+declare function DitherCursor({ scrubber, label, valueText, x, y, readout, className, ...props }: DitherCursorProps): import("react").JSX.Element;
+//#endregion
+export { DitherCursor, DitherCursorProps, DitherScrubber, DitherScrubberOptions, DitherScrubberProps, indexFromKey, indexFromPointer, useDitherScrubber };
+//# sourceMappingURL=dither-scrubber.d.ts.map

package/dist/components/dither-canvas/dither-scrubber.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dither-scrubber.d.ts","names":[],"sources":["../../../src/components/dither-canvas/dither-scrubber.tsx"],"mappings":";;;iBAyBgB,iBACd,iBACA;EAAQ;EAAc;GACtB;;iBAQc,aAAa,aAAa,iBAAiB;UAwB1C;;EAEf;;EAEA;EACA;EACA,iBAAiB;;UAGF;EACf;EACA;EACA;EACA;EACA;EACA;EACA,YAAY,OAAO,cAAc;EACjC,gBAAgB,OAAO,aAAa;EACpC,iBAAiB,OAAO,aAAa;EACrC,UAAU,OAAO,WAAW;EAC5B,SAAS,OAAO,WAAW;;UAGZ;;EAEf;;EAEA;EACA,WAAW;;EAEX,aAAa;;;iBAIC,oBACd,OACA,OAAO,YACP,cACA,iBACC,wBAAwB;UA6DV,0BAA0B,KAAK;EAC9C,UAAU;;EAEV;;EAEA;;EAEA;;EAEA;;EAEA,UAAU;;;;;;;;iBASI,eACd,UACA,OACA,WACA,GACA,GACA,SACA,cACG,SACF,oCAAiB,IAAA"}