Documentation

@kanunilabs/datagrid-react

@kanunilabs/datagrid-react / GridRowProps

Interface: GridRowProps<TRow>

Defined in: datagrid-react/src/components/GridRow.tsx:37

Type Parameters

TRow

TRow = GridRowData

Properties

centerColumns

centerColumns: ReactColumnRuntime<TRow>[]

Defined in: datagrid-react/src/components/GridRow.tsx:46

Center columns inside the horizontal window.

centerIndices?

optional centerIndices?: readonly number[]

Defined in: datagrid-react/src/components/GridRow.tsx:56

True index in layout.center for each rendered center column.

A column's position in centerColumns is NOT its position in the grid — the block is a window slice with scrolled-past sticky columns spliced onto the front. Deriving the index from the loop counter made every center column report a smaller aria-colindex the further right the grid was scrolled, and put the range anchor and fill handle on the wrong column.

checkboxColumn

checkboxColumn: boolean

Defined in: datagrid-react/src/components/GridRow.tsx:87

Renders the leading checkbox cell.

columnModel

columnModel: ColumnModel<TRow>

Defined in: datagrid-react/src/components/GridRow.tsx:44

detailColumn?

optional detailColumn?: boolean

Defined in: datagrid-react/src/components/GridRow.tsx:166

Render a leading expander cell for master-detail (Enterprise).

detailExpanded?

optional detailExpanded?: boolean

Defined in: datagrid-react/src/components/GridRow.tsx:168

Whether THIS row's detail panel is open.

dropSide?

optional dropSide?: "before" | "after" | null

Defined in: datagrid-react/src/components/GridRow.tsx:85

Which edge to draw the drop line on, or null.

focusedColumnId

focusedColumnId: string | null

Defined in: datagrid-react/src/components/GridRow.tsx:66

Column id holding keyboard focus in this row, or null.

getCellClassName?

optional getCellClassName?: (ctx) => string | undefined

Defined in: datagrid-react/src/components/GridRow.tsx:193

Parameters

ctx

CellSlotContext<TRow>

Returns

string | undefined

getNote?

optional getNote?: (rowKey, columnId, row) => string | null | undefined

Defined in: datagrid-react/src/components/GridRow.tsx:97

This cell's note, or null (gap analysis P3.3). Only the MARKER is decided here — the text itself is revealed by the tooltip layer, which reads the same source at hover time.

Called once per rendered cell, so the config's get has to be a lookup.

Parameters

rowKey

RowKey

columnId

string

row

TRow

Returns

string | null | undefined

getSpan?

optional getSpan?: (rowIndex, columnId) => { height: number; kind: "draw"; offset: number; } | { kind: "covered"; } | null

Defined in: datagrid-react/src/components/GridRow.tsx:112

How this row takes part in a merged block for a column (gap analysis P3.1), or null when the column does not merge here.

Resolved by the caller: deciding it needs the run list AND the window's bounds, and the row knows neither. height is already in pixels because only the caller can ask the engine what the covered rows really measure — an autoHeight row in the middle of a block is not rowHeight tall.

Takes the row index rather than arriving pre-bound to it. A closure per row defeats this component's memo, and with an autoHeight column that turns into a measure/re-render loop React ends with "Maximum update depth exceeded".

Parameters

rowIndex

number

columnId

string

Returns

{ height: number; kind: "draw"; offset: number; } | { kind: "covered"; } | null

gridId

gridId: string

Defined in: datagrid-react/src/components/GridRow.tsx:39

Used to build stable cell ids for aria-activedescendant.

headerRowCount

headerRowCount: number

Defined in: datagrid-react/src/components/GridRow.tsx:131

Number of non-data rows above (header, and the filter row when shown).

height?

optional height?: number

Defined in: datagrid-react/src/components/GridRow.tsx:189

This row's own height, when it is NOT the standard one — a measured autoHeight row, or one getRowHeight sized.

Undefined means standard, and undefined is the case worth optimizing: the element gets no inline style at all and inherits --dg-row-height, so a grid with uniform rows renders exactly the markup it did before any of this existed. Panels do not use this — they carry their height on the node.

index

index: number

Defined in: datagrid-react/src/components/GridRow.tsx:42

Row's ordinal in the view (drives striping).

layout

layout: ColumnLayout<TRow>

Defined in: datagrid-react/src/components/GridRow.tsx:43

leadingSpacer

leadingSpacer: number

Defined in: datagrid-react/src/components/GridRow.tsx:60

Width of the center columns skipped to the left of the window.

node

node: RowNode<TRow>

Defined in: datagrid-react/src/components/GridRow.tsx:40

onCellDoubleClick?

optional onCellDoubleClick?: (ctx) => void

Defined in: datagrid-react/src/components/GridRow.tsx:196

Parameters

ctx

CellSlotContext<TRow>

Returns

void

onCellMouseDown?

optional onCellMouseDown?: (node, columnId) => void

Defined in: datagrid-react/src/components/GridRow.tsx:143

Parameters

node

RowNode<TRow>

columnId

string

Returns

void

onCellPointerDown?

optional onCellPointerDown?: (ctx, event) => void

Defined in: datagrid-react/src/components/GridRow.tsx:194

Parameters

ctx

CellSlotContext<TRow>

event

MouseEvent

Returns

void

onCellPointerEnter?

optional onCellPointerEnter?: (ctx, event) => void

Defined in: datagrid-react/src/components/GridRow.tsx:195

Parameters

ctx

CellSlotContext<TRow>

event

MouseEvent

Returns

void

onRowClick?

optional onRowClick?: (node, rowIndex?, event?) => void

Defined in: datagrid-react/src/components/GridRow.tsx:139

The extra arguments are OPTIONAL on purpose, and ordered to match onRowContextMenu below. The grid passes them so the adapter can resolve WHICH CELL was hit (closest('[data-column-id]')) and publish cellClicked / rowClicked; a caller that only wants the row keeps passing a one-argument function, which stays assignable.

Parameters

node

RowNode<TRow>

rowIndex?

number

event?

MouseEvent<Element, MouseEvent>

Returns

void

onRowContextMenu?

optional onRowContextMenu?: (node, rowIndex, event) => void

Defined in: datagrid-react/src/components/GridRow.tsx:145

Right-click on a data row (row menu).

Parameters

node

RowNode<TRow>

rowIndex

number

event

MouseEvent

Returns

void

onRowDoubleClick?

optional onRowDoubleClick?: (node, rowIndex?, event?) => void

Defined in: datagrid-react/src/components/GridRow.tsx:141

Parameters

node

RowNode<TRow>

rowIndex?

number

event?

MouseEvent<Element, MouseEvent>

Returns

void

onRowMouseDown?

optional onRowMouseDown?: (node, event) => void

Defined in: datagrid-react/src/components/GridRow.tsx:140

Parameters

node

RowNode<TRow>

event

MouseEvent

Returns

void

onToggleDetail?

optional onToggleDetail?: (rowKey) => void

Defined in: datagrid-react/src/components/GridRow.tsx:169

Parameters

rowKey

RowKey

Returns

void

onToggleGroup?

optional onToggleGroup?: (groupKey) => void

Defined in: datagrid-react/src/components/GridRow.tsx:146

Parameters

groupKey

string

Returns

void

onToggleSelect?

optional onToggleSelect?: (node) => void

Defined in: datagrid-react/src/components/GridRow.tsx:142

Parameters

node

RowNode<TRow>

Returns

void

onToggleTreeRow?

optional onToggleTreeRow?: (rowKey) => void

Defined in: datagrid-react/src/components/GridRow.tsx:148

Tree data (P1.4): expand/collapse from the first column's toggle.

Parameters

rowKey

RowKey

Returns

void

renderCellContent?

optional renderCellContent?: (ctx) => ReactNode

Defined in: datagrid-react/src/components/GridRow.tsx:192

Parameters

ctx

CellSlotContext<TRow>

Returns

ReactNode

renderDetail?

optional renderDetail?: (row) => ReactNode

Defined in: datagrid-react/src/components/GridRow.tsx:171

Panel body for a detail row (Enterprise slot).

Parameters

row

TRow

Returns

ReactNode

renderEditForm?

optional renderEditForm?: (rowKey, row) => ReactNode

Defined in: datagrid-react/src/components/GridRow.tsx:179

Body for an in-grid edit form (Enterprise slot, mode: 'form').

row is undefined for a record that does not exist yet — the form is still opened, because the alternative is pressing "New row" and seeing nothing happen.

Parameters

rowKey

RowKey

row

TRow | undefined

Returns

ReactNode

renderRow?

optional renderRow?: (ctx) => ReactNode

Defined in: datagrid-react/src/components/GridRow.tsx:75

Replace the row's CONTENT with arbitrary markup. The row element itself stays — it carries the height, the aria indices and the click handlers the virtualizer and selection depend on, so a template that owned the whole element would have to reproduce all of it correctly to work at all.

Parameters

ctx

RowTemplateContext<TRow>

Returns

ReactNode

revision?

optional revision?: number

Defined in: datagrid-react/src/components/GridRow.tsx:154

Bumped by controller.refreshCells() (P1.7). Read by nothing — its only job is to differ, so the row memo lets a re-render through when the DATA behind a valueGetter changed without the node identity changing.

rowDrag?

optional rowDrag?: RowDragHandlers

Defined in: datagrid-react/src/components/GridRow.tsx:83

Row drag & drop (gap G7). A sticky GRIP is rendered at the row's inline start rather than a lead column: a third lead column would have to be threaded through leadColumnWidth, every sticky offset and every aria-colindex in six components, and this file already warns that those drifting apart is what desynchronizes header and body.

rowFocused?

optional rowFocused?: boolean

Defined in: datagrid-react/src/components/GridRow.tsx:68

Highlight this row as the focused one (focusedRow is on).

rowNumber?

optional rowNumber?: number | null

Defined in: datagrid-react/src/components/GridRow.tsx:129

The number to show, already resolved (see rowNumberAt in geometry).

Resolved by the caller rather than derived from index here, because the ordinal is NOT the number: group banners occupy view positions, and pagination offsets the count. A row that computed it itself would have to know about both.

null means this row is not part of the numbering and gets an empty cell. Pinned rows are the case: they sit outside the result rather than at a position in it, and numbering them from their own index made a pinned row and the first data row both claim to be row 1.

rowNumberColumn?

optional rowNumberColumn?: boolean

Defined in: datagrid-react/src/components/GridRow.tsx:89

Renders the leading row-number cell (gap analysis P3.5).

searchNeedle?

optional searchNeedle?: string

Defined in: datagrid-react/src/components/GridRow.tsx:162

Lower-cased search term to mark up inside cell text (gap analysis P2.4).

A PROP rather than a read of the controller, so it takes part in the row memo: when the search changes, the rows that need new markup re-render, and when it does not, they do not.

selected

selected: boolean

Defined in: datagrid-react/src/components/GridRow.tsx:64

stickyInsets?

optional stickyInsets?: ReadonlyMap<string, number>

Defined in: datagrid-react/src/components/GridRow.tsx:58

Inset per STICKY center column, by id. See RenderGeometry.stickyInsets.

striped

striped: boolean

Defined in: datagrid-react/src/components/GridRow.tsx:63

summaryDefs?

optional summaryDefs?: readonly SummaryDef<TRow>[]

Defined in: datagrid-react/src/components/GridRow.tsx:164

Aggregate definitions rendered inside group headers (Enterprise).

trailingSpacer

trailingSpacer: number

Defined in: datagrid-react/src/components/GridRow.tsx:62

Width of the center columns skipped to the right of the window.