@open-tomato/charts 0.0.0-stage → 0.1.1

package/dist/index-4bxmxw89.js

@@ -0,0 +1,1786 @@
+import {
+  POLE_TOKENS,
+  SEQUENTIAL_TOKENS,
+  SERIES_TOKENS,
+  STATUS_TOKENS,
+  SURFACE_TOKENS,
+  THEME_TOKENS,
+  TOKEN_PREFIX,
+  tokenName,
+  tokenNames
+} from "./index-85mb21rn.js";
+
+// src/seam/tones.ts
+import { cva } from "class-variance-authority";
+var chartTone = cva("", {
+  variants: {
+    tone: {
+      "series-1": "text-series-1",
+      "series-2": "text-series-2",
+      "series-3": "text-series-3",
+      "series-4": "text-series-4",
+      "series-5": "text-series-5",
+      "series-6": "text-series-6",
+      "series-7": "text-series-7",
+      "series-8": "text-series-8",
+      good: "text-good",
+      warning: "text-warning",
+      serious: "text-serious",
+      critical: "text-critical",
+      "pole-ship": "text-pole-ship",
+      "pole-ship-core": "text-pole-ship-core",
+      "pole-fail": "text-pole-fail",
+      "pole-fail-core": "text-pole-fail-core",
+      "pole-base": "text-pole-base",
+      "pole-base-core": "text-pole-base-core",
+      neutral: "text-ink-2",
+      muted: "text-muted"
+    }
+  },
+  defaultVariants: { tone: "series-1" }
+});
+var ALL_TONES = [
+  ...tokenNames(SERIES_TOKENS),
+  ...tokenNames(STATUS_TOKENS),
+  ...tokenNames(POLE_TOKENS),
+  "neutral",
+  "muted"
+];
+var SEQUENTIAL_STEPS = tokenNames(SEQUENTIAL_TOKENS).filter((name) => name.startsWith("seq-"));
+var CHROME_ROLES = tokenNames(SURFACE_TOKENS);
+var NEUTRAL_TOKEN = "ink-2";
+function tokenOfTone(tone) {
+  return tone === "neutral" ? NEUTRAL_TOKEN : tone;
+}
+function toneVar(toneOrRole) {
+  const token = toneOrRole === "neutral" ? NEUTRAL_TOKEN : toneOrRole;
+  return `var(${TOKEN_PREFIX}${token})`;
+}
+function readTokens() {
+  const out = {};
+  if (typeof document === "undefined")
+    return out;
+  const style = getComputedStyle(document.documentElement);
+  const names = [...ALL_TONES.map(tokenOfTone), ...SEQUENTIAL_STEPS, ...CHROME_ROLES];
+  for (const name of names) {
+    out[name] = style.getPropertyValue(`${TOKEN_PREFIX}${name}`).trim();
+  }
+  for (const tone of ALL_TONES) {
+    out[tone] = out[tokenOfTone(tone)] ?? "";
+  }
+  return out;
+}
+function tokensFrom(values) {
+  const out = {};
+  for (const token of THEME_TOKENS) {
+    const name = tokenName(token);
+    out[name] = values[name];
+  }
+  for (const tone of ALL_TONES) {
+    out[tone] = out[tokenOfTone(tone)] ?? "";
+  }
+  return out;
+}
+
+// src/seam/height.ts
+var DEFAULT_CHART_HEIGHT = 220;
+function plotHeightOf(height, measured = 0) {
+  if (height === "fill") {
+    return measured > 0 ? measured : DEFAULT_CHART_HEIGHT;
+  }
+  return height ?? DEFAULT_CHART_HEIGHT;
+}
+
+// src/engine/core.ts
+import {
+  BarChart,
+  BoxplotChart,
+  CustomChart,
+  GaugeChart,
+  GraphChart,
+  HeatmapChart,
+  LineChart,
+  PieChart,
+  RadarChart,
+  SankeyChart,
+  ScatterChart,
+  SunburstChart,
+  TreemapChart
+} from "echarts/charts";
+import {
+  DataZoomInsideComponent,
+  DataZoomSliderComponent,
+  GraphicComponent,
+  GridComponent,
+  MarkLineComponent,
+  RadarComponent,
+  TooltipComponent,
+  VisualMapComponent
+} from "echarts/components";
+import { color as zrColor } from "echarts/core";
+import * as echarts from "echarts/core";
+echarts.use([
+  BarChart,
+  BoxplotChart,
+  CustomChart,
+  GaugeChart,
+  GraphChart,
+  HeatmapChart,
+  LineChart,
+  PieChart,
+  RadarChart,
+  SankeyChart,
+  ScatterChart,
+  SunburstChart,
+  TreemapChart,
+  DataZoomInsideComponent,
+  DataZoomSliderComponent,
+  GraphicComponent,
+  GridComponent,
+  MarkLineComponent,
+  RadarComponent,
+  TooltipComponent,
+  VisualMapComponent
+]);
+var DEFAULT_HEIGHT = DEFAULT_CHART_HEIGHT;
+var BAR_MAX_WIDTH = 24;
+var BAR_RADIUS = 4;
+var BLUR_OPACITY = 0.85;
+var TICK_FONT_SIZE = 11;
+var ANIMATION_DURATION = 400;
+var markHover = {
+  emphasis: { focus: "self" },
+  blur: { itemStyle: { opacity: BLUR_OPACITY } }
+};
+function paint(tokens, toneOrToken) {
+  return tokens[toneOrToken] ?? "";
+}
+function withAlpha(colour, alpha) {
+  return zrColor.modifyAlpha(colour, alpha);
+}
+function mix(from, to, share) {
+  return zrColor.lerp(Math.min(1, Math.max(0, share)), [from, to]);
+}
+function readableOn(tokens, background) {
+  const ink = paint(tokens, "ink");
+  const surface = paint(tokens, "surface");
+  const contrast = (text) => Math.abs(zrColor.lum(text, 0) - zrColor.lum(background, 0));
+  return contrast(ink) >= contrast(surface) ? ink : surface;
+}
+var FALLBACK_FONT_FAMILY = "sans-serif";
+function readFontFamily() {
+  if (typeof document === "undefined")
+    return FALLBACK_FONT_FAMILY;
+  const declared = getComputedStyle(document.documentElement).getPropertyValue("--font-sans").trim();
+  return declared === "" ? FALLBACK_FONT_FAMILY : declared;
+}
+function finishOption(option, animate) {
+  return {
+    useUTC: true,
+    animation: animate !== false,
+    animationDuration: ANIMATION_DURATION,
+    ...option,
+    textStyle: { fontFamily: readFontFamily() }
+  };
+}
+
+// src/seam/format.ts
+function formatCompact(value) {
+  const abs = Math.abs(value);
+  if (abs >= 1e6)
+    return `${trimZero((value / 1e6).toFixed(1))}M`;
+  if (abs >= 1000)
+    return `${trimZero((value / 1000).toFixed(1))}K`;
+  if (Number.isInteger(value))
+    return String(value);
+  return trimZero(value.toFixed(1));
+}
+function formatPercent(fraction) {
+  return `${Math.round(fraction * 100)}%`;
+}
+function formatMinutes(minutes) {
+  if (minutes >= 60)
+    return `${trimZero((minutes / 60).toFixed(1))} h`;
+  return `${Math.round(minutes)} min`;
+}
+function formatDay(date) {
+  return formatDate(date, "day");
+}
+function formatWeek(date) {
+  return formatDate(date, "week");
+}
+var ELAPSED_UNITS = [["d", 86400], ["h", 3600], ["m", 60], ["s", 1]];
+function formatElapsed(seconds) {
+  let rest = Math.max(0, Math.floor(seconds));
+  const parts = [];
+  for (const [unit, size] of ELAPSED_UNITS) {
+    const count = Math.floor(rest / size);
+    rest -= count * size;
+    if (count > 0)
+      parts.push(`${count}${unit}`);
+  }
+  return parts.length > 0 ? parts.join(" ") : "0s";
+}
+var MS_PER_HOUR = 3600000;
+var HOURS_PER_DAY = 24;
+var DAYS_PER_WEEK = 7;
+var AVERAGE_DAYS_PER_MONTH = 30.44;
+var AVERAGE_DAYS_PER_YEAR = 365.25;
+function sameUtcDay(a, b) {
+  return a.getUTCFullYear() === b.getUTCFullYear() && a.getUTCMonth() === b.getUTCMonth() && a.getUTCDate() === b.getUTCDate();
+}
+function formatRelative(value, now, locale = DEFAULT_FORMAT_CONTEXT.locale) {
+  const date = typeof value === "number" ? new Date(value) : value;
+  const reference = typeof now === "number" ? new Date(now) : now;
+  if (sameUtcDay(date, reference))
+    return formatDate(date, "time", locale);
+  const relative = new Intl.RelativeTimeFormat(locale, { numeric: "auto" });
+  const diff = date.getTime() - reference.getTime();
+  const sign = diff < 0 ? -1 : 1;
+  const hours = Math.abs(diff) / MS_PER_HOUR;
+  if (hours < HOURS_PER_DAY)
+    return relative.format(sign * Math.max(1, Math.floor(hours)), "hour");
+  const days = Math.floor(hours / HOURS_PER_DAY);
+  if (days < DAYS_PER_WEEK)
+    return relative.format(sign * days, "day");
+  const months = Math.floor(days / AVERAGE_DAYS_PER_MONTH);
+  if (months < 1)
+    return relative.format(sign * Math.floor(days / DAYS_PER_WEEK), "week");
+  const years = Math.floor(days / AVERAGE_DAYS_PER_YEAR);
+  if (years < 1)
+    return relative.format(sign * months, "month");
+  return relative.format(sign * years, "year");
+}
+function trimZero(text) {
+  return text.replace(/\.0$/, "");
+}
+var VALUE_FORMAT_KINDS = ["raw", "number", "compact", "percent", "money", "unit", "duration", "elapsed", "date", "relative", "custom"];
+var DATE_PATTERNS = ["day", "week", "time", "datetime", "month"];
+var DURATION_UNITS = ["minutes", "seconds", "ms"];
+var PERCENT_BASES = ["fraction", "percent"];
+var UNIT_POSITIONS = ["after", "before"];
+var DEFAULT_FORMAT_CONTEXT = {
+  locale: "en-GB",
+  currency: "USD",
+  timeZone: "UTC",
+  customFormatters: {}
+};
+function resolveFormatContext(context = {}) {
+  return {
+    locale: context.locale ?? DEFAULT_FORMAT_CONTEXT.locale,
+    currency: context.currency ?? DEFAULT_FORMAT_CONTEXT.currency,
+    timeZone: "UTC",
+    customFormatters: context.customFormatters ?? DEFAULT_FORMAT_CONTEXT.customFormatters,
+    ...context.now === undefined ? {} : { now: context.now }
+  };
+}
+var DAY = { day: "numeric", month: "short", timeZone: "UTC" };
+var TIME = { hour: "2-digit", minute: "2-digit", timeZone: "UTC" };
+var MONTH = { month: "short", year: "numeric", timeZone: "UTC" };
+function formatDate(value, pattern, locale = DEFAULT_FORMAT_CONTEXT.locale) {
+  const date = typeof value === "number" ? new Date(value) : value;
+  switch (pattern) {
+    case "day":
+      return date.toLocaleDateString(locale, DAY);
+    case "week":
+      return `w/c ${date.toLocaleDateString(locale, DAY)}`;
+    case "time":
+      return date.toLocaleTimeString(locale, TIME);
+    case "datetime":
+      return `${date.toLocaleDateString(locale, DAY)}, ${date.toLocaleTimeString(locale, TIME)}`;
+    case "month":
+      return date.toLocaleDateString(locale, MONTH);
+  }
+}
+function fractionDigits(digits) {
+  return digits === undefined ? {} : { minimumFractionDigits: digits, maximumFractionDigits: digits };
+}
+var TO_MINUTES = { minutes: 1, seconds: 1 / 60, ms: 1 / 60000 };
+var TO_SECONDS = { minutes: 60, seconds: 1, ms: 1 / 1000 };
+var BUILDERS = {
+  raw: ({ digits }) => (value) => digits === undefined ? String(value) : value.toFixed(digits),
+  number: ({ digits, grouping }, { locale }) => {
+    const intl = new Intl.NumberFormat(locale, { ...fractionDigits(digits), useGrouping: grouping !== false });
+    return (value) => intl.format(value);
+  },
+  compact: () => formatCompact,
+  percent: ({ digits, of, signed }, { locale }) => {
+    const intl = new Intl.NumberFormat(locale, {
+      style: "percent",
+      ...fractionDigits(digits ?? 0),
+      signDisplay: signed === true ? "exceptZero" : "auto"
+    });
+    const scale = of === "percent" ? 1 / 100 : 1;
+    return (value) => intl.format(value * scale);
+  },
+  money: ({ currency, digits, compact }, context) => {
+    const intl = new Intl.NumberFormat(context.locale, {
+      style: "currency",
+      currency: currency ?? context.currency,
+      ...compact === true ? { notation: "compact", maximumFractionDigits: digits ?? 1 } : fractionDigits(digits)
+    });
+    return (value) => intl.format(value);
+  },
+  unit: ({ unit, position }, { locale }) => {
+    const intl = new Intl.NumberFormat(locale);
+    return position === "before" ? (value) => `${unit}${intl.format(value)}` : (value) => `${intl.format(value)} ${unit}`;
+  },
+  duration: ({ from }) => (value) => formatMinutes(value * TO_MINUTES[from]),
+  elapsed: ({ from }) => (value) => formatElapsed(value * TO_SECONDS[from]),
+  date: ({ pattern }, { locale }) => (value) => formatDate(value, pattern, locale),
+  relative: (_spec, { locale, now }) => (value) => formatRelative(value, now ?? Date.now(), locale),
+  custom: ({ id }, { customFormatters }) => {
+    const registered = Object.hasOwn(customFormatters, id) ? customFormatters[id] : undefined;
+    if (registered === undefined) {
+      const known = Object.keys(customFormatters);
+      const list = known.length === 0 ? "none are registered" : `registered: ${known.join(", ")}`;
+      throw new Error(`formatterFor: no custom formatter "${id}" in the format context (${list})`);
+    }
+    return registered;
+  }
+};
+function formatterFor(spec, context = {}) {
+  const kind = spec.kind;
+  if (!Object.hasOwn(BUILDERS, kind))
+    throw new Error(`formatterFor: unknown format kind "${kind}"`);
+  const build = BUILDERS[spec.kind];
+  return build(spec, resolveFormatContext(context));
+}
+var UNITLESS_KINDS = new Set(["raw", "number", "compact"]);
+function formatMeasured(measured, context = {}, specFormat) {
+  const { value, unit } = measured;
+  const format = measured.format ?? specFormat ?? { kind: "number" };
+  const text = formatterFor(format, context)(value);
+  return unit !== undefined && UNITLESS_KINDS.has(format.kind) ? `${text} ${unit}` : text;
+}
+
+// src/engine/chrome.ts
+import { format as echartsFormat } from "echarts/core";
+
+// src/engine/shared.variants.ts
+import { cva as cva2 } from "class-variance-authority";
+var chartRootVariants = cva2("block w-full", {
+  variants: {
+    cursor: {
+      auto: "",
+      default: "[&_*]:cursor-default!"
+    }
+  },
+  defaultVariants: { cursor: "auto" }
+});
+var chartFrameVariants = cva2("", {
+  variants: {
+    fill: { true: "h-full", false: "" }
+  },
+  defaultVariants: { fill: false }
+});
+var tooltipSurfaceVariants = cva2("pointer-events-none rounded-md bg-surface px-2.5 py-2 text-xs text-ink shadow-md shadow-black/10 ring-1 ring-ring");
+var tooltipHeadingVariants = cva2("mb-1 text-ink-2");
+var tooltipRowVariants = cva2("flex items-center gap-1.5 whitespace-nowrap");
+var tooltipValueVariants = cva2("font-semibold text-ink tabular-nums");
+var tooltipLabelVariants = cva2("text-ink-2");
+var tooltipKeyVariants = cva2("inline-block rounded-full", {
+  variants: {
+    shape: {
+      line: "h-0.5 w-3",
+      dot: "size-2"
+    }
+  },
+  defaultVariants: { shape: "dot" }
+});
+
+// src/engine/chrome.ts
+function plotGrid(room = {}) {
+  return {
+    top: room.top ?? 12,
+    right: room.right ?? 8,
+    bottom: room.bottom ?? 4,
+    left: room.left ?? 4,
+    outerBoundsMode: "same",
+    outerBoundsContain: "axisLabel"
+  };
+}
+function tickLabel(tokens) {
+  return { color: paint(tokens, "muted"), fontSize: TICK_FONT_SIZE };
+}
+function valueAxis(tokens, format, bounds = {}) {
+  return {
+    type: "value",
+    min: bounds.min,
+    max: bounds.max,
+    axisLine: { show: false },
+    axisTick: { show: false },
+    splitLine: { show: true, lineStyle: { color: paint(tokens, "grid"), width: 1, type: "solid" } },
+    axisLabel: { ...tickLabel(tokens), formatter: (value) => format(value) }
+  };
+}
+function given(key, value) {
+  if (value === undefined)
+    return {};
+  return { [key]: value };
+}
+function categoryAxis(tokens, data, extra = {}) {
+  return {
+    type: "category",
+    data: [...data],
+    ...given("inverse", extra.inverse),
+    ...given("boundaryGap", extra.boundaryGap),
+    ...given("position", extra.position),
+    axisLine: { show: extra.showLine ?? true, lineStyle: { color: paint(tokens, "baseline"), width: 1 } },
+    axisTick: { show: false },
+    splitLine: { show: false },
+    axisLabel: { ...tickLabel(tokens), show: extra.showLabels ?? true, interval: extra.interval ?? "auto", hideOverlap: true }
+  };
+}
+var DAY_MS = 86400000;
+var WEEK_MS = 7 * DAY_MS;
+var DAYS_SINCE_MONDAY = [6, 0, 1, 2, 3, 4, 5];
+function startOfWeekUtc(ms) {
+  const date = new Date(ms);
+  const dayStart = Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate());
+  return dayStart - (DAYS_SINCE_MONDAY[date.getUTCDay()] ?? 0) * DAY_MS;
+}
+function weekStartsUtc(from, to) {
+  const starts = [];
+  for (let monday = startOfWeekUtc(from);monday <= to; monday += WEEK_MS)
+    starts.push(monday);
+  return starts;
+}
+function timeAxis(tokens, xFormat, ticks) {
+  const formatter = (value) => xFormat(new Date(value));
+  const label = { ...tickLabel(tokens), formatter, hideOverlap: true };
+  const chrome = {
+    axisLine: { show: true, lineStyle: { color: paint(tokens, "baseline"), width: 1 } },
+    axisTick: { show: false },
+    splitLine: { show: false }
+  };
+  if (ticks === undefined)
+    return { type: "time", ...chrome, axisLabel: label };
+  return {
+    type: "time",
+    min: startOfWeekUtc(ticks.from),
+    ...chrome,
+    axisLabel: { ...label, customValues: weekStartsUtc(ticks.from, ticks.to) }
+  };
+}
+function referenceLine(tokens, axis, value, label, labelAt = "end") {
+  return {
+    silent: true,
+    symbol: "none",
+    animation: false,
+    lineStyle: { color: paint(tokens, "ink-2"), width: 1, type: "solid" },
+    label: {
+      show: true,
+      position: labelAt,
+      color: paint(tokens, "ink-2"),
+      fontSize: TICK_FONT_SIZE,
+      formatter: () => label
+    },
+    data: [axis === "yAxis" ? { yAxis: value } : { xAxis: value }]
+  };
+}
+function referenceLabelRoom(label) {
+  return Math.ceil(echartsFormat.getTextRect(label, `${TICK_FONT_SIZE}px ${readFontFamily()}`).width) + 12;
+}
+function tooltipChrome(trigger) {
+  return {
+    trigger,
+    confine: true,
+    backgroundColor: "transparent",
+    borderWidth: 0,
+    padding: 0,
+    shadowBlur: 0,
+    extraCssText: "box-shadow: none;",
+    transitionDuration: 0.1
+  };
+}
+function crosshair(tokens) {
+  return { type: "line", snap: true, lineStyle: { color: paint(tokens, "grid"), width: 1, type: "solid" }, label: { show: false } };
+}
+function element(tag, className, text) {
+  const node = document.createElement(tag);
+  node.className = className;
+  if (text !== undefined)
+    node.textContent = text;
+  return node;
+}
+function keyNode(colour, shape) {
+  const node = element("span", tooltipKeyVariants({ shape }));
+  node.style.background = colour;
+  return node;
+}
+function tooltipNode(heading, rows) {
+  const root = element("div", tooltipSurfaceVariants());
+  if (heading !== undefined)
+    root.append(element("div", tooltipHeadingVariants(), heading));
+  for (const row of rows) {
+    const line = element("div", tooltipRowVariants());
+    if (row.colour !== undefined)
+      line.append(keyNode(row.colour, row.key ?? "line"));
+    line.append(element("strong", tooltipValueVariants(), row.value), element("span", tooltipLabelVariants(), row.label));
+    root.append(line);
+  }
+  return root;
+}
+function firstParam(params) {
+  return paramList(params)[0];
+}
+function paramList(params) {
+  return Array.isArray(params) ? params : [params];
+}
+function numericAt(value, index) {
+  if (Array.isArray(value)) {
+    const item = value[index];
+    return typeof item === "number" ? item : Number(item);
+  }
+  return typeof value === "number" ? value : Number(value);
+}
+
+// src/engine/BarChart/BarChart.option.ts
+function toShares(series, categoryCount) {
+  const totals = Array.from({ length: categoryCount }, (_, index) => series.reduce((sum, entry) => sum + (entry.values[index] ?? 0), 0));
+  return series.map((entry) => ({
+    ...entry,
+    values: entry.values.map((value, index) => {
+      const total = totals[index] ?? 0;
+      return total === 0 ? 0 : value / total;
+    })
+  }));
+}
+function topOfStack(series, categoryCount) {
+  return Array.from({ length: categoryCount }, (_, index) => series.reduce((top, entry, seriesIndex) => (entry.values[index] ?? 0) !== 0 ? seriesIndex : top, -1));
+}
+function buildOption(props, tokens) {
+  const { categories, mode = "grouped", orientation = "vertical", limit } = props;
+  const stacked = mode !== "grouped";
+  const format = props.valueFormat ?? (mode === "stacked100" ? formatPercent : formatCompact);
+  const drawn = mode === "stacked100" ? toShares(props.series, categories.length) : props.series;
+  const tops = topOfStack(drawn, categories.length);
+  const horizontal = orientation === "horizontal";
+  const dataEnd = horizontal ? [0, BAR_RADIUS, BAR_RADIUS, 0] : [BAR_RADIUS, BAR_RADIUS, 0, 0];
+  const square = [0, 0, 0, 0];
+  const surface = paint(tokens, "surface");
+  const series = drawn.map((entry, seriesIndex) => ({
+    type: "bar",
+    id: entry.id,
+    name: entry.label,
+    stack: stacked ? "total" : undefined,
+    barMaxWidth: BAR_MAX_WIDTH,
+    barGap: 0,
+    itemStyle: { color: paint(tokens, entry.tone), borderColor: surface, borderWidth: 1 },
+    ...markHover,
+    data: entry.values.map((value2, index) => ({
+      value: value2,
+      itemStyle: { borderRadius: !stacked || tops[index] === seriesIndex ? dataEnd : square }
+    })),
+    markLine: limit && seriesIndex === 0 ? horizontal ? referenceLine(tokens, "xAxis", limit.value, limit.label, "start") : referenceLine(tokens, "yAxis", limit.value, limit.label) : undefined
+  }));
+  const valueBounds = mode === "stacked100" ? { min: 0, max: 1 } : { max: limit ? (extent) => Math.max(extent.max, limit.value) : undefined };
+  const value = valueAxis(tokens, format, valueBounds);
+  const category = categoryAxis(tokens, categories, { inverse: horizontal });
+  const tooltipFormatter = (params) => {
+    const item = firstParam(params);
+    const seriesIndex = item?.seriesIndex ?? 0;
+    const dataIndex = item?.dataIndex ?? 0;
+    const entry = drawn[seriesIndex];
+    const raw = props.series[seriesIndex]?.values[dataIndex] ?? 0;
+    const shown = entry?.values[dataIndex] ?? 0;
+    const rows = [{ value: format(shown), label: entry?.label ?? "", colour: paint(tokens, entry?.tone ?? "series-1"), key: "dot" }];
+    const extra = mode === "stacked100" ? [{ value: formatCompact(raw), label: "count" }] : [];
+    return tooltipNode(categories[dataIndex], [...rows, ...extra]);
+  };
+  return {
+    grid: plotGrid({ right: limit && !horizontal ? referenceLabelRoom(limit.label) : 12, top: limit && horizontal ? 24 : 12 }),
+    xAxis: horizontal ? value : category,
+    yAxis: horizontal ? category : value,
+    tooltip: { ...tooltipChrome("item"), formatter: tooltipFormatter },
+    series
+  };
+}
+
+// src/engine/BoxPlot/BoxPlot.option.ts
+var BOX_FILL_ALPHA = 0.35;
+var OUTLIER_SIZE = 8;
+function buildOption2(props, tokens) {
+  const { groups, unit } = props;
+  const format = props.valueFormat ?? formatCompact;
+  const tone = paint(tokens, "series-1");
+  const ink = paint(tokens, "ink");
+  const boxes = {
+    type: "boxplot",
+    name: unit,
+    boxWidth: [BAR_MAX_WIDTH, BAR_MAX_WIDTH],
+    itemStyle: { color: withAlpha(tone, BOX_FILL_ALPHA), borderColor: paint(tokens, "ink-2"), borderWidth: 1 },
+    ...markHover,
+    data: groups.map((group) => [group.min, group.q1, group.median, group.q3, group.max])
+  };
+  const medians = {
+    type: "custom",
+    name: "median",
+    silent: true,
+    z: 3,
+    renderItem: (_params, api) => {
+      const [x = 0, y = 0] = api.coord([api.value(0), api.value(1)]);
+      const half = BAR_MAX_WIDTH / 2;
+      return {
+        type: "line",
+        shape: { x1: x - half, y1: y, x2: x + half, y2: y },
+        style: { stroke: ink, lineWidth: 2 }
+      };
+    },
+    data: groups.map((group, index) => [index, group.median])
+  };
+  const outliers = {
+    type: "scatter",
+    name: "outlier",
+    symbolSize: OUTLIER_SIZE,
+    itemStyle: { color: tone, borderColor: paint(tokens, "surface"), borderWidth: 2 },
+    data: groups.flatMap((group, index) => (group.outliers ?? []).map((value) => [index, value]))
+  };
+  const tooltipFormatter = (params) => {
+    const item = firstParam(params);
+    if (item?.seriesType === "scatter") {
+      const value = Array.isArray(item.value) ? Number(item.value[1]) : Number(item.value);
+      const group2 = groups[Array.isArray(item.value) ? Number(item.value[0]) : 0];
+      return tooltipNode(group2?.label, [{ value: `${format(value)} ${unit}`, label: "outlier", colour: tone, key: "dot" }]);
+    }
+    const group = groups[item?.dataIndex ?? 0];
+    if (!group)
+      return tooltipNode(undefined, []);
+    const row = (value, label) => ({ value: `${format(value)} ${unit}`, label });
+    return tooltipNode(group.label, [
+      row(group.max, "max"),
+      row(group.q3, "q3"),
+      row(group.median, "median"),
+      row(group.q1, "q1"),
+      row(group.min, "min")
+    ]);
+  };
+  return {
+    grid: plotGrid({ right: 12 }),
+    xAxis: categoryAxis(tokens, groups.map((group) => group.label)),
+    yAxis: valueAxis(tokens, (value) => format(value), { min: 0 }),
+    tooltip: { ...tooltipChrome("item"), formatter: tooltipFormatter },
+    series: [boxes, medians, outliers]
+  };
+}
+
+// src/engine/Bullet/Bullet.option.ts
+var TRACK_HEIGHT = 28;
+var VALUE_BAR_HEIGHT = 8;
+var TEXT_ROOM = 96;
+var AXIS_LABEL_ROOM = 20;
+var VALUE_TO_LABEL = 24;
+var BAND_OPACITY = [0.45, 0.75, 1];
+function buildOption3(props, tokens) {
+  const { value, target, max, ranges, label, higherIsBetter = true } = props;
+  const fill = props.height === "fill";
+  const height = plotHeightOf(props.height);
+  const format = props.valueFormat ?? formatCompact;
+  const pastTarget = !higherIsBetter && value > target;
+  const valueColour = paint(tokens, pastTarget ? "critical" : "series-1");
+  const bandEnds = [ranges[0], ranges[1], 1].map((fraction) => fraction * max);
+  const bandWidths = bandEnds.map((end, index) => end - (index === 0 ? 0 : bandEnds[index - 1] ?? 0));
+  const top = Math.max(0, Math.round((height - TRACK_HEIGHT - AXIS_LABEL_ROOM) / 2));
+  const middle = top + TRACK_HEIGHT / 2;
+  const valueText = { type: "text", silent: true, style: { text: format(value), fill: paint(tokens, "ink"), fontSize: 20, fontWeight: 600, align: "right" } };
+  const labelText = { type: "text", silent: true, style: { text: label, fill: paint(tokens, "muted"), fontSize: TICK_FONT_SIZE, align: "right" } };
+  const track = [label];
+  const bands = bandWidths.map((width, index) => ({
+    type: "bar",
+    name: `band-${index}`,
+    stack: "bands",
+    yAxisIndex: 0,
+    barWidth: "100%",
+    silent: true,
+    itemStyle: { color: paint(tokens, "grid"), opacity: BAND_OPACITY[index] ?? 1 },
+    data: [width]
+  }));
+  const reading = {
+    type: "bar",
+    name: label,
+    yAxisIndex: 1,
+    barWidth: VALUE_BAR_HEIGHT,
+    itemStyle: { color: valueColour, borderRadius: [0, 2, 2, 0] },
+    data: [Math.min(value, max)],
+    markLine: {
+      silent: true,
+      symbol: "none",
+      animation: false,
+      label: { show: false },
+      lineStyle: { color: paint(tokens, "ink"), width: 2, type: "solid" },
+      data: [{ xAxis: target }]
+    }
+  };
+  return {
+    grid: { top: fill ? "middle" : top, height: TRACK_HEIGHT, left: 4, right: TEXT_ROOM },
+    xAxis: {
+      type: "value",
+      min: 0,
+      max,
+      splitLine: { show: false },
+      axisLine: { show: false },
+      axisTick: { show: false },
+      axisLabel: { color: paint(tokens, "muted"), fontSize: TICK_FONT_SIZE, formatter: (tick) => format(tick) }
+    },
+    yAxis: [
+      categoryAxis(tokens, track, { showLine: false, showLabels: false }),
+      categoryAxis(tokens, track, { showLine: false, showLabels: false })
+    ],
+    tooltip: {
+      ...tooltipChrome("item"),
+      formatter: () => tooltipNode(label, [
+        { value: format(value), label: "value", colour: valueColour, key: "dot" },
+        { value: format(target), label: "target" }
+      ])
+    },
+    graphic: fill ? [{ type: "group", right: 4, top: "middle", children: [{ ...valueText, y: 0 }, { ...labelText, y: VALUE_TO_LABEL }] }] : [
+      { ...valueText, right: 4, top: middle - 18 },
+      { ...labelText, right: 4, top: middle + 6 }
+    ],
+    series: [...bands, reading]
+  };
+}
+
+// src/engine/Donut/Donut.option.ts
+var RADIUS = ["60%", "92%"];
+var RADIUS_WITH_COMPARE = ["65%", "98%"];
+var COMPARE_RADIUS = ["40%", "58%"];
+var COMPARE_ALPHA = 0.6;
+var CURRENT_LABEL = "this period";
+var CENTER_VALUE_SIZE = 24;
+var CENTER_LABEL_SIZE = 12;
+function buildOption4(props, tokens) {
+  const { slices, centerValue, centerLabel } = props;
+  const format = props.valueFormat ?? formatCompact;
+  const total = slices.reduce((sum, slice) => sum + slice.value, 0);
+  const centreText = [centerValue === undefined ? "" : `{value|${centerValue}}`, centerLabel === undefined ? "" : `{label|${centerLabel}}`].filter((line) => line !== "").join(`
+`);
+  const compare = props.compare;
+  const compareTotal = compare ? compare.slices.reduce((sum, slice) => sum + slice.value, 0) : 0;
+  const share = (value, of) => formatPercent(of === 0 ? 0 : value / of);
+  const tooltipFormatter = (params) => {
+    const item = firstParam(params);
+    const ring2 = item?.seriesId === "compare" ? compare?.slices : slices;
+    const id = ring2?.[item?.dataIndex ?? 0]?.id;
+    const current = slices.find((slice) => slice.id === id);
+    const previous = compare?.slices.find((slice) => slice.id === id);
+    const shown = current ?? previous;
+    if (!shown)
+      return tooltipNode(undefined, []);
+    const colour = paint(tokens, shown.tone);
+    const currentRow = current ? [{ value: format(current.value), label: `${CURRENT_LABEL}, ${share(current.value, total)}`, colour, key: "dot" }] : [];
+    const previousRow = compare && previous ? [{ value: format(previous.value), label: `${compare.label}, ${share(previous.value, compareTotal)}`, colour: withAlpha(colour, COMPARE_ALPHA), key: "dot" }] : [];
+    return tooltipNode(shown.label, compare ? [...currentRow, ...previousRow] : [
+      { value: format(shown.value), label: "value", colour, key: "dot" },
+      { value: share(shown.value, total), label: "share" }
+    ]);
+  };
+  const ring = (id, radius, ringSlices, alpha) => ({
+    type: "pie",
+    id,
+    radius,
+    center: ["50%", "50%"],
+    avoidLabelOverlap: false,
+    label: { show: false },
+    labelLine: { show: false },
+    itemStyle: { borderColor: paint(tokens, "surface"), borderWidth: 2 },
+    ...markHover,
+    emphasis: { ...markHover.emphasis, scale: false },
+    data: ringSlices.map((slice) => ({
+      name: slice.label,
+      value: slice.value,
+      itemStyle: { color: alpha === 1 ? paint(tokens, slice.tone) : withAlpha(paint(tokens, slice.tone), alpha) }
+    }))
+  });
+  return {
+    tooltip: { ...tooltipChrome("item"), formatter: tooltipFormatter },
+    graphic: centreText === "" ? [] : [{
+      type: "text",
+      left: "center",
+      top: "middle",
+      silent: true,
+      style: {
+        text: centreText,
+        align: "center",
+        rich: {
+          value: { fill: paint(tokens, "ink"), fontSize: CENTER_VALUE_SIZE, fontWeight: 600, lineHeight: 30, align: "center" },
+          label: { fill: paint(tokens, "muted"), fontSize: CENTER_LABEL_SIZE, lineHeight: 16, align: "center" }
+        }
+      }
+    }],
+    series: compare ? [ring("main", RADIUS_WITH_COMPARE, slices, 1), ring("compare", COMPARE_RADIUS, compare.slices, COMPARE_ALPHA)] : [ring("main", RADIUS, slices, 1)]
+  };
+}
+
+// src/engine/Gauge/Gauge.option.ts
+var START_ANGLE = 200;
+var END_ANGLE = -20;
+var RADIUS_SHARE = 0.92;
+var RADIUS2 = `${RADIUS_SHARE * 100}%`;
+var CENTER_Y_SHARE = 0.5 + RADIUS_SHARE / 2 * (1 - Math.sin(20 * Math.PI / 180)) / 2;
+var CENTER = ["50%", `${Math.round(CENTER_Y_SHARE * 1000) / 10}%`];
+var ARC_WIDTH = 12;
+var COMPARE_RADIUS2 = "76%";
+var COMPARE_WIDTH = 4;
+var COMPARE_ALPHA2 = 0.6;
+var MARKER_OVERHANG = 3;
+var VALUE_FONT_SIZE = 28;
+var SUB_FONT_SIZE = 13;
+var LABEL_FONT_SIZE = 12;
+function fillTone(fraction, thresholds) {
+  if (fraction > 1)
+    return "critical";
+  if (!thresholds)
+    return "series-1";
+  if (fraction >= thresholds.critical)
+    return "critical";
+  if (fraction >= thresholds.warning)
+    return "warning";
+  return "series-1";
+}
+function clamp(value, max) {
+  return Math.min(Math.max(value, 0), max);
+}
+function arcBase(max) {
+  return {
+    type: "gauge",
+    startAngle: START_ANGLE,
+    endAngle: END_ANGLE,
+    min: 0,
+    max,
+    center: CENTER,
+    silent: true,
+    pointer: { show: false },
+    anchor: { show: false },
+    axisTick: { show: false },
+    splitLine: { show: false },
+    axisLabel: { show: false },
+    title: { show: false },
+    detail: { show: false }
+  };
+}
+function centreText(props, format) {
+  const { value, max, label, compare } = props;
+  const over = value > max;
+  const lines = over ? [`{big|${formatPercent(value / max)}}`, `{sub|${format(value)}}`, `{label|${label}}`] : [`{big|${format(value)}}`, `{label|${label}}`];
+  const compareLine = compare ? [`{compare|${compare.label} ${format(compare.value)}}`] : [];
+  return [...lines, ...compareLine].join(`
+`);
+}
+function maxMarker(tokens, max) {
+  return {
+    ...arcBase(max),
+    startAngle: END_ANGLE,
+    endAngle: END_ANGLE,
+    radius: RADIUS2,
+    splitNumber: 1,
+    axisLine: { show: false, lineStyle: { width: 0 } },
+    splitLine: {
+      show: true,
+      distance: -MARKER_OVERHANG,
+      length: ARC_WIDTH + 2 * MARKER_OVERHANG,
+      lineStyle: { color: paint(tokens, "ink"), width: 2, cap: "butt" }
+    },
+    z: 3,
+    data: [{ value: 0 }]
+  };
+}
+function buildOption5(props, tokens) {
+  const { value, max, thresholds, compare } = props;
+  const format = props.valueFormat ?? formatCompact;
+  const fraction = max === 0 ? 0 : value / max;
+  const fill = paint(tokens, fillTone(fraction, thresholds));
+  const track = paint(tokens, "grid");
+  const main = {
+    ...arcBase(max),
+    radius: RADIUS2,
+    progress: { show: true, width: ARC_WIDTH, roundCap: true, itemStyle: { color: fill } },
+    axisLine: { roundCap: true, lineStyle: { width: ARC_WIDTH, color: [[1, track]] } },
+    detail: {
+      show: true,
+      valueAnimation: false,
+      offsetCenter: [0, compare ? "2%" : "0%"],
+      formatter: () => centreText(props, format),
+      rich: {
+        big: { color: paint(tokens, "ink"), fontSize: VALUE_FONT_SIZE, fontWeight: 600, lineHeight: 34 },
+        sub: { color: paint(tokens, "ink-2"), fontSize: SUB_FONT_SIZE, fontWeight: 600, lineHeight: 18 },
+        label: { color: paint(tokens, "muted"), fontSize: LABEL_FONT_SIZE, lineHeight: 18 },
+        compare: { color: paint(tokens, "ink-2"), fontSize: LABEL_FONT_SIZE, lineHeight: 18 }
+      }
+    },
+    z: 2,
+    data: [{ value: clamp(value, max) }]
+  };
+  const inner = compare ? [{
+    ...arcBase(max),
+    radius: COMPARE_RADIUS2,
+    progress: {
+      show: true,
+      width: COMPARE_WIDTH,
+      roundCap: true,
+      itemStyle: { color: withAlpha(paint(tokens, "muted"), COMPARE_ALPHA2) }
+    },
+    axisLine: { roundCap: true, lineStyle: { width: COMPARE_WIDTH, color: [[1, track]] } },
+    z: 1,
+    data: [{ value: clamp(compare.value, max) }]
+  }] : [];
+  const marker = value > max ? [maxMarker(tokens, max)] : [];
+  return { series: [main, ...inner, ...marker] };
+}
+
+// src/engine/HeatmapGrid/HeatmapGrid.option.ts
+var CELL_RADIUS = 2;
+var RING_WIDTH = 2;
+function buildOption6(props, tokens) {
+  const { rows, cols, cells, colLabelEvery = 1, unit } = props;
+  const format = props.valueFormat ?? formatCompact;
+  const ramp = SEQUENTIAL_STEPS.map((step) => paint(tokens, step));
+  const { selected } = props;
+  const isSelected = (rowIndex, colIndex) => selected?.row === rowIndex && selected.col === colIndex;
+  const ring = { borderColor: paint(tokens, "ink"), borderWidth: RING_WIDTH };
+  const plain = cells.flatMap((row, rowIndex) => row.map((value, colIndex) => [colIndex, rowIndex, value]).filter((_, colIndex) => !isSelected(rowIndex, colIndex)));
+  const picked = selected ? cells[selected.row]?.[selected.col] : undefined;
+  const data = picked === undefined || !selected ? plain : [...plain, { value: [selected.col, selected.row, picked], itemStyle: ring }];
+  const max = Math.max(1, ...cells.flat());
+  const tooltipFormatter = (params) => {
+    const value = firstParam(params)?.value;
+    const col = cols[numericAt(value, 0)];
+    const row = rows[numericAt(value, 1)];
+    return tooltipNode(`${row ?? ""} · ${col ?? ""}`, [{ value: format(numericAt(value, 2)), label: unit }]);
+  };
+  return {
+    grid: plotGrid({ right: 4, top: 4 }),
+    xAxis: categoryAxis(tokens, cols, { interval: Math.max(0, colLabelEvery - 1), showLine: false, position: "bottom" }),
+    yAxis: categoryAxis(tokens, rows, { inverse: true, showLine: false }),
+    visualMap: {
+      type: "piecewise",
+      show: false,
+      min: 0,
+      max,
+      splitNumber: ramp.length,
+      inRange: { color: ramp }
+    },
+    tooltip: { ...tooltipChrome("item"), formatter: tooltipFormatter },
+    series: [{
+      type: "heatmap",
+      name: unit,
+      itemStyle: { borderColor: paint(tokens, "surface"), borderWidth: 2, borderRadius: CELL_RADIUS },
+      ...markHover,
+      data
+    }]
+  };
+}
+
+// src/engine/Histogram/Histogram.option.ts
+var BIN_GAP_PX = 2;
+function buildOption7(props, tokens) {
+  const { bins, unit } = props;
+  const format = props.valueFormat ?? formatCompact;
+  const fill = paint(tokens, "series-1");
+  const edges = [...bins.map((bin) => bin.from), bins.at(-1)?.to ?? 0];
+  const edgeLabels = edges.map((edge, index) => index === edges.length - 1 ? `${edge} ${unit}` : String(edge));
+  const bands = categoryAxis(tokens, bins.map((bin) => `${bin.from}–${bin.to}`), { showLabels: false });
+  const edgeAxis = categoryAxis(tokens, edgeLabels, { showLine: false, boundaryGap: false, position: "bottom" });
+  const tooltipFormatter = (params) => {
+    const bin = bins[firstParam(params)?.dataIndex ?? 0];
+    if (!bin)
+      return tooltipNode(undefined, []);
+    return tooltipNode(`${bin.from}–${bin.to} ${unit}`, [{ value: format(bin.count), label: "count", colour: fill, key: "dot" }]);
+  };
+  return {
+    grid: plotGrid({ right: 16 }),
+    xAxis: [bands, edgeAxis],
+    yAxis: valueAxis(tokens, format, { min: 0 }),
+    tooltip: { ...tooltipChrome("item"), formatter: tooltipFormatter },
+    series: [{
+      type: "bar",
+      name: "count",
+      xAxisIndex: 0,
+      barCategoryGap: BIN_GAP_PX,
+      itemStyle: { color: fill, borderRadius: [BAR_RADIUS, BAR_RADIUS, 0, 0] },
+      ...markHover,
+      data: bins.map((bin) => bin.count)
+    }]
+  };
+}
+
+// src/engine/LineChart/LineChart.option.ts
+var AREA_WASH = 0.1;
+var HOVER_DOT_SIZE = 10;
+var SLIDER_HEIGHT = 24;
+var SLIDER_ROOM = SLIDER_HEIGHT + 12;
+var SLIDER_FILL_ALPHA = 0.15;
+function zoomOption(tokens) {
+  const range = { start: 0, end: 100 };
+  const accent = paint(tokens, "series-1");
+  const grid = paint(tokens, "grid");
+  return [
+    {
+      type: "slider",
+      xAxisIndex: 0,
+      filterMode: "none",
+      ...range,
+      height: SLIDER_HEIGHT,
+      bottom: 0,
+      left: 8,
+      right: 12,
+      borderColor: paint(tokens, "baseline"),
+      borderRadius: 4,
+      backgroundColor: "transparent",
+      fillerColor: withAlpha(accent, SLIDER_FILL_ALPHA),
+      dataBackground: { lineStyle: { color: grid, width: 1 }, areaStyle: { color: withAlpha(grid, 0.5) } },
+      selectedDataBackground: { lineStyle: { color: accent, width: 1 }, areaStyle: { color: withAlpha(accent, 0.1) } },
+      handleStyle: { color: paint(tokens, "ink-2"), borderColor: paint(tokens, "surface"), borderWidth: 1 },
+      moveHandleSize: 0,
+      brushSelect: false,
+      showDetail: false,
+      emphasis: { handleStyle: { color: paint(tokens, "ink"), borderColor: paint(tokens, "surface") } }
+    },
+    {
+      type: "inside",
+      xAxisIndex: 0,
+      filterMode: "none",
+      ...range,
+      zoomOnMouseWheel: "ctrl",
+      moveOnMouseWheel: false,
+      moveOnMouseMove: true
+    }
+  ];
+}
+function timeTicksOf(props) {
+  if (props.xStep === undefined)
+    return;
+  const times = props.series.flatMap((entry) => entry.points.map((point) => point.x.getTime()));
+  if (times.length === 0)
+    return;
+  return { step: props.xStep, from: Math.min(...times), to: Math.max(...times) };
+}
+function buildOption8(props, tokens) {
+  const { variant = "line", baseline } = props;
+  const format = props.valueFormat ?? formatCompact;
+  const xFormat = props.xFormat ?? formatDay;
+  const surface = paint(tokens, "surface");
+  const series = props.series.map((entry, index) => {
+    const colour = paint(tokens, entry.tone);
+    return {
+      type: "line",
+      id: entry.id,
+      name: entry.label,
+      stack: variant === "stacked-area" ? "total" : undefined,
+      symbol: "circle",
+      symbolSize: HOVER_DOT_SIZE,
+      showSymbol: false,
+      lineStyle: { color: colour, width: 2, cap: "round", join: "round" },
+      itemStyle: { color: colour, borderColor: surface, borderWidth: 2 },
+      areaStyle: variant === "line" ? undefined : { color: colour, opacity: AREA_WASH },
+      emphasis: { focus: "none", lineStyle: { width: 2 } },
+      data: entry.points.map((point) => [point.x.getTime(), point.y]),
+      markLine: baseline && index === 0 ? referenceLine(tokens, "yAxis", baseline.value, baseline.label) : undefined
+    };
+  });
+  const tooltipFormatter = (params) => {
+    const items = paramList(params);
+    const time = numericAt(items[0]?.value, 0);
+    const rows = items.map((item) => {
+      const entry = props.series[item.seriesIndex ?? 0];
+      return {
+        value: format(numericAt(item.value, 1)),
+        label: entry?.label ?? "",
+        colour: paint(tokens, entry?.tone ?? "series-1"),
+        key: "line"
+      };
+    });
+    return tooltipNode(Number.isFinite(time) ? xFormat(new Date(time)) : undefined, rows);
+  };
+  const ceiling = baseline ? (extent) => Math.max(extent.max, baseline.value) : undefined;
+  return {
+    grid: plotGrid({ right: baseline ? referenceLabelRoom(baseline.label) : 12, bottom: props.zoom ? SLIDER_ROOM : 4 }),
+    dataZoom: props.zoom ? zoomOption(tokens) : undefined,
+    xAxis: timeAxis(tokens, xFormat, timeTicksOf(props)),
+    yAxis: valueAxis(tokens, format, { min: 0, max: ceiling }),
+    tooltip: { ...tooltipChrome("axis"), axisPointer: crosshair(tokens), formatter: tooltipFormatter },
+    series
+  };
+}
+
+// src/engine/NetworkGraph/NetworkGraph.option.ts
+var SIZE_FLOOR = 8;
+var SIZE_STEP = 3;
+var EDGE_ALPHA = 0.55;
+var ARROW_SIZE = 6;
+function sizeOf(node) {
+  return SIZE_FLOOR + (node.value ?? 1) * SIZE_STEP;
+}
+function nodeIdOf(data) {
+  return typeof data === "object" && data !== null && "id" in data ? String(data.id) : undefined;
+}
+function buildOption9(props, tokens) {
+  const { nodes, links, groupTones } = props;
+  const byId = new Map(nodes.map((node) => [node.id, node]));
+  const labelOf = (id) => byId.get(id)?.label ?? id;
+  const toneOf = (node) => paint(tokens, groupTones[node.group] ?? "neutral");
+  const dependents = (id) => links.filter((link) => link.source === id).length;
+  const edgeColour = withAlpha(paint(tokens, "muted"), EDGE_ALPHA);
+  const tooltipFormatter = (params) => {
+    const item = firstParam(params);
+    const data = item?.data;
+    if (item?.dataType === "edge" && typeof data === "object" && data !== null && "source" in data && "target" in data) {
+      return tooltipNode(undefined, [{ value: labelOf(String(data.source)), label: `→ ${labelOf(String(data.target))}` }]);
+    }
+    const node = byId.get(nodeIdOf(data) ?? "");
+    if (!node)
+      return tooltipNode(undefined, []);
+    return tooltipNode(node.label, [
+      { value: String(dependents(node.id)), label: "dependents", colour: toneOf(node), key: "dot" },
+      { value: node.group, label: "layer" }
+    ]);
+  };
+  return {
+    tooltip: { ...tooltipChrome("item"), formatter: tooltipFormatter },
+    series: [{
+      type: "graph",
+      layout: "force",
+      top: 16,
+      bottom: 16,
+      left: 16,
+      right: 96,
+      roam: false,
+      draggable: false,
+      cursor: props.onNodeClick ? "pointer" : "default",
+      force: {
+        initLayout: "circular",
+        repulsion: 420,
+        edgeLength: [80, 150],
+        gravity: 0.08,
+        layoutAnimation: props.animate !== false
+      },
+      edgeSymbol: ["none", "arrow"],
+      edgeSymbolSize: ARROW_SIZE,
+      lineStyle: { color: edgeColour, width: 1, curveness: 0 },
+      itemStyle: { borderColor: paint(tokens, "surface"), borderWidth: 2 },
+      label: {
+        show: true,
+        position: "right",
+        color: paint(tokens, "ink-2"),
+        fontSize: TICK_FONT_SIZE,
+        textBorderColor: paint(tokens, "surface"),
+        textBorderWidth: 2
+      },
+      emphasis: { focus: "adjacency", lineStyle: { width: 1.5, color: paint(tokens, "ink-2") } },
+      blur: { itemStyle: { opacity: 0.3 }, lineStyle: { opacity: 0.15 }, label: { opacity: 0.4 } },
+      data: nodes.map((node) => ({
+        id: node.id,
+        name: node.label,
+        value: node.value ?? 1,
+        symbolSize: sizeOf(node),
+        itemStyle: { color: toneOf(node) }
+      })),
+      links: links.map((link) => ({ source: link.source, target: link.target, value: link.value }))
+    }]
+  };
+}
+
+// src/engine/Nightingale/Nightingale.option.ts
+var RADIUS3 = ["8%", "68%"];
+var LABEL_MIN_SHARE = 0.04;
+var LABEL_LINE_HEIGHT = 14;
+function buildOption10(props, tokens) {
+  const { slices, groupTones = {}, unit } = props;
+  const format = props.valueFormat ?? formatCompact;
+  const total = slices.reduce((sum, slice) => sum + slice.value, 0);
+  const shareOf = (value) => total === 0 ? 0 : value / total;
+  const toneOf = (slice) => paint(tokens, slice.tone ?? (slice.group === undefined ? undefined : groupTones[slice.group]) ?? "neutral");
+  const tooltipFormatter = (params) => {
+    const slice = slices[firstParam(params)?.dataIndex ?? -1];
+    if (!slice)
+      return tooltipNode(undefined, []);
+    return tooltipNode(slice.label, [
+      { value: `${format(slice.value)} ${unit}`, label: slice.group ?? "", colour: toneOf(slice), key: "dot" },
+      { value: formatPercent(shareOf(slice.value)), label: "of the total" }
+    ]);
+  };
+  return {
+    tooltip: { ...tooltipChrome("item"), formatter: tooltipFormatter },
+    series: [{
+      type: "pie",
+      roseType: "area",
+      radius: RADIUS3,
+      center: ["50%", "50%"],
+      cursor: "default",
+      itemStyle: { borderColor: paint(tokens, "surface"), borderWidth: 2 },
+      label: {
+        show: true,
+        position: "outside",
+        color: paint(tokens, "ink-2"),
+        fontSize: TICK_FONT_SIZE,
+        lineHeight: LABEL_LINE_HEIGHT,
+        formatter: (params) => `${params.name}
+${format(Number(params.value))}`
+      },
+      labelLine: { show: true, length: 6, length2: 6, lineStyle: { color: paint(tokens, "grid"), width: 1 } },
+      ...markHover,
+      emphasis: { ...markHover.emphasis, scale: false },
+      data: slices.map((slice) => {
+        const labelled = shareOf(slice.value) >= LABEL_MIN_SHARE;
+        return {
+          id: slice.id,
+          name: slice.label,
+          value: slice.value,
+          itemStyle: { color: toneOf(slice) },
+          label: { show: labelled },
+          labelLine: { show: labelled }
+        };
+      })
+    }]
+  };
+}
+
+// src/engine/Radar/Radar.option.ts
+var RADIUS_SHARE2 = 0.6;
+var RADIUS4 = `${RADIUS_SHARE2 * 100}%`;
+var DEFAULT_MAX = 2;
+var SPLIT_NUMBER = 4;
+var START_ANGLE2 = 90;
+var AREA_ALPHA = 0.1;
+var HOVER_ALPHA = 0.05;
+var SYMBOL_SIZE = 6;
+var POLE_FONT_SIZE = 14;
+var POLE_LABEL_OFFSET = 52;
+var AXIS_NAME_GAP = 8;
+var BASELINE_NAME_GAP = 4;
+var BAND_COUNT = 12;
+var RIM_ALPHA = 0.14;
+var CORE_ALPHA_EMPTY = 0.14;
+var CORE_ALPHA_FULL = 0.8;
+var RING_WIDTH_EMPTY = 1;
+var RING_WIDTH_FULL = 2;
+var RING_ALPHA_EMPTY = 0.3;
+var RING_ALPHA_FULL = 0.75;
+function poleRuns(axes, poles) {
+  return axes.reduce((runs, axis) => {
+    const last = runs.at(-1);
+    if (last && last.id === axis.pole)
+      return [...runs.slice(0, -1), { ...last, count: last.count + 1 }];
+    return [...runs, { id: axis.pole, pole: poles.find((pole) => pole.id === axis.pole), count: 1 }];
+  }, []);
+}
+function alignedPie(axisCount, radius = ["0%", RADIUS4]) {
+  const step = 360 / Math.max(1, axisCount);
+  return {
+    type: "pie",
+    radius,
+    center: ["50%", "50%"],
+    startAngle: START_ANGLE2 + step / 2,
+    clockwise: true,
+    avoidLabelOverlap: false,
+    animation: false
+  };
+}
+function confidence(history) {
+  if (!history || history.of <= 0)
+    return 1;
+  return Math.min(1, Math.max(0, history.weeks / history.of));
+}
+var lerp = (from, to, share) => from + (to - from) * share;
+function wedgeBands(runs, axisCount, tokens, baselineShare, history) {
+  const coreAlpha = lerp(CORE_ALPHA_EMPTY, CORE_ALPHA_FULL, history);
+  return Array.from({ length: BAND_COUNT }, (_, band) => {
+    const from = band / BAND_COUNT;
+    const to = (band + 1) / BAND_COUNT;
+    const middle = (from + to) / 2;
+    const inside = middle <= baselineShare;
+    return {
+      ...alignedPie(axisCount, [`${from * RADIUS_SHARE2 * 100}%`, `${to * RADIUS_SHARE2 * 100}%`]),
+      id: `band-${band}`,
+      silent: true,
+      z: 0,
+      label: { show: false },
+      labelLine: { show: false },
+      itemStyle: { borderWidth: 0 },
+      data: runs.map((run) => {
+        const core = paint(tokens, run.pole?.coreTone ?? "neutral");
+        const rim = paint(tokens, run.pole?.tone ?? "neutral");
+        return {
+          name: run.id,
+          value: run.count,
+          itemStyle: { color: withAlpha(mix(core, rim, middle), inside ? coreAlpha : RIM_ALPHA) }
+        };
+      })
+    };
+  });
+}
+function buildOption11(props, tokens) {
+  const { axes, poles, series, baseline } = props;
+  const max = props.max ?? DEFAULT_MAX;
+  const format = props.valueFormat ?? formatCompact;
+  const grid = paint(tokens, "grid");
+  const ink = paint(tokens, "ink");
+  const ink2 = paint(tokens, "ink-2");
+  const step = 360 / Math.max(1, axes.length);
+  const history = confidence(props.history);
+  const baselineShare = baseline && baseline.value > 0 && baseline.value <= max ? baseline.value / max : 0;
+  const tooltipFormatter = (params) => {
+    const index = firstParam(params)?.dataIndex ?? -1;
+    const axis = axes[index];
+    if (!axis)
+      return tooltipNode(undefined, []);
+    const pole = poles.find((entry) => entry.id === axis.pole);
+    return tooltipNode([pole?.icon, axis.label].filter(Boolean).join(" "), series.map((entry) => ({
+      value: format(entry.values[index] ?? 0),
+      label: entry.label,
+      colour: paint(tokens, entry.tone),
+      key: "line"
+    })));
+  };
+  const scale = {
+    center: ["50%", "50%"],
+    radius: RADIUS4,
+    startAngle: START_ANGLE2,
+    clockwise: true,
+    shape: "circle",
+    splitNumber: SPLIT_NUMBER,
+    z: 1,
+    indicator: axes.map((axis) => ({ name: axis.label, min: 0, max })),
+    axisName: { color: ink2, fontSize: TICK_FONT_SIZE },
+    axisNameGap: AXIS_NAME_GAP,
+    axisLine: { lineStyle: { color: grid, width: 1 } },
+    splitLine: { lineStyle: { color: grid, width: 1 } },
+    splitArea: { show: false }
+  };
+  const baselineRing = baselineShare > 0 && baseline ? [{
+    center: ["50%", "50%"],
+    radius: `${RADIUS_SHARE2 * 100 * baselineShare}%`,
+    startAngle: START_ANGLE2 + step / 2,
+    shape: "circle",
+    splitNumber: 1,
+    z: 2,
+    indicator: [{ name: baseline.label, min: 0, max: 1 }],
+    axisName: { color: ink2, fontSize: TICK_FONT_SIZE },
+    axisNameGap: BASELINE_NAME_GAP,
+    axisLine: { show: false },
+    splitLine: {
+      lineStyle: {
+        color: withAlpha(ink, lerp(RING_ALPHA_EMPTY, RING_ALPHA_FULL, history)),
+        width: lerp(RING_WIDTH_EMPTY, RING_WIDTH_FULL, history)
+      }
+    },
+    splitArea: { show: false }
+  }] : [];
+  const runs = poleRuns(axes, poles);
+  return {
+    tooltip: { ...tooltipChrome("item"), formatter: tooltipFormatter },
+    radar: [scale, ...baselineRing],
+    series: [
+      ...wedgeBands(runs, axes.length, tokens, baselineShare, history),
+      {
+        ...alignedPie(axes.length),
+        id: "poles",
+        silent: true,
+        z: 0,
+        itemStyle: { color: "transparent", borderWidth: 0 },
+        label: {
+          show: true,
+          position: "outside",
+          color: ink2,
+          fontSize: POLE_FONT_SIZE,
+          formatter: (params) => {
+            const pole = runs[params.dataIndex]?.pole;
+            return [pole?.icon, pole?.label].filter(Boolean).join(" ");
+          }
+        },
+        labelLine: { show: false, length: POLE_LABEL_OFFSET, length2: 0 },
+        data: runs.map((run) => ({ name: run.id, value: run.count }))
+      },
+      {
+        type: "radar",
+        id: "shapes",
+        radarIndex: 0,
+        silent: true,
+        z: 3,
+        symbol: "circle",
+        symbolSize: SYMBOL_SIZE,
+        data: series.map((entry) => {
+          const colour = paint(tokens, entry.tone);
+          return {
+            name: entry.label,
+            value: axes.map((_, index) => entry.values[index] ?? 0),
+            itemStyle: { color: colour },
+            lineStyle: { color: colour, width: 2, join: "round", cap: "round" },
+            areaStyle: { color: withAlpha(colour, AREA_ALPHA) }
+          };
+        })
+      },
+      {
+        ...alignedPie(axes.length),
+        id: "axes",
+        z: 4,
+        cursor: "default",
+        label: { show: false },
+        labelLine: { show: false },
+        itemStyle: { color: "transparent", borderWidth: 0 },
+        emphasis: { scale: false, itemStyle: { color: withAlpha(ink, HOVER_ALPHA) } },
+        data: axes.map((axis) => ({ name: axis.label, value: 1 }))
+      }
+    ]
+  };
+}
+
+// src/engine/Sankey/Sankey.option.ts
+var NODE_WIDTH = 10;
+var NODE_GAP = 10;
+var LINK_ALPHA = 0.25;
+var LINK_HOVER_ALPHA = 0.5;
+var LABEL_GAP = 6;
+function longestPath(nodes, links) {
+  const memo = new Map;
+  const visiting = new Set;
+  const from = (id) => {
+    const known = memo.get(id);
+    if (known !== undefined)
+      return known;
+    if (visiting.has(id))
+      return 0;
+    visiting.add(id);
+    const length = Math.max(0, ...links.filter((link) => link.source === id).map((link) => 1 + from(link.target)));
+    visiting.delete(id);
+    memo.set(id, length);
+    return length;
+  };
+  return Math.max(0, ...nodes.map((node) => from(node.id)));
+}
+function columnsOf(nodes, links, groupOrder) {
+  const present = groupOrder.filter((group) => nodes.some((node) => node.group === group));
+  const span = Math.max(1, longestPath(nodes, links));
+  const step = present.length > 1 ? span / (present.length - 1) : 0;
+  return new Map(nodes.map((node) => [node.id, Math.max(0, present.indexOf(node.group)) * step]));
+}
+function buildOption12(props, tokens) {
+  const { nodes, links, groupTones, groupOrder } = props;
+  const format = props.valueFormat ?? formatCompact;
+  const columns = columnsOf(nodes, links, groupOrder);
+  const lastColumn = Math.max(0, ...columns.values());
+  const byId = new Map(nodes.map((node) => [node.id, node]));
+  const labelOf = (id) => byId.get(id)?.label ?? id;
+  const toneOf = (node) => paint(tokens, groupTones[node.group] ?? "neutral");
+  const tooltipFormatter = (params) => {
+    const item = firstParam(params);
+    const data = item?.data;
+    if (item?.dataType === "edge" && typeof data === "object" && data !== null && "source" in data && "target" in data) {
+      const source = String(data.source);
+      const target = String(data.target);
+      const value = "value" in data ? Number(data.value) : 0;
+      const sourceNode = byId.get(source);
+      return tooltipNode(`${labelOf(source)} → ${labelOf(target)}`, [
+        { value: format(value), label: "dependency", colour: sourceNode ? toneOf(sourceNode) : undefined, key: "line" }
+      ]);
+    }
+    const id = typeof data === "object" && data !== null && "name" in data ? String(data.name) : "";
+    const node = byId.get(id);
+    if (!node)
+      return tooltipNode(undefined, []);
+    const outgoing = links.filter((link) => link.source === id).length;
+    const incoming = links.filter((link) => link.target === id).length;
+    return tooltipNode(node.label, [
+      { value: String(outgoing), label: "dependents", colour: toneOf(node), key: "dot" },
+      { value: String(incoming), label: "dependencies" },
+      { value: node.group, label: "layer" }
+    ]);
+  };
+  return {
+    tooltip: { ...tooltipChrome("item"), formatter: tooltipFormatter },
+    series: [{
+      type: "sankey",
+      orient: "horizontal",
+      top: 8,
+      bottom: 8,
+      left: 4,
+      right: 4,
+      nodeWidth: NODE_WIDTH,
+      nodeGap: NODE_GAP,
+      nodeAlign: "justify",
+      draggable: false,
+      layoutIterations: 32,
+      label: {
+        color: paint(tokens, "ink-2"),
+        fontSize: TICK_FONT_SIZE,
+        position: "right",
+        distance: LABEL_GAP,
+        textBorderColor: paint(tokens, "surface"),
+        textBorderWidth: 2
+      },
+      itemStyle: { borderWidth: 0 },
+      lineStyle: { color: "source", opacity: LINK_ALPHA, curveness: 0.5 },
+      emphasis: { focus: "adjacency", lineStyle: { opacity: LINK_HOVER_ALPHA } },
+      blur: { itemStyle: { opacity: 0.4 }, lineStyle: { opacity: 0.1 } },
+      data: nodes.map((node) => {
+        const column = columns.get(node.id) ?? 0;
+        return {
+          name: node.id,
+          depth: column,
+          itemStyle: { color: toneOf(node) },
+          label: {
+            formatter: () => node.label,
+            position: column === lastColumn ? "left" : "right"
+          }
+        };
+      }),
+      links: links.map((link) => ({ source: link.source, target: link.target, value: link.value }))
+    }]
+  };
+}
+
+// src/engine/ScatterChart/ScatterChart.option.ts
+var DOT_SIZE = 10;
+var HIT_SIZE = 24;
+var DOT_OPACITY = 0.7;
+var DOTS_SERIES = "points";
+var HIT_SERIES = "points-hit";
+function buildOption13(props, tokens) {
+  const format = props.valueFormat ?? formatCompact;
+  const xFormat = props.xFormat ?? formatDay;
+  const dot = paint(tokens, "series-1");
+  const data = props.points.map((point) => [point.x.getTime(), point.y]);
+  const dots = {
+    type: "scatter",
+    id: DOTS_SERIES,
+    name: props.pointsLabel,
+    symbolSize: DOT_SIZE,
+    silent: true,
+    itemStyle: { color: dot, opacity: DOT_OPACITY, borderColor: paint(tokens, "surface"), borderWidth: 2 },
+    emphasis: { scale: 1.2, itemStyle: { opacity: 1 } },
+    data,
+    z: 3
+  };
+  const hits = {
+    type: "scatter",
+    id: HIT_SERIES,
+    name: props.pointsLabel,
+    symbolSize: HIT_SIZE,
+    itemStyle: { opacity: 0 },
+    emphasis: { disabled: true },
+    data,
+    z: 6
+  };
+  const trend = props.trend ? [{
+    type: "line",
+    id: "trend",
+    name: props.trendLabel ?? "trend",
+    silent: true,
+    showSymbol: false,
+    symbol: "none",
+    lineStyle: { color: paint(tokens, "series-2"), width: 2, cap: "round", join: "round" },
+    data: props.trend.map((point) => [point.x.getTime(), point.y]),
+    z: 5
+  }] : [];
+  const tooltipFormatter = (params) => {
+    const index = firstParam(params)?.dataIndex ?? 0;
+    const point = props.points[index];
+    if (!point)
+      return tooltipNode(undefined, []);
+    return tooltipNode(point.label, [
+      { value: format(point.y), label: props.yLabel, colour: dot, key: "dot" },
+      { value: xFormat(point.x), label: "day" }
+    ]);
+  };
+  return {
+    grid: plotGrid({ right: 12 }),
+    xAxis: timeAxis(tokens, xFormat),
+    yAxis: valueAxis(tokens, format, { min: 0 }),
+    tooltip: { ...tooltipChrome("item"), formatter: tooltipFormatter },
+    series: [...trend, dots, hits]
+  };
+}
+
+// src/engine/Sunburst/Sunburst.option.ts
+var INNER_RING = [0.25, 0.55];
+var OUTER_RING = [0.57, 0.9];
+var LABEL_PADDING = 4;
+var LABEL_HEIGHT = TICK_FONT_SIZE * 1.2 + 2;
+var LABEL_MIN_ANGLE_FLOOR = 3;
+var DEGREES_PER_RADIAN = 180 / Math.PI;
+function labelMinAngle(inner, viewRadius) {
+  const innerRadius = inner * viewRadius;
+  if (innerRadius <= 0)
+    return LABEL_MIN_ANGLE_FLOOR;
+  return Math.max(LABEL_MIN_ANGLE_FLOOR, LABEL_HEIGHT / innerRadius * DEGREES_PER_RADIAN);
+}
+var PATH_SEPARATOR = " › ";
+function pathsById(nodes, above = []) {
+  return new Map(nodes.flatMap((node) => {
+    const path = [...above, node.id];
+    return [[node.id, path], ...pathsById(node.children ?? [], path)];
+  }));
+}
+function treePathOf(item) {
+  if (typeof item !== "object" || item === null || !("treePathInfo" in item) || !Array.isArray(item.treePathInfo))
+    return [];
+  return item.treePathInfo.filter((step) => typeof step === "object" && step !== null && ("name" in step));
+}
+var percent = (share) => `${Math.round(share * 1e4) / 100}%`;
+function buildOption14(props, tokens, width = 0, measuredHeight = 0) {
+  const { nodes, groupTones = {}, unit, onNodeClick } = props;
+  const format = props.valueFormat ?? formatCompact;
+  const surface = paint(tokens, "surface");
+  const fillOf = (node) => paint(tokens, node.tone ?? (node.group === undefined ? undefined : groupTones[node.group]) ?? "neutral");
+  const toItem = (node) => {
+    const fill = fillOf(node);
+    return {
+      id: node.id,
+      name: node.label,
+      value: node.children && node.children.length > 0 ? undefined : node.value,
+      itemStyle: { color: fill },
+      label: { color: readableOn(tokens, fill) },
+      children: node.children?.map(toItem)
+    };
+  };
+  const tooltipFormatter = (params) => {
+    const item = firstParam(params);
+    const steps = treePathOf(item);
+    const path = steps.slice(1);
+    const value = Number(item?.value ?? 0);
+    const parentValue = Number(steps.at(-2)?.value ?? 0);
+    const colour = typeof item?.color === "string" ? item.color : undefined;
+    return tooltipNode(path.map((step) => step.name).join(PATH_SEPARATOR), [
+      { value: `${format(value)} ${unit}`, label: "", colour, key: "dot" },
+      { value: formatPercent(parentValue === 0 ? 0 : value / parentValue), label: path.length > 1 ? `of ${path.at(-2)?.name ?? ""}` : "of the total" }
+    ]);
+  };
+  const height = plotHeightOf(props.height, measuredHeight);
+  const viewRadius = Math.min(width > 0 ? width : height, height) / 2;
+  const ring = ([inner, outer]) => ({
+    radius: [percent(inner), percent(outer)],
+    label: {
+      rotate: "radial",
+      fontSize: TICK_FONT_SIZE,
+      minAngle: labelMinAngle(inner, viewRadius),
+      width: Math.max(0, (outer - inner) * viewRadius - 2 * LABEL_PADDING),
+      overflow: "truncate"
+    }
+  });
+  return {
+    tooltip: { ...tooltipChrome("item"), formatter: tooltipFormatter },
+    series: [{
+      type: "sunburst",
+      center: ["50%", "50%"],
+      nodeClick: false,
+      cursor: onNodeClick ? "pointer" : "default",
+      sort: (a, b) => a.dataIndex - b.dataIndex,
+      itemStyle: { borderColor: surface, borderWidth: 2 },
+      emphasis: { focus: "ancestor" },
+      blur: { itemStyle: { opacity: BLUR_OPACITY } },
+      levels: [
+        {},
+        ring(INNER_RING),
+        ring(OUTER_RING)
+      ],
+      data: nodes.map(toItem)
+    }]
+  };
+}
+
+// src/engine/Treemap/Treemap.option.ts
+import { format as echartsFormat2 } from "echarts/core";
+var NODE_ALPHA = 0.85;
+var LABEL_FONT_SIZE2 = 12;
+var LABEL_LINE_HEIGHT2 = 16;
+var LABEL_PADDING2 = 6;
+var OFF_CANVAS = -1e4;
+function hideUnfitLabel(fontFamily) {
+  return (params) => {
+    const textWidth = echartsFormat2.getTextRect(params.text, `${LABEL_FONT_SIZE2}px ${fontFamily}`).width;
+    const fitsWidth = textWidth + 2 * LABEL_PADDING2 <= params.rect.width;
+    const fitsHeight = LABEL_LINE_HEIGHT2 + 2 * LABEL_PADDING2 <= params.rect.height;
+    return fitsWidth && fitsHeight ? {} : { x: OFF_CANVAS, y: OFF_CANVAS };
+  };
+}
+function buildOption15(props, tokens) {
+  const { nodes, groupTones, unit } = props;
+  const format = props.valueFormat ?? formatCompact;
+  const surface = paint(tokens, "surface");
+  const fontFamily = readFontFamily();
+  const fillOf = (group) => paint(tokens, groupTones[group] ?? "neutral");
+  const tooltipFormatter = (params) => {
+    const item = firstParam(params);
+    const data = item?.data;
+    const id = typeof data === "object" && data !== null && "id" in data ? String(data.id) : undefined;
+    const match = nodes.find((entry) => entry.id === id) ?? nodes.find((entry) => entry.label === item?.name);
+    if (!match)
+      return tooltipNode(undefined, []);
+    return tooltipNode(match.label, [
+      { value: `${format(match.value)} ${unit}`, label: match.group, colour: fillOf(match.group), key: "dot" }
+    ]);
+  };
+  return {
+    tooltip: { ...tooltipChrome("item"), formatter: tooltipFormatter },
+    series: [{
+      type: "treemap",
+      top: 0,
+      right: 0,
+      bottom: 0,
+      left: 0,
+      roam: false,
+      nodeClick: false,
+      breadcrumb: { show: false },
+      leafDepth: 1,
+      itemStyle: { borderColor: surface, borderWidth: 0, gapWidth: 2 },
+      levels: [{ itemStyle: { borderColor: surface, borderWidth: 0, gapWidth: 2 } }],
+      label: {
+        show: true,
+        position: "insideTopLeft",
+        padding: LABEL_PADDING2,
+        fontSize: LABEL_FONT_SIZE2,
+        lineHeight: LABEL_LINE_HEIGHT2,
+        formatter: (params) => params.name
+      },
+      labelLayout: hideUnfitLabel(fontFamily),
+      emphasis: { focus: "self", itemStyle: { borderColor: surface } },
+      blur: { itemStyle: { opacity: 0.85 } },
+      data: nodes.map((node) => {
+        const fill = withAlpha(fillOf(node.group), NODE_ALPHA);
+        return {
+          id: node.id,
+          name: node.label,
+          value: node.value,
+          itemStyle: { color: fill },
+          label: { color: readableOn(tokens, fillOf(node.group)) }
+        };
+      })
+    }]
+  };
+}
+
+// src/seam/format.schema.ts
+import { z } from "zod";
+var MAX_DIGITS = 20;
+var digits = z.number().int().min(0).max(MAX_DIGITS).optional();
+var currency = z.string().regex(/^[A-Za-z]{3}$/, "a currency is a three-letter ISO 4217 code");
+function isLocale(tag) {
+  try {
+    return Intl.getCanonicalLocales(tag).length === 1;
+  } catch {
+    return false;
+  }
+}
+var valueFormatSchema = z.discriminatedUnion("kind", [
+  z.object({ kind: z.literal("raw"), digits }),
+  z.object({ kind: z.literal("number"), digits, grouping: z.boolean().optional() }),
+  z.object({ kind: z.literal("compact") }),
+  z.object({ kind: z.literal("percent"), digits, of: z.enum(PERCENT_BASES).optional(), signed: z.boolean().optional() }),
+  z.object({ kind: z.literal("money"), currency: currency.optional(), digits, compact: z.boolean().optional() }),
+  z.object({ kind: z.literal("unit"), unit: z.string().min(1), position: z.enum(UNIT_POSITIONS).optional() }),
+  z.object({ kind: z.literal("duration"), from: z.enum(DURATION_UNITS) }),
+  z.object({ kind: z.literal("elapsed"), from: z.enum(DURATION_UNITS) }),
+  z.object({ kind: z.literal("date"), pattern: z.enum(DATE_PATTERNS) }),
+  z.object({ kind: z.literal("relative") }),
+  z.object({ kind: z.literal("custom"), id: z.string().min(1) })
+]);
+var formatContextSchema = z.object({
+  locale: z.string().refine(isLocale, "a locale is a BCP 47 tag Intl accepts").optional(),
+  currency: currency.optional(),
+  timeZone: z.literal("UTC").optional(),
+  customFormatters: z.record(z.string(), z.custom((value) => typeof value === "function", "a custom formatter is a function")).optional(),
+  now: z.number().optional()
+});
+
+export { chartTone, ALL_TONES, SEQUENTIAL_STEPS, CHROME_ROLES, toneVar, readTokens, tokensFrom, DEFAULT_CHART_HEIGHT, plotHeightOf, DEFAULT_HEIGHT, finishOption, chartRootVariants, chartFrameVariants, formatCompact, formatPercent, formatMinutes, formatDay, formatWeek, formatElapsed, formatRelative, VALUE_FORMAT_KINDS, DATE_PATTERNS, DURATION_UNITS, PERCENT_BASES, UNIT_POSITIONS, DEFAULT_FORMAT_CONTEXT, resolveFormatContext, formatDate, formatterFor, formatMeasured, buildOption, buildOption2 as buildOption1, buildOption3 as buildOption2, buildOption4 as buildOption3, buildOption5 as buildOption4, buildOption6 as buildOption5, buildOption7 as buildOption6, buildOption8 as buildOption7, nodeIdOf, buildOption9 as buildOption8, buildOption10 as buildOption9, buildOption11 as buildOption10, buildOption12 as buildOption11, DOTS_SERIES, HIT_SERIES, buildOption13 as buildOption12, pathsById, buildOption14 as buildOption13, buildOption15 as buildOption14, valueFormatSchema, formatContextSchema };