Global Undo / Redo

One history for every action — not just edits

Set config.undoRedo: true and Ctrl+Z walks back the things you actually did to the grid: a sort you didn't mean to click, a filter you spent a minute building, a column dragged to the wrong place. Ctrl+Y (or Ctrl+Shift+Z) replays them. Sorting, filtering, quick search and column resize/reorder/hide all share one ordered timeline, so undo follows your real sequence instead of two separate stacks.

Try it

Sort a column, type in the search box, drag a column header, resize one — then press Ctrl+Z a few times and watch each change peel back in order. The Undo / Redo buttons above the grid do the same thing.

Build your own buttons

There are no built-in toolbar buttons — instead the grid exposes everything you need to render your own, so they match your app. Bind to the canUndo() / canRedo() signals for the disabled state and call undo() / redo() on click:

<button (click)="grid.undo()" [disabled]="!grid.canUndo()">Undo</button>
<button (click)="grid.redo()" [disabled]="!grid.canRedo()">Redo</button>

<gridcraft #grid [columns]="columns" [dataSource]="ds" [config]="{ undoRedo: true }" />

On a touch device those buttons are how people reach undo — there is no keyboard, so render controls if your users are on tablets or phones.

It respects a cell editor

While you're typing in a cell, Ctrl+Z undoes your text, not the grid — the editor keeps its own undo. The grid's history only takes over once the editor is closed. And undo is scoped to the grid you're working in: two grids on one page don't undo each other.

Off by default

Grid-operation undo is opt-in — set undoRedo: true to turn it on. Existing cell-edit undo is unaffected: it keeps working with or without this flag.

Cap the depth or narrow the scope

Pass an object instead of true:

readonly config: GridConfig<Person> = {
  undoRedo: {
    depth: 20,                       // keep the last 20 steps (default 50)
    operations: ['sort', 'filter'],  // record only these (default: all)
  },
};