@open-tomato/charts 0.0.0-stage → 0.1.0

package/dist/engine/chrome.d.ts

@@ -0,0 +1,90 @@
+/**
+ * The chrome every primitive shares: the plot grid, the axes, the reference
+ * line and the hover readout. Each is a pure function of the resolved tokens.
+ */
+import type { TooltipComponentFormatterCallbackParams, XAXisComponentOption, YAXisComponentOption } from 'echarts';
+import type { GridComponentOption, MarkLineComponentOption, TooltipComponentOption } from 'echarts/components';
+import { type ResolvedTokens } from './core.js';
+import { type TooltipKeyShape } from './shared.variants.js';
+/** The params an ECharts tooltip formatter receives. */
+export type TooltipParams = TooltipComponentFormatterCallbackParams;
+/** An axis that fits either side of the plot. */
+export type PlotAxis = XAXisComponentOption & YAXisComponentOption;
+/** Room around the plot rect, in px; each side defaults to a small gutter. */
+export interface PlotRoom {
+    readonly top?: number;
+    readonly right?: number;
+    readonly bottom?: number;
+    readonly left?: number;
+}
+/** The plot rect, shrunk so axis labels stay inside the canvas. */
+export declare function plotGrid(room?: PlotRoom): GridComponentOption;
+/** Bounds of a value axis; `max` may be a function of the data extent. */
+export interface ValueBounds {
+    readonly min?: number;
+    readonly max?: number | ((extent: {
+        max: number;
+    }) => number);
+}
+/** The value axis: hairline solid grid in `grid`, no axis line, compact ticks in `muted`. */
+export declare function valueAxis(tokens: ResolvedTokens, format: (value: number) => string, bounds?: ValueBounds): PlotAxis;
+/** Options of a category axis. */
+export interface CategoryExtra {
+    readonly interval?: number;
+    readonly inverse?: boolean;
+    readonly showLine?: boolean;
+    /** false hides the tick labels (a band axis whose edges a second axis labels). */
+    readonly showLabels?: boolean;
+    /** false puts the ticks on the band edges instead of between them. */
+    readonly boundaryGap?: boolean;
+    readonly position?: 'top' | 'bottom';
+}
+export declare function categoryAxis(tokens: ResolvedTokens, data: readonly string[], extra?: CategoryExtra): PlotAxis;
+/** The tick step a time axis may be pinned to; the axis picks its own otherwise. */
+export type TimeStep = 'week';
+/** How a time axis's ticks are pinned: the step and the span of the data, in epoch ms. */
+export interface TimeTicks {
+    readonly step: TimeStep;
+    readonly from: number;
+    readonly to: number;
+}
+/** The Monday 00:00 UTC on or before the epoch `ms`. */
+export declare function startOfWeekUtc(ms: number): number;
+/** Every Monday 00:00 UTC from the week of `from` to `to`, inclusive. */
+export declare function weekStartsUtc(from: number, to: number): number[];
+/**
+ * A time axis: the axis line in `baseline`, labels through `xFormat`,
+ * spread so they never overlap. With `ticks` of step `week` the axis
+ * starts on the Monday of its first point and its labels sit on the
+ * Mondays of the span (ECharts' `customValues`), so a weekly label
+ * ("w/c 3 Nov") lands on a week's first day rather than wherever the
+ * time scale's own interval falls.
+ */
+export declare function timeAxis(tokens: ResolvedTokens, xFormat: (date: Date) => string, ticks?: TimeTicks): PlotAxis;
+/** A reference line (baseline, limit, target): 1px `ink-2`, its label in `ink-2` at the end. */
+export declare function referenceLine(tokens: ResolvedTokens, axis: 'xAxis' | 'yAxis', value: number, label: string, labelAt?: 'start' | 'end'): MarkLineComponentOption;
+/** Room on the right of the plot for a horizontal reference line's end label. */
+export declare function referenceLabelRoom(label: string): number;
+/**
+ * The ECharts tooltip container made invisible: the readout itself is the
+ * element the formatter returns, built from text nodes.
+ */
+export declare function tooltipChrome(trigger: 'item' | 'axis'): TooltipComponentOption;
+/** The axis tooltip's crosshair: a vertical hairline in `grid`. */
+export declare function crosshair(tokens: ResolvedTokens): TooltipComponentOption['axisPointer'];
+/** One row of the hover readout. */
+export interface TooltipRow {
+    readonly value: string;
+    readonly label: string;
+    /** The key's colour; omitted for a plain row. */
+    readonly colour?: string;
+    readonly key?: TooltipKeyShape;
+}
+/** The hover readout: an optional heading in `ink-2`, then rows of value (strong, `ink`) and label (`ink-2`). */
+export declare function tooltipNode(heading: string | undefined, rows: readonly TooltipRow[]): HTMLElement;
+/** The first hovered item, whether ECharts passed one or a list. */
+export declare function firstParam(params: TooltipParams): ReturnType<typeof paramList>[number] | undefined;
+/** Every hovered item as a list. */
+export declare function paramList(params: TooltipParams): Exclude<TooltipParams, unknown[]>[];
+/** The numeric value of a `[x, y]` or plain data value. */
+export declare function numericAt(value: unknown, index: number): number;

package/dist/engine/core.d.ts

@@ -0,0 +1,58 @@
+/**
+ * The engine's core, with no React and no DOM: the tree-shaken registration
+ * of the series and components every primitive uses, the option type, and
+ * the colour bridge (tokens resolved to colour strings). The React adapter
+ * (`shared.tsx`) adds the canvas renderer and the chart root; the headless
+ * engine (`headless/`) adds the SVG renderer.
+ *
+ * ECharts cannot read CSS variables, so every option is a pure function
+ * `(props, tokens) => option` over concrete colour strings.
+ */
+import type { ResolvedTokens } from '../seam/tones.js';
+import type { ChartTone } from '../seam/types.js';
+import { type BarSeriesOption, type BoxplotSeriesOption, type CustomSeriesOption, type GaugeSeriesOption, type GraphSeriesOption, type HeatmapSeriesOption, type LineSeriesOption, type PieSeriesOption, type RadarSeriesOption, type SankeySeriesOption, type ScatterSeriesOption, type SunburstSeriesOption, type TreemapSeriesOption } from 'echarts/charts';
+import { type DataZoomComponentOption, type GraphicComponentOption, type GridComponentOption, type MarkLineComponentOption, type RadarComponentOption, type TooltipComponentOption, type VisualMapComponentOption } from 'echarts/components';
+import { type ComposeOption } from 'echarts/core';
+/** The option shape of exactly the modules registered above. */
+export type ChartOption = ComposeOption<BarSeriesOption | BoxplotSeriesOption | CustomSeriesOption | GaugeSeriesOption | GraphSeriesOption | HeatmapSeriesOption | LineSeriesOption | PieSeriesOption | RadarSeriesOption | SankeySeriesOption | ScatterSeriesOption | SunburstSeriesOption | TreemapSeriesOption | DataZoomComponentOption | GraphicComponentOption | GridComponentOption | MarkLineComponentOption | RadarComponentOption | TooltipComponentOption | VisualMapComponentOption>;
+export type { ResolvedTokens };
+/** Plot height in px when a chart is given none (the seam's `DEFAULT_CHART_HEIGHT`). */
+export declare const DEFAULT_HEIGHT: number;
+/** Bars and columns never grow thicker than this. */
+export declare const BAR_MAX_WIDTH = 24;
+/** Data-end corner radius of bars and columns. */
+export declare const BAR_RADIUS = 4;
+/** What the other marks fade to while one is hovered. */
+export declare const BLUR_OPACITY = 0.85;
+export declare const TICK_FONT_SIZE = 11;
+/** Hover lift for marks: the hovered one stays, the others fade slightly. */
+export interface MarkHover {
+    readonly emphasis: {
+        readonly focus: 'self';
+    };
+    readonly blur: {
+        readonly itemStyle: {
+            readonly opacity: number;
+        };
+    };
+}
+export declare const markHover: MarkHover;
+/** A tone's colour, or a chrome token's, as a concrete string. */
+export declare function paint(tokens: ResolvedTokens, toneOrToken: ChartTone | string): string;
+/** The same colour at an alpha, for fills the canvas cannot wash with `opacity`. */
+export declare function withAlpha(colour: string, alpha: number): string;
+/** The colour `share` of the way from `from` to `to` (0 is `from`, 1 is `to`). */
+export declare function mix(from: string, to: string, share: number): string;
+/** Whichever of `ink` and `surface` reads better on `background`, by luminance. */
+export declare function readableOn(tokens: ResolvedTokens, background: string): string;
+/** The font stack when the page names none, or there is no page (the headless engine). */
+export declare const FALLBACK_FONT_FAMILY = "sans-serif";
+/** The page font stack from `--font-sans`, for canvas text and text measuring; the fallback with no DOM. */
+export declare function readFontFamily(): string;
+/**
+ * Lays the options every chart shares under a primitive's own: UTC time
+ * axes, so ECharts places a tick at midnight UTC where `formatDay` labels
+ * it; the mount animation (on unless `animate` is false); and the page
+ * font on canvas text.
+ */
+export declare function finishOption(option: ChartOption, animate: boolean | undefined): ChartOption;

package/dist/engine/echartsEngine.d.ts

@@ -0,0 +1,3 @@
+import type { ChartPrimitives } from '../seam/types.js';
+/** Apache ECharts 6, tree-shaken, painted on canvas from the resolved tokens. */
+export declare const echartsEngine: ChartPrimitives;

package/dist/engine/fixtures.d.ts

@@ -0,0 +1,61 @@
+/**
+ * Fixed data for the engine's stories and tests: small, seeded, no clock.
+ * Every date derives from {@link LAST_DAY}, so a story draws the same picture
+ * on every run.
+ */
+import type { ChartOption } from './core.js';
+import type { BarSeries, BoxGroup, DonutSlice, GraphLink, GraphNode, HistogramBin, LineSeries, RadarAxis, RadarPole, RadarSeries, RoseSlice, ScatterPoint, SunburstNode, TimePoint, TreemapNode, ChartTone } from '../seam/types.js';
+import { type ResolvedTokens } from '../seam/tones.js';
+/** A seeded stream of numbers in [0, 1): the same seed gives the same stream. */
+export declare function seeded(seed: number): () => number;
+/** A value between `min` and `max` from a seeded stream. */
+export declare function between(random: () => number, min: number, max: number): number;
+/** The last day of every time series. */
+export declare const LAST_DAY: Date;
+/** Twenty-eight days ending on {@link LAST_DAY}. */
+export declare const DAY_DATES: readonly Date[];
+/** One fixed, distinct colour per token name, so a test can tell which token a mark was painted with. */
+export declare const FIXED_TOKENS: ResolvedTokens;
+/** A series as a test reads it: the fields are checked one by one, so they stay loose. */
+export interface SeriesReading {
+    readonly id?: string;
+    readonly type?: string;
+    readonly name?: string;
+    readonly data?: readonly unknown[];
+    readonly [field: string]: unknown;
+}
+/** The option's series as a list, whether it holds one or many. */
+export declare function seriesOf(option: ChartOption): readonly SeriesReading[];
+export declare const BAR_CATEGORIES: readonly string[];
+export declare const BAR_SERIES: readonly BarSeries[];
+export declare const LINE_SERIES: readonly LineSeries[];
+/** One series, for the area variant. */
+export declare const AREA_SERIES: readonly LineSeries[];
+export declare const SCATTER_POINTS: readonly ScatterPoint[];
+/** A three-point moving average of the scatter points. */
+export declare const SCATTER_TREND: readonly TimePoint[];
+export declare const HISTOGRAM_BINS: readonly HistogramBin[];
+export declare const BOX_GROUPS: readonly BoxGroup[];
+export declare const DONUT_SLICES: readonly DonutSlice[];
+/** The previous period, same ids and tones. */
+export declare const DONUT_PREVIOUS: readonly DonutSlice[];
+export declare const TREEMAP_NODES: readonly TreemapNode[];
+export declare const TREEMAP_TONES: Readonly<Record<string, ChartTone>>;
+export declare const HEAT_ROWS: readonly string[];
+export declare const HEAT_COLS: readonly string[];
+/** Halts per weekday and week: busy weekdays, quiet weekends. */
+export declare const HEAT_CELLS: readonly (readonly number[])[];
+/** The layers of a small workspace, left to right. */
+export declare const LAYER_ORDER: readonly string[];
+export declare const LAYER_TONES: Readonly<Record<string, ChartTone>>;
+export declare const GRAPH_NODES: readonly GraphNode[];
+/** Dependency to dependent: the direction code flows. */
+export declare const GRAPH_LINKS: readonly GraphLink[];
+export declare const ROSE_SLICES: readonly RoseSlice[];
+/** Inner ring: the packages; outer ring: what each one is made of. */
+export declare const SUNBURST_NODES: readonly SunburstNode[];
+export declare const SUNBURST_TONES: Readonly<Record<string, ChartTone>>;
+export declare const RADAR_POLES: readonly RadarPole[];
+export declare const RADAR_AXES: readonly RadarAxis[];
+/** This week over its twelve-week median on each axis. */
+export declare const RADAR_SERIES: readonly RadarSeries[];

package/dist/engine/headless/headless.d.ts

@@ -0,0 +1,86 @@
+/**
+ * The headless engine: every primitive's pure option builder, and
+ * `renderToSvg`, which draws one primitive to an SVG string with ECharts'
+ * server-side mode. No React and no DOM, so a CLI, a server or a test can
+ * draw a chart: it registers the SVG renderer over the same `echarts/core`
+ * registration the React adapter uses (`../core.ts`).
+ *
+ * A headless caller has no CSS variables to read, so it passes a full
+ * `ResolvedTokens` map, which `tokensFrom` builds from the token values.
+ */
+import type { BarChartProps, BoxPlotProps, BulletProps, DonutProps, GaugeProps, HeatmapGridProps, HistogramProps, LineChartProps, NightingaleProps, RadarProps, ScatterChartProps, SunburstProps, TreemapProps } from '../../seam/types.js';
+import type { NetworkOptionProps } from '../NetworkGraph/NetworkGraph.option.js';
+import type { SankeyOptionProps } from '../Sankey/Sankey.option.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+export { finishOption } from '../core.js';
+export type { ChartOption, ResolvedTokens } from '../core.js';
+export { tokensFrom } from '../../seam/tones.js';
+export { buildOption as buildBarChartOption } from '../BarChart/BarChart.option.js';
+export { buildOption as buildBoxPlotOption } from '../BoxPlot/BoxPlot.option.js';
+export { buildOption as buildBulletOption } from '../Bullet/Bullet.option.js';
+export { buildOption as buildDonutOption } from '../Donut/Donut.option.js';
+export { buildOption as buildGaugeOption } from '../Gauge/Gauge.option.js';
+export { buildOption as buildHeatmapGridOption } from '../HeatmapGrid/HeatmapGrid.option.js';
+export { buildOption as buildHistogramOption } from '../Histogram/Histogram.option.js';
+export { buildOption as buildLineChartOption } from '../LineChart/LineChart.option.js';
+export { buildOption as buildNetworkGraphOption } from '../NetworkGraph/NetworkGraph.option.js';
+export type { NetworkOptionProps } from '../NetworkGraph/NetworkGraph.option.js';
+export { buildOption as buildNightingaleOption } from '../Nightingale/Nightingale.option.js';
+export { buildOption as buildRadarOption } from '../Radar/Radar.option.js';
+export { buildOption as buildSankeyOption } from '../Sankey/Sankey.option.js';
+export type { SankeyOptionProps } from '../Sankey/Sankey.option.js';
+export { buildOption as buildScatterChartOption } from '../ScatterChart/ScatterChart.option.js';
+export { buildOption as buildSunburstOption } from '../Sunburst/Sunburst.option.js';
+export { buildOption as buildTreemapOption } from '../Treemap/Treemap.option.js';
+export type { TokenName } from '../../theme/index.js';
+export * from '../../seam/format.js';
+export * from '../../seam/format.schema.js';
+/** One builder per primitive: props and tokens in, the ECharts option out. */
+export interface OptionBuilders {
+    readonly BarChart: (props: BarChartProps, tokens: ResolvedTokens) => ChartOption;
+    readonly BoxPlot: (props: BoxPlotProps, tokens: ResolvedTokens) => ChartOption;
+    readonly Bullet: (props: BulletProps, tokens: ResolvedTokens) => ChartOption;
+    readonly Donut: (props: DonutProps, tokens: ResolvedTokens) => ChartOption;
+    readonly Gauge: (props: GaugeProps, tokens: ResolvedTokens) => ChartOption;
+    readonly HeatmapGrid: (props: HeatmapGridProps, tokens: ResolvedTokens) => ChartOption;
+    readonly Histogram: (props: HistogramProps, tokens: ResolvedTokens) => ChartOption;
+    readonly LineChart: (props: LineChartProps, tokens: ResolvedTokens) => ChartOption;
+    readonly NetworkGraph: (props: NetworkOptionProps, tokens: ResolvedTokens) => ChartOption;
+    readonly Nightingale: (props: NightingaleProps, tokens: ResolvedTokens) => ChartOption;
+    readonly Radar: (props: RadarProps, tokens: ResolvedTokens) => ChartOption;
+    readonly Sankey: (props: SankeyOptionProps, tokens: ResolvedTokens) => ChartOption;
+    readonly ScatterChart: (props: ScatterChartProps, tokens: ResolvedTokens) => ChartOption;
+    /** `width` sizes the radial labels; `renderToSvg` passes the drawing's width. */
+    readonly Sunburst: (props: SunburstProps, tokens: ResolvedTokens, width?: number, measuredHeight?: number) => ChartOption;
+    readonly Treemap: (props: TreemapProps, tokens: ResolvedTokens) => ChartOption;
+}
+/** The fifteen builders, by primitive name. */
+export declare const OPTION_BUILDERS: OptionBuilders;
+/** A primitive's name, as `ChartPrimitives` and the React engine spell it. */
+export type PrimitiveName = keyof OptionBuilders;
+/** The props a primitive's builder reads. */
+export type PrimitiveOptionProps<K extends PrimitiveName> = Parameters<OptionBuilders[K]>[0];
+/** The size of the drawing, and what it may override. */
+export interface SvgRenderOptions {
+    /** The drawing's width in px. */
+    readonly width: number;
+    /** The drawing's height in px. */
+    readonly height: number;
+    /** The font stack for every text; `sans-serif` when absent, as there is no page to read it from. */
+    readonly fontFamily?: string;
+    /**
+     * The prefix of the ids and classes inside the SVG. Two SVGs inlined in one
+     * page need different prefixes; absent, it is a hash of the drawing, so the
+     * same input gives the same string and two different drawings do not clash.
+     */
+    readonly idPrefix?: string;
+}
+/**
+ * Draws one primitive to an SVG string with ECharts' server-side renderer:
+ * the builder's option over `tokens`, finished as the React adapter
+ * finishes it but with animation off, set on an instance with no DOM, then
+ * disposed. The same input gives the same string. A chart whose `height`
+ * is `'fill'` fills the drawing: the builders that size a layout from the
+ * height (Sunburst) read the drawing's height as the measured one.
+ */
+export declare function renderToSvg<K extends PrimitiveName>(primitive: K, props: PrimitiveOptionProps<K>, tokens: ResolvedTokens, options: SvgRenderOptions): string;

package/dist/engine/headless/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * `@open-tomato/charts/engine`: the headless engine. Every primitive's pure
+ * option builder, `renderToSvg` over ECharts' server-side SVG renderer, the
+ * token map they read, and the value format spec with its zod schemas. No
+ * React and no DOM.
+ *
+ * Only `export *` here: bun drops an entry's named re-exports when the
+ * package is `sideEffects: false`, so `headless.ts` holds the list.
+ */
+export * from './headless.js';

package/dist/engine/headless/index.js

@@ -0,0 +1,142 @@
+import {
+  DATE_PATTERNS,
+  DEFAULT_FORMAT_CONTEXT,
+  DURATION_UNITS,
+  PERCENT_BASES,
+  UNIT_POSITIONS,
+  VALUE_FORMAT_KINDS,
+  buildOption,
+  buildOption1 as buildOption2,
+  buildOption10 as buildOption11,
+  buildOption11 as buildOption12,
+  buildOption12 as buildOption13,
+  buildOption13 as buildOption14,
+  buildOption14 as buildOption15,
+  buildOption2 as buildOption3,
+  buildOption3 as buildOption4,
+  buildOption4 as buildOption5,
+  buildOption5 as buildOption6,
+  buildOption6 as buildOption7,
+  buildOption7 as buildOption8,
+  buildOption8 as buildOption9,
+  buildOption9 as buildOption10,
+  finishOption,
+  formatCompact,
+  formatContextSchema,
+  formatDate,
+  formatDay,
+  formatElapsed,
+  formatMeasured,
+  formatMinutes,
+  formatPercent,
+  formatRelative,
+  formatWeek,
+  formatterFor,
+  resolveFormatContext,
+  tokensFrom,
+  valueFormatSchema
+} from "../../index-4bxmxw89.js";
+import"../../index-85mb21rn.js";
+
+// src/engine/headless/headless.ts
+import * as echarts from "echarts/core";
+import { SVGRenderer } from "echarts/renderers";
+echarts.use([SVGRenderer]);
+var OPTION_BUILDERS = {
+  BarChart: buildOption,
+  BoxPlot: buildOption2,
+  Bullet: buildOption3,
+  Donut: buildOption4,
+  Gauge: buildOption5,
+  HeatmapGrid: buildOption6,
+  Histogram: buildOption7,
+  LineChart: buildOption8,
+  NetworkGraph: buildOption9,
+  Nightingale: buildOption10,
+  Radar: buildOption11,
+  Sankey: buildOption12,
+  ScatterChart: buildOption13,
+  Sunburst: buildOption14,
+  Treemap: buildOption15
+};
+var INSTANCE_ID = /zr\d+-(?=[a-z]+-?\d)/g;
+var PLACEHOLDER_ID = /zr-(?=[a-z]+-?\d)/g;
+var STYLE_CLASS = /zr\d+-cls-(\d+)/g;
+var FNV_OFFSET = 2166136261;
+var FNV_PRIME = 16777619;
+var HEX = 16;
+function hashOf(text) {
+  let hash = FNV_OFFSET;
+  for (let index = 0;index < text.length; index += 1) {
+    hash ^= text.charCodeAt(index);
+    hash = Math.imul(hash, FNV_PRIME) >>> 0;
+  }
+  return hash.toString(HEX).padStart(8, "0");
+}
+function stableIds(svg, prefix) {
+  const classes = new Map;
+  const renumbered = svg.replace(STYLE_CLASS, (_match, number) => {
+    const index = classes.get(number) ?? classes.size;
+    classes.set(number, index);
+    return `zr-cls-${index}`;
+  }).replace(INSTANCE_ID, "zr-");
+  const stable = prefix ?? `c${hashOf(renumbered)}`;
+  return renumbered.replace(PLACEHOLDER_ID, `${stable}-`);
+}
+function renderToSvg(primitive, props, tokens, options) {
+  const { width, height, fontFamily, idPrefix } = options;
+  const build = OPTION_BUILDERS[primitive];
+  const finished = finishOption(build(props, tokens, width, height), false);
+  const option = {
+    ...finished,
+    animation: false,
+    textStyle: fontFamily === undefined ? finished.textStyle : { fontFamily }
+  };
+  const chart = echarts.init(null, null, { renderer: "svg", ssr: true, width, height });
+  try {
+    chart.setOption(option);
+    return stableIds(chart.renderToSVGString(), idPrefix);
+  } finally {
+    chart.dispose();
+  }
+}
+export {
+  valueFormatSchema,
+  tokensFrom,
+  resolveFormatContext,
+  renderToSvg,
+  formatterFor,
+  formatWeek,
+  formatRelative,
+  formatPercent,
+  formatMinutes,
+  formatMeasured,
+  formatElapsed,
+  formatDay,
+  formatDate,
+  formatContextSchema,
+  formatCompact,
+  finishOption,
+  buildOption15 as buildTreemapOption,
+  buildOption14 as buildSunburstOption,
+  buildOption13 as buildScatterChartOption,
+  buildOption12 as buildSankeyOption,
+  buildOption11 as buildRadarOption,
+  buildOption10 as buildNightingaleOption,
+  buildOption9 as buildNetworkGraphOption,
+  buildOption8 as buildLineChartOption,
+  buildOption7 as buildHistogramOption,
+  buildOption6 as buildHeatmapGridOption,
+  buildOption5 as buildGaugeOption,
+  buildOption4 as buildDonutOption,
+  buildOption3 as buildBulletOption,
+  buildOption2 as buildBoxPlotOption,
+  buildOption as buildBarChartOption,
+  VALUE_FORMAT_KINDS,
+  UNIT_POSITIONS,
+  PERCENT_BASES,
+  OPTION_BUILDERS,
+  DURATION_UNITS,
+  DEFAULT_FORMAT_CONTEXT,
+  DATE_PATTERNS
+};

package/dist/engine/index.d.ts

@@ -0,0 +1 @@
+export { echartsEngine } from './echartsEngine.js';

package/dist/engine/shared.d.ts

@@ -0,0 +1,59 @@
+/**
+ * The engine's React adapter: the canvas renderer, the hook that builds a
+ * primitive's option over the live tokens, and the chart root. The option
+ * side (registration, the option type, the colour bridge) is `core.ts`.
+ *
+ * Canvas cannot read CSS variables, so a primitive re-runs its pure
+ * `(props, tokens) => option` when the tokens change (a theme flip) and
+ * `EChart` sets it with `notMerge`, so a flip repaints fully.
+ */
+import type { ChartHeight } from '../seam/height.js';
+import type { ECharts } from 'echarts/core';
+import { type ReactElement } from 'react';
+import { type ChartOption, type ResolvedTokens } from './core.js';
+import { type ChartCursor } from './shared.variants.js';
+/**
+ * The option of one primitive: its pure `build(props, tokens)` over the
+ * resolved tokens, finished with the shared options. Rebuilt when the props
+ * or the tokens (a theme flip) change.
+ */
+export declare function useBuiltOption<P extends {
+    readonly animate?: boolean;
+}>(props: P, build: (props: P, tokens: ResolvedTokens) => ChartOption): ChartOption;
+/** A handler for one ECharts event, bound by name on the instance. */
+export type ChartEventHandler = (event: unknown, instance: ECharts) => void;
+/** The props of {@link EChart}. */
+export interface EChartProps {
+    readonly option: ChartOption;
+    readonly ariaLabel: string;
+    /** Px, or `'fill'` for the container's full height; 220px when absent. */
+    readonly height?: ChartHeight;
+    readonly className?: string;
+    /** `'default'` keeps the arrow over charts whose marks are not buttons. */
+    readonly cursor?: ChartCursor;
+    /** ECharts events by name (`click`, `mouseover`), bound on the instance. */
+    readonly onEvents?: Readonly<Record<string, ChartEventHandler>>;
+    /**
+     * Merge new options into the live chart instead of replacing it, replacing
+     * only these components by id. Interaction state the option does not carry
+     * (a data-zoom window) then survives a re-render. Every colour is explicit
+     * in each option, so a theme flip still repaints fully. Default: replace.
+     */
+    readonly replaceMerge?: readonly string[];
+    /**
+     * Adjusts the option against the live instance just before it is set (for
+     * state the instance holds and the option does not, such as a zoom window).
+     */
+    readonly transform?: (option: ChartOption, instance: ECharts) => ChartOption;
+}
+/**
+ * The chart root over `echarts/core` directly: init on mount, dispose on
+ * unmount, resize with the host, set each option with `notMerge` unless the
+ * primitive asks for a `replaceMerge`, and bind the events by name.
+ *
+ * The host's height is a pixel count from a prop, which no class can carry,
+ * so it is set on the element in the layout effect, ahead of `init`.
+ * `'fill'` sets `100%`, so the host takes its container's height and the
+ * resize observer below follows the container.
+ */
+export declare function EChart({ option, ariaLabel, height, className, cursor, onEvents, replaceMerge, transform }: EChartProps): ReactElement;

package/dist/engine/shared.variants.d.ts

@@ -0,0 +1,40 @@
+/** Where the chart root's pointer cursor comes from. */
+export type ChartCursor = 'auto' | 'default';
+/** The variant props `chartRootVariants` takes. */
+export interface ChartRootVariantProps {
+    readonly cursor?: ChartCursor | null;
+}
+/**
+ * The element a chart is drawn into: as wide as its container. `cursor:
+ * 'default'` is for charts whose marks are not buttons: zrender puts an
+ * inline pointer cursor on every hoverable mark, and this wins over it.
+ */
+export declare const chartRootVariants: (props?: ChartRootVariantProps) => string;
+/** The variant props `chartFrameVariants` takes. */
+export interface ChartFrameVariantProps {
+    readonly fill?: boolean | null;
+}
+/**
+ * A box a primitive wraps its chart root in (to measure it): no box of
+ * its own unless the chart fills its container, when it passes the
+ * container's height down to the root.
+ */
+export declare const chartFrameVariants: (props?: ChartFrameVariantProps) => string;
+/** The hover readout every chart renders into: surface, hairline ring, small text. */
+export declare const tooltipSurfaceVariants: () => string;
+/** The readout's heading line. */
+export declare const tooltipHeadingVariants: () => string;
+/** One readout row: key, value, label. */
+export declare const tooltipRowVariants: () => string;
+/** A readout row's strong value. */
+export declare const tooltipValueVariants: () => string;
+/** A readout row's label. */
+export declare const tooltipLabelVariants: () => string;
+/** The shape of a readout row's colour key. */
+export type TooltipKeyShape = 'line' | 'dot';
+/** The variant props `tooltipKeyVariants` takes. */
+export interface TooltipKeyVariantProps {
+    readonly shape?: TooltipKeyShape | null;
+}
+/** The colour key in front of a readout row: a short line for line marks, a dot for the rest. */
+export declare const tooltipKeyVariants: (props?: TooltipKeyVariantProps) => string;