@silverpoint/core 0.1.0

package/dist/index.js

@@ -0,0 +1,4770 @@
+import { scaleLinear, scaleBand } from 'd3-scale';
+import { curveStepAfter, curveNatural, curveLinear, curveMonotoneX, line, curveStep, curveStepBefore, area } from 'd3-shape';
+import { chordDirected } from 'd3-chord';
+
+// src/render/round.ts
+function round2(value) {
+  const rounded = Math.round(value * 100) / 100;
+  return Object.is(rounded, -0) ? 0 : rounded;
+}
+var NUMBER = /-?(?:\d+\.?\d*|\.\d+)(?:[eE][-+]?\d+)?/g;
+function roundPathData(d) {
+  return d.replace(NUMBER, (token) => String(round2(Number(token))));
+}
+function roundRect(rect) {
+  return {
+    x: round2(rect.x),
+    y: round2(rect.y),
+    width: round2(rect.width),
+    height: round2(rect.height)
+  };
+}
+function roundStroke(stroke) {
+  return { ...stroke, d: roundPathData(stroke.d) };
+}
+function roundTile(tile) {
+  return {
+    ...tile,
+    width: round2(tile.width),
+    height: round2(tile.height),
+    angle: round2(tile.angle),
+    strokes: tile.strokes.map(roundStroke)
+  };
+}
+function roundGeometry(geometry) {
+  return {
+    viewBox: roundRect(geometry.viewBox),
+    plot: roundRect(geometry.plot),
+    strokes: geometry.strokes.map(roundStroke),
+    labels: geometry.labels.map((label) => ({ ...label, x: round2(label.x), y: round2(label.y) })),
+    hitAreas: geometry.hitAreas.map((hit) => ({
+      ...hit,
+      x: round2(hit.x),
+      y: round2(hit.y),
+      ...hit.box ? { box: roundRect(hit.box) } : {}
+    })),
+    defs: geometry.defs.map(roundTile)
+  };
+}
+
+// src/render/serialize.ts
+function serializeGeometry(geometry) {
+  return JSON.stringify(geometry);
+}
+function parseGeometry(json) {
+  return JSON.parse(json);
+}
+function pathBytes(geometry) {
+  let bytes = 0;
+  for (const stroke of geometry.strokes) bytes += stroke.d.length;
+  for (const tile of geometry.defs) {
+    for (const stroke of tile.strokes) bytes += stroke.d.length;
+  }
+  return bytes;
+}
+var PATH_BYTE_BUDGET = 4e4;
+
+// src/render/seed.ts
+var FNV_OFFSET_BASIS = 2166136261;
+var FNV_PRIME = 16777619;
+function utf8Bytes(input) {
+  const bytes = [];
+  for (const char of input) {
+    const code = char.codePointAt(0) ?? 0;
+    if (code < 128) {
+      bytes.push(code);
+    } else if (code < 2048) {
+      bytes.push(192 | code >> 6, 128 | code & 63);
+    } else if (code < 65536) {
+      bytes.push(224 | code >> 12, 128 | code >> 6 & 63, 128 | code & 63);
+    } else {
+      bytes.push(
+        240 | code >> 18,
+        128 | code >> 12 & 63,
+        128 | code >> 6 & 63,
+        128 | code & 63
+      );
+    }
+  }
+  return bytes;
+}
+function fnv1a32(input) {
+  let hash = FNV_OFFSET_BASIS;
+  for (const byte of utf8Bytes(input)) {
+    hash ^= byte;
+    hash = Math.imul(hash, FNV_PRIME);
+  }
+  return hash >>> 0;
+}
+function deriveSeed(id) {
+  return fnv1a32(id);
+}
+function resolveSeed(seed, id) {
+  if (seed === void 0) return deriveSeed(id);
+  if (typeof seed === "string") return fnv1a32(seed);
+  return Number.isFinite(seed) ? Math.trunc(seed) >>> 0 : 0;
+}
+
+// src/render/prng.ts
+function createPrng(seed) {
+  let state = seed >>> 0;
+  return () => {
+    state = state + 1831565813 >>> 0;
+    let t = state;
+    t = Math.imul(t ^ t >>> 15, t | 1);
+    t ^= t + Math.imul(t ^ t >>> 7, t | 61);
+    return ((t ^ t >>> 14) >>> 0) / 4294967296;
+  };
+}
+
+// src/charts/shared/dates.ts
+var DAY_MS = 864e5;
+var ISO_DATE = /^(\d{4})-(\d{2})-(\d{2})$/;
+function parseIsoDate(iso) {
+  const match = ISO_DATE.exec(iso);
+  if (!match) return Number.NaN;
+  return Date.UTC(Number(match[1]), Number(match[2]) - 1, Number(match[3])) / DAY_MS;
+}
+function isoDate(day) {
+  return new Date(day * DAY_MS).toISOString().slice(0, 10);
+}
+function addDays(day, days) {
+  return day + days;
+}
+function weekday(day) {
+  return ((day + 4) % 7 + 7) % 7;
+}
+
+// src/diagnostics/diagnose.ts
+var SilverpointError = class extends Error {
+  code;
+  constructor(code, message) {
+    super(message);
+    this.name = "SilverpointError";
+    this.code = code;
+  }
+};
+var consoleSink = (_code, message) => {
+  console.warn(message);
+};
+var sink = consoleSink;
+var reported = /* @__PURE__ */ new Set();
+function __setDiagnosticSink(next) {
+  sink = next ?? consoleSink;
+  reported.clear();
+  return () => {
+    sink = consoleSink;
+    reported.clear();
+  };
+}
+function format(code, chart, detail, template) {
+  const specifics = detail.message ? ` ${detail.message}` : "";
+  return `[${code}] ${chart}: ${template.what} (\`${detail.property}\`).${specifics} ${template.todo}. (${template.req})`;
+}
+var ERRORS = {
+  SP009: {
+    req: "REQ-097",
+    what: "a scale bound cannot be derived from the data and was not supplied",
+    todo: "Pass the named property explicitly"
+  },
+  SP012: {
+    req: "REQ-127",
+    what: "the ground does not reach the minimum contrast",
+    todo: "Recompute the palette; colours are not chosen by eye"
+  }
+};
+function diagnose(code, chart, detail) {
+  const error = ERRORS[code];
+  if (error) {
+    throw new SilverpointError(code, format(code, chart, detail, error));
+  }
+  if (process.env.NODE_ENV !== "production") {
+    developmentDiagnose(code, chart, detail);
+  }
+}
+function developmentDiagnose(code, chart, detail) {
+  const template = WARNINGS[code];
+  if (!template) return;
+  const message = format(code, chart, detail, template);
+  if (code === "SP005") {
+    throw new SilverpointError(code, message);
+  }
+  if (reported.has(message)) return;
+  reported.add(message);
+  sink(code, message);
+}
+var WARNINGS = {
+  SP001: {
+    req: "REQ-007",
+    what: "the dataset is empty; the ground's empty state is drawn",
+    todo: "Pass at least one row, or omit `data` to see the demo dataset"
+  },
+  SP002: {
+    req: "REQ-008",
+    what: "a value cannot be drawn as given (null, not finite, or outside the data contract); it is corrected or omitted",
+    todo: "Check the value against the chart's data contract (Data Model \xA72)"
+  },
+  SP003: {
+    req: "REQ-009",
+    what: "the container measures 0 px; the render is deferred",
+    todo: "Give the container a size, or pin `width` and `height`"
+  },
+  SP004: {
+    req: "REQ-010",
+    what: "the scale domain has zero length; it is expanded with the ground's domainPadding",
+    todo: "Nothing to do if the data is constant; otherwise check the accessor"
+  },
+  SP005: {
+    req: "REQ-025",
+    what: "more than one element is marked with white heightening; only the first is applied",
+    todo: "Heighten a single element per chart"
+  },
+  SP006: {
+    req: "REQ-026",
+    what: "the inker is not registered; falling back to NullInker",
+    todo: "Register the inker or fix the ground's `inker` token"
+  },
+  SP007: {
+    req: "REQ-045",
+    what: "the ground is not registered; falling back to silverpoint",
+    todo: "Call registerGround() before rendering, or fix the name"
+  },
+  SP008: {
+    req: "REQ-096",
+    what: "the data volume is above the family's threshold",
+    todo: "Aggregate the data before charting it"
+  },
+  SP010: {
+    req: "REQ-091",
+    what: "the chord ring has more than 12 categories",
+    todo: "Group the smaller categories"
+  },
+  SP011: {
+    req: "NFR \xA77",
+    what: "the path byte budget of 40 KB is exceeded",
+    todo: "Use `hatchFill: 'tile'` or a larger hatch gap"
+  },
+  SP013: {
+    req: "REQ-032",
+    what: "the @silverpoint/fonts face failed to load; rendering fell back to the system stack",
+    todo: "Install @silverpoint/fonts and import its stylesheet; golden images will not match until then"
+  }
+};
+
+// src/render/heighten.ts
+function isOutlineOf(candidate, heightened) {
+  return candidate.part === "ink" && (candidate.paint ?? "stroke") === "stroke" && candidate.d === heightened.d;
+}
+function enforceHeightening(geometry, chart) {
+  const heightened = geometry.strokes.filter((stroke) => stroke.part === "heighten");
+  if (heightened.length === 0) return geometry;
+  if (heightened.length > 1 && process.env.NODE_ENV !== "production") {
+    diagnose("SP005", chart, {
+      property: "heighten",
+      message: `${heightened.length} heightened elements were declared.`
+    });
+  }
+  const [kept] = heightened;
+  const strokes = [];
+  for (const stroke of geometry.strokes) {
+    if (stroke.part === "heighten" && stroke !== kept) continue;
+    strokes.push(stroke);
+    if (stroke === kept && !geometry.strokes.some((other) => isOutlineOf(other, kept))) {
+      strokes.push({ d: kept.d, role: kept.role, part: "ink", paint: "stroke" });
+    }
+  }
+  return { ...geometry, strokes };
+}
+
+// src/render/view.ts
+function pathView(stroke) {
+  const paint = stroke.paint ?? "stroke";
+  return {
+    d: stroke.d,
+    part: `sp-${stroke.part}`,
+    role: stroke.role,
+    paint,
+    dash: stroke.dash ?? null,
+    fill: paint === "tile" && stroke.tile ? `url(#${stroke.tile})` : null
+  };
+}
+function toSvgView(model, style) {
+  const { geometry, ids } = model;
+  const { viewBox } = geometry;
+  return {
+    svg: {
+      viewBox: `${viewBox.x} ${viewBox.y} ${viewBox.width} ${viewBox.height}`,
+      width: String(viewBox.width),
+      height: String(viewBox.height),
+      class: `sp-chart sp-ground-${style.ground}`,
+      substrate: style.substrate,
+      mode: style.mode,
+      role: "img",
+      labelledby: `${ids.title} ${ids.desc}`
+    },
+    title: { id: ids.title, text: model.name },
+    desc: { id: ids.desc, text: model.description },
+    patterns: geometry.defs.map((tile) => ({
+      id: tile.id,
+      width: String(tile.width),
+      height: String(tile.height),
+      transform: `rotate(${tile.angle})`,
+      paths: tile.strokes.map(pathView)
+    })),
+    paths: geometry.strokes.map(pathView),
+    texts: geometry.labels.map((label) => ({
+      x: String(label.x),
+      y: String(label.y),
+      part: `sp-${label.part}`,
+      kind: label.kind,
+      anchor: label.anchor,
+      text: label.text
+    }))
+  };
+}
+var ESCAPES = { "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;" };
+function escape(value) {
+  return value.replace(/[&<>"]/g, (char) => ESCAPES[char] ?? char);
+}
+function attributes(pairs) {
+  return pairs.filter((pair) => pair[1] !== null).map(([name, value]) => ` ${name}="${escape(value)}"`).join("");
+}
+function pathString(path) {
+  return `<path${attributes([
+    ["d", path.d],
+    ["part", path.part],
+    ["data-role", path.role],
+    ["data-paint", path.paint],
+    ["data-dash", path.dash],
+    ["fill", path.fill]
+  ])}></path>`;
+}
+function svgString(view) {
+  const { svg } = view;
+  const open = `<svg${attributes([
+    ["xmlns", "http://www.w3.org/2000/svg"],
+    ["viewBox", svg.viewBox],
+    ["width", svg.width],
+    ["height", svg.height],
+    ["class", svg.class],
+    ["data-substrate", svg.substrate],
+    ["data-mode", svg.mode],
+    ["role", svg.role],
+    ["aria-labelledby", svg.labelledby]
+  ])}>`;
+  const title = `<title id="${escape(view.title.id)}">${escape(view.title.text)}</title>`;
+  const desc = `<desc id="${escape(view.desc.id)}">${escape(view.desc.text)}</desc>`;
+  const defs = view.patterns.length === 0 ? "" : `<defs>${view.patterns.map(
+    (pattern) => `<pattern${attributes([
+      ["id", pattern.id],
+      ["width", pattern.width],
+      ["height", pattern.height],
+      ["patternUnits", "userSpaceOnUse"],
+      ["patternTransform", pattern.transform]
+    ])}>${pattern.paths.map(pathString).join("")}</pattern>`
+  ).join("")}</defs>`;
+  const paths = view.paths.map(pathString).join("");
+  const texts = view.texts.map(
+    (text) => `<text${attributes([
+      ["x", text.x],
+      ["y", text.y],
+      ["part", text.part],
+      ["data-kind", text.kind],
+      ["text-anchor", text.anchor]
+    ])}>${escape(text.text)}</text>`
+  ).join("");
+  return `${open}${title}${desc}${defs}${paths}${texts}</svg>`;
+}
+
+// src/diagnostics/typeface.ts
+var DISPLAY_FACE_PROBE = '16px "EB Garamond"';
+async function checkTypeface(fonts, chart, face = DISPLAY_FACE_PROBE) {
+  let loaded;
+  try {
+    const faces = await fonts.load(face);
+    loaded = faces.length > 0 && fonts.check(face);
+  } catch {
+    loaded = false;
+  }
+  if (!loaded && process.env.NODE_ENV !== "production") {
+    diagnose("SP013", chart, { property: "font-family", message: `Probe: ${face}.` });
+  }
+  return loaded;
+}
+
+// src/scales/util.ts
+function min(values) {
+  let result;
+  for (const value of values) {
+    if (Number.isFinite(value) && (result === void 0 || value < result)) result = value;
+  }
+  return result;
+}
+function max(values) {
+  let result;
+  for (const value of values) {
+    if (Number.isFinite(value) && (result === void 0 || value > result)) result = value;
+  }
+  return result;
+}
+function extent(values) {
+  const low = min(values);
+  const high = max(values);
+  return low === void 0 || high === void 0 ? void 0 : [low, high];
+}
+function expandDomain(domain, padding, site, fromZero = false) {
+  const [low, high] = domain;
+  if (low !== high) return [low, high];
+  const spread = low === 0 ? padding : Math.abs(low) * padding;
+  if (fromZero && low === 0) {
+    if (process.env.NODE_ENV !== "production") {
+      diagnose("SP004", site.chart, { property: site.property, message: `Domain [0, 0] became [0, ${2 * spread}].` });
+    }
+    return [0, 2 * spread];
+  }
+  if (process.env.NODE_ENV !== "production") {
+    diagnose("SP004", site.chart, {
+      property: site.property,
+      message: `Domain [${low}, ${high}] became [${low - spread}, ${high + spread}].`
+    });
+  }
+  return [low - spread, high + spread];
+}
+function linearScale(domain, range, options) {
+  const expanded = expandDomain(domain, options.padding, options, options.fromZero);
+  const scale = scaleLinear().domain(expanded).range(range);
+  if (options.nice) scale.nice(4);
+  const [low, high] = scale.domain();
+  const result = ((value) => scale(value));
+  Object.defineProperty(result, "domain", { value: [low, high] });
+  result.ticks = (count) => scale.ticks(count);
+  return result;
+}
+function bandScale(domain, range, options = {}) {
+  const scale = scaleBand().domain(domain).range(range).paddingInner(options.paddingInner ?? 0).paddingOuter(options.paddingOuter ?? 0);
+  const bandwidth = scale.bandwidth();
+  const result = ((value) => scale(value));
+  Object.defineProperty(result, "bandwidth", { value: bandwidth });
+  result.center = (value) => {
+    const start = scale(value);
+    return start === void 0 ? void 0 : start + bandwidth / 2;
+  };
+  return result;
+}
+
+// src/ink/null-inker.ts
+var NullInker = Object.freeze({
+  name: "null",
+  ink(geometry, _options) {
+    return geometry;
+  }
+});
+
+// src/ink/registry.ts
+var registry = /* @__PURE__ */ new Map([[NullInker.name, NullInker]]);
+function registerInker(inker) {
+  registry.set(inker.name, inker);
+}
+function resolveInker(name, chart, builtins = []) {
+  const found = registry.get(name) ?? builtins.find((inker) => inker.name === name);
+  if (found) return found;
+  if (process.env.NODE_ENV !== "production") {
+    diagnose("SP006", chart, { property: "inker", message: `Inker "${name}" is not registered.` });
+  }
+  return NullInker;
+}
+
+// src/config/resolve.ts
+var DEFAULTS = Object.freeze({
+  ground: "silverpoint",
+  substrate: "cream",
+  mode: "ink",
+  chrome: "card",
+  hatchFill: "tile",
+  height: 160,
+  dataTable: "hidden",
+  locale: "en"
+});
+function resolveConfig(props, provider = {}, environment = {}) {
+  const mode = environment.forcedPrecision ? "precision" : props.mode ?? provider.mode ?? DEFAULTS.mode;
+  return {
+    ground: props.ground ?? provider.ground ?? DEFAULTS.ground,
+    substrate: props.substrate ?? provider.substrate ?? DEFAULTS.substrate,
+    mode,
+    chrome: props.chrome ?? DEFAULTS.chrome,
+    hatchFill: props.hatchFill ?? DEFAULTS.hatchFill,
+    height: props.height ?? DEFAULTS.height,
+    dataTable: props.dataTable ?? DEFAULTS.dataTable,
+    locale: props.locale ?? provider.locale ?? environment.locale ?? DEFAULTS.locale
+  };
+}
+var FORCED_PRECISION_QUERY = "(prefers-contrast: more), (forced-colors: active)";
+function instanceId(chart, token) {
+  const slug = chart.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+  const safe = String(token).replace(/[^A-Za-z0-9_-]/g, "");
+  return `sp-${slug}-${safe}`;
+}
+
+// src/charts/shared/format.ts
+function read(accessor, datum, index) {
+  return typeof accessor === "function" ? accessor(datum, index) : datum[accessor];
+}
+function accessorName(accessor, fallback) {
+  return typeof accessor === "string" ? accessor : fallback;
+}
+var FORMATTERS = /* @__PURE__ */ new Map();
+var MAX_FORMATTERS = 64;
+function formatNumber(value, locale, options) {
+  const resolved = options ?? { maximumFractionDigits: 2 };
+  const read2 = [];
+  for (const name in resolved) read2.push(`${name}=${JSON.stringify(resolved[name])}`);
+  const key = `${locale}|${read2.sort().join("&")}`;
+  let formatter = FORMATTERS.get(key);
+  if (!formatter) {
+    if (FORMATTERS.size >= MAX_FORMATTERS) FORMATTERS.clear();
+    formatter = new Intl.NumberFormat(locale, resolved);
+    FORMATTERS.set(key, formatter);
+  }
+  return formatter.format(value);
+}
+function formatValue(value, locale, options) {
+  if (typeof value === "number") {
+    return Number.isFinite(value) ? formatNumber(value, locale, options) : "\u2014";
+  }
+  return value === null || value === void 0 ? "\u2014" : String(value);
+}
+function formatCategory(value, locale) {
+  return formatValue(value, locale, typeof value === "number" ? { useGrouping: false, maximumFractionDigits: 2 } : void 0);
+}
+function circlePath(cx, cy, r) {
+  return `M${cx - r},${cy}A${r},${r},0,1,0,${cx + r},${cy}A${r},${r},0,1,0,${cx - r},${cy}Z`;
+}
+
+// src/charts/shared/card.ts
+var CARD_PADDING = 16;
+var TITLE_ROW = 20;
+var VALUE_ROW = 52;
+var HEADER_GAP = 8;
+var FOOTER_ROW = 30;
+function cardLayout(props, options) {
+  const { width, areaHeight: areaHeight2, chrome, locale } = options;
+  if (chrome === "bare") {
+    const box = { x: 0, y: 0, width, height: areaHeight2 };
+    return { viewBox: box, area: box, strokes: [], labels: [] };
+  }
+  const labels = [];
+  const strokes = [];
+  const left = CARD_PADDING;
+  const right = width - CARD_PADDING;
+  let cursor = CARD_PADDING;
+  if (props.title !== void 0 || props.badge !== void 0) {
+    const baseline = cursor + 11;
+    if (props.title !== void 0) {
+      labels.push({ x: left, y: baseline, text: props.title, kind: "title", part: "text", anchor: "start" });
+    }
+    if (props.badge !== void 0) {
+      labels.push({ x: right, y: baseline, text: props.badge, kind: "badge", part: "axis", anchor: "end" });
+    }
+    cursor += TITLE_ROW;
+  }
+  if (props.value !== void 0 || props.unit !== void 0) {
+    if (props.value !== void 0) {
+      labels.push({
+        x: left,
+        y: cursor + 30,
+        text: formatValue(props.value, locale, props.numberFormat),
+        kind: "value",
+        part: "text",
+        anchor: "start"
+      });
+    }
+    if (props.unit !== void 0) {
+      labels.push({ x: left, y: cursor + 46, text: props.unit, kind: "unit", part: "axis", anchor: "start" });
+    }
+    cursor += VALUE_ROW;
+  }
+  if (cursor > CARD_PADDING) cursor += HEADER_GAP;
+  const area5 = { x: left, y: cursor, width: right - left, height: areaHeight2 };
+  cursor += areaHeight2;
+  if (props.footerLeft !== void 0 || props.footerRight !== void 0) {
+    const ruleY = cursor + 8;
+    strokes.push({ d: `M${left},${ruleY}H${right}`, role: "ornament", part: "rule" });
+    if (props.footerLeft !== void 0) {
+      labels.push({ x: left, y: ruleY + 18, text: props.footerLeft, kind: "footer", part: "axis", anchor: "start" });
+    }
+    if (props.footerRight !== void 0) {
+      labels.push({ x: right, y: ruleY + 18, text: props.footerRight, kind: "footer", part: "axis", anchor: "end" });
+    }
+    cursor += FOOTER_ROW;
+  }
+  const height = cursor + CARD_PADDING;
+  const inset2 = 0.5;
+  strokes.unshift({
+    d: `M${inset2},${inset2}H${width - inset2}V${height - inset2}H${inset2}Z`,
+    role: "ornament",
+    part: "rule"
+  });
+  return { viewBox: { x: 0, y: 0, width, height }, area: area5, strokes, labels };
+}
+
+// src/charts/shared/cells.ts
+function rectPath(rect) {
+  const { x, y, width, height } = rect;
+  return `M${x},${y}H${x + width}V${y + height}H${x}Z`;
+}
+function inset(rect, by) {
+  return {
+    x: rect.x + by,
+    y: rect.y + by,
+    width: Math.max(rect.width - 2 * by, 0),
+    height: Math.max(rect.height - 2 * by, 0)
+  };
+}
+function finite(raw) {
+  return typeof raw === "number" && Number.isFinite(raw) ? raw : void 0;
+}
+function toneOf(ratio) {
+  if (!(ratio > 0)) return 0;
+  if (ratio <= 0.25) return 1;
+  if (ratio <= 0.5) return 2;
+  if (ratio <= 0.75) return 3;
+  return 4;
+}
+function toneLevel(raw) {
+  return Math.min(Math.max(Math.round(raw), 0), 4);
+}
+function warnValue(chart, property, message) {
+  if (process.env.NODE_ENV !== "production") diagnose("SP002", chart, { property, message });
+}
+
+// src/charts/shared/cartesian.ts
+var AXIS_BAND = 20;
+var PLOT_INSET = 6;
+var LABEL_SPACING = 48;
+function cartesianPlot(area5) {
+  return {
+    x: area5.x + PLOT_INSET,
+    y: area5.y + PLOT_INSET,
+    width: Math.max(area5.width - 2 * PLOT_INSET, 1),
+    height: Math.max(area5.height - AXIS_BAND - PLOT_INSET, 1)
+  };
+}
+function readSeries(data, accessor, fallbackName) {
+  let missing = 0;
+  const points = data.map((datum, index) => {
+    const raw = read(accessor, datum, index);
+    const value = typeof raw === "number" && Number.isFinite(raw) ? raw : void 0;
+    if (value === void 0) missing += 1;
+    return { index, datum, value };
+  });
+  return { key: accessorName(accessor, fallbackName), points, missing };
+}
+var POINTS_PER_SERIES = 500;
+function checkVolume(chart, series) {
+  for (const s of series) checkCount(chart, s.key, s.points.length);
+}
+function checkCount(chart, property, count) {
+  if (process.env.NODE_ENV === "production" || count <= POINTS_PER_SERIES) return;
+  diagnose("SP008", chart, { property, message: `${count} points; the ceiling is ${POINTS_PER_SERIES} per series.` });
+}
+function seriesValues(series) {
+  return series.flatMap((s) => s.points.flatMap((p) => p.value === void 0 ? [] : [p.value]));
+}
+function valueAxis(plot, domain, options) {
+  const bottom = plot.y + plot.height;
+  const low = options.zero === false ? domain[0] : Math.min(0, domain[0]);
+  const high = options.zero === false ? domain[1] : Math.max(0, domain[1]);
+  const scale = linearScale([low, high], [bottom, plot.y], {
+    chart: options.chart,
+    property: options.property,
+    padding: options.padding,
+    nice: options.nice !== false,
+    fromZero: options.zero !== false
+  });
+  const strokes = [];
+  const labels = [];
+  for (const tick of scale.ticks(4)) {
+    const ty = scale(tick);
+    if (tick === scale.domain[0]) continue;
+    strokes.push({ d: `M${plot.x},${ty}H${plot.x + plot.width}`, role: "ornament", part: "grid" });
+    labels.push({ x: plot.x, y: ty - 3, text: formatNumber(tick, options.locale, options.numberFormat), kind: "tick", part: "axis", anchor: "start" });
+  }
+  strokes.push({ d: `M${plot.x},${bottom}H${plot.x + plot.width}`, role: "ornament", part: "rule" });
+  return { scale, strokes, labels };
+}
+function categoryAxis(xValues, plot, options) {
+  const numeric = options.numeric !== false && xValues.length > 0 && xValues.every((v) => typeof v === "number" && Number.isFinite(v));
+  if (numeric) {
+    const numbers = xValues;
+    const x = linearScale(extent(numbers) ?? [0, 0], [plot.x, plot.x + plot.width], {
+      chart: options.chart,
+      property: options.property,
+      padding: options.padding
+    });
+    return { at: (index) => x(numbers[index] ?? 0), bandwidth: 0 };
+  }
+  const keys = xValues.map((_, index) => String(index));
+  const band = bandScale(keys, [plot.x, plot.x + plot.width], { paddingInner: options.paddingInner, paddingOuter: options.paddingOuter });
+  return { at: (index) => band.center(String(index)) ?? plot.x, bandwidth: band.bandwidth };
+}
+function categoryLabels(texts, at2, area5, plot) {
+  const count = texts.length;
+  const step = Math.max(1, Math.ceil(count / Math.max(2, Math.floor(plot.width / LABEL_SPACING))));
+  const labels = [];
+  for (let index = 0; index < count; index += step) {
+    labels.push({
+      x: at2(index),
+      y: area5.y + area5.height - 5,
+      text: texts[index] ?? "",
+      kind: "tick",
+      part: "axis",
+      anchor: index === 0 ? "start" : "middle"
+    });
+  }
+  return labels;
+}
+var LEGEND_BAND = 22;
+var TICK_CHAR = 5.2;
+var LEGEND_CHAR = TICK_CHAR;
+function legend(area5, entries) {
+  const strokes = [];
+  const labels = [];
+  let x = area5.x + PLOT_INSET;
+  for (const entry of entries) {
+    const swatch = { x, y: area5.y + 4, width: 12, height: 7 };
+    strokes.push({ d: rectPath(swatch), role: "ornament", part: entry.part, ...entry.tone ? { tone: entry.tone } : {}, ...entry.dash ? { dash: entry.dash } : {} });
+    labels.push({ x: x + 16, y: area5.y + 11, text: entry.name, kind: "tick", part: "axis", anchor: "start" });
+    x += 16 + entry.name.length * LEGEND_CHAR + 12;
+  }
+  return { area: { x: area5.x, y: area5.y + LEGEND_BAND, width: area5.width, height: Math.max(area5.height - LEGEND_BAND, 1) }, strokes, labels };
+}
+function pillPath(rect) {
+  const { x, y, width, height } = rect;
+  const r = Math.min(width, height) / 2;
+  if (r <= 0) return `M${x},${y}H${x + width}V${y + height}H${x}Z`;
+  return `M${x},${y + r}A${r},${r},0,0,1,${x + r},${y}H${x + width - r}A${r},${r},0,0,1,${x + width},${y + r}V${y + height - r}A${r},${r},0,0,1,${x + width - r},${y + height}H${x + r}A${r},${r},0,0,1,${x},${y + height - r}Z`;
+}
+function horizontalValueAxis(plot, area5, domain, options) {
+  const scale = linearScale([Math.min(0, domain[0]), Math.max(0, domain[1])], [plot.x, plot.x + plot.width], {
+    chart: options.chart,
+    property: options.property,
+    padding: options.padding,
+    nice: true,
+    fromZero: true
+  });
+  const strokes = [];
+  const labels = [];
+  for (const tick of scale.ticks(4)) {
+    const tx = scale(tick);
+    if (tick !== 0) strokes.push({ d: `M${tx},${plot.y}V${plot.y + plot.height}`, role: "ornament", part: "grid" });
+    labels.push({ x: tx, y: area5.y + area5.height - 5, text: formatNumber(tick, options.locale, options.numberFormat), kind: "tick", part: "axis", anchor: "middle" });
+  }
+  strokes.push({ d: `M${scale(0)},${plot.y}V${plot.y + plot.height}`, role: "ornament", part: "rule" });
+  return { scale, strokes, labels };
+}
+
+// src/charts/shared/shell.ts
+function modelBase(chart, props, context, fallbackName, table) {
+  const { id } = context;
+  const name = props.label ?? props.title ?? fallbackName;
+  return {
+    chart,
+    id,
+    chrome: props.chrome ?? "card",
+    name,
+    ids: { title: `${id}-title`, desc: `${id}-desc`, table: `${id}-table` },
+    table: { caption: name, ...table },
+    dataTable: props.dataTable ?? "hidden"
+  };
+}
+function areaHeight(props) {
+  return props.height ?? 160;
+}
+function measure(base, props, context) {
+  const width = props.width ?? context.width;
+  const height = areaHeight(props);
+  if (width !== void 0 && width > 0 && height > 0) return { width, height };
+  if (width !== void 0 && process.env.NODE_ENV !== "production") {
+    diagnose("SP003", base.chart, {
+      property: width <= 0 ? "width" : "height",
+      message: `Measured ${width} \xD7 ${height} px.`
+    });
+  }
+  const box = { x: 0, y: 0, width: 0, height: 0 };
+  return {
+    deferred: {
+      ...base,
+      status: "deferred",
+      geometry: { viewBox: box, plot: box, strokes: [], labels: [], hitAreas: [], defs: [] },
+      description: props.description ?? base.name
+    }
+  };
+}
+function emptyModel(base, props, context, frame, datasetEmpty) {
+  if (datasetEmpty && process.env.NODE_ENV !== "production") {
+    diagnose("SP001", base.chart, { property: "data" });
+  }
+  const { plot } = frame;
+  const strokes = [...frame.strokes];
+  if (context.emptyState.rule) {
+    strokes.push({ d: `M${plot.x},${plot.y + plot.height}H${plot.x + plot.width}`, role: "ornament", part: "rule" });
+  }
+  const labels = [
+    ...frame.labels,
+    {
+      x: plot.x + plot.width / 2,
+      y: plot.y + plot.height / 2,
+      text: context.emptyState.text,
+      kind: "empty",
+      part: "axis",
+      anchor: "middle"
+    }
+  ];
+  return {
+    ...base,
+    status: "ready",
+    description: props.description ?? `${base.name}. ${context.emptyState.text}.`,
+    geometry: roundGeometry({ viewBox: frame.viewBox, plot, strokes, labels, hitAreas: [], defs: [] })
+  };
+}
+function readyModel(base, description, geometry) {
+  return { ...base, status: "ready", description, geometry: roundGeometry({ ...geometry, defs: [] }) };
+}
+
+// src/charts/line-chart/demo.ts
+var LINE_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { hour: "00", hits: 18, baseline: 22 },
+    { hour: "02", hits: 14, baseline: 18 },
+    { hour: "04", hits: 11, baseline: 15 },
+    { hour: "06", hits: 16, baseline: 17 },
+    { hour: "08", hits: 34, baseline: 30 },
+    { hour: "10", hits: 58, baseline: 48 },
+    { hour: "12", hits: 71, baseline: 60 },
+    { hour: "14", hits: 66, baseline: 62 },
+    { hour: "16", hits: 74, baseline: 64 },
+    { hour: "18", hits: 88, baseline: 70 },
+    { hour: "20", hits: 62, baseline: 55 },
+    { hour: "22", hits: 41, baseline: 40 }
+  ].map((row) => Object.freeze(row))
+);
+var LINE_CHART_DEMO_KEYS = /* @__PURE__ */ Object.freeze({
+  xKey: "hour",
+  valueKey: "hits",
+  secondaryKey: "baseline"
+});
+
+// src/charts/line-chart/line-chart.ts
+var CHART = "LineChart";
+var HEIGHTEN_RADIUS = 3.5;
+var CURVES = {
+  monotone: curveMonotoneX,
+  linear: curveLinear,
+  natural: curveNatural,
+  step: curveStepAfter
+};
+function buildLineChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? LINE_CHART_DEMO;
+  const xKey = usesDemo ? LINE_CHART_DEMO_KEYS.xKey : props.xKey ?? "x";
+  const valueKey = usesDemo ? LINE_CHART_DEMO_KEYS.valueKey : props.valueKey ?? "value";
+  const secondaryKey = usesDemo ? LINE_CHART_DEMO_KEYS.secondaryKey : props.secondaryKey;
+  const chrome = props.chrome ?? "card";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const primary = readSeries(data, valueKey, "value");
+  const secondary = secondaryKey !== void 0 && (props.series ?? "all") === "all" ? readSeries(data, secondaryKey, "secondary") : void 0;
+  const series = secondary ? [primary, secondary] : [primary];
+  checkVolume(CHART, series);
+  const xName = accessorName(xKey, "x");
+  const xValues = data.map((datum, index) => read(xKey, datum, index));
+  const xLabels = xValues.map((value) => formatCategory(value, locale));
+  const base = modelBase(CHART, props, context, "Line chart", {
+    columns: [xName, ...series.map((s) => s.key)],
+    rows: data.map((_, index) => [
+      xLabels[index] ?? "",
+      ...series.map((s) => formatValue(s.points[index]?.value, locale, numberFormat))
+    ])
+  });
+  const { name } = base;
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const { width } = size;
+  const card = cardLayout(props, { width, areaHeight: size.height, chrome, locale });
+  const { area: area5 } = card;
+  const plot = cartesianPlot(area5);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  for (const s of series) {
+    if (s.missing > 0 && data.length > 0 && process.env.NODE_ENV !== "production") {
+      diagnose("SP002", CHART, {
+        property: s.key,
+        message: `${s.missing} of ${data.length} values were omitted from the stroke; set \`connectNulls\` to bridge the gap.`
+      });
+    }
+  }
+  const valueExtent = extent(seriesValues(series));
+  if (data.length === 0 || valueExtent === void 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const axis = valueAxis(plot, valueExtent, { chart: CHART, property: primary.key, padding: context.domainPadding, locale, numberFormat });
+  const y = axis.scale;
+  strokes.push(...axis.strokes);
+  labels.push(...axis.labels);
+  const xAt = categoryAxis(xValues, plot, { chart: CHART, property: xName, padding: context.domainPadding }).at;
+  const curve = CURVES[props.curve ?? "monotone"];
+  const connectNulls = props.connectNulls ?? false;
+  const pathFor = (s) => {
+    const generator = line().x((p) => xAt(p.index)).y((p) => y(p.value ?? 0)).curve(curve);
+    const points = connectNulls ? s.points.filter((p) => p.value !== void 0) : s.points;
+    if (!connectNulls) generator.defined((p) => p.value !== void 0);
+    return generator(points) ?? "";
+  };
+  const ordered = secondary ? [secondary, primary] : [primary];
+  for (const s of ordered) {
+    const d = pathFor(s);
+    if (d === "") continue;
+    strokes.push(
+      s === primary ? { d, role: "encoding", part: "ink" } : { d, role: "encoding", part: "ink-secondary", dash: "dotted" }
+    );
+  }
+  for (const s of series) {
+    for (const p of s.points) {
+      if (p.value === void 0) continue;
+      hitAreas.push({
+        seriesKey: s.key,
+        index: p.index,
+        datum: p.datum,
+        value: p.value,
+        x: xAt(p.index),
+        y: y(p.value)
+      });
+    }
+  }
+  const live = [...primary.points].reverse().find((p) => p.value !== void 0);
+  if (live?.value !== void 0) {
+    const d = circlePath(xAt(live.index), y(live.value), HEIGHTEN_RADIUS);
+    strokes.push({ d, role: "encoding", part: "heighten", paint: "fill" });
+    strokes.push({ d, role: "encoding", part: "ink", paint: "stroke" });
+  }
+  const count = data.length;
+  labels.push(...categoryLabels(xLabels, xAt, area5, plot));
+  const ranges = series.map((s) => {
+    const seriesExtent = extent(s.points.flatMap((p) => p.value === void 0 ? [] : [p.value]));
+    return seriesExtent ? `${s.key} ranges from ${formatNumber(seriesExtent[0], locale, numberFormat)} to ${formatNumber(seriesExtent[1], locale, numberFormat)}` : `${s.key} has no values`;
+  });
+  const description = props.description ?? `${name}. Line chart of ${count} ${xName} values${secondary ? " in 2 series" : ""}; ${ranges.join("; ")}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var lineChart = /* @__PURE__ */ Object.freeze({
+  name: CHART,
+  build: buildLineChart
+});
+
+// src/interaction/hit-test.ts
+var MIN_TOUCH_TARGET = 24;
+function toActiveItem(hit) {
+  return {
+    seriesKey: hit.seriesKey,
+    index: hit.index,
+    datum: hit.datum,
+    value: hit.value,
+    point: { x: hit.x, y: hit.y }
+  };
+}
+function inside(rect, x, y) {
+  return x >= rect.x && x <= rect.x + rect.width && y >= rect.y && y <= rect.y + rect.height;
+}
+function spacing(hitAreas) {
+  let smallest = Number.POSITIVE_INFINITY;
+  for (let i = 1; i < hitAreas.length; i += 1) {
+    const previous = hitAreas[i - 1];
+    const current = hitAreas[i];
+    if (previous.seriesKey !== current.seriesKey) continue;
+    const gap = Math.abs(current.x - previous.x);
+    if (gap > 0 && gap < smallest) smallest = gap;
+  }
+  return smallest;
+}
+function resolveActive(geometry, pointer, kind = "mouse") {
+  if (!Number.isFinite(pointer.x) || !Number.isFinite(pointer.y)) return null;
+  if (!inside(geometry.plot, pointer.x, pointer.y)) return null;
+  let boxed;
+  for (const hit of geometry.hitAreas) {
+    if (!hit.box || !inside(hit.box, pointer.x, pointer.y)) continue;
+    if (!boxed?.box || hit.box.width * hit.box.height < boxed.box.width * boxed.box.height) boxed = hit;
+  }
+  if (boxed) return toActiveItem(boxed);
+  let best;
+  let bestDx = Number.POSITIVE_INFINITY;
+  let bestDy = Number.POSITIVE_INFINITY;
+  for (const hit of geometry.hitAreas) {
+    const dx = Math.abs(hit.x - pointer.x);
+    const dy = Math.abs(hit.y - pointer.y);
+    if (dx < bestDx || dx === bestDx && dy < bestDy) {
+      best = hit;
+      bestDx = dx;
+      bestDy = dy;
+    }
+  }
+  if (!best) return null;
+  if (kind === "touch") {
+    const reach = Math.max(MIN_TOUCH_TARGET / 2, spacing(geometry.hitAreas) / 2);
+    if (bestDx > reach) return null;
+  }
+  return toActiveItem(best);
+}
+function toSvgPoint(client, box, viewBox) {
+  if (box.width <= 0 || box.height <= 0) return { x: Number.NaN, y: Number.NaN };
+  return {
+    x: viewBox.x + (client.x - box.left) * viewBox.width / box.width,
+    y: viewBox.y + (client.y - box.top) * viewBox.height / box.height
+  };
+}
+var NAVIGATION_KEYS = ["ArrowRight", "ArrowDown", "ArrowLeft", "ArrowUp", "Home", "End", "Escape"];
+function stepActive(geometry, current, key) {
+  if (!NAVIGATION_KEYS.includes(key)) return void 0;
+  if (key === "Escape") return null;
+  const grid = geometry.hitAreas.length > 0 && geometry.hitAreas.every((hit) => hit.cell !== void 0);
+  if (grid) return stepGrid(geometry.hitAreas, current, key);
+  const seriesKey = current?.seriesKey ?? geometry.hitAreas[0]?.seriesKey;
+  const points = geometry.hitAreas.filter((hit) => hit.seriesKey === seriesKey);
+  if (points.length === 0) return null;
+  const position = current ? points.findIndex((hit) => hit.index === current.index) : -1;
+  let next;
+  switch (key) {
+    case "Home":
+      next = 0;
+      break;
+    case "End":
+      next = points.length - 1;
+      break;
+    case "ArrowRight":
+    case "ArrowDown":
+      next = position < 0 ? 0 : Math.min(position + 1, points.length - 1);
+      break;
+    default:
+      next = position < 0 ? 0 : Math.max(position - 1, 0);
+  }
+  return toActiveItem(points[next]);
+}
+function stepGrid(hits, current, key) {
+  const order = [...hits].sort((a, b) => (a.cell?.row ?? 0) - (b.cell?.row ?? 0) || (a.cell?.column ?? 0) - (b.cell?.column ?? 0));
+  const here = current ? hits.find((hit) => hit.seriesKey === current.seriesKey && hit.index === current.index) : void 0;
+  if (!here?.cell) return toActiveItem(key === "End" ? order.at(-1) : order[0]);
+  if (key === "Home" || key === "End") {
+    const row2 = order.filter((hit) => hit.cell?.row === here.cell?.row);
+    return toActiveItem(key === "End" ? row2.at(-1) : row2[0]);
+  }
+  const horizontal = key === "ArrowRight" || key === "ArrowLeft";
+  const sign = key === "ArrowRight" || key === "ArrowDown" ? 1 : -1;
+  const { column, row } = here.cell;
+  let next;
+  for (const hit of hits) {
+    if (!hit.cell) continue;
+    const along2 = horizontal ? hit.cell.column - column : hit.cell.row - row;
+    const across = horizontal ? hit.cell.row - row : hit.cell.column - column;
+    if (across !== 0 || along2 * sign <= 0) continue;
+    const best = next?.cell ? Math.abs(horizontal ? next.cell.column - column : next.cell.row - row) : Number.POSITIVE_INFINITY;
+    if (Math.abs(along2) < best) next = hit;
+  }
+  return toActiveItem(next ?? here);
+}
+function readout(model, active) {
+  const { geometry, table } = model;
+  const column = Math.max(table.columns.indexOf(active.seriesKey), 1);
+  const row = table.rows[active.index] ?? [];
+  const heading = row[0] ?? "";
+  const value = row[column] ?? String(active.value);
+  const { viewBox } = geometry;
+  const percent = (part, whole) => `${whole > 0 ? round2(part / whole * 100) : 0}%`;
+  return {
+    heading,
+    text: `${active.seriesKey}: ${value}`,
+    left: percent(active.point.x - viewBox.x, viewBox.width),
+    top: percent(active.point.y - viewBox.y, viewBox.height),
+    announcement: `${table.columns[0] ?? ""} ${heading}, ${active.seriesKey} ${value}`,
+    marker: { d: circlePath(active.point.x, active.point.y, 6), role: "ornament", part: "ink", paint: "stroke" }
+  };
+}
+
+// src/interaction/reduce.ts
+function sameActive(a, b) {
+  return a === b || a !== null && b !== null && a.seriesKey === b.seriesKey && a.index === b.index;
+}
+var SELECT_KEYS = ["Enter", " "];
+function reduceInteraction(geometry, current, event) {
+  const settle = (active, extra = {}) => ({
+    active,
+    changed: !sameActive(current, active),
+    handled: true,
+    ...extra
+  });
+  switch (event.type) {
+    case "pointer":
+    case "click": {
+      const active = resolveActive(geometry, toSvgPoint(event.client, event.box, geometry.viewBox), event.kind);
+      return event.type === "click" && active ? settle(active, { selected: active }) : settle(active);
+    }
+    case "leave":
+    case "blur":
+      return settle(null);
+    case "focus":
+      return settle(current ?? stepActive(geometry, null, "Home") ?? null);
+    case "key": {
+      if (SELECT_KEYS.includes(event.key)) {
+        return current ? settle(current, { selected: current }) : { active: null, changed: false, handled: false };
+      }
+      const next = stepActive(geometry, current, event.key);
+      return next === void 0 ? { active: current, changed: false, handled: false } : settle(next);
+    }
+  }
+}
+
+// src/charts/bullet-chart/demo.ts
+var BULLET_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { title: "Revenue", actual: 72, target: 80 },
+    { title: "Profit", actual: 58, target: 65 },
+    { title: "New users", actual: 86, target: 75 },
+    { title: "Retention", actual: 41, target: 60 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/bullet-chart/bullet-chart.ts
+var CHART2 = "BulletChart";
+var PLOT_INSET2 = 6;
+var MAX_BAR = 12;
+var MARKER_REACH = 3;
+function clampPercent(value, property, row) {
+  if (value >= 0 && value <= 100) return value;
+  warnValue(CHART2, property, `Row ${row} is ${value}; it is drawn at the nearest end of 0-100.`);
+  return Math.min(Math.max(value, 0), 100);
+}
+function buildBulletChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? BULLET_CHART_DEMO;
+  const titleKey = usesDemo ? "title" : props.titleKey ?? "title";
+  const actualKey = usesDemo ? "actual" : props.actualKey ?? "actual";
+  const targetKey = usesDemo ? "target" : props.targetKey ?? "target";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const rows = data.map((datum, index) => ({
+    index,
+    datum,
+    title: formatCategory(read(titleKey, datum, index), locale),
+    actual: finite(read(actualKey, datum, index)),
+    target: finite(read(targetKey, datum, index))
+  }));
+  const actualName = accessorName(actualKey, "actual");
+  const targetName = accessorName(targetKey, "target");
+  const base = modelBase(CHART2, props, context, "Bullet chart", {
+    columns: [accessorName(titleKey, "title"), actualName, targetName],
+    rows: rows.map((r) => [r.title, formatValue(r.actual, locale, numberFormat), formatValue(r.target, locale, numberFormat)])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = inset(card.area, PLOT_INSET2);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (rows.length === 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, true);
+  }
+  const rowHeight = plot.height / rows.length;
+  const barHeight = Math.min(MAX_BAR, rowHeight * 0.35);
+  const at2 = (percent) => plot.x + percent / 100 * plot.width;
+  let met = 0;
+  for (const row of rows) {
+    const top = plot.y + row.index * rowHeight;
+    const barY = top + rowHeight - barHeight - Math.min(MARKER_REACH + 1, rowHeight * 0.1);
+    const baseline = barY - 5;
+    labels.push({ x: plot.x, y: baseline, text: row.title, kind: "tick", part: "text", anchor: "start" });
+    strokes.push({ d: rectPath({ x: plot.x, y: barY, width: plot.width, height: barHeight }), role: "ornament", part: "rule" });
+    if (row.actual === void 0) {
+      warnValue(CHART2, actualName, `Row ${row.index} has no finite value; its bar is omitted.`);
+    } else {
+      const actual = clampPercent(row.actual, actualName, row.index);
+      const bar = { x: plot.x, y: barY, width: at2(actual) - plot.x, height: barHeight };
+      if (bar.width > 0) strokes.push({ d: rectPath(bar), role: "encoding", part: "ink", tone: 2 });
+      labels.push({ x: plot.x + plot.width, y: baseline, text: formatNumber(row.actual, locale, numberFormat), kind: "tick", part: "axis", anchor: "end" });
+      hitAreas.push({ seriesKey: actualName, index: row.index, datum: row.datum, value: row.actual, x: at2(actual), y: barY + barHeight / 2, box: bar });
+      if (row.target !== void 0 && row.actual >= row.target) met += 1;
+    }
+    if (row.target === void 0) {
+      warnValue(CHART2, targetName, `Row ${row.index} has no finite target; its marker is omitted.`);
+    } else {
+      const x = at2(clampPercent(row.target, targetName, row.index));
+      strokes.push({ d: `M${x},${barY - MARKER_REACH}V${barY + barHeight + MARKER_REACH}`, role: "encoding", part: "ink", weight: 2 });
+    }
+  }
+  const description = props.description ?? `${base.name}. Bullet chart of ${rows.length} targets on a 0 to 100 scale; ${met} of ${rows.length} reach their target.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var bulletChart = /* @__PURE__ */ Object.freeze({
+  name: CHART2,
+  build: buildBulletChart
+});
+
+// src/charts/pyramid-chart/demo.ts
+var PYRAMID_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { label: "Leads", width: 18 },
+    { label: "Managers", width: 42 },
+    { label: "Specialists", width: 70 },
+    { label: "Staff", width: 100 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/pyramid-chart/pyramid-chart.ts
+var CHART3 = "PyramidChart";
+var PLOT_INSET3 = 6;
+var LABEL_COLUMN = 72;
+var VALUE_COLUMN = 48;
+var TIER_GAP = 2;
+function buildPyramidChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? PYRAMID_CHART_DEMO;
+  const labelKey = usesDemo ? "label" : props.labelKey ?? "label";
+  const widthKey = usesDemo ? "width" : props.widthKey ?? "width";
+  const toneKey = usesDemo ? void 0 : props.toneKey;
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const widthName = accessorName(widthKey, "width");
+  const toneName = toneKey === void 0 ? void 0 : accessorName(toneKey, "tone");
+  const rows = data.map((datum, index) => ({
+    index,
+    datum,
+    label: formatCategory(read(labelKey, datum, index), locale),
+    width: finite(read(widthKey, datum, index)),
+    tone: toneKey === void 0 ? void 0 : finite(read(toneKey, datum, index))
+  }));
+  const base = modelBase(CHART3, props, context, "Pyramid chart", {
+    columns: [accessorName(labelKey, "label"), widthName, ...toneName ? [toneName] : []],
+    rows: rows.map((r) => [
+      r.label,
+      formatValue(r.width, locale, numberFormat),
+      ...toneName ? [formatValue(r.tone, locale, void 0)] : []
+    ])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = inset(card.area, PLOT_INSET3);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (rows.length === 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, true);
+  }
+  const track = { x: plot.x + LABEL_COLUMN, width: Math.max(plot.width - LABEL_COLUMN - VALUE_COLUMN, 1) };
+  const centre = track.x + track.width / 2;
+  const tierHeight = plot.height / rows.length;
+  let previous = Number.NEGATIVE_INFINITY;
+  let monotonic = true;
+  for (const row of rows) {
+    const top = plot.y + row.index * tierHeight;
+    const baseline = top + tierHeight / 2 + 4;
+    labels.push({ x: plot.x, y: baseline, text: row.label, kind: "tick", part: "text", anchor: "start" });
+    if (row.width === void 0) {
+      warnValue(CHART3, widthName, `Tier ${row.index} has no finite width; it is omitted.`);
+      continue;
+    }
+    if (row.width < previous) monotonic = false;
+    previous = row.width;
+    const percent = Math.min(Math.max(row.width, 0), 100);
+    if (percent !== row.width) warnValue(CHART3, widthName, `Tier ${row.index} is ${row.width}; it is drawn at the nearest end of 0-100.`);
+    const width = percent / 100 * track.width;
+    const tier = { x: centre - width / 2, y: top + TIER_GAP / 2, width, height: Math.max(tierHeight - TIER_GAP, 0) };
+    const tone = row.tone === void 0 ? toneOf(percent / 100) : toneLevel(row.tone);
+    if (row.tone !== void 0 && tone !== row.tone) {
+      warnValue(CHART3, toneName ?? "tone", `Tier ${row.index} has tone ${row.tone}; it is drawn at level ${tone}.`);
+    }
+    if (width > 0) strokes.push({ d: rectPath(tier), role: "encoding", part: "ink", ...tone > 0 ? { tone } : {} });
+    const right = plot.x + plot.width;
+    labels.push({ x: right, y: baseline, text: formatNumber(row.width, locale, numberFormat), kind: "tick", part: "axis", anchor: "end" });
+    if (row.tone !== void 0) {
+      labels.push({ x: right, y: baseline + 11, text: `tone ${tone}`, kind: "tick", part: "axis", anchor: "end" });
+    }
+    hitAreas.push({ seriesKey: widthName, index: row.index, datum: row.datum, value: row.width, x: centre, y: tier.y + tier.height / 2, box: tier });
+  }
+  if (!monotonic) warnValue(CHART3, widthName, "The widths do not increase from the top tier down; the pyramid is drawn as given.");
+  const description = props.description ?? `${base.name}. Pyramid of ${rows.length} tiers, from ${rows[0]?.label} at the top to ${rows[rows.length - 1]?.label} at the base; width on a 0 to 100 scale.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var pyramidChart = /* @__PURE__ */ Object.freeze({
+  name: CHART3,
+  build: buildPyramidChart
+});
+
+// src/charts/heatmap-chart/demo.ts
+var HEATMAP_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { label: "Mon", values: Object.freeze([12, 34, 58, 71, 66, 40]) },
+    { label: "Tue", values: Object.freeze([18, 42, 77, 88, 70, 35]) },
+    { label: "Wed", values: Object.freeze([9, 38, 64, 93, 81, 47]) },
+    { label: "Thu", values: Object.freeze([15, 29, 55, 68, 59, 31]) },
+    { label: "Fri", values: Object.freeze([6, 21, 43, 49, 37, 14]) }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/heatmap-chart/heatmap-chart.ts
+var CHART4 = "HeatmapChart";
+var PLOT_INSET4 = 6;
+var LABEL_COLUMN2 = 40;
+var CELL_GAP = 2;
+var HEADER_BAND = 14;
+var DIGIT_WIDTH = 5.5;
+var LINE_HEIGHT = 12;
+var CELL_SCALE = { 0: 0.4, 1: 0.55, 2: 0.7, 3: 0.85, 4: 1 };
+function buildHeatmapChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? HEATMAP_CHART_DEMO;
+  const labelKey = usesDemo ? "label" : props.labelKey ?? "label";
+  const valuesKey = usesDemo ? "values" : props.valuesKey ?? "values";
+  const scaleMax = props.scaleMax !== void 0 && props.scaleMax > 0 ? props.scaleMax : 100;
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const rows = data.map((datum, index) => {
+    const raw = read(valuesKey, datum, index);
+    return {
+      index,
+      datum,
+      label: formatCategory(read(labelKey, datum, index), locale),
+      values: Array.isArray(raw) ? raw.map(finite) : void 0
+    };
+  });
+  const lengths = rows.flatMap((r) => r.values ? [r.values.length] : []);
+  const columnCount = lengths.length > 0 ? lengths.reduce((a, b) => Math.min(a, b)) : 0;
+  const named = props.columnLabels ?? [];
+  const columns = Array.from({ length: columnCount }, (_, i) => named[i] ?? `#${i + 1}`);
+  const base = modelBase(CHART4, props, context, "Heatmap", {
+    columns: [accessorName(labelKey, "label"), ...columns],
+    rows: rows.map((r) => [r.label, ...columns.map((_, c) => formatValue(r.values?.[c], locale, numberFormat))])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = inset(card.area, PLOT_INSET4);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  const valuesName = accessorName(valuesKey, "values");
+  for (const row of rows) {
+    if (!row.values) warnValue(CHART4, valuesName, `Row ${row.index} has no array of values; it is left blank.`);
+  }
+  if (lengths.some((length) => length !== columnCount)) {
+    warnValue(CHART4, valuesName, `Rows have ${columnCount} to ${lengths.reduce((a, b) => Math.max(a, b))} values; the first ${columnCount} of each are drawn.`);
+  }
+  if (named.length > columnCount && columnCount > 0) {
+    warnValue(CHART4, "columnLabels", `${named.length} column labels for ${columnCount} columns; the extra ones are ignored.`);
+  }
+  const drawable = rows.some((r) => r.values?.slice(0, columnCount).some((v) => v !== void 0));
+  if (!drawable) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, rows.length === 0);
+  }
+  const header = named.length > 0 ? HEADER_BAND : 0;
+  const cellWidth = (plot.width - LABEL_COLUMN2) / columnCount;
+  const cellHeight = (plot.height - header) / rows.length;
+  if (header > 0) {
+    columns.forEach((name, c) => {
+      labels.push({ x: plot.x + LABEL_COLUMN2 + (c + 0.5) * cellWidth, y: plot.y + 10, text: name, kind: "tick", part: "axis", anchor: "middle" });
+    });
+  }
+  let widest = 0;
+  for (const r of rows) for (const v of r.values ?? []) if (v !== void 0) widest = Math.max(widest, formatNumber(v, locale, numberFormat).length);
+  const printed = widest * DIGIT_WIDTH <= cellWidth - CELL_GAP - 2 && cellHeight >= LINE_HEIGHT;
+  let omitted = 0;
+  for (const row of rows) {
+    const top = plot.y + header + row.index * cellHeight;
+    labels.push({ x: plot.x, y: top + cellHeight / 2 + 4, text: row.label, kind: "tick", part: "text", anchor: "start" });
+    for (let c = 0; c < columnCount; c += 1) {
+      const value = row.values?.[c];
+      const cell = inset({ x: plot.x + LABEL_COLUMN2 + c * cellWidth, y: top, width: cellWidth, height: cellHeight }, CELL_GAP / 2);
+      const cx = cell.x + cell.width / 2;
+      const cy = cell.y + cell.height / 2;
+      if (value === void 0) {
+        omitted += 1;
+        if (printed) labels.push({ x: cx, y: cy + 4, text: "\u2014", kind: "tick", part: "axis", anchor: "middle" });
+        continue;
+      }
+      const tone = toneOf(value / scaleMax);
+      const scale = printed ? 1 : CELL_SCALE[tone];
+      const drawn = { x: cx - cell.width * scale / 2, y: cy - cell.height * scale / 2, width: cell.width * scale, height: cell.height * scale };
+      strokes.push({ d: rectPath(drawn), role: "encoding", part: "ink", ...tone > 0 ? { tone } : {} });
+      if (printed) labels.push({ x: cx, y: cy + 4, text: formatNumber(value, locale, numberFormat), kind: "tick", part: "text", anchor: "middle" });
+      hitAreas.push({ seriesKey: columns[c], index: row.index, datum: row.datum, value, x: cx, y: cy, box: cell, cell: { column: c, row: row.index } });
+    }
+  }
+  if (omitted > 0) warnValue(CHART4, valuesName, `${omitted} cells have no finite value and are left blank.`);
+  let low = Number.POSITIVE_INFINITY;
+  let high = Number.NEGATIVE_INFINITY;
+  for (const h of hitAreas) {
+    low = Math.min(low, h.value);
+    high = Math.max(high, h.value);
+  }
+  const description = props.description ?? `${base.name}. Heatmap of ${rows.length} rows by ${columnCount} columns, toned against ${formatNumber(scaleMax, locale, numberFormat)}; values range from ${formatNumber(low, locale, numberFormat)} to ${formatNumber(high, locale, numberFormat)}${printed ? "" : "; values are shown by cell size"}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var heatmapChart = /* @__PURE__ */ Object.freeze({
+  name: CHART4,
+  build: buildHeatmapChart
+});
+
+// src/charts/treemap-chart/demo.ts
+var TREEMAP_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { label: "Search", share: 48, cols: 3, rows: 4 },
+    { label: "Direct", share: 26, cols: 3, rows: 2 },
+    { label: "Social", share: 17, cols: 2, rows: 2 },
+    { label: "Email", share: 9, cols: 1, rows: 2 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/treemap-chart/treemap-chart.ts
+var CHART5 = "TreemapChart";
+var PLOT_INSET5 = 6;
+var TILE_GAP = 3;
+var TEXT_INSET = 6;
+var LINE = 13;
+var DEFAULT_COLUMNS = 6;
+var DEFAULT_ROWS = 4;
+var wholeCount = (raw) => {
+  const value = finite(raw);
+  return value !== void 0 && Number.isInteger(value) && value > 0 ? value : void 0;
+};
+function place(taken, cols, rows) {
+  const gridRows = taken.length;
+  const gridColumns = taken[0]?.length ?? 0;
+  for (let row = 0; row + rows <= gridRows; row += 1) {
+    for (let column = 0; column + cols <= gridColumns; column += 1) {
+      let free = true;
+      for (let r = row; r < row + rows && free; r += 1) {
+        for (let c = column; c < column + cols && free; c += 1) free = !taken[r]?.[c];
+      }
+      if (!free) continue;
+      for (let r = row; r < row + rows; r += 1) for (let c = column; c < column + cols; c += 1) taken[r][c] = true;
+      return { column, row };
+    }
+  }
+  return void 0;
+}
+function buildTreemapChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? TREEMAP_CHART_DEMO;
+  const labelKey = usesDemo ? "label" : props.labelKey ?? "label";
+  const shareKey = usesDemo ? "share" : props.shareKey ?? "share";
+  const gridColumns = wholeCount(props.columns) ?? DEFAULT_COLUMNS;
+  const gridRows = wholeCount(props.rows) ?? DEFAULT_ROWS;
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const shareName = accessorName(shareKey, "share");
+  const tiles = data.map((datum, index) => ({
+    index,
+    datum,
+    label: formatCategory(read(labelKey, datum, index), locale),
+    share: finite(read(shareKey, datum, index)),
+    cols: wholeCount(datum.cols),
+    rows: wholeCount(datum.rows),
+    tone: finite(datum.tone)
+  }));
+  const shareText = (share) => share === void 0 ? "\u2014" : `${formatNumber(share, locale, numberFormat)}%`;
+  const base = modelBase(CHART5, props, context, "Treemap", {
+    columns: [accessorName(labelKey, "label"), shareName],
+    rows: tiles.map((t) => [t.label, shareText(t.share)])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = inset(card.area, PLOT_INSET5);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  const taken = Array.from({ length: gridRows }, () => Array(gridColumns).fill(false));
+  const cellWidth = plot.width / gridColumns;
+  const cellHeight = plot.height / gridRows;
+  const placed = [];
+  for (const tile of tiles) {
+    if (tile.cols === void 0 || tile.rows === void 0) {
+      warnValue(CHART5, "cols", `Tile ${tile.index} needs whole, positive cols and rows; it is omitted.`);
+      continue;
+    }
+    const spot = place(taken, tile.cols, tile.rows);
+    if (!spot) {
+      warnValue(CHART5, "cols", `Tile ${tile.index} (${tile.cols} \xD7 ${tile.rows}) no longer fits the ${gridColumns} \xD7 ${gridRows} grid; it is omitted.`);
+      continue;
+    }
+    const box = { x: plot.x + spot.column * cellWidth, y: plot.y + spot.row * cellHeight, width: tile.cols * cellWidth, height: tile.rows * cellHeight };
+    const drawn = inset(box, TILE_GAP / 2);
+    const tone = tile.tone === void 0 ? toneOf((tile.share ?? 0) / 100) : toneLevel(tile.tone);
+    strokes.push({ d: rectPath(drawn), role: "encoding", part: "ink", ...tone > 0 ? { tone } : {} });
+    const x = drawn.x + TEXT_INSET;
+    labels.push({ x, y: drawn.y + LINE, text: tile.label, kind: "tick", part: "text", anchor: "start" });
+    labels.push({ x, y: drawn.y + 2 * LINE, text: shareText(tile.share), kind: "tick", part: "axis", anchor: "start" });
+    if (tile.tone !== void 0) labels.push({ x, y: drawn.y + 3 * LINE, text: `tone ${tone}`, kind: "tick", part: "axis", anchor: "start" });
+    placed.push(tile);
+    hitAreas.push({ seriesKey: shareName, index: tile.index, datum: tile.datum, value: tile.share ?? 0, x: box.x + box.width / 2, y: box.y + box.height / 2, box });
+  }
+  if (hitAreas.length === 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, tiles.length === 0);
+  }
+  const description = props.description ?? `${base.name}. Treemap of ${hitAreas.length} tiles in a ${gridColumns} by ${gridRows} grid; ${placed.map((t) => `${t.label} ${shareText(t.share)}`).join(", ")}${placed.length < tiles.length ? `; ${tiles.length - placed.length} omitted` : ""}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var treemapChart = /* @__PURE__ */ Object.freeze({
+  name: CHART5,
+  build: buildTreemapChart
+});
+
+// src/charts/sankey-chart/demo.ts
+var SANKEY_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { source: "Search", target: "Visit", value: 48 },
+    { source: "Social", target: "Visit", value: 27 },
+    { source: "Email", target: "Visit", value: 15 },
+    { source: "Visit", target: "Signup", value: 42 },
+    { source: "Visit", target: "Bounce", value: 48 },
+    { source: "Signup", target: "Paid", value: 18 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/sankey-chart/sankey-chart.ts
+var CHART6 = "SankeyChart";
+var PLOT_INSET6 = 6;
+var NODE_WIDTH = 8;
+var NODE_GAP = 10;
+var MAX_GAP_SHARE = 0.5;
+var LABEL_GAP = 4;
+function reaches(edges, from, to) {
+  const stack = [from];
+  const seen = /* @__PURE__ */ new Set();
+  while (stack.length > 0) {
+    const name = stack.pop();
+    if (name === to) return true;
+    if (seen.has(name)) continue;
+    seen.add(name);
+    stack.push(...edges.get(name) ?? []);
+  }
+  return false;
+}
+function buildSankeyChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? SANKEY_CHART_DEMO;
+  const sourceKey = usesDemo ? "source" : props.sourceKey ?? "source";
+  const targetKey = usesDemo ? "target" : props.targetKey ?? "target";
+  const valueKey = usesDemo ? "value" : props.valueKey ?? "value";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const valueName = accessorName(valueKey, "value");
+  const flows = [];
+  const edges = /* @__PURE__ */ new Map();
+  data.forEach((datum, index) => {
+    const rawSource = read(sourceKey, datum, index);
+    const rawTarget = read(targetKey, datum, index);
+    const missing = rawSource === null || rawSource === void 0 ? "source" : rawTarget === null || rawTarget === void 0 ? "target" : void 0;
+    if (missing) {
+      warnValue(CHART6, accessorName(missing === "source" ? sourceKey : targetKey, missing), `Flow ${index} has no ${missing}; it is omitted.`);
+      return;
+    }
+    const source = formatCategory(rawSource, locale);
+    const target = formatCategory(rawTarget, locale);
+    const value = finite(read(valueKey, datum, index));
+    if (value === void 0 || value <= 0) {
+      warnValue(CHART6, valueName, `Flow ${index} (${source} \u2192 ${target}) is ${String(value ?? "not finite")}; flows must be positive, so it is omitted.`);
+      return;
+    }
+    if (reaches(edges, target, source)) {
+      warnValue(CHART6, accessorName(targetKey, "target"), `Flow ${index} (${source} \u2192 ${target}) would close a cycle; it is omitted.`);
+      return;
+    }
+    edges.set(source, [...edges.get(source) ?? [], target]);
+    flows.push({ index, datum, source, target, value });
+  });
+  const base = modelBase(CHART6, props, context, "Sankey diagram", {
+    columns: ["flow", valueName],
+    rows: flows.map((f) => [`${f.source} \u2192 ${f.target}`, formatNumber(f.value, locale, numberFormat)])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = inset(card.area, PLOT_INSET6);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (flows.length === 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const nodes = /* @__PURE__ */ new Map();
+  const node = (name) => {
+    let found = nodes.get(name);
+    if (!found) {
+      found = { name, layer: 0, inflow: 0, outflow: 0, x: 0, y: 0, height: 0, outCursor: 0, inCursor: 0 };
+      nodes.set(name, found);
+    }
+    return found;
+  };
+  for (const flow of flows) {
+    node(flow.source).outflow += flow.value;
+    node(flow.target).inflow += flow.value;
+  }
+  for (let pass = 0; pass < nodes.size; pass += 1) {
+    for (const flow of flows) {
+      const target = node(flow.target);
+      target.layer = Math.max(target.layer, node(flow.source).layer + 1);
+    }
+  }
+  const layers = [];
+  for (const n of nodes.values()) (layers[n.layer] ??= []).push(n);
+  const throughput = (n) => Math.max(n.inflow, n.outflow);
+  const gapOf = (count) => count > 1 ? Math.min(NODE_GAP, plot.height * MAX_GAP_SHARE / (count - 1)) : 0;
+  const crowded = layers.filter((layer) => layer.length > 1 && gapOf(layer.length) < NODE_GAP);
+  if (crowded.length > 0) {
+    warnValue(CHART6, accessorName(targetKey, "target"), `A layer of ${Math.max(...crowded.map((l) => l.length))} nodes is crowded; its gaps are narrowed to fit.`);
+  }
+  const scale = layers.reduce(
+    (smallest, layer) => Math.min(smallest, (plot.height - (layer.length - 1) * gapOf(layer.length)) / layer.reduce((sum, n) => sum + throughput(n), 0)),
+    Number.POSITIVE_INFINITY
+  );
+  const step = layers.length > 1 ? (plot.width - NODE_WIDTH) / (layers.length - 1) : 0;
+  layers.forEach((layer, index) => {
+    const gap = gapOf(layer.length);
+    const height = layer.reduce((sum, n) => sum + throughput(n) * scale, 0) + (layer.length - 1) * gap;
+    let y = plot.y + (plot.height - height) / 2;
+    for (const n of layer) {
+      n.x = plot.x + index * step;
+      n.y = y;
+      n.height = throughput(n) * scale;
+      n.outCursor = y;
+      n.inCursor = y;
+      y += n.height + gap;
+    }
+  });
+  flows.forEach((flow, row) => {
+    const source = node(flow.source);
+    const target = node(flow.target);
+    const width = flow.value * scale;
+    const x0 = source.x + NODE_WIDTH;
+    const x1 = target.x;
+    const y0 = source.outCursor;
+    const y1 = target.inCursor;
+    source.outCursor += width;
+    target.inCursor += width;
+    const mx = (x0 + x1) / 2;
+    const d = `M${x0},${y0}C${mx},${y0},${mx},${y1},${x1},${y1}V${y1 + width}C${mx},${y1 + width},${mx},${y0 + width},${x0},${y0 + width}Z`;
+    strokes.push({ d, role: "encoding", part: "ink-secondary", tone: 1 });
+    hitAreas.push({ seriesKey: valueName, index: row, datum: flow.datum, value: flow.value, x: mx, y: (y0 + y1) / 2 + width / 2 });
+  });
+  const last = layers.length - 1;
+  for (const n of nodes.values()) {
+    strokes.push({ d: rectPath({ x: n.x, y: n.y, width: NODE_WIDTH, height: n.height }), role: "encoding", part: "ink", tone: 3 });
+    const end = n.layer === last && last > 0;
+    labels.push({
+      x: end ? n.x - LABEL_GAP : n.x + NODE_WIDTH + LABEL_GAP,
+      y: n.y + n.height / 2 + 4,
+      text: `${n.name} ${formatNumber(throughput(n), locale, numberFormat)}`,
+      kind: "tick",
+      part: "text",
+      anchor: end ? "end" : "start"
+    });
+  }
+  const total = [...nodes.values()].filter((n) => n.inflow === 0).reduce((sum, n) => sum + n.outflow, 0);
+  const description = props.description ?? `${base.name}. Sankey diagram of ${flows.length} flows between ${nodes.size} nodes in ${layers.length} layers; total flow of ${formatNumber(total, locale, numberFormat)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var sankeyChart = /* @__PURE__ */ Object.freeze({
+  name: CHART6,
+  build: buildSankeyChart
+});
+
+// src/charts/activity-grid/demo.ts
+var ACTIVITY_GRID_DEMO_END = "2026-06-30";
+var ACTIVITY_GRID_DEMO_SEED = 1592;
+var DAYS = 26 * 7;
+var ACTIVITY_GRID_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ (() => {
+    const next = createPrng(ACTIVITY_GRID_DEMO_SEED);
+    const first = parseIsoDate(ACTIVITY_GRID_DEMO_END) - (DAYS - 1);
+    return Array.from({ length: DAYS }, (_, i) => {
+      const day = first + i;
+      const weekend = weekday(day) === 0 || weekday(day) === 6;
+      const r = next();
+      const count = Math.floor(r * r * (weekend ? 5 : 14));
+      const level = count === 0 ? 0 : count <= 2 ? 1 : count <= 5 ? 2 : count <= 9 ? 3 : 4;
+      return Object.freeze({ date: isoDate(day), count, level });
+    });
+  })()
+);
+
+// src/charts/activity-grid/activity-grid.ts
+var CHART7 = "ActivityGrid";
+var PLOT_INSET7 = 6;
+var MONTH_BAND = 14;
+var DEFAULT_WEEKS = 26;
+var DAY_MS2 = 864e5;
+var CELL_SCALE2 = { 0: 0.4, 1: 0.55, 2: 0.7, 3: 0.85, 4: 1 };
+var CELL_FILL = 0.86;
+var MONTH_GAP = 3;
+function buildActivityGrid(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? ACTIVITY_GRID_DEMO;
+  const dateKey = usesDemo ? "date" : props.dateKey ?? "date";
+  const countKey = usesDemo ? "count" : props.countKey ?? "count";
+  const levelKey = usesDemo ? "level" : props.levelKey ?? "level";
+  const weeks = props.weeks !== void 0 && Number.isInteger(props.weeks) && props.weeks > 0 ? props.weeks : DEFAULT_WEEKS;
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const countName = accessorName(countKey, "count");
+  const levelName = accessorName(levelKey, "level");
+  const parsed = [];
+  data.forEach((datum, index) => {
+    const iso = String(read(dateKey, datum, index));
+    const day = parseIsoDate(iso);
+    if (Number.isNaN(day) || isoDate(day) !== iso) {
+      warnValue(CHART7, accessorName(dateKey, "date"), `Row ${index} (${iso}) is not a calendar date in ISO form; it is omitted.`);
+      return;
+    }
+    const raw = finite(read(levelKey, datum, index));
+    const level = raw === void 0 ? 0 : toneLevel(raw);
+    if (raw !== level) warnValue(CHART7, levelName, `Row ${index} has level ${String(raw)}; it is drawn at level ${level}.`);
+    parsed.push({ datum, day, count: finite(read(countKey, datum, index)), level });
+  });
+  let days = [...parsed].sort((a, b) => a.day - b.day);
+  const unique = days.filter((d, i) => i === 0 || d.day !== days[i - 1]?.day);
+  if (unique.length < days.length) {
+    warnValue(CHART7, accessorName(dateKey, "date"), `${days.length - unique.length} rows repeat a date; the first row of each day is kept.`);
+    days = unique;
+  }
+  const partial = days.length % 7;
+  if (partial > 0) {
+    warnValue(CHART7, "data", `${days.length} days are not whole weeks; the oldest ${partial} are omitted.`);
+    days = days.slice(partial);
+  }
+  days = days.slice(-weeks * 7);
+  if (days.some((d, i) => i > 0 && d.day !== (days[i - 1]?.day ?? 0) + 1)) {
+    warnValue(CHART7, accessorName(dateKey, "date"), "The dates are not consecutive; cells are placed by position, one per row.");
+  }
+  const base = modelBase(CHART7, props, context, "Activity grid", {
+    columns: [accessorName(dateKey, "date"), countName, levelName],
+    rows: days.map((d) => [isoDate(d.day), formatValue(d.count, locale, numberFormat), String(d.level)])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = inset(card.area, PLOT_INSET7);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (days.length === 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const columns = days.length / 7;
+  const slot = Math.min(plot.width / columns, (plot.height - MONTH_BAND) / 7);
+  const top = plot.y + MONTH_BAND;
+  const month = new Intl.DateTimeFormat(locale, { month: "short", timeZone: "UTC" });
+  const months = [];
+  days.forEach((d, index) => {
+    const column = Math.floor(index / 7);
+    const row = index % 7;
+    if (row === 0) {
+      const name = month.format(new Date(d.day * DAY_MS2));
+      const last = months.at(-1);
+      if (name !== last?.name) {
+        if (last && column - last.column < MONTH_GAP) {
+          if (months.length === 1) months[0] = { column, name };
+        } else {
+          months.push({ column, name });
+        }
+      }
+    }
+    const side = slot * CELL_FILL * CELL_SCALE2[d.level];
+    const cx = plot.x + column * slot + slot / 2;
+    const cy = top + row * slot + slot / 2;
+    const cell = { x: cx - side / 2, y: cy - side / 2, width: side, height: side };
+    strokes.push({ d: rectPath(cell), role: "encoding", part: "ink", ...d.level > 0 ? { tone: d.level } : {} });
+    hitAreas.push({ seriesKey: countName, index, datum: d.datum, value: d.count ?? 0, x: cx, y: cy, box: cell, cell: { column, row } });
+  });
+  for (const { column, name } of months) {
+    labels.push({ x: plot.x + column * slot, y: plot.y + 10, text: name, kind: "tick", part: "axis", anchor: "start" });
+  }
+  const total = days.reduce((sum, d) => sum + (d.count ?? 0), 0);
+  const active = days.filter((d) => d.level > 0).length;
+  const description = props.description ?? `${base.name}. Activity grid of ${columns} weeks, ${isoDate(days[0].day)} to ${isoDate(days[days.length - 1].day)}; ${formatNumber(total, locale, numberFormat)} in total, active on ${active} of ${days.length} days.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var activityGrid = /* @__PURE__ */ Object.freeze({
+  name: CHART7,
+  build: buildActivityGrid
+});
+
+// src/charts/step-chart/demo.ts
+var STEP_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { x: "Jan", value: 12 },
+    { x: "Feb", value: 12 },
+    { x: "Mar", value: 18 },
+    { x: "Apr", value: 18 },
+    { x: "May", value: 15 },
+    { x: "Jun", value: 24 },
+    { x: "Jul", value: 24 },
+    { x: "Aug", value: 30 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/step-chart/step-chart.ts
+var CHART8 = "StepChart";
+var HEIGHTEN_RADIUS2 = 3.5;
+var STEPS = {
+  after: curveStepAfter,
+  before: curveStepBefore,
+  middle: curveStep
+};
+function buildStepChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? STEP_CHART_DEMO;
+  const xKey = usesDemo ? "x" : props.xKey ?? "x";
+  const valueKey = usesDemo ? "value" : props.valueKey ?? "value";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const series = readSeries(data, valueKey, "value");
+  checkVolume(CHART8, [series]);
+  const xName = accessorName(xKey, "x");
+  const xValues = data.map((datum, index) => read(xKey, datum, index));
+  const xLabels = xValues.map((value) => formatCategory(value, locale));
+  const base = modelBase(CHART8, props, context, "Step chart", {
+    columns: [xName, series.key],
+    rows: data.map((_, i) => [xLabels[i] ?? "", formatValue(series.points[i]?.value, locale, numberFormat)])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = cartesianPlot(card.area);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (series.missing > 0 && data.length > 0) warnValue(CHART8, series.key, `${series.missing} of ${data.length} values are not finite; the steps skip them.`);
+  const range = extent(seriesValues([series]));
+  if (data.length === 0 || range === void 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const axis = valueAxis(plot, range, { chart: CHART8, property: series.key, padding: context.domainPadding, locale, numberFormat });
+  const y = axis.scale;
+  strokes.push(...axis.strokes);
+  labels.push(...axis.labels);
+  const xAt = categoryAxis(xValues, plot, { chart: CHART8, property: xName, padding: context.domainPadding }).at;
+  const d = line().defined((p) => p.value !== void 0).x((p) => xAt(p.index)).y((p) => y(p.value ?? 0)).curve(STEPS[props.step ?? "after"])(series.points);
+  if (d) strokes.push({ d, role: "encoding", part: "ink" });
+  for (const p of series.points) {
+    if (p.value === void 0) continue;
+    hitAreas.push({ seriesKey: series.key, index: p.index, datum: p.datum, value: p.value, x: xAt(p.index), y: y(p.value) });
+  }
+  const live = hitAreas.at(-1);
+  if (live) {
+    const mark = circlePath(live.x, live.y, HEIGHTEN_RADIUS2);
+    strokes.push({ d: mark, role: "encoding", part: "heighten", paint: "fill" });
+    strokes.push({ d: mark, role: "encoding", part: "ink", paint: "stroke" });
+  }
+  labels.push(...categoryLabels(xLabels, xAt, card.area, plot));
+  const description = props.description ?? `${base.name}. Step chart of ${data.length} ${xName} values, stepping ${props.step ?? "after"} each point; ${series.key} ranges from ${formatNumber(range[0], locale, numberFormat)} to ${formatNumber(range[1], locale, numberFormat)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var stepChart = /* @__PURE__ */ Object.freeze({ name: CHART8, build: buildStepChart });
+var CURVES2 = {
+  monotone: curveMonotoneX,
+  linear: curveLinear,
+  natural: curveNatural,
+  step: curveStepAfter
+};
+
+// src/charts/sparkline-rows/demo.ts
+var SPARKLINE_ROWS_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { name: "API", readout: "99.9%", points: Object.freeze([98, 99, 99, 97, 99, 100, 99, 100]) },
+    { name: "Queue", points: Object.freeze([12, 18, 15, 22, 19, 25, 21, 17]) },
+    { name: "Cache", readout: "84%", points: Object.freeze([70, 72, 78, 75, 80, 83, 81, 84]) },
+    { name: "Search", points: Object.freeze([240, 220, 260, 210, 190, 205, 180, 170]) }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/sparkline-rows/sparkline-rows.ts
+var CHART9 = "SparklineRows";
+var PLOT_INSET8 = 6;
+var NAME_COLUMN = 64;
+var READOUT_COLUMN = 52;
+var ROW_PAD = 4;
+function pointValue(point, index, pointKey) {
+  if (pointKey !== void 0) return typeof point === "object" && point !== null ? finite(read(pointKey, point, index)) : void 0;
+  if (typeof point === "number") return finite(point);
+  return typeof point === "object" && point !== null ? finite(point.value) : void 0;
+}
+function buildSparklineRows(props, context) {
+  const usesDemo = props.data === void 0;
+  const all = props.data ?? SPARKLINE_ROWS_DEMO;
+  const data = props.rows !== void 0 && Number.isInteger(props.rows) && props.rows >= 0 ? all.slice(0, props.rows) : all;
+  if (props.rows !== void 0 && !(Number.isInteger(props.rows) && props.rows >= 0)) warnValue(CHART9, "rows", `${String(props.rows)} is not a whole number of rows \u2265 0; every row is shown.`);
+  const nameKey = usesDemo ? "name" : props.nameKey ?? "name";
+  const readoutKey = usesDemo ? "readout" : props.readoutKey ?? "readout";
+  const seriesKey = usesDemo ? "points" : props.seriesKey ?? "points";
+  const pointKey = usesDemo ? void 0 : props.pointKey;
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const readoutName = accessorName(readoutKey, "readout");
+  const rows = data.map((datum, index) => {
+    const raw = read(seriesKey, datum, index);
+    const points = Array.isArray(raw) ? raw.map((p, i) => pointValue(p, i, pointKey)) : [];
+    const values = points.flatMap((v) => v === void 0 ? [] : [v]);
+    const given = read(readoutKey, datum, index);
+    const last = [...points].reverse().find((v) => v !== void 0);
+    return {
+      index,
+      datum,
+      name: formatCategory(read(nameKey, datum, index), locale),
+      points,
+      values,
+      last,
+      readout: given !== void 0 && given !== null ? formatValue(given, locale, numberFormat) : last === void 0 ? "\u2014" : formatNumber(last, locale, numberFormat)
+    };
+  });
+  for (const row of rows) checkCount(CHART9, row.name, row.points.length);
+  const base = modelBase(CHART9, props, context, "Sparkline rows", {
+    columns: [accessorName(nameKey, "name"), readoutName],
+    rows: rows.map((r) => [r.name, r.readout])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = inset(card.area, PLOT_INSET8);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (rows.length === 0 || rows.every((r) => r.values.length === 0)) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, rows.length === 0);
+  }
+  const rowHeight = plot.height / rows.length;
+  const longest = Math.max(...rows.map((r) => r.points.length));
+  const lineX = plot.x + NAME_COLUMN;
+  const lineWidth = Math.max(plot.width - NAME_COLUMN - READOUT_COLUMN, 1);
+  const xAt = (i) => longest > 1 ? lineX + i / (longest - 1) * lineWidth : lineX + lineWidth / 2;
+  for (const row of rows) {
+    const band = { x: plot.x, y: plot.y + row.index * rowHeight, width: plot.width, height: rowHeight };
+    const baseline = band.y + rowHeight / 2 + 4;
+    labels.push({ x: plot.x, y: baseline, text: row.name, kind: "tick", part: "text", anchor: "start" });
+    labels.push({ x: plot.x + plot.width, y: baseline, text: row.readout, kind: "tick", part: "text", anchor: "end" });
+    if (row.values.length === 0) {
+      warnValue(CHART9, accessorName(seriesKey, "points"), `Row ${row.index} (${row.name}) has no finite points; its sparkline is omitted.`);
+      continue;
+    }
+    const low = Math.min(...row.values);
+    const high = Math.max(...row.values);
+    const top = band.y + ROW_PAD;
+    const span = Math.max(rowHeight - 2 * ROW_PAD, 1);
+    const yAt = (v) => high === low ? top + span / 2 : top + span - (v - low) / (high - low) * span;
+    const indexed = row.points.map((value, i) => ({ value, i }));
+    const d = line().defined((p) => p.value !== void 0).x((p) => xAt(p.i)).y((p) => yAt(p.value ?? 0)).curve(CURVES2.monotone)(indexed);
+    if (d) strokes.push({ d, role: "encoding", part: "ink" });
+    const lastIndex = row.points.lastIndexOf(row.last);
+    hitAreas.push({ seriesKey: readoutName, index: row.index, datum: row.datum, value: row.last ?? 0, x: xAt(lastIndex), y: yAt(row.last ?? 0), box: band });
+  }
+  const description = props.description ?? `${base.name}. ${rows.length} rows: ${rows.map((r) => `${r.name} ${r.readout}`).join(", ")}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var sparklineRows = /* @__PURE__ */ Object.freeze({ name: CHART9, build: buildSparklineRows });
+
+// src/charts/kpi-card/demo.ts
+var KPI_CARD_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [118, 124, 121, 132, 140, 136, 129, 142, 151, 147, 155, 162, 158, 171].map((value) => Object.freeze({ value }))
+);
+var KPI_CARD_DEMO_PROPS = /* @__PURE__ */ Object.freeze({ metric: "orders per day", delta: 8.2 });
+
+// src/charts/kpi-card/kpi-card.ts
+var CHART10 = "KpiCard";
+var PLOT_INSET9 = 6;
+var DELTA_BAND = 18;
+var MARK = 7;
+var CHAR = 5.6;
+function buildKpiCard(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? KPI_CARD_DEMO;
+  const valueKey = usesDemo ? "value" : props.valueKey ?? "value";
+  const metric = usesDemo ? props.metric ?? KPI_CARD_DEMO_PROPS.metric : props.metric;
+  const delta = usesDemo ? props.delta ?? KPI_CARD_DEMO_PROPS.delta : props.delta;
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const series = readSeries(data, valueKey, "value");
+  checkVolume(CHART10, [series]);
+  const last = [...series.points].reverse().find((p) => p.value !== void 0)?.value;
+  const base = modelBase(CHART10, props, context, metric ?? "KPI", {
+    columns: ["point", series.key],
+    rows: series.points.map((p) => [String(p.index + 1), formatValue(p.value, locale, numberFormat)])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout({ ...props, value: props.value ?? last, unit: props.unit ?? metric }, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const drawing = inset(card.area, PLOT_INSET9);
+  const plot = { x: drawing.x, y: drawing.y + DELTA_BAND, width: drawing.width, height: Math.max(drawing.height - DELTA_BAND, 1) };
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  const deltaText = delta !== void 0 && Number.isFinite(delta) ? formatNumber(delta, locale, { ...numberFormat ?? { maximumFractionDigits: 2 }, signDisplay: "always" }) : void 0;
+  if (delta !== void 0 && deltaText !== void 0) {
+    const text = deltaText;
+    const right = drawing.x + drawing.width;
+    labels.push({ x: right, y: drawing.y + 11, text, kind: "tick", part: "text", anchor: "end" });
+    const tone = props.deltaTone ?? (delta > 0 ? "up" : delta < 0 ? "down" : "flat");
+    const x0 = right - text.length * CHAR - MARK - 6;
+    const top2 = drawing.y + 3;
+    const bottom2 = top2 + MARK;
+    const d = tone === "up" ? `M${x0},${bottom2}L${x0 + MARK / 2},${top2}L${x0 + MARK},${bottom2}Z` : tone === "down" ? `M${x0},${top2}L${x0 + MARK / 2},${bottom2}L${x0 + MARK},${top2}Z` : `M${x0},${top2}L${x0 + MARK},${(top2 + bottom2) / 2}L${x0},${bottom2}Z`;
+    strokes.push({ d, role: "encoding", part: "ink", paint: "fill" });
+  }
+  if (series.missing > 0 && data.length > 0) warnValue(CHART10, series.key, `${series.missing} of ${data.length} values are not finite; the sparkline breaks there.`);
+  const range = extent(seriesValues([series]));
+  if (data.length === 0 || range === void 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const bottom = plot.y + plot.height;
+  const y = linearScale(range, [bottom, plot.y], { chart: CHART10, property: series.key, padding: context.domainPadding });
+  const xAt = (i) => data.length > 1 ? plot.x + i / (data.length - 1) * plot.width : plot.x + plot.width / 2;
+  const defined = (p) => p.value !== void 0;
+  const shape = area().defined(defined).x((p) => xAt(p.index)).y0(bottom).y1((p) => y(p.value ?? 0)).curve(CURVES2.monotone)(series.points);
+  if (shape) strokes.push({ d: shape, role: "encoding", part: "ink", paint: "stroke", tone: 1 });
+  const top = line().defined(defined).x((p) => xAt(p.index)).y((p) => y(p.value ?? 0)).curve(CURVES2.monotone)(series.points);
+  if (top) strokes.push({ d: top, role: "encoding", part: "ink" });
+  for (const p of series.points) {
+    if (p.value === void 0) continue;
+    hitAreas.push({ seriesKey: series.key, index: p.index, datum: p.datum, value: p.value, x: xAt(p.index), y: y(p.value) });
+  }
+  const description = props.description ?? `${base.name}. ${metric ?? accessorName(valueKey, "value")} at ${formatValue(props.value ?? last, locale, numberFormat)}${deltaText !== void 0 ? `, change ${deltaText}` : ""}; ${data.length} points from ${formatNumber(range[0], locale, numberFormat)} to ${formatNumber(range[1], locale, numberFormat)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var kpiCard = /* @__PURE__ */ Object.freeze({ name: CHART10, build: buildKpiCard });
+
+// src/charts/bar-chart/demo.ts
+var BAR_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { x: "Q1", value: 42, previous: 35 },
+    { x: "Q2", value: 58, previous: 44 },
+    { x: "Q3", value: 51, previous: 49 },
+    { x: "Q4", value: 73, previous: 60 }
+  ].map((row) => Object.freeze(row))
+);
+var BAR_CHART_DEMO_KEYS = /* @__PURE__ */ Object.freeze({ xKey: "x", valueKey: "value", secondaryKey: "previous" });
+
+// src/charts/bar-chart/bar-chart.ts
+var CHART11 = "BarChart";
+var ROW_LABELS = 56;
+var BAR_FILL = 0.7;
+function buildBarChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? BAR_CHART_DEMO;
+  const xKey = usesDemo ? BAR_CHART_DEMO_KEYS.xKey : props.xKey ?? "x";
+  const valueKey = usesDemo ? BAR_CHART_DEMO_KEYS.valueKey : props.valueKey ?? "value";
+  const secondaryKey = usesDemo ? BAR_CHART_DEMO_KEYS.secondaryKey : props.secondaryKey;
+  const rows = props.orientation === "rows";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const series = [readSeries(data, valueKey, "value"), ...secondaryKey === void 0 ? [] : [readSeries(data, secondaryKey, "secondary")]];
+  checkVolume(CHART11, series);
+  const xName = accessorName(xKey, "x");
+  const xValues = data.map((datum, index) => read(xKey, datum, index));
+  const xLabels = xValues.map((value) => formatCategory(value, locale));
+  const base = modelBase(CHART11, props, context, "Bar chart", {
+    columns: [xName, ...series.map((s) => s.key)],
+    rows: data.map((_, i) => [xLabels[i] ?? "", ...series.map((s) => formatValue(s.points[i]?.value, locale, numberFormat))])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const paired = series.length > 1;
+  const key = paired ? legend(card.area, series.map((s, i) => i === 0 ? { name: s.key, part: "ink", tone: 2 } : { name: s.key, part: "ink-secondary", tone: 1, dash: "dotted" })) : { area: card.area, strokes: [], labels: [] };
+  const area5 = key.area;
+  const plot = rows ? { x: area5.x + ROW_LABELS, y: area5.y + PLOT_INSET, width: Math.max(area5.width - ROW_LABELS - PLOT_INSET, 1), height: Math.max(area5.height - AXIS_BAND - PLOT_INSET, 1) } : cartesianPlot(area5);
+  const strokes = [...card.strokes, ...key.strokes];
+  const labels = [...card.labels, ...key.labels];
+  const hitAreas = [];
+  for (const s of series) if (s.missing > 0 && data.length > 0) warnValue(CHART11, s.key, `${s.missing} of ${data.length} values are not finite; their bars are omitted.`);
+  const range = extent(seriesValues(series));
+  if (data.length === 0 || range === void 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const axisOptions = { chart: CHART11, property: series[0]?.key ?? "value", padding: context.domainPadding, locale, numberFormat };
+  const axis = rows ? horizontalValueAxis(plot, area5, range, axisOptions) : valueAxis(plot, range, axisOptions);
+  const v = axis.scale;
+  strokes.push(...axis.strokes);
+  labels.push(...axis.labels);
+  const along2 = rows ? { x: plot.y, y: plot.x, width: plot.height, height: plot.width } : plot;
+  const categories = categoryAxis(xValues, along2, { chart: CHART11, property: xName, padding: context.domainPadding, numeric: false, paddingInner: 0.3, paddingOuter: 0.15 });
+  const thickness = categories.bandwidth * BAR_FILL / series.length;
+  series.forEach((s, k) => {
+    for (const p of s.points) {
+      if (p.value === void 0) continue;
+      const centre = categories.at(p.index) - categories.bandwidth * BAR_FILL / 2 + thickness * (k + 0.5);
+      const from = v(Math.min(0, p.value));
+      const to = v(Math.max(0, p.value));
+      const bar = rows ? { x: from, y: centre - thickness / 2, width: to - from, height: thickness } : { x: centre - thickness / 2, y: to, width: thickness, height: from - to };
+      strokes.push({ d: pillPath(bar), role: "encoding", part: k === 0 ? "ink" : "ink-secondary", tone: k === 0 ? 2 : 1, ...k === 0 ? {} : { dash: "dotted" } });
+      const end = v(p.value);
+      hitAreas.push({
+        seriesKey: s.key,
+        index: p.index,
+        datum: p.datum,
+        value: p.value,
+        x: rows ? end : centre,
+        y: rows ? centre : end,
+        box: bar,
+        ...paired ? { cell: rows ? { column: k, row: p.index } : { column: p.index, row: k } } : {}
+      });
+    }
+  });
+  if (rows) {
+    xLabels.forEach((text, i) => labels.push({ x: area5.x + PLOT_INSET, y: categories.at(i) + 4, text, kind: "tick", part: "axis", anchor: "start" }));
+  } else {
+    labels.push(...categoryLabels(xLabels, categories.at, area5, plot));
+  }
+  const ranges = series.map((s) => {
+    const r = extent(seriesValues([s]));
+    return r ? `${s.key} from ${formatNumber(r[0], locale, numberFormat)} to ${formatNumber(r[1], locale, numberFormat)}` : `${s.key} has no values`;
+  });
+  const description = props.description ?? `${base.name}. Bar chart in ${rows ? "rows" : "columns"} of ${data.length} ${xName} values; ${ranges.join("; ")}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var barChart = /* @__PURE__ */ Object.freeze({ name: CHART11, build: buildBarChart });
+
+// src/charts/stacked-bar-chart/demo.ts
+var STACKED_BAR_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { x: "Jan", free: 40, pro: 18, team: 6 },
+    { x: "Feb", free: 46, pro: 21, team: 9 },
+    { x: "Mar", free: 38, pro: 26, team: 11 },
+    { x: "Apr", free: 52, pro: 24, team: 14 },
+    { x: "May", free: 49, pro: 31, team: 15 }
+  ].map((row) => Object.freeze(row))
+);
+var STACKED_BAR_CHART_DEMO_KEYS = /* @__PURE__ */ Object.freeze(["free", "pro", "team"]);
+
+// src/charts/stacked-bar-chart/stacked-bar-chart.ts
+var CHART12 = "StackedBarChart";
+var TONES = [1, 2, 3, 4];
+function buildStackedBarChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? STACKED_BAR_CHART_DEMO;
+  const xKey = usesDemo ? "x" : props.xKey ?? "x";
+  const keys = usesDemo ? STACKED_BAR_CHART_DEMO_KEYS : props.keys ?? STACKED_BAR_CHART_DEMO_KEYS;
+  const names = keys.map((k, i) => (usesDemo ? void 0 : props.names?.[i]) ?? k);
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const series = keys.map((k, i) => ({ ...readSeries(data, k, k), key: names[i] ?? k }));
+  checkVolume(CHART12, series);
+  const xName = accessorName(xKey, "x");
+  const xValues = data.map((datum, index) => read(xKey, datum, index));
+  const xLabels = xValues.map((value) => formatCategory(value, locale));
+  const base = modelBase(CHART12, props, context, "Stacked bar chart", {
+    columns: [xName, ...names],
+    rows: data.map((_, i) => [xLabels[i] ?? "", ...series.map((s) => formatValue(s.points[i]?.value, locale, numberFormat))])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const key = legend(card.area, names.map((name, k) => ({ name, part: "ink", tone: TONES[k % TONES.length] })));
+  const plot = cartesianPlot(key.area);
+  const strokes = [...card.strokes, ...key.strokes];
+  const labels = [...card.labels, ...key.labels];
+  const hitAreas = [];
+  let missing = 0;
+  let negative = 0;
+  const totals = data.map(
+    (_, i) => series.reduce((sum, s) => {
+      const value = s.points[i]?.value;
+      if (value === void 0) {
+        missing += 1;
+        return sum;
+      }
+      if (value < 0) negative += 1;
+      return sum + Math.max(value, 0);
+    }, 0)
+  );
+  if (missing > 0 && data.length > 0) warnValue(CHART12, keys[0] ?? "keys", `${missing} values are not finite; their segments are omitted.`);
+  if (negative > 0) warnValue(CHART12, keys[0] ?? "keys", `${negative} negative values cannot stack; they are drawn at zero.`);
+  if (data.length === 0 || keys.length === 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const axis = valueAxis(plot, [0, Math.max(0, ...totals)], { chart: CHART12, property: keys[0] ?? "value", padding: context.domainPadding, locale, numberFormat });
+  const y = axis.scale;
+  strokes.push(...axis.strokes);
+  labels.push(...axis.labels);
+  const categories = categoryAxis(xValues, plot, { chart: CHART12, property: xName, padding: context.domainPadding, numeric: false, paddingInner: 0.35, paddingOuter: 0.2 });
+  const width = categories.bandwidth;
+  data.forEach((_, i) => {
+    let below = 0;
+    series.forEach((s, k) => {
+      const p = s.points[i];
+      if (p?.value === void 0) return;
+      const height = Math.max(p.value, 0);
+      const segment = { x: categories.at(i) - width / 2, y: y(below + height), width, height: y(below) - y(below + height) };
+      if (segment.height > 0) strokes.push({ d: rectPath(segment), role: "encoding", part: "ink", tone: TONES[k % TONES.length] });
+      hitAreas.push({ seriesKey: s.key, index: i, datum: p.datum, value: p.value, x: categories.at(i), y: segment.y, box: segment, cell: { column: i, row: k } });
+      below += height;
+    });
+  });
+  labels.push(...categoryLabels(xLabels, categories.at, key.area, plot));
+  const largest = Math.max(...totals);
+  const description = props.description ?? `${base.name}. Stacked bars of ${keys.length} keys (${names.join(", ")}, bottom to top) over ${data.length} ${xName} values; the tallest stack totals ${formatNumber(largest, locale, numberFormat)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var stackedBarChart = /* @__PURE__ */ Object.freeze({ name: CHART12, build: buildStackedBarChart });
+
+// src/charts/composed-chart/demo.ts
+var COMPOSED_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { x: "Jan", revenue: 42, margin: 18 },
+    { x: "Feb", revenue: 48, margin: 21 },
+    { x: "Mar", revenue: 39, margin: 17 },
+    { x: "Apr", revenue: 55, margin: 26 },
+    { x: "May", revenue: 61, margin: 30 },
+    { x: "Jun", revenue: 58, margin: 27 }
+  ].map((row) => Object.freeze(row))
+);
+var COMPOSED_CHART_DEMO_KEYS = /* @__PURE__ */ Object.freeze({ xKey: "x", barKey: "revenue", lineKey: "margin" });
+
+// src/charts/composed-chart/composed-chart.ts
+var CHART13 = "ComposedChart";
+var BAR_FILL2 = 0.6;
+function buildComposedChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? COMPOSED_CHART_DEMO;
+  const xKey = usesDemo ? COMPOSED_CHART_DEMO_KEYS.xKey : props.xKey ?? "x";
+  const barKey = usesDemo ? COMPOSED_CHART_DEMO_KEYS.barKey : props.barKey ?? "bar";
+  const lineKey = usesDemo ? COMPOSED_CHART_DEMO_KEYS.lineKey : props.lineKey ?? "line";
+  const showLine = props.showLine ?? true;
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const bars = readSeries(data, barKey, "bar");
+  const trend = readSeries(data, lineKey, "line");
+  const series = showLine ? [bars, trend] : [bars];
+  checkVolume(CHART13, series);
+  const xName = accessorName(xKey, "x");
+  const xValues = data.map((datum, index) => read(xKey, datum, index));
+  const xLabels = xValues.map((value) => formatCategory(value, locale));
+  const base = modelBase(CHART13, props, context, "Composed chart", {
+    columns: [xName, ...series.map((s) => s.key)],
+    rows: data.map((_, i) => [xLabels[i] ?? "", ...series.map((s) => formatValue(s.points[i]?.value, locale, numberFormat))])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const key = legend(card.area, [
+    { name: bars.key, part: "ink", tone: 2 },
+    ...showLine ? [{ name: trend.key, part: "ink-secondary" }] : []
+  ]);
+  const plot = cartesianPlot(key.area);
+  const strokes = [...card.strokes, ...key.strokes];
+  const labels = [...card.labels, ...key.labels];
+  const hitAreas = [];
+  for (const s of series) if (s.missing > 0 && data.length > 0) warnValue(CHART13, s.key, `${s.missing} of ${data.length} values are not finite; they are omitted.`);
+  const range = extent(seriesValues(series));
+  if (data.length === 0 || range === void 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const axis = valueAxis(plot, range, { chart: CHART13, property: bars.key, padding: context.domainPadding, locale, numberFormat });
+  const y = axis.scale;
+  strokes.push(...axis.strokes);
+  labels.push(...axis.labels);
+  const categories = categoryAxis(xValues, plot, { chart: CHART13, property: xName, padding: context.domainPadding, numeric: false, paddingInner: 0.3, paddingOuter: 0.15 });
+  const width = categories.bandwidth * BAR_FILL2;
+  for (const p of bars.points) {
+    if (p.value === void 0) continue;
+    const top = y(Math.max(0, p.value));
+    const bottom = y(Math.min(0, p.value));
+    const bar = { x: categories.at(p.index) - width / 2, y: top, width, height: bottom - top };
+    if (bar.height > 0) strokes.push({ d: rectPath(bar), role: "encoding", part: "ink", tone: 2 });
+    hitAreas.push({ seriesKey: bars.key, index: p.index, datum: p.datum, value: p.value, x: categories.at(p.index), y: y(p.value), box: bar, cell: { column: p.index, row: 0 } });
+  }
+  if (showLine) {
+    const d = line().defined((p) => p.value !== void 0).x((p) => categories.at(p.index)).y((p) => y(p.value ?? 0)).curve(CURVES2.monotone)(trend.points);
+    if (d) strokes.push({ d, role: "encoding", part: "ink-secondary" });
+    for (const p of trend.points) {
+      if (p.value === void 0) continue;
+      hitAreas.push({ seriesKey: trend.key, index: p.index, datum: p.datum, value: p.value, x: categories.at(p.index), y: y(p.value), cell: { column: p.index, row: 1 } });
+    }
+  }
+  labels.push(...categoryLabels(xLabels, categories.at, key.area, plot));
+  const description = props.description ?? `${base.name}. Columns of ${bars.key}${showLine ? ` with a line of ${trend.key}` : ""} over ${data.length} ${xName} values, on one scale from ${formatNumber(range[0], locale, numberFormat)} to ${formatNumber(range[1], locale, numberFormat)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var composedChart = /* @__PURE__ */ Object.freeze({ name: CHART13, build: buildComposedChart });
+
+// src/charts/waterfall-chart/demo.ts
+var WATERFALL_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { step: "Opening", base: 120 },
+    { step: "Sales", delta: 64 },
+    { step: "Services", delta: 22 },
+    { step: "Payroll", delta: -58 },
+    { step: "Rent", delta: -24 },
+    { step: "Closing", base: 124 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/waterfall-chart/waterfall-chart.ts
+var CHART14 = "WaterfallChart";
+var BAR_FILL3 = 0.62;
+function buildWaterfallChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? WATERFALL_CHART_DEMO;
+  const stepKey = usesDemo ? "step" : props.stepKey ?? "step";
+  const baseKey = usesDemo ? "base" : props.baseKey ?? "base";
+  const deltaKey = usesDemo ? "delta" : props.deltaKey ?? "delta";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const baseName = accessorName(baseKey, "base");
+  const deltaName = accessorName(deltaKey, "delta");
+  const steps = [];
+  let running = 0;
+  let skipped = 0;
+  data.forEach((datum, index) => {
+    const total = finite(read(baseKey, datum, index));
+    const delta = finite(read(deltaKey, datum, index));
+    if (total !== void 0) {
+      if (delta !== void 0) warnValue(CHART14, deltaName, `Row ${index} has both a ${baseName} and a ${deltaName}; a total resets the running total, so its ${deltaName} is ignored.`);
+      steps.push({ index, datum, kind: "total", value: total, from: 0, to: total });
+      running = total;
+    } else if (delta !== void 0) {
+      steps.push({ index, datum, kind: "delta", value: delta, from: running, to: running + delta });
+      running += delta;
+    } else {
+      skipped += 1;
+    }
+  });
+  checkCount(CHART14, deltaName, data.length);
+  const stepName = accessorName(stepKey, "step");
+  const stepLabels = data.map((datum, index) => formatCategory(read(stepKey, datum, index), locale));
+  const signed = (value) => formatNumber(value, locale, { ...numberFormat ?? { maximumFractionDigits: 2 }, signDisplay: "always" });
+  const base = modelBase(CHART14, props, context, "Waterfall chart", {
+    columns: [stepName, baseName, deltaName],
+    rows: data.map((datum, index) => [
+      stepLabels[index] ?? "",
+      formatValue(finite(read(baseKey, datum, index)), locale, numberFormat),
+      formatValue(finite(read(deltaKey, datum, index)), locale, numberFormat)
+    ])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = cartesianPlot(card.area);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (skipped > 0 && data.length > 0) warnValue(CHART14, deltaName, `${skipped} rows have neither a finite ${baseName} nor a finite ${deltaName}; they are omitted.`);
+  if (steps.length === 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const levels = steps.flatMap((s) => [s.from, s.to]);
+  const axis = valueAxis(plot, [Math.min(...levels), Math.max(...levels)], { chart: CHART14, property: deltaName, padding: context.domainPadding, locale, numberFormat });
+  const y = axis.scale;
+  strokes.push(...axis.strokes);
+  labels.push(...axis.labels);
+  const categories = categoryAxis(stepLabels, plot, { chart: CHART14, property: stepName, padding: context.domainPadding, numeric: false, paddingInner: 0.3, paddingOuter: 0.15 });
+  const width = categories.bandwidth * BAR_FILL3;
+  steps.forEach((step, n) => {
+    const top = y(Math.max(step.from, step.to));
+    const bar = { x: categories.at(step.index) - width / 2, y: top, width, height: y(Math.min(step.from, step.to)) - top };
+    const tone = step.kind === "total" ? 3 : step.value >= 0 ? 1 : 2;
+    if (bar.height > 0) strokes.push({ d: rectPath(bar), role: "encoding", part: "ink", tone });
+    const next = steps[n + 1];
+    if (next?.kind === "delta") {
+      strokes.push({ d: `M${bar.x + width},${y(step.to)}H${categories.at(next.index) - width / 2}`, role: "ornament", part: "grid", dash: "dotted" });
+    }
+    labels.push({
+      x: categories.at(step.index),
+      y: top - 3,
+      text: step.kind === "total" ? formatNumber(step.value, locale, numberFormat) : signed(step.value),
+      kind: "tick",
+      part: "text",
+      anchor: "middle"
+    });
+    hitAreas.push({
+      seriesKey: step.kind === "total" ? baseName : deltaName,
+      index: step.index,
+      datum: step.datum,
+      value: step.value,
+      x: categories.at(step.index),
+      y: y(step.to),
+      box: bar,
+      cell: { column: n, row: 0 }
+    });
+  });
+  labels.push(...categoryLabels(stepLabels, categories.at, card.area, plot));
+  const description = props.description ?? `${base.name}. Waterfall of ${steps.length} steps, ending at ${formatNumber(running, locale, numberFormat)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var waterfallChart = /* @__PURE__ */ Object.freeze({ name: CHART14, build: buildWaterfallChart });
+
+// src/charts/funnel-chart/demo.ts
+var FUNNEL_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { stage: "Visits", value: 12400 },
+    { stage: "Product", value: 6800 },
+    { stage: "Cart", value: 2900 },
+    { stage: "Checkout", value: 1500 },
+    { stage: "Paid", value: 980 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/funnel-chart/funnel-chart.ts
+var CHART15 = "FunnelChart";
+var PLOT_INSET10 = 6;
+var LABEL_COLUMN3 = 64;
+var VALUE_COLUMN2 = 64;
+var STAGE_GAP = 3;
+function buildFunnelChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? FUNNEL_CHART_DEMO;
+  const stageKey = usesDemo ? "stage" : props.stageKey ?? "stage";
+  const valueKey = usesDemo ? "value" : props.valueKey ?? "value";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const valueName = accessorName(valueKey, "value");
+  checkCount(CHART15, valueName, data.length);
+  const stages = data.map((datum, index) => ({
+    index,
+    datum,
+    stage: formatCategory(read(stageKey, datum, index), locale),
+    value: finite(read(valueKey, datum, index))
+  }));
+  const entry = stages.find((s) => s.value !== void 0 && s.value > 0)?.value;
+  const share = (value) => entry ? `${formatNumber(value / entry * 100, locale, { maximumFractionDigits: 0 })}%` : "\u2014";
+  const base = modelBase(CHART15, props, context, "Funnel chart", {
+    columns: [accessorName(stageKey, "stage"), valueName, "share"],
+    rows: stages.map((s) => [s.stage, formatValue(s.value, locale, numberFormat), s.value === void 0 ? "\u2014" : share(Math.max(s.value, 0))])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = inset(card.area, PLOT_INSET10);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  const largest = Math.max(0, ...stages.map((s) => s.value ?? 0));
+  if (stages.length > 0 && largest <= 0) warnValue(CHART15, valueName, `No stage has a ${valueName} above zero; there is no funnel to draw.`);
+  if (stages.length === 0 || largest <= 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, stages.length === 0);
+  }
+  const track = { x: plot.x + LABEL_COLUMN3, width: Math.max(plot.width - LABEL_COLUMN3 - VALUE_COLUMN2, 1) };
+  const centre = track.x + track.width / 2;
+  const rowHeight = plot.height / stages.length;
+  const right = plot.x + plot.width;
+  for (const s of stages) {
+    const top = plot.y + s.index * rowHeight;
+    const baseline = top + rowHeight / 2 + 4;
+    labels.push({ x: plot.x, y: baseline, text: s.stage, kind: "tick", part: "text", anchor: "start" });
+    if (s.value === void 0) {
+      warnValue(CHART15, valueName, `Stage ${s.index} has no finite value; it is omitted.`);
+      continue;
+    }
+    const value = Math.max(s.value, 0);
+    if (value !== s.value) warnValue(CHART15, valueName, `Stage ${s.index} is ${s.value}; a funnel stage cannot be negative, so it is drawn at zero.`);
+    const width = value / largest * track.width;
+    const stage = { x: centre - width / 2, y: top + STAGE_GAP / 2, width, height: Math.max(rowHeight - STAGE_GAP, 0) };
+    const tone = toneOf(value / largest);
+    if (width > 0) strokes.push({ d: rectPath(stage), role: "encoding", part: "ink", ...tone > 0 ? { tone } : {} });
+    labels.push({ x: right, y: baseline - 6, text: formatNumber(s.value, locale, numberFormat), kind: "tick", part: "text", anchor: "end" });
+    labels.push({ x: right, y: baseline + 5, text: share(value), kind: "tick", part: "axis", anchor: "end" });
+    hitAreas.push({ seriesKey: valueName, index: s.index, datum: s.datum, value: s.value, x: centre, y: stage.y + stage.height / 2, box: stage });
+  }
+  const last = [...stages].reverse().find((s) => s.value !== void 0);
+  const description = props.description ?? `${base.name}. Funnel of ${stages.length} stages, from ${stages[0]?.stage} to ${last?.stage}; ${last?.value === void 0 ? "" : `${share(Math.max(last.value, 0))} of the entry reach the last stage`}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var funnelChart = /* @__PURE__ */ Object.freeze({ name: CHART15, build: buildFunnelChart });
+
+// src/charts/shared/polar.ts
+function polarFrame(area5, labelRoom = 0) {
+  return {
+    cx: area5.x + area5.width / 2,
+    cy: area5.y + area5.height / 2,
+    radius: Math.max(Math.min(area5.width, area5.height) / 2 - PLOT_INSET - labelRoom, 1)
+  };
+}
+var RIM_LABELS = 14;
+function rimLabels(frame, entries, most = 24) {
+  const step = Math.max(1, Math.ceil(entries.length / most));
+  return entries.filter((_, i) => i % step === 0).map((e) => polarLabel(frame, e.angle, frame.radius + 8, e.text));
+}
+function pointAt(frame, angle, r) {
+  return { x: frame.cx + r * Math.sin(angle), y: frame.cy - r * Math.cos(angle) };
+}
+var EPSILON = 1e-9;
+var at = (frame, angle, r) => {
+  const p = pointAt(frame, angle, r);
+  return `${p.x},${p.y}`;
+};
+function arcTo(frame, r, end, clockwise) {
+  return `A${r},${r},0,0,${clockwise ? 1 : 0},${at(frame, end, r)}`;
+}
+function sweep(frame, r, start, end, clockwise) {
+  if (Math.abs(end - start) <= Math.PI) return arcTo(frame, r, end, clockwise);
+  const middle = (start + end) / 2;
+  return arcTo(frame, r, middle, clockwise) + arcTo(frame, r, end, clockwise);
+}
+function arcPath(frame, r, start, end) {
+  if (Math.abs(end - start) < EPSILON || r <= 0) return "";
+  return `M${at(frame, start, r)}${sweep(frame, r, start, end, end > start)}`;
+}
+function sectorPath(frame, shape) {
+  const { inner, outer, start, end } = shape;
+  if (Math.abs(end - start) < EPSILON || outer <= 0) return "";
+  const clockwise = end > start;
+  const outerArc = `M${at(frame, start, outer)}${sweep(frame, outer, start, end, clockwise)}`;
+  if (inner <= 0) return `${outerArc}L${frame.cx},${frame.cy}Z`;
+  return `${outerArc}L${at(frame, end, inner)}${sweep(frame, inner, end, start, !clockwise)}Z`;
+}
+var POLE = 0.1;
+function polarLabel(frame, angle, r, text, kind = "tick") {
+  const p = pointAt(frame, angle, r);
+  const side = Math.sin(angle);
+  const anchor = side > POLE ? "start" : side < -POLE ? "end" : "middle";
+  return { x: p.x, y: p.y + 3, text, kind, part: "axis", anchor };
+}
+function readSectors(data, nameKey, valueKey, chart, locale) {
+  const valueName = accessorName(valueKey, "value");
+  const seen = /* @__PURE__ */ new Map();
+  const sectors = [];
+  data.forEach((datum, index) => {
+    const value = finite(read(valueKey, datum, index));
+    if (value === void 0 || value < 0) {
+      warnValue(chart, valueName, `Row ${index} has a ${valueName} of ${String(read(valueKey, datum, index))}; a sector needs a finite value \u2265 0, so it is omitted.`);
+      return;
+    }
+    const given = read(nameKey, datum, index);
+    if (given === void 0 || given === null || given === "") warnValue(chart, accessorName(nameKey, "name"), `Row ${index} has no name; it is shown as "\u2014".`);
+    const raw = formatCategory(given, locale);
+    const count = (seen.get(raw) ?? 0) + 1;
+    seen.set(raw, count);
+    if (count > 1) warnValue(chart, accessorName(nameKey, "name"), `The name "${raw}" repeats; row ${index} is shown as "${raw} (${count})".`);
+    sectors.push({ index, datum, name: count > 1 ? `${raw} (${count})` : raw, value });
+  });
+  return sectors;
+}
+var SECTORS_PER_CHART = 60;
+function checkSectors(chart, property, count) {
+  if (process.env.NODE_ENV === "production" || count <= SECTORS_PER_CHART) return;
+  diagnose("SP008", chart, { property, message: `${count} sectors; the ceiling is ${SECTORS_PER_CHART}.` });
+}
+var RING_TONES = [1, 2, 3, 4];
+function ringTone(index, count) {
+  const tone = RING_TONES[index % RING_TONES.length];
+  if (count > 1 && index === count - 1 && tone === RING_TONES[0]) return RING_TONES[2];
+  return tone;
+}
+function ringTones(values) {
+  const drawn = values.filter((v) => v > 0).length;
+  let k = 0;
+  return values.map((v) => v > 0 ? ringTone(k++, drawn) : ringTone(Math.min(k, Math.max(drawn - 1, 0)), drawn));
+}
+var LEGEND_ROW = 14;
+function sectorLegend(area5, entries) {
+  const strokes = [];
+  const labels = [];
+  const fits2 = Math.max(Math.floor(area5.height / LEGEND_ROW), 1);
+  const shown = entries.length > fits2 ? fits2 - 1 : entries.length;
+  const top = area5.y + (area5.height - Math.min(entries.length, fits2) * LEGEND_ROW) / 2;
+  entries.slice(0, shown).forEach((entry, row) => {
+    const y = top + row * LEGEND_ROW;
+    strokes.push({ d: rectPath({ x: area5.x, y: y + 3, width: 9, height: 7 }), role: "ornament", part: "ink", tone: entry.tone });
+    labels.push({ x: area5.x + 14, y: y + 10, text: entry.name, kind: "tick", part: "text", anchor: "start" });
+    labels.push({ x: area5.x + area5.width, y: y + 10, text: entry.share, kind: "tick", part: "axis", anchor: "end" });
+  });
+  if (shown < entries.length) {
+    labels.push({ x: area5.x + 14, y: top + shown * LEGEND_ROW + 10, text: `+${entries.length - shown} more`, kind: "tick", part: "axis", anchor: "start" });
+  }
+  return { strokes, labels };
+}
+
+// src/charts/donut-chart/demo.ts
+var DONUT_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { name: "Rent", value: 38 },
+    { name: "Food", value: 22 },
+    { name: "Savings", value: 15 },
+    { name: "Transport", value: 14 },
+    { name: "Leisure", value: 11 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/donut-chart/donut-chart.ts
+var CHART16 = "DonutChart";
+var HOLE = 0.62;
+var LEGEND_ASPECT = 1.5;
+var LEGEND_GAP = 14;
+function buildDonutChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? DONUT_CHART_DEMO;
+  const nameKey = usesDemo ? "name" : props.nameKey ?? "name";
+  const valueKey = usesDemo ? "value" : props.valueKey ?? "value";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const valueName = accessorName(valueKey, "value");
+  checkSectors(CHART16, valueName, data.length);
+  const sectors = readSectors(data, nameKey, valueKey, CHART16, locale);
+  const total = sectors.reduce((sum, s) => sum + s.value, 0);
+  const share = (value) => total > 0 ? `${formatNumber(value / total * 100, locale, { maximumFractionDigits: 0 })}%` : "\u2014";
+  const byRow = new Map(sectors.map((s) => [s.index, s]));
+  const base = modelBase(CHART16, props, context, "Donut chart", {
+    columns: [accessorName(nameKey, "name"), valueName, "share"],
+    rows: data.map((_, index) => {
+      const s = byRow.get(index);
+      return s ? [s.name, formatValue(s.value, locale, numberFormat), share(s.value)] : ["\u2014", "\u2014", "\u2014"];
+    })
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = card.area;
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (sectors.length > 0 && total <= 0) warnValue(CHART16, valueName, "Every value is zero; a donut has nothing to divide.");
+  if (sectors.length === 0 || total <= 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const withLegend = (props.legend ?? true) && plot.width >= plot.height * LEGEND_ASPECT;
+  const ringArea = withLegend ? { x: plot.x, y: plot.y, width: plot.height, height: plot.height } : plot;
+  const frame = polarFrame(ringArea);
+  const inner = frame.radius * HOLE;
+  const tones = ringTones(sectors.map((s) => s.value));
+  let start = 0;
+  sectors.forEach((s, k) => {
+    const end = start + s.value / total * 2 * Math.PI;
+    const tone = tones[k];
+    const d = sectorPath(frame, { inner, outer: frame.radius, start, end });
+    if (d) strokes.push({ d, role: "encoding", part: "ink", tone });
+    const middle = pointAt(frame, (start + end) / 2, (inner + frame.radius) / 2);
+    hitAreas.push({ seriesKey: valueName, index: s.index, datum: s.datum, value: s.value, x: middle.x, y: middle.y });
+    start = end;
+  });
+  const centre = props.centerValue ?? formatNumber(total, locale, numberFormat);
+  const hasLabel = props.centerLabel !== void 0 && props.centerLabel !== "";
+  labels.push({ x: frame.cx, y: frame.cy + (hasLabel ? 2 : 6), text: typeof centre === "number" ? formatNumber(centre, locale, numberFormat) : centre, kind: "value", part: "text", anchor: "middle" });
+  if (hasLabel) labels.push({ x: frame.cx, y: frame.cy + 16, text: props.centerLabel, kind: "tick", part: "axis", anchor: "middle" });
+  if (withLegend) {
+    const x = ringArea.x + ringArea.width + LEGEND_GAP;
+    const key = sectorLegend(
+      { x, y: plot.y, width: Math.max(plot.x + plot.width - x, 1), height: plot.height },
+      sectors.map((s, k) => ({ name: s.name, share: share(s.value), tone: tones[k] }))
+    );
+    strokes.push(...key.strokes);
+    labels.push(...key.labels);
+  }
+  const largest = sectors.reduce((a, b) => b.value > a.value ? b : a);
+  const description = props.description ?? `${base.name}. Donut of ${sectors.length} sectors totalling ${formatNumber(total, locale, numberFormat)}; the largest is ${largest.name} at ${share(largest.value)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var donutChart = /* @__PURE__ */ Object.freeze({ name: "DonutChart", build: buildDonutChart });
+
+// src/charts/radar-chart/demo.ts
+var RADAR_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { subject: "Speed", value: 8 },
+    { subject: "Range", value: 6 },
+    { subject: "Comfort", value: 7 },
+    { subject: "Safety", value: 9 },
+    { subject: "Cost", value: 4 },
+    { subject: "Style", value: 6 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/radar-chart/radar-chart.ts
+var CHART17 = "RadarChart";
+var validDomain = (d) => !!d && Number.isFinite(d[0]) && Number.isFinite(d[1]) && d[0] < d[1];
+function buildRadarChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? RADAR_CHART_DEMO;
+  const subjectKey = usesDemo ? "subject" : props.subjectKey ?? "subject";
+  const valueKey = usesDemo ? "value" : props.valueKey ?? "value";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const valueName = accessorName(valueKey, "value");
+  checkSectors(CHART17, valueName, data.length);
+  const subjects = readSectors(data, subjectKey, valueKey, CHART17, locale);
+  const byRow = new Map(subjects.map((s) => [s.index, s]));
+  const base = modelBase(CHART17, props, context, "Radar chart", {
+    columns: [accessorName(subjectKey, "subject"), valueName],
+    rows: data.map((_, index) => {
+      const s = byRow.get(index);
+      return s ? [s.name, formatValue(s.value, locale, numberFormat)] : ["\u2014", "\u2014"];
+    })
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = card.area;
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  const pinned = validDomain(props.domain) ? props.domain : void 0;
+  if (subjects.length > 0 && subjects.length < 3) warnValue(CHART17, accessorName(subjectKey, "subject"), `${subjects.length} subjects cannot close a polygon; a radar needs at least three.`);
+  const flat = !pinned && subjects.length > 0 && subjects.every((s) => s.value === 0);
+  if (flat) warnValue(CHART17, valueName, `Every ${valueName} is zero and no \`domain\` is given; there is no scale to draw on.`);
+  if (subjects.length === 0 || flat) return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  const frame = polarFrame(plot, RIM_LABELS);
+  const radius = linearScale(pinned ?? [0, Math.max(...subjects.map((s) => s.value))], [0, frame.radius], {
+    chart: CHART17,
+    property: "domain",
+    padding: context.domainPadding,
+    nice: !pinned
+  });
+  const [low, high] = radius.domain;
+  const slot = 2 * Math.PI / subjects.length;
+  const angleOf = (k) => k * slot;
+  const ring = (r) => subjects.map((_, k) => pointAt(frame, angleOf(k), r)).map((p, k) => `${k === 0 ? "M" : "L"}${p.x},${p.y}`).join("") + "Z";
+  for (const tick of radius.ticks(4)) {
+    const r = radius(tick);
+    if (r <= 0) continue;
+    strokes.push({ d: ring(r), role: "ornament", part: "grid" });
+    if (r > frame.radius - RIM_LABELS) continue;
+    labels.push({ x: frame.cx + 3, y: frame.cy - r - 2, text: formatNumber(tick, locale, numberFormat), kind: "tick", part: "axis", anchor: "start" });
+  }
+  subjects.forEach((_, k) => {
+    const end = pointAt(frame, angleOf(k), frame.radius);
+    strokes.push({ d: `M${frame.cx},${frame.cy}L${end.x},${end.y}`, role: "ornament", part: "grid" });
+  });
+  let outside = 0;
+  const vertices = subjects.map((s, k) => {
+    const held = Math.min(Math.max(s.value, low), high);
+    if (held !== s.value) outside += 1;
+    return { s, point: pointAt(frame, angleOf(k), radius(held)) };
+  });
+  if (outside > 0) warnValue(CHART17, valueName, `${outside} values fall outside the domain [${low}, ${high}]; they are held at its edge.`);
+  strokes.push({ d: vertices.map((v, k) => `${k === 0 ? "M" : "L"}${v.point.x},${v.point.y}`).join("") + "Z", role: "encoding", part: "ink", tone: 1 });
+  for (const v of vertices) hitAreas.push({ seriesKey: valueName, index: v.s.index, datum: v.s.datum, value: v.s.value, x: v.point.x, y: v.point.y });
+  labels.push(...rimLabels(frame, subjects.map((s, k) => ({ angle: angleOf(k), text: s.name }))));
+  const top = subjects.reduce((a, b) => b.value > a.value ? b : a);
+  const bottom = subjects.reduce((a, b) => b.value < a.value ? b : a);
+  const description = props.description ?? `${base.name}. Radar of ${subjects.length} subjects on a scale from ${formatNumber(low, locale, numberFormat)} to ${formatNumber(high, locale, numberFormat)}; highest ${top.name} at ${formatNumber(top.value, locale, numberFormat)}, lowest ${bottom.name} at ${formatNumber(bottom.value, locale, numberFormat)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var radarChart = /* @__PURE__ */ Object.freeze({ name: "RadarChart", build: buildRadarChart });
+
+// src/charts/polar-bar-chart/demo.ts
+var POLAR_BAR_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { name: "Jan", value: 32 },
+    { name: "Feb", value: 28 },
+    { name: "Mar", value: 41 },
+    { name: "Apr", value: 47 },
+    { name: "May", value: 55 },
+    { name: "Jun", value: 61 },
+    { name: "Jul", value: 66 },
+    { name: "Aug", value: 63 },
+    { name: "Sep", value: 52 },
+    { name: "Oct", value: 44 },
+    { name: "Nov", value: 37 },
+    { name: "Dec", value: 49 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/polar-bar-chart/polar-bar-chart.ts
+var CHART18 = "PolarBarChart";
+var HOLE2 = 0.22;
+var SLOT_GAP = 0.14;
+function buildPolarBarChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? POLAR_BAR_CHART_DEMO;
+  const nameKey = usesDemo ? "name" : props.nameKey ?? "name";
+  const valueKey = usesDemo ? "value" : props.valueKey ?? "value";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const valueName = accessorName(valueKey, "value");
+  checkSectors(CHART18, valueName, data.length);
+  const bars = readSectors(data, nameKey, valueKey, CHART18, locale);
+  const byRow = new Map(bars.map((s) => [s.index, s]));
+  const base = modelBase(CHART18, props, context, "Polar bar chart", {
+    columns: [accessorName(nameKey, "name"), valueName],
+    rows: data.map((_, index) => {
+      const s = byRow.get(index);
+      return s ? [s.name, formatValue(s.value, locale, numberFormat)] : ["\u2014", "\u2014"];
+    })
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = card.area;
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  const largest = Math.max(0, ...bars.map((b) => b.value));
+  if (bars.length > 0 && largest <= 0) warnValue(CHART18, valueName, "Every value is zero; no bar has a length.");
+  if (bars.length === 0 || largest <= 0) return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  const frame = polarFrame(plot, RIM_LABELS);
+  const hole = frame.radius * HOLE2;
+  const reach = frame.radius - hole;
+  const slot = 2 * Math.PI / bars.length;
+  strokes.push({ d: arcPath(frame, hole, 0, 2 * Math.PI), role: "ornament", part: "rule" });
+  bars.forEach((b, k) => {
+    const start = k * slot + slot * SLOT_GAP / 2;
+    const end = (k + 1) * slot - slot * SLOT_GAP / 2;
+    const tip = hole + b.value / largest * reach;
+    const d = sectorPath(frame, { inner: hole, outer: tip, start, end });
+    if (d && tip > hole) strokes.push({ d, role: "encoding", part: "ink", tone: 2 });
+    const at2 = pointAt(frame, (start + end) / 2, tip);
+    hitAreas.push({ seriesKey: valueName, index: b.index, datum: b.datum, value: b.value, x: at2.x, y: at2.y });
+  });
+  labels.push(...rimLabels(frame, bars.map((b, k) => ({ angle: (k + 0.5) * slot, text: b.name }))));
+  const top = bars.reduce((a, b) => b.value > a.value ? b : a);
+  const description = props.description ?? `${base.name}. Polar bars for ${bars.length} categories around the circle; the longest is ${top.name} at ${formatNumber(top.value, locale, numberFormat)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var polarBarChart = /* @__PURE__ */ Object.freeze({ name: "PolarBarChart", build: buildPolarBarChart });
+
+// src/charts/coxcomb-chart/demo.ts
+var COXCOMB_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { name: "Mon", value: 42 },
+    { name: "Tue", value: 35 },
+    { name: "Wed", value: 31 },
+    { name: "Thu", value: 38 },
+    { name: "Fri", value: 27 },
+    { name: "Sat", value: 12 },
+    { name: "Sun", value: 9 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/coxcomb-chart/coxcomb-chart.ts
+var CHART19 = "CoxcombChart";
+function buildCoxcombChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? COXCOMB_CHART_DEMO;
+  const nameKey = usesDemo ? "name" : props.nameKey ?? "name";
+  const valueKey = usesDemo ? "value" : props.valueKey ?? "value";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const valueName = accessorName(valueKey, "value");
+  checkSectors(CHART19, valueName, data.length);
+  const sectors = readSectors(data, nameKey, valueKey, CHART19, locale);
+  const byRow = new Map(sectors.map((s) => [s.index, s]));
+  const base = modelBase(CHART19, props, context, "Coxcomb chart", {
+    columns: [accessorName(nameKey, "name"), valueName],
+    rows: data.map((_, index) => {
+      const s = byRow.get(index);
+      return s ? [s.name, formatValue(s.value, locale, numberFormat)] : ["\u2014", "\u2014"];
+    })
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = card.area;
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  const largest = Math.max(0, ...sectors.map((s) => s.value));
+  if (sectors.length > 0 && largest <= 0) warnValue(CHART19, valueName, "Every value is zero; no sector has an area.");
+  if (sectors.length === 0 || largest <= 0) return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  const frame = polarFrame(plot, RIM_LABELS);
+  const start = Number.isFinite(props.startAngle) ? props.startAngle * Math.PI / 180 : 0;
+  const slot = 2 * Math.PI / sectors.length;
+  strokes.push({ d: arcPath(frame, frame.radius, 0, 2 * Math.PI), role: "ornament", part: "grid" });
+  const tones = ringTones(sectors.map((s) => s.value));
+  sectors.forEach((s, k) => {
+    const from = start + k * slot;
+    const r = frame.radius * Math.sqrt(s.value / largest);
+    const d = sectorPath(frame, { inner: 0, outer: r, start: from, end: from + slot });
+    if (d) strokes.push({ d, role: "encoding", part: "ink", tone: tones[k] });
+    const at2 = pointAt(frame, from + slot / 2, r * 0.6);
+    hitAreas.push({ seriesKey: valueName, index: s.index, datum: s.datum, value: s.value, x: at2.x, y: at2.y });
+  });
+  labels.push(...rimLabels(frame, sectors.map((s, k) => ({ angle: start + (k + 0.5) * slot, text: s.name }))));
+  const top = sectors.reduce((a, b) => b.value > a.value ? b : a);
+  const description = props.description ?? `${base.name}. Coxcomb of ${sectors.length} equal-angle sectors whose area is proportional to the value; the largest is ${top.name} at ${formatNumber(top.value, locale, numberFormat)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var coxcombChart = /* @__PURE__ */ Object.freeze({ name: "CoxcombChart", build: buildCoxcombChart });
+
+// src/charts/shared/tracks.ts
+var HOLE3 = 0.3;
+var BAND_FILL = 0.72;
+var LEGEND_WIDTH = 110;
+var LEGEND_GAP2 = 12;
+function buildTracks(family, props, context) {
+  const { chart } = family;
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? family.demo;
+  const nameKey = usesDemo ? "name" : props.nameKey ?? "name";
+  const valueKey = usesDemo ? "value" : props.valueKey ?? "value";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const valueName = accessorName(valueKey, "value");
+  checkSectors(chart, valueName, data.length);
+  const sectors = readSectors(data, nameKey, valueKey, chart, locale);
+  const byRow = new Map(sectors.map((s) => [s.index, s]));
+  const base = modelBase(chart, props, context, family.fallbackName, {
+    columns: [accessorName(nameKey, "name"), valueName],
+    rows: data.map((_, index) => {
+      const s = byRow.get(index);
+      return s ? [s.name, formatValue(s.value, locale, numberFormat)] : ["\u2014", "\u2014"];
+    })
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = card.area;
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (sectors.length === 0) return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  const withLegend = plot.width >= LEGEND_WIDTH * 2;
+  const drawing = withLegend ? { ...plot, width: plot.width - LEGEND_WIDTH - LEGEND_GAP2 } : plot;
+  const frame = family.frameIn(drawing);
+  const hole = frame.radius * HOLE3;
+  const band = (frame.radius - hole) / sectors.length;
+  let saturated = 0;
+  sectors.forEach((s, k) => {
+    const outer = frame.radius - k * band;
+    const inner = outer - band * BAND_FILL;
+    const middle = (outer + inner) / 2;
+    strokes.push({ d: arcPath(frame, middle, family.start, family.start + family.span), role: "ornament", part: "grid" });
+    const raw = family.shareOf(s, sectors);
+    const share = Math.min(Math.max(raw, 0), 1);
+    if (share !== raw) saturated += 1;
+    const end = family.start + share * family.span;
+    const d = sectorPath(frame, { inner, outer, start: family.start, end });
+    if (d) strokes.push({ d, role: "encoding", part: "ink", tone: 2 });
+    const tip = pointAt(frame, end, middle);
+    hitAreas.push({ seriesKey: valueName, index: s.index, datum: s.datum, value: s.value, x: tip.x, y: tip.y });
+  });
+  if (saturated > 0) warnValue(chart, valueName, `${saturated} values fall outside the track's range; they are drawn at its end.`);
+  if (withLegend) {
+    const x = drawing.x + drawing.width + LEGEND_GAP2;
+    const key = sectorLegend(
+      { x, y: plot.y, width: plot.x + plot.width - x, height: plot.height },
+      sectors.map((s) => ({ name: s.name, share: family.printed(s, locale, numberFormat), tone: 2 }))
+    );
+    strokes.push(...key.strokes);
+    labels.push(...key.labels);
+  }
+  const description = props.description ?? `${base.name}. ${sectors.length} concentric tracks, outermost first: ${sectors.map((s) => `${s.name} ${family.printed(s, locale, numberFormat)}`).join(", ")}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+function halfCircleFrame(area5, bottomRoom) {
+  const radius = Math.max(Math.min(area5.width / 2, area5.height - bottomRoom) - PLOT_INSET, 1);
+  return { cx: area5.x + area5.width / 2, cy: area5.y + area5.height - bottomRoom, radius };
+}
+
+// src/charts/radial-arc-group/demo.ts
+var RADIAL_ARC_GROUP_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { name: "Direct", value: 84 },
+    { name: "Partners", value: 62 },
+    { name: "Online", value: 47 },
+    { name: "Events", value: 23 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/radial-arc-group/radial-arc-group.ts
+var FAMILY = {
+  chart: "RadialArcGroup",
+  fallbackName: "Radial arc group",
+  // From 9 o'clock over the top to 3: a half turn.
+  start: -Math.PI / 2,
+  span: Math.PI,
+  frameIn: (area5) => halfCircleFrame(area5, 8),
+  // The largest value sweeps the whole half turn.
+  shareOf: (s, all) => s.value / Math.max(...all.map((x) => x.value), Number.MIN_VALUE),
+  printed: (s, locale, numberFormat) => formatNumber(s.value, locale, numberFormat),
+  demo: RADIAL_ARC_GROUP_DEMO
+};
+var radialArcGroup = /* @__PURE__ */ Object.freeze({
+  name: "RadialArcGroup",
+  build: (props, context) => buildTracks(FAMILY, props, context)
+});
+
+// src/charts/radial-rings/demo.ts
+var RADIAL_RINGS_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { name: "Move", value: 82 },
+    { name: "Exercise", value: 64 },
+    { name: "Stand", value: 100 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/radial-rings/radial-rings.ts
+var FAMILY2 = {
+  chart: "RadialRings",
+  fallbackName: "Radial rings",
+  // A full turn from 12 o'clock: a ring is progress towards 100.
+  start: 0,
+  span: 2 * Math.PI,
+  frameIn: (area5) => polarFrame(area5),
+  shareOf: (s) => s.value / 100,
+  printed: (s, locale) => `${formatNumber(s.value, locale, { maximumFractionDigits: 1 })}%`,
+  demo: RADIAL_RINGS_DEMO
+};
+var radialRings = /* @__PURE__ */ Object.freeze({
+  name: "RadialRings",
+  build: (props, context) => buildTracks(FAMILY2, props, context)
+});
+
+// src/charts/shared/scalar.ts
+var SCALAR_DEMO = 72;
+function buildScalar(family, props, context) {
+  const { chart } = family;
+  const { locale } = context;
+  const raw = props.percent === void 0 ? SCALAR_DEMO : props.percent;
+  let value;
+  if (typeof raw !== "number" || !Number.isFinite(raw)) {
+    warnValue(chart, "percent", `The percent is ${String(raw)}; a meter needs a finite number, so none is drawn.`);
+  } else {
+    value = Math.min(Math.max(raw, 0), 100);
+    if (value !== raw) warnValue(chart, "percent", `The percent is ${raw}; it is drawn at ${value}, the end of the 0-100 range.`);
+  }
+  const printed = value === void 0 ? "\u2014" : props.readout ?? `${formatNumber(value, locale, { maximumFractionDigits: 1 })}%`;
+  const caption = props.caption && props.caption !== "" ? props.caption : void 0;
+  const base = modelBase(chart, props, context, family.fallbackName, { columns: ["measure", "value"], rows: [[caption ?? "value", printed]] });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = card.area;
+  const frame = family.frameIn(plot);
+  const drawing = family.draw(frame, value);
+  const strokes = [...card.strokes, ...drawing.strokes];
+  const labels = [...card.labels, ...drawing.labels];
+  const at2 = family.readoutAt(frame);
+  labels.push({ x: frame.cx, y: at2.value, text: printed, kind: "value", part: "text", anchor: "middle" });
+  if (caption) labels.push({ x: frame.cx, y: at2.caption, text: caption, kind: "tick", part: "axis", anchor: "middle" });
+  const hitAreas = [];
+  if (value !== void 0 && drawing.tip) {
+    hitAreas.push({ seriesKey: "value", index: 0, datum: { value }, value, x: drawing.tip.x, y: drawing.tip.y });
+  }
+  const description = props.description ?? `${base.name}. ${caption ?? "The value"} at ${printed}${props.readout && value !== void 0 ? ` (${formatNumber(value, locale, void 0)}% of the range)` : " of the range"}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+
+// src/charts/gauge-arc/gauge-arc.ts
+var START = -2 * Math.PI / 3;
+var SPAN = 4 * Math.PI / 3;
+var BAND = 0.8;
+var FAMILY3 = {
+  chart: "GaugeArc",
+  fallbackName: "Gauge",
+  // A 240° arc reaches half a radius below the centre: it needs 1.5 radii of height.
+  frameIn: (area5) => {
+    const radius = Math.max(Math.min(area5.width / 2, area5.height / 1.5) - PLOT_INSET, 1);
+    return { cx: area5.x + area5.width / 2, cy: area5.y + (area5.height - 1.5 * radius) / 2 + radius, radius };
+  },
+  // Inside the ring, which the value never crosses.
+  readoutAt: (frame) => ({ value: frame.cy + 2, caption: frame.cy + 16 }),
+  draw: (frame, value) => {
+    const inner = frame.radius * BAND;
+    const middle = (inner + frame.radius) / 2;
+    const strokes = [{ d: arcPath(frame, middle, START, START + SPAN), role: "ornament", part: "grid" }];
+    if (value === void 0) return { strokes, labels: [] };
+    const end = START + value / 100 * SPAN;
+    const d = sectorPath(frame, { inner, outer: frame.radius, start: START, end });
+    return { strokes: d ? [...strokes, { d, role: "encoding", part: "ink", tone: 2 }] : strokes, labels: [], tip: pointAt(frame, end, middle) };
+  }
+};
+var gaugeArc = /* @__PURE__ */ Object.freeze({
+  name: "GaugeArc",
+  build: (props, context) => buildScalar(FAMILY3, props, context)
+});
+
+// src/charts/meter-chart/meter-chart.ts
+var START2 = -Math.PI / 2;
+var SPAN2 = Math.PI;
+var TICKS = [0, 25, 50, 75, 100];
+var NEEDLE = 0.86;
+var FAMILY4 = {
+  chart: "MeterChart",
+  fallbackName: "Meter",
+  // Under the pivot, clear of the needle, which sweeps only the upper half: the 30 px readout
+  // stands up to 22 px above its baseline, and the caption goes under it.
+  frameIn: (area5) => halfCircleFrame(area5, 46),
+  readoutAt: (frame) => ({ value: frame.cy + 29, caption: frame.cy + 42 }),
+  draw: (frame, value) => {
+    const strokes = [{ d: arcPath(frame, frame.radius, START2, START2 + SPAN2), role: "ornament", part: "grid" }];
+    const labels = [];
+    for (const tick of TICKS) {
+      const angle = START2 + tick / 100 * SPAN2;
+      const a = pointAt(frame, angle, frame.radius * 0.9);
+      const b = pointAt(frame, angle, frame.radius);
+      strokes.push({ d: `M${a.x},${a.y}L${b.x},${b.y}`, role: "ornament", part: "rule" });
+    }
+    labels.push({ x: frame.cx - frame.radius, y: frame.cy + 11, text: "0", kind: "tick", part: "axis", anchor: "middle" });
+    labels.push({ x: frame.cx + frame.radius, y: frame.cy + 11, text: "100", kind: "tick", part: "axis", anchor: "middle" });
+    if (value === void 0) return { strokes, labels };
+    const tip = pointAt(frame, START2 + value / 100 * SPAN2, frame.radius * NEEDLE);
+    strokes.push({ d: `M${frame.cx},${frame.cy}L${tip.x},${tip.y}`, role: "encoding", part: "ink" });
+    return { strokes, labels, tip };
+  }
+};
+var meterChart = /* @__PURE__ */ Object.freeze({
+  name: "MeterChart",
+  build: (props, context) => buildScalar(FAMILY4, props, context)
+});
+
+// src/charts/wind-rose/demo.ts
+var WIND_ROSE_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    [180, 11],
+    [170, 11],
+    [180, 9],
+    [180, 10],
+    [170, 7],
+    [180, 11],
+    [180, 10],
+    [180, 9],
+    [160, 7],
+    [150, 6],
+    [140, 9],
+    [150, 8],
+    [160, 8],
+    [180, 9],
+    [190, 8],
+    [200, 12],
+    [190, 16],
+    [210, 16],
+    [170, 17],
+    [180, 16],
+    [190, 15],
+    [190, 17],
+    [190, 13],
+    [180, 14],
+    [170, 9],
+    [170, 11],
+    [160, 9],
+    [150, 6],
+    [150, 7],
+    [150, 8],
+    [160, 9],
+    [160, 9],
+    [140, 7],
+    [150, 9],
+    [150, 7],
+    [140, 7],
+    [140, 8],
+    [150, 9],
+    [160, 12],
+    [170, 10],
+    [170, 11],
+    [140, 14],
+    [150, 15],
+    [150, 17],
+    [140, 16],
+    [140, 18],
+    [150, 21],
+    [140, 14],
+    [140, 13],
+    [130, 12],
+    [140, 16],
+    [150, 13],
+    [160, 15],
+    [160, 14],
+    [160, 16],
+    [160, 18],
+    [170, 15],
+    [170, 17],
+    [170, 19],
+    [170, 20],
+    [170, 20],
+    [180, 20],
+    [180, 22],
+    [190, 21],
+    [180, 26],
+    [190, 20],
+    [200, 22],
+    [210, 29],
+    [210, 27],
+    [250, 22],
+    [270, 17],
+    [300, 16],
+    [320, 13],
+    [330, 8],
+    [350, 8],
+    [30, 7],
+    [20, 10],
+    [110, 7],
+    [100, 9],
+    [80, 7],
+    [90, 7],
+    [70, 9],
+    [40, 10],
+    [20, 12],
+    [50, 17],
+    [30, 9],
+    [50, 15],
+    [50, 12],
+    [30, 15],
+    [30, 9],
+    [30, 13],
+    [40, 11],
+    [20, 12],
+    [10, 15],
+    [20, 10],
+    [20, 16],
+    [40, 14],
+    [30, 12],
+    [10, 10],
+    [360, 9],
+    [10, 11],
+    [360, 14],
+    [10, 10],
+    [10, 10],
+    [20, 4],
+    [20, 6],
+    [350, 6],
+    [350, 4],
+    [360, 6],
+    [30, 6],
+    [40, 8],
+    [10, 5],
+    [0, 0],
+    [320, 3],
+    [0, 0],
+    [0, 0],
+    [310, 7],
+    [310, 11],
+    [330, 6],
+    [350, 5],
+    [350, 5],
+    [20, 3],
+    [10, 3],
+    [0, 0],
+    [80, 5],
+    [0, 0],
+    [0, 0],
+    [0, 0],
+    [0, 0],
+    [280, 3],
+    [0, 0],
+    [0, 0],
+    [70, 6],
+    [110, 8],
+    [130, 5],
+    [90, 9],
+    [110, 10],
+    [130, 12],
+    [120, 10],
+    [110, 11],
+    [110, 8],
+    [110, 11],
+    [100, 10],
+    [110, 7],
+    [100, 10],
+    [140, 9],
+    [70, 12],
+    [120, 10],
+    [100, 9],
+    [100, 7],
+    [100, 6],
+    [100, 9],
+    [100, 6],
+    [80, 7],
+    [80, 8],
+    [70, 8],
+    [80, 9],
+    [80, 10],
+    [100, 8],
+    [80, 7],
+    [80, 8],
+    [60, 9],
+    [90, 10],
+    [90, 8],
+    [90, 7],
+    [90, 12],
+    [80, 10],
+    [80, 14],
+    [80, 12],
+    [50, 9],
+    [30, 10],
+    [40, 11],
+    [40, 7],
+    [30, 9],
+    [30, 8],
+    [30, 10],
+    [20, 11],
+    [360, 13],
+    [360, 13],
+    [360, 12],
+    [350, 12],
+    [350, 11],
+    [340, 13],
+    [350, 11],
+    [330, 13],
+    [330, 10],
+    [330, 11],
+    [330, 10],
+    [330, 7],
+    [310, 7],
+    [340, 10],
+    [340, 14],
+    [340, 9],
+    [340, 9],
+    [340, 10],
+    [330, 13],
+    [340, 10],
+    [320, 8],
+    [310, 8],
+    [310, 6],
+    [310, 6],
+    [310, 7],
+    [310, 8],
+    [290, 5],
+    [310, 8],
+    [320, 10],
+    [330, 13],
+    [320, 15],
+    [320, 11],
+    [290, 15],
+    [310, 17],
+    [310, 18],
+    [300, 18],
+    [320, 16],
+    [330, 8],
+    [320, 7],
+    [330, 7],
+    [350, 3],
+    [350, 3],
+    [310, 4],
+    [300, 3],
+    [300, 3],
+    [280, 3],
+    [270, 3],
+    [240, 3],
+    [300, 3],
+    [270, 3],
+    [0, 0],
+    [0, 0],
+    [0, 0],
+    [150, 4],
+    [170, 5],
+    [220, 6],
+    [230, 7],
+    [180, 10],
+    [190, 8],
+    [200, 6],
+    [200, 9],
+    [170, 7],
+    [150, 8],
+    [150, 10],
+    [150, 9],
+    [160, 9],
+    [150, 8],
+    [160, 8],
+    [180, 9],
+    [190, 8],
+    [200, 12],
+    [190, 11],
+    [200, 13],
+    [200, 12],
+    [210, 13],
+    [220, 12],
+    [220, 16],
+    [230, 15],
+    [210, 14],
+    [220, 16],
+    [210, 15],
+    [220, 18],
+    [200, 21],
+    [220, 20],
+    [220, 16],
+    [210, 13],
+    [200, 13],
+    [200, 11],
+    [190, 12],
+    [200, 11],
+    [200, 10],
+    [200, 11],
+    [200, 11],
+    [200, 9],
+    [200, 10],
+    [210, 12],
+    [220, 9],
+    [210, 10],
+    [210, 10],
+    [210, 9],
+    [220, 15],
+    [240, 12],
+    [270, 8],
+    [240, 5],
+    [280, 6],
+    [200, 5],
+    [180, 7],
+    [220, 5],
+    [0, 0],
+    [0, 0],
+    [0, 0],
+    [20, 3],
+    [30, 3],
+    [10, 3],
+    [70, 4],
+    [0, 0],
+    [150, 4],
+    [0, 0],
+    [0, 0],
+    [80, 5],
+    [60, 4],
+    [70, 4],
+    [50, 3],
+    [90, 7],
+    [100, 8],
+    [150, 4],
+    [170, 8],
+    [140, 6],
+    [90, 9],
+    [100, 9],
+    [80, 9],
+    [100, 11],
+    [90, 10],
+    [100, 8],
+    [90, 7],
+    [90, 5],
+    [80, 6],
+    [40, 6],
+    [70, 6],
+    [100, 7],
+    [100, 5],
+    [100, 9],
+    [180, 5],
+    [80, 6],
+    [40, 6],
+    [50, 23],
+    [70, 9],
+    [360, 5],
+    [350, 3],
+    [360, 7],
+    [20, 12],
+    [20, 10],
+    [20, 12],
+    [40, 12],
+    [30, 11],
+    [40, 13],
+    [30, 12],
+    [20, 11],
+    [40, 13],
+    [10, 7],
+    [360, 5],
+    [20, 4],
+    [30, 5],
+    [330, 5],
+    [320, 5],
+    [330, 6],
+    [340, 7],
+    [350, 5],
+    [320, 10],
+    [320, 11],
+    [330, 9],
+    [340, 9],
+    [320, 8],
+    [300, 6],
+    [300, 9],
+    [320, 10],
+    [310, 14],
+    [280, 11],
+    [320, 10],
+    [290, 11],
+    [290, 12],
+    [300, 9],
+    [290, 7],
+    [280, 5],
+    [210, 8],
+    [220, 5],
+    [260, 3],
+    [230, 8],
+    [240, 7],
+    [230, 10],
+    [230, 11],
+    [250, 13],
+    [250, 15],
+    [250, 18],
+    [260, 11],
+    [270, 14],
+    [300, 16],
+    [310, 21],
+    [310, 21],
+    [310, 20],
+    [310, 25],
+    [290, 23],
+    [300, 20],
+    [300, 18],
+    [310, 20],
+    [300, 16],
+    [300, 14],
+    [310, 15],
+    [320, 12],
+    [320, 10],
+    [320, 10],
+    [310, 10],
+    [310, 9],
+    [310, 10],
+    [310, 8],
+    [330, 7],
+    [330, 8],
+    [300, 7],
+    [320, 7],
+    [360, 7],
+    [320, 18],
+    [330, 16],
+    [310, 21],
+    [340, 16],
+    [320, 20],
+    [330, 17],
+    [320, 22],
+    [320, 17],
+    [330, 16],
+    [320, 18],
+    [340, 10],
+    [330, 11],
+    [320, 14],
+    [330, 9],
+    [320, 11],
+    [320, 9],
+    [320, 13],
+    [320, 10],
+    [320, 13],
+    [320, 12],
+    [320, 11],
+    [320, 12],
+    [310, 14],
+    [320, 12],
+    [310, 15],
+    [320, 12],
+    [320, 12],
+    [320, 15],
+    [280, 11],
+    [300, 12],
+    [270, 12],
+    [280, 11],
+    [260, 11],
+    [250, 6],
+    [240, 6],
+    [220, 6],
+    [210, 7],
+    [210, 10],
+    [210, 10],
+    [210, 10],
+    [220, 10],
+    [210, 12],
+    [220, 14],
+    [220, 11],
+    [230, 9],
+    [250, 10],
+    [260, 9],
+    [270, 11],
+    [310, 16],
+    [330, 11],
+    [310, 9],
+    [340, 13],
+    [320, 12],
+    [320, 12],
+    [310, 18],
+    [340, 11],
+    [320, 17],
+    [300, 12],
+    [310, 8],
+    [300, 5],
+    [360, 11],
+    [10, 9],
+    [350, 6],
+    [10, 6],
+    [10, 11],
+    [350, 9],
+    [330, 13],
+    [350, 9],
+    [330, 14],
+    [340, 8],
+    [350, 10],
+    [360, 13],
+    [360, 13],
+    [20, 10],
+    [350, 11],
+    [350, 9],
+    [360, 11],
+    [350, 8],
+    [40, 10],
+    [30, 7],
+    [10, 11],
+    [340, 7],
+    [10, 4],
+    [10, 4],
+    [30, 9],
+    [40, 8],
+    [50, 8],
+    [60, 6],
+    [60, 4],
+    [60, 7],
+    [70, 8],
+    [70, 11],
+    [60, 8],
+    [80, 6],
+    [70, 8],
+    [100, 10],
+    [120, 9],
+    [70, 8],
+    [120, 8],
+    [80, 11],
+    [120, 8],
+    [120, 11],
+    [90, 6],
+    [120, 11],
+    [100, 14],
+    [100, 11],
+    [110, 7],
+    [110, 9],
+    [100, 10],
+    [110, 10],
+    [120, 10],
+    [130, 10],
+    [90, 6],
+    [20, 6],
+    [60, 10],
+    [50, 16],
+    [20, 13],
+    [50, 11],
+    [90, 11],
+    [50, 6],
+    [30, 8],
+    [360, 9],
+    [360, 8],
+    [350, 8],
+    [350, 12],
+    [360, 12],
+    [360, 12],
+    [10, 10],
+    [360, 12],
+    [360, 9],
+    [10, 11],
+    [360, 10],
+    [360, 9],
+    [350, 6],
+    [360, 5],
+    [360, 5],
+    [10, 5],
+    [360, 4],
+    [360, 3],
+    [360, 6],
+    [360, 6],
+    [20, 5],
+    [20, 7],
+    [30, 5],
+    [70, 7],
+    [70, 8],
+    [80, 12],
+    [90, 5],
+    [120, 9],
+    [120, 5],
+    [110, 7],
+    [100, 10],
+    [110, 13],
+    [110, 13],
+    [120, 13],
+    [100, 13],
+    [110, 14],
+    [100, 11],
+    [110, 11],
+    [110, 11],
+    [100, 8],
+    [90, 10],
+    [90, 10],
+    [90, 11],
+    [90, 13],
+    [100, 15],
+    [110, 13],
+    [100, 13],
+    [100, 10],
+    [90, 8],
+    [90, 11],
+    [100, 13],
+    [100, 11],
+    [110, 10],
+    [120, 10],
+    [130, 12],
+    [140, 11],
+    [110, 5],
+    [120, 5],
+    [80, 11],
+    [100, 9],
+    [90, 8],
+    [120, 11],
+    [120, 11],
+    [130, 12],
+    [140, 11],
+    [130, 11],
+    [130, 14],
+    [130, 15],
+    [130, 11],
+    [130, 12],
+    [160, 5],
+    [160, 10],
+    [150, 6],
+    [160, 15],
+    [180, 15],
+    [180, 10],
+    [150, 10],
+    [160, 16],
+    [150, 14],
+    [130, 12],
+    [130, 12],
+    [150, 15],
+    [150, 13],
+    [150, 8],
+    [200, 7],
+    [200, 5],
+    [320, 7],
+    [310, 9],
+    [300, 13],
+    [340, 6],
+    [310, 19],
+    [310, 17],
+    [310, 15],
+    [300, 16],
+    [310, 18],
+    [300, 22],
+    [320, 19],
+    [300, 22],
+    [300, 19],
+    [300, 22],
+    [290, 20],
+    [290, 17],
+    [300, 22],
+    [280, 20],
+    [300, 20],
+    [310, 18],
+    [310, 19],
+    [290, 19],
+    [300, 14],
+    [300, 19],
+    [300, 12],
+    [280, 17],
+    [300, 12],
+    [300, 11],
+    [300, 11],
+    [280, 8],
+    [290, 11],
+    [290, 9],
+    [290, 10],
+    [270, 13],
+    [290, 12],
+    [280, 12],
+    [310, 12],
+    [290, 14],
+    [290, 12],
+    [270, 9],
+    [240, 13],
+    [210, 14],
+    [240, 11],
+    [240, 7],
+    [230, 5],
+    [220, 5],
+    [180, 5],
+    [180, 4],
+    [170, 7],
+    [180, 5],
+    [170, 4],
+    [70, 4],
+    [140, 6],
+    [30, 3],
+    [60, 3],
+    [90, 4],
+    [0, 0],
+    [100, 5],
+    [110, 8],
+    [90, 5],
+    [50, 6],
+    [60, 6],
+    [0, 0],
+    [0, 0],
+    [20, 7],
+    [40, 7],
+    [60, 9],
+    [60, 8],
+    [70, 8],
+    [80, 9],
+    [80, 10],
+    [80, 9],
+    [90, 11],
+    [100, 11],
+    [90, 7],
+    [90, 8],
+    [100, 10],
+    [100, 9],
+    [100, 8],
+    [110, 11],
+    [100, 11],
+    [110, 11],
+    [100, 13],
+    [100, 11],
+    [190, 18],
+    [160, 13],
+    [180, 13],
+    [160, 15],
+    [180, 11],
+    [120, 6],
+    [70, 7],
+    [70, 8],
+    [80, 8],
+    [70, 5],
+    [330, 5],
+    [10, 10],
+    [350, 6],
+    [280, 9],
+    [300, 13],
+    [320, 15],
+    [320, 13],
+    [310, 12],
+    [310, 14],
+    [330, 8],
+    [330, 13],
+    [340, 12],
+    [330, 12],
+    [350, 8],
+    [340, 9],
+    [360, 5],
+    [30, 4],
+    [10, 10],
+    [360, 9],
+    [350, 6],
+    [360, 4],
+    [10, 8],
+    [10, 8],
+    [30, 8],
+    [20, 8],
+    [30, 6],
+    [20, 7],
+    [30, 11],
+    [20, 8],
+    [30, 9],
+    [40, 8],
+    [30, 5],
+    [30, 6],
+    [50, 8],
+    [60, 11],
+    [50, 8],
+    [90, 9],
+    [50, 12],
+    [80, 8],
+    [70, 15],
+    [80, 12],
+    [90, 10],
+    [80, 11],
+    [70, 12]
+  ].map(([bearing, speed]) => Object.freeze({ bearing, speed }))
+);
+
+// src/charts/wind-rose/wind-rose.ts
+var CHART20 = "WindRose";
+var COUNTS = [4, 8, 16, 32];
+var DEFAULT_SECTORS = 16;
+var DEFAULT_BINS = [5, 10, 15, 20];
+var POINTS_16 = ["N", "NNE", "NE", "ENE", "E", "ESE", "SE", "SSE", "S", "SSW", "SW", "WSW", "W", "WNW", "NW", "NNW"];
+var BIN_TONES = [1, 2, 3, 4];
+var SECTOR_GAP = 0.08;
+var LEGEND_ASPECT2 = 1.5;
+var LEGEND_GAP3 = 14;
+function compass(k, count, locale) {
+  if (count <= 16) return POINTS_16[k * 16 / count];
+  return `${formatNumber(k * 360 / count, locale, { maximumFractionDigits: 2 })}\xB0`;
+}
+var validBins = (bins) => !!bins && bins.length > 0 && bins.every((b, i) => Number.isFinite(b) && b > 0 && (i === 0 || b > bins[i - 1]));
+function buildWindRose(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? WIND_ROSE_DEMO;
+  const bearingKey = usesDemo ? "bearing" : props.bearingKey ?? "bearing";
+  const valueKey = usesDemo ? "speed" : props.valueKey ?? "speed";
+  const { locale } = context;
+  const bearingName = accessorName(bearingKey, "bearing");
+  const speedName = accessorName(valueKey, "speed");
+  const count = props.sectors === void 0 || COUNTS.includes(props.sectors) ? props.sectors ?? DEFAULT_SECTORS : DEFAULT_SECTORS;
+  if (count !== (props.sectors ?? DEFAULT_SECTORS)) warnValue(CHART20, "sectors", `${String(props.sectors)} sectors cannot divide a compass; ${DEFAULT_SECTORS} are drawn.`);
+  const bins = props.bins === void 0 ? DEFAULT_BINS : validBins(props.bins) ? props.bins : DEFAULT_BINS;
+  if (bins !== (props.bins ?? DEFAULT_BINS)) warnValue(CHART20, "bins", "The speed bins must be positive and ascending; the defaults are used.");
+  const binLabels = [
+    `< ${formatNumber(bins[0], locale, void 0)}`,
+    ...bins.slice(1).map((b, i) => `${formatNumber(bins[i], locale, void 0)}\u2013${formatNumber(b, locale, void 0)}`),
+    `\u2265 ${formatNumber(bins.at(-1), locale, void 0)}`
+  ];
+  const width = 2 * Math.PI / count;
+  const tally = Array.from({ length: count }, () => new Array(binLabels.length).fill(0));
+  let calm = 0;
+  let observed = 0;
+  data.forEach((datum, index) => {
+    const bearing = finite(read(bearingKey, datum, index));
+    const speed = finite(read(valueKey, datum, index));
+    if (bearing === void 0 || speed === void 0 || speed < 0) {
+      warnValue(CHART20, bearing === void 0 ? bearingName : speedName, `Row ${index} lacks a finite bearing or a speed \u2265 0; it is omitted.`);
+      return;
+    }
+    observed += 1;
+    if (speed === 0) {
+      calm += 1;
+      return;
+    }
+    const k = Math.round((bearing % 360 + 360) % 360 / (360 / count)) % count;
+    const bin = bins.filter((b) => speed >= b).length;
+    tally[k][bin] = tally[k][bin] + 1;
+  });
+  const pct = (n) => observed > 0 ? n / observed * 100 : 0;
+  const printed = (n) => `${formatNumber(pct(n), locale, { maximumFractionDigits: 0 })}%`;
+  const totals = tally.map((row) => row.reduce((a, b) => a + b, 0));
+  const base = modelBase(CHART20, props, context, "Wind rose", {
+    columns: ["direction", "share", ...binLabels],
+    rows: tally.map((row, k) => [compass(k, count, locale), printed(totals[k]), ...row.map(printed)])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = card.area;
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (observed === 0) return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  const withLegend = plot.width >= plot.height * LEGEND_ASPECT2;
+  const roseArea = withLegend ? { x: plot.x, y: plot.y, width: plot.height, height: plot.height } : plot;
+  const frame = polarFrame(roseArea, RIM_LABELS);
+  const largest = Math.max(...totals.map(pct));
+  const radius = linearScale([0, Math.max(largest, Number.MIN_VALUE)], [0, frame.radius], { chart: CHART20, property: "share", padding: 0, nice: true });
+  for (const tick of radius.ticks(3)) {
+    const r = radius(tick);
+    if (r <= 0 || r > frame.radius + 0.01) continue;
+    strokes.push({ d: arcPath(frame, r, 0, 2 * Math.PI), role: "ornament", part: "grid" });
+    if (r > frame.radius - RIM_LABELS) continue;
+    const at2 = pointAt(frame, width / 2, r);
+    labels.push({ x: at2.x + 2, y: at2.y - 2, text: `${formatNumber(tick, locale, { maximumFractionDigits: 0 })}%`, kind: "tick", part: "axis", anchor: "start" });
+  }
+  tally.forEach((row, k) => {
+    const start = k * width - width / 2 + width * SECTOR_GAP;
+    const end = (k + 1) * width - width / 2 - width * SECTOR_GAP;
+    let running = 0;
+    row.forEach((n, bin) => {
+      if (n === 0) return;
+      const inner = radius(pct(running));
+      running += n;
+      const d = sectorPath(frame, { inner, outer: radius(pct(running)), start, end });
+      if (d) strokes.push({ d, role: "encoding", part: "ink", tone: BIN_TONES[bin % BIN_TONES.length] });
+    });
+    const tip = pointAt(frame, k * width, radius(pct(running)));
+    const direction = compass(k, count, locale);
+    hitAreas.push({ seriesKey: "share", index: k, datum: { direction, share: pct(running) }, value: pct(running), x: tip.x, y: tip.y });
+  });
+  labels.push(...rimLabels(frame, tally.map((_, k) => ({ angle: k * width, text: compass(k, count, locale) })), 16));
+  const calmText = `calm ${printed(calm)}`;
+  if (withLegend) {
+    const x = roseArea.x + roseArea.width + LEGEND_GAP3;
+    const area5 = { x, y: plot.y, width: Math.max(plot.x + plot.width - x, 1), height: plot.height - 16 };
+    const binTotals = binLabels.map((_, bin) => tally.reduce((sum, row) => sum + row[bin], 0));
+    const key = sectorLegend(area5, binLabels.map((name, bin) => ({ name, share: printed(binTotals[bin]), tone: BIN_TONES[bin % BIN_TONES.length] })));
+    strokes.push(...key.strokes);
+    labels.push(...key.labels);
+    labels.push({ x: x + 14, y: plot.y + plot.height - 4, text: calmText, kind: "tick", part: "axis", anchor: "start" });
+  } else {
+    labels.push({ x: plot.x, y: plot.y + plot.height - 4, text: calmText, kind: "tick", part: "axis", anchor: "start" });
+  }
+  const prevailing = totals.indexOf(Math.max(...totals));
+  const description = props.description ?? `${base.name}. Wind rose of ${observed} observations in ${count} sectors; ${totals[prevailing] > 0 ? `most often from ${compass(prevailing, count, locale)} (${printed(totals[prevailing])})` : "no wind from any direction"}; calm ${printed(calm)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var windRose = /* @__PURE__ */ Object.freeze({ name: "WindRose", build: buildWindRose });
+
+// src/charts/chord-ring/demo.ts
+var CHORD_RING_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { source: "Home", target: "Shop", value: 42 },
+    { source: "Home", target: "Blog", value: 28 },
+    { source: "Blog", target: "Shop", value: 16 },
+    { source: "Shop", target: "Cart", value: 35 },
+    { source: "Cart", target: "Shop", value: 12 },
+    { source: "Blog", target: "Home", value: 9 },
+    { source: "Help", target: "Cart", value: 7 },
+    { source: "Shop", target: "Help", value: 11 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/chord-ring/chord-ring.ts
+var CHART21 = "ChordRing";
+var CEILING = 12;
+var OTHER = "Other";
+var BAND2 = 0.08;
+var PAD = 0.04;
+function along(frame, r, from, to) {
+  const p = pointAt(frame, to, r);
+  return `A${r},${r},0,${to - from > Math.PI ? 1 : 0},1,${p.x},${p.y}`;
+}
+function ribbonPath(frame, r, s0, s1, t0, t1) {
+  const start = pointAt(frame, s0, r);
+  const target = pointAt(frame, t0, r);
+  const c = `${frame.cx},${frame.cy}`;
+  return `M${start.x},${start.y}${along(frame, r, s0, s1)}Q${c},${target.x},${target.y}${along(frame, r, t0, t1)}Q${c},${start.x},${start.y}Z`;
+}
+function buildChordRing(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? CHORD_RING_DEMO;
+  const sourceKey = usesDemo ? "source" : props.sourceKey ?? "source";
+  const targetKey = usesDemo ? "target" : props.targetKey ?? "target";
+  const valueKey = usesDemo ? "value" : props.valueKey ?? "value";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const valueName = accessorName(valueKey, "value");
+  const most = props.maxCategories !== void 0 && Number.isInteger(props.maxCategories) && props.maxCategories >= 2 ? props.maxCategories : CEILING;
+  const flows = [];
+  data.forEach((datum, index) => {
+    const rawSource = read(sourceKey, datum, index);
+    const rawTarget = read(targetKey, datum, index);
+    const value = finite(read(valueKey, datum, index));
+    if (rawSource === void 0 || rawSource === null || rawSource === "" || rawTarget === void 0 || rawTarget === null || rawTarget === "" || value === void 0 || value <= 0) {
+      warnValue(CHART21, valueName, `Row ${index} lacks a source, a target or a ${valueName} > 0; it is omitted.`);
+      return;
+    }
+    flows.push({ index, source: formatCategory(rawSource, locale), target: formatCategory(rawTarget, locale), value });
+  });
+  const throughput = /* @__PURE__ */ new Map();
+  for (const f of flows) {
+    throughput.set(f.source, (throughput.get(f.source) ?? 0) + f.value);
+    throughput.set(f.target, (throughput.get(f.target) ?? 0) + f.value);
+  }
+  const all = [...throughput.keys()];
+  let other = OTHER;
+  while (all.includes(other)) other = `${other} (merged)`;
+  if (process.env.NODE_ENV !== "production" && (all.length > CEILING || all.length > most)) {
+    diagnose("SP010", CHART21, {
+      property: "maxCategories",
+      message: `${all.length} categories${all.length > most ? `; the ${all.length - most + 1} smallest are merged into "${other}"` : ""}.`
+    });
+  }
+  const kept = new Set(all.length > most ? [...all].sort((a, b) => (throughput.get(b) ?? 0) - (throughput.get(a) ?? 0)).slice(0, most - 1) : all);
+  const categories = [...all.filter((c) => kept.has(c)), ...all.length > most ? [other] : []];
+  const slot = (name) => categories.indexOf(kept.has(name) ? name : other);
+  const pairs = /* @__PURE__ */ new Map();
+  const seenPairs = /* @__PURE__ */ new Map();
+  for (const f of flows) {
+    const raw = `${f.source}\0${f.target}`;
+    const earlier = seenPairs.get(raw);
+    if (earlier === void 0) seenPairs.set(raw, f.index);
+    else warnValue(CHART21, valueName, `Rows ${earlier} and ${f.index} both run ${f.source} \u2192 ${f.target}; their values are summed into one ribbon.`);
+    const [i, j] = [slot(f.source), slot(f.target)];
+    const pair = pairs.get(`${i}>${j}`);
+    if (pair) pair.value += f.value;
+    else pairs.set(`${i}>${j}`, { i, j, index: f.index, value: f.value });
+  }
+  const ribbonsInOrder = [...pairs.values()];
+  const base = modelBase(CHART21, props, context, "Chord ring", {
+    columns: ["flow", valueName],
+    rows: ribbonsInOrder.map((p) => [`${categories[p.i]} \u2192 ${categories[p.j]}`, formatValue(p.value, locale, numberFormat)])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = card.area;
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (flows.length === 0) return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  const n = categories.length;
+  const matrix = Array.from({ length: n }, () => new Array(n).fill(0));
+  for (const p of ribbonsInOrder) matrix[p.i][p.j] = p.value;
+  const chords = chordDirected().padAngle(Math.min(PAD, Math.PI / 2 / n))(matrix);
+  const frame = polarFrame(plot, RIM_LABELS);
+  const inner = frame.radius * (1 - BAND2);
+  chords.groups.forEach((g) => {
+    const d = sectorPath(frame, { inner, outer: frame.radius, start: g.startAngle, end: g.endAngle });
+    if (d) strokes.push({ d, role: "encoding", part: "ink", tone: ringTone(g.index, n) });
+  });
+  const order = (c) => {
+    const position = ribbonsInOrder.indexOf(pairs.get(`${c.source.index}>${c.target.index}`));
+    return position < 0 ? Number.MAX_SAFE_INTEGER : position;
+  };
+  for (const c of [...chords].sort((x, y) => order(x) - order(y))) {
+    strokes.push({ d: ribbonPath(frame, inner, c.source.startAngle, c.source.endAngle, c.target.startAngle, c.target.endAngle), role: "encoding", part: "ink", tone: ringTone(c.source.index, n) });
+    const pair = pairs.get(`${c.source.index}>${c.target.index}`);
+    if (!pair) continue;
+    const a = pointAt(frame, (c.source.startAngle + c.source.endAngle) / 2, inner);
+    const b = pointAt(frame, (c.target.startAngle + c.target.endAngle) / 2, inner);
+    const datum = data[pair.index] ?? {};
+    hitAreas.push({ seriesKey: valueName, index: ribbonsInOrder.indexOf(pair), datum, value: c.source.value, x: 0.25 * a.x + 0.5 * frame.cx + 0.25 * b.x, y: 0.25 * a.y + 0.5 * frame.cy + 0.25 * b.y });
+  }
+  labels.push(...rimLabels(frame, chords.groups.map((g) => ({ angle: (g.startAngle + g.endAngle) / 2, text: categories[g.index] }))));
+  const busiest = chords.groups.reduce((x, y) => y.value > x.value ? y : x);
+  const description = props.description ?? `${base.name}. Chord ring of ${flows.length} flows between ${n} categories; the busiest is ${categories[busiest.index]}, sending ${formatNumber(
+    matrix[busiest.index].reduce((s, v) => s + v, 0),
+    locale,
+    numberFormat
+  )}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var chordRing = /* @__PURE__ */ Object.freeze({ name: "ChordRing", build: buildChordRing });
+
+// src/charts/orbit-chart/demo.ts
+var ORBIT_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { label: "2023", markers: Object.freeze([Object.freeze({ period: 0.08, value: 12 }), Object.freeze({ period: 0.33, value: 30 }), Object.freeze({ period: 0.61, value: 18 }), Object.freeze({ period: 0.9, value: 24 })]) },
+    { label: "2024", markers: Object.freeze([Object.freeze({ period: 0.12, value: 20 }), Object.freeze({ period: 0.4, value: 42 }), Object.freeze({ period: 0.66, value: 15 }), Object.freeze({ period: 0.87, value: 33 })]) },
+    { label: "2025", markers: Object.freeze([Object.freeze({ period: 0.05, value: 26 }), Object.freeze({ period: 0.29, value: 38 }), Object.freeze({ period: 0.55, value: 50 }), Object.freeze({ period: 0.81, value: 21 })]) }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/orbit-chart/orbit-chart.ts
+var CHART22 = "OrbitChart";
+var TILT = 0.42;
+var HOLE4 = 0.3;
+var MARKER = 6;
+function ellipsePath(cx, cy, a, b) {
+  return `M${cx},${cy - b}A${a},${b},0,1,1,${cx},${cy + b}A${a},${b},0,1,1,${cx},${cy - b}Z`;
+}
+function buildOrbitChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const all = props.data ?? ORBIT_CHART_DEMO;
+  const markerKey = usesDemo ? "markers" : props.markerKey ?? "markers";
+  const periodKey = usesDemo ? "period" : props.periodKey ?? "period";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const shown = props.orbits !== void 0 && Number.isInteger(props.orbits) && props.orbits > 0 ? Math.min(props.orbits, all.length) : all.length;
+  const data = all.slice(0, shown);
+  const periodName = accessorName(periodKey, "period");
+  const rows = [];
+  const markers = [];
+  data.forEach((datum, orbit) => {
+    const label = formatCategory(datum.label, locale);
+    const list = read(markerKey, datum, orbit);
+    let kept = 0;
+    (Array.isArray(list) ? list : []).forEach((raw, column) => {
+      const m = typeof raw === "object" && raw !== null ? raw : {};
+      const period = finite(read(periodKey, m, column));
+      const value = finite(m.value);
+      rows.push([label, formatValue(period, locale, void 0), formatValue(value, locale, numberFormat)]);
+      const flat = rows.length - 1;
+      if (period === void 0 || period < 0 || period > 1 || value === void 0 || value < 0) {
+        warnValue(CHART22, periodName, `Marker ${column} of orbit "${label}" needs a period in 0-1 and a value \u2265 0; it is omitted.`);
+        return;
+      }
+      markers.push({ flat, orbit, column: kept++, datum: { orbit: label, ...m }, period, value });
+    });
+  });
+  const base = modelBase(CHART22, props, context, "Orbit chart", { columns: ["orbit", periodName, "value"], rows });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = card.area;
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (data.length === 0) return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, all.length === 0);
+  const cx = plot.x + plot.width / 2;
+  const cy = plot.y + plot.height / 2;
+  const outer = Math.max(Math.min(plot.width / 2, plot.height / 2 / TILT) - PLOT_INSET - MARKER, 1);
+  const hole = outer * HOLE4;
+  const widthOf = (orbit) => data.length === 1 ? outer : hole + orbit / (data.length - 1) * (outer - hole);
+  data.forEach((datum, orbit) => {
+    const a = widthOf(orbit);
+    strokes.push({ d: ellipsePath(cx, cy, a, a * TILT), role: "ornament", part: "grid" });
+    labels.push({ x: cx - a + 3, y: cy + 3, text: formatCategory(datum.label, locale), kind: "tick", part: "axis", anchor: "start" });
+  });
+  const largest = Math.max(0, ...markers.map((m) => m.value));
+  for (const m of markers) {
+    const a = widthOf(m.orbit);
+    const angle = m.period * 2 * Math.PI;
+    const x = cx + a * Math.sin(angle);
+    const y = cy - a * TILT * Math.cos(angle);
+    const r = largest > 0 ? MARKER * Math.sqrt(m.value / largest) : 0;
+    if (r > 0) strokes.push({ d: circlePath(x, y, r), role: "encoding", part: "ink", paint: "fill" });
+    hitAreas.push({ seriesKey: "value", index: m.flat, datum: m.datum, value: m.value, x, y, box: { x: x - r, y: y - r, width: 2 * r, height: 2 * r }, cell: { column: m.column, row: m.orbit } });
+  }
+  const description = props.description ?? `${base.name}. ${data.length} orbits from the inside out (${data.map((d) => formatCategory(d.label, locale)).join(", ")}) with ${markers.length} markers placed by ${periodName} over the cycle; the largest is ${formatNumber(largest, locale, numberFormat)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var orbitChart = /* @__PURE__ */ Object.freeze({ name: "OrbitChart", build: buildOrbitChart });
+
+// src/charts/volvelle-chart/demo.ts
+var VOLVELLE_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { label: "Day", segments: Object.freeze(["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]) },
+    { label: "Shift", segments: Object.freeze(["Early", "Late", "Night"]) },
+    { label: "Team", segments: Object.freeze(["Atlas", "Borealis", "Cygnus", "Draco", "Eridanus"]) }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/volvelle-chart/volvelle-chart.ts
+var CHART23 = "VolvelleChart";
+var HUB = 0.22;
+var POINTER = 7;
+var CHAR2 = 5.2;
+var CAP = 7;
+var AIR = 1;
+function fits(frame, name, at2, inner, outer, start, end) {
+  const width = name.length * CHAR2;
+  const corners = [
+    [at2.x - width / 2, at2.y + 3 - CAP],
+    [at2.x + width / 2, at2.y + 3 - CAP],
+    [at2.x - width / 2, at2.y + 3],
+    [at2.x + width / 2, at2.y + 3]
+  ];
+  const middle = (start + end) / 2;
+  return corners.every(([x, y]) => {
+    const r = Math.hypot(x - frame.cx, y - frame.cy);
+    let a = Math.atan2(x - frame.cx, frame.cy - y) - middle;
+    a = Math.atan2(Math.sin(a), Math.cos(a));
+    return r >= inner + AIR && r <= outer - AIR && Math.abs(a) <= (end - start) / 2 - AIR / Math.max(r, 1);
+  });
+}
+function buildVolvelleChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const all = props.data ?? VOLVELLE_CHART_DEMO;
+  const { locale } = context;
+  const cap = props.rings !== void 0 && Number.isInteger(props.rings) && props.rings > 0 ? props.rings : all.length;
+  const rings = [];
+  all.slice(0, cap).forEach((datum, index) => {
+    const segments = datum.segments;
+    if (!Array.isArray(segments) || segments.length === 0) {
+      warnValue(CHART23, "segments", `Ring ${index} has no list of segments; it is omitted.`);
+      return;
+    }
+    checkSectors(CHART23, "segments", segments.length);
+    rings.push({ label: formatCategory(datum.label, locale), segments: segments.map((s) => formatCategory(s, locale)), given: index });
+  });
+  if (usesDemo && (props.indexRing !== void 0 || props.indexValue !== void 0)) {
+    warnValue(CHART23, props.indexValue !== void 0 ? "indexValue" : "indexRing", "Without `data` the demo keeps its own index; `indexRing` and `indexValue` apply to your rings.");
+  }
+  let ringIndex = usesDemo || props.indexRing === void 0 ? 0 : rings.findIndex((r) => r.given === props.indexRing);
+  if (ringIndex < 0) {
+    if (rings.length > 0) warnValue(CHART23, "indexRing", `Ring ${String(props.indexRing)} does not exist or has no segments; the index reads the first ring.`);
+    ringIndex = 0;
+  }
+  const turned = rings[ringIndex];
+  let segment = turned && !usesDemo && props.indexValue !== void 0 ? turned.segments.indexOf(props.indexValue) : 0;
+  if (segment < 0) {
+    warnValue(CHART23, "indexValue", `"${String(props.indexValue)}" is not on ring "${turned?.label}"; the index reads its first segment.`);
+    segment = 0;
+  }
+  const indexAngle = turned ? (segment + 0.5) * 2 * Math.PI / turned.segments.length : 0;
+  const n = turned?.segments.length ?? 1;
+  const underIndex = rings.map((r) => Math.floor((2 * segment + 1) * r.segments.length / (2 * n)));
+  const combined = rings.map((r, k) => `${r.label} ${r.segments[underIndex[k]]}`).join(" \xB7 ");
+  const base = modelBase(CHART23, props, context, "Volvelle", {
+    columns: ["ring", "segment", "under the index"],
+    rows: rings.flatMap((r, k) => r.segments.map((s, j) => [r.label, s, j === underIndex[k] ? "yes" : "no"]))
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = card.area;
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (rings.length === 0) return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, all.length === 0);
+  const frame = polarFrame(plot, Math.max(POINTER, RIM_LABELS));
+  const hub = frame.radius * HUB;
+  const band = (frame.radius - hub) / rings.length;
+  const turn = -indexAngle;
+  let flat = 0;
+  rings.forEach((r, k) => {
+    const inner = hub + k * band;
+    const outer = inner + band;
+    const width = 2 * Math.PI / r.segments.length;
+    r.segments.forEach((name, j) => {
+      const start = j * width + turn;
+      const aligned = j === underIndex[k];
+      const d = sectorPath(frame, { inner, outer, start, end: start + width });
+      if (d) strokes.push({ d, role: "encoding", part: "ink", ...aligned ? { tone: 3 } : {} });
+      const middle = pointAt(frame, start + width / 2, (inner + outer) / 2);
+      if (fits(frame, name, middle, inner, outer, start, start + width)) {
+        labels.push({ x: middle.x, y: middle.y + 3, text: name, kind: "tick", part: "text", anchor: "middle" });
+      } else if (k === rings.length - 1 && !aligned) {
+        labels.push(polarLabel(frame, start + width / 2, outer + 8, name));
+      }
+      hitAreas.push({ seriesKey: "segment", index: flat, datum: { ring: r.label, segment: name }, value: j, x: middle.x, y: middle.y, cell: { column: j, row: k } });
+      flat += 1;
+    });
+  });
+  const tip = frame.cy - frame.radius - 1;
+  strokes.push({ d: `M${frame.cx - 4},${tip - POINTER + 1}L${frame.cx + 4},${tip - POINTER + 1}L${frame.cx},${tip}Z`, role: "ornament", part: "ink", paint: "fill" });
+  labels.push({ x: plot.x, y: plot.y + plot.height - 4, text: combined, kind: "tick", part: "text", anchor: "start" });
+  const description = props.description ?? `${base.name}. Volvelle of ${rings.length} rings from the inside out; under the index: ${combined}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var volvelleChart = /* @__PURE__ */ Object.freeze({ name: "VolvelleChart", build: buildVolvelleChart });
+
+// src/charts/candlestick-chart/demo.ts
+var CANDLESTICK_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { time: "Mon", open: 102, high: 108, low: 99, close: 106 },
+    { time: "Tue", open: 106, high: 109, low: 101, close: 103 },
+    { time: "Wed", open: 103, high: 105, low: 97, close: 99 },
+    { time: "Thu", open: 99, high: 104, low: 96, close: 103 },
+    { time: "Fri", open: 103, high: 111, low: 102, close: 110 },
+    { time: "Mon", open: 110, high: 114, low: 107, close: 108 },
+    { time: "Tue", open: 108, high: 110, low: 104, close: 109 },
+    { time: "Wed", open: 109, high: 116, low: 108, close: 115 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/candlestick-chart/candlestick-chart.ts
+var CHART24 = "CandlestickChart";
+var BODY_FILL = 0.6;
+function buildCandlestickChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? CANDLESTICK_CHART_DEMO;
+  const timeKey = usesDemo ? "time" : props.timeKey ?? "time";
+  const keys = {
+    open: usesDemo ? "open" : props.openKey ?? "open",
+    high: usesDemo ? "high" : props.highKey ?? "high",
+    low: usesDemo ? "low" : props.lowKey ?? "low",
+    close: usesDemo ? "close" : props.closeKey ?? "close"
+  };
+  const names = { open: accessorName(keys.open, "open"), high: accessorName(keys.high, "high"), low: accessorName(keys.low, "low"), close: accessorName(keys.close, "close") };
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  checkCount(CHART24, names.close, data.length);
+  const candles = [];
+  data.forEach((datum, index) => {
+    const [open, high, low, close] = ["open", "high", "low", "close"].map((k) => finite(read(keys[k], datum, index)));
+    if (open === void 0 || high === void 0 || low === void 0 || close === void 0) {
+      warnValue(CHART24, names.close, `Row ${index} lacks a finite open, high, low or close; it is omitted.`);
+      return;
+    }
+    if (!(low <= Math.min(open, close) && Math.max(open, close) <= high)) {
+      warnValue(CHART24, names.high, `Row ${index} breaks low \u2264 min(open, close) \u2264 max(open, close) \u2264 high; it is omitted.`);
+      return;
+    }
+    candles.push({ index, datum, open, high, low, close });
+  });
+  const timeName = accessorName(timeKey, "time");
+  const timeLabels = data.map((datum, index) => formatCategory(read(timeKey, datum, index), locale));
+  const base = modelBase(CHART24, props, context, "Candlestick chart", {
+    columns: [timeName, names.open, names.high, names.low, names.close],
+    rows: data.map((datum, index) => [timeLabels[index] ?? "", ...["open", "high", "low", "close"].map((k) => formatValue(finite(read(keys[k], datum, index)), locale, numberFormat))])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = cartesianPlot(card.area);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  const pinned = props.bounds && Number.isFinite(props.bounds[0]) && Number.isFinite(props.bounds[1]) && props.bounds[0] < props.bounds[1] ? props.bounds : void 0;
+  if (props.bounds !== void 0 && !pinned) warnValue(CHART24, "bounds", `[${String(props.bounds)}] is not two finite prices, lowest first; the bounds are derived from the rows.`);
+  if (data.length === 0) return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, true);
+  if (candles.length === 0) {
+    if (!pinned) diagnose("SP009", CHART24, { property: "bounds", message: `None of the ${data.length} rows is a valid candle: open, high, low and close must be finite numbers with low \u2264 min(open, close) \u2264 max(open, close) \u2264 high.` });
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, false);
+  }
+  const bounds = pinned ?? [Math.min(...candles.map((c) => c.low)), Math.max(...candles.map((c) => c.high))];
+  const axis = valueAxis(plot, bounds, { chart: CHART24, property: "bounds", padding: context.domainPadding, locale, numberFormat, zero: false, nice: !pinned });
+  const [floor, ceiling] = bounds;
+  const outside = candles.filter((c) => c.low < floor || c.high > ceiling).length;
+  if (outside > 0) warnValue(CHART24, "bounds", `${outside} candles reach outside the pinned bounds; they are drawn clamped to them.`);
+  const y = (price) => axis.scale(Math.min(Math.max(price, floor), ceiling));
+  strokes.push(...axis.strokes);
+  labels.push(...axis.labels);
+  const slots = categoryAxis(timeLabels, plot, { chart: CHART24, property: timeName, padding: context.domainPadding, numeric: false, paddingInner: 0.25, paddingOuter: 0.1 });
+  const width = slots.bandwidth * BODY_FILL;
+  for (const c of candles) {
+    const x = slots.at(c.index);
+    strokes.push({ d: `M${x},${y(c.high)}V${y(c.low)}`, role: "encoding", part: "ink" });
+    const top = y(Math.max(c.open, c.close));
+    const body = { x: x - width / 2, y: top, width, height: y(Math.min(c.open, c.close)) - top };
+    if (body.height > 0) {
+      strokes.push(c.close >= c.open ? { d: rectPath(body), role: "encoding", part: "ink" } : { d: rectPath(body), role: "encoding", part: "ink", paint: "fill" });
+    } else {
+      strokes.push({ d: `M${body.x},${top}H${body.x + width}`, role: "encoding", part: "ink" });
+    }
+    hitAreas.push({
+      seriesKey: names.close,
+      index: c.index,
+      datum: c.datum,
+      value: c.close,
+      x,
+      y: y(c.close),
+      box: { x: x - slots.bandwidth / 2, y: y(c.high), width: slots.bandwidth, height: y(c.low) - y(c.high) }
+    });
+  }
+  labels.push(...categoryLabels(timeLabels, slots.at, card.area, plot));
+  const rising = candles.filter((c) => c.close >= c.open).length;
+  const description = props.description ?? `${base.name}. Candlestick chart of ${candles.length} sessions, prices from ${formatNumber(bounds[0], locale, numberFormat)} to ${formatNumber(bounds[1], locale, numberFormat)}${pinned ? " (pinned bounds)" : ", from the lowest low to the highest high"}; ${rising} rise and ${candles.length - rising} fall.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var candlestickChart = /* @__PURE__ */ Object.freeze({ name: CHART24, build: buildCandlestickChart });
+
+// src/charts/area-chart/demo.ts
+var AREA_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { x: "Mon", value: 32 },
+    { x: "Tue", value: 45 },
+    { x: "Wed", value: 41 },
+    { x: "Thu", value: 58 },
+    { x: "Fri", value: 66 },
+    { x: "Sat", value: 38 },
+    { x: "Sun", value: 29 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/area-chart/area-chart.ts
+var CHART25 = "AreaChart";
+var HEIGHTEN_RADIUS3 = 3.5;
+function buildAreaChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? AREA_CHART_DEMO;
+  const xKey = usesDemo ? "x" : props.xKey ?? "x";
+  const valueKey = usesDemo ? "value" : props.valueKey ?? "value";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const series = readSeries(data, valueKey, "value");
+  checkVolume(CHART25, [series]);
+  const xName = accessorName(xKey, "x");
+  const xValues = data.map((datum, index) => read(xKey, datum, index));
+  const xLabels = xValues.map((value) => formatCategory(value, locale));
+  const base = modelBase(CHART25, props, context, "Area chart", {
+    columns: [xName, series.key],
+    rows: data.map((_, i) => [xLabels[i] ?? "", formatValue(series.points[i]?.value, locale, numberFormat)])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = cartesianPlot(card.area);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (series.missing > 0 && data.length > 0) warnValue(CHART25, series.key, `${series.missing} of ${data.length} values are not finite; the area breaks there.`);
+  const range = extent(seriesValues([series]));
+  if (data.length === 0 || range === void 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const axis = valueAxis(plot, range, { chart: CHART25, property: series.key, padding: context.domainPadding, locale, numberFormat });
+  const y = axis.scale;
+  strokes.push(...axis.strokes);
+  labels.push(...axis.labels);
+  const xAt = categoryAxis(xValues, plot, { chart: CHART25, property: xName, padding: context.domainPadding }).at;
+  const curve = CURVES2[props.curve ?? "monotone"];
+  const defined = (p) => p.value !== void 0;
+  const shape = area().defined(defined).x((p) => xAt(p.index)).y0(y(0)).y1((p) => y(p.value ?? 0)).curve(curve)(series.points);
+  if (shape) strokes.push({ d: shape, role: "encoding", part: "ink", paint: "stroke", tone: 2 });
+  const top = line().defined(defined).x((p) => xAt(p.index)).y((p) => y(p.value ?? 0)).curve(curve)(series.points);
+  if (top) strokes.push({ d: top, role: "encoding", part: "ink" });
+  for (const p of series.points) {
+    if (p.value === void 0) continue;
+    hitAreas.push({ seriesKey: series.key, index: p.index, datum: p.datum, value: p.value, x: xAt(p.index), y: y(p.value) });
+  }
+  const live = hitAreas.at(-1);
+  if (live) {
+    const mark = circlePath(live.x, live.y, HEIGHTEN_RADIUS3);
+    strokes.push({ d: mark, role: "encoding", part: "heighten", paint: "fill" });
+    strokes.push({ d: mark, role: "encoding", part: "ink", paint: "stroke" });
+  }
+  labels.push(...categoryLabels(xLabels, xAt, card.area, plot));
+  const description = props.description ?? `${base.name}. Area chart of ${data.length} ${xName} values; ${series.key} ranges from ${formatNumber(range[0], locale, numberFormat)} to ${formatNumber(range[1], locale, numberFormat)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var areaChart = /* @__PURE__ */ Object.freeze({ name: CHART25, build: buildAreaChart });
+
+// src/charts/range-band-chart/demo.ts
+var RANGE_BAND_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { x: "Mon", low: 11, high: 19 },
+    { x: "Tue", low: 12, high: 22 },
+    { x: "Wed", low: 14, high: 24 },
+    { x: "Thu", low: 13, high: 21 },
+    { x: "Fri", low: 10, high: 18 },
+    { x: "Sat", low: 9, high: 20 },
+    { x: "Sun", low: 12, high: 23 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/range-band-chart/range-band-chart.ts
+var CHART26 = "RangeBandChart";
+function buildRangeBandChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? RANGE_BAND_CHART_DEMO;
+  const xKey = usesDemo ? "x" : props.xKey ?? "x";
+  const lowKey = usesDemo ? "low" : props.lowKey ?? "low";
+  const highKey = usesDemo ? "high" : props.highKey ?? "high";
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const lowName = accessorName(lowKey, "low");
+  const highName = accessorName(highKey, "high");
+  let swapped = 0;
+  let missing = 0;
+  const spans = data.map((datum, index) => {
+    let low2 = finite(read(lowKey, datum, index));
+    let high2 = finite(read(highKey, datum, index));
+    if (low2 === void 0 || high2 === void 0) {
+      missing += 1;
+      return { index, datum, low: void 0, high: void 0 };
+    }
+    if (low2 > high2) {
+      [low2, high2] = [high2, low2];
+      swapped += 1;
+    }
+    return { index, datum, low: low2, high: high2 };
+  });
+  const asSeries = (key, pick) => ({
+    key,
+    points: spans.map((s) => ({ index: s.index, datum: s.datum, value: pick(s) })),
+    missing
+  });
+  checkVolume(CHART26, [asSeries(lowName, (s) => s.low)]);
+  const xName = accessorName(xKey, "x");
+  const xValues = data.map((datum, index) => read(xKey, datum, index));
+  const xLabels = xValues.map((value) => formatCategory(value, locale));
+  const base = modelBase(CHART26, props, context, "Range band", {
+    columns: [xName, lowName, highName],
+    rows: spans.map((s, i) => [xLabels[i] ?? "", formatValue(s.low, locale, numberFormat), formatValue(s.high, locale, numberFormat)])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = cartesianPlot(card.area);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (swapped > 0) warnValue(CHART26, lowName, `${swapped} rows had ${lowName} above ${highName}; they are swapped.`);
+  if (missing > 0 && data.length > 0) warnValue(CHART26, lowName, `${missing} of ${data.length} rows lack a finite ${lowName} or ${highName}; the band breaks there.`);
+  const range = extent(spans.flatMap((s) => s.low === void 0 || s.high === void 0 ? [] : [s.low, s.high]));
+  if (data.length === 0 || range === void 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const axis = valueAxis(plot, range, { chart: CHART26, property: highName, padding: context.domainPadding, locale, numberFormat, zero: false });
+  const y = axis.scale;
+  strokes.push(...axis.strokes);
+  labels.push(...axis.labels);
+  const xAt = categoryAxis(xValues, plot, { chart: CHART26, property: xName, padding: context.domainPadding }).at;
+  const curve = CURVES2.monotone;
+  const defined = (s) => s.low !== void 0;
+  const band = area().defined(defined).x((s) => xAt(s.index)).y0((s) => y(s.low ?? 0)).y1((s) => y(s.high ?? 0)).curve(curve)(spans);
+  if (band) strokes.push({ d: band, role: "encoding", part: "ink-secondary", paint: "none", tone: 1 });
+  const edge = (pick) => line().defined(defined).x((s) => xAt(s.index)).y((s) => y(pick(s))).curve(curve)(spans);
+  const high = edge((s) => s.high ?? 0);
+  const low = edge((s) => s.low ?? 0);
+  if (high) strokes.push({ d: high, role: "encoding", part: "ink" });
+  if (low) strokes.push({ d: low, role: "encoding", part: "ink", dash: "dotted" });
+  for (const [row, key, pick] of [[0, lowName, (s) => s.low], [1, highName, (s) => s.high]]) {
+    for (const s of spans) {
+      const value = pick(s);
+      if (value === void 0) continue;
+      hitAreas.push({ seriesKey: key, index: s.index, datum: s.datum, value, x: xAt(s.index), y: y(value), cell: { column: s.index, row } });
+    }
+  }
+  labels.push(...categoryLabels(xLabels, xAt, card.area, plot));
+  const description = props.description ?? `${base.name}. Range band over ${data.length} ${xName} values, from a lowest ${lowName} of ${formatNumber(range[0], locale, numberFormat)} to a highest ${highName} of ${formatNumber(range[1], locale, numberFormat)}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var rangeBandChart = /* @__PURE__ */ Object.freeze({ name: CHART26, build: buildRangeBandChart });
+
+// src/charts/stream-chart/demo.ts
+var STREAM_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { x: "Mon", organic: 22, paid: 14 },
+    { x: "Tue", organic: 28, paid: 18 },
+    { x: "Wed", organic: 35, paid: 16 },
+    { x: "Thu", organic: 31, paid: 24 },
+    { x: "Fri", organic: 38, paid: 29 },
+    { x: "Sat", organic: 26, paid: 21 },
+    { x: "Sun", organic: 19, paid: 12 }
+  ].map((row) => Object.freeze(row))
+);
+var STREAM_CHART_DEMO_KEYS = /* @__PURE__ */ Object.freeze(["organic", "paid"]);
+
+// src/charts/stream-chart/stream-chart.ts
+var CHART27 = "StreamChart";
+var WAVES = 2;
+function buildStreamChart(props, context) {
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? STREAM_CHART_DEMO;
+  const xKey = usesDemo ? "x" : props.xKey ?? "x";
+  const requested = usesDemo ? STREAM_CHART_DEMO_KEYS : props.keys ?? STREAM_CHART_DEMO_KEYS;
+  const keys = requested.slice(0, WAVES);
+  const stacked = props.stacked ?? false;
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const series = keys.map((key2) => readSeries(data, key2, key2));
+  checkVolume(CHART27, series);
+  const xName = accessorName(xKey, "x");
+  const xValues = data.map((datum, index) => read(xKey, datum, index));
+  const xLabels = xValues.map((value) => formatCategory(value, locale));
+  const base = modelBase(CHART27, props, context, "Stream chart", {
+    columns: [xName, ...keys],
+    rows: data.map((_, i) => [xLabels[i] ?? "", ...series.map((s) => formatValue(s.points[i]?.value, locale, numberFormat))])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const key = legend(card.area, keys.map((name, i) => i === 0 ? { name, part: "ink", tone: 1 } : { name, part: "ink-secondary", tone: 2, dash: "dotted" }));
+  const plot = cartesianPlot(key.area);
+  const strokes = [...card.strokes, ...key.strokes];
+  const labels = [...card.labels, ...key.labels];
+  const hitAreas = [];
+  if (requested.length > WAVES) warnValue(CHART27, "keys", `${requested.length} keys were given; a stream draws the first ${WAVES}.`);
+  for (const s of series) if (s.missing > 0 && data.length > 0) warnValue(CHART27, s.key, `${s.missing} of ${data.length} values are not finite; the wave breaks there.`);
+  let clamped = 0;
+  let unsupported = 0;
+  const waves = series.map((s, w) => ({
+    key: s.key,
+    spans: s.points.map((p, i) => {
+      if (p.value === void 0) return void 0;
+      if (stacked && w > 0 && series[0]?.points[i]?.value === void 0) {
+        unsupported += 1;
+        return void 0;
+      }
+      let value = p.value;
+      if (stacked && value < 0) {
+        clamped += 1;
+        value = 0;
+      }
+      const below = stacked && w > 0 ? Math.max(series[0]?.points[i]?.value ?? 0, 0) : 0;
+      return { y0: below, y1: below + value, value: p.value };
+    })
+  }));
+  if (clamped > 0) warnValue(CHART27, "stacked", `${clamped} negative values cannot stack; they are drawn at zero.`);
+  if (unsupported > 0) warnValue(CHART27, "stacked", `${unsupported} values have nothing below them to stack on; the upper wave breaks there.`);
+  const range = extent(waves.flatMap((w) => w.spans.flatMap((s) => s ? [s.y0, s.y1] : [])));
+  if (data.length === 0 || range === void 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const axis = valueAxis(plot, range, { chart: CHART27, property: keys[0] ?? "value", padding: context.domainPadding, locale, numberFormat });
+  const y = axis.scale;
+  strokes.push(...axis.strokes);
+  labels.push(...axis.labels);
+  const xAt = categoryAxis(xValues, plot, { chart: CHART27, property: xName, padding: context.domainPadding }).at;
+  const curve = CURVES2.monotone;
+  waves.forEach((wave, w) => {
+    const indexed = wave.spans.map((span, index) => ({ span, index }));
+    const defined = (e) => e.span !== void 0;
+    const shape = area().defined(defined).x((e) => xAt(e.index)).y0((e) => y(e.span?.y0 ?? 0)).y1((e) => y(e.span?.y1 ?? 0)).curve(curve)(indexed);
+    const top = line().defined(defined).x((e) => xAt(e.index)).y((e) => y(e.span?.y1 ?? 0)).curve(curve)(indexed);
+    const part = w === 0 ? "ink" : "ink-secondary";
+    if (shape) strokes.push({ d: shape, role: "encoding", part, paint: "none", tone: w === 0 ? 1 : 2 });
+    if (top) strokes.push({ d: top, role: "encoding", part, ...w === 0 ? {} : { dash: "dotted" } });
+    wave.spans.forEach((span, index) => {
+      if (!span) return;
+      const datum = data[index] ?? {};
+      hitAreas.push({ seriesKey: wave.key, index, datum, value: span.value, x: xAt(index), y: y(span.y1), cell: { column: index, row: w } });
+    });
+  });
+  labels.push(...categoryLabels(xLabels, xAt, key.area, plot));
+  const totals = series.map((s) => `${s.key} totals ${formatNumber(s.points.reduce((sum, p) => sum + (p.value ?? 0), 0), locale, numberFormat)}`);
+  const description = props.description ?? `${base.name}. ${stacked ? "Stacked" : "Overlaid"} stream of ${keys.length} waves over ${data.length} ${xName} values; ${totals.join("; ")}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+var streamChart = /* @__PURE__ */ Object.freeze({ name: CHART27, build: buildStreamChart });
+
+// src/charts/shared/points.ts
+var validRange = (range) => !!range && Number.isFinite(range[0]) && Number.isFinite(range[1]) && range[0] > 0 && range[0] <= range[1];
+function buildPoints(family, props, context, demo) {
+  const { chart } = family;
+  const usesDemo = props.data === void 0;
+  const data = props.data ?? demo;
+  const xKey = usesDemo ? "x" : props.xKey ?? "x";
+  const yKey = usesDemo ? "y" : props.yKey ?? "y";
+  const sizeKey = usesDemo ? "size" : props.sizeKey ?? (family.sizeByDefault ? "size" : void 0);
+  const sizeRange = validRange(props.sizeRange) ? props.sizeRange : family.defaultSizeRange;
+  if (props.sizeRange !== void 0 && !validRange(props.sizeRange)) {
+    warnValue(chart, "sizeRange", `[${String(props.sizeRange)}] is not two finite areas with 0 < smallest \u2264 largest; the default [${String(family.defaultSizeRange)}] is used.`);
+  }
+  const { locale } = context;
+  const numberFormat = props.numberFormat;
+  const xName = accessorName(xKey, "x");
+  const yName = accessorName(yKey, "y");
+  const sizeName = sizeKey === void 0 ? void 0 : accessorName(sizeKey, "size");
+  checkCount(chart, yName, data.length);
+  const points = [];
+  data.forEach((datum, index) => {
+    const x2 = finite(read(xKey, datum, index));
+    const y2 = finite(read(yKey, datum, index));
+    const size2 = sizeKey === void 0 ? void 0 : finite(read(sizeKey, datum, index));
+    if (x2 === void 0 || y2 === void 0) {
+      warnValue(chart, x2 === void 0 ? xName : yName, `Row ${index} has no finite ${x2 === void 0 ? xName : yName}; it is omitted.`);
+      return;
+    }
+    if (sizeKey !== void 0 && (size2 === void 0 || size2 < 0)) {
+      warnValue(chart, sizeName ?? "size", `Row ${index} has a size of ${String(size2 ?? "no number")}; sizes must be zero or more, so it is omitted.`);
+      return;
+    }
+    points.push({ index, datum, x: x2, y: y2, size: size2 });
+  });
+  const base = modelBase(chart, props, context, family.fallbackName, {
+    columns: [xName, yName, ...sizeName ? [sizeName] : []],
+    rows: data.map((datum, index) => [
+      formatValue(read(xKey, datum, index), locale, numberFormat),
+      formatValue(read(yKey, datum, index), locale, numberFormat),
+      ...sizeKey ? [formatValue(read(sizeKey, datum, index), locale, numberFormat)] : []
+    ])
+  });
+  const size = measure(base, props, context);
+  if ("deferred" in size) return size.deferred;
+  const card = cardLayout(props, { width: size.width, areaHeight: size.height, chrome: props.chrome ?? "card", locale });
+  const plot = cartesianPlot(card.area);
+  const strokes = [...card.strokes];
+  const labels = [...card.labels];
+  const hitAreas = [];
+  if (points.length === 0) {
+    return emptyModel(base, props, context, { viewBox: card.viewBox, plot, strokes, labels }, data.length === 0);
+  }
+  const sizes = extent(points.flatMap((p) => p.size === void 0 ? [] : [p.size]));
+  const areaOf = (s) => {
+    if (s === void 0 || !sizes) return sizeRange[0];
+    if (sizes[0] === sizes[1]) return sizeRange[1];
+    return sizeRange[0] + (s - sizes[0]) / (sizes[1] - sizes[0]) * (sizeRange[1] - sizeRange[0]);
+  };
+  const radius = (s) => Math.sqrt(areaOf(s) / Math.PI);
+  const largest = Math.max(...points.map((p) => radius(p.size)));
+  const inner = inset(plot, largest);
+  const axis = valueAxis(inner, extent(points.map((p) => p.y)) ?? [0, 0], { chart, property: yName, padding: context.domainPadding, locale, numberFormat, zero: false });
+  const y = axis.scale;
+  strokes.push(...axis.strokes);
+  labels.push(...axis.labels);
+  const gutter = Math.min(Math.max(0, ...axis.labels.map((l) => l.text.length * TICK_CHAR)) + 4 + largest, inner.width / 3);
+  const x = linearScale(extent(points.map((p) => p.x)) ?? [0, 0], [inner.x + gutter, inner.x + inner.width], { chart, property: xName, padding: context.domainPadding, nice: true });
+  for (const tick of x.ticks(4)) {
+    labels.push({ x: x(tick), y: card.area.y + card.area.height - 5, text: formatNumber(tick, locale, numberFormat), kind: "tick", part: "axis", anchor: "middle" });
+  }
+  for (const p of [...points].sort((a, b) => radius(b.size) - radius(a.size) || a.index - b.index)) {
+    strokes.push({ d: circlePath(x(p.x), y(p.y), radius(p.size)), role: "encoding", part: "ink", ...family.toned ? { tone: 1 } : {} });
+  }
+  for (const p of points) {
+    const r = radius(p.size);
+    hitAreas.push({ seriesKey: yName, index: p.index, datum: p.datum, value: p.y, x: x(p.x), y: y(p.y), box: { x: x(p.x) - r, y: y(p.y) - r, width: 2 * r, height: 2 * r } });
+  }
+  const xs = extent(points.map((p) => p.x)) ?? [0, 0];
+  const ys = extent(points.map((p) => p.y)) ?? [0, 0];
+  const description = props.description ?? `${base.name}. ${points.length} points; ${xName} from ${formatNumber(xs[0], locale, numberFormat)} to ${formatNumber(xs[1], locale, numberFormat)}, ${yName} from ${formatNumber(ys[0], locale, numberFormat)} to ${formatNumber(ys[1], locale, numberFormat)}${sizeName && sizes ? `, ${sizeName} from ${formatNumber(sizes[0], locale, numberFormat)} to ${formatNumber(sizes[1], locale, numberFormat)} as marker area` : ""}.`;
+  return readyModel(base, description, { viewBox: card.viewBox, plot, strokes, labels, hitAreas });
+}
+
+// src/charts/scatter-chart/demo.ts
+var SCATTER_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { x: 152, y: 51, size: 2 },
+    { x: 158, y: 56, size: 4 },
+    { x: 161, y: 54, size: 3 },
+    { x: 165, y: 62, size: 6 },
+    { x: 168, y: 60, size: 5 },
+    { x: 171, y: 68, size: 8 },
+    { x: 175, y: 71, size: 7 },
+    { x: 178, y: 69, size: 9 },
+    { x: 182, y: 77, size: 10 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/scatter-chart/scatter-chart.ts
+var FAMILY5 = { chart: "ScatterChart", fallbackName: "Scatter chart", defaultSizeRange: [60, 240], sizeByDefault: false, toned: false };
+var scatterChart = /* @__PURE__ */ Object.freeze({
+  name: "ScatterChart",
+  build: (props, context) => buildPoints(FAMILY5, props, context, SCATTER_CHART_DEMO)
+});
+
+// src/charts/bubble-chart/demo.ts
+var BUBBLE_CHART_DEMO = /* @__PURE__ */ Object.freeze(
+  /* @__PURE__ */ [
+    { x: 2, y: 18, size: 40 },
+    { x: 5, y: 24, size: 120 },
+    { x: 8, y: 12, size: 65 },
+    { x: 11, y: 30, size: 210 },
+    { x: 14, y: 21, size: 90 }
+  ].map((row) => Object.freeze(row))
+);
+
+// src/charts/bubble-chart/bubble-chart.ts
+var FAMILY6 = { chart: "BubbleChart", fallbackName: "Bubble chart", defaultSizeRange: [100, 500], sizeByDefault: true, toned: true };
+var bubbleChart = /* @__PURE__ */ Object.freeze({
+  name: "BubbleChart",
+  build: (props, context) => buildPoints(FAMILY6, props, context, BUBBLE_CHART_DEMO)
+});
+
+export { DEFAULTS, DISPLAY_FACE_PROBE, FORCED_PRECISION_QUERY, LINE_CHART_DEMO, LINE_CHART_DEMO_KEYS, MIN_TOUCH_TARGET, NAVIGATION_KEYS, NullInker, PATH_BYTE_BUDGET, SilverpointError, __setDiagnosticSink, activityGrid, addDays, areaChart, bandScale, barChart, bubbleChart, bulletChart, candlestickChart, checkTypeface, chordRing, circlePath, composedChart, coxcombChart, createPrng, deriveSeed, diagnose, donutChart, enforceHeightening, expandDomain, extent, fnv1a32, funnelChart, gaugeArc, heatmapChart, instanceId, isoDate, kpiCard, lineChart, linearScale, max, meterChart, min, orbitChart, parseGeometry, parseIsoDate, pathBytes, polarBarChart, pyramidChart, radarChart, radialArcGroup, radialRings, rangeBandChart, readout, reduceInteraction, registerInker, resolveActive, resolveConfig, resolveInker, resolveSeed, round2, roundGeometry, roundPathData, sameActive, sankeyChart, scatterChart, serializeGeometry, sparklineRows, stackedBarChart, stepActive, stepChart, streamChart, svgString, toSvgPoint, toSvgView, treemapChart, volvelleChart, waterfallChart, weekday, windRose };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map