@progress/kendo-angular-grid 19.0.0-develop.10 → 19.0.0-develop.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/column-menu/column-chooser-tool.directive.d.ts +6 -6
- package/columns/column-base.d.ts +5 -0
- package/columns/span-column.component.d.ts +2 -2
- package/common/toolbar-tool-base.directive.d.ts +26 -0
- package/directives.d.ts +11 -4
- package/editing/add-command-tool.directive.d.ts +7 -6
- package/editing/cancel-command-tool.directive.d.ts +38 -0
- package/editing/edit-command-tool.directive.d.ts +38 -0
- package/editing/edit.service.d.ts +1 -1
- package/editing/remove-command-tool.directive.d.ts +39 -0
- package/editing/save-command-tool.directive.d.ts +38 -0
- package/editing/toolbar-editing-tool-base.directive.d.ts +29 -0
- package/esm2022/column-menu/column-chooser-tool.directive.mjs +17 -30
- package/esm2022/column-resizing/column-handle.directive.mjs +2 -2
- package/esm2022/columns/column-base.mjs +9 -0
- package/esm2022/columns/columns-container.mjs +1 -1
- package/esm2022/columns/span-column.component.mjs +9 -9
- package/esm2022/common/toolbar-tool-base.directive.mjs +81 -0
- package/esm2022/directives.mjs +17 -2
- package/esm2022/editing/add-command-tool.directive.mjs +12 -15
- package/esm2022/editing/cancel-command-tool.directive.mjs +64 -0
- package/esm2022/editing/edit-command-tool.directive.mjs +59 -0
- package/esm2022/editing/remove-command-tool.directive.mjs +60 -0
- package/esm2022/editing/remove-command.directive.mjs +1 -0
- package/esm2022/editing/save-command-tool.directive.mjs +64 -0
- package/esm2022/editing/toolbar-editing-tool-base.directive.mjs +91 -0
- package/esm2022/excel/excel-command-tool.directive.mjs +12 -17
- package/esm2022/grid.component.mjs +155 -40
- package/esm2022/grid.module.mjs +114 -101
- package/esm2022/index.mjs +9 -0
- package/esm2022/localization/messages.mjs +43 -1
- package/esm2022/navigation/toolbar-tool-name.mjs +17 -0
- package/esm2022/package-metadata.mjs +2 -2
- package/esm2022/pdf/pdf-command-tool.directive.mjs +12 -15
- package/esm2022/rendering/cell.component.mjs +3 -3
- package/esm2022/rendering/header/header.component.mjs +1 -1
- package/esm2022/rendering/list.component.mjs +1 -1
- package/esm2022/rendering/table-body.component.mjs +1 -1
- package/esm2022/selection/selection.service.mjs +11 -0
- package/esm2022/state-management/grid-state.models.mjs +26 -0
- package/esm2022/state-management/redo-command-tool.mjs +66 -0
- package/esm2022/state-management/undo-command-tool.mjs +66 -0
- package/esm2022/state-management/undo-redo.directive.mjs +178 -0
- package/esm2022/state-management/undo-redo.service.mjs +22 -0
- package/esm2022/state-management/undo-redo.stack.mjs +232 -0
- package/esm2022/utils.mjs +13 -0
- package/excel/excel-command-tool.directive.d.ts +5 -5
- package/fesm2022/progress-kendo-angular-grid.mjs +1213 -162
- package/grid.component.d.ts +42 -19
- package/grid.module.d.ts +107 -100
- package/index.d.ts +8 -0
- package/localization/messages.d.ts +29 -1
- package/navigation/toolbar-tool-name.d.ts +17 -0
- package/package.json +20 -20
- package/pdf/pdf-command-tool.directive.d.ts +6 -5
- package/rendering/cell.component.d.ts +1 -1
- package/schematics/ngAdd/index.js +4 -4
- package/selection/selection.service.d.ts +1 -0
- package/state-management/grid-state.models.d.ts +58 -0
- package/state-management/redo-command-tool.d.ts +38 -0
- package/state-management/undo-command-tool.d.ts +38 -0
- package/state-management/undo-redo.directive.d.ts +51 -0
- package/state-management/undo-redo.service.d.ts +19 -0
- package/state-management/undo-redo.stack.d.ts +104 -0
- package/utils.d.ts +11 -1
|
@@ -144,6 +144,7 @@ export class SelectionService {
|
|
|
144
144
|
ev.rangeStartRow = { dataItem: this.lastSelectionData, index: this.lastSelectionStartIndex };
|
|
145
145
|
ev.rangeEndRow = { dataItem: item.data, index: item.index };
|
|
146
146
|
}
|
|
147
|
+
this.syncCurrentSelection(ev);
|
|
147
148
|
this.changes.emit(ev);
|
|
148
149
|
}
|
|
149
150
|
toggle(item) {
|
|
@@ -223,6 +224,7 @@ export class SelectionService {
|
|
|
223
224
|
deselectedRows: [rowArgs],
|
|
224
225
|
selectedRows: []
|
|
225
226
|
};
|
|
227
|
+
this.syncCurrentSelection(ev);
|
|
226
228
|
this.changes.emit(ev);
|
|
227
229
|
}
|
|
228
230
|
}
|
|
@@ -295,6 +297,7 @@ export class SelectionService {
|
|
|
295
297
|
if (this.options.cellAggregates) {
|
|
296
298
|
ev.cellAggregates = this.aggregateService.onSelectionChange(ev);
|
|
297
299
|
}
|
|
300
|
+
this.syncCurrentSelection(ev);
|
|
298
301
|
this.changes.emit(ev);
|
|
299
302
|
}
|
|
300
303
|
selectRange(startIndex, endIndex, preserveSelection, existingSelections = []) {
|
|
@@ -428,6 +431,14 @@ export class SelectionService {
|
|
|
428
431
|
this.dataChangedSubscription = null;
|
|
429
432
|
}
|
|
430
433
|
}
|
|
434
|
+
syncCurrentSelection(ev) {
|
|
435
|
+
for (const row of ev.deselectedRows) {
|
|
436
|
+
this.currentSelection.splice(row.index, 1);
|
|
437
|
+
}
|
|
438
|
+
for (const row of ev.selectedRows) {
|
|
439
|
+
this.currentSelection[row.index] = row;
|
|
440
|
+
}
|
|
441
|
+
}
|
|
431
442
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SelectionService, deps: [{ token: i1.DomEventsService }, { token: i2.CellSelectionAggregateService }, { token: i3.LocalDataChangesService }, { token: i4.NavigationService }, { token: i5.ContextService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
432
443
|
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SelectionService });
|
|
433
444
|
}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { PreventableEvent } from "@progress/kendo-angular-common";
|
|
6
|
+
/**
|
|
7
|
+
* Arguments for the `undo` and `redo` events.
|
|
8
|
+
*/
|
|
9
|
+
export class UndoRedoEvent extends PreventableEvent {
|
|
10
|
+
/**
|
|
11
|
+
* The event data of the original action that triggered the state change.
|
|
12
|
+
*/
|
|
13
|
+
originalEvent;
|
|
14
|
+
/**
|
|
15
|
+
* The grid state and rendered data at the time of the action.
|
|
16
|
+
*/
|
|
17
|
+
gridState;
|
|
18
|
+
/**
|
|
19
|
+
* @hidden
|
|
20
|
+
*/
|
|
21
|
+
constructor({ originalEvent, gridState }) {
|
|
22
|
+
super();
|
|
23
|
+
this.originalEvent = originalEvent;
|
|
24
|
+
this.gridState = gridState;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { Directive } from '@angular/core';
|
|
6
|
+
import { ToolBarButtonComponent } from '@progress/kendo-angular-toolbar';
|
|
7
|
+
import { Subscription } from 'rxjs';
|
|
8
|
+
import { redoIcon } from '@progress/kendo-svg-icons';
|
|
9
|
+
import { UndoRedoService } from './undo-redo.service';
|
|
10
|
+
import * as i0 from "@angular/core";
|
|
11
|
+
import * as i1 from "./undo-redo.service";
|
|
12
|
+
import * as i2 from "@progress/kendo-angular-toolbar";
|
|
13
|
+
/**
|
|
14
|
+
* Represents the command for triggering the redo action in the Grid.
|
|
15
|
+
* You can apply this directive to any `kendo-toolbar-button` element inside a
|
|
16
|
+
* ToolbarComponent used in the Grid.
|
|
17
|
+
*
|
|
18
|
+
* When the user clicks the toolbar button that is associated with the directive, the
|
|
19
|
+
* [redo]({% slug api_grid_undoredodirective %}#toc-redo) event is triggered.
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* ```html-no-run
|
|
23
|
+
* <kendo-grid>
|
|
24
|
+
* <kendo-toolbar>
|
|
25
|
+
* <kendo-toolbar-button kendoGridRedoTool></kendo-toolbar-button>
|
|
26
|
+
* </kendo-toolbar>
|
|
27
|
+
* </kendo-grid>
|
|
28
|
+
* ```
|
|
29
|
+
*/
|
|
30
|
+
export class RedoCommandToolbarDirective {
|
|
31
|
+
undoRedoService;
|
|
32
|
+
host;
|
|
33
|
+
subs = new Subscription();
|
|
34
|
+
constructor(undoRedoService, host) {
|
|
35
|
+
this.undoRedoService = undoRedoService;
|
|
36
|
+
this.host = host;
|
|
37
|
+
}
|
|
38
|
+
ngOnInit() {
|
|
39
|
+
this.subs = this.host.click.subscribe(e => this.onClick(e));
|
|
40
|
+
this.host.className = 'k-grid-redo-command';
|
|
41
|
+
this.host.svgIcon = redoIcon;
|
|
42
|
+
this.host.icon = 'redo';
|
|
43
|
+
this.host.text = 'Redo';
|
|
44
|
+
this.host.disabled = true;
|
|
45
|
+
this.subs.add(this.undoRedoService.stackEndReached.subscribe((stackEnd) => this.host.disabled = stackEnd === 'end'));
|
|
46
|
+
}
|
|
47
|
+
ngOnDestroy() {
|
|
48
|
+
this.subs.unsubscribe();
|
|
49
|
+
}
|
|
50
|
+
/**
|
|
51
|
+
* @hidden
|
|
52
|
+
*/
|
|
53
|
+
onClick(e) {
|
|
54
|
+
e.preventDefault();
|
|
55
|
+
this.undoRedoService.onRedo.next();
|
|
56
|
+
}
|
|
57
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RedoCommandToolbarDirective, deps: [{ token: i1.UndoRedoService }, { token: i2.ToolBarButtonComponent }], target: i0.ɵɵFactoryTarget.Directive });
|
|
58
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: RedoCommandToolbarDirective, isStandalone: true, selector: "[kendoGridRedoTool]", ngImport: i0 });
|
|
59
|
+
}
|
|
60
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RedoCommandToolbarDirective, decorators: [{
|
|
61
|
+
type: Directive,
|
|
62
|
+
args: [{
|
|
63
|
+
selector: '[kendoGridRedoTool]',
|
|
64
|
+
standalone: true
|
|
65
|
+
}]
|
|
66
|
+
}], ctorParameters: function () { return [{ type: i1.UndoRedoService }, { type: i2.ToolBarButtonComponent }]; } });
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { Directive } from '@angular/core';
|
|
6
|
+
import { ToolBarButtonComponent } from '@progress/kendo-angular-toolbar';
|
|
7
|
+
import { Subscription } from 'rxjs';
|
|
8
|
+
import { undoIcon } from '@progress/kendo-svg-icons';
|
|
9
|
+
import { UndoRedoService } from './undo-redo.service';
|
|
10
|
+
import * as i0 from "@angular/core";
|
|
11
|
+
import * as i1 from "./undo-redo.service";
|
|
12
|
+
import * as i2 from "@progress/kendo-angular-toolbar";
|
|
13
|
+
/**
|
|
14
|
+
* Represents the command for triggering the undo action in the Grid.
|
|
15
|
+
* You can apply this directive to any `kendo-toolbar-button` element inside a
|
|
16
|
+
* ToolbarComponent used in the Grid.
|
|
17
|
+
*
|
|
18
|
+
* When the user clicks the toolbar button that is associated with the directive, the
|
|
19
|
+
* [undo]({% slug api_grid_undoredodirective %}#toc-undo) event is triggered.
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* ```html-no-run
|
|
23
|
+
* <kendo-grid>
|
|
24
|
+
* <kendo-toolbar>
|
|
25
|
+
* <kendo-toolbar-button kendoGridUndoTool></kendo-toolbar-button>
|
|
26
|
+
* </kendo-toolbar>
|
|
27
|
+
* </kendo-grid>
|
|
28
|
+
* ```
|
|
29
|
+
*/
|
|
30
|
+
export class UndoCommandToolbarDirective {
|
|
31
|
+
undoRedoService;
|
|
32
|
+
host;
|
|
33
|
+
subs = new Subscription();
|
|
34
|
+
constructor(undoRedoService, host) {
|
|
35
|
+
this.undoRedoService = undoRedoService;
|
|
36
|
+
this.host = host;
|
|
37
|
+
}
|
|
38
|
+
ngOnInit() {
|
|
39
|
+
this.subs = this.host.click.subscribe(e => this.onClick(e));
|
|
40
|
+
this.host.className = 'k-grid-undo-command';
|
|
41
|
+
this.host.svgIcon = undoIcon;
|
|
42
|
+
this.host.icon = 'undo';
|
|
43
|
+
this.host.text = 'Undo';
|
|
44
|
+
this.host.disabled = true;
|
|
45
|
+
this.subs.add(this.undoRedoService.stackEndReached.subscribe((stackEnd) => this.host.disabled = stackEnd === 'start'));
|
|
46
|
+
}
|
|
47
|
+
ngOnDestroy() {
|
|
48
|
+
this.subs.unsubscribe();
|
|
49
|
+
}
|
|
50
|
+
/**
|
|
51
|
+
* @hidden
|
|
52
|
+
*/
|
|
53
|
+
onClick(e) {
|
|
54
|
+
e.preventDefault();
|
|
55
|
+
this.undoRedoService.onUndo.next();
|
|
56
|
+
}
|
|
57
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UndoCommandToolbarDirective, deps: [{ token: i1.UndoRedoService }, { token: i2.ToolBarButtonComponent }], target: i0.ɵɵFactoryTarget.Directive });
|
|
58
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: UndoCommandToolbarDirective, isStandalone: true, selector: "[kendoGridUndoTool]", ngImport: i0 });
|
|
59
|
+
}
|
|
60
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UndoCommandToolbarDirective, decorators: [{
|
|
61
|
+
type: Directive,
|
|
62
|
+
args: [{
|
|
63
|
+
selector: '[kendoGridUndoTool]',
|
|
64
|
+
standalone: true
|
|
65
|
+
}]
|
|
66
|
+
}], ctorParameters: function () { return [{ type: i1.UndoRedoService }, { type: i2.ToolBarButtonComponent }]; } });
|
|
@@ -0,0 +1,178 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { Directive, EventEmitter, Input, Output } from '@angular/core';
|
|
6
|
+
import { UndoRedoStack } from './undo-redo.stack';
|
|
7
|
+
import { GridComponent } from '../grid.component';
|
|
8
|
+
import { UndoRedoEvent } from './grid-state.models';
|
|
9
|
+
import { Subscription } from 'rxjs';
|
|
10
|
+
import { EditService } from '../editing/edit.service';
|
|
11
|
+
import { filter, tap } from 'rxjs/operators';
|
|
12
|
+
import { UndoRedoService } from './undo-redo.service';
|
|
13
|
+
import { hasObservers } from '@progress/kendo-angular-common';
|
|
14
|
+
import { ChangeNotificationService } from '../data/change-notification.service';
|
|
15
|
+
import * as i0 from "@angular/core";
|
|
16
|
+
import * as i1 from "../grid.component";
|
|
17
|
+
import * as i2 from "../editing/edit.service";
|
|
18
|
+
import * as i3 from "./undo-redo.service";
|
|
19
|
+
import * as i4 from "../data/change-notification.service";
|
|
20
|
+
export class UndoRedoDirective {
|
|
21
|
+
host;
|
|
22
|
+
editService;
|
|
23
|
+
undoRedoService;
|
|
24
|
+
changeNotification;
|
|
25
|
+
/**
|
|
26
|
+
* Determines the maximum number of actions to keep in the undo-redo stack.
|
|
27
|
+
* @default 10
|
|
28
|
+
*/
|
|
29
|
+
maxStoredStates = 10;
|
|
30
|
+
/**
|
|
31
|
+
* Fires when undo action is performed. Exposes the state of the grid that will be applied.
|
|
32
|
+
*/
|
|
33
|
+
onUndo = new EventEmitter();
|
|
34
|
+
/**
|
|
35
|
+
* Fires when undo action is performed. Exposes the state of the grid that will be applied.
|
|
36
|
+
*/
|
|
37
|
+
onRedo = new EventEmitter();
|
|
38
|
+
/**
|
|
39
|
+
* Returns an array of all undo-redo actions that are currently in the stack.
|
|
40
|
+
*/
|
|
41
|
+
get undoRedoItems() {
|
|
42
|
+
return this.stack.toArray();
|
|
43
|
+
}
|
|
44
|
+
stack;
|
|
45
|
+
subs = new Subscription();
|
|
46
|
+
addToState = true;
|
|
47
|
+
constructor(host, editService, undoRedoService, changeNotification) {
|
|
48
|
+
this.host = host;
|
|
49
|
+
this.editService = editService;
|
|
50
|
+
this.undoRedoService = undoRedoService;
|
|
51
|
+
this.changeNotification = changeNotification;
|
|
52
|
+
this.host.undoRedoService = this.undoRedoService;
|
|
53
|
+
}
|
|
54
|
+
ngOnInit() {
|
|
55
|
+
this.stack = new UndoRedoStack(this.maxStoredStates);
|
|
56
|
+
this.stack.add({
|
|
57
|
+
originalEvent: {
|
|
58
|
+
skip: this.host.skip,
|
|
59
|
+
take: this.host.pageSize,
|
|
60
|
+
sort: this.host.sort,
|
|
61
|
+
filter: this.host.filter,
|
|
62
|
+
group: this.host.group
|
|
63
|
+
}, gridState: structuredClone(this.host.currentState)
|
|
64
|
+
});
|
|
65
|
+
this.subs = this.host.gridStateChange.subscribe((state) => {
|
|
66
|
+
if (this.addToState) {
|
|
67
|
+
this.stack.add({
|
|
68
|
+
originalEvent: {
|
|
69
|
+
skip: state.skip,
|
|
70
|
+
take: state.take,
|
|
71
|
+
sort: state.sort,
|
|
72
|
+
filter: state.filter,
|
|
73
|
+
group: state.group
|
|
74
|
+
},
|
|
75
|
+
gridState: structuredClone(state)
|
|
76
|
+
});
|
|
77
|
+
}
|
|
78
|
+
let stackEndPointReached;
|
|
79
|
+
if (this.stack.canUndo) {
|
|
80
|
+
stackEndPointReached = this.stack.canRedo ? false : 'end';
|
|
81
|
+
}
|
|
82
|
+
else {
|
|
83
|
+
stackEndPointReached = 'start';
|
|
84
|
+
}
|
|
85
|
+
this.undoRedoService.stackEndReached.next(stackEndPointReached);
|
|
86
|
+
});
|
|
87
|
+
this.subs.add(this.editService.changes
|
|
88
|
+
.pipe(filter(event => event.action === 'save' || event.action === 'remove'), tap(event => this.undoRedoService.originalEvent = event))
|
|
89
|
+
.subscribe(event => {
|
|
90
|
+
this.stack.add({
|
|
91
|
+
originalEvent: event,
|
|
92
|
+
gridState: structuredClone(this.host.currentState)
|
|
93
|
+
});
|
|
94
|
+
this.addToState = false;
|
|
95
|
+
this.host.gridStateChange.emit(this.stack.current.gridState);
|
|
96
|
+
this.addToState = true;
|
|
97
|
+
this.updateUndoRedoDisabled();
|
|
98
|
+
}));
|
|
99
|
+
this.subs.add(this.changeNotification.changes.subscribe(() => this.stack.current.gridState = this.host.currentState));
|
|
100
|
+
['Undo', 'Redo'].forEach((action) => {
|
|
101
|
+
this.subs.add(this.undoRedoService[`on${action}`].subscribe(() => {
|
|
102
|
+
if (!this.stack[`can${action}`]) {
|
|
103
|
+
return;
|
|
104
|
+
}
|
|
105
|
+
this.stack[`${action.toLowerCase()}`]();
|
|
106
|
+
if (hasObservers(this[`on${action}`])) {
|
|
107
|
+
const event = new UndoRedoEvent(this.stack.current);
|
|
108
|
+
this[`on${action}`].emit(event);
|
|
109
|
+
if (event.isDefaultPrevented()) {
|
|
110
|
+
return;
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
this.updateUndoRedoDisabled();
|
|
114
|
+
this.host.loadState(this.stack.current.gridState);
|
|
115
|
+
}));
|
|
116
|
+
});
|
|
117
|
+
this.subs.add(this.undoRedoService.setState.subscribe((state) => this.stack.add({ originalEvent: 'dataChange', gridState: state })));
|
|
118
|
+
}
|
|
119
|
+
ngOnDestroy() {
|
|
120
|
+
this.stack.clear();
|
|
121
|
+
this.stack = null;
|
|
122
|
+
this.subs.unsubscribe();
|
|
123
|
+
}
|
|
124
|
+
/**
|
|
125
|
+
* Re-applies the last action, reverted by the `undo` method.
|
|
126
|
+
*/
|
|
127
|
+
redo() {
|
|
128
|
+
if (this.stack.canRedo) {
|
|
129
|
+
this.stack.redo();
|
|
130
|
+
this.host.loadState(this.stack.current.gridState);
|
|
131
|
+
if (!this.stack.canRedo) {
|
|
132
|
+
this.undoRedoService.stackEndReached.next('end');
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
}
|
|
136
|
+
/**
|
|
137
|
+
* Reverts the last user action.
|
|
138
|
+
*/
|
|
139
|
+
undo() {
|
|
140
|
+
if (this.stack.canUndo) {
|
|
141
|
+
this.stack.undo();
|
|
142
|
+
this.host.loadState(this.stack.current.gridState);
|
|
143
|
+
if (!this.stack.canUndo) {
|
|
144
|
+
this.undoRedoService.stackEndReached.next('start');
|
|
145
|
+
}
|
|
146
|
+
}
|
|
147
|
+
}
|
|
148
|
+
updateUndoRedoDisabled() {
|
|
149
|
+
if (!this.stack.canRedo) {
|
|
150
|
+
this.undoRedoService.stackEndReached.next('end');
|
|
151
|
+
return;
|
|
152
|
+
}
|
|
153
|
+
if (!this.stack.canUndo) {
|
|
154
|
+
this.undoRedoService.stackEndReached.next('start');
|
|
155
|
+
return;
|
|
156
|
+
}
|
|
157
|
+
this.undoRedoService.stackEndReached.next(false);
|
|
158
|
+
}
|
|
159
|
+
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 });
|
|
160
|
+
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 });
|
|
161
|
+
}
|
|
162
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UndoRedoDirective, decorators: [{
|
|
163
|
+
type: Directive,
|
|
164
|
+
args: [{
|
|
165
|
+
selector: '[kendoGridUndoRedo]',
|
|
166
|
+
standalone: true,
|
|
167
|
+
exportAs: 'kendoGridUndoRedo',
|
|
168
|
+
providers: [UndoRedoService]
|
|
169
|
+
}]
|
|
170
|
+
}], ctorParameters: function () { return [{ type: i1.GridComponent }, { type: i2.EditService }, { type: i3.UndoRedoService }, { type: i4.ChangeNotificationService }]; }, propDecorators: { maxStoredStates: [{
|
|
171
|
+
type: Input
|
|
172
|
+
}], onUndo: [{
|
|
173
|
+
type: Output,
|
|
174
|
+
args: ['undo']
|
|
175
|
+
}], onRedo: [{
|
|
176
|
+
type: Output,
|
|
177
|
+
args: ['redo']
|
|
178
|
+
}] } });
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { Injectable } from '@angular/core';
|
|
6
|
+
import { Subject } from 'rxjs';
|
|
7
|
+
import * as i0 from "@angular/core";
|
|
8
|
+
/**
|
|
9
|
+
* @hidden
|
|
10
|
+
*/
|
|
11
|
+
export class UndoRedoService {
|
|
12
|
+
originalEvent;
|
|
13
|
+
onUndo = new Subject();
|
|
14
|
+
onRedo = new Subject();
|
|
15
|
+
stackEndReached = new Subject();
|
|
16
|
+
setState = new Subject();
|
|
17
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UndoRedoService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
18
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UndoRedoService });
|
|
19
|
+
}
|
|
20
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UndoRedoService, decorators: [{
|
|
21
|
+
type: Injectable
|
|
22
|
+
}] });
|
|
@@ -0,0 +1,232 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { isPresent } from "@progress/kendo-angular-common";
|
|
6
|
+
/**
|
|
7
|
+
* @hidden
|
|
8
|
+
* A linked-list based implementation of an undo-redo stack.
|
|
9
|
+
* Maintains a chain of states that can be navigated forward and backward.
|
|
10
|
+
*/
|
|
11
|
+
export class UndoRedoStack {
|
|
12
|
+
maxSize;
|
|
13
|
+
/** The current active node in the undo-redo history */
|
|
14
|
+
currentNode = null;
|
|
15
|
+
/** The root node of the stack (first state) */
|
|
16
|
+
rootNode = null;
|
|
17
|
+
/** Track the size of the stack */
|
|
18
|
+
_size = 0;
|
|
19
|
+
/**
|
|
20
|
+
* Creates a new UndoRedoStack.
|
|
21
|
+
* @param maxSize Optional maximum number of states to maintain (unlimited if not provided)
|
|
22
|
+
*/
|
|
23
|
+
constructor(maxSize = -1) {
|
|
24
|
+
this.maxSize = maxSize;
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* Gets the current number of states in the stack
|
|
28
|
+
*/
|
|
29
|
+
get size() {
|
|
30
|
+
return this._size;
|
|
31
|
+
}
|
|
32
|
+
/**
|
|
33
|
+
* Gets the current active state
|
|
34
|
+
*/
|
|
35
|
+
get current() {
|
|
36
|
+
return this.currentNode ? this.currentNode.state : null;
|
|
37
|
+
}
|
|
38
|
+
/**
|
|
39
|
+
* Checks if undo is available (if there's a previous state)
|
|
40
|
+
*/
|
|
41
|
+
get canUndo() {
|
|
42
|
+
return isPresent(this.currentNode?.previous);
|
|
43
|
+
}
|
|
44
|
+
/**
|
|
45
|
+
* Checks if redo is available (if there's a next state)
|
|
46
|
+
*/
|
|
47
|
+
get canRedo() {
|
|
48
|
+
return isPresent(this.currentNode?.next);
|
|
49
|
+
}
|
|
50
|
+
/**
|
|
51
|
+
* Adds a new state to the undo-redo stack
|
|
52
|
+
* @param state The state to add
|
|
53
|
+
* @param id Optional identifier for the state
|
|
54
|
+
* @returns The newly created node
|
|
55
|
+
*/
|
|
56
|
+
add(state, id) {
|
|
57
|
+
const newNode = {
|
|
58
|
+
state,
|
|
59
|
+
previous: this.currentNode,
|
|
60
|
+
next: null,
|
|
61
|
+
id
|
|
62
|
+
};
|
|
63
|
+
// If we have a current node, update its next reference
|
|
64
|
+
if (this.currentNode) {
|
|
65
|
+
// If we're adding after a node that already had a "next",
|
|
66
|
+
// we need to discard that branch of history
|
|
67
|
+
if (this.currentNode.next) {
|
|
68
|
+
this.truncateForward(this.currentNode);
|
|
69
|
+
}
|
|
70
|
+
this.currentNode.next = newNode;
|
|
71
|
+
}
|
|
72
|
+
else {
|
|
73
|
+
// This is the first node
|
|
74
|
+
this.rootNode = newNode;
|
|
75
|
+
}
|
|
76
|
+
this.currentNode = newNode;
|
|
77
|
+
this._size++;
|
|
78
|
+
// If we've exceeded the max size, remove oldest nodes
|
|
79
|
+
this.enforceMaxSize();
|
|
80
|
+
return newNode;
|
|
81
|
+
}
|
|
82
|
+
/**
|
|
83
|
+
* Finds a node by its identifier
|
|
84
|
+
* @param id The identifier to search for
|
|
85
|
+
* @returns The found node or null if not found
|
|
86
|
+
*/
|
|
87
|
+
find(id) {
|
|
88
|
+
if (!this.rootNode) {
|
|
89
|
+
return null;
|
|
90
|
+
}
|
|
91
|
+
let node = this.rootNode;
|
|
92
|
+
while (node) {
|
|
93
|
+
if (node.id === id) {
|
|
94
|
+
return node;
|
|
95
|
+
}
|
|
96
|
+
node = node.next;
|
|
97
|
+
}
|
|
98
|
+
return null;
|
|
99
|
+
}
|
|
100
|
+
/**
|
|
101
|
+
* Removes a node by its identifier
|
|
102
|
+
* @param id The identifier of the node to remove
|
|
103
|
+
* @returns True if the node was found and removed, false otherwise
|
|
104
|
+
*/
|
|
105
|
+
remove(id) {
|
|
106
|
+
const nodeToRemove = this.find(id);
|
|
107
|
+
if (!nodeToRemove) {
|
|
108
|
+
return false;
|
|
109
|
+
}
|
|
110
|
+
// Handle removal of current node
|
|
111
|
+
if (nodeToRemove === this.currentNode) {
|
|
112
|
+
this.currentNode = nodeToRemove.previous || nodeToRemove.next;
|
|
113
|
+
}
|
|
114
|
+
// Connect previous and next nodes
|
|
115
|
+
if (nodeToRemove.previous) {
|
|
116
|
+
nodeToRemove.previous.next = nodeToRemove.next;
|
|
117
|
+
}
|
|
118
|
+
else {
|
|
119
|
+
// Removing the root node
|
|
120
|
+
this.rootNode = nodeToRemove.next;
|
|
121
|
+
}
|
|
122
|
+
if (nodeToRemove.next) {
|
|
123
|
+
nodeToRemove.next.previous = nodeToRemove.previous;
|
|
124
|
+
}
|
|
125
|
+
// Clean up references to help garbage collection
|
|
126
|
+
nodeToRemove.previous = null;
|
|
127
|
+
nodeToRemove.next = null;
|
|
128
|
+
this._size--;
|
|
129
|
+
return true;
|
|
130
|
+
}
|
|
131
|
+
/**
|
|
132
|
+
* Performs an undo operation, moving to the previous state
|
|
133
|
+
* @returns The previous state or null if can't undo
|
|
134
|
+
*/
|
|
135
|
+
undo() {
|
|
136
|
+
if (!this.canUndo) {
|
|
137
|
+
return null;
|
|
138
|
+
}
|
|
139
|
+
this.currentNode = this.currentNode.previous;
|
|
140
|
+
return this.currentNode.state;
|
|
141
|
+
}
|
|
142
|
+
/**
|
|
143
|
+
* Performs a redo operation, moving to the next state
|
|
144
|
+
* @returns The next state or null if can't redo
|
|
145
|
+
*/
|
|
146
|
+
redo() {
|
|
147
|
+
if (!this.canRedo) {
|
|
148
|
+
return null;
|
|
149
|
+
}
|
|
150
|
+
this.currentNode = this.currentNode.next;
|
|
151
|
+
return this.currentNode.state;
|
|
152
|
+
}
|
|
153
|
+
/**
|
|
154
|
+
* Clears all history
|
|
155
|
+
*/
|
|
156
|
+
clear() {
|
|
157
|
+
this.currentNode = null;
|
|
158
|
+
this.rootNode = null;
|
|
159
|
+
this._size = 0;
|
|
160
|
+
}
|
|
161
|
+
/**
|
|
162
|
+
* Removes all states after the specified node
|
|
163
|
+
* @param node The node to truncate from
|
|
164
|
+
* @returns The number of nodes removed
|
|
165
|
+
*/
|
|
166
|
+
truncateForward(node) {
|
|
167
|
+
if (!node.next) {
|
|
168
|
+
return 0;
|
|
169
|
+
}
|
|
170
|
+
let removedCount = 0;
|
|
171
|
+
let currentNext = node.next;
|
|
172
|
+
while (currentNext) {
|
|
173
|
+
const temp = currentNext.next;
|
|
174
|
+
// Clean up references for garbage collection
|
|
175
|
+
currentNext.previous = null;
|
|
176
|
+
currentNext.next = null;
|
|
177
|
+
currentNext = temp;
|
|
178
|
+
removedCount++;
|
|
179
|
+
}
|
|
180
|
+
// Update the node's next pointer
|
|
181
|
+
node.next = null;
|
|
182
|
+
this._size -= removedCount;
|
|
183
|
+
return removedCount;
|
|
184
|
+
}
|
|
185
|
+
/**
|
|
186
|
+
* Ensures the stack doesn't exceed the maximum size by removing oldest nodes
|
|
187
|
+
*/
|
|
188
|
+
enforceMaxSize() {
|
|
189
|
+
if (this.maxSize <= 0 || this._size <= this.maxSize) {
|
|
190
|
+
return;
|
|
191
|
+
}
|
|
192
|
+
let nodesToRemove = this._size - this.maxSize;
|
|
193
|
+
let currentNode = this.rootNode;
|
|
194
|
+
// Find the new root node
|
|
195
|
+
while (nodesToRemove > 0 && currentNode) {
|
|
196
|
+
currentNode = currentNode.next;
|
|
197
|
+
nodesToRemove--;
|
|
198
|
+
}
|
|
199
|
+
if (currentNode) {
|
|
200
|
+
// Disconnect from previous history
|
|
201
|
+
currentNode.previous = null;
|
|
202
|
+
// Update root node
|
|
203
|
+
this.rootNode = currentNode;
|
|
204
|
+
// Update size
|
|
205
|
+
this._size = this.maxSize;
|
|
206
|
+
}
|
|
207
|
+
}
|
|
208
|
+
/**
|
|
209
|
+
* Gets all states in the stack as an array (from oldest to newest)
|
|
210
|
+
*/
|
|
211
|
+
toArray() {
|
|
212
|
+
const result = [];
|
|
213
|
+
let node = this.rootNode;
|
|
214
|
+
while (node) {
|
|
215
|
+
result.push(node.state);
|
|
216
|
+
node = node.next;
|
|
217
|
+
}
|
|
218
|
+
return result;
|
|
219
|
+
}
|
|
220
|
+
/**
|
|
221
|
+
* Gets the history nodes as an array (useful for debugging)
|
|
222
|
+
*/
|
|
223
|
+
getNodes() {
|
|
224
|
+
const result = [];
|
|
225
|
+
let node = this.rootNode;
|
|
226
|
+
while (node) {
|
|
227
|
+
result.push(node);
|
|
228
|
+
node = node.next;
|
|
229
|
+
}
|
|
230
|
+
return result;
|
|
231
|
+
}
|
|
232
|
+
}
|
package/esm2022/utils.mjs
CHANGED
|
@@ -133,6 +133,19 @@ export const replaceMessagePlaceholder = (message, name, value) => (message ?? '
|
|
|
133
133
|
* @hidden
|
|
134
134
|
*/
|
|
135
135
|
export const recursiveFlatMap = (item) => isGroupResult(item) ? item.items.flatMap(recursiveFlatMap) : [{ ...item }];
|
|
136
|
+
const mapColumnItemState = (c) => ({ id: c.id, width: c.width, hidden: c.hidden, locked: c.locked, sticky: c.sticky, orderIndex: c.orderIndex });
|
|
137
|
+
/**
|
|
138
|
+
* @hidden
|
|
139
|
+
*/
|
|
140
|
+
export const updateColumnFromState = (columnState, c) => {
|
|
141
|
+
Object.keys(columnState).forEach((key) => c[key] = columnState[key]);
|
|
142
|
+
};
|
|
143
|
+
/**
|
|
144
|
+
* @hidden
|
|
145
|
+
*/
|
|
146
|
+
export const recursiveColumnsFlatMap = (item) => (item.isColumnGroup || item.isSpanColumn) ?
|
|
147
|
+
[mapColumnItemState(item), ...item.children.toArray().flatMap(recursiveColumnsFlatMap)] :
|
|
148
|
+
[mapColumnItemState(item)];
|
|
136
149
|
/**
|
|
137
150
|
* @hidden
|
|
138
151
|
*/
|
|
@@ -2,8 +2,11 @@
|
|
|
2
2
|
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
import { ChangeDetectorRef, NgZone } from '@angular/core';
|
|
5
6
|
import { ToolBarButtonComponent } from '@progress/kendo-angular-toolbar';
|
|
6
7
|
import { ExcelService } from './excel.service';
|
|
8
|
+
import { ContextService } from '../common/provider.service';
|
|
9
|
+
import { ToolbarToolBase } from '../common/toolbar-tool-base.directive';
|
|
7
10
|
import * as i0 from "@angular/core";
|
|
8
11
|
/**
|
|
9
12
|
* Represents the `export-to-Excel` toolbar tool of the Grid.
|
|
@@ -25,13 +28,10 @@ import * as i0 from "@angular/core";
|
|
|
25
28
|
* </kendo-grid>
|
|
26
29
|
* ```
|
|
27
30
|
*/
|
|
28
|
-
export declare class ExcelCommandToolbarDirective {
|
|
31
|
+
export declare class ExcelCommandToolbarDirective extends ToolbarToolBase {
|
|
29
32
|
private excelService;
|
|
30
|
-
|
|
31
|
-
private clickSub;
|
|
32
|
-
constructor(excelService: ExcelService, host: ToolBarButtonComponent);
|
|
33
|
+
constructor(excelService: ExcelService, host: ToolBarButtonComponent, ctx: ContextService, zone: NgZone, cdr: ChangeDetectorRef);
|
|
33
34
|
ngOnInit(): void;
|
|
34
|
-
ngOnDestroy(): void;
|
|
35
35
|
/**
|
|
36
36
|
* @hidden
|
|
37
37
|
*/
|