Data shape

Each chart takes one data object in its own shape: the values, the scale they sit on and how labels read. The shape is fixed per type and published as a JSON Schema, so your editor and your agent can check it before anything renders.

A waterfall, for example

cash-bridge.ts

const cashBridge: WaterfallData = {  max: 4,  ticks: ["4M", "3M", "2M", "1M", "0"],  fmt: (v) => v.toFixed(2) + "M",  steps: [    { label: "OPEN", v: 1.82, total: true },    { label: "SALES", v: 1.24 },    { label: "REFUND", v: -0.09 },    { label: "CLOSE", v: 1.91, total: true },  ],}

FieldTypeMeaning

maxnumberThe top of the value scale.

ticksstring[]The axis tick labels.

fmt(v: number) => stringFormats a value for its label.

stepsWaterfallStep[]One entry per step.

stagger"auto" | booleanStep names wider than their column: every other one on a second row (the plot's base rises one row). "auto"

FieldTypeMeaning

labelstringThe name shown on the chart.

vnumberThe value.

totalbooleanDraws the bar up from zero, as a total.

Check it

Every chart's docs page links its JSON Schema (usechartory.com/schemas/waterfall.json for this one), and the MCP server returns the same schema with get_chart_spec. A function such as fmt can't travel as JSON: the schema names it, your code passes it.

Loading, empty and error

A widget takes a state in place of its chart and blocks while data is on its way or isn't there.

StateShows

LoadingSkeleton blocks in surface/skeleton, at the chart's own layout

EmptyThe frame with a title, a short line and an optional action

ErrorThe frame with a short message, a retry and an optional second action

AgentsAgents read the same schema through MCP.

Data shape

A waterfall, for example

Check it

Loading, empty and error

New charts, by email.