Docs Platform

ChartShell

A state engine dropped inside the chart presenters that already exist, rather than a rewrite of all 87 visuals. Tooltip, legend and keyboard children are live now. Selection, brush and zoom are built but stay unplugged until a chart exposes the APIs they need.

Live machine

The shipped chartShellMachine with the legend child enabled: toggling a series updates hiddenSeries, the same state every chart's render plan reads.

chart-shell · live via createService

latency

errors

traffic

States · walked from the machine

ready

Transitions from here · click to send

Context

{
  "tooltip": null,
  "legend": {
    "value": "ready",
    "context": {
      "mode": "uncontrolled",
      "hiddenSeries": []
    }
  },
  "selection": null,
  "brush": null,
  "zoom": null,
  "keyboard": null
}

Log · newest first

No events yet — use the component above or send a transition.

Explore the layers

Machine (@grassroot/ui-machines/chart-shell, may import selection and tooltip). Headless: @grassroot/ui-headless-*/chart-shell plus vanilla mountChartShell. Markup for tooltip/legend/crosshair stays in @grassroot/charts-react. Spec: packages/ui-headless/core/src/chart-shell/chart-shell.spec.md.

Behaviour contract

Live-wiring is 395/395 cells: 390 ChartShell edges and five native Heatmap exceptions. Seven charts are exempt. Visual JSX must not move into headless packages.

Heatmap

Heatmap is not ChartShell in any of the five packages. It uses its native model and hit-testing path; the former interaction package is retired.