CellChange type

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

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

Generic Change interface represents a particullar change on single cell on concrete cell template.

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.previousCell.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.previousCell.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.previousCell.date);
    }
  });
};

Definition

declare type CellChange<TCell extends Cell = DefaultCellTypes & Cell> = TCell extends Cell ? {
    /** Row's `Id` where the change ocurred */
    readonly rowId: Id;
    /** Column's `Id` where the change ocurred */
    readonly columnId: Id;
    /** Extracted cell type of `TCell` (e.g. `text`, `chevron` and so on) */
    readonly type: TCell['type'];
    /** Previous content of the cell */
    readonly previousCell: TCell;
    /** New content of the cell */
    readonly newCell: TCell;
} : never;

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 nameTypeProperty description
rowId Id Row Id where the change ocurred
columnId Id Column Id where the change ocurred
typeCellTypes<TCell>Extracted cell type of TCell e.g. text, chevron
previousCellTCell extends Cell = Cell Previous content of the cell
newCellTCell extends Cell = Cell New content of the cell

Prev:

Compatible

Next:

Uncertain