Virtual Data Table

Mesma toolbar, busca, sort e seleção da Data Table — mas o corpo é virtualizado com `@tanstack/react-virtual`, então renderizar milhares de linhas continua fluido. Paginação opcional sobre a virtualização.

Lightspeed

10.000 linhas · sort, busca, seleção, reordenar colunas

Renderizando 10,000 linhas — apenas a janela visível fica no DOM.

<VirtualDataTableRoot
  items={rows}
  columns={columns}
  enableSelection
  defaultSort={{ columnId: "unit", direction: "asc" }}
>
  <DataTableToolbar>
    <DataTableSearch />
    <DataTableColumnOrder />
    <DataTableViewOptions />
  </DataTableToolbar>
  <VirtualDataTableContent rowHeight={52} height="32rem" overscan={12} />
</VirtualDataTableRoot>