Skip to main content

​
RenderCellProps<TRow, TSummaryRow>

Props passed to custom cell renderers. 
interface RenderCellProps<TRow, TSummaryRow = unknown> {
  column: CalculatedColumn<TRow, TSummaryRow>;
  row: TRow;
  rowIdx: number;
  isCellEditable: boolean;
  tabIndex: number;
  onRowChange: (row: TRow) => void;
}

​
Properties

​
column
CalculatedColumn<TRow, TSummaryRow>
required
The column object for this cell.
​
row
TRow
required
The row object for this cell.
​
rowIdx
number
required
The row index.
​
isCellEditable
boolean
required
Whether the cell is editable.
​
tabIndex
number
required
The tab index for keyboard navigation.
​
onRowChange
(row: TRow) => void
required
Callback to update the row.

​
RenderHeaderCellProps<TRow, TSummaryRow>

Props passed to custom header cell renderers. 
interface RenderHeaderCellProps<TRow, TSummaryRow = unknown> {
  column: CalculatedColumn<TRow, TSummaryRow>;
  sortDirection: SortDirection | undefined;
  priority: number | undefined;
  tabIndex: number;
}

​
Properties

​
column
CalculatedColumn<TRow, TSummaryRow>
required
The column object for this header cell.
​
sortDirection
SortDirection | undefined
required
The current sort direction (‘ASC’ or ‘DESC’), or undefined if not sorted.
​
priority
number | undefined
required
The sort priority for multi-column sorting, or undefined if not sorted.
​
tabIndex
number
required
The tab index for keyboard navigation.

​
RenderEditCellProps<TRow, TSummaryRow>

Props passed to custom edit cell renderers (editors). 
interface RenderEditCellProps<TRow, TSummaryRow = unknown> {
  column: CalculatedColumn<TRow, TSummaryRow>;
  row: TRow;
  rowIdx: number;
  onRowChange: (row: TRow, commitChanges?: boolean) => void;
  onClose: (commitChanges?: boolean, shouldFocusCell?: boolean) => void;
}

​
Properties

​
column
CalculatedColumn<TRow, TSummaryRow>
required
The column object for this cell.
​
row
TRow
required
The row object for this cell.
​
rowIdx
number
required
The row index.
​
onRowChange
(row: TRow, commitChanges?: boolean) => void
required
Callback to update the row. Pass true for commitChanges to close the editor.
​
onClose
(commitChanges?: boolean, shouldFocusCell?: boolean) => void
required
Callback to close the editor. Pass true for commitChanges to save changes, false to discard. Pass true for shouldFocusCell to return focus to the cell.

​
RenderSummaryCellProps<TSummaryRow, TRow>

Props passed to summary cell renderers. 
interface RenderSummaryCellProps<TSummaryRow, TRow = unknown> {
  column: CalculatedColumn<TRow, TSummaryRow>;
  row: TSummaryRow;
  tabIndex: number;
}

​
Properties

​
column
CalculatedColumn<TRow, TSummaryRow>
required
The column object for this summary cell.
​
row
TSummaryRow
required
The summary row object.
​
tabIndex
number
required
The tab index for keyboard navigation.

​
RenderGroupCellProps<TRow, TSummaryRow>

Props passed to group cell renderers when using TreeDataGrid. 
interface RenderGroupCellProps<TRow, TSummaryRow = unknown> {
  groupKey: unknown;
  column: CalculatedColumn<TRow, TSummaryRow>;
  row: GroupRow<TRow>;
  childRows: readonly TRow[];
  isExpanded: boolean;
  tabIndex: number;
  toggleGroup: () => void;
}

​
Properties

​
groupKey
unknown
required
The group key value.
​
column
CalculatedColumn<TRow, TSummaryRow>
required
The column object for this group cell.
​
row
GroupRow<TRow>
required
The group row object.
​
childRows
readonly TRow[]
required
Array of child rows in this group.
​
isExpanded
boolean
required
Whether the group is expanded.
​
tabIndex
number
required
The tab index for keyboard navigation.
​
toggleGroup
() => void
required
Callback to toggle the group expansion state.

​
RenderRowProps<TRow, TSummaryRow>

Props passed to custom row renderers. 
interface RenderRowProps<TRow, TSummaryRow = unknown> extends BaseRenderRowProps<TRow, TSummaryRow> {
  row: TRow;
  lastFrozenColumnIndex: number;
  draggedOverCellIdx: number | undefined;
  selectedCellEditor: ReactElement<RenderEditCellProps<TRow>> | undefined;
  onRowChange: (column: CalculatedColumn<TRow, TSummaryRow>, rowIdx: number, newRow: TRow) => void;
  rowClass: Maybe<(row: TRow, rowIdx: number) => Maybe<string>>;
  isTreeGrid: boolean;
}

​
Properties

​
row
TRow
required
The row object.
​
viewportColumns
readonly CalculatedColumn<TRow, TSummaryRow>[]
required
Array of visible columns in the viewport.
​
rowIdx
number
required
The row index.
​
selectedCellIdx
number | undefined
required
Index of the selected cell in this row, or undefined if no cell is selected.
​
isRowSelected
boolean
required
Whether the row is selected.
​
isRowSelectionDisabled
boolean
required
Whether row selection is disabled for this row.
​
gridRowStart
number
required
CSS grid-row-start value.
​
lastFrozenColumnIndex
number
required
Index of the last frozen column.
​
draggedOverCellIdx
number | undefined
required
Index of the cell being dragged over, or undefined.
​
selectedCellEditor
ReactElement<RenderEditCellProps<TRow>> | undefined
required
The editor element for the selected cell, or undefined.
​
onRowChange
(column: CalculatedColumn<TRow, TSummaryRow>, rowIdx: number, newRow: TRow) => void
required
Callback to update the row.
​
rowClass
(row: TRow, rowIdx: number) => Maybe<string>
required
Function to determine row class names.
​
isTreeGrid
boolean
required
Whether this is a tree grid.

​
CellRendererProps<TRow, TSummaryRow>

Props passed to the cell renderer when using renderers.renderCell. 
interface CellRendererProps<TRow, TSummaryRow> extends BaseCellRendererProps<TRow, TSummaryRow> {
  column: CalculatedColumn<TRow, TSummaryRow>;
  row: TRow;
  colSpan: number | undefined;
  isDraggedOver: boolean;
  isCellSelected: boolean;
  onRowChange: (column: CalculatedColumn<TRow, TSummaryRow>, newRow: TRow) => void;
}

​
Properties

​
column
CalculatedColumn<TRow, TSummaryRow>
required
The column object for this cell.
​
row
TRow
required
The row object for this cell.
​
rowIdx
number
required
The row index.
​
colSpan
number | undefined
required
Number of columns this cell spans, or undefined.
​
isDraggedOver
boolean
required
Whether this cell is being dragged over.
​
isCellSelected
boolean
required
Whether this cell is selected.
​
onRowChange
(column: CalculatedColumn<TRow, TSummaryRow>, newRow: TRow) => void
required
Callback to update the row.
​
selectCell
(position: Position, options?: SelectCellOptions) => void
required
Callback to select a cell.

​
RenderCheckboxProps

Props for custom checkbox renderers. 
interface RenderCheckboxProps extends Pick<
  React.ComponentProps<'input'>,
  'aria-label' | 'aria-labelledby' | 'checked' | 'tabIndex' | 'disabled'
> {
  indeterminate?: boolean | undefined;
  onChange: (checked: boolean, shift: boolean) => void;
}

​
Properties

​
checked
boolean
required
Whether the checkbox is checked.
​
indeterminate
boolean
Whether the checkbox is in an indeterminate state.
​
disabled
boolean
Whether the checkbox is disabled.
​
onChange
(checked: boolean, shift: boolean) => void
required
Change handler. The second parameter indicates if shift key was pressed.
​
tabIndex
number
required
Tab index for keyboard navigation.
​
aria-label
string
Accessible label for the checkbox.
​
aria-labelledby
string
ID of the element that labels the checkbox.

​
RenderSortStatusProps

Props for custom sort status renderers. 
interface RenderSortStatusProps extends RenderSortIconProps, RenderSortPriorityProps {}

​
Properties

​
sortDirection
SortDirection | undefined
required
The current sort direction (‘ASC’ or ‘DESC’), or undefined if not sorted.
​
priority
number | undefined
required
The sort priority for multi-column sorting, or undefined if not sorted.

​
RenderSortIconProps

Props for custom sort icon renderers. 
interface RenderSortIconProps {
  sortDirection: SortDirection | undefined;
}

​
Properties

​
sortDirection
SortDirection | undefined
required
The current sort direction (‘ASC’ or ‘DESC’), or undefined if not sorted.

​
RenderSortPriorityProps

Props for custom sort priority renderers. 
interface RenderSortPriorityProps {
  priority: number | undefined;
}

​
Properties

​
priority
number | undefined
required
The sort priority for multi-column sorting, or undefined if not sorted.

Build docs developers (and LLMs) love

Get started for freeTalk to us