@open-tomato/charts 0.0.0-stage → 0.1.1

package/README.md

@@ -1,3 +1,287 @@
-# Temporary Holding Version
+# @open-tomato/charts
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+React 19 charting for the `@open-tomato` scope: a chart-engine seam with
+ECharts 6 behind it, the names of the theme tokens it reads, formatters,
+and a headless engine subpath that draws a chart to SVG with no React and
+no DOM. Other projects consume it on its own; `@open-tomato/atlas-ui`
+builds Atlas's cards on it. The consuming app brings the token values;
+the Atlas demo in the open-tomato/rafa repository is the reference
+consumer.
+
+## Layout
+
+Each layer is a folder under `src/` with a barrel `index.ts`, and
+`src/index.ts` is the root barrel.
+
+| Folder | Holds |
+|---|---|
+| `seam/` | the `ChartPrimitives` types, tones, formatters and the format spec, the engine and format providers |
+| `engine/` | ECharts 6 over `echarts/core`; the only folder importing `echarts` |
+| `engine/headless/` | the `./engine` subpath: option builders and `renderToSvg` |
+| `theme/` | the token names; no values |
+| `lib/` | `cn` |
+
+The engine splits along React. `engine/core.ts` holds the `echarts/core`
+registration of every series and component, the `ChartOption` type and
+the colour bridge, and imports no React. `engine/shared.tsx` is the React
+adapter: it adds the canvas renderer, `useBuiltOption` and the `EChart`
+root. Each primitive gets its own folder, named after it:
+
+```text
+src/engine/LineChart/
+  index.ts                 the primitive's barrel
+  LineChart.tsx            the React component: the option over the live tokens, drawn by EChart
+  LineChart.option.ts      buildOption(props, tokens): pure, no React, no DOM
+  LineChart.stories.tsx    one story per variant value
+  LineChart.test.ts        tests of buildOption
+```
+
+The primitives draw with the shared chart-root and tooltip variants in
+`engine/shared.variants.ts`, so a primitive folder has no variants file of
+its own.
+
+## The headless engine
+
+`@open-tomato/charts/engine` (`src/engine/headless/`) draws with no React
+and no DOM, for a CLI, a server or a report. It exports every primitive's
+`buildOption` as `build<Primitive>Option(props, tokens)`, `OPTION_BUILDERS`
+by primitive name, the `ResolvedTokens` type, `tokensFrom`,
+`renderToSvg`, and the format spec with its schemas (`formatterFor`,
+`valueFormatSchema` and the rest of `seam/format.ts` and
+`seam/format.schema.ts`), so a report writes values as a chart does:
+
+```ts
+import { renderToSvg, tokensFrom } from '@open-tomato/charts/engine';
+
+const tokens = tokensFrom(values); // every token name, without `--color-`, to a colour
+const svg = renderToSvg('LineChart', { ariaLabel: 'Tokens per day', series }, tokens, { width: 480, height: 260 });
+```
+
+A headless caller has no CSS variables to read, so it passes a value for
+every token. `renderToSvg` uses ECharts' server-side mode
+(`echarts.init(null, null, { renderer: 'svg', ssr: true, width, height })`,
+`setOption`, `renderToSVGString()`, `dispose()`) over the same
+`echarts/core` registration the React adapter uses, with animation off.
+The same input gives the same string: ECharts numbers ids and classes from
+counters that grow with every instance, so the renderer renumbers them and
+prefixes them with a hash of the drawing, or with `idPrefix` when given.
+Text is measured on a canvas when the process has a page and estimated
+when it has none, so a drawing made under a DOM and one made without can
+differ by a pixel in label room.
+
+## Chart height
+
+Every primitive takes `height` (`ChartHeight`, `number | 'fill'`). A
+number is the plot height in px, 220 (`DEFAULT_CHART_HEIGHT`) when
+absent; the width always follows the container. `'fill'` gives the chart
+root `height: 100%`, so the chart takes the full height of its container
+and its resize observer follows the container from then on. The
+container needs a height of its own: a sized box, or a flex or grid cell
+that is stretched. A maximised card's box is the case it was made for.
+
+```tsx
+<div className="h-[80vmin]">
+  <BarChart ariaLabel="Minutes by agent" categories={categories} series={series} height="fill" />
+</div>
+```
+
+Two builders read the height as a number. Sunburst sizes its radial
+labels from the measured height when it fills, and from 220px until it is
+measured. Bullet cannot know a filling height, so ECharts centres its
+track and text. `renderToSvg` takes an explicit size, so a headless
+`'fill'` fills the drawing. `Engine/BarChart`'s `Fill` story draws one.
+
+## Formatting values
+
+Every primitive takes `valueFormat`, a `(value: number) => string`. A
+`ValueFormat` is the same choice as data, which a spec or a data point can
+carry: `raw`, `number`, `compact`, `percent` (`signed` for "+12%"),
+`money` (`compact` for "$1.2K"), `unit`, `duration` ("1.5 h"), `elapsed`
+("1h 3m 10s"), `date`, `relative` ("2 days ago", against the context's
+`now` or the clock) or `custom`. `formatterFor(format, context)` turns one into the
+function, over a `FormatContext` of locale, currency and custom formatters
+(defaults `en-GB`, `USD`, `UTC`). A `custom` format names a formatter the
+context registers by id, and an id the context lacks throws when the
+formatter is built.
+
+```tsx
+<FormatProvider context={{ locale: 'de-DE', currency: 'EUR' }}>
+  <Chart />
+</FormatProvider>
+
+// inside Chart
+const valueFormat = useFormatter({ kind: 'money', digits: 0 });
+return <LineChart ariaLabel="Spend per day" series={series} valueFormat={valueFormat} />;
+```
+
+- `compact` is `formatCompact` as it was: "1K" and "1.2M", with a capital
+  K in every locale, so a chart with no format and one with `compact`
+  read the same.
+- `formatMeasured({ value, unit, format }, context, specFormat)` writes a
+  value that carries its own unit or format. The point's format wins over
+  the spec's, and the context fills what both leave out. A `unit` follows
+  a bare number (`raw`, `number`, `compact`); the other kinds write their
+  own unit and drop it.
+- `formatElapsed(seconds)` writes a count of seconds as "1h 3m 10s", zero
+  units left out; `formatRelative(value, now, locale)` climbs a ladder
+  from a clock time on the same UTC day through "6 hours ago",
+  "yesterday", "last week" and "2 months ago", mirrored for the future.
+- Dates are UTC everywhere: `formatDay`, `formatWeek`, `formatDate` and
+  the `date` kind read UTC, and every option sets ECharts' `useUTC`, so a
+  time-axis tick sits at midnight UTC where its label names the day.
+- A weekly `xFormat` goes with `xStep: 'week'` on `LineChart`: the axis
+  starts on the Monday of its first point and its labels sit on the
+  Mondays of the span (`axisLabel.customValues`), because the time
+  scale's own interval ignores a forced `interval` and lands "w/c" labels
+  on days that start no week.
+- `valueFormatSchema` and `formatContextSchema` (zod v4) validate a format
+  and a context that arrive as data. A context's `customFormatters` are
+  functions, so they validate in code only.
+
+The `Engine/Formats` stories draw one series under each kind.
+
+## Styles are CVA variants
+
+- Every class a component paints lives in a `*.variants.ts` file, as `cva`
+  calls: `engine/shared.variants.ts` for the chart root and the tooltip,
+  and `chartTone` in `seam/tones.ts` for a tone's colour. The file exports
+  the variant props type, and the component's props extend it.
+- A passthrough `className` prop is for layout context only (margin,
+  alignment, grid placement), never colour or size. It merges last:
+  `cn(chartRootVariants({ cursor }), className)`. `cn` (`src/lib/cn.ts`)
+  is clsx plus tailwind-merge, so the later class wins a conflict.
+- No inline `style`, and no class string written on an element. The lint
+  rule `@open-tomato/cva-only-classname` (in
+  `@open-tomato/eslint-config/cva`) allows a `className` value only as a
+  variants call, a `cn(...)` over variants calls and the passthrough, or
+  the passthrough alone. Stories and tests are exempt.
+- The package compiles with `isolatedDeclarations` (from
+  `@open-tomato/typescript-config`), so an exported `cva` call
+  carries an explicit function type, as `chartRootVariants` does.
+
+## Theming
+
+The package ships token names only: `src/theme/` lists every CSS custom
+property it reads (`--color-series-1` to `-8`, the four status colours,
+surface, plane, ink, ink-2, muted, grid, baseline, ring, the `seq-100` to
+`seq-700` ramp, `diverge-mid`, the six pole colours, `delta-up`). Each is a
+Tailwind v4 colour token, so `--color-series-1` is also `bg-series-1`.
+
+The consuming app defines every name: light values in its Tailwind
+`@theme` block, the dark re-step under `:root[data-theme="dark"]`, and
+`@custom-variant dark` on that attribute. Dark mode is
+`data-theme="dark"` on `<html>`. This package's `.storybook/theme.css`
+and the Atlas demo's `src/styles.css` hold the reference set, and the
+demo's test holds it to the names listed here. The app's stylesheet
+adds `@source` for this package's files so Tailwind generates the
+classes the components use. Canvas cannot read CSS variables, so the
+React engine reads the tokens from the computed style
+(`useResolvedTokens`) and re-reads them on a theme flip.
+
+## Stories
+
+Storybook 10 on `@storybook/react-vite`. Vite is Storybook's own builder
+and appears nowhere else: the package builds with `bun build`.
+`.storybook/preview.ts` imports `.storybook/theme.css`, the token values
+in light and dark, which Tailwind compiles there, so no story imports
+tokens. Its `theme` toolbar global sets `data-theme` on the document.
+
+- A story sits beside its component as `{C}.stories.tsx`.
+- The header is `import type { Meta, StoryObj } from '@storybook/react-vite'`,
+  and the meta ends in `satisfies Meta<typeof C>`.
+- `title` is `Engine/<Name>`; `tags: ['autodocs']`;
+  `parameters.layout` is `'padded'`.
+- One story per variant value.
+- Stories are deterministic: fixed data (`engine/fixtures.ts`), fixed
+  reference dates, an explicit `locale: 'en-US'`, no `Date.now()`,
+  animations off.
+- A story carries no assertion and never imports vitest. A `play()`
+  imports only from `storybook/test`.
+
+Stories are type-checked by `tsconfig.stories.json` with
+`isolatedDeclarations` off: a `satisfies` meta cannot carry the
+annotation the flag asks for, and stories never ship.
+
+## Tests
+
+`bun test`, never vitest. `bunfig.toml` preloads `test/happy-dom.ts`,
+which registers happy-dom's globals and cleans up Testing Library after
+each test. Component tests use `@testing-library/react`.
+
+- Pure parts first: formatters, tones, the token bridge, the chrome.
+  `src/lib/cn.test.ts` is the example.
+- happy-dom has no canvas, so a primitive is tested through its pure
+  option builder (props in, ECharts option out), never by drawing. The
+  picture is the visual suite's job.
+- The headless engine is tested by drawing: a line chart and a radar to
+  SVG, the same string twice, a bundle of the entry with no React import,
+  and a drawing in a child process with no DOM.
+- Run the tests from this folder, so `bun test` reads this folder's
+  `bunfig.toml` and its preload.
+
+## Visual regression
+
+A native Playwright suite (`visual/`) over the built Storybook: every
+story in light and in dark, picked with the `theme` global and checked on
+`data-theme` before the shot; Chromium, animations disabled, fonts
+settled, a 0.1% pixel budget. `@storybook/test-runner` with
+`jest-image-snapshot` was not used: it runs Jest, which the repo does not
+use, and plain Playwright's `toHaveScreenshot` needs no second runner.
+
+Baselines are per machine and untracked, in
+`visual/__image_snapshots__/` (gitignored with `visual/__diff_output__/`).
+A machine only ever compares against baselines it wrote:
+`bun run test:visual:update` writes them, `bun run test:visual` compares.
+CI runs no visual gate yet, because baselines have no durable store there.
+The suite's file is `stories.visual.ts`, never `.spec.ts`, so `bun test`
+never picks it up. Playwright is pinned to an exact version, since a new
+Chromium moves pixels. The suite serves on port 6016, and
+`@open-tomato/atlas-ui`'s suite in rafa serves on 6017, so the two can
+run at once.
+
+## Gate order
+
+Run from this folder, in this order:
+
+```bash
+bun run check-types       # tsc --build, then tsconfig.stories.json
+bun test
+bun run lint
+bun run build             # dist/: bun build (ESM, browser) + tsc declarations
+bun run build:storybook   # storybook-static/
+bun run check:stories     # every story, light and dark, no console or page error
+bun run test:visual       # local only, against this machine's baselines
+```
+
+CI's `verify` job (`.github/workflows/verify.yml`) runs this package's
+`check-types` and `lint`, through the root's `check-types:all` and
+`lint:all`. The tests, the build and the Storybook gates run locally for
+now.
+
+## Publish shape
+
+- `type: module`, `sideEffects: false`, ESM only. The package ships no
+  CSS: the app's stylesheet compiles the classes.
+- `exports`: `.` (the seam, the React engine, `cn` and the theme),
+  `./theme`, `./engine` (the headless engine), each with `types` before
+  `import`, and `./package.json`.
+- `files`: `dist` and this README. `bun run build` writes `dist/` from
+  `src/index.ts`, `src/theme/index.ts` and `src/engine/headless/index.ts`
+  with shared chunks, every package external, then the declarations with
+  `tsc -p tsconfig.build.json`.
+- An entry barrel re-exports with `export *` only. With
+  `sideEffects: false`, bun 1.3 drops an entry module's own named
+  re-exports from the bundle, so `engine/headless/index.ts` is
+  `export * from './headless.js'` and `headless.ts` holds the list.
+- `publishConfig` names npmjs for the registry and for the
+  `@open-tomato` scope, and `access: public`.
+- Peer: `react` ^19. Dependencies: `echarts`, `class-variance-authority`,
+  `clsx`, `tailwind-merge` and `zod`, all from the public npm registry,
+  and no dependency on a private package.
+
+## Privacy
+
+This package is public. No tracked file in it names a host, a home path,
+an IP, a LAN name, a private registry, a self-hosted runner or a private
+repository. The repository's privacy gate (`bun run gate:privacy`, and
+`gate:privacy:history` in CI) enforces it over every file here.

package/dist/engine/BarChart/BarChart.d.ts

@@ -0,0 +1,4 @@
+import type { BarChartProps } from '../../seam/types.js';
+import type { ReactElement } from 'react';
+/** The BarChart drawn with ECharts. */
+export declare function BarChart(props: BarChartProps): ReactElement;

package/dist/engine/BarChart/BarChart.option.d.ts

@@ -0,0 +1,4 @@
+import type { BarChartProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: BarChartProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { BarChart } from './BarChart.js';
+export { buildOption as buildBarChartOption } from './BarChart.option.js';

package/dist/engine/BoxPlot/BoxPlot.d.ts

@@ -0,0 +1,4 @@
+import type { BoxPlotProps } from '../../seam/types.js';
+import type { ReactElement } from 'react';
+/** The BoxPlot drawn with ECharts. */
+export declare function BoxPlot(props: BoxPlotProps): ReactElement;

package/dist/engine/BoxPlot/BoxPlot.option.d.ts

@@ -0,0 +1,4 @@
+import type { BoxPlotProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: BoxPlotProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { BoxPlot } from './BoxPlot.js';
+export { buildOption as buildBoxPlotOption } from './BoxPlot.option.js';

package/dist/engine/Bullet/Bullet.d.ts

@@ -0,0 +1,4 @@
+import type { BulletProps } from '../../seam/types.js';
+import type { ReactElement } from 'react';
+/** The Bullet drawn with ECharts. */
+export declare function Bullet(props: BulletProps): ReactElement;

package/dist/engine/Bullet/Bullet.option.d.ts

@@ -0,0 +1,4 @@
+import type { BulletProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: BulletProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { Bullet } from './Bullet.js';
+export { buildOption as buildBulletOption } from './Bullet.option.js';

package/dist/engine/Donut/Donut.d.ts

@@ -0,0 +1,4 @@
+import type { DonutProps } from '../../seam/types.js';
+import type { ReactElement } from 'react';
+/** The Donut drawn with ECharts. */
+export declare function Donut(props: DonutProps): ReactElement;

package/dist/engine/Donut/Donut.option.d.ts

@@ -0,0 +1,4 @@
+import type { DonutProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: DonutProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { Donut } from './Donut.js';
+export { buildOption as buildDonutOption } from './Donut.option.js';

package/dist/engine/Gauge/Gauge.d.ts

@@ -0,0 +1,4 @@
+import type { GaugeProps } from '../../seam/types.js';
+import type { ReactElement } from 'react';
+/** The Gauge drawn with ECharts. */
+export declare function Gauge(props: GaugeProps): ReactElement;

package/dist/engine/Gauge/Gauge.option.d.ts

@@ -0,0 +1,4 @@
+import type { GaugeProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: GaugeProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { Gauge } from './Gauge.js';
+export { buildOption as buildGaugeOption } from './Gauge.option.js';

package/dist/engine/HeatmapGrid/HeatmapGrid.d.ts

@@ -0,0 +1,4 @@
+import type { HeatmapGridProps } from '../../seam/types.js';
+import { type ReactElement } from 'react';
+/** The HeatmapGrid drawn with ECharts. */
+export declare function HeatmapGrid(props: HeatmapGridProps): ReactElement;

package/dist/engine/HeatmapGrid/HeatmapGrid.option.d.ts

@@ -0,0 +1,4 @@
+import type { HeatmapGridProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: HeatmapGridProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { HeatmapGrid } from './HeatmapGrid.js';
+export { buildOption as buildHeatmapGridOption } from './HeatmapGrid.option.js';

package/dist/engine/Histogram/Histogram.d.ts

@@ -0,0 +1,4 @@
+import type { HistogramProps } from '../../seam/types.js';
+import type { ReactElement } from 'react';
+/** The Histogram drawn with ECharts. */
+export declare function Histogram(props: HistogramProps): ReactElement;

package/dist/engine/Histogram/Histogram.option.d.ts

@@ -0,0 +1,4 @@
+import type { HistogramProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: HistogramProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { Histogram } from './Histogram.js';
+export { buildOption as buildHistogramOption } from './Histogram.option.js';

package/dist/engine/LineChart/LineChart.d.ts

@@ -0,0 +1,19 @@
+import type { LineChartProps } from '../../seam/types.js';
+import type { ChartOption } from '../core.js';
+import type { ECharts } from 'echarts/core';
+import { type ReactElement } from 'react';
+/** The zoom window as axis values (epoch ms); null when the whole range shows. */
+export type ZoomWindow = {
+    from: number;
+    to: number;
+} | null;
+/** The live data-zoom window, read back from the instance. */
+export declare function readZoomWindow(instance: Pick<ECharts, 'getOption'>): ZoomWindow;
+/**
+ * Pins the live zoom window into a rebuilt option, so a legend toggle or a
+ * theme flip never moves it. The window is read from the instance when the
+ * option is set, not while rendering; the whole range leaves the option as is.
+ */
+export declare function carryZoom(option: ChartOption, instance: Pick<ECharts, 'getOption'>): ChartOption;
+/** The LineChart drawn with ECharts. */
+export declare function LineChart(props: LineChartProps): ReactElement;

package/dist/engine/LineChart/LineChart.option.d.ts

@@ -0,0 +1,4 @@
+import type { LineChartProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: LineChartProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { LineChart } from './LineChart.js';
+export { buildOption as buildLineChartOption } from './LineChart.option.js';

package/dist/engine/NetworkGraph/NetworkGraph.d.ts

@@ -0,0 +1,4 @@
+import type { NetworkGraphProps } from '../../seam/types.js';
+import { type ReactElement } from 'react';
+/** The NetworkGraph drawn with ECharts. */
+export declare function NetworkGraph(props: NetworkGraphProps): ReactElement;

package/dist/engine/NetworkGraph/NetworkGraph.option.d.ts

@@ -0,0 +1,8 @@
+import type { NetworkGraphProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/** What the option reads; narrower than the component's props so a parent's new object does not restart the force layout. */
+export type NetworkOptionProps = Pick<NetworkGraphProps, 'nodes' | 'links' | 'groupTones' | 'onNodeClick' | 'animate'>;
+/** The id an ECharts graph event names, from its node data. */
+export declare function nodeIdOf(data: unknown): string | undefined;
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: NetworkOptionProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { NetworkGraph } from './NetworkGraph.js';
+export { buildOption as buildNetworkGraphOption } from './NetworkGraph.option.js';

package/dist/engine/Nightingale/Nightingale.d.ts

@@ -0,0 +1,4 @@
+import type { NightingaleProps } from '../../seam/types.js';
+import type { ReactElement } from 'react';
+/** The Nightingale drawn with ECharts. */
+export declare function Nightingale(props: NightingaleProps): ReactElement;

package/dist/engine/Nightingale/Nightingale.option.d.ts

@@ -0,0 +1,4 @@
+import type { NightingaleProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: NightingaleProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { Nightingale } from './Nightingale.js';
+export { buildOption as buildNightingaleOption } from './Nightingale.option.js';

package/dist/engine/Radar/Radar.d.ts

@@ -0,0 +1,4 @@
+import type { RadarProps } from '../../seam/types.js';
+import type { ReactElement } from 'react';
+/** The Radar drawn with ECharts. */
+export declare function Radar(props: RadarProps): ReactElement;

package/dist/engine/Radar/Radar.option.d.ts

@@ -0,0 +1,4 @@
+import type { RadarProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: RadarProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { Radar } from './Radar.js';
+export { buildOption as buildRadarOption } from './Radar.option.js';

package/dist/engine/Sankey/Sankey.d.ts

@@ -0,0 +1,4 @@
+import type { SankeyProps } from '../../seam/types.js';
+import { type ReactElement } from 'react';
+/** The Sankey drawn with ECharts. */
+export declare function Sankey(props: SankeyProps): ReactElement;

package/dist/engine/Sankey/Sankey.option.d.ts

@@ -0,0 +1,6 @@
+import type { SankeyProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/** What the option reads; narrower than the component's props so a parent's new object does not redraw the layout. */
+export type SankeyOptionProps = Pick<SankeyProps, 'nodes' | 'links' | 'groupTones' | 'groupOrder' | 'valueFormat' | 'animate'>;
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: SankeyOptionProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { Sankey } from './Sankey.js';
+export { buildOption as buildSankeyOption } from './Sankey.option.js';

package/dist/engine/ScatterChart/ScatterChart.d.ts

@@ -0,0 +1,4 @@
+import type { ScatterChartProps } from '../../seam/types.js';
+import type { ReactElement } from 'react';
+/** The ScatterChart drawn with ECharts. */
+export declare function ScatterChart(props: ScatterChartProps): ReactElement;

package/dist/engine/ScatterChart/ScatterChart.option.d.ts

@@ -0,0 +1,6 @@
+import type { ScatterChartProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+export declare const DOTS_SERIES = "points";
+export declare const HIT_SERIES = "points-hit";
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: ScatterChartProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { ScatterChart } from './ScatterChart.js';
+export { buildOption as buildScatterChartOption } from './ScatterChart.option.js';

package/dist/engine/Sunburst/Sunburst.d.ts

@@ -0,0 +1,4 @@
+import type { SunburstProps } from '../../seam/types.js';
+import { type ReactElement } from 'react';
+/** The Sunburst drawn with ECharts. */
+export declare function Sunburst(props: SunburstProps): ReactElement;

package/dist/engine/Sunburst/Sunburst.option.d.ts

@@ -0,0 +1,19 @@
+import type { SunburstNode, SunburstProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/**
+ * The opening, in degrees, under which an arc of a ring carries no label
+ * (the tooltip still names it): the arc at the ring's inner edge must be as
+ * wide as the label is tall. A ring's inner edge is `inner` of the view
+ * radius, so the threshold falls as the chart grows: the slice that reads
+ * as a bare wedge in a card gets its label in the maximised view.
+ */
+export declare function labelMinAngle(inner: number, viewRadius: number): number;
+/** The ids from the root to every node, so a click can report its path. */
+export declare function pathsById(nodes: readonly SunburstNode[], above?: readonly string[]): Map<string, string[]>;
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+/**
+ * `width` is the canvas width in px, which sizes the radial labels; 0 until
+ * it is measured. `measuredHeight` is the canvas height in px, read only for
+ * `height: 'fill'`; 0 until measured, when the default height stands in.
+ */
+export declare function buildOption(props: SunburstProps, tokens: ResolvedTokens, width?: number, measuredHeight?: number): ChartOption;

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

@@ -0,0 +1,2 @@
+export { Sunburst } from './Sunburst.js';
+export { buildOption as buildSunburstOption } from './Sunburst.option.js';

package/dist/engine/Treemap/Treemap.d.ts

@@ -0,0 +1,4 @@
+import type { TreemapProps } from '../../seam/types.js';
+import type { ReactElement } from 'react';
+/** The Treemap drawn with ECharts. */
+export declare function Treemap(props: TreemapProps): ReactElement;

package/dist/engine/Treemap/Treemap.option.d.ts

@@ -0,0 +1,4 @@
+import type { TreemapProps } from '../../seam/types.js';
+import { type ChartOption, type ResolvedTokens } from '../core.js';
+/** The ECharts option for the props over the resolved tokens; pure, so it is tested without a canvas. */
+export declare function buildOption(props: TreemapProps, tokens: ResolvedTokens): ChartOption;

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

@@ -0,0 +1,2 @@
+export { Treemap } from './Treemap.js';
+export { buildOption as buildTreemapOption } from './Treemap.option.js';