CellChange – React Grid Docs

CellChange type is used by onCellsChanged callback in ReactGrid component. CellChange represents mutually exclusive changes to a single cell.

CellTypes utility type extracts all possible cell types based on Cell interface.

Basic usage cases

const handleChangesOnDefaults = (changes: CellChange[]) => { // evaluates as `Change<TextCell> | Change<Datecell> | ...`
  changes.forEach(change => {
    if (change.type === 'checkbox') {
      console.log(change.newCell.checked);
      console.log(change.initialCell.checked);
    }
  });
};
 
const handleChangesOnDefaultsAndFlagCell = (changes: CellChange<DefaultCellTypes | FlagCell>[]) => { // evaluates as `Change<TextCell> | Change<Datecell> | ... | Change<FlagCell>`
  changes.forEach(change => {
    if (change.type === 'flag') {
      // `FlagCell` specyfic fields are now available
      console.log(change.newCell.text);
      console.log(change.initialCell.text);
    }
  });
};
 
const handleChangesOnlyOnDateCell = (changes: CellChange<DateCell>[]) => { // evaluates as `Change<DateCell>`
  changes.forEach(change => {
    // only available type is now `date`
    if (change.type === 'date') {
      console.log(change.newCell.date);
      console.log(change.initialCell.date);
    }
  });
};

Definition

type CellChange<TCell extends Cell = DefaultCellTypes & Cell> = TCell extends Cell ? Change<TCell> : never;
 
interface Change<TCell extends Cell = DefaultCellTypes> {
    readonly rowId: Id;
    readonly columnId: Id;
    readonly type: TCell['type'];
    readonly initialCell: TCell;
    readonly newCell: TCell;
}

TCell is type that extends common Cell type. It can be one of default cell types or one of yours. Read more about creating custom cell templates.

Properties

Property name	Type	Property description
`rowId`	`Id`	Row `Id` where the change ocurred
`columnId`	`Id`	Column `Id` where the change ocurred
`type`	`CellTypes<TCell>`	Extracted cell type of `TCell` e.g. `text`, `group`
`initialCell`	`TCell extends Cell =` `Cell`	Old content of the cell
`newCell`	`TCell extends Cell =` `Cell`	New content of the cell

Types Compatible