Founding price: $35, then $79.99 after 23:59 UTC on 4 November, then $79.99
Get ProA virtualised data grid with ARIA grid roles, one tab stop, arrow and page key navigation, sortable headers, pinned columns, row selection and full-width rows.
This item has no props to tune. Use the lens above to change theme, density, direction and more.
Use it when a table holds hundreds or thousands of rows and must stay fast and keyboard friendly. It renders only the rows in view. For a few dozen static rows a plain table is simpler.
| Prop | Type | Description |
|---|---|---|
columns | GridColumn<T>[] | Column definitions: id, header, width, kind, align, pinned, hidden, render. |
rows | T[] | The rows. Sort and filter them before passing them in. |
aria-label | string | Names the grid for screen readers. Required. |
height | number | Height of the scroll area in px. Default 360. |
rowHeight | number | Row height in px. Default 36. |
sort / onSortChange | SortSpec[] | Controlled sort. Shift-click a header adds a second sort. |
selectedIds / onSelectedIdsChange | Set<string> | Row selection, toggled with Space. |
renderCell | (ctx) => ReactNode | Replace a cell, for an editor. |
renderFullRow | (row, i) => ReactNode | null | Render a row across all columns (group headers). |
onCellActivate | (row, col) => void | Enter, F2 or double click. |
loading / empty | boolean / ReactNode | Skeleton rows and the empty message. |