Row numbers

Set enableRowNumbers: true to add a leading row-number column to the table.

Row numbers

Rows per page

1–10 of 48

const table = useDataTable({
  data,
  columns,
  getRowId: (row) => row.id,
  enableRowNumbers: true,
})

return <DataTable table={table} />

Numbering mode

rowNumberMode controls how the numbers are computed:

"static" (default) numbers the current view and is page-aware, so the first visible row on each page restarts the count appropriately.
"original" uses the source row index, so each row keeps the same number regardless of sorting or pagination.

const table = useDataTable({
  data,
  columns,
  getRowId: (row) => row.id,
  enableRowNumbers: true,
  rowNumberMode: "original",
})

Pairs with row pinning

The row-number column is also where the pin toggle lives, so it works well alongside row pinning.