Screens / Watching the work

Reports and dashboards

Show how the work is going in charts and tables, and hand a finished report to someone who wasn't there.

For: Team leads and anyone reading a summary.

Markdown

3 ways to lay it out

1. Metrics and charts

Pick it when: The default: a page people open to see how things are going.

A row of metric cards, then a line chart and a bar chart, each in a frame with a chart or table toggle.

Stat cardProOne metric with its change against a named period.
Chart frameProThe frame every chart sits in: title, legend, a chart or table toggle, and the states a chart can be in.
Line chartProChange over time.
Bar chartProColumns by category, grouped or stacked.
SparklineProA word-sized trend.

Install metrics and charts

Pro and Premium items need a licence key; free ones install as they are.

2. Parts of a whole and targets

Pick it when: The question is how much of something is covered, or how far from a target.

A donut for the shares and bullet bars for actual against target, with a heatmap of intensity below.

Donut chartProParts of a whole.
Bullet barProActual against a target in one row.
HeatmapProIntensity over a grid.
Chart frameProThe frame and its states.

Install parts of a whole and targets

Pro and Premium items need a licence key; free ones install as they are.

3. A report to hand on

Pick it when: Someone who wasn't there needs a finished document with its findings and where they came from.

A paged report: a cover, a summary, numbered sections of findings with evidence, and a provenance footer.

Report sheetProThe paged chassis of a report: cover, numbered sections, an export bar and a provenance footer.
Insight ledgerProThe executive summary: not run yet, partial, or ready.
FindingProOne finding with its evidence and the next step.
Result tableProQuery rows as a typed, sortable table.

Install a report to hand on

Pro and Premium items need a licence key; free ones install as they are.

Rules that matter most here

Unknown stays unknown
A chart with no data for a period leaves a gap and says so; a section that couldn't be computed is named.
Model output is text, never markup
A summary the model wrote is shown as text, with the findings it rests on beside it.
Reasoning is believed, not verified
A finding's reasoning is shown as the agent's account, with the evidence it cites.

Brief for a coding agent

Paste this into the agent that builds the screen. The docs MCP server returns the same text from get_screen.

Build reports and dashboards with Candor UI.
Put every chart in ChartFrame (title, legend, chart or table toggle, and its loading, empty and error states). Choose LineChart for change over time, BarChart for categories, DonutChart for parts of a whole, Heatmap for a grid and BulletBar for actual against a target.
StatCard names the period its change is against.
Draw only data you have. A missing period is a gap, not a zero.
For a report, use ReportSheet. InsightLedger says honestly whether the summary is not run, partial (naming what couldn't be computed) or ready, and each Finding carries its evidence.
ReportSheet's footer says who or what generated it, from which sources and when they were read.

Start from the "Metrics and charts" layout: A row of metric cards, then a line chart and a bar chart, each in a frame with a chart or table toggle.
Candor items: stat-card (https://candor.themethodic.com/docs/stat-card.md), chart-frame (https://candor.themethodic.com/docs/chart-frame.md), line-chart (https://candor.themethodic.com/docs/line-chart.md), bar-chart (https://candor.themethodic.com/docs/bar-chart.md), sparkline (https://candor.themethodic.com/docs/sparkline.md).
Install: npx candor-ui add stat-card chart-frame line-chart bar-chart sparkline
Read each item's docs before using it and take its props from there; don't guess them. Pro and Premium items need the person's licence key, which they add with `npx candor-ui key <key>`; don't ask for it.