Typed contract

API reference

Search every public table prop and column setting. Defaults and mode constraints reflect the current TypeScript implementation in src/Datatable.

125 documented entries

dataSourceTable props

T[]

Complete local row array. Sorting and filtering run in the client worker.

CoreIn-memory

columnSettingsTable props

ColumnSetting<T>[]

Column definitions controlling values, layout, rendering, and editing.

CoreRequired

onChangeTable props

(nextRows: T[]) => void

Receives the next local row array after edits, imports, or row actions.

CoreIn-memory

rowHeightTable props

number

Default virtualized body-row height in pixels.

AppearanceDefault 28

headerHeightTable props

number

Leaf header-row height in pixels.

AppearanceDefault 32

maxHeightTable props

number

Total table height including title, toolbar, header, body, and footer.

AppearanceDefault 520

overscanRowCountTable props

number

Extra rows rendered beyond the visible viewport.

PerformanceDefault 12

overscanColumnCountTable props

number

Extra columns rendered beyond the visible viewport.

PerformanceDefault 4

classNameTable props

string

Additional class applied to the table root for layout or token overrides.

Appearance

rowStyleTable props

StyleResolver<RowStyleContext<T>>

Static or conditional appearance style applied across each rendered row by stable base-row identity.

Appearance

conditionalFormattingTable props

ConditionalFormatRule<T>[]

Spreadsheet-style conditional formatting rules layered after rowStyle and cellStyle.

Appearance

modeTable props

"table" | "spreadsheet"

Selects standard data-table chrome or Excel-like presentation defaults.

AppearanceDefault "table"

showTitleBarTable props

boolean

Overrides the mode default for the title strip.

Appearance

showToolbarTable props

boolean

Overrides action-toolbar visibility. Spreadsheet mode uses the compact action-only variant.

Appearance

showFooterTable props

boolean

Overrides footer visibility.

Appearance

showFormulaBarTable props

boolean

Shows the active-cell address and raw value editor.

Appearance

showGlobalSearchTable props

boolean

Shows the global row filter/search input. Defaults on in table mode and off in spreadsheet mode.

Appearance

showColumnMenusTable props

boolean

Shows per-column sort, filter, alignment, and pin menus.

Columns

showKeyboardShortcutsTable props

boolean

Shows the keyboard-shortcuts help trigger without disabling the shortcuts themselves.

AppearanceDefault true

themeTable props

"light" | "dark"

Visual theme applied through the data-dt-theme attribute.

AppearanceDefault "light"

titleTable props

ReactNode

Full-width title rendered above the toolbar.

Appearance

loadingTable props

boolean

Shows a translucent loading layer over the grid body.

AppearanceDefault false

selectionDisabledTable props

boolean

Temporarily blocks row, header, and footer selection interactions.

SelectionDefault false

deferCellRenderTable props

boolean

Defers rich custom cell JSX through the frame scheduler by default.

PerformanceDefault true

enableColumnResizingTable props

boolean

Enables drag resize handles in column headers.

ColumnsDefault false

enableColumnResizeTable props

boolean

Deprecated alias for enableColumnResizing.

Columns

columnResizeModeTable props

"deferred" | "live"

Deferred shows a tinted width preview and commits on pointerup; live updates widths while dragging.

ColumnsDefault "deferred"

enableColumnReorderTable props

boolean

Enables horizontal drag-and-drop column reordering.

ColumnsDefault false

enableColumnPinningTable props

boolean

Enables configured pinning and pin controls globally.

ColumnsDefault true

enableSortingTable props

boolean

Enables sorting globally and overrides per-column sorting capabilities when false.

ColumnsDefault true

enableRowReorderAnimationTable props

boolean

Best-effort visible-row motion after sorting. Automatically skips reduced motion, scrolling, editing, and dense virtual windows.

AppearanceDefault true

enableGlobalFilterTable props

boolean

Enables global row filtering and its search control.

CoreDefault true

enableColumnSettingsTable props

boolean

Enables the column settings drawer for visibility, order, pinning, and alignment.

ColumnsDefault false

columnPinningTable props

TableColumnPinning

Controlled left and right pin lists. Overrides column pinned seeds.

Columns

onColumnPinningChangeTable props

(pinning: TableColumnPinning) => void

Reports controlled or uncontrolled pinning changes.

Columns

onColumnSizingChangeTable props

(sizing: Record<string, number>) => void

Reports the current uncontrolled column width map.

Columns

onColumnOrderChangeTable props

(order: string[]) => void

Reports the current uncontrolled column order.

Columns

onColumnSettingsChangeTable props

(settings: ColumnLayoutSettings) => void

Reports a unified snapshot after user-driven layout changes.

Columns

columnLayoutSettingsTable props

ColumnLayoutSettings

Controlled live column layout for order, visibility, pinning, sizing, alignment, and formatting.

Columns

defaultColumnLayoutSettingsTable props

ColumnLayoutSettings

Seeds order, visibility, pinning, sizing, and alignment on mount.

Columns

enableFindReplaceTable props

boolean

Enables toolbar find/replace separate from global row filtering.

Editing & historyDefault false

enableGoToCellTable props

boolean

Enables spreadsheet-style address navigation such as C12.

SelectionDefault false

onColumnFiltersChangeTable props

(filters: ColumnFilter[]) => void

Reports active per-column filters.

Columns

rowCountTable props

number

Total number of rows in a host-controlled ordered result set.

Remote dataVirtual

getRowTable props

(index: number) => T | undefined

Reads a row from the host cache by current visual index.

Remote dataVirtual

dataVersionTable props

number

Signals that host-cached row values or ordering changed.

Remote dataDefault 0Virtual

onVisibleRangeChangeTable props

(start: number, end: number) => void

Reports the visible window so the host can fetch or prefetch rows.

Remote dataVirtual

onVisibleColumnRangeChangeTable props

(start: number, end: number) => void

Reports the end-exclusive visible center-column range for horizontal prefetch or sheet growth.

Performance

onSortChangeTable props

(sort: { id: string | null; desc: boolean }) => void

Reports requested sorting for the host to apply.

Remote dataVirtual

onFilterChangeTable props

(query: string) => void

Reports the requested global filter for the host to apply.

Remote dataVirtual

externalSortTable props

{ id: string | null; desc: boolean }

Host-synchronized sort state displayed by the table.

Remote dataVirtual

externalFilterTable props

string

Host-synchronized global filter text.

Remote dataVirtual

externalColumnFiltersTable props

ColumnFilter[]

Host-synchronized per-column filters.

Remote dataVirtual

enablePaginationTable props

boolean

Shows the pagination footer and applies page boundaries.

PaginationDefault true

paginationTable props

{ pageIndex: number; pageSize: number }

Controlled pagination state.

Pagination

onPaginationChangeTable props

OnChangeFn<PaginationState>

Handles controlled pagination value or updater changes.

Pagination

onPageIndexChangeTable props

(pageIndex: number) => void

Reports page-index changes through a direct callback.

Pagination

onPageSizeChangeTable props

(pageSize: number) => void

Reports page-size changes through a direct callback.

Pagination

pageSizeOptionsTable props

readonly number[]

Values shown in the footer's Rows selector.

PaginationDefault [25, 50, 100, 250, 500, 1000]

enableRowSelectionTable props

boolean

Adds row checkboxes and row-selection behavior.

SelectionDefault false

enableMultiRowSelectionTable props

boolean

Allows more than one row to be selected.

Selection

onRowSelectionChangeTable props

(selection: Record<string, boolean>) => void

Reports the base-index selection map.

Selection

onSelectedRowsChangeTable props

(selectedRows: T[]) => void

Reports selected row objects.

Selection

selectedRowsTable props

Array<number | T>

Controlled selected identities as base indexes or row objects.

Selection

disabledRowsTable props

Array<number | T>

Rows excluded from selection, addressed by base index or object identity.

Selection

softDeleteKeyTable props

keyof T

Boolean row field used to render persistent, inert soft-deleted tombstones.

Editing & historyIn-memory

onRowClickTable props

(row: T, baseIndex: number, event: MouseEvent) => void

Reports clicks on eligible row surfaces and activates full-row highlighting.

Selection

onRowDoubleClickTable props

(row: T, baseIndex: number, event: MouseEvent) => void

Reports double-clicks on eligible row surfaces while preserving cell editing.

Selection

enableRowIndexTable props

boolean

Shows the Excel-style row-number gutter.

AppearanceDefault true

enableActiveRowTable props

boolean

Enables active-row rail and tint feedback.

SelectionDefault true

activeRowTable props

number | T

Controlled active row identity as a base index or row object.

Selection

enableEditingTable props

boolean

Enables inline editing for columns that define an editor.

Editing & historyDefault false

enableSelectionTable props

boolean

Enables spreadsheet-like cell focus and range selection.

SelectionDefault true

selectedCellTable props

[number | T, number]

Controlled single cell as row identity and visible column index.

Selection

selectedCellsTable props

{ start: Cell; end: Cell }

Controlled rectangular cell range.

Selection

onCellSelectionChangeTable props

(range: CellRange) => void

Reports the selected cell bounds using base row and column indexes.

Selection

undoLimitTable props

number

Maximum undo entries retained for edits.

Editing & historyDefault 5

redoLimitTable props

number

Maximum redo entries retained for edits.

Editing & historyDefault 5

enableDownloadTable props

boolean

Shows the download action in the toolbar.

Import & exportDefault false

showDownloadTable props

boolean

Deprecated alias for enableDownload.

Import & export

enableUploadTable props

boolean

Shows the CSV/XLSX upload action in the toolbar. Virtual tables also need onUploadRows.

Import & exportDefault false

showUploadTable props

boolean

Deprecated alias for enableUpload.

Import & export

defaultFileNameTable props

string

Prefills the export filename without an extension.

Import & exportDefault "data"

defaultExportFormatTable props

"csv" | "xlsx"

Prefills the selected export format.

Import & exportDefault "csv"

exportRowCountTable props

number

Advertised total for an all-rows export, including remote datasets.

Import & export

exportConfirmThresholdTable props

number

Row count at which export requests confirmation.

Import & exportDefault 100000

getRowsForExportTable props

(context: ExportContext) => ExportRowsResult<T>

Supplies an array or async stream of row chunks for cancellable background export.

Import & export

exportChunkSizeTable props

number

Maximum rows mapped per export chunk.

Import & exportDefault 5000

largeXlsxThresholdTable props

number

Deprecated. Excel export is no longer row-limited.

Import & exportDefault 100000

xlsxAdapterTable props

XlsxAdapter

Optional custom adapter for Excel import/export. Export loads the built-in adapter on demand when omitted.

Import & export

onExportStateChangeTable props

(state: ExportState) => void

Reports export preparation, progress, completion, cancellation, and errors.

Import & export

onUploadRowsTable props

(rows: T[]) => void | Promise<void>

Receives parsed and validated upload rows for a virtual host to merge into its remote view.

Import & exportVirtual

enableRowActionsTable props

boolean

Enables right-click insert and delete actions for local rows.

Import & exportDefault falseIn-memory

createEmptyRowTable props

(index: number) => T

Creates a typed row for insertion at the requested local index.

Import & exportIn-memory

onCellsEditTable props

(edits: Array<{ rowIndex: number; patch: Partial<T> }>) => void

Delivers virtual-mode cell patches for the host cache or store.

Editing & historyVirtual

idColumn settings

string

Stable public column identifier used by state, callbacks, and raw row lookup.

CoreRequired

columnColumn settings

string

Optional legacy/raw field name retained for compatible definitions.

Core

titleColumn settings

string

Visible leaf header label.

Appearance

groupTitleColumn settings

string

Shared label spanning adjacent columns with the same group title.

Appearance

orderColumn settings

number

Initial numeric order priority. Ordered columns render before unordered columns.

Columns

widthColumn settings

number

Initial column width in pixels.

ColumnsDefault 120

minWidthColumn settings

number

Minimum width allowed during layout and resize.

Columns

maxWidthColumn settings

number

Maximum width allowed during layout and resize.

Columns

visibleColumn settings

boolean

Column-level visibility seed. Derive this from external state for conditional column visibility.

ColumnsDefault true

alignColumn settings

"left" | "center" | "right"

Horizontal alignment for the header label and body content.

AppearanceDefault "left"

headerAlignColumn settings

"left" | "center" | "right"

Overrides horizontal alignment for the header label only.

Appearance

accessorColumn settings

(row: T) => unknown

Derives the column value when direct row[id] lookup is insufficient.

Core

cellColumn settings

(context: CellRenderContext<T>) => ReactNode

Renders rich custom cell content from the resolved value and row.

Appearance

cellStyleColumn settings

StyleResolver<CellStyleContext<T>>

Static or conditional appearance style for cells in this column.

Appearance

formatColumn settings

DisplayFormat

Formats default cell display without mutating raw row data.

Appearance

searchValueColumn settings

(row: T) => unknown

Derives the value used by global search and custom-cell match ranges.

Core

enableGlobalFilterColumn settings

boolean

Includes this column in global filtering.

CoreDefault true

enableGlobalSearchColumn settings

boolean

Deprecated alias for enableGlobalFilter.

Core

deferCellRenderColumn settings

boolean

Overrides table-level deferred rendering for this column's custom cell JSX.

Performance

enableSortingColumn settings

boolean

Allows header-click sorting for this column.

ColumnsDefault true

pinnedColumn settings

"left" | "right"

Seeds uncontrolled pinning on the specified edge.

Columns

filterTypeColumn settings

"text" | "number"

Selects the operator set used by the column filter UI.

ColumnsDefault "text"

enableResizingColumn settings

boolean

Allows this column to resize when table resizing is enabled.

ColumnsDefault true

enableReorderingColumn settings

boolean

Allows this column to move when table reordering is enabled.

ColumnsDefault true

editorColumn settings

CellEditorType | CellEditorConfig

Selects and configures the built-in inline editor.

Editing & history

editCellColumn settings

(context: CellEditRenderContext<T>) => ReactNode

Renders a custom editor and takes precedence over the built-in editor.

Editing & history

editRowHeightColumn settings

number

Temporarily expands the virtualized row while this column is editing.

Editing & history

liveToggleColumn settings

boolean

Lets Enter or Space toggle boolean content without opening an editor.

Editing & historyDefault false

validationColumn settings

(zod: typeof z) => ZodType

Builds the Zod schema used to validate imported and edited values.

Editing & history

exportValueColumn settings

(row: T) => unknown

Returns the scalar value written for custom cell content during export.

Import & export

Supporting contracts

Public types

Useful signatures for integration. See examples and guides for working usage.

ColumnLayoutSettings

{ order, visibility, pinning, sizing, alignment }

Serializable snapshot of the user-controlled column workspace.

TableColumnPinning

{ left: string[]; right: string[] }

Controlled left and right pinned column identifiers.

ColumnFilter

{ id, op, value?, valueTo? }

One active column filter, combined with other filters using AND.

CellEditorType

"text" | "number" | "textarea" | …

Built-in editor names, including select, checkbox, date, time, radio, and range.

CellRenderContext<T>

{ row, value, rowIndex, baseIndex, colId, commitValue? }

Values and actions available to a custom cell renderer.

CellEditRenderContext<T>

CellRenderContext<T> + commit/cancel

Editing lifecycle actions supplied to a custom editor renderer.

ExportContext

{ kind: "selection" | "all" }

Identifies whether an export should stream the selection or all rows.

XlsxAdapter

{ readWorkbook, writeWorkbook }

Optional Excel adapter; omit to use the built-in lazy loader.

Exercise sorting, filtering, pagination, selection, and visibility →Read integration guides →