Data table

Primarily an operator pattern; the rules apply wherever a table appears.

Anatomy: toolbar (search, filters, bulk actions, column control) → header row → body rows → footer (count, pagination).

Rules

• Row identity is stable across refresh, sort and filter. A row that moves under a click causes the wrong record to be acted on — the most damaging bug this pattern has.
• Numeric columns are right-aligned and use tabular figures (--font-numeric). Text columns are start-aligned. Never centre either.
• Column headers state units. "Weight" is ambiguous; "Weight (kg)" is not.
• Truncation is resolvable by click or expand, never by hover alone (E-31, 01-modes.md).
• Sort state is visible in the header and reflected in the URL, so a view can be shared.
• Row actions are tertiary buttons, visible without hover in operator.
• Bulk selection appears once single actions exist on more than ~20 rows. Selection survives pagination or clearly states that it does not.
• Timestamps are absolute and precise, with relative time secondary (01-modes.md). "3 hours ago" alone is unusable in an audit context.
• Loading replaces rows with skeletons of the same height. Never collapse the table to a spinner — the layout jump loses the user's place.
• Empty follows P-05, inside the table body, with the header still visible.