All components
Data Display
Table
beta
Since 1.1
Data-driven table for dense screens: sortable columns, multiple row selection, and full table accessibility roles.
Data Display
primitive
Display
Documented
import { Table } from '@ivim/native/components';
When to use
Use when
You need to present rows of structured, comparable records (orders, accounts, queues).
People need to sort by a column or select multiple rows to act on them.
Don't use when
The data is a simple vertical list without columns — use ListGroup.
You are laying out key/value detail pairs — use DescriptionItem.
Example
Preview
Code
Status
IVM-1042
A. Rivera
Processing
IVM-1043
J. Chen
Shipped
IVM-1044
M. Patel
Pending
Guidelines
Do
Sort is controlled: re-sort your data in onSortChange; the table only reports the descriptor and shows the indicator.
Don't
Don't put more columns than fit the narrowest supported width — the table scrolls horizontally, but excessive columns hurt scanability.
Accessibility
Roles and screen-reader behavior this component provides, plus keyboard interactions.
•
Sets role="table" with role="row" / "columnheader" / "cell" descendants (maps to ARIA on web and accessibility traits on native).
•
Sortable headers expose aria-sort and are announced as buttons.
•
Selection uses accessible checkboxes with per-row and select-all labels.
Tab
Moves focus to sortable headers, checkboxes, and row actions.
Space / Enter
Activates a sort header, toggles a row checkbox, or fires a row action.
Platform & RTL
Behavior that differs across the platforms this component runs on.
Web
Wide tables scroll horizontally inside their own container; ARIA table roles apply.
iOS
Horizontal scroll with native momentum; VoiceOver reads the table structure.
Android
TalkBack reads row/column structure via the accessibility roles.
State coverage
Interaction and visual states this component supports.
base
semantic color
density
Token references
Semantic design tokens this component page exercises. Tap one to edit it live.
Related components
Components that solve adjacent problems or compose with this one.
ListGroup
Grouped row shell with muted, raised, outlined, and density variants.
DescriptionItem
Composed label-and-value surface for consistently presenting entity details.
Pagination
Composed previous/next navigation with an accessible live result range.
Checkbox
Independent on/off choice with indeterminate, invalid, and read-only states, plus a CheckboxGroup for related options.