Design system
Components you may use
A small, opinionated vocabulary. Editorial components carry reports; PatternFly React (rendered server-side, no client JavaScript) carries tools and chrome. Everything here has a live example and its source — copy from the page, not from memory. The allowlist is enforced by pnpm check.
Foundations
Three swappable palettes — default (PatternFly), landscape, goap — on PatternFly’s token contract: ramps, roles, validated chart sets, and every component rendered in the palette you are viewing.
Editorial
Numbered figure with caption, source, a11y wiring and wide/full breakouts. Wrap charts, images and maps in it.
Numbered, captioned table wrapper. Markdown tables inside reports are auto-wrapped in a scroll container with sticky first column.
Headline numbers with unit, delta and source. Use for 2–4 key figures, never as a dashboard.
note · key-finding · method · warning · caution. Editorial asides with a PatternFly icon.
Opening blocks for reports: a bulleted key-messages list and a lead-set summary.
Cross-references resolve to "Figure N"/"Table N" at build; [@key] citations render APA with a bibliography; [^1] footnotes are GFM.
Lists a bundle’s files, licence, provenance and citation from the bundles collection.
Charts
Build-time SVG charts from tidy rows with a data table and downloads; add `interactive` for an ECharts island.
Chrome
The shared chrome. Layouts include it; pages never do.
PatternFly
Rendered server-side by Astro (no client JS). Use `component="a"` for links.
Inline status messages. Prefer Callout inside report prose.
Compact status and count markers.
Contained groups of content for tools and index pages.
Term/description pairs — metadata blocks, method summaries.
Full-width status strip — report status (draft, review, superseded, older version). Static markup, no client JS.
In-page contents list. Reports use it for the sticky table of contents; scroll-spy is off (no client JS).
Read-only code — the catalogue’s copyable examples and the report BibTeX block. Add ClipboardCopy as an island only if copy-to-clipboard is needed.
The skip link every layout renders first. Layouts include it; pages never do.
Data tables for tools (sortable/selectable when hydrated). Reports use the editorial Table.