@progress/kendo-angular-grid 19.2.0-develop.4 → 19.2.0-develop.6

package/aggregates/selection-aggregate.service.d.ts

@@ -7,7 +7,6 @@ import { CellSelectionItem, SelectionEvent } from '../selection/types';
 import { RowArgs } from '../rendering/common/row-args';
 import { ContextService } from '../common/provider.service';
 import { ColumnInfoService } from '../common/column-info.service';
-import { LocalDataChangesService } from '../editing/local-data-changes.service';
 import * as i0 from "@angular/core";
 /**
  * @hidden
@@ -22,13 +21,12 @@ interface GroupedAggregates {
  */
 export declare class CellSelectionAggregateService {
     private ctx;
-    private dataChanges;
     private columnInfoService;
     selectedItems: Array<CellSelectionItem | RowArgs>;
     groupedAggregates: GroupedAggregates;
     aggregates: SelectionAggregates;
     private sub;
-    constructor(ctx: ContextService, dataChanges: LocalDataChangesService, columnInfoService: ColumnInfoService);
+    constructor(ctx: ContextService, columnInfoService: ColumnInfoService);
     ngOnDestroy(): void;
     isAggregateIncluded(aggregate: SelectionAggregate): boolean;
     init(): void;

package/common/provider.service.d.ts

@@ -7,6 +7,7 @@ import { LocalizationService } from '@progress/kendo-angular-l10n';
 import type { GridComponent } from '../grid.component';
 import { GridToolbarNavigationService } from '../rendering/toolbar/toolbar-navigation.service';
 import type { GroupBindingDirective } from '../grouping/group-scroll-binding.directive';
+import { DataBindingDirective } from '../databinding.directive';
 import * as i0 from "@angular/core";
 /**
  * @hidden
@@ -24,7 +25,7 @@ export declare class ContextService {
     topToolbarNavigation: GridToolbarNavigationService;
     bottomToolbarNavigation: GridToolbarNavigationService;
     navigable: boolean;
-    groupBindingDirective: GroupBindingDirective;
+    dataBindingDirective: DataBindingDirective | GroupBindingDirective;
     constructor(renderer: Renderer2, localization: LocalizationService);
     static ɵfac: i0.ɵɵFactoryDeclaration<ContextService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<ContextService>;

package/databinding.directive.d.ts

@@ -10,6 +10,7 @@ import { GridDataResult } from './data/data.collection';
 import { LocalDataChangesService } from './editing/local-data-changes.service';
 import { RowReorderEvent } from './row-reordering/types';
 import { RowReorderService } from './row-reordering/row-reorder.service';
+import { ContextService } from './common/provider.service';
 import * as i0 from "@angular/core";
 /**
  * A directive that handles in-memory data operations like [paging]({% slug paging_grid %}),
@@ -67,7 +68,7 @@ export declare class DataBindingDirective implements OnInit, OnDestroy, DoCheck,
     private stateChangeSubscription;
     private dataChangedSubscription;
     private rowReorderSubscription;
-    constructor(grid: GridComponent, changeDetector?: ChangeDetectorRef, localDataChangesService?: LocalDataChangesService, rowReorderService?: RowReorderService);
+    constructor(grid: GridComponent, changeDetector?: ChangeDetectorRef, localDataChangesService?: LocalDataChangesService, rowReorderService?: RowReorderService, ctx?: ContextService);
     /**
      * @hidden
      */

package/esm2022/aggregates/selection-aggregate.service.mjs

@@ -5,19 +5,16 @@
 import { Injectable } from '@angular/core';
 import { ContextService } from '../common/provider.service';
 import { ColumnInfoService } from '../common/column-info.service';
-import { LocalDataChangesService } from '../editing/local-data-changes.service';
 import { recursiveFlatMap } from '../utils';
 import { Subscription } from 'rxjs';
 import * as i0 from "@angular/core";
 import * as i1 from "../common/provider.service";
-import * as i2 from "../editing/local-data-changes.service";
-import * as i3 from "../common/column-info.service";
+import * as i2 from "../common/column-info.service";
 /**
  * @hidden
  */
 export class CellSelectionAggregateService {
     ctx;
-    dataChanges;
     columnInfoService;
     selectedItems = [];
     groupedAggregates = { dates: [], numbers: [], booleans: [] };
@@ -33,9 +30,8 @@ export class CellSelectionAggregateService {
         latest: null
     };
     sub = new Subscription();
-    constructor(ctx, dataChanges, columnInfoService) {
+    constructor(ctx, columnInfoService) {
         this.ctx = ctx;
-        this.dataChanges = dataChanges;
         this.columnInfoService = columnInfoService;
     }
     ngOnDestroy() {
@@ -196,9 +192,9 @@ export class CellSelectionAggregateService {
         this.aggregates['isFalse'] = this.aggregates['isTrue'] = null;
         this.aggregates['earliest'] = this.aggregates['latest'] = null;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CellSelectionAggregateService, deps: [{ token: i1.ContextService }, { token: i2.LocalDataChangesService }, { token: i3.ColumnInfoService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CellSelectionAggregateService, deps: [{ token: i1.ContextService }, { token: i2.ColumnInfoService }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CellSelectionAggregateService });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CellSelectionAggregateService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i1.ContextService }, { type: i2.LocalDataChangesService }, { type: i3.ColumnInfoService }]; } });
+        }], ctorParameters: function () { return [{ type: i1.ContextService }, { type: i2.ColumnInfoService }]; } });

package/esm2022/common/provider.service.mjs

@@ -23,7 +23,7 @@ export class ContextService {
     topToolbarNavigation;
     bottomToolbarNavigation;
     navigable;
-    groupBindingDirective;
+    dataBindingDirective;
     constructor(renderer, localization) {
         this.renderer = renderer;
         this.localization = localization;

package/esm2022/databinding.directive.mjs

@@ -8,10 +8,12 @@ import { GridComponent } from './grid.component';
 import { anyChanged, isPresent } from './utils';
 import { LocalDataChangesService } from './editing/local-data-changes.service';
 import { RowReorderService } from './row-reordering/row-reorder.service';
+import { ContextService } from './common/provider.service';
 import * as i0 from "@angular/core";
 import * as i1 from "./grid.component";
 import * as i2 from "./editing/local-data-changes.service";
 import * as i3 from "./row-reordering/row-reorder.service";
+import * as i4 from "./common/provider.service";
 /**
  * A directive that handles in-memory data operations like [paging]({% slug paging_grid %}),
  * [sorting]({% slug sorting_grid %}), and [grouping]({% slug grouping_grid %}).
@@ -92,7 +94,7 @@ export class DataBindingDirective {
     stateChangeSubscription;
     dataChangedSubscription;
     rowReorderSubscription;
-    constructor(grid, changeDetector, localDataChangesService, rowReorderService) {
+    constructor(grid, changeDetector, localDataChangesService, rowReorderService, ctx) {
         this.grid = grid;
         this.changeDetector = changeDetector;
         this.localDataChangesService = localDataChangesService;
@@ -100,6 +102,7 @@ export class DataBindingDirective {
         if (localDataChangesService) {
             this.dataChangedSubscription = this.localDataChangesService.changes.subscribe(this.rebind.bind(this));
         }
+        ctx && (ctx.dataBindingDirective = this);
     }
     /**
      * @hidden
@@ -194,7 +197,7 @@ export class DataBindingDirective {
         this.grid.updateNavigationMetadata();
         this.dataChanged = false;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataBindingDirective, deps: [{ token: i1.GridComponent }, { token: i0.ChangeDetectorRef }, { token: i2.LocalDataChangesService }, { token: i3.RowReorderService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataBindingDirective, deps: [{ token: i1.GridComponent }, { token: i0.ChangeDetectorRef }, { token: i2.LocalDataChangesService }, { token: i3.RowReorderService }, { token: i4.ContextService }], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: DataBindingDirective, isStandalone: true, selector: "[kendoGridBinding]", inputs: { skip: "skip", sort: "sort", filter: "filter", pageSize: "pageSize", group: "group", data: ["kendoGridBinding", "data"] }, exportAs: ["kendoGridBinding"], usesOnChanges: true, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DataBindingDirective, decorators: [{
@@ -204,7 +207,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     exportAs: 'kendoGridBinding',
                     standalone: true
                 }]
-        }], ctorParameters: function () { return [{ type: i1.GridComponent }, { type: i0.ChangeDetectorRef }, { type: i2.LocalDataChangesService }, { type: i3.RowReorderService }]; }, propDecorators: { skip: [{
+        }], ctorParameters: function () { return [{ type: i1.GridComponent }, { type: i0.ChangeDetectorRef }, { type: i2.LocalDataChangesService }, { type: i3.RowReorderService }, { type: i4.ContextService }]; }, propDecorators: { skip: [{
                 type: Input
             }], sort: [{
                 type: Input

package/esm2022/grid.component.mjs

@@ -100,6 +100,7 @@ import { AdaptiveGridService } from './common/adaptiveness.service';
 import { AdaptiveRendererComponent } from './adaptiveness/adaptive-renderer.component';
 import { ColumnMenuService } from './column-menu/column-menu.service';
 import { MenuTabbingService } from './filtering/menu/menu-tabbing.service';
+import { GroupBindingDirective } from './grouping/group-scroll-binding.directive';
 import { DataMappingService } from './data/data-mapping.service';
 import * as i0 from "@angular/core";
 import * as i1 from "./layout/browser-support.service";
@@ -1609,12 +1610,12 @@ export class GridComponent {
         this.sort = state.sort;
         this.group = state.group;
         this.filter = state.filter;
-        this.group = state.group;
         this.skip = state.skip;
         this.pageSize = state.take;
-        this.data = state.currentData;
-        this.changeNotification.notify();
-        this.changeDetectorRef.detectChanges();
+        if (state.currentData) {
+            this.data = state.currentData;
+        }
+        this.changeDetectorRef.markForCheck();
     }
     traverseColumns(columns, callback) {
         columns.forEach((column) => {
@@ -2303,8 +2304,8 @@ export class GridComponent {
         }
         if (this.groupsService.isExpanded({ groupIndex: index }) !== expand) {
             this.groupsService.toggleRow({ index }, false);
-            if (this.ctx.groupBindingDirective) {
-                this.ctx.groupBindingDirective[`group${expand ? 'Expand' : 'Collapse'}`]({ groupIndex: index });
+            if (this.ctx.dataBindingDirective && this.ctx.dataBindingDirective instanceof GroupBindingDirective) {
+                this.ctx.dataBindingDirective[`group${expand ? 'Expand' : 'Collapse'}`]({ groupIndex: index });
             }
         }
     }

package/esm2022/grouping/group-scroll-binding.directive.mjs

@@ -196,9 +196,9 @@ export class GroupBindingDirective extends DataBindingDirective {
     groups;
     gridSubs = new Subscription();
     constructor(changeDetector, localDataChangesService, ctxService, groupsService) {
-        super(ctxService.grid, changeDetector, localDataChangesService);
+        super(ctxService.grid, changeDetector, localDataChangesService, null, ctxService);
         this.groupsService = groupsService;
-        ctxService.groupBindingDirective = this;
+        ctxService.dataBindingDirective = this;
     }
     ngOnInit() {
         super.ngOnInit();

package/esm2022/package-metadata.mjs

@@ -10,7 +10,7 @@ export const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1750933458,
-    version: '19.2.0-develop.4',
+    publishDate: 1751009984,
+    version: '19.2.0-develop.6',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };

package/esm2022/state-management/undo-redo.directive.mjs

@@ -8,15 +8,20 @@ import { GridComponent } from '../grid.component';
 import { UndoRedoEvent } from './grid-state.models';
 import { Subscription } from 'rxjs';
 import { EditService } from '../editing/edit.service';
-import { filter, tap } from 'rxjs/operators';
+import { filter } from 'rxjs/operators';
 import { UndoRedoService } from './undo-redo.service';
-import { hasObservers } from '@progress/kendo-angular-common';
+import { hasObservers, isPresent } from '@progress/kendo-angular-common';
 import { ChangeNotificationService } from '../data/change-notification.service';
+import { ContextService } from '../common/provider.service';
+import { LocalDataChangesService } from '../editing/local-data-changes.service';
+import { recursiveFlatMap } from '../utils';
 import * as i0 from "@angular/core";
 import * as i1 from "../grid.component";
 import * as i2 from "../editing/edit.service";
 import * as i3 from "./undo-redo.service";
 import * as i4 from "../data/change-notification.service";
+import * as i5 from "../common/provider.service";
+import * as i6 from "../editing/local-data-changes.service";
 /**
  * Represents the directive that manages undo-redo operations in the Grid.
  * Use this directive to enable undo and redo functionality for user actions in the Grid.
@@ -33,11 +38,17 @@ export class UndoRedoDirective {
     editService;
     undoRedoService;
     changeNotification;
+    ctx;
+    localDataChangesService;
     /**
      * Sets the maximum number of actions to keep in the undo-redo stack.
      * @default 10
      */
     maxStoredStates = 10;
+    /**
+     * Defines the property name of the data item unique key that will be used to identify the items when performing undo-redo actions.
+     */
+    itemIdKey;
     /**
      * Fires when you perform the undo action. Provides the Grid state to apply.
      */
@@ -55,11 +66,13 @@ export class UndoRedoDirective {
     stack;
     subs = new Subscription();
     addToState = true;
-    constructor(host, editService, undoRedoService, changeNotification) {
+    constructor(host, editService, undoRedoService, changeNotification, ctx, localDataChangesService) {
         this.host = host;
         this.editService = editService;
         this.undoRedoService = undoRedoService;
         this.changeNotification = changeNotification;
+        this.ctx = ctx;
+        this.localDataChangesService = localDataChangesService;
         this.host.undoRedoService = this.undoRedoService;
     }
     ngOnInit() {
@@ -71,7 +84,7 @@ export class UndoRedoDirective {
                 sort: this.host.sort,
                 filter: this.host.filter,
                 group: this.host.group
-            }, gridState: structuredClone(this.host.currentState)
+            }, gridState: this.host.currentState
         });
         this.subs = this.host.gridStateChange.subscribe((state) => {
             if (this.addToState) {
@@ -83,7 +96,7 @@ export class UndoRedoDirective {
                         filter: state.filter,
                         group: state.group
                     },
-                    gridState: structuredClone(state)
+                    gridState: state
                 });
             }
             let stackEndPointReached;
@@ -96,36 +109,72 @@ export class UndoRedoDirective {
             this.undoRedoService.stackEndReached.next(stackEndPointReached);
         });
         this.subs.add(this.editService.changes
-            .pipe(filter(event => event.action === 'save' || event.action === 'remove'), tap(event => this.undoRedoService.originalEvent = event))
+            .pipe(filter((event) => event.action === 'save' || event.action === 'remove'))
             .subscribe(event => {
             this.stack.add({
-                originalEvent: event,
-                gridState: structuredClone(this.host.currentState)
+                originalEvent: { ...event, dataItem: structuredClone(event.dataItem) },
+                gridState: this.host.currentState
             });
             this.addToState = false;
             this.host.gridStateChange.emit(this.stack.current.gridState);
             this.addToState = true;
             this.updateUndoRedoDisabled();
         }));
-        this.subs.add(this.changeNotification.changes.subscribe(() => this.stack.current.gridState = this.host.currentState));
+        this.subs.add(this.changeNotification.changes.subscribe(() => {
+            if (!this.ctx.dataBindingDirective) {
+                this.stack.current.gridState = this.host.currentState;
+            }
+        }));
         ['Undo', 'Redo'].forEach((action) => {
             this.subs.add(this.undoRedoService[`on${action}`].subscribe(() => {
                 if (!this.stack[`can${action}`]) {
                     return;
                 }
-                this.stack[`${action.toLowerCase()}`]();
+                let eventData;
+                if (action === 'Undo') {
+                    const isSaveOrRemove = this.stack.current.originalEvent.action === 'save' || this.stack.current.originalEvent.action === 'remove';
+                    eventData = isSaveOrRemove ? this.stack.current : this.stack.peekPrev();
+                }
+                else {
+                    eventData = this.stack.peekNext();
+                }
+                const event = new UndoRedoEvent(eventData);
                 if (hasObservers(this[`on${action}`])) {
-                    const event = new UndoRedoEvent(this.stack.current);
                     this[`on${action}`].emit(event);
                     if (event.isDefaultPrevented()) {
                         return;
                     }
                 }
+                this.stack[`${action.toLowerCase()}`]();
                 this.updateUndoRedoDisabled();
-                this.host.loadState(this.stack.current.gridState);
+                const originalAction = event.originalEvent.action;
+                const isLocalData = isPresent(this.ctx?.dataBindingDirective);
+                if (!isLocalData) {
+                    return;
+                }
+                const isSaveOrRemove = originalAction === 'save' || originalAction === 'remove';
+                if (isSaveOrRemove) {
+                    if (originalAction === 'save') {
+                        const stateItem = this.getGridDataItems(this.stack.current.gridState.currentData).find(item => item[this.itemIdKey] === event.originalEvent.dataItem[this.itemIdKey]);
+                        Object.assign(event.originalEvent.originalDataItem, stateItem);
+                    }
+                    else if (action === 'Undo') {
+                        this.localDataChangesService?.data.splice(event.originalEvent.rowIndex, 0, event.originalEvent.dataItem);
+                    }
+                    else {
+                        this.localDataChangesService?.data.splice(event.originalEvent.rowIndex, 1);
+                    }
+                    this.localDataChangesService?.changes.emit();
+                }
+                else {
+                    this.host.loadState({ ...this.stack.current.gridState, currentData: null });
+                    if (this.isDataStateChangeEvent(event.originalEvent)) {
+                        const { skip, take, sort, filter, group } = this.stack.current.gridState;
+                        this.host.dataStateChange.emit({ skip, take, sort, filter, group });
+                    }
+                }
             }));
         });
-        this.subs.add(this.undoRedoService.setState.subscribe((state) => this.stack.add({ originalEvent: 'dataChange', gridState: state })));
     }
     ngOnDestroy() {
         this.stack.clear();
@@ -167,8 +216,15 @@ export class UndoRedoDirective {
         }
         this.undoRedoService.stackEndReached.next(false);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UndoRedoDirective, deps: [{ token: i1.GridComponent }, { token: i2.EditService }, { token: i3.UndoRedoService }, { token: i4.ChangeNotificationService }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: UndoRedoDirective, isStandalone: true, selector: "[kendoGridUndoRedo]", inputs: { maxStoredStates: "maxStoredStates" }, outputs: { onUndo: "undo", onRedo: "redo" }, providers: [UndoRedoService], exportAs: ["kendoGridUndoRedo"], ngImport: i0 });
+    getGridDataItems(data) {
+        return Array.isArray(data) ? data.flatMap(recursiveFlatMap) :
+            data.data.flatMap(recursiveFlatMap);
+    }
+    isDataStateChangeEvent(event) {
+        return event && ['skip', 'take', 'sort', 'filter', 'group'].some(prop => prop in event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UndoRedoDirective, deps: [{ token: i1.GridComponent }, { token: i2.EditService }, { token: i3.UndoRedoService }, { token: i4.ChangeNotificationService }, { token: i5.ContextService }, { token: i6.LocalDataChangesService }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: UndoRedoDirective, isStandalone: true, selector: "[kendoGridUndoRedo]", inputs: { maxStoredStates: "maxStoredStates", itemIdKey: "itemIdKey" }, outputs: { onUndo: "undo", onRedo: "redo" }, providers: [UndoRedoService], exportAs: ["kendoGridUndoRedo"], ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UndoRedoDirective, decorators: [{
             type: Directive,
@@ -178,7 +234,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     exportAs: 'kendoGridUndoRedo',
                     providers: [UndoRedoService]
                 }]
-        }], ctorParameters: function () { return [{ type: i1.GridComponent }, { type: i2.EditService }, { type: i3.UndoRedoService }, { type: i4.ChangeNotificationService }]; }, propDecorators: { maxStoredStates: [{
+        }], ctorParameters: function () { return [{ type: i1.GridComponent }, { type: i2.EditService }, { type: i3.UndoRedoService }, { type: i4.ChangeNotificationService }, { type: i5.ContextService }, { type: i6.LocalDataChangesService }]; }, propDecorators: { maxStoredStates: [{
+                type: Input
+            }], itemIdKey: [{
                 type: Input
             }], onUndo: [{
                 type: Output,

package/esm2022/state-management/undo-redo.service.mjs

@@ -13,7 +13,6 @@ export class UndoRedoService {
     onUndo = new Subject();
     onRedo = new Subject();
     stackEndReached = new Subject();
-    setState = new Subject();
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UndoRedoService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UndoRedoService });
 }

package/esm2022/state-management/undo-redo.stack.mjs

@@ -139,6 +139,12 @@ export class UndoRedoStack {
         this.currentNode = this.currentNode.previous;
         return this.currentNode.state;
     }
+    peekNext() {
+        return this.currentNode.next?.state || null;
+    }
+    peekPrev() {
+        return this.currentNode.previous?.state || null;
+    }
     /**
      * Performs a redo operation, moving to the next state
      * @returns The next state or null if can't redo