# Infinite Table Type Definitions

> TypeScript type definitions for Infinite Table

Canonical page: https://infinite-table.com/docs/reference/type-definitions/

These are the public type definitions for `InfiniteTable` and related components, that you can import with named imports from the `@infinite-table/infinite-react` package.

```tsx title="Importing the type for rowInfo"
import type { InfiniteTableRowInfo } from '@infinite-table/infinite-react';
```

The types of all properties in the `InfiniteTable` and `DataSource` components respect the following naming convention: `<ComponentName>Prop<PropName>`

So, for example, the type for [`groupBy`](https://infinite-table.com/docs/reference/datasource-props/index.md#groupBy) is [`DataSourcePropGroupBy`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourcePropGroupBy)

### DataSourceState

> Represents the state of the whole `<DataSource />` component.

You can grab a reference to the `<DataSource />` component state via the [`useDataSourceState`](https://infinite-table.com/docs/reference/hooks/index.md#useDataSourceState) hook that Infinite exposes.

Available properties:

 - `dataArray` - array of [`InfiniteTableRowInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#InfiniteTableRowInfo)

### TreeSelectionValue

> Represents the selection state of the tree nodes. See [`treeSelection`](https://infinite-table.com/docs/reference/datasource-props/index.md#treeSelection) for more details.

```ts
import type { TreeSelectionValue } from '@infinite-table/infinite-react';
```

The selection value is an object with the following properties:

- `defaultSelection`: `boolean` - whether the tree nodes are selected by default or not.
- `selectedPaths?`: `NodePath[]` - the paths of the selected nodes. Mandatory if `defaultSelection` is `false`.
- `deselectedPaths`: `NodePath[]` - the paths of the deselected nodes. Mandatory if `defaultSelection` is `true`.

```tsx title="Example of tree selection value"
const treeSelection: TreeSelectionValue = {
  defaultSelection: false,
  selectedPaths: [['1'], ['2', '20']],
  deselectedPaths: [['1','10']],
};
// node ['1'] will be selected but indeterminate
// since ['1','10'] is in the deselectedPaths
// node ['2','20'] will be fully selected
```

### TreeExpandStateValue

> Represents the expand/collapse state of the tree nodes. See [`treeExpandState`](https://infinite-table.com/docs/reference/datasource-props/index.md#treeExpandState) for more details.

```ts
import type { TreeExpandStateValue } from '@infinite-table/infinite-react';
```

You can specify the expand/collapse state of the tree nodes in two ways:

1. With node paths (recommended)

When using node paths, the object should have the following properties:

- `defaultExpanded`: `boolean` - whether the tree nodes are expanded by default or not.
- `collapsedPaths`: `string[]` - when `defaultExpanded` is `true`, this is a mandatory prop.
- `expandedPaths`: `string[]` - when `defaultExpanded` is `false`, this is a mandatory prop.

```tsx title="Example of treeExpandState with node paths"
const treeExpandState = {
  defaultExpanded: true,
  collapsedPaths: [
    ['1', '10'],
    ['2', '20'],
    ['5']
  ],
  expandedPaths: [
    ['1', '4'],
    ['5','nested node in 5'],
  ],
};
```

2. With node ids

When using node ids, the object should have the following properties:

- `defaultExpanded`: `boolean` - whether the tree nodes are expanded by default or not.
- `collapsedIds`: `string[]` - when `defaultExpanded` is `true`, this is a mandatory prop.
- `expandedIds`: `string[]` - when `defaultExpanded` is `false`, this is a mandatory prop.

```tsx title="Example of treeExpandState with node ids"
const treeExpandState = {
  defaultExpanded: true,
  collapsedIds: ['1', '2', '5'],
  expandedIds: ['10', '20', 'nested node in 5'],
};
```

### RowDetailState

> Represents the collapse/expand state of row details - when [master-detail is configured](https://infinite-table.com/docs/learn/master-detail/overview.md). Also see [`rowDetailRenderer`](https://infinite-table.com/docs/reference/infinite-table-props.md#rowDetailRenderer) for the most important property in the master-detail configuration.

This class can be instantiated and the value passed to the [`rowDetailState`](https://infinite-table.com/docs/reference/infinite-table-props.md#rowDetailState) prop (or its uncontrolled variant, [`defaultRowDetailState`](https://infinite-table.com/docs/reference/infinite-table-props.md#defaultRowDetailState)).

```tsx title="Passing an instance of RowDetailState to the InfiniteTable"
const rowDetailState = new RowDetailState({
  collapsedRows: true,
  expandedRows: [2, 3, 4],
});

<InfiniteTable<DATA_TYPE> rowDetailState={rowDetailState} />;
```

```tsx title="Passing an object literal to the InfiniteTable"
<InfiniteTable<DATA_TYPE>
  rowDetailState={{
    collapsedRows: true,
    expandedRows: [2, 3, 4],
  }}
/>
```

The instance is only useful if you want to interrogate the object, with methods like `areAllCollapsed()`, `areAllExpanded()`, `isRowDetailsExpanded(rowId)` and so on.

When using the [`onRowDetailStateChange`](https://infinite-table.com/docs/reference/infinite-table-props.md#onRowDetailStateChange) callback, it's called with an instance of this class - if you want to use the object literal, make sure you call `rowDetailState.getState()` to get the plain object.

The [`rowDetailState`](https://infinite-table.com/docs/reference/infinite-table-props.md#rowDetailState) and [`defaultRowDetailState`](https://infinite-table.com/docs/reference/infinite-table-props.md#defaultRowDetailState) accept both an object literal and an instance of this class.

The object literal has the following properties:

- `collapsedRows`: `boolean | any[]` - if `true`, all row details are collapsed. If an array, it contains the row ids of the rows that are collapsed.
- `expandedRows`: `boolean | any[]` - if `true`, all row details are expanded. If an array, it contains the row ids of the rows that are expanded.

You can create an instance using the object literal notation and you can get the object literal from the instance using the `getState` method:

```tsx
const rowDetailState = new RowDetailState({
  collapsedRows: true,
  expandedRows: [2, 3, 4],
});
const clone = new RowDetailState(rowDetailState);

const state = rowDetailState.getState();
```

You can mark rows as expanded/collapsed even after creating the instance:

```tsx
const rowDetailState = new RowDetailState({
  collapsedRows: true,
  expandedRows: [2, 3, 4],
});
rowDetailState.expandRowDetails(5);
rowDetailState.collapseRowDetails(2);

// now you can pass this instance back to the InfiniteTable component
```

### DataSourceDataParams

> The type for the object passed into the [`data`](https://infinite-table.com/docs/reference/datasource-props/index.md#data) function prop of the `DataSource` component.

When the [`data`](https://infinite-table.com/docs/reference/datasource-props/index.md#data) function is called, it will be called with an object of this type.

The following properties are available on this object:

- `sortInfo?` - [`DataSourcePropSortInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourcePropSortInfo) - the current sort info for the grid.
- `groupBy?` - an array of [`DataSourceGroupBy`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourceGroupBy) - the current group by for the grid.
- `pivotBy?` - an array of [`DataSourcePivotBy`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourcePivotBy) - the current pivot by for the grid.
- `filterValue?` - an array of [`DataSourceFilterValueItem`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourceFilterValueItem) - the current filter value for the grid.
- `masterRowInfo?` - [`InfiniteTableRowInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#InfiniteTableRowInfo) - only available if the DataSource is a detail DataSource - meaning there is a master DataGrid, and the DataSource is used to load the detail DataGrid.

### DataSourceFilterValueItem

> The type for the items in the [`filterValue`](https://infinite-table.com/docs/reference/datasource-props/index.md#filterValue) array prop of the `DataSource` component.

### GroupRowsState

> Describes the collapse/expand state for group rows, when [grouping is used](https://infinite-table.com/docs/learn/grouping-and-pivoting/grouping-rows.md). 

This is a class, and instances of it can be used as a value for the [`groupRowsState`](https://infinite-table.com/docs/reference/infinite-table-props.md#groupRowsState)/[`defaultGroupRowsState`](https://infinite-table.com/docs/reference/infinite-table-props.md#defaultGroupRowsState) props.

It's the sole argument available in the [`onGroupRowsStateChange`](https://infinite-table.com/docs/reference/datasource-props/index.md#onGroupRowsStateChange) callback.

It gives you the following additional utility methods:

 - `getState()`
 - `areAllExpanded()`
 - `areAllCollapsed()`
 - `expandAll()`
 - `collapseAll()`
 - `isGroupRowExpanded(keys: any[][])`
 - `isGroupRowCollapsed(keys: any[][])`
 - `expandGroupRow(keys: any[][])`
 - `collapseGroupRow(keys: any[][])`
 - `toggleGroupRow(keys: any[][])`

To create an instance, pass a plain object that describes the [`groupRowsState`](https://infinite-table.com/docs/reference/infinite-table-props.md#groupRowsState)/[`defaultGroupRowsState`](https://infinite-table.com/docs/reference/infinite-table-props.md#defaultGroupRowsState) value:

```tsx
const state = new GroupRowsState({
  expandedRows: true,
  collapsedRows: [
    ['Europe']
    ['Europe','France'],
    ['Italy']
  ]
})

console.log(state.getState())
// will log the above object that was used 
// as the sole argument for the constructor

```

When you call those methods, be aware you're not updating the React state! So you'll have to clone the object, call the method on the clone and then update the React state - in the code below, notice the `onClick` code for the `Expand all`/`Collapse all` buttons.

**Example: Using the expandAll/collapseAll methods with cloning the GroupRowsState instance**

```ts
import {
  InfiniteTable,
  DataSource,
  GroupRowsState,
} from '@infinite-table/infinite-react';
import type {
  DataSourcePropGroupBy,
  InfiniteTablePropColumns,
} from '@infinite-table/infinite-react';
import * as React from 'react';

const groupBy: DataSourcePropGroupBy<Developer> = [
  {
    field: 'country',
    column: {
      header: 'Country group',
      renderGroupValue: ({ value }) => <>Country: {value}</>,
    },
  },
  {
    field: 'stack',
  },
];

const columns: InfiniteTablePropColumns<Developer> = {
  country: {
    field: 'country',
    // specifying a style here for the column
    // note: it will also be "picked up" by the group column
    // if you're grouping by the 'country' field
    style: {
      color: 'tomato',
    },
  },
  firstName: { field: 'firstName' },
  age: { field: 'age' },
  salary: {
    field: 'salary',
    type: 'number',
  },

  canDesign: { field: 'canDesign' },
  stack: { field: 'stack' },
};

export default function App() {
  const [groupRowsState, setGroupRowsState] = React.useState<
    GroupRowsState<string>
  >(() => {
    const groupRowsState = new GroupRowsState<string>({
      collapsedRows: true,
      expandedRows: [['Mexico'], ['Mexico', 'backend'], ['India']],
    });

    return groupRowsState;
  });

  return (
    <>
      <button
        onClick={() => {
          const newState = new GroupRowsState<string>(groupRowsState);
          newState.expandAll();
          setGroupRowsState(newState);
        }}
      >
        Expand all
      </button>
      <button
        onClick={() => {
          const newState = new GroupRowsState<string>(groupRowsState);
          newState.collapseAll();
          setGroupRowsState(newState);
        }}
      >
        Collapse all
      </button>
      <DataSource<Developer>
        data={dataSource}
        primaryKey="id"
        groupBy={groupBy}
        groupRowsState={groupRowsState}
        onGroupRowsStateChange={setGroupRowsState}
      >
        <InfiniteTable<Developer>
          debugId="using-group-rows-state-controlled-example"
          columns={columns}
        />
      </DataSource>
    </>
  );
}

const dataSource = () => {
  return fetch(process.env.NEXT_PUBLIC_BASE_URL + '/developers1k')
    .then((r) => r.json())
    .then((data: Developer[]) => data);
};

type Developer = {
  id: number;
  firstName: string;
  lastName: string;
  country: string;
  city: string;
  currency: string;
  email: string;
  preferredLanguage: string;
  stack: string;
  canDesign: 'yes' | 'no';
  hobby: string;
  salary: number;
  age: number;
};
```

### DataSourcePivotBy

> Describes a pivot value for the grid.

This is the type for the items in the [`pivotBy`](https://infinite-table.com/docs/reference/datasource-props/index.md#pivotBy) array prop of the `DataSource` component.

The most important property in this type is the `field` - which will be `keyof DATA_TYPE` - the field to pivot by.

Another important property in this type is the `column`. It will be used to configure the generated pivot columns:

- if it's an object literal, it will be applied to all generated columns
- if it's a function, it will be called for each generated column, and the return value will be used to configure the column.

```tsx
const pivotBy: DataSourcePivotBy<Developer>[] = [
  { field: 'country' },
  {
    field: 'canDesign',
    column: ({ column: pivotCol }) => {
      const lastKey =
        pivotCol.pivotGroupKeys[pivotCol.pivotGroupKeys.length - 1];

      return {
        header: lastKey === 'yes' ? '💅 Designer' : '💻 Non-designer',
      };
    },
  },
];
```

### InfiniteTableColumnHeaderParam

> Represents runtime information passed to rendering and styling functions called when rendering the column headers

This object is passed to [`headerClassName`](https://infinite-table.com/docs/reference/infinite-table-props.md#headerClassName), [`headerStyle`](https://infinite-table.com/docs/reference/infinite-table-props.md#headerStyle), [`header`](https://infinite-table.com/docs/reference/infinite-table-props.md#header) and [`renderHeader`](https://infinite-table.com/docs/reference/infinite-table-props.md#renderHeader) functions.

It is an object with the following properties:

- `column` - see [`InfiniteTableComputedColumn`](https://infinite-table.com/docs/reference/type-definitions/index.md#InfiniteTableComputedColumn) for details
- `columnSortInfo` - the current sort info for the column. it will be an object of type [`DataSourceSingleSortInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourceSingleSortInfo) or `null`.
- `filtered: boolean` - if the column is currently filtered or not
- `api` - [`InfiniteTableApi`](https://infinite-table.com/docs/reference/api/index.md) - the api object.
- `columnApi` - [`InfiniteTableColumnApi`](https://infinite-table.com/docs/reference/column-api/index.md) - the column api object.
- `renderBag` - an object with various JSX values, the default elements rendered by the Infinite Table for the column header. It contains the following properties:
  - `header` - the default column header text
  - `sortIcon` - the default sort icon
  - `menuIcon` - the default column menu icon
  - `filterIcon` - the default column filter icon
  - `selectionCheckBox` - the default column selection checkbox

```tsx title="Example column.renderHeader function"
const renderHeader = ({ renderBag }) => {
  return (
    <b style={{ display: 'flex', color: 'tomato', alignItems: 'center' }}>
      ({renderBag.header}) {renderBag.sortIcon}
    </b>
  );
};
const columns = {
  salary: {
    field: 'salary',
    type: 'number',
    renderHeader,
  },
};
```

### InfiniteTableColumnStylingFnParams

> Represents runtime information passed to many styling functions called when rendering the column cells

This object is passed at runtime during the rendering of column cells.

It is an object with the following properties:

- `column` - see [`InfiniteTableComputedColumn`](https://infinite-table.com/docs/reference/type-definitions/index.md#InfiniteTableComputedColumn) for details
- `rowInfo` - see [`InfiniteTableRowInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#InfiniteTableRowInfo) for details
- `data` - the data object for the current row. The type of this object is `DATA_TYPE | Partial<DATA_TYPE> | null`. For regular rows, it will be of type `DATA_TYPE`, while for group rows it will be `Partial<DATA_TYPE>`. For rows not yet loaded (because of batching being used), it will be `null`.
- `value` - the underlying value of the current cell - will generally be `data[column.field]`, if the column is bound to a `field` property
- `inEdit`: `boolean`
- `editError`: `Error`
- `rowSelected`: `boolean | null;`
- `rowActive`: `boolean | null`
- `rowHasSelectedCells`: `boolean` - if the current row has selected cells or not

The following functions all have this as first argument:

- [`columns.style`](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.style)
- [`columns.className`](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.className)

### InfiniteTableStylingFnParams

> Represents runtime information passed to many styling functions called when rendering rows/cells

This object is passed at runtime during the rendering of grid rows/cells.

It is an object with the following properties:

- `rowInfo` - see [`InfiniteTableRowInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#InfiniteTableRowInfo) for details
- `rowIndex`: `number` - the index of the row
- `rowHasSelectedCells`: `boolean` - if the current row has selected cells or not

The following functions all have this as first argument:

- [`rowStyle`](https://infinite-table.com/docs/reference/infinite-table-props.md#rowStyle)
- [`rowClassName`](https://infinite-table.com/docs/reference/infinite-table-props.md#rowClassName)
- [`rowProps`](https://infinite-table.com/docs/reference/infinite-table-props.md#rowProps)

### DataSourceSingleSortInfo

> Represents information on a specific sort. Contains info about the field to sort by, the sort direction, and the sort type.

This is the referenced by the [`sortInfo`](https://infinite-table.com/docs/reference/datasource-props/index.md#sortInfo) prop.

Basically the [`sortInfo`](https://infinite-table.com/docs/reference/datasource-props/index.md#sortInfo) prop can be either an array of [`DataSourceSingleSortInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourceSingleSortInfo) objects, or a single [`DataSourceSingleSortInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourceSingleSortInfo) object (or null).

These are the type properties:

- `dir`: `1 | -1` - 1 means ascending sort order; -1 means descending sort order.
- `field?`: `keyof DATA_TYPE` - the field to sort by.
- `id?`: `string` - an id for the sort info. When a column is not bound to a `field`, use the column id as the `id` property of the sort info, if you need to specify a default sort order by that column. Note that columns have a [valueGetter](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.valueGetter), which will be used when doing local sorting and the column is not bound to an exact field.
- `type?`: `string` - the sort type to apply. See [`sortType`](https://infinite-table.com/docs/reference/datasource-props/index.md#sortType) for more details. For example, you can use `"string"` or `"number"` or `"date"`

### DataSourcePropSortInfo

> The type of the [`sortInfo`](https://infinite-table.com/docs/reference/datasource-props/index.md#sortInfo) DataSource prop.

Valid types for this prop are:

- `null`
- [`DataSourceSingleSortInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourceSingleSortInfo)
- [`DataSourceSingleSortInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourceSingleSortInfo)[]

### DataSourcePropGroupBy

> The type of the [`groupBy`](https://infinite-table.com/docs/reference/datasource-props/index.md#groupBy) prop. Basically this type is an array of [`DataSourceGroupBy`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourceGroupBy).

### InfiniteTableComputedColumn

> This represents an enhanced column definition for a column. A computed column is basically a column with more information computed at runtime, based on everything Infinite Table can aggregate about it.

This type also includes the properties of the `InfinteTableColumn` type: [`columns.id`](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.id), [`columns.field`](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.field), [`columns.valueGetter`](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.valueGetter), etc.

Additional type properties:

- `id`: `string` - the id of the column. This is the same as the [`columns.id`](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.id) prop.
- `computedEditable`: `boolean| Function` - whether this column is ediable or not. See [`columns.defaultEditable`](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.defaultEditable) for more details.
- `computedWidth`: `number` - the actual calculated width of the column (in pixels) that will be used for rendering. This is computed based on the [`columns.defaultWidth`](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.defaultWidth), [`columns.defaultFlex`](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.defaultFlex) and other min/max constraints.
- `computedPinned`: `false | "start" | "end"`
- `computedSortInfo`: [`DataSourceSingleSortInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourceSingleSortInfo) or null - the sort info for this column.
- `computedSorted`: `boolean` - whether this column is currently sorted or not.
- `computedSortedAsc`: `boolean` - whether this column is currently sorted ascending or not.
- `computedSortedDesc`: `boolean` - whether this column is currently sorted descending or not.
- `computedFiltered`: `boolean` - whether this column is currently filtered or not.
- ... and more (docs coming soon)

### InfiniteTableColumnCellContextType

> The type for the parameter of [`columns.renderValue`](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.renderValue) (and related rendering functions) and also for the object you get back when you call [`useInfiniteColumnCell`](https://infinite-table.com/docs/reference/hooks/index.md#useInfiniteColumnCell)

These are the type properties:

- `isGroupRow`: `boolean` - whether the current row is a group row or not.
- `data`: `DATA_TYPE` | `Partial<DATA_TYPE>` | `null` - the data object for the current row.
  Because the DataSource can be grouped, the `data` object can be either the original data object, or a partial data object (containing the aggregated values - in case of a group row), or null. You can use `isGroupRow` to discriminate between these cases. If `isGroupRow` is `false`, then `data` is of type `DATA_TYPE`.
- `rowInfo`: [`InfiniteTableRowInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#InfiniteTableRowInfo). See that type for more details.
- `rawValue`: `string` | `number` | other - the raw value for the cell - as computed from the [column field](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.field) or [valueGetter](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.valueGetter) function.
- `value`: `Renderable` - the current value to render for the cell. This is based on the `rawValue`, but if a [column valueFormatter](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.valueFormatter) exists, it will be the result of that.
- `column`: [`InfiniteTableComputedColumn`](https://infinite-table.com/docs/reference/type-definitions/index.md#InfiniteTableComputedColumn) - the (computed) column definition for the current cell.
- `columnsMap`: a map collection of [`InfiniteTableComputedColumn`](https://infinite-table.com/docs/reference/type-definitions/index.md#InfiniteTableComputedColumn) objects, keyed by column id.
- `fieldsToColumn`: a map collection of [`InfiniteTableComputedColumn`](https://infinite-table.com/docs/reference/type-definitions/index.md#InfiniteTableComputedColumn) objects, keyed by the column field. If a column is not bound to a field, it will not be included in this map.
- `align`: the computed value of the [align](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.align) prop for the current cell. This will be `"start"`, `"center"` or `"end"`.
- `api`: [`InfiniteTableApi`](https://infinite-table.com/docs/reference/api/index.md) - the api object.
- `rowInfo`: [`InfiniteTableRowInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#InfiniteTableRowInfo) - the row info for the current row.
- `rowIndex`: `number` - the index of the current row.
- `renderBag`: See [column rendering](https://infinite-table.com/docs/learn/columns/column-rendering.md#rendering-pipeline) for more details.
- `toggleCurrentGroupRow`: `() => void` - a function that can be used to toggle the current row, if it's a group row.
- `toggleCurrentTreeNode`: `() => void` - a function that can be used to toggle the expand/collapse state of the current tree node (only available when rendering [a tree grid](https://infinite-table.com/docs/learn/tree-grid/overview.md)).
- `rootGroupBy`: [`DataSourceGroupBy`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourceGroupBy) - the group by specified in the [`groupBy`](https://infinite-table.com/docs/reference/datasource-props/index.md#groupBy) prop of the `DataSource`.
- `groupByForColumn`: available for group columns. When [`groupRenderStrategy`](https://infinite-table.com/docs/reference/infinite-table-props.md#groupRenderStrategy) is `"multi-column"`, this will be a single [`DataSourcePropGroupBy`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourcePropGroupBy), for each of the generated group columns. When [`groupRenderStrategy`](https://infinite-table.com/docs/reference/infinite-table-props.md#groupRenderStrategy) is `"single-column"`, this will be an array of [`DataSourcePropGroupBy`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourcePropGroupBy) objects - it will be available only in the single group column that will be generated.

### InfiniteColumnEditorContextType

> The type for the object you get back when you call [`useInfiniteColumnEditor`](https://infinite-table.com/docs/reference/hooks/index.md#useInfiniteColumnEditor)

These are the type properties:

- `api`: [`InfiniteTableApi`](https://infinite-table.com/docs/reference/api/index.md) - the api object.
- `initialValue`: `any` - the initial value for the editor.
- `value`: `any` - the current value for the editor. Initially will be the same as `initialValue`. If you use this value, then your editor is "controlled", so make sure that when the editor is changed, you call the `setValue` function with the new value.
- `setValue`: `(value: any) => void` - should be called to update the value in the cell editor. Calling this does not complete the edit.
- `confirmEdit`: a reference to [InfiniteTableApi.confirmEdit](https://infinite-table.com/docs/reference/api/index.md#confirmEdit). If you have called `setValue` while editing (meaning your editor was controlled), you don't have to pass any parameters to this function. - the last value of the editor will be used. If your editor is uncontrolled and you haven't called `setValue`, you need to call `confirmEdit` with the value that you want to confirm for the edit.

- `cancelEdit`: a reference to [InfiniteTableApi.cancelEdit](https://infinite-table.com/docs/reference/api/index.md#cancelEdit). Call this to cancel the edit and close the editor. Doesn't require any parameters.
- `rejectEdit`: a reference to [InfiniteTableApi.rejectEdit](https://infinite-table.com/docs/reference/api/index.md#rejectEdit). Call this to reject the edit and close the editor. You can pass an `Error` object when calling this function to specify the reason for the rejection.
- `readOnly`: `boolean` - whether the cell is read-only or not.

Inside the [`useInfiniteColumnEditor`](https://infinite-table.com/docs/reference/hooks/index.md#useInfiniteColumnEditor) hook, you can still call [`useInfiniteColumnCell`](https://infinite-table.com/docs/reference/hooks/index.md#useInfiniteColumnCell) to get access to the cell-related information.

### DataSourceGroupBy

> The type for the objects in the [`groupBy`](https://infinite-table.com/docs/reference/datasource-props/index.md#groupBy) array. See related [`DataSourcePropGroupBy`](https://infinite-table.com/docs/reference/type-definitions/index.md#DataSourcePropGroupBy)

The type is generic, and the generic type parameter is the type of the data in the grid. In this documentation, either `DATA_TYPE` or `T` will be used to refer to the generic type parameter.

These are the type properties:

- `field` - `keyof DATA_TYPE`. The field to group by.
- `column`: `Partial<InfiniteTableColumn>`
- `toKey?`: `(value: any, data: DATA_TYPE) => any` - a function that can be used to decide the bucket where each data object from the data set will be placed. If not provided, the `field` value will be used.

### InfiniteTableRowInfo

> Type for `rowInfo` object representing rows in the table. See [Using RowInfo](https://infinite-table.com/docs/learn/rows/using-row-info.md) for more details.

The type is generic, and the generic type parameter is the type of the data in the grid. In this documentation, either `DATA_TYPE` or `T` will be used to refer to the generic type parameter.

Many methods in Infinite Table are called with `rowInfo` objects that are typed to [`InfiniteTableRowInfo`](https://infinite-table.com/docs/reference/type-definitions/index.md#InfiniteTableRowInfo). (see [`columns.style`](https://infinite-table.com/docs/reference/infinite-table-props.md#columns.style), [`rowStyle`](https://infinite-table.com/docs/reference/infinite-table-props.md#rowStyle), [`rowClassName`](https://infinite-table.com/docs/reference/infinite-table-props.md#rowClassName), [`persistEdit`](https://infinite-table.com/docs/reference/infinite-table-props.md#persistEdit), [`onEditAccepted`](https://infinite-table.com/docs/reference/infinite-table-props.md#onEditAccepted) and many others)

This is a discriminated type, based on the `dataSourceHasGrouping` boolean property and the `isGroupRow` boolean property. This means that the type of the object will change based on the value of those properties.

```ts

export type InfiniteTableRowInfo<T> =
  // dataSourceHasGrouping = false, isGroupRow = false
  | InfiniteTable_NoGrouping_RowInfoNormal<T>;

  // dataSourceHasGrouping = true, isGroupRow = false
  | InfiniteTable_HasGrouping_RowInfoNormal<T>

   // dataSourceHasGrouping = true, isGroupRow = true
  | InfiniteTable_HasGrouping_RowInfoGroup<T>

  // tree scenarios - leaf node
  | InfiniteTable_Tree_RowInfoLeafNode<T>

  // tree scenarios - parent node
  | InfiniteTable_Tree_RowInfoParentNode<T>;

```

The common properties of the type (in all discriminated cases) are:

- `id` - the primary key of the row, as retrieved using the [`idProperty`](https://infinite-table.com/docs/reference/datasource-props/index.md#idProperty) prop.
- `indexInAll` - the index in all currently visible rows.
- `rowSelected` - whether the row is selected or not - `boolean | null`.
- `rowDisabled` - whether the row is disabled or not - `boolean`.

### InfiniteTable_NoGrouping_RowInfoNormal

This type has `dataSourceHasGrouping` set to `false` and `isGroupRow` set to `false`.

Additional properties to the ones already mentioned above:

- `data` - the data for the underlying row, of type `DATA_TYPE`.
- `isGroupRow` - `false`
- `isTreeNode` - `false`
- `dataSourceHasGrouping` - `false`
- `selfLoaded` - `boolean` - useful when lazy loading is configured.

### InfiniteTable_HasGrouping_RowInfoNormal

This type has `dataSourceHasGrouping` set to `true` and `isGroupRow` set to `false`. So we're in a scenario where grouping is configured via [`groupBy`](https://infinite-table.com/docs/reference/datasource-props/index.md#groupBy), but the current row is not a group row.

Additional properties this type exposes:

- `data` - the data for the underlying row, of type `DATA_TYPE`.
- `dataSourceHasGrouping` - `true`
- `isGroupRow` - `false`
- `isTreeNode` - `false`
- `indexInGroup` - type: `number`. The index of the row in its parent group.
- `groupKeys` - type: `any[]`, but usually it's actually `string[]`. For normal rows, the group keys will have all the keys starting from the topmost parent down to the last group row in the hierarchy (the direct parent of the current row).
- `groupBy` - type `(keyof T)[]`. Has the same structure as groupKeys, but it will contain the fields used to group the rows.
- `rootGroupBy` - type `(keyof T)[]`. The groupBy value of the DataSource component, mapped to the `groupBy.field`
- `parents` - a list of `rowInfo` objects that are the parents of the current row.
- `indexInParentGroups[]` - type: `number[]`. See below for an example
- `groupCount` - type: `number`. The count of leaf rows that the current group (in this case, the parent group) contains
- `groupNesting` - type `number`. The nesting of the parent group.
- `collapsed` - type `boolean`.
- `selfLoaded` - type: `boolean`. Useful in lazy-loading scenarios, when there is batching present. If you're not in such a scenario, the value will be `false`.

### InfiniteTable_HasGrouping_RowInfoGroup

This type has `dataSourceHasGrouping` set to `true` and `isGroupRow` set to `true`. So we're in a scenario where grouping is configured via [`groupBy`](https://infinite-table.com/docs/reference/datasource-props/index.md#groupBy) and the current row is a group row.

Additional properties this type exposes:

- `data` - the data for the underlying row, of type `Partial<DATA_TYPE> | null`. If there are [aggregations configured](https://infinite-table.com/docs/learn/grouping-and-pivoting/group-aggregations.md), then `data` will be an object that contains those aggregated values (so the shape of the object will be `Partial<DATA_TYPE>`). When no aggregations, `data` will be `null`
- `dataSourceHasGrouping` - `true`
- `isGroupRow` - `true`
- `isTreeNode` - `false`
- `error` - type: `string?`. If there was an error while loading the group (when the group row is expanded), this will contain the error message. If the group row was loaded with the `cache: true` flag sent in the server response, the error will remain on the `rowInfo` object even when you collapse the group row, otherwise, if `cache: true` was not present, the `error` property will be removed on collapse.
- `indexInGroup` - type: `number`. The index of the row in the its parent group.
- `deepRowInfoArray` - an array of `rowInfo` objects. This array contains all the (uncollapsed, so visible) row infos under this group, at any level of nesting, in the order in which they are visible in the table.
- `reducerResults` - type `Record<string, AggregationReducerResult>`. The result of the [aggregation reducers](https://infinite-table.com/docs/reference/datasource-props/index.md#aggregationReducers) for each field in the [`aggregationReducers`](https://infinite-table.com/docs/reference/datasource-props/index.md#aggregationReducers) prop.
- `groupCount` - type: `number`. The count of leaf rows that the current group (in this case, the parent group) contains
- `groupData` - type: `DATA_TYPE[]`. The array of the data of all leaf nodes (normal nodes) that are inside this group.

### InfiniteTable_Tree_RowInfoBase

The base type for row nodes when using the `<TreeDataSource />` component.

- `nodePath`: `any[]` - the path for the current row info
- `isTreeNode`: `true`
- `isParentNode`: `boolean`
- `indexInParent`: `number`
- `treeNesting`: `number` - the nesting level of the current node.

### InfiniteTable_Tree_RowInfoParentNode

The type used for parent nodes in tree scenarios.

In addition to the properties already available via `InfiniteTable_Tree_RowInfoBase`,  it adds the following properties:

- `isParentNode` - `true`
- `isTreeNode` - `true`
- `totalLeafNodesCount` - `number`
- `collapsedLeafNodesCount` - `number`

### InfiniteTable_Tree_RowInfoLeafNode

The type used for leaf nodes in tree scenarios.

In addition to the properties already available via `InfiniteTable_Tree_RowInfoBase`,  it adds the following properties:

- `isParentNode` - `false`
- `isTreeNode` - `true`