Skip to content

Editorial · @csdr/editorial

Table

Numbered, captioned table wrapper. Markdown tables inside reports are auto-wrapped in a scroll container with sticky first column.

Import
import { Table } from '@csdr/editorial'
Use on
reports · docs

When to use

Small reference tables in reports (≤ ~15 rows). Larger data belongs in a bundle with a chart and a download. In MDX, wrap a Markdown table in <Table id caption units>; the table itself is auto-wrapped in a horizontal scroll container with a sticky first column and tabular numerals.

Numbered table

Table 1.Ecosystem extent by class.(thousand ha)Source: Illustrative.
Class20152020Change
Mangroves35.136.0+0.9
Seagrass21.420.2−1.2

Source: Illustrative.

Code
<Table id="tab-summary" caption="Ecosystem extent by class." units="thousand ha" source="Illustrative.">

| Class | 2015 | 2020 | Change |
| --- | ---: | ---: | ---: |
| Mangroves | 35.1 | 36.0 | +0.9 |
| Seagrass | 21.4 | 20.2 | −1.2 |

</Table>

In print (PDF)

Every table is measured before the PDF is printed and given a strategy: portrait for a few columns; landscape — its own A4 landscape page, with the report's running furniture and the table's title repeated on every page it occupies — for a genuine multi-column comparison (five or more columns, or long four-column rows); records for a few paragraph-length rows, each printed as a labelled record (first cell as the topic, the other columns as labelled details) while the web keeps the table. Type never goes below 9 pt; a link in a cell stays clickable but its URL is never spelled out. The build log and dist/.csdr-print-preflight.json say what each table got.

Props

  • id, caption, units, source, number
  • width: content (default) · wide · full
  • printMode: auto (default — measured) · portrait · landscape · records · appendix (compact reference material at 8.5 pt). Override only where the comparison needs a particular treatment.
  • keep: never split across pages (by default long tables run over with the header row repeated)