ngssm-tree 20.3.10 → 21.1.0

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.
Files changed (5) hide show
  1. package/fesm2022/ngssm-tree.mjs +122 -878
  2. package/fesm2022/ngssm-tree.mjs.map +1 -1
  3. package/package.json +3 -3
  4. package/types/ngssm-tree.d.ts +218 -0
  5. package/index.d.ts +0 -438
package/fesm2022/ngssm-tree.mjs CHANGED
@@ -1,34 +1,30 @@
1
1
  import * as i0 from '@angular/core';
2
- import { InjectionToken, inject, Injectable, signal, input, effect, untracked, ChangeDetectionStrategy, Component, ChangeDetectorRef, viewChild, ViewContainerRef, makeEnvironmentProviders, ElementRef, output } from '@angular/core';
2
+ import { InjectionToken, inject, Injectable, input, signal, effect, untracked, ChangeDetectionStrategy, Component, viewChild, ViewContainerRef, ChangeDetectorRef, makeEnvironmentProviders } from '@angular/core';
3
3
  import { NgSsmFeatureState, Logger, Store, createSignal, provideReducers, provideEffects } from 'ngssm-store';
4
4
  import { DataStatus } from 'ngssm-remote-data';
5
5
  import { __decorate } from 'tslib';
6
6
  import update from 'immutability-helper';
7
- import * as i4 from '@angular/material/dialog';
7
+ import * as i4$1 from '@angular/material/dialog';
8
8
  import { MatDialogModule, MatDialog } from '@angular/material/dialog';
9
- import { defaultRegexEditorValidator, NgssmComponentDisplayDirective } from 'ngssm-toolkit';
9
+ import { defaultRegexEditorValidator } from 'ngssm-toolkit';
10
10
  import * as i1 from '@angular/common';
11
11
  import { CommonModule } from '@angular/common';
12
12
  import * as i2 from '@angular/cdk/scrolling';
13
13
  import { ScrollingModule } from '@angular/cdk/scrolling';
14
14
  import * as i6 from '@angular/material/card';
15
- import { MatCardModule, MatCard, MatCardContent } from '@angular/material/card';
16
- import * as i1$1 from '@angular/material/icon';
17
- import { MatIconModule, MatIcon } from '@angular/material/icon';
15
+ import { MatCardModule } from '@angular/material/card';
16
+ import * as i4 from '@angular/material/icon';
17
+ import { MatIconModule } from '@angular/material/icon';
18
18
  import * as i5 from '@angular/material/progress-spinner';
19
19
  import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
20
20
  import * as i2$1 from '@angular/material/button';
21
21
  import { MatButtonModule } from '@angular/material/button';
22
- import * as i1$2 from '@angular/forms';
22
+ import * as i1$1 from '@angular/forms';
23
23
  import { FormControl, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
24
24
  import * as i2$2 from '@angular/material/form-field';
25
25
  import { MatFormFieldModule } from '@angular/material/form-field';
26
26
  import * as i3 from '@angular/material/input';
27
27
  import { MatInputModule } from '@angular/material/input';
28
- import * as i3$1 from '@angular/material/divider';
29
- import { MatDividerModule, MatDivider } from '@angular/material/divider';
30
- import * as i2$3 from '@angular/material/menu';
31
- import { MatMenuModule } from '@angular/material/menu';
32
28
 
33
29
  var NgssmTreeActionType;
34
30
  (function (NgssmTreeActionType) {
@@ -47,6 +43,8 @@ var NgssmTreeActionType;
47
43
  })(NgssmTreeActionType || (NgssmTreeActionType = {}));
48
44
 
49
45
  class TreeAction {
46
+ type;
47
+ treeId;
50
48
  constructor(type, treeId) {
51
49
  this.type = type;
52
50
  this.treeId = treeId;
@@ -54,6 +52,8 @@ class TreeAction {
54
52
  }
55
53
 
56
54
  class InitNgssmTreeAction extends TreeAction {
55
+ treeType;
56
+ root;
57
57
  constructor(treeId, treeType, root) {
58
58
  super(NgssmTreeActionType.initNgssmTree, treeId);
59
59
  this.treeType = treeType;
@@ -62,6 +62,7 @@ class InitNgssmTreeAction extends TreeAction {
62
62
  }
63
63
 
64
64
  class TreeNodeAction extends TreeAction {
65
+ nodeId;
65
66
  constructor(actionType, treeId, nodeId) {
66
67
  super(actionType, treeId);
67
68
  this.nodeId = nodeId;
@@ -75,16 +76,21 @@ class ExpandNodeAction extends TreeNodeAction {
75
76
  }
76
77
 
77
78
  class RegisterNodesAction {
79
+ dataStatus;
80
+ treeId;
81
+ parentNodeId;
82
+ nodes;
83
+ type = NgssmTreeActionType.registerNodes;
78
84
  constructor(dataStatus, treeId, parentNodeId, nodes = []) {
79
85
  this.dataStatus = dataStatus;
80
86
  this.treeId = treeId;
81
87
  this.parentNodeId = parentNodeId;
82
88
  this.nodes = nodes;
83
- this.type = NgssmTreeActionType.registerNodes;
84
89
  }
85
90
  }
86
91
 
87
92
  class CollapseNodeAction extends TreeAction {
93
+ nodeId;
88
94
  constructor(treeId, nodeId) {
89
95
  super(NgssmTreeActionType.collapseNode, treeId);
90
96
  this.nodeId = nodeId;
@@ -104,6 +110,7 @@ class DeleteNgssmTreeAction extends TreeAction {
104
110
  }
105
111
 
106
112
  class DisplaySearchDialogAction extends TreeAction {
113
+ startNodeId;
107
114
  constructor(treeId, startNodeId) {
108
115
  super(NgssmTreeActionType.displaySearchDialog, treeId);
109
116
  this.startNodeId = startNodeId;
@@ -111,17 +118,20 @@ class DisplaySearchDialogAction extends TreeAction {
111
118
  }
112
119
 
113
120
  class SearchTreeNodesAction {
121
+ searchPattern;
122
+ type = NgssmTreeActionType.searchTreeNodes;
114
123
  constructor(searchPattern) {
115
124
  this.searchPattern = searchPattern;
116
- this.type = NgssmTreeActionType.searchTreeNodes;
117
125
  }
118
126
  }
119
127
 
120
128
  class RegisterPartialSearchResultsAction {
129
+ matchingNodes;
130
+ nodesToProcess;
131
+ type = NgssmTreeActionType.registerPartialSearchResults;
121
132
  constructor(matchingNodes, nodesToProcess) {
122
133
  this.matchingNodes = matchingNodes;
123
134
  this.nodesToProcess = nodesToProcess;
124
- this.type = NgssmTreeActionType.registerPartialSearchResults;
125
135
  }
126
136
  }
127
137
 
@@ -173,11 +183,11 @@ const updateNgssmTreeState = (state, command) => update(state, {
173
183
  [NgssmTreeStateSpecification.featureStateKey]: command
174
184
  });
175
185
  let NgssmTreeStateSpecification = class NgssmTreeStateSpecification {
176
- static { this.featureStateKey = 'ngssm-tree-state'; }
177
- static { this.initialState = {
186
+ static featureStateKey = 'ngssm-tree-state';
187
+ static initialState = {
178
188
  trees: {},
179
189
  treeNodesSearch: getDefaultTreeNodesSearch()
180
- }; }
190
+ };
181
191
  };
182
192
  NgssmTreeStateSpecification = __decorate([
183
193
  NgSsmFeatureState({
@@ -190,15 +200,13 @@ const selectNgssmTreeNode = (state, treeId, nodeId) => selectNgssmTreeState(stat
190
200
  const selectNgssmTreeNodeChildren = (state, treeId, nodeId) => selectNgssmTreeState(state).trees[treeId]?.nodes.filter((n) => n.node.parentNodeId === nodeId) ?? [];
191
201
 
192
202
  class TreeNodeLoadingEffect {
193
- constructor() {
194
- this.dataServices = inject(NGSSM_TREE_DATA_SERVICE, { optional: true }) ?? [];
195
- this.logger = inject(Logger);
196
- this.processedActions = [
197
- NgssmTreeActionType.expandNode,
198
- NgssmTreeActionType.selectNode,
199
- NgssmTreeActionType.loadChildrenOfNode
200
- ];
201
- }
203
+ processedActions = [
204
+ NgssmTreeActionType.expandNode,
205
+ NgssmTreeActionType.selectNode,
206
+ NgssmTreeActionType.loadChildrenOfNode
207
+ ];
208
+ dataServices = inject(NGSSM_TREE_DATA_SERVICE, { optional: true }) ?? [];
209
+ logger = inject(Logger);
202
210
  processAction(actiondispatcher, state, action) {
203
211
  const treeNodeAction = action;
204
212
  if (!selectNgssmTreeState(state).trees[treeNodeAction.treeId]) {
@@ -223,22 +231,22 @@ class TreeNodeLoadingEffect {
223
231
  }
224
232
  });
225
233
  }
226
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeLoadingEffect, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
227
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeLoadingEffect }); }
234
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodeLoadingEffect, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
235
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodeLoadingEffect });
228
236
  }
229
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeLoadingEffect, decorators: [{
237
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodeLoadingEffect, decorators: [{
230
238
  type: Injectable
231
239
  }] });
232
240
 
233
241
  class NgssmTreeComponent {
242
+ treeConfig = input(...(ngDevMode ? [undefined, { debugName: "treeConfig" }] : []));
243
+ dataStatus = DataStatus;
244
+ displayedItems = signal([], ...(ngDevMode ? [{ debugName: "displayedItems" }] : []));
245
+ selectedNodeId = signal(undefined, ...(ngDevMode ? [{ debugName: "selectedNodeId" }] : []));
246
+ store = inject(Store);
247
+ trees = createSignal((state) => selectNgssmTreeState(state).trees);
248
+ tree = signal(undefined, ...(ngDevMode ? [{ debugName: "tree" }] : []));
234
249
  constructor() {
235
- this.store = inject(Store);
236
- this.trees = createSignal((state) => selectNgssmTreeState(state).trees);
237
- this.tree = signal(undefined, ...(ngDevMode ? [{ debugName: "tree" }] : []));
238
- this.treeConfig = input(...(ngDevMode ? [undefined, { debugName: "treeConfig" }] : []));
239
- this.dataStatus = DataStatus;
240
- this.displayedItems = signal([], ...(ngDevMode ? [{ debugName: "displayedItems" }] : []));
241
- this.selectedNodeId = signal(undefined, ...(ngDevMode ? [{ debugName: "selectedNodeId" }] : []));
242
250
  effect(() => {
243
251
  const currentConfig = this.treeConfig();
244
252
  const currentTrees = this.trees();
@@ -328,20 +336,20 @@ class NgssmTreeComponent {
328
336
  this.store.dispatchAction(new DisplaySearchDialogAction(treeId, node.node.nodeId));
329
337
  }
330
338
  }
331
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgssmTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
332
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: NgssmTreeComponent, isStandalone: true, selector: "ngssm-tree", inputs: { treeConfig: { classPropertyName: "treeConfig", publicName: "treeConfig", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<mat-card class=\"flex-column-stretch fxFlex\">\n @if (treeConfig(); as config) {\n <mat-card-content class=\"flex-column-stretch fxFlex\">\n <cdk-virtual-scroll-viewport itemSize=\"30\" class=\"fxFlex\">\n <div\n *cdkVirtualFor=\"let item of displayedItems(); trackBy: getItemId\"\n class=\"ngssm-tree-node\"\n [style.padding-left.px]=\"item.node.level * 20\"\n (click)=\"selectNode(item.node)\"\n aria-hidden=\"true\"\n (keyup.enter)=\"selectNode(item.node)\"\n [ngClass]=\"{ selected: selectedNodeId() === item.node.node.nodeId }\">\n @if (item.node.node.isExpandable) {\n @if (item.node.status === dataStatus.loading) {\n <mat-spinner diameter=\"20\"></mat-spinner>\n } @else {\n @if (item.node.isExpanded) {\n <mat-icon class=\"fa-solid fa-chevron-down\" (click)=\"$event.stopPropagation(); collapse(item.node)\"></mat-icon>\n } @else {\n <mat-icon class=\"fa-solid fa-chevron-right\" (click)=\"$event.stopPropagation(); expand(item.node)\"></mat-icon>\n }\n }\n } @else {\n <span class=\"not-expandable-padding\"></span>\n }\n\n <mat-icon class=\"{{ config.iconClasses[item.node.node.type] }}\" color=\"primary\"></mat-icon>\n\n <span class=\"ngssm-tree-node-label\">\n {{ item.node.node.label }}\n </span>\n <span class=\"fxFlex\"></span>\n @if (item.canSearch) {\n <i class=\"fa-solid fa-magnifying-glass search-icon\" (click)=\"$event.stopPropagation(); displaySearchDialog(item.node)\"> </i>\n }\n </div>\n </cdk-virtual-scroll-viewport>\n </mat-card-content>\n }\n</mat-card>\n", styles: [":host{display:flex;flex-direction:column}:host .ngssm-tree-node{height:30px;display:flex;flex-direction:row;align-items:center;padding-right:12px}:host .ngssm-tree-node .fa-folder{margin-right:4px}:host .ngssm-tree-node .fa-chevron-right:hover{cursor:pointer}:host .ngssm-tree-node.selected{background-color:#e4e6f1}:host .ngssm-tree-node:hover{cursor:pointer}:host .ngssm-tree-node:hover .search-icon{display:unset}:host .ngssm-tree-node:hover:not(.selected){background-color:#f3f3f3}:host .not-expandable-padding{width:24px}:host .search-icon{font-size:12px;display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i2.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i6.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i6.MatCardContent, selector: "mat-card-content" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
339
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NgssmTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
340
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: NgssmTreeComponent, isStandalone: true, selector: "ngssm-tree", inputs: { treeConfig: { classPropertyName: "treeConfig", publicName: "treeConfig", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<mat-card class=\"flex-column-stretch fxFlex\">\n @if (treeConfig(); as config) {\n <mat-card-content class=\"flex-column-stretch fxFlex\">\n <cdk-virtual-scroll-viewport itemSize=\"30\" class=\"fxFlex\">\n <div\n *cdkVirtualFor=\"let item of displayedItems(); trackBy: getItemId\"\n class=\"ngssm-tree-node\"\n [style.padding-left.px]=\"item.node.level * 20\"\n (click)=\"selectNode(item.node)\"\n aria-hidden=\"true\"\n (keyup.enter)=\"selectNode(item.node)\"\n [ngClass]=\"{ selected: selectedNodeId() === item.node.node.nodeId }\">\n @if (item.node.node.isExpandable) {\n @if (item.node.status === dataStatus.loading) {\n <mat-spinner diameter=\"20\"></mat-spinner>\n } @else {\n @if (item.node.isExpanded) {\n <mat-icon class=\"fa-solid fa-chevron-down\" (click)=\"$event.stopPropagation(); collapse(item.node)\"></mat-icon>\n } @else {\n <mat-icon class=\"fa-solid fa-chevron-right\" (click)=\"$event.stopPropagation(); expand(item.node)\"></mat-icon>\n }\n }\n } @else {\n <span class=\"not-expandable-padding\"></span>\n }\n\n <mat-icon class=\"{{ config.iconClasses[item.node.node.type] }}\" color=\"primary\"></mat-icon>\n\n <span class=\"ngssm-tree-node-label\">\n {{ item.node.node.label }}\n </span>\n <span class=\"fxFlex\"></span>\n @if (item.canSearch) {\n <i class=\"fa-solid fa-magnifying-glass search-icon\" (click)=\"$event.stopPropagation(); displaySearchDialog(item.node)\"> </i>\n }\n </div>\n </cdk-virtual-scroll-viewport>\n </mat-card-content>\n }\n</mat-card>\n", styles: [":host{display:flex;flex-direction:column}:host .ngssm-tree-node{height:30px;display:flex;flex-direction:row;align-items:center;padding-right:12px}:host .ngssm-tree-node .fa-folder{margin-right:4px}:host .ngssm-tree-node .fa-chevron-right:hover{cursor:pointer}:host .ngssm-tree-node.selected{background-color:#e4e6f1}:host .ngssm-tree-node:hover{cursor:pointer}:host .ngssm-tree-node:hover .search-icon{display:unset}:host .ngssm-tree-node:hover:not(.selected){background-color:#f3f3f3}:host .not-expandable-padding{width:24px}:host .search-icon{font-size:12px;display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i2.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i6.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i6.MatCardContent, selector: "mat-card-content" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
333
341
  }
334
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgssmTreeComponent, decorators: [{
342
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NgssmTreeComponent, decorators: [{
335
343
  type: Component,
336
344
  args: [{ selector: 'ngssm-tree', imports: [CommonModule, ScrollingModule, MatCardModule, MatIconModule, MatProgressSpinnerModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-card class=\"flex-column-stretch fxFlex\">\n @if (treeConfig(); as config) {\n <mat-card-content class=\"flex-column-stretch fxFlex\">\n <cdk-virtual-scroll-viewport itemSize=\"30\" class=\"fxFlex\">\n <div\n *cdkVirtualFor=\"let item of displayedItems(); trackBy: getItemId\"\n class=\"ngssm-tree-node\"\n [style.padding-left.px]=\"item.node.level * 20\"\n (click)=\"selectNode(item.node)\"\n aria-hidden=\"true\"\n (keyup.enter)=\"selectNode(item.node)\"\n [ngClass]=\"{ selected: selectedNodeId() === item.node.node.nodeId }\">\n @if (item.node.node.isExpandable) {\n @if (item.node.status === dataStatus.loading) {\n <mat-spinner diameter=\"20\"></mat-spinner>\n } @else {\n @if (item.node.isExpanded) {\n <mat-icon class=\"fa-solid fa-chevron-down\" (click)=\"$event.stopPropagation(); collapse(item.node)\"></mat-icon>\n } @else {\n <mat-icon class=\"fa-solid fa-chevron-right\" (click)=\"$event.stopPropagation(); expand(item.node)\"></mat-icon>\n }\n }\n } @else {\n <span class=\"not-expandable-padding\"></span>\n }\n\n <mat-icon class=\"{{ config.iconClasses[item.node.node.type] }}\" color=\"primary\"></mat-icon>\n\n <span class=\"ngssm-tree-node-label\">\n {{ item.node.node.label }}\n </span>\n <span class=\"fxFlex\"></span>\n @if (item.canSearch) {\n <i class=\"fa-solid fa-magnifying-glass search-icon\" (click)=\"$event.stopPropagation(); displaySearchDialog(item.node)\"> </i>\n }\n </div>\n </cdk-virtual-scroll-viewport>\n </mat-card-content>\n }\n</mat-card>\n", styles: [":host{display:flex;flex-direction:column}:host .ngssm-tree-node{height:30px;display:flex;flex-direction:row;align-items:center;padding-right:12px}:host .ngssm-tree-node .fa-folder{margin-right:4px}:host .ngssm-tree-node .fa-chevron-right:hover{cursor:pointer}:host .ngssm-tree-node.selected{background-color:#e4e6f1}:host .ngssm-tree-node:hover{cursor:pointer}:host .ngssm-tree-node:hover .search-icon{display:unset}:host .ngssm-tree-node:hover:not(.selected){background-color:#f3f3f3}:host .not-expandable-padding{width:24px}:host .search-icon{font-size:12px;display:none}\n"] }]
337
345
  }], ctorParameters: () => [], propDecorators: { treeConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeConfig", required: false }] }] } });
338
346
 
339
347
  class NgssmBreadcrumbComponent {
348
+ treeId = input(undefined, ...(ngDevMode ? [{ debugName: "treeId" }] : []));
349
+ nodes = signal([], ...(ngDevMode ? [{ debugName: "nodes" }] : []));
350
+ store = inject(Store);
351
+ treeState = createSignal((state) => selectNgssmTreeState(state));
340
352
  constructor() {
341
- this.store = inject(Store);
342
- this.treeState = createSignal((state) => selectNgssmTreeState(state));
343
- this.treeId = input(undefined, ...(ngDevMode ? [{ debugName: "treeId" }] : []));
344
- this.nodes = signal([], ...(ngDevMode ? [{ debugName: "nodes" }] : []));
345
353
  effect(() => {
346
354
  const currentTreeId = this.treeId();
347
355
  if (!currentTreeId) {
@@ -373,30 +381,30 @@ class NgssmBreadcrumbComponent {
373
381
  this.store.dispatchAction(new SelectNodeAction(treeId, node.nodeId));
374
382
  }
375
383
  }
376
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgssmBreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
377
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: NgssmBreadcrumbComponent, isStandalone: true, selector: "ngssm-breadcrumb", inputs: { treeId: { classPropertyName: "treeId", publicName: "treeId", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex-row-center\">\n <mat-icon class=\"fa-solid fa-folder-tree\" color=\"primary\"></mat-icon>\n @for (node of nodes(); track node; let last = $last) {\n <span class=\"flex-row-center\">\n <button mat-button [disabled]=\"last\" (click)=\"selectNode(node)\">\n {{ node.label }}\n </button>\n\n @if (!last) {\n <div class=\"ngssm-breadcrumb-separator\">/</div>\n }\n </span>\n }\n</div>\n", styles: [".ngssm-breadcrumb-separator{font-weight:700}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$1.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
384
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NgssmBreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
385
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: NgssmBreadcrumbComponent, isStandalone: true, selector: "ngssm-breadcrumb", inputs: { treeId: { classPropertyName: "treeId", publicName: "treeId", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex-row-center\">\n <mat-icon class=\"fa-solid fa-folder-tree\" color=\"primary\"></mat-icon>\n @for (node of nodes(); track node; let last = $last) {\n <span class=\"flex-row-center\">\n <button mat-button [disabled]=\"last\" (click)=\"selectNode(node)\">\n {{ node.label }}\n </button>\n\n @if (!last) {\n <div class=\"ngssm-breadcrumb-separator\">/</div>\n }\n </span>\n }\n</div>\n", styles: [".ngssm-breadcrumb-separator{font-weight:700}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$1.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
378
386
  }
379
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgssmBreadcrumbComponent, decorators: [{
387
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NgssmBreadcrumbComponent, decorators: [{
380
388
  type: Component,
381
- args: [{ selector: 'ngssm-breadcrumb', imports: [CommonModule, MatIconModule, MatButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex-row-center\">\n <mat-icon class=\"fa-solid fa-folder-tree\" color=\"primary\"></mat-icon>\n @for (node of nodes(); track node; let last = $last) {\n <span class=\"flex-row-center\">\n <button mat-button [disabled]=\"last\" (click)=\"selectNode(node)\">\n {{ node.label }}\n </button>\n\n @if (!last) {\n <div class=\"ngssm-breadcrumb-separator\">/</div>\n }\n </span>\n }\n</div>\n", styles: [".ngssm-breadcrumb-separator{font-weight:700}\n"] }]
389
+ args: [{ selector: 'ngssm-breadcrumb', imports: [MatIconModule, MatButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex-row-center\">\n <mat-icon class=\"fa-solid fa-folder-tree\" color=\"primary\"></mat-icon>\n @for (node of nodes(); track node; let last = $last) {\n <span class=\"flex-row-center\">\n <button mat-button [disabled]=\"last\" (click)=\"selectNode(node)\">\n {{ node.label }}\n </button>\n\n @if (!last) {\n <div class=\"ngssm-breadcrumb-separator\">/</div>\n }\n </span>\n }\n</div>\n", styles: [".ngssm-breadcrumb-separator{font-weight:700}\n"] }]
382
390
  }], ctorParameters: () => [], propDecorators: { treeId: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeId", required: false }] }] } });
383
391
 
384
392
  class NgssmTreeSearchDialogComponent {
393
+ resultsViewerContainer = viewChild('resultsViewerContainer', { ...(ngDevMode ? { debugName: "resultsViewerContainer" } : {}), read: ViewContainerRef });
394
+ searchStatus = SearchStatus;
395
+ searchRootPath = createSignal((state) => selectNgssmTreeState(state).treeNodesSearch.rootSearchPath ?? '');
396
+ currentSearchedPath = createSignal((state) => selectNgssmTreeState(state).treeNodesSearch.toProcess[0]?.fullPath ?? '');
397
+ currentSearchStatus = createSignal((state) => selectNgssmTreeState(state).treeNodesSearch.searchStatus);
398
+ searchPatternControl = new FormControl(undefined, [
399
+ Validators.required,
400
+ (c) => this.validatedRegex(c)
401
+ ]);
402
+ store = inject(Store);
403
+ changeDetectorRef = inject(ChangeDetectorRef);
404
+ dataServices = inject(NGSSM_TREE_DATA_SERVICE, {
405
+ optional: true
406
+ });
385
407
  constructor() {
386
- this.store = inject(Store);
387
- this.changeDetectorRef = inject(ChangeDetectorRef);
388
- this.dataServices = inject(NGSSM_TREE_DATA_SERVICE, {
389
- optional: true
390
- });
391
- this.resultsViewerContainer = viewChild('resultsViewerContainer', ...(ngDevMode ? [{ debugName: "resultsViewerContainer", read: ViewContainerRef }] : [{ read: ViewContainerRef }]));
392
- this.searchStatus = SearchStatus;
393
- this.searchRootPath = createSignal((state) => selectNgssmTreeState(state).treeNodesSearch.rootSearchPath ?? '');
394
- this.currentSearchedPath = createSignal((state) => selectNgssmTreeState(state).treeNodesSearch.toProcess[0]?.fullPath ?? '');
395
- this.currentSearchStatus = createSignal((state) => selectNgssmTreeState(state).treeNodesSearch.searchStatus);
396
- this.searchPatternControl = new FormControl(undefined, [
397
- Validators.required,
398
- (c) => this.validatedRegex(c)
399
- ]);
400
408
  const effectRef = effect(() => {
401
409
  const container = this.resultsViewerContainer();
402
410
  if (!container) {
@@ -441,13 +449,12 @@ class NgssmTreeSearchDialogComponent {
441
449
  regex: result.error
442
450
  };
443
451
  }
444
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgssmTreeSearchDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
445
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: NgssmTreeSearchDialogComponent, isStandalone: true, selector: "ngssm-ngssm-tree-search-dialog", viewQueries: [{ propertyName: "resultsViewerContainer", first: true, predicate: ["resultsViewerContainer"], descendants: true, read: ViewContainerRef, isSignal: true }], ngImport: i0, template: "<h1 mat-dialog-title>Tree search dialog</h1>\n@let searchInProgress = currentSearchStatus() === searchStatus.inProgress;\n<mat-dialog-content class=\"flex-column-stretch fxFlex\">\n <mat-card class=\"flex-column-stretch\">\n <mat-card-content class=\"flex-row-center\">\n <mat-form-field class=\"with-margin-right-12 fxFlex\">\n <mat-label>Starts search in</mat-label>\n <input matInput readonly [ngModel]=\"searchRootPath()\" />\n </mat-form-field>\n\n <mat-form-field class=\"fxFlex with-margin-right-12\">\n <mat-label>Search pattern</mat-label>\n <input matInput [formControl]=\"searchPatternControl\" />\n @if (searchPatternControl.errors?.['regex']; as error) {\n <mat-error>\n {{ error }}\n </mat-error>\n }\n </mat-form-field>\n\n @if (!searchInProgress) {\n <button mat-stroked-button color=\"primary\" [disabled]=\"searchPatternControl.invalid\" (click)=\"search()\">\n <mat-icon class=\"fa-solid fa-magnifying-glass\"></mat-icon>\n Search\n </button>\n } @else {\n <button mat-raised-button color=\"accent\" (click)=\"abort()\">\n <mat-icon class=\"fa-solid fa-ban\"></mat-icon>\n Abort\n </button>\n }\n </mat-card-content>\n @if (searchInProgress) {\n <mat-card-footer class=\"flex-row-center\">\n <mat-spinner [diameter]=\"20\"></mat-spinner>\n {{ currentSearchedPath() }}\n </mat-card-footer>\n }\n </mat-card>\n <mat-card class=\"flex-column-stretch fxFlex with-margin-top-8\">\n <ng-container #resultsViewerContainer></ng-container>\n </mat-card>\n</mat-dialog-content>\n<mat-dialog-actions class=\"flex-row-center\">\n <span class=\"fxFlex\"></span>\n <button mat-button (click)=\"close()\">Close</button>\n</mat-dialog-actions>\n", styles: [":host{display:flex;flex-direction:column;height:100%}:host .mat-mdc-dialog-content{max-height:unset!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i4.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$1.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i6.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i6.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i6.MatCardFooter, selector: "mat-card-footer" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
452
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NgssmTreeSearchDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
453
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: NgssmTreeSearchDialogComponent, isStandalone: true, selector: "ngssm-ngssm-tree-search-dialog", viewQueries: [{ propertyName: "resultsViewerContainer", first: true, predicate: ["resultsViewerContainer"], descendants: true, read: ViewContainerRef, isSignal: true }], ngImport: i0, template: "<h1 mat-dialog-title>Tree search dialog</h1>\n@let searchInProgress = currentSearchStatus() === searchStatus.inProgress;\n<mat-dialog-content class=\"flex-column-stretch fxFlex\">\n <mat-card class=\"flex-column-stretch\">\n <mat-card-content class=\"flex-row-center\">\n <mat-form-field class=\"with-margin-right-12 fxFlex\">\n <mat-label>Starts search in</mat-label>\n <input matInput readonly [ngModel]=\"searchRootPath()\" />\n </mat-form-field>\n\n <mat-form-field class=\"fxFlex with-margin-right-12\">\n <mat-label>Search pattern</mat-label>\n <input matInput [formControl]=\"searchPatternControl\" />\n @if (searchPatternControl.errors?.['regex']; as error) {\n <mat-error>\n {{ error }}\n </mat-error>\n }\n </mat-form-field>\n\n @if (!searchInProgress) {\n <button mat-stroked-button color=\"primary\" [disabled]=\"searchPatternControl.invalid\" (click)=\"search()\">\n <mat-icon class=\"fa-solid fa-magnifying-glass\"></mat-icon>\n Search\n </button>\n } @else {\n <button mat-raised-button color=\"accent\" (click)=\"abort()\">\n <mat-icon class=\"fa-solid fa-ban\"></mat-icon>\n Abort\n </button>\n }\n </mat-card-content>\n @if (searchInProgress) {\n <mat-card-footer class=\"flex-row-center\">\n <mat-spinner [diameter]=\"20\"></mat-spinner>\n {{ currentSearchedPath() }}\n </mat-card-footer>\n }\n </mat-card>\n <mat-card class=\"flex-column-stretch fxFlex with-margin-top-8\">\n <ng-container #resultsViewerContainer></ng-container>\n </mat-card>\n</mat-dialog-content>\n<mat-dialog-actions class=\"flex-row-center\">\n <span class=\"fxFlex\"></span>\n <button mat-button (click)=\"close()\">Close</button>\n</mat-dialog-actions>\n", styles: [":host{display:flex;flex-direction:column;height:100%}:host .mat-mdc-dialog-content{max-height:unset!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i4$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i4$1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i4$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$1.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i6.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i6.MatCardContent, selector: "mat-card-content" }, { kind: "directive", type: i6.MatCardFooter, selector: "mat-card-footer" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
446
454
  }
447
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgssmTreeSearchDialogComponent, decorators: [{
455
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NgssmTreeSearchDialogComponent, decorators: [{
448
456
  type: Component,
449
457
  args: [{ selector: 'ngssm-ngssm-tree-search-dialog', imports: [
450
- CommonModule,
451
458
  FormsModule,
452
459
  ReactiveFormsModule,
453
460
  MatFormFieldModule,
@@ -461,17 +468,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
461
468
  }], ctorParameters: () => [], propDecorators: { resultsViewerContainer: [{ type: i0.ViewChild, args: ['resultsViewerContainer', { ...{ read: ViewContainerRef }, isSignal: true }] }] } });
462
469
 
463
470
  class TreeNodesSearchingEffect {
464
- constructor() {
465
- this.matDialog = inject(MatDialog);
466
- this.logger = inject(Logger);
467
- this.processedActions = [
468
- NgssmTreeActionType.displaySearchDialog,
469
- NgssmTreeActionType.closeSearchDialog,
470
- NgssmTreeActionType.searchTreeNodes,
471
- NgssmTreeActionType.registerNodes,
472
- NgssmTreeActionType.registerPartialSearchResults
473
- ];
474
- }
471
+ processedActions = [
472
+ NgssmTreeActionType.displaySearchDialog,
473
+ NgssmTreeActionType.closeSearchDialog,
474
+ NgssmTreeActionType.searchTreeNodes,
475
+ NgssmTreeActionType.registerNodes,
476
+ NgssmTreeActionType.registerPartialSearchResults
477
+ ];
478
+ matDialog = inject(MatDialog);
479
+ logger = inject(Logger);
480
+ dialog;
475
481
  processAction(actiondispatcher, state, action) {
476
482
  switch (action.type) {
477
483
  case NgssmTreeActionType.displaySearchDialog: {
@@ -526,22 +532,20 @@ class TreeNodesSearchingEffect {
526
532
  this.dialog?.close();
527
533
  this.dialog = undefined;
528
534
  }
529
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodesSearchingEffect, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
530
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodesSearchingEffect }); }
535
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodesSearchingEffect, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
536
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodesSearchingEffect });
531
537
  }
532
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodesSearchingEffect, decorators: [{
538
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodesSearchingEffect, decorators: [{
533
539
  type: Injectable
534
540
  }] });
535
541
 
536
- let TreeNodeExpandReducer$1 = class TreeNodeExpandReducer {
537
- constructor() {
538
- this.processedActions = [
539
- NgssmTreeActionType.expandNode,
540
- NgssmTreeActionType.collapseNode,
541
- NgssmTreeActionType.selectNode,
542
- NgssmTreeActionType.loadChildrenOfNode
543
- ];
544
- }
542
+ class TreeNodeExpandReducer {
543
+ processedActions = [
544
+ NgssmTreeActionType.expandNode,
545
+ NgssmTreeActionType.collapseNode,
546
+ NgssmTreeActionType.selectNode,
547
+ NgssmTreeActionType.loadChildrenOfNode
548
+ ];
545
549
  updateState(state, action) {
546
550
  switch (action.type) {
547
551
  case NgssmTreeActionType.expandNode: {
@@ -651,17 +655,15 @@ let TreeNodeExpandReducer$1 = class TreeNodeExpandReducer {
651
655
  }
652
656
  return state;
653
657
  }
654
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeExpandReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
655
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeExpandReducer }); }
656
- };
657
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeExpandReducer$1, decorators: [{
658
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodeExpandReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
659
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodeExpandReducer });
660
+ }
661
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodeExpandReducer, decorators: [{
658
662
  type: Injectable
659
663
  }] });
660
664
 
661
665
  class TreeNodeSelectionReducer {
662
- constructor() {
663
- this.processedActions = [NgssmTreeActionType.selectNode];
664
- }
666
+ processedActions = [NgssmTreeActionType.selectNode];
665
667
  updateState(state, action) {
666
668
  switch (action.type) {
667
669
  case NgssmTreeActionType.selectNode: {
@@ -677,23 +679,21 @@ class TreeNodeSelectionReducer {
677
679
  }
678
680
  return state;
679
681
  }
680
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeSelectionReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
681
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeSelectionReducer }); }
682
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodeSelectionReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
683
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodeSelectionReducer });
682
684
  }
683
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeSelectionReducer, decorators: [{
685
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodeSelectionReducer, decorators: [{
684
686
  type: Injectable
685
687
  }] });
686
688
 
687
689
  class TreeNodesSearchReducer {
688
- constructor() {
689
- this.processedActions = [
690
- NgssmTreeActionType.displaySearchDialog,
691
- NgssmTreeActionType.closeSearchDialog,
692
- NgssmTreeActionType.searchTreeNodes,
693
- NgssmTreeActionType.registerPartialSearchResults,
694
- NgssmTreeActionType.abortTreeNodesSearch
695
- ];
696
- }
690
+ processedActions = [
691
+ NgssmTreeActionType.displaySearchDialog,
692
+ NgssmTreeActionType.closeSearchDialog,
693
+ NgssmTreeActionType.searchTreeNodes,
694
+ NgssmTreeActionType.registerPartialSearchResults,
695
+ NgssmTreeActionType.abortTreeNodesSearch
696
+ ];
697
697
  updateState(state, action) {
698
698
  switch (action.type) {
699
699
  case NgssmTreeActionType.displaySearchDialog: {
@@ -761,17 +761,15 @@ class TreeNodesSearchReducer {
761
761
  }
762
762
  return state;
763
763
  }
764
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodesSearchReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
765
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodesSearchReducer }); }
764
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodesSearchReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
765
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodesSearchReducer });
766
766
  }
767
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodesSearchReducer, decorators: [{
767
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodesSearchReducer, decorators: [{
768
768
  type: Injectable
769
769
  }] });
770
770
 
771
771
  class TreeNodesReducer {
772
- constructor() {
773
- this.processedActions = [NgssmTreeActionType.registerNodes];
774
- }
772
+ processedActions = [NgssmTreeActionType.registerNodes];
775
773
  updateState(state, action) {
776
774
  switch (action.type) {
777
775
  case NgssmTreeActionType.registerNodes: {
@@ -808,17 +806,15 @@ class TreeNodesReducer {
808
806
  }
809
807
  return state;
810
808
  }
811
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodesReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
812
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodesReducer }); }
809
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodesReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
810
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodesReducer });
813
811
  }
814
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodesReducer, decorators: [{
812
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreeNodesReducer, decorators: [{
815
813
  type: Injectable
816
814
  }] });
817
815
 
818
- let TreesReducer$1 = class TreesReducer {
819
- constructor() {
820
- this.processedActions = [NgssmTreeActionType.initNgssmTree, NgssmTreeActionType.deleteNgssmTree];
821
- }
816
+ class TreesReducer {
817
+ processedActions = [NgssmTreeActionType.initNgssmTree, NgssmTreeActionType.deleteNgssmTree];
822
818
  updateState(state, action) {
823
819
  switch (action.type) {
824
820
  case NgssmTreeActionType.initNgssmTree: {
@@ -850,772 +846,20 @@ let TreesReducer$1 = class TreesReducer {
850
846
  }
851
847
  return state;
852
848
  }
853
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreesReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
854
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreesReducer }); }
855
- };
856
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreesReducer$1, decorators: [{
849
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreesReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
850
+ static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreesReducer });
851
+ }
852
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: TreesReducer, decorators: [{
857
853
  type: Injectable
858
854
  }] });
859
855
 
860
856
  const provideNgssmTree = () => {
861
857
  return makeEnvironmentProviders([
862
- provideReducers(TreeNodeExpandReducer$1, TreeNodeSelectionReducer, TreeNodesSearchReducer, TreeNodesReducer, TreesReducer$1),
858
+ provideReducers(TreeNodeExpandReducer, TreeNodeSelectionReducer, TreeNodesSearchReducer, TreeNodesReducer, TreesReducer),
863
859
  provideEffects(TreeNodeLoadingEffect, TreeNodesSearchingEffect)
864
860
  ]);
865
861
  };
866
862
 
867
- var NgssmExpressionTreeActionType;
868
- (function (NgssmExpressionTreeActionType) {
869
- // List of trees management
870
- NgssmExpressionTreeActionType["ngssmInitExpressionTree"] = "[NgssmExpressionTreeActionType] ngssmInitExpressionTree";
871
- NgssmExpressionTreeActionType["ngssmClearExpressionTree"] = "[NgssmExpressionTreeActionType] ngssmClearExpressionTree";
872
- // Manage expand/collapse
873
- NgssmExpressionTreeActionType["ngssmCollapseExpressionTreeNode"] = "[NgssmExpressionTreeActionType] ngssmCollapseExpressionTreeNode";
874
- NgssmExpressionTreeActionType["ngssmExpandExpressionTreeNode"] = "[NgssmExpressionTreeActionType] ngssmExpandExpressionTreeNode";
875
- NgssmExpressionTreeActionType["ngssmCollapseAllExpressionTreeNodes"] = "[NgssmExpressionTreeActionType] ngssmCollapseAllExpressionTreeNodes";
876
- NgssmExpressionTreeActionType["ngssmExpandAllExpressionTreeNodes"] = "[NgssmExpressionTreeActionType] ngssmExpandAllExpressionTreeNodes";
877
- // Node edition
878
- NgssmExpressionTreeActionType["ngssmAddExpressionTreeNode"] = "[NgssmExpressionTreeActionType] ngssmAddExpressionTreeNode";
879
- NgssmExpressionTreeActionType["ngssmAddExpressionTreeNodes"] = "[NgssmExpressionTreeActionType] ngssmAddExpressionTreeNodes";
880
- NgssmExpressionTreeActionType["ngssmDeleteExpressionTreeNode"] = "[NgssmExpressionTreeActionType] ngssmDeleteExpressionTreeNode";
881
- NgssmExpressionTreeActionType["ngssmUpdateExpressionTreeNode"] = "[NgssmExpressionTreeActionType] ngssmUpdateExpressionTreeNode";
882
- // Cut/Paste
883
- NgssmExpressionTreeActionType["ngssmCutExpressionTreeNode"] = "[NgssmExpressionTreeActionType] ngssmCutExpressionTreeNode";
884
- NgssmExpressionTreeActionType["ngssmPasteExpressionTreeNode"] = "[NgssmExpressionTreeActionType] ngssmPasteExpressionTreeNode";
885
- NgssmExpressionTreeActionType["ngssmCancelCutExpressionTreeNode"] = "[NgssmExpressionTreeActionType] ngssmCancelCutExpressionTreeNode";
886
- })(NgssmExpressionTreeActionType || (NgssmExpressionTreeActionType = {}));
887
-
888
- class NgssmExpressionTreeAction {
889
- constructor(type, treeId) {
890
- this.type = type;
891
- this.treeId = treeId;
892
- }
893
- }
894
-
895
- class NgssmClearExpressionTreeAction extends NgssmExpressionTreeAction {
896
- constructor(treeId) {
897
- super(NgssmExpressionTreeActionType.ngssmClearExpressionTree, treeId);
898
- }
899
- }
900
-
901
- class NgssmInitExpressionTreeAction extends NgssmExpressionTreeAction {
902
- constructor(treeId, nodes) {
903
- super(NgssmExpressionTreeActionType.ngssmInitExpressionTree, treeId);
904
- this.nodes = nodes;
905
- }
906
- }
907
-
908
- class NgssmExpressionTreeNodeAction extends NgssmExpressionTreeAction {
909
- constructor(type, treeId, nodeId) {
910
- super(type, treeId);
911
- this.nodeId = nodeId;
912
- }
913
- }
914
-
915
- class NgssmExpandExpressionTreeNodeAction extends NgssmExpressionTreeNodeAction {
916
- constructor(treeId, nodeId) {
917
- super(NgssmExpressionTreeActionType.ngssmExpandExpressionTreeNode, treeId, nodeId);
918
- }
919
- }
920
-
921
- class NgssmCollapseExpressionTreeNodeAction extends NgssmExpressionTreeNodeAction {
922
- constructor(treeId, nodeId) {
923
- super(NgssmExpressionTreeActionType.ngssmCollapseExpressionTreeNode, treeId, nodeId);
924
- }
925
- }
926
-
927
- class NgssmAddExpressionTreeNodeAction extends NgssmExpressionTreeAction {
928
- constructor(treeId, node) {
929
- super(NgssmExpressionTreeActionType.ngssmAddExpressionTreeNode, treeId);
930
- this.node = node;
931
- }
932
- }
933
-
934
- class NgssmDeleteExpressionTreeNodeAction extends NgssmExpressionTreeNodeAction {
935
- constructor(treeId, nodeId) {
936
- super(NgssmExpressionTreeActionType.ngssmDeleteExpressionTreeNode, treeId, nodeId);
937
- }
938
- }
939
-
940
- class NgssmUpdateExpressionTreeNodeAction extends NgssmExpressionTreeNodeAction {
941
- constructor(treeId, nodeId, data) {
942
- super(NgssmExpressionTreeActionType.ngssmUpdateExpressionTreeNode, treeId, nodeId);
943
- this.data = data;
944
- }
945
- }
946
-
947
- class NgssmCollapseAllExpressionTreeNodesAction extends NgssmExpressionTreeAction {
948
- constructor(treeId) {
949
- super(NgssmExpressionTreeActionType.ngssmCollapseAllExpressionTreeNodes, treeId);
950
- }
951
- }
952
-
953
- class NgssmExpandAllExpressionTreeNodesAction extends NgssmExpressionTreeAction {
954
- constructor(treeId) {
955
- super(NgssmExpressionTreeActionType.ngssmExpandAllExpressionTreeNodes, treeId);
956
- }
957
- }
958
-
959
- class NgssmAddExpressionTreeNodesAction extends NgssmExpressionTreeAction {
960
- constructor(treeId, nodes) {
961
- super(NgssmExpressionTreeActionType.ngssmAddExpressionTreeNodes, treeId);
962
- this.nodes = nodes;
963
- }
964
- }
965
-
966
- class NgssmCutExpressionTreeNodeAction extends NgssmExpressionTreeNodeAction {
967
- constructor(treeId, nodeId) {
968
- super(NgssmExpressionTreeActionType.ngssmCutExpressionTreeNode, treeId, nodeId);
969
- }
970
- }
971
-
972
- class NgssmPasteExpressionTreeNodeAction extends NgssmExpressionTreeNodeAction {
973
- constructor(treeId, nodeId, target) {
974
- super(NgssmExpressionTreeActionType.ngssmPasteExpressionTreeNode, treeId, nodeId);
975
- this.target = target;
976
- }
977
- }
978
-
979
- class NgssmCancelCutExpressionTreeNodeAction extends NgssmExpressionTreeAction {
980
- constructor(treeId) {
981
- super(NgssmExpressionTreeActionType.ngssmCancelCutExpressionTreeNode, treeId);
982
- }
983
- }
984
-
985
- const createNgssmExpressionTreeFromNodes = (nodes) => {
986
- const tree = {
987
- nodes: [],
988
- data: {}
989
- };
990
- let path = [];
991
- nodes.forEach((node) => {
992
- if (!node.parentId) {
993
- path = [];
994
- }
995
- else {
996
- const parentIdIndex = path.indexOf(node.parentId);
997
- if (parentIdIndex === -1) {
998
- path.push(node.parentId);
999
- }
1000
- else {
1001
- path.splice(parentIdIndex + 1);
1002
- }
1003
- }
1004
- tree.nodes.push({
1005
- path: [...path],
1006
- data: node,
1007
- isExpanded: node.isExpandable === true
1008
- });
1009
- tree.data[node.id] = node.data;
1010
- });
1011
- return tree;
1012
- };
1013
-
1014
- const selectNgssmExpressionTreeState = (state) => state[NgssmExpressionTreeStateSpecification.featureStateKey];
1015
- const updateNgssmExpressionTreeState = (state, command) => update(state, {
1016
- [NgssmExpressionTreeStateSpecification.featureStateKey]: command
1017
- });
1018
- let NgssmExpressionTreeStateSpecification = class NgssmExpressionTreeStateSpecification {
1019
- static { this.featureStateKey = 'ngssm-expression-tree-state'; }
1020
- static { this.initialState = {
1021
- trees: {}
1022
- }; }
1023
- };
1024
- NgssmExpressionTreeStateSpecification = __decorate([
1025
- NgSsmFeatureState({
1026
- featureStateKey: NgssmExpressionTreeStateSpecification.featureStateKey,
1027
- initialState: NgssmExpressionTreeStateSpecification.initialState
1028
- })
1029
- ], NgssmExpressionTreeStateSpecification);
1030
-
1031
- class TreesReducer {
1032
- constructor() {
1033
- this.processedActions = [
1034
- NgssmExpressionTreeActionType.ngssmInitExpressionTree,
1035
- NgssmExpressionTreeActionType.ngssmClearExpressionTree
1036
- ];
1037
- }
1038
- updateState(state, action) {
1039
- switch (action.type) {
1040
- case NgssmExpressionTreeActionType.ngssmInitExpressionTree: {
1041
- const ngssmInitExpressionTreeAction = action;
1042
- return updateNgssmExpressionTreeState(state, {
1043
- trees: {
1044
- [ngssmInitExpressionTreeAction.treeId]: {
1045
- $set: createNgssmExpressionTreeFromNodes(ngssmInitExpressionTreeAction.nodes)
1046
- }
1047
- }
1048
- });
1049
- }
1050
- case NgssmExpressionTreeActionType.ngssmClearExpressionTree: {
1051
- const ngssmClearExpressionTreeAction = action;
1052
- return updateNgssmExpressionTreeState(state, {
1053
- trees: {
1054
- $unset: [ngssmClearExpressionTreeAction.treeId]
1055
- }
1056
- });
1057
- }
1058
- }
1059
- return state;
1060
- }
1061
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreesReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1062
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreesReducer }); }
1063
- }
1064
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreesReducer, decorators: [{
1065
- type: Injectable
1066
- }] });
1067
-
1068
- class TreeNodeExpandReducer {
1069
- constructor() {
1070
- this.processedActions = [
1071
- NgssmExpressionTreeActionType.ngssmExpandExpressionTreeNode,
1072
- NgssmExpressionTreeActionType.ngssmCollapseExpressionTreeNode,
1073
- NgssmExpressionTreeActionType.ngssmCollapseAllExpressionTreeNodes,
1074
- NgssmExpressionTreeActionType.ngssmExpandAllExpressionTreeNodes
1075
- ];
1076
- }
1077
- updateState(state, action) {
1078
- switch (action.type) {
1079
- case NgssmExpressionTreeActionType.ngssmExpandExpressionTreeNode: {
1080
- const ngssmExpandExpressionTreeNodeAction = action;
1081
- return this.setIsExpanded(state, ngssmExpandExpressionTreeNodeAction.treeId, ngssmExpandExpressionTreeNodeAction.nodeId, true);
1082
- }
1083
- case NgssmExpressionTreeActionType.ngssmCollapseExpressionTreeNode: {
1084
- const ngssmCollapseExpressionTreeNodeAction = action;
1085
- return this.setIsExpanded(state, ngssmCollapseExpressionTreeNodeAction.treeId, ngssmCollapseExpressionTreeNodeAction.nodeId, false);
1086
- }
1087
- case NgssmExpressionTreeActionType.ngssmCollapseAllExpressionTreeNodes: {
1088
- const ngssmExpressionTreeAction = action;
1089
- return updateNgssmExpressionTreeState(state, {
1090
- trees: {
1091
- [ngssmExpressionTreeAction.treeId]: {
1092
- nodes: {
1093
- $apply: (values) => {
1094
- const output = [];
1095
- values.forEach((value) => output.push({
1096
- ...value,
1097
- isExpanded: false
1098
- }));
1099
- return output;
1100
- }
1101
- }
1102
- }
1103
- }
1104
- });
1105
- }
1106
- case NgssmExpressionTreeActionType.ngssmExpandAllExpressionTreeNodes: {
1107
- const ngssmExpressionTreeAction = action;
1108
- return updateNgssmExpressionTreeState(state, {
1109
- trees: {
1110
- [ngssmExpressionTreeAction.treeId]: {
1111
- nodes: {
1112
- $apply: (values) => {
1113
- const output = [];
1114
- values.forEach((value) => output.push({
1115
- ...value,
1116
- isExpanded: true
1117
- }));
1118
- return output;
1119
- }
1120
- }
1121
- }
1122
- }
1123
- });
1124
- }
1125
- }
1126
- return state;
1127
- }
1128
- setIsExpanded(state, treeId, nodeId, isExpanded) {
1129
- return updateNgssmExpressionTreeState(state, {
1130
- trees: {
1131
- [treeId]: {
1132
- nodes: {
1133
- $apply: (values) => {
1134
- const output = [...values];
1135
- const index = output.findIndex((n) => n.data.id === nodeId);
1136
- if (index !== -1) {
1137
- output.splice(index, 1, update(output[index], { isExpanded: { $set: isExpanded } }));
1138
- }
1139
- return output;
1140
- }
1141
- }
1142
- }
1143
- }
1144
- });
1145
- }
1146
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeExpandReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1147
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeExpandReducer }); }
1148
- }
1149
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeExpandReducer, decorators: [{
1150
- type: Injectable
1151
- }] });
1152
-
1153
- class TreeNodeEditionReducer {
1154
- constructor() {
1155
- this.processedActions = [
1156
- NgssmExpressionTreeActionType.ngssmAddExpressionTreeNode,
1157
- NgssmExpressionTreeActionType.ngssmDeleteExpressionTreeNode,
1158
- NgssmExpressionTreeActionType.ngssmUpdateExpressionTreeNode,
1159
- NgssmExpressionTreeActionType.ngssmAddExpressionTreeNodes
1160
- ];
1161
- }
1162
- updateState(state, action) {
1163
- switch (action.type) {
1164
- case NgssmExpressionTreeActionType.ngssmAddExpressionTreeNode: {
1165
- const ngssmAddExpressionTreeNodeAction = action;
1166
- return updateNgssmExpressionTreeState(state, {
1167
- trees: {
1168
- [ngssmAddExpressionTreeNodeAction.treeId]: {
1169
- data: {
1170
- [ngssmAddExpressionTreeNodeAction.node.id]: { $set: ngssmAddExpressionTreeNodeAction.node.data }
1171
- },
1172
- nodes: {
1173
- $apply: (values) => {
1174
- const output = [...values];
1175
- this.addNodeToList(ngssmAddExpressionTreeNodeAction.node, output);
1176
- return output;
1177
- }
1178
- }
1179
- }
1180
- }
1181
- });
1182
- }
1183
- case NgssmExpressionTreeActionType.ngssmAddExpressionTreeNodes: {
1184
- const ngssmAddExpressionTreeNodesAction = action;
1185
- const newProps = {};
1186
- ngssmAddExpressionTreeNodesAction.nodes.forEach((node) => (newProps[node.id] = node.data));
1187
- return updateNgssmExpressionTreeState(state, {
1188
- trees: {
1189
- [ngssmAddExpressionTreeNodesAction.treeId]: {
1190
- data: { $merge: newProps },
1191
- nodes: {
1192
- $apply: (values) => {
1193
- const output = [...values];
1194
- ngssmAddExpressionTreeNodesAction.nodes.forEach((node) => this.addNodeToList(node, output));
1195
- return output;
1196
- }
1197
- }
1198
- }
1199
- }
1200
- });
1201
- }
1202
- case NgssmExpressionTreeActionType.ngssmDeleteExpressionTreeNode: {
1203
- const ngssmDeleteExpressionTreeNodeAction = action;
1204
- const nodeIdsToDelete = selectNgssmExpressionTreeState(state)
1205
- .trees[ngssmDeleteExpressionTreeNodeAction.treeId].nodes.filter((n) => n.path.includes(ngssmDeleteExpressionTreeNodeAction.nodeId))
1206
- .map((n) => n.data.id);
1207
- nodeIdsToDelete.push(ngssmDeleteExpressionTreeNodeAction.nodeId);
1208
- return updateNgssmExpressionTreeState(state, {
1209
- trees: {
1210
- [ngssmDeleteExpressionTreeNodeAction.treeId]: {
1211
- nodes: { $apply: (values) => values.filter((v) => !nodeIdsToDelete.includes(v.data.id)) },
1212
- data: { $unset: nodeIdsToDelete }
1213
- }
1214
- }
1215
- });
1216
- }
1217
- case NgssmExpressionTreeActionType.ngssmUpdateExpressionTreeNode: {
1218
- const ngssmUpdateExpressionTreeNodeAction = action;
1219
- return updateNgssmExpressionTreeState(state, {
1220
- trees: {
1221
- [ngssmUpdateExpressionTreeNodeAction.treeId]: {
1222
- data: {
1223
- [ngssmUpdateExpressionTreeNodeAction.nodeId]: { $set: ngssmUpdateExpressionTreeNodeAction.data }
1224
- }
1225
- }
1226
- }
1227
- });
1228
- }
1229
- }
1230
- return state;
1231
- }
1232
- addNodeToList(node, nodeList) {
1233
- if (node.parentId === undefined) {
1234
- nodeList.push({
1235
- path: [],
1236
- data: node,
1237
- isExpanded: true
1238
- });
1239
- return;
1240
- }
1241
- let parentNode;
1242
- let insertionIndex = -1;
1243
- for (let i = 0; i < nodeList.length; i++) {
1244
- if (parentNode) {
1245
- if (nodeList[i].path.includes(node.parentId)) {
1246
- insertionIndex = i + 1;
1247
- }
1248
- else {
1249
- break;
1250
- }
1251
- continue;
1252
- }
1253
- if (nodeList[i].data.id === node.parentId) {
1254
- parentNode = nodeList[i];
1255
- insertionIndex = i + 1;
1256
- continue;
1257
- }
1258
- }
1259
- if (!parentNode || insertionIndex === -1) {
1260
- throw new Error('Invalid parent id');
1261
- }
1262
- nodeList.splice(insertionIndex, 0, {
1263
- path: [...parentNode.path, parentNode.data.id],
1264
- data: node,
1265
- isExpanded: true
1266
- });
1267
- }
1268
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeEditionReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1269
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeEditionReducer }); }
1270
- }
1271
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: TreeNodeEditionReducer, decorators: [{
1272
- type: Injectable
1273
- }] });
1274
-
1275
- class CutAndPasteReducer {
1276
- constructor() {
1277
- this.processedActions = [
1278
- NgssmExpressionTreeActionType.ngssmCutExpressionTreeNode,
1279
- NgssmExpressionTreeActionType.ngssmCancelCutExpressionTreeNode,
1280
- NgssmExpressionTreeActionType.ngssmPasteExpressionTreeNode
1281
- ];
1282
- }
1283
- updateState(state, action) {
1284
- switch (action.type) {
1285
- case NgssmExpressionTreeActionType.ngssmCutExpressionTreeNode: {
1286
- const ngssmCutExpressionTreeNodeAction = action;
1287
- return updateNgssmExpressionTreeState(state, {
1288
- trees: {
1289
- [ngssmCutExpressionTreeNodeAction.treeId]: {
1290
- nodeCut: {
1291
- $set: selectNgssmExpressionTreeState(state).trees[ngssmCutExpressionTreeNodeAction.treeId]?.nodes.find((n) => n.data.id === ngssmCutExpressionTreeNodeAction.nodeId)
1292
- }
1293
- }
1294
- }
1295
- });
1296
- }
1297
- case NgssmExpressionTreeActionType.ngssmCancelCutExpressionTreeNode: {
1298
- const ngssmCancelCutExpressionTreeNodeAction = action;
1299
- return this.resetCutAndPaste(state, ngssmCancelCutExpressionTreeNodeAction.treeId);
1300
- }
1301
- case NgssmExpressionTreeActionType.ngssmPasteExpressionTreeNode: {
1302
- const ngssmPasteExpressionTreeNodeAction = action;
1303
- const tree = selectNgssmExpressionTreeState(state).trees[ngssmPasteExpressionTreeNodeAction.treeId];
1304
- const cutNode = tree.nodeCut;
1305
- if (!cutNode) {
1306
- return state;
1307
- }
1308
- const currentIndex = tree.nodes.findIndex((n) => n.data.id === cutNode.data.id);
1309
- if (currentIndex === -1) {
1310
- return this.resetCutAndPaste(state, ngssmPasteExpressionTreeNodeAction.treeId);
1311
- }
1312
- const targetNode = tree.nodes.find((n) => n.data.id === ngssmPasteExpressionTreeNodeAction.nodeId);
1313
- if (!targetNode) {
1314
- return this.resetCutAndPaste(state, ngssmPasteExpressionTreeNodeAction.treeId);
1315
- }
1316
- let targetIndex = tree.nodes.findIndex((n) => n.data.id === ngssmPasteExpressionTreeNodeAction.nodeId);
1317
- if (ngssmPasteExpressionTreeNodeAction.target === 'Inside') {
1318
- targetIndex = targetIndex + 1;
1319
- }
1320
- else {
1321
- for (let index = targetIndex; index < tree.nodes.length; index++) {
1322
- if (!(tree.nodes[index + 1]?.path ?? []).includes(ngssmPasteExpressionTreeNodeAction.nodeId)) {
1323
- targetIndex = index + 1;
1324
- break;
1325
- }
1326
- }
1327
- }
1328
- const newBasePath = ngssmPasteExpressionTreeNodeAction.target === 'After' ? targetNode.path : [...targetNode.path, targetNode.data.id];
1329
- const pathPartsToRemove = cutNode.path.length;
1330
- if (newBasePath === cutNode.path && currentIndex === targetIndex) {
1331
- return this.resetCutAndPaste(state, ngssmPasteExpressionTreeNodeAction.treeId);
1332
- }
1333
- const movedNode = update(cutNode, {
1334
- path: { $set: newBasePath },
1335
- data: {
1336
- parentId: { $set: ngssmPasteExpressionTreeNodeAction.target === 'After' ? targetNode.data.parentId : targetNode.data.id }
1337
- }
1338
- });
1339
- const nodesToMove = tree.nodes
1340
- .filter((n) => n.path.includes(cutNode.data.id))
1341
- .map((node) => ({
1342
- ...node,
1343
- path: [...newBasePath, ...node.path.slice(pathPartsToRemove)]
1344
- }));
1345
- return updateNgssmExpressionTreeState(state, {
1346
- trees: {
1347
- [ngssmPasteExpressionTreeNodeAction.treeId]: {
1348
- nodes: {
1349
- $apply: (nodes) => {
1350
- const output = [...nodes];
1351
- if (targetIndex > currentIndex) {
1352
- output.splice(targetIndex, 0, movedNode, ...nodesToMove);
1353
- output.splice(currentIndex, nodesToMove.length + 1);
1354
- return output;
1355
- }
1356
- output.splice(currentIndex, nodesToMove.length + 1);
1357
- output.splice(targetIndex, 0, movedNode, ...nodesToMove);
1358
- return output;
1359
- }
1360
- },
1361
- nodeCut: { $set: undefined }
1362
- }
1363
- }
1364
- });
1365
- }
1366
- }
1367
- return state;
1368
- }
1369
- resetCutAndPaste(state, treeId) {
1370
- return updateNgssmExpressionTreeState(state, {
1371
- trees: {
1372
- [treeId]: { $unset: ['nodeCut'] }
1373
- }
1374
- });
1375
- }
1376
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CutAndPasteReducer, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1377
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CutAndPasteReducer }); }
1378
- }
1379
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: CutAndPasteReducer, decorators: [{
1380
- type: Injectable
1381
- }] });
1382
-
1383
- const provideNgssmExpressionTree = () => {
1384
- return makeEnvironmentProviders([provideReducers(CutAndPasteReducer, TreeNodeEditionReducer, TreeNodeExpandReducer, TreesReducer)]);
1385
- };
1386
-
1387
- const getDefaultCutAndPaste = () => ({
1388
- isCutAndPasteInProgress: false,
1389
- isPartOfCut: false,
1390
- canCut: false,
1391
- canPasteInside: false,
1392
- canPasteAfter: false
1393
- });
1394
- class NgssmExpressionTreeNodeComponent {
1395
- constructor() {
1396
- this.store = inject(Store);
1397
- this.trees = createSignal((state) => selectNgssmExpressionTreeState(state).trees);
1398
- this.tree = signal(undefined, ...(ngDevMode ? [{ debugName: "tree" }] : []));
1399
- this.nodeId = input(...(ngDevMode ? [undefined, { debugName: "nodeId" }] : []));
1400
- this.treeConfig = input(undefined, ...(ngDevMode ? [{ debugName: "treeConfig" }] : []));
1401
- this.nodeLabel = signal('', ...(ngDevMode ? [{ debugName: "nodeLabel" }] : []));
1402
- this.nodeCssIcon = signal(undefined, ...(ngDevMode ? [{ debugName: "nodeCssIcon" }] : []));
1403
- this.nodeDescription = signal(undefined, ...(ngDevMode ? [{ debugName: "nodeDescription" }] : []));
1404
- this.cutAndPaste = signal(getDefaultCutAndPaste(), ...(ngDevMode ? [{ debugName: "cutAndPaste" }] : []));
1405
- this.componentAction = signal(undefined, ...(ngDevMode ? [{ debugName: "componentAction" }] : []));
1406
- this.componentToDisplay = signal(undefined, ...(ngDevMode ? [{ debugName: "componentToDisplay" }] : []));
1407
- effect(() => {
1408
- const currentNodeId = this.nodeId();
1409
- const config = this.treeConfig();
1410
- if (!currentNodeId || !config) {
1411
- this.tree.set(undefined);
1412
- return;
1413
- }
1414
- this.tree.set(this.trees()[config.treeId]);
1415
- });
1416
- effect(() => {
1417
- const currentNodeId = this.nodeId();
1418
- const config = this.treeConfig();
1419
- if (!currentNodeId || !config) {
1420
- return;
1421
- }
1422
- this.componentAction.set((c) => c.setup(config.treeId, currentNodeId));
1423
- this.componentToDisplay.set(config.nodeDescriptionComponent);
1424
- });
1425
- effect(() => {
1426
- const currentTree = this.tree();
1427
- const currentNodeId = untracked(() => this.nodeId());
1428
- const currentConfig = untracked(() => this.treeConfig());
1429
- if (!currentNodeId || !currentTree || !currentConfig) {
1430
- return;
1431
- }
1432
- const node = currentTree.nodes.find((v) => v.data.id === currentNodeId);
1433
- const nodeValue = currentTree.data[currentNodeId];
1434
- const cutAndPaste = getDefaultCutAndPaste();
1435
- const nodeCut = currentTree.nodeCut;
1436
- if (node && currentConfig && nodeValue) {
1437
- this.nodeLabel.set(currentConfig.getNodeLabel?.(node, nodeValue) ?? '');
1438
- this.nodeCssIcon.set(currentConfig.getNodeCssIcon?.(node, nodeValue) ?? undefined);
1439
- this.nodeDescription.set(currentConfig.getNodeDescription?.(node, nodeValue));
1440
- cutAndPaste.canCut = currentConfig.canCut?.(node) ?? true;
1441
- if (nodeCut) {
1442
- cutAndPaste.isPartOfCut = nodeCut.data.id === node.data.id || node.path.includes(nodeCut.data.id);
1443
- if (!cutAndPaste.isPartOfCut) {
1444
- cutAndPaste.canPasteInside = currentConfig.canPaste?.(nodeCut, node, 'Inside') ?? false;
1445
- cutAndPaste.canPasteAfter = currentConfig.canPaste?.(nodeCut, node, 'After') ?? false;
1446
- }
1447
- }
1448
- }
1449
- cutAndPaste.isCutAndPasteInProgress = !!nodeCut;
1450
- this.cutAndPaste.set(cutAndPaste);
1451
- });
1452
- }
1453
- expandAll() {
1454
- const treeId = this.treeConfig()?.treeId;
1455
- if (treeId) {
1456
- this.store.dispatchAction(new NgssmExpandAllExpressionTreeNodesAction(treeId));
1457
- }
1458
- }
1459
- collapseAll() {
1460
- const treeId = this.treeConfig()?.treeId;
1461
- if (treeId) {
1462
- this.store.dispatchAction(new NgssmCollapseAllExpressionTreeNodesAction(treeId));
1463
- }
1464
- }
1465
- cut() {
1466
- const treeId = this.treeConfig()?.treeId;
1467
- const nodeId = this.nodeId();
1468
- if (treeId && nodeId) {
1469
- this.store.dispatchAction(new NgssmCutExpressionTreeNodeAction(treeId, nodeId));
1470
- }
1471
- }
1472
- cancelCut() {
1473
- const treeId = this.treeConfig()?.treeId;
1474
- if (treeId) {
1475
- this.store.dispatchAction(new NgssmCancelCutExpressionTreeNodeAction(treeId));
1476
- }
1477
- }
1478
- paste(target) {
1479
- const treeId = this.treeConfig()?.treeId;
1480
- const nodeId = this.nodeId();
1481
- if (treeId && nodeId) {
1482
- this.store.dispatchAction(new NgssmPasteExpressionTreeNodeAction(treeId, nodeId, target));
1483
- }
1484
- }
1485
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgssmExpressionTreeNodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1486
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: NgssmExpressionTreeNodeComponent, isStandalone: true, selector: "ngssm-expression-tree-node", inputs: { nodeId: { classPropertyName: "nodeId", publicName: "nodeId", isSignal: true, isRequired: false, transformFunction: null }, treeConfig: { classPropertyName: "treeConfig", publicName: "treeConfig", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (nodeCssIcon(); as css) {\n <div class=\"ngssm-expression-tree-node-icon\" id=\"treeNodeIcon\">\n <mat-icon class=\"{{ css }}\"></mat-icon>\n </div>\n}\n\n<div\n class=\"ngssm-expression-tree-node-label\"\n [matMenuTriggerFor]=\"contextMenu\"\n [class.ngssm-expression-tree-node-to-cut]=\"cutAndPaste().isPartOfCut === true\"\n id=\"treeNodeLabel\">\n {{ nodeLabel() }}\n</div>\n\n<div class=\"ngssm-expression-tree-node-description\" [innerHTML]=\"nodeDescription()\"></div>\n\n@let component = componentToDisplay();\n@if (component) {\n <div\n class=\"ngssm-expression-tree-node-description-component\"\n [ngssmComponentDisplay]=\"component\"\n [ngssmComponentAction]=\"componentAction()\"></div>\n}\n\n<mat-menu #contextMenu=\"matMenu\" [class]=\"'ngssm-expression-tree-popup-menu'\">\n @let cutAndPasteSetup = cutAndPaste();\n @if (treeConfig()?.displayCutAndPasteMenus === true && cutAndPasteSetup) {\n <div class=\"flex-column-stretch\">\n @if (cutAndPasteSetup.isCutAndPasteInProgress === false) {\n <button mat-menu-item (click)=\"cut()\" [disabled]=\"cutAndPasteSetup.canCut !== true\">\n <mat-icon class=\"fa-solid fa-scissors\"></mat-icon>\n <span>Cut</span>\n </button>\n } @else {\n <button mat-menu-item (click)=\"cancelCut()\">\n <mat-icon class=\"fa-solid fa-slash\"></mat-icon>\n <span>Cancel cut</span>\n </button>\n }\n\n <button mat-menu-item [disabled]=\"cutAndPasteSetup.canPasteInside !== true\" (click)=\"paste('Inside')\">\n <mat-icon class=\"fa-solid fa-paste\"></mat-icon>\n <span>Paste inside</span>\n </button>\n <button mat-menu-item [disabled]=\"cutAndPasteSetup.canPasteAfter !== true\" (click)=\"paste('After')\">\n <mat-icon class=\"fa-solid fa-paste\"></mat-icon>\n <span>Paste after</span>\n </button>\n <mat-divider></mat-divider>\n </div>\n }\n\n <button mat-menu-item (click)=\"expandAll()\">\n <mat-icon class=\"fa-solid fa-up-right-and-down-left-from-center\"></mat-icon>\n <span>Expand all</span>\n </button>\n <button mat-menu-item (click)=\"collapseAll()\">\n <mat-icon class=\"fa-solid fa-down-left-and-up-right-to-center\"></mat-icon>\n <span>Collapse all</span>\n </button>\n</mat-menu>\n", styles: [":host{display:flex;flex-direction:row;align-items:center;flex:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i2$3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i2$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i2$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i3$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: NgssmComponentDisplayDirective, selector: "[ngssmComponentDisplay]", inputs: ["ngssmComponentDisplay", "ngssmComponentAction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1487
- }
1488
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgssmExpressionTreeNodeComponent, decorators: [{
1489
- type: Component,
1490
- args: [{ selector: 'ngssm-expression-tree-node', imports: [CommonModule, MatIconModule, MatMenuModule, MatDividerModule, NgssmComponentDisplayDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (nodeCssIcon(); as css) {\n <div class=\"ngssm-expression-tree-node-icon\" id=\"treeNodeIcon\">\n <mat-icon class=\"{{ css }}\"></mat-icon>\n </div>\n}\n\n<div\n class=\"ngssm-expression-tree-node-label\"\n [matMenuTriggerFor]=\"contextMenu\"\n [class.ngssm-expression-tree-node-to-cut]=\"cutAndPaste().isPartOfCut === true\"\n id=\"treeNodeLabel\">\n {{ nodeLabel() }}\n</div>\n\n<div class=\"ngssm-expression-tree-node-description\" [innerHTML]=\"nodeDescription()\"></div>\n\n@let component = componentToDisplay();\n@if (component) {\n <div\n class=\"ngssm-expression-tree-node-description-component\"\n [ngssmComponentDisplay]=\"component\"\n [ngssmComponentAction]=\"componentAction()\"></div>\n}\n\n<mat-menu #contextMenu=\"matMenu\" [class]=\"'ngssm-expression-tree-popup-menu'\">\n @let cutAndPasteSetup = cutAndPaste();\n @if (treeConfig()?.displayCutAndPasteMenus === true && cutAndPasteSetup) {\n <div class=\"flex-column-stretch\">\n @if (cutAndPasteSetup.isCutAndPasteInProgress === false) {\n <button mat-menu-item (click)=\"cut()\" [disabled]=\"cutAndPasteSetup.canCut !== true\">\n <mat-icon class=\"fa-solid fa-scissors\"></mat-icon>\n <span>Cut</span>\n </button>\n } @else {\n <button mat-menu-item (click)=\"cancelCut()\">\n <mat-icon class=\"fa-solid fa-slash\"></mat-icon>\n <span>Cancel cut</span>\n </button>\n }\n\n <button mat-menu-item [disabled]=\"cutAndPasteSetup.canPasteInside !== true\" (click)=\"paste('Inside')\">\n <mat-icon class=\"fa-solid fa-paste\"></mat-icon>\n <span>Paste inside</span>\n </button>\n <button mat-menu-item [disabled]=\"cutAndPasteSetup.canPasteAfter !== true\" (click)=\"paste('After')\">\n <mat-icon class=\"fa-solid fa-paste\"></mat-icon>\n <span>Paste after</span>\n </button>\n <mat-divider></mat-divider>\n </div>\n }\n\n <button mat-menu-item (click)=\"expandAll()\">\n <mat-icon class=\"fa-solid fa-up-right-and-down-left-from-center\"></mat-icon>\n <span>Expand all</span>\n </button>\n <button mat-menu-item (click)=\"collapseAll()\">\n <mat-icon class=\"fa-solid fa-down-left-and-up-right-to-center\"></mat-icon>\n <span>Collapse all</span>\n </button>\n</mat-menu>\n", styles: [":host{display:flex;flex-direction:row;align-items:center;flex:1}\n"] }]
1491
- }], ctorParameters: () => [], propDecorators: { nodeId: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeId", required: false }] }], treeConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeConfig", required: false }] }] } });
1492
-
1493
- class NgssmExpressionTreeNodeDetailsComponent {
1494
- constructor() {
1495
- this.elementRef = inject(ElementRef);
1496
- this.nodeId = input(...(ngDevMode ? [undefined, { debugName: "nodeId" }] : []));
1497
- this.treeConfig = input(...(ngDevMode ? [undefined, { debugName: "treeConfig" }] : []));
1498
- this.heightChanged = output();
1499
- this.componentAction = signal(undefined, ...(ngDevMode ? [{ debugName: "componentAction" }] : []));
1500
- this.componentToDisplay = signal(undefined, ...(ngDevMode ? [{ debugName: "componentToDisplay" }] : []));
1501
- effect(() => {
1502
- const currentNodeId = this.nodeId();
1503
- const currentConfig = this.treeConfig();
1504
- if (!currentNodeId || !currentConfig) {
1505
- return;
1506
- }
1507
- this.componentAction.set((c) => c.setup(currentConfig.treeId, currentNodeId));
1508
- this.componentToDisplay.set(currentConfig.nodeDetailComponent);
1509
- setTimeout(() => {
1510
- this.heightChanged.emit(this.elementRef?.nativeElement.getBoundingClientRect().height ?? 0);
1511
- });
1512
- });
1513
- }
1514
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgssmExpressionTreeNodeDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1515
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: NgssmExpressionTreeNodeDetailsComponent, isStandalone: true, selector: "ngssm-expression-tree-node-details", inputs: { nodeId: { classPropertyName: "nodeId", publicName: "nodeId", isSignal: true, isRequired: false, transformFunction: null }, treeConfig: { classPropertyName: "treeConfig", publicName: "treeConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { heightChanged: "heightChanged" }, ngImport: i0, template: "@if (componentToDisplay(); as component) {\n <div [ngssmComponentDisplay]=\"component\" [ngssmComponentAction]=\"componentAction()\"></div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: NgssmComponentDisplayDirective, selector: "[ngssmComponentDisplay]", inputs: ["ngssmComponentDisplay", "ngssmComponentAction"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1516
- }
1517
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgssmExpressionTreeNodeDetailsComponent, decorators: [{
1518
- type: Component,
1519
- args: [{ selector: 'ngssm-expression-tree-node-details', imports: [CommonModule, NgssmComponentDisplayDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (componentToDisplay(); as component) {\n <div [ngssmComponentDisplay]=\"component\" [ngssmComponentAction]=\"componentAction()\"></div>\n}\n" }]
1520
- }], ctorParameters: () => [], propDecorators: { nodeId: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeId", required: false }] }], treeConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeConfig", required: false }] }], heightChanged: [{ type: i0.Output, args: ["heightChanged"] }] } });
1521
-
1522
- class NgssmExpressionTreeComponent {
1523
- constructor() {
1524
- this.store = inject(Store);
1525
- this.changeDetectorRef = inject(ChangeDetectorRef);
1526
- this.trees = createSignal((state) => selectNgssmExpressionTreeState(state).trees);
1527
- this.treeConfig = input(undefined, ...(ngDevMode ? [{ debugName: "treeConfig", transform: (value) => {
1528
- if (!value) {
1529
- return value;
1530
- }
1531
- const config = {
1532
- ...value
1533
- };
1534
- if (!config.getNodeLabel) {
1535
- config.getNodeLabel = (node) => node.data.id;
1536
- }
1537
- if (!config.expandIconClass) {
1538
- config.expandIconClass = 'fa-solid fa-chevron-right';
1539
- }
1540
- if (!config.collapseIconClass) {
1541
- config.collapseIconClass = 'fa-solid fa-chevron-down';
1542
- }
1543
- return config;
1544
- } }] : [{
1545
- transform: (value) => {
1546
- if (!value) {
1547
- return value;
1548
- }
1549
- const config = {
1550
- ...value
1551
- };
1552
- if (!config.getNodeLabel) {
1553
- config.getNodeLabel = (node) => node.data.id;
1554
- }
1555
- if (!config.expandIconClass) {
1556
- config.expandIconClass = 'fa-solid fa-chevron-right';
1557
- }
1558
- if (!config.collapseIconClass) {
1559
- config.collapseIconClass = 'fa-solid fa-chevron-down';
1560
- }
1561
- return config;
1562
- }
1563
- }]));
1564
- this.displayedNodes = signal([], ...(ngDevMode ? [{ debugName: "displayedNodes" }] : []));
1565
- effect(() => {
1566
- const config = this.treeConfig();
1567
- if (!config) {
1568
- this.displayedNodes.set([]);
1569
- return;
1570
- }
1571
- const nodes = [];
1572
- const collapsedNodes = new Set();
1573
- (this.trees()[config.treeId]?.nodes ?? []).forEach((node) => {
1574
- if (node.data.isExpandable === true && node.isExpanded === false) {
1575
- collapsedNodes.add(node.data.id);
1576
- }
1577
- if (!node.data.parentId || node.path.findIndex((p) => collapsedNodes.has(p)) === -1) {
1578
- nodes.push(node);
1579
- }
1580
- });
1581
- this.displayedNodes.set(nodes);
1582
- });
1583
- }
1584
- getItemId(_, node) {
1585
- return node.data.id;
1586
- }
1587
- expand(node) {
1588
- const treeId = this.treeConfig()?.treeId;
1589
- if (treeId) {
1590
- this.store.dispatchAction(new NgssmExpandExpressionTreeNodeAction(treeId, node.data.id));
1591
- }
1592
- }
1593
- collapse(node) {
1594
- const treeId = this.treeConfig()?.treeId;
1595
- if (treeId) {
1596
- this.store.dispatchAction(new NgssmCollapseExpressionTreeNodeAction(treeId, node.data.id));
1597
- }
1598
- }
1599
- forceRefresh() {
1600
- this.changeDetectorRef.markForCheck();
1601
- }
1602
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgssmExpressionTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1603
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: NgssmExpressionTreeComponent, isStandalone: true, selector: "ngssm-expression-tree", inputs: { treeConfig: { classPropertyName: "treeConfig", publicName: "treeConfig", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@let defaultPadding = treeConfig()?.nodePadding ?? 20;\n\n<mat-card class=\"flex-column-stretch fxFlex ngssm-expression-tree\">\n @if (treeConfig(); as config) {\n <mat-card-content class=\"flex-column-stretch fxFlex ngssm-expression-tree-content\">\n @if (config.disableVirtualization) {\n <div class=\"ngssm-expression-tree-nodes-container\">\n @for (item of displayedNodes(); track item.data.id) {\n <div class=\"ngssm-expression-tree-node\" id=\"{{ 'node_' + item.data.id }}\">\n <ng-container *ngTemplateOutlet=\"nodeTemplate; context: { config, item }\"></ng-container>\n </div>\n }\n </div>\n } @else {\n <cdk-virtual-scroll-viewport [itemSize]=\"config.rowSize ?? 30\" class=\"fxFlex\">\n <div\n *cdkVirtualFor=\"let item of displayedNodes(); trackBy: getItemId\"\n class=\"ngssm-expression-tree-node\"\n id=\"{{ 'node_' + item.data.id }}\">\n <ng-container *ngTemplateOutlet=\"nodeTemplate; context: { config, item }\"></ng-container>\n </div>\n </cdk-virtual-scroll-viewport>\n }\n </mat-card-content>\n }\n</mat-card>\n\n<ng-template #nodeTemplate let-config=\"config\" let-item=\"item\">\n <div class=\"flex-row-center fxFlex\" [style.height.px]=\"config.rowSize ?? 30\">\n @for (part of item.path; track part) {\n <mat-divider\n [vertical]=\"true\"\n class=\"ngssm-expression-tree-node-divider\"\n [style.height.px]=\"config.rowSize ?? 30\"\n [style.margin-right.px]=\"defaultPadding\">\n </mat-divider>\n }\n @if ((item.data.isExpandable || item.data.hasRowDetail) && item.isExpanded === false) {\n <mat-icon class=\"{{ config.expandIconClass }}\" (click)=\"$event.stopPropagation(); expand(item)\" id=\"expandIcon\"> </mat-icon>\n }\n\n @if ((item.data.isExpandable || item.data.hasRowDetail) && item.isExpanded === true) {\n <mat-icon class=\"{{ config.collapseIconClass }}\" (click)=\"$event.stopPropagation(); collapse(item)\" id=\"collapseIcon\"> </mat-icon>\n }\n\n <ngssm-expression-tree-node [nodeId]=\"item.data.id\" [treeConfig]=\"config\"> </ngssm-expression-tree-node>\n </div>\n @if (item.data.hasRowDetail === true && item.isExpanded === true) {\n <div class=\"flex-row-center fxFlex\">\n @for (part of item.path; track part) {\n <mat-divider\n [vertical]=\"true\"\n class=\"ngssm-expression-tree-node-divider\"\n [style.height.px]=\"detailContainer.getBoundingClientRect().height\"\n [style.margin-right.px]=\"defaultPadding\">\n </mat-divider>\n }\n\n <div #detailContainer class=\"ngssm-expression-tree-node-detail-component\">\n <ngssm-expression-tree-node-details [nodeId]=\"item.data.id\" [treeConfig]=\"config\" (heightChanged)=\"forceRefresh()\">\n </ngssm-expression-tree-node-details>\n </div>\n </div>\n }\n</ng-template>\n", styles: [":host{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i2.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "component", type: MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: MatCardContent, selector: "mat-card-content" }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: NgssmExpressionTreeNodeComponent, selector: "ngssm-expression-tree-node", inputs: ["nodeId", "treeConfig"] }, { kind: "component", type: NgssmExpressionTreeNodeDetailsComponent, selector: "ngssm-expression-tree-node-details", inputs: ["nodeId", "treeConfig"], outputs: ["heightChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1604
- }
1605
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: NgssmExpressionTreeComponent, decorators: [{
1606
- type: Component,
1607
- args: [{ selector: 'ngssm-expression-tree', imports: [
1608
- CommonModule,
1609
- ScrollingModule,
1610
- MatCard,
1611
- MatCardContent,
1612
- MatDivider,
1613
- MatIcon,
1614
- NgssmExpressionTreeNodeComponent,
1615
- NgssmExpressionTreeNodeDetailsComponent
1616
- ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let defaultPadding = treeConfig()?.nodePadding ?? 20;\n\n<mat-card class=\"flex-column-stretch fxFlex ngssm-expression-tree\">\n @if (treeConfig(); as config) {\n <mat-card-content class=\"flex-column-stretch fxFlex ngssm-expression-tree-content\">\n @if (config.disableVirtualization) {\n <div class=\"ngssm-expression-tree-nodes-container\">\n @for (item of displayedNodes(); track item.data.id) {\n <div class=\"ngssm-expression-tree-node\" id=\"{{ 'node_' + item.data.id }}\">\n <ng-container *ngTemplateOutlet=\"nodeTemplate; context: { config, item }\"></ng-container>\n </div>\n }\n </div>\n } @else {\n <cdk-virtual-scroll-viewport [itemSize]=\"config.rowSize ?? 30\" class=\"fxFlex\">\n <div\n *cdkVirtualFor=\"let item of displayedNodes(); trackBy: getItemId\"\n class=\"ngssm-expression-tree-node\"\n id=\"{{ 'node_' + item.data.id }}\">\n <ng-container *ngTemplateOutlet=\"nodeTemplate; context: { config, item }\"></ng-container>\n </div>\n </cdk-virtual-scroll-viewport>\n }\n </mat-card-content>\n }\n</mat-card>\n\n<ng-template #nodeTemplate let-config=\"config\" let-item=\"item\">\n <div class=\"flex-row-center fxFlex\" [style.height.px]=\"config.rowSize ?? 30\">\n @for (part of item.path; track part) {\n <mat-divider\n [vertical]=\"true\"\n class=\"ngssm-expression-tree-node-divider\"\n [style.height.px]=\"config.rowSize ?? 30\"\n [style.margin-right.px]=\"defaultPadding\">\n </mat-divider>\n }\n @if ((item.data.isExpandable || item.data.hasRowDetail) && item.isExpanded === false) {\n <mat-icon class=\"{{ config.expandIconClass }}\" (click)=\"$event.stopPropagation(); expand(item)\" id=\"expandIcon\"> </mat-icon>\n }\n\n @if ((item.data.isExpandable || item.data.hasRowDetail) && item.isExpanded === true) {\n <mat-icon class=\"{{ config.collapseIconClass }}\" (click)=\"$event.stopPropagation(); collapse(item)\" id=\"collapseIcon\"> </mat-icon>\n }\n\n <ngssm-expression-tree-node [nodeId]=\"item.data.id\" [treeConfig]=\"config\"> </ngssm-expression-tree-node>\n </div>\n @if (item.data.hasRowDetail === true && item.isExpanded === true) {\n <div class=\"flex-row-center fxFlex\">\n @for (part of item.path; track part) {\n <mat-divider\n [vertical]=\"true\"\n class=\"ngssm-expression-tree-node-divider\"\n [style.height.px]=\"detailContainer.getBoundingClientRect().height\"\n [style.margin-right.px]=\"defaultPadding\">\n </mat-divider>\n }\n\n <div #detailContainer class=\"ngssm-expression-tree-node-detail-component\">\n <ngssm-expression-tree-node-details [nodeId]=\"item.data.id\" [treeConfig]=\"config\" (heightChanged)=\"forceRefresh()\">\n </ngssm-expression-tree-node-details>\n </div>\n </div>\n }\n</ng-template>\n", styles: [":host{display:flex;flex-direction:column}\n"] }]
1617
- }], ctorParameters: () => [], propDecorators: { treeConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeConfig", required: false }] }] } });
1618
-
1619
863
  /*
1620
864
  * Public API Surface of ngssm-tree
1621
865
  */
@@ -1624,5 +868,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
1624
868
  * Generated bundle index. Do not edit.
1625
869
  */
1626
870
 
1627
- export { CollapseNodeAction, DeleteNgssmTreeAction, DisplaySearchDialogAction, ExpandNodeAction, InitNgssmTreeAction, LoadChildrenOfNodeAction, NGSSM_TREE_DATA_SERVICE, NgssmAddExpressionTreeNodeAction, NgssmAddExpressionTreeNodesAction, NgssmBreadcrumbComponent, NgssmCancelCutExpressionTreeNodeAction, NgssmClearExpressionTreeAction, NgssmCollapseAllExpressionTreeNodesAction, NgssmCollapseExpressionTreeNodeAction, NgssmCutExpressionTreeNodeAction, NgssmDeleteExpressionTreeNodeAction, NgssmExpandAllExpressionTreeNodesAction, NgssmExpandExpressionTreeNodeAction, NgssmExpressionTreeAction, NgssmExpressionTreeActionType, NgssmExpressionTreeComponent, NgssmExpressionTreeNodeAction, NgssmExpressionTreeStateSpecification, NgssmInitExpressionTreeAction, NgssmPasteExpressionTreeNodeAction, NgssmTreeActionType, NgssmTreeComponent, NgssmTreeSearchDialogComponent, NgssmTreeStateSpecification, NgssmUpdateExpressionTreeNodeAction, RegisterNodesAction, RegisterPartialSearchResultsAction, SearchStatus, SearchTreeNodesAction, SelectNodeAction, TreeAction, TreeNodeAction, createNgssmExpressionTreeFromNodes, getDefaultTreeNodesSearch, getNgssmTreeNodeFullPath, getNgssmTreePath, provideNgssmExpressionTree, provideNgssmTree, selectNgssmExpressionTreeState, selectNgssmTreeNode, selectNgssmTreeNodeChildren, selectNgssmTreeState, updateNgssmExpressionTreeState, updateNgssmTreeState };
871
+ export { CollapseNodeAction, DeleteNgssmTreeAction, DisplaySearchDialogAction, ExpandNodeAction, InitNgssmTreeAction, LoadChildrenOfNodeAction, NGSSM_TREE_DATA_SERVICE, NgssmBreadcrumbComponent, NgssmTreeActionType, NgssmTreeComponent, NgssmTreeSearchDialogComponent, NgssmTreeStateSpecification, RegisterNodesAction, RegisterPartialSearchResultsAction, SearchStatus, SearchTreeNodesAction, SelectNodeAction, TreeAction, TreeNodeAction, getDefaultTreeNodesSearch, getNgssmTreeNodeFullPath, getNgssmTreePath, provideNgssmTree, selectNgssmTreeNode, selectNgssmTreeNodeChildren, selectNgssmTreeState, updateNgssmTreeState };
1628
872
  //# sourceMappingURL=ngssm-tree.mjs.map