Data Display
Tables, KPI tiles, badges, and gauges - the widgets that turn signals into readable state.
19 components
Vertical activity/event timeline with status-colored indicators and a compact/default layout variant.
Clickable dashed placeholder card with a label and icon, used to trigger adding a new item.
Pure-SVG radial gauge with a center label, token-driven colors, and progressbar semantics.
Domain-agnostic presentational atoms for dense data surfaces: SectionLabel, MetaBox, EmptyState, TagList, and DataListRow. Pure props-in rendering, composable across any domain.
TanStack-table wrapper with sorting, pagination, column toggle, row selection, and widget-owned loading/empty/error states.
Generic accordion/expandable list with a built-in default row design (severity accent, progress ring, secondary progress bar). Supply renderCollapsed/renderExpanded to replace the row design entirely. Supports loading, empty, and error states.
Icon-only button with an accessible label and optional tooltip.
Vertical connected event timeline showing an elapsed T+ offset from the first event plus an absolute timestamp. Per-event icon, label, and accent resolve from a caller-supplied style map; detail bodies render via a render prop. Domain-agnostic, with empty and loading states.
Generic list renderer with selection, loading skeleton, empty, and error states, and a default/compact layout variant.
List of labeled proportional bars in two densities: inline (label · bar · value breakdowns) and card (header badges + headline value over a full-width bar). Parent supplies the fill fraction and tone, so no scaling or thresholding logic lives in the component.
KPI stat tile with trend delta, severity accent, loading skeleton, and a responsive group layout.
Composable page header with title, description, and left/right action slots.
Reusable pagination controls with page numbers, page size selector, and record count display.
Dense three-zone list card with a rank + confidence arc, header badges, a lifecycle pill chain, and trailing meta blocks. Fully props-driven and domain-agnostic, with an escalation ribbon, urgency/severity accents, selected state, and a loading skeleton.
Generic list renderer with built-in loading, empty, and error states. Ships a default RecordCard row design (rank, progress ring, badges, steps, info blocks) or accepts a custom renderItem/CardComponent.
Master-detail right-side sheet with badges, metrics, assignee, and tabbed sections. Opens via a built-in trigger or a custom one passed in `trigger`.
Item-driven feed row for prioritised work queues: severity and status chips, a stage progress chain, act-by countdown, assignee, and priority score. Takes one flat item and owns every presentation decision, so screens map their domain record and nothing else.
Severity badge with solid and translucent-chip appearances, plus reusable severity color helpers.
Segmented control for switching between view layouts (e.g. grid, list, table), with optional icons and labels per option.