Data Table

Stable

Powerful data grid component built on TanStack Table, featuring sorting, filtering, selection, and virtualization.

Examples

4 row(s)

Rows

1 / 1

tsx

<DataTable 
  columns={columns} 
  data={data} 
  enablePagination 
  enableFiltering 
  enableSorting 
/>

4 row(s)

Rows

1 / 2

tsx

<DataTable 
  variant="neon" 
  columns={columns} 
  data={data} 
  enableSelection 
/>

4 row(s)

Rows

1 / 2

tsx

<DataTable variant="glass" columns={columns} data={data} />

Property	Description	Type	Default
data	The data array.	TData[]	-
columns	Column definitions (TanStack).	DataTableColumnDef<TData>[]	-
variant	Visual style.	"default" \| "neon" \| "glass"	-
enableSorting	Enable column sorting.	boolean	true
enableFiltering	Enable global search.	boolean	true
enableSelection	Enable row selection checkboxes.	boolean	false
enableVirtualization	Enable row virtualization for large datasets.	boolean	false