Headless table on @tanstack/table-core — sorting, row selection, client pagination
Sortable
Name
Role
Status
Joined
Alice Chen
Engineer
active
2023-01-15
Bob Marsh
Designer
active
2022-09-04
Carol Kim
PM
pending
2024-03-20
David Liu
Engineer
inactive
2021-11-01
Erin Vasquez
QA
active
2023-06-30
Selectable + Sortable
Name
Role
Status
Joined
Alice Chen
Engineer
active
2023-01-15
Bob Marsh
Designer
active
2022-09-04
Carol Kim
PM
pending
2024-03-20
David Liu
Engineer
inactive
2021-11-01
Erin Vasquez
QA
active
2023-06-30
Frank Osei
Engineer
active
2022-04-12
Paginated (5 per page)
Name
Role
Status
Joined
Alice Chen
Engineer
active
2023-01-15
Bob Marsh
Designer
active
2022-09-04
Carol Kim
PM
pending
2024-03-20
David Liu
Engineer
inactive
2021-11-01
Erin Vasquez
QA
active
2023-06-30
Page 1 of 3
Loading State
Name
Role
Status
Joined
Alice Chen
Engineer
active
2023-01-15
Bob Marsh
Designer
active
2022-09-04
Carol Kim
PM
pending
2024-03-20
David Liu
Engineer
inactive
2021-11-01
Empty State
Name
Role
Status
Joined
No data
Row hooks + persisted sort + expand
bind:sorting + onSortingChange persist the sort to
localStorage; rowProps adds data-nav-id and a class
for inactive rows; clicking a row opens its expandedRow detail. variant="plain" drops the zebra striping.
Name
Role
Status
Joined
Alice Chen
Engineer
active
2023-01-15
Bob Marsh
Designer
active
2022-09-04
Carol Kim
PM
pending
2024-03-20
David Liu
Engineer
inactive
2021-11-01
Erin Vasquez
QA
active
2023-06-30
Frank Osei
Engineer
active
2022-04-12
Grid mode: 2,000 rows, grouped + windowed
groupBy (role → status) with sticky group headers under a sticky thead, virtual backed by createRowWindow from jatui/virtual (only ~30 rows are in the DOM), and ariaGrid for treegrid semantics. Collapsed: none.
Name
Role
Status
Joined
Alice #1
Engineer
active
2020-01-10
Alice #13
Engineer
active
2022-04-13
Alice #25
Engineer
active
2024-07-16
Alice #37
Engineer
active
2021-01-10
Alice #49
Engineer
active
2023-04-13
Alice #61
Engineer
active
2020-07-16
Alice #73
Engineer
active
2022-01-10
Alice #85
Engineer
active
2024-04-13
Alice #97
Engineer
active
2021-07-16
Alice #109
Engineer
active
2023-01-10
Alice #121
Engineer
active
2020-04-13
Alice #133
Engineer
active
2022-07-16
Alice #145
Engineer
active
2024-01-10
Alice #157
Engineer
active
2021-04-13
Alice #169
Engineer
active
2023-07-16
Alice #181
Engineer
active
2020-01-10
Alice #193
Engineer
active
2022-04-13
Alice #205
Engineer
active
2024-07-16
Alice #217
Engineer
active
2021-01-10
Alice #229
Engineer
active
2023-04-13
Alice #241
Engineer
active
2020-07-16
Alice #253
Engineer
active
2022-01-10
Alice #265
Engineer
active
2024-04-13
Alice #277
Engineer
active
2021-07-16
Alice #289
Engineer
active
2023-01-10
Alice #301
Engineer
active
2020-04-13
Custom empty snippet
Name
Role
Status
Joined
No people match these filters.
Resizable Columns
Drag the right edge of a header to resize — use:columnResize from jatui/table. Persist colWidths in your
app's settings on onResizeEnd.