@angflow/angular 0.3.7 → 0.3.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/base.css +23 -0
- package/dist/esm/lib/agent/agent-bridge.service.js +58 -3
- package/dist/esm/lib/agent/agent-bridge.service.js.map +1 -1
- package/dist/esm/lib/components/a11y-descriptions/a11y-descriptions.component.js +2 -2
- package/dist/esm/lib/components/controls/control-button.component.d.ts +20 -0
- package/dist/esm/lib/components/controls/control-button.component.js +35 -0
- package/dist/esm/lib/components/controls/control-button.component.js.map +1 -0
- package/dist/esm/lib/components/controls/controls.component.d.ts +6 -0
- package/dist/esm/lib/components/controls/controls.component.js +22 -16
- package/dist/esm/lib/components/controls/controls.component.js.map +1 -1
- package/dist/esm/lib/components/edge-toolbar/edge-toolbar.component.js +5 -1
- package/dist/esm/lib/components/edge-toolbar/edge-toolbar.component.js.map +1 -1
- package/dist/esm/lib/components/edges/simple-bezier-edge.component.js +2 -2
- package/dist/esm/lib/components/edges/simple-bezier-edge.component.js.map +1 -1
- package/dist/esm/lib/components/handle/handle.component.d.ts +24 -3
- package/dist/esm/lib/components/handle/handle.component.js +64 -9
- package/dist/esm/lib/components/handle/handle.component.js.map +1 -1
- package/dist/esm/lib/components/minimap/minimap.component.d.ts +6 -0
- package/dist/esm/lib/components/minimap/minimap.component.js +32 -6
- package/dist/esm/lib/components/minimap/minimap.component.js.map +1 -1
- package/dist/esm/lib/components/node-resizer/node-resizer.component.d.ts +10 -0
- package/dist/esm/lib/components/node-resizer/node-resizer.component.js +70 -25
- package/dist/esm/lib/components/node-resizer/node-resizer.component.js.map +1 -1
- package/dist/esm/lib/components/node-toolbar/node-toolbar.component.js +50 -14
- package/dist/esm/lib/components/node-toolbar/node-toolbar.component.js.map +1 -1
- package/dist/esm/lib/components/selection-box/selection-box.component.js +62 -50
- package/dist/esm/lib/components/selection-box/selection-box.component.js.map +1 -1
- package/dist/esm/lib/container/edge-renderer/edge-renderer.component.d.ts +13 -2
- package/dist/esm/lib/container/edge-renderer/edge-renderer.component.js +61 -16
- package/dist/esm/lib/container/edge-renderer/edge-renderer.component.js.map +1 -1
- package/dist/esm/lib/container/ng-flow/ng-flow.component.d.ts +11 -3
- package/dist/esm/lib/container/ng-flow/ng-flow.component.js +77 -9
- package/dist/esm/lib/container/ng-flow/ng-flow.component.js.map +1 -1
- package/dist/esm/lib/container/node-renderer/node-renderer.component.js +14 -0
- package/dist/esm/lib/container/node-renderer/node-renderer.component.js.map +1 -1
- package/dist/esm/lib/container/pane/pane.component.d.ts +24 -9
- package/dist/esm/lib/container/pane/pane.component.js +128 -54
- package/dist/esm/lib/container/pane/pane.component.js.map +1 -1
- package/dist/esm/lib/directives/key-handler.directive.d.ts +7 -0
- package/dist/esm/lib/directives/key-handler.directive.js +18 -1
- package/dist/esm/lib/directives/key-handler.directive.js.map +1 -1
- package/dist/esm/lib/public-api.d.ts +4 -2
- package/dist/esm/lib/public-api.js +3 -1
- package/dist/esm/lib/public-api.js.map +1 -1
- package/dist/esm/lib/services/flow-history.service.d.ts +56 -0
- package/dist/esm/lib/services/flow-history.service.js +105 -0
- package/dist/esm/lib/services/flow-history.service.js.map +1 -0
- package/dist/esm/lib/services/flow-store.service.d.ts +30 -16
- package/dist/esm/lib/services/flow-store.service.js +65 -18
- package/dist/esm/lib/services/flow-store.service.js.map +1 -1
- package/dist/esm/lib/services/ng-flow.service.d.ts +18 -21
- package/dist/esm/lib/services/ng-flow.service.js +56 -12
- package/dist/esm/lib/services/ng-flow.service.js.map +1 -1
- package/dist/style.css +23 -0
- package/package.json +1 -1
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Component, ChangeDetectionStrategy, input, output, inject, computed, effect, Injector, ElementRef, Optional, Inject, } from '@angular/core';
|
|
2
|
+
import { NgStyle } from '@angular/common';
|
|
2
3
|
import { XYResizer, } from '@angflow/system';
|
|
3
4
|
import { FlowStore } from '../../services/flow-store.service';
|
|
4
5
|
import { NODE_ID } from '../../services/tokens';
|
|
@@ -70,6 +71,13 @@ export class NodeResizerComponent {
|
|
|
70
71
|
this.resizeEnd = output();
|
|
71
72
|
this.nodeId = '';
|
|
72
73
|
this.resizerInstances = [];
|
|
74
|
+
/**
|
|
75
|
+
* Control size in flow-space px. With `autoScale` (default) the size is
|
|
76
|
+
* divided by the current zoom so handles/lines stay a constant *screen* size
|
|
77
|
+
* — otherwise they'd shrink to a few px when zoomed out and become ungrabbable.
|
|
78
|
+
*/
|
|
79
|
+
this.handlePx = computed(() => (this.autoScale() ? 10 / this.store.transform()[2] : 10), ...(ngDevMode ? [{ debugName: "handlePx" }] : /* istanbul ignore next */ []));
|
|
80
|
+
this.linePx = computed(() => (this.autoScale() ? 2 / this.store.transform()[2] : 2), ...(ngDevMode ? [{ debugName: "linePx" }] : /* istanbul ignore next */ []));
|
|
73
81
|
/**
|
|
74
82
|
* Host-level visibility: explicit `isVisible` wins; otherwise follow the
|
|
75
83
|
* owning node's `selected` state so handles only show on selection.
|
|
@@ -89,7 +97,26 @@ export class NodeResizerComponent {
|
|
|
89
97
|
this.nodeId = nodeId ?? '';
|
|
90
98
|
}
|
|
91
99
|
ngAfterViewInit() {
|
|
100
|
+
this.buildResizers();
|
|
101
|
+
// Apply config now, then re-apply reactively whenever any config input
|
|
102
|
+
// changes. XYResizer.update() is idempotent, so the effect's first run
|
|
103
|
+
// re-applying the same config is harmless.
|
|
104
|
+
this.applyResizerConfig();
|
|
105
|
+
effect(() => this.applyResizerConfig(), { injector: this.injector });
|
|
106
|
+
// Rebuild the resizer instances if [nodeId] changes at runtime so they
|
|
107
|
+
// target the new node instead of staying bound to the original.
|
|
108
|
+
effect(() => {
|
|
109
|
+
const resolved = this.nodeIdInput() ?? this.nodeId;
|
|
110
|
+
if (this.resizerInstances.length > 0 && resolved !== this.currentResolvedNodeId) {
|
|
111
|
+
this.destroyResizers();
|
|
112
|
+
this.buildResizers();
|
|
113
|
+
this.applyResizerConfig();
|
|
114
|
+
}
|
|
115
|
+
}, { injector: this.injector });
|
|
116
|
+
}
|
|
117
|
+
buildResizers() {
|
|
92
118
|
const resolvedNodeId = this.nodeIdInput() ?? this.nodeId;
|
|
119
|
+
this.currentResolvedNodeId = resolvedNodeId;
|
|
93
120
|
// Template order: 4 corners, then 4 lines. Must match CONTROL_POSITIONS.
|
|
94
121
|
const handles = Array.from(this.el.nativeElement.querySelectorAll(':scope > .xy-flow__resize-control'));
|
|
95
122
|
handles.forEach((handle) => {
|
|
@@ -133,7 +160,9 @@ export class NodeResizerComponent {
|
|
|
133
160
|
if (nodeChanges.length > 0) {
|
|
134
161
|
this.store.triggerNodeChanges(nodeChanges);
|
|
135
162
|
}
|
|
136
|
-
|
|
163
|
+
// NB: do NOT emit (resize) here. XYResizer also invokes onResize every
|
|
164
|
+
// frame, which is where the output is emitted (or the onResize cb runs).
|
|
165
|
+
// Emitting here too double-fired the output with a second payload shape.
|
|
137
166
|
},
|
|
138
167
|
onEnd: (change) => {
|
|
139
168
|
this.store.triggerNodeChanges([
|
|
@@ -144,16 +173,15 @@ export class NodeResizerComponent {
|
|
|
144
173
|
dimensions: { width: change.width, height: change.height },
|
|
145
174
|
},
|
|
146
175
|
]);
|
|
147
|
-
|
|
176
|
+
// (resizeEnd) is emitted from onResizeEnd (see applyResizerConfig).
|
|
148
177
|
},
|
|
149
178
|
});
|
|
150
179
|
this.resizerInstances.push(resizer);
|
|
151
180
|
});
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
this.
|
|
156
|
-
effect(() => this.applyResizerConfig(), { injector: this.injector });
|
|
181
|
+
}
|
|
182
|
+
destroyResizers() {
|
|
183
|
+
this.resizerInstances.forEach((r) => r.destroy());
|
|
184
|
+
this.resizerInstances = [];
|
|
157
185
|
}
|
|
158
186
|
applyResizerConfig() {
|
|
159
187
|
const boundaries = {
|
|
@@ -186,78 +214,87 @@ export class NodeResizerComponent {
|
|
|
186
214
|
});
|
|
187
215
|
}
|
|
188
216
|
ngOnDestroy() {
|
|
189
|
-
this.
|
|
217
|
+
this.destroyResizers();
|
|
190
218
|
}
|
|
191
219
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: NodeResizerComponent, deps: [{ token: NODE_ID, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
192
220
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.15", type: NodeResizerComponent, isStandalone: true, selector: "ng-flow-node-resizer", inputs: { nodeIdInput: { classPropertyName: "nodeIdInput", publicName: "nodeId", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, keepAspectRatio: { classPropertyName: "keepAspectRatio", publicName: "keepAspectRatio", isSignal: true, isRequired: false, transformFunction: null }, isVisible: { classPropertyName: "isVisible", publicName: "isVisible", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, handleClassName: { classPropertyName: "handleClassName", publicName: "handleClassName", isSignal: true, isRequired: false, transformFunction: null }, handleStyle: { classPropertyName: "handleStyle", publicName: "handleStyle", isSignal: true, isRequired: false, transformFunction: null }, lineClassName: { classPropertyName: "lineClassName", publicName: "lineClassName", isSignal: true, isRequired: false, transformFunction: null }, lineStyle: { classPropertyName: "lineStyle", publicName: "lineStyle", isSignal: true, isRequired: false, transformFunction: null }, autoScale: { classPropertyName: "autoScale", publicName: "autoScale", isSignal: true, isRequired: false, transformFunction: null }, shouldResize: { classPropertyName: "shouldResize", publicName: "shouldResize", isSignal: true, isRequired: false, transformFunction: null }, onResizeStartCb: { classPropertyName: "onResizeStartCb", publicName: "onResizeStart", isSignal: true, isRequired: false, transformFunction: null }, onResizeCb: { classPropertyName: "onResizeCb", publicName: "onResize", isSignal: true, isRequired: false, transformFunction: null }, onResizeEndCb: { classPropertyName: "onResizeEndCb", publicName: "onResizeEnd", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { resizeStart: "resizeStart", resize: "resize", resizeEnd: "resizeEnd" }, host: { properties: { "style.display": "effectivelyVisible() ? null : \"none\"" }, styleAttribute: "position: absolute; inset: 0; pointer-events: none;", classAttribute: "ng-flow__node-resizer xy-flow__resize-control" }, ngImport: i0, template: `
|
|
193
221
|
<div
|
|
194
222
|
class="xy-flow__resize-control nodrag handle handle-top-left top left"
|
|
195
223
|
[class]="handleClassName()"
|
|
224
|
+
[ngStyle]="handleStyle()"
|
|
196
225
|
[style.position]="'absolute'" [style.top]="'0'" [style.left]="'0'"
|
|
197
226
|
[style.cursor]="'nw-resize'" [style.pointer-events]="'all'"
|
|
198
|
-
[style.width.px]="
|
|
227
|
+
[style.width.px]="handlePx()" [style.height.px]="handlePx()"
|
|
199
228
|
[style.background-color]="color() ?? null"
|
|
200
229
|
></div>
|
|
201
230
|
<div
|
|
202
231
|
class="xy-flow__resize-control nodrag handle handle-top-right top right"
|
|
203
232
|
[class]="handleClassName()"
|
|
233
|
+
[ngStyle]="handleStyle()"
|
|
204
234
|
[style.position]="'absolute'" [style.top]="'0'" [style.right]="'0'"
|
|
205
235
|
[style.cursor]="'ne-resize'" [style.pointer-events]="'all'"
|
|
206
|
-
[style.width.px]="
|
|
236
|
+
[style.width.px]="handlePx()" [style.height.px]="handlePx()"
|
|
207
237
|
[style.background-color]="color() ?? null"
|
|
208
238
|
></div>
|
|
209
239
|
<div
|
|
210
240
|
class="xy-flow__resize-control nodrag handle handle-bottom-left bottom left"
|
|
211
241
|
[class]="handleClassName()"
|
|
242
|
+
[ngStyle]="handleStyle()"
|
|
212
243
|
[style.position]="'absolute'" [style.bottom]="'0'" [style.left]="'0'"
|
|
213
244
|
[style.cursor]="'sw-resize'" [style.pointer-events]="'all'"
|
|
214
|
-
[style.width.px]="
|
|
245
|
+
[style.width.px]="handlePx()" [style.height.px]="handlePx()"
|
|
215
246
|
[style.background-color]="color() ?? null"
|
|
216
247
|
></div>
|
|
217
248
|
<div
|
|
218
249
|
class="xy-flow__resize-control nodrag handle handle-bottom-right bottom right"
|
|
219
250
|
[class]="handleClassName()"
|
|
251
|
+
[ngStyle]="handleStyle()"
|
|
220
252
|
[style.position]="'absolute'" [style.bottom]="'0'" [style.right]="'0'"
|
|
221
253
|
[style.cursor]="'se-resize'" [style.pointer-events]="'all'"
|
|
222
|
-
[style.width.px]="
|
|
254
|
+
[style.width.px]="handlePx()" [style.height.px]="handlePx()"
|
|
223
255
|
[style.background-color]="color() ?? null"
|
|
224
256
|
></div>
|
|
225
257
|
<!-- Resize lines -->
|
|
226
258
|
<div
|
|
227
259
|
class="xy-flow__resize-control nodrag line line-top top"
|
|
228
260
|
[class]="lineClassName()"
|
|
261
|
+
[ngStyle]="lineStyle()"
|
|
229
262
|
[style.position]="'absolute'" [style.top]="'0'" [style.left]="'0'" [style.right]="'0'"
|
|
230
|
-
[style.height.px]="
|
|
263
|
+
[style.height.px]="linePx()" [style.cursor]="'n-resize'" [style.pointer-events]="'all'"
|
|
231
264
|
[style.border-color]="color() ?? null"
|
|
232
265
|
></div>
|
|
233
266
|
<div
|
|
234
267
|
class="xy-flow__resize-control nodrag line line-right right"
|
|
235
268
|
[class]="lineClassName()"
|
|
269
|
+
[ngStyle]="lineStyle()"
|
|
236
270
|
[style.position]="'absolute'" [style.top]="'0'" [style.right]="'0'" [style.bottom]="'0'"
|
|
237
|
-
[style.width.px]="
|
|
271
|
+
[style.width.px]="linePx()" [style.cursor]="'e-resize'" [style.pointer-events]="'all'"
|
|
238
272
|
[style.border-color]="color() ?? null"
|
|
239
273
|
></div>
|
|
240
274
|
<div
|
|
241
275
|
class="xy-flow__resize-control nodrag line line-bottom bottom"
|
|
242
276
|
[class]="lineClassName()"
|
|
277
|
+
[ngStyle]="lineStyle()"
|
|
243
278
|
[style.position]="'absolute'" [style.bottom]="'0'" [style.left]="'0'" [style.right]="'0'"
|
|
244
|
-
[style.height.px]="
|
|
279
|
+
[style.height.px]="linePx()" [style.cursor]="'s-resize'" [style.pointer-events]="'all'"
|
|
245
280
|
[style.border-color]="color() ?? null"
|
|
246
281
|
></div>
|
|
247
282
|
<div
|
|
248
283
|
class="xy-flow__resize-control nodrag line line-left left"
|
|
249
284
|
[class]="lineClassName()"
|
|
285
|
+
[ngStyle]="lineStyle()"
|
|
250
286
|
[style.position]="'absolute'" [style.top]="'0'" [style.left]="'0'" [style.bottom]="'0'"
|
|
251
|
-
[style.width.px]="
|
|
287
|
+
[style.width.px]="linePx()" [style.cursor]="'w-resize'" [style.pointer-events]="'all'"
|
|
252
288
|
[style.border-color]="color() ?? null"
|
|
253
289
|
></div>
|
|
254
|
-
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
290
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
255
291
|
}
|
|
256
292
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: NodeResizerComponent, decorators: [{
|
|
257
293
|
type: Component,
|
|
258
294
|
args: [{
|
|
259
295
|
selector: 'ng-flow-node-resizer',
|
|
260
296
|
standalone: true,
|
|
297
|
+
imports: [NgStyle],
|
|
261
298
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
262
299
|
host: {
|
|
263
300
|
'class': 'ng-flow__node-resizer xy-flow__resize-control',
|
|
@@ -268,62 +305,70 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
|
|
|
268
305
|
<div
|
|
269
306
|
class="xy-flow__resize-control nodrag handle handle-top-left top left"
|
|
270
307
|
[class]="handleClassName()"
|
|
308
|
+
[ngStyle]="handleStyle()"
|
|
271
309
|
[style.position]="'absolute'" [style.top]="'0'" [style.left]="'0'"
|
|
272
310
|
[style.cursor]="'nw-resize'" [style.pointer-events]="'all'"
|
|
273
|
-
[style.width.px]="
|
|
311
|
+
[style.width.px]="handlePx()" [style.height.px]="handlePx()"
|
|
274
312
|
[style.background-color]="color() ?? null"
|
|
275
313
|
></div>
|
|
276
314
|
<div
|
|
277
315
|
class="xy-flow__resize-control nodrag handle handle-top-right top right"
|
|
278
316
|
[class]="handleClassName()"
|
|
317
|
+
[ngStyle]="handleStyle()"
|
|
279
318
|
[style.position]="'absolute'" [style.top]="'0'" [style.right]="'0'"
|
|
280
319
|
[style.cursor]="'ne-resize'" [style.pointer-events]="'all'"
|
|
281
|
-
[style.width.px]="
|
|
320
|
+
[style.width.px]="handlePx()" [style.height.px]="handlePx()"
|
|
282
321
|
[style.background-color]="color() ?? null"
|
|
283
322
|
></div>
|
|
284
323
|
<div
|
|
285
324
|
class="xy-flow__resize-control nodrag handle handle-bottom-left bottom left"
|
|
286
325
|
[class]="handleClassName()"
|
|
326
|
+
[ngStyle]="handleStyle()"
|
|
287
327
|
[style.position]="'absolute'" [style.bottom]="'0'" [style.left]="'0'"
|
|
288
328
|
[style.cursor]="'sw-resize'" [style.pointer-events]="'all'"
|
|
289
|
-
[style.width.px]="
|
|
329
|
+
[style.width.px]="handlePx()" [style.height.px]="handlePx()"
|
|
290
330
|
[style.background-color]="color() ?? null"
|
|
291
331
|
></div>
|
|
292
332
|
<div
|
|
293
333
|
class="xy-flow__resize-control nodrag handle handle-bottom-right bottom right"
|
|
294
334
|
[class]="handleClassName()"
|
|
335
|
+
[ngStyle]="handleStyle()"
|
|
295
336
|
[style.position]="'absolute'" [style.bottom]="'0'" [style.right]="'0'"
|
|
296
337
|
[style.cursor]="'se-resize'" [style.pointer-events]="'all'"
|
|
297
|
-
[style.width.px]="
|
|
338
|
+
[style.width.px]="handlePx()" [style.height.px]="handlePx()"
|
|
298
339
|
[style.background-color]="color() ?? null"
|
|
299
340
|
></div>
|
|
300
341
|
<!-- Resize lines -->
|
|
301
342
|
<div
|
|
302
343
|
class="xy-flow__resize-control nodrag line line-top top"
|
|
303
344
|
[class]="lineClassName()"
|
|
345
|
+
[ngStyle]="lineStyle()"
|
|
304
346
|
[style.position]="'absolute'" [style.top]="'0'" [style.left]="'0'" [style.right]="'0'"
|
|
305
|
-
[style.height.px]="
|
|
347
|
+
[style.height.px]="linePx()" [style.cursor]="'n-resize'" [style.pointer-events]="'all'"
|
|
306
348
|
[style.border-color]="color() ?? null"
|
|
307
349
|
></div>
|
|
308
350
|
<div
|
|
309
351
|
class="xy-flow__resize-control nodrag line line-right right"
|
|
310
352
|
[class]="lineClassName()"
|
|
353
|
+
[ngStyle]="lineStyle()"
|
|
311
354
|
[style.position]="'absolute'" [style.top]="'0'" [style.right]="'0'" [style.bottom]="'0'"
|
|
312
|
-
[style.width.px]="
|
|
355
|
+
[style.width.px]="linePx()" [style.cursor]="'e-resize'" [style.pointer-events]="'all'"
|
|
313
356
|
[style.border-color]="color() ?? null"
|
|
314
357
|
></div>
|
|
315
358
|
<div
|
|
316
359
|
class="xy-flow__resize-control nodrag line line-bottom bottom"
|
|
317
360
|
[class]="lineClassName()"
|
|
361
|
+
[ngStyle]="lineStyle()"
|
|
318
362
|
[style.position]="'absolute'" [style.bottom]="'0'" [style.left]="'0'" [style.right]="'0'"
|
|
319
|
-
[style.height.px]="
|
|
363
|
+
[style.height.px]="linePx()" [style.cursor]="'s-resize'" [style.pointer-events]="'all'"
|
|
320
364
|
[style.border-color]="color() ?? null"
|
|
321
365
|
></div>
|
|
322
366
|
<div
|
|
323
367
|
class="xy-flow__resize-control nodrag line line-left left"
|
|
324
368
|
[class]="lineClassName()"
|
|
369
|
+
[ngStyle]="lineStyle()"
|
|
325
370
|
[style.position]="'absolute'" [style.top]="'0'" [style.left]="'0'" [style.bottom]="'0'"
|
|
326
|
-
[style.width.px]="
|
|
371
|
+
[style.width.px]="linePx()" [style.cursor]="'w-resize'" [style.pointer-events]="'all'"
|
|
327
372
|
[style.border-color]="color() ?? null"
|
|
328
373
|
></div>
|
|
329
374
|
`,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"node-resizer.component.js","sourceRoot":"","sources":["../../../../../src/lib/components/node-resizer/node-resizer.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,uBAAuB,EACvB,KAAK,EACL,MAAM,EACN,MAAM,EACN,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,UAAU,EAGV,QAAQ,EACR,MAAM,GACP,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,SAAS,GAcV,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;AAC9D,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;;AAEhD,+FAA+F;AAC/F,MAAM,iBAAiB,GAAsB;IAC3C,UAAU,EAAE,WAAW,EAAE,aAAa,EAAE,cAAc;IACtD,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM;CACjC,CAAC;AAEF;;;;;;;;;GASG;
|
|
1
|
+
{"version":3,"file":"node-resizer.component.js","sourceRoot":"","sources":["../../../../../src/lib/components/node-resizer/node-resizer.component.ts"],"names":[],"mappings":"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"}
|
|
@@ -55,42 +55,74 @@ export class NodeToolbarComponent {
|
|
|
55
55
|
const ids = this.resolvedNodeIds();
|
|
56
56
|
if (ids.length === 0)
|
|
57
57
|
return '';
|
|
58
|
-
//
|
|
59
|
-
|
|
60
|
-
|
|
58
|
+
// Union bounding box of all target nodes (positionAbsolute space) so a
|
|
59
|
+
// multi-node toolbar anchors to the whole group, not just the first id.
|
|
60
|
+
let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
|
|
61
|
+
let found = false;
|
|
62
|
+
for (const id of ids) {
|
|
63
|
+
const node = this.store.nodeLookup.get(id);
|
|
64
|
+
if (!node)
|
|
65
|
+
continue;
|
|
66
|
+
found = true;
|
|
67
|
+
const nx = node.internals?.positionAbsolute?.x ?? node.position.x;
|
|
68
|
+
const ny = node.internals?.positionAbsolute?.y ?? node.position.y;
|
|
69
|
+
const nw = node.measured?.width ?? node.width ?? 0;
|
|
70
|
+
const nh = node.measured?.height ?? node.height ?? 0;
|
|
71
|
+
minX = Math.min(minX, nx);
|
|
72
|
+
minY = Math.min(minY, ny);
|
|
73
|
+
maxX = Math.max(maxX, nx + nw);
|
|
74
|
+
maxY = Math.max(maxY, ny + nh);
|
|
75
|
+
}
|
|
76
|
+
if (!found)
|
|
61
77
|
return '';
|
|
62
|
-
const w =
|
|
63
|
-
const h =
|
|
78
|
+
const w = maxX - minX;
|
|
79
|
+
const h = maxY - minY;
|
|
64
80
|
const pos = this.position();
|
|
65
81
|
const off = this.offset();
|
|
66
82
|
const alignVal = this.align();
|
|
83
|
+
// Placement context: inside the target node's own template the host already
|
|
84
|
+
// sits at the node's origin within the transformed viewport, so relative
|
|
85
|
+
// offsets suffice. Otherwise ([nodeId] targeting another node, or a
|
|
86
|
+
// multi-node group) the host is in the untransformed container — prefix the
|
|
87
|
+
// node's screen position + scale(zoom) so the flow-unit offsets still land
|
|
88
|
+
// on the node instead of the placement site.
|
|
89
|
+
const inNode = ids.length === 1 && this.contextNodeId === ids[0];
|
|
90
|
+
let prefix = '';
|
|
91
|
+
if (!inNode) {
|
|
92
|
+
const [tx, ty, zoom] = this.store.transform();
|
|
93
|
+
prefix = `translate(${minX * zoom + tx}px, ${minY * zoom + ty}px) scale(${zoom}) `;
|
|
94
|
+
}
|
|
95
|
+
let relative = '';
|
|
67
96
|
switch (pos) {
|
|
68
97
|
case Position.Top:
|
|
69
98
|
case Position.Bottom: {
|
|
70
99
|
const xOffset = alignVal === 'start' ? 0 : alignVal === 'end' ? w : w / 2;
|
|
71
100
|
const xTranslate = alignVal === 'start' ? '0' : alignVal === 'end' ? '-100%' : '-50%';
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
101
|
+
relative =
|
|
102
|
+
pos === Position.Top
|
|
103
|
+
? `translate(${xOffset}px, ${-off}px) translate(${xTranslate}, -100%)`
|
|
104
|
+
: `translate(${xOffset}px, ${h + off}px) translate(${xTranslate}, 0)`;
|
|
105
|
+
break;
|
|
76
106
|
}
|
|
77
107
|
case Position.Left:
|
|
78
108
|
case Position.Right: {
|
|
79
109
|
const yOffset = alignVal === 'start' ? 0 : alignVal === 'end' ? h : h / 2;
|
|
80
110
|
const yTranslate = alignVal === 'start' ? '0' : alignVal === 'end' ? '-100%' : '-50%';
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
111
|
+
relative =
|
|
112
|
+
pos === Position.Left
|
|
113
|
+
? `translate(${-off}px, ${yOffset}px) translate(-100%, ${yTranslate})`
|
|
114
|
+
: `translate(${w + off}px, ${yOffset}px) translate(0, ${yTranslate})`;
|
|
115
|
+
break;
|
|
85
116
|
}
|
|
86
117
|
default:
|
|
87
118
|
return '';
|
|
88
119
|
}
|
|
120
|
+
return prefix + relative;
|
|
89
121
|
}, ...(ngDevMode ? [{ debugName: "toolbarTransform" }] : /* istanbul ignore next */ []));
|
|
90
122
|
this.contextNodeId = nodeId ?? '';
|
|
91
123
|
}
|
|
92
124
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: NodeToolbarComponent, deps: [{ token: NODE_ID, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
93
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.15", type: NodeToolbarComponent, isStandalone: true, selector: "ng-flow-node-toolbar", inputs: { nodeIdInput: { classPropertyName: "nodeIdInput", publicName: "nodeId", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, isVisible: { classPropertyName: "isVisible", publicName: "isVisible", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "offset", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-id": "resolvedNodeIds()[0]", "class": "shouldShow() ? \"ng-flow__node-toolbar xy-flow__node-toolbar\" : \"\"", "style.position": "\"absolute\"", "style.left.px": "0", "style.top.px": "0", "style.pointer-events": "shouldShow() ? \"all\" : \"none\"", "style.z-index": "1000", "style.display": "shouldShow() ? \"block\" : \"none\"", "style.transform": "toolbarTransform()" } }, ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
125
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.15", type: NodeToolbarComponent, isStandalone: true, selector: "ng-flow-node-toolbar", inputs: { nodeIdInput: { classPropertyName: "nodeIdInput", publicName: "nodeId", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, isVisible: { classPropertyName: "isVisible", publicName: "isVisible", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "offset", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-id": "resolvedNodeIds()[0]", "class": "shouldShow() ? \"ng-flow__node-toolbar xy-flow__node-toolbar\" : \"\"", "style.position": "\"absolute\"", "style.left.px": "0", "style.top.px": "0", "style.pointer-events": "shouldShow() ? \"all\" : \"none\"", "style.z-index": "1000", "style.display": "shouldShow() ? \"block\" : \"none\"", "style.transform": "toolbarTransform()", "style.transform-origin": "\"0 0\"" } }, ngImport: i0, template: `<ng-content />`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
94
126
|
}
|
|
95
127
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: NodeToolbarComponent, decorators: [{
|
|
96
128
|
type: Component,
|
|
@@ -108,6 +140,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
|
|
|
108
140
|
'[style.z-index]': '1000',
|
|
109
141
|
'[style.display]': 'shouldShow() ? "block" : "none"',
|
|
110
142
|
'[style.transform]': 'toolbarTransform()',
|
|
143
|
+
// Anchor the transform at the top-left. The detached-mode transform applies
|
|
144
|
+
// scale(zoom); with the CSS default origin (50% 50%) that scale would pivot
|
|
145
|
+
// about the box center and offset the toolbar by (1-zoom)·halfBox at zoom≠1.
|
|
146
|
+
'[style.transform-origin]': '"0 0"',
|
|
111
147
|
},
|
|
112
148
|
template: `<ng-content />`,
|
|
113
149
|
}]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"node-toolbar.component.js","sourceRoot":"","sources":["../../../../../src/lib/components/node-toolbar/node-toolbar.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,uBAAuB,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAC9G,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;AAC9D,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;;AAEhD;;;;;;;;;;;GAWG;
|
|
1
|
+
{"version":3,"file":"node-toolbar.component.js","sourceRoot":"","sources":["../../../../../src/lib/components/node-toolbar/node-toolbar.component.ts"],"names":[],"mappings":"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"}
|
|
@@ -58,6 +58,13 @@ export class SelectionBoxComponent {
|
|
|
58
58
|
this.dragInstance = XYDrag({
|
|
59
59
|
getStoreItems: () => this.store.getStoreItems(),
|
|
60
60
|
});
|
|
61
|
+
// Focus the box when it first enters the DOM so its keyboard handlers
|
|
62
|
+
// (Escape / arrow-key movement) are reachable without a mouse click —
|
|
63
|
+
// it has tabindex=-1, so nothing else would ever focus it. React does
|
|
64
|
+
// the same on NodesSelection mount.
|
|
65
|
+
if (!this.store.disableKeyboardA11y()) {
|
|
66
|
+
box.nativeElement.focus({ preventScroll: true });
|
|
67
|
+
}
|
|
61
68
|
}
|
|
62
69
|
this.dragInstance.update({
|
|
63
70
|
domNode: box.nativeElement,
|
|
@@ -76,6 +83,8 @@ export class SelectionBoxComponent {
|
|
|
76
83
|
onKeyDown(event) {
|
|
77
84
|
if (event.key === 'Escape') {
|
|
78
85
|
event.preventDefault();
|
|
86
|
+
// Stop the document-level KeyHandlerDirective from also acting on this key.
|
|
87
|
+
event.stopPropagation();
|
|
79
88
|
this.store.nodesSelectionActive.set(false);
|
|
80
89
|
event.currentTarget?.blur();
|
|
81
90
|
return;
|
|
@@ -84,6 +93,9 @@ export class SelectionBoxComponent {
|
|
|
84
93
|
if (!direction)
|
|
85
94
|
return;
|
|
86
95
|
event.preventDefault();
|
|
96
|
+
// Without this, the event bubbles to the document KeyHandlerDirective, which
|
|
97
|
+
// moves the selected nodes a second time (6px instead of 5, or two grid cells).
|
|
98
|
+
event.stopPropagation();
|
|
87
99
|
this.moveSelectedNodes(direction, event.shiftKey ? 4 : 1);
|
|
88
100
|
}
|
|
89
101
|
/**
|
|
@@ -135,31 +147,31 @@ export class SelectionBoxComponent {
|
|
|
135
147
|
}
|
|
136
148
|
}
|
|
137
149
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: SelectionBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
138
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.15", type: SelectionBoxComponent, isStandalone: true, selector: "ng-flow-selection-box", outputs: { contextMenu: "contextMenu" }, host: { styleAttribute: "display: contents;" }, viewQueries: [{ propertyName: "nodesSelectionBox", first: true, predicate: ["nodesSelectionBox"], descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
139
|
-
@if (isVisible()) {
|
|
140
|
-
<div
|
|
141
|
-
class="ng-flow__selection xy-flow__selection"
|
|
142
|
-
style="position: absolute; pointer-events: all; z-index: 10;"
|
|
143
|
-
[style.left.px]="rect()!.x"
|
|
144
|
-
[style.top.px]="rect()!.y"
|
|
145
|
-
[style.width.px]="rect()!.width"
|
|
146
|
-
[style.height.px]="rect()!.height"
|
|
147
|
-
(contextmenu)="onContextMenu($event)"
|
|
148
|
-
></div>
|
|
149
|
-
}
|
|
150
|
-
@if (store.nodesSelectionActive()) {
|
|
151
|
-
<div
|
|
152
|
-
#nodesSelectionBox
|
|
153
|
-
class="ng-flow__selection ng-flow__nodesselection xy-flow__selection xy-flow__nodesselection"
|
|
154
|
-
style="position: absolute; pointer-events: all; z-index: 10; transform-origin: left top;"
|
|
155
|
-
[style.transform]="nodesSelectionTransform()"
|
|
156
|
-
[style.width.px]="nodesSelectionBounds().width"
|
|
157
|
-
[style.height.px]="nodesSelectionBounds().height"
|
|
158
|
-
tabindex="-1"
|
|
159
|
-
(keydown)="onKeyDown($event)"
|
|
160
|
-
(contextmenu)="onContextMenu($event)"
|
|
161
|
-
></div>
|
|
162
|
-
}
|
|
150
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.15", type: SelectionBoxComponent, isStandalone: true, selector: "ng-flow-selection-box", outputs: { contextMenu: "contextMenu" }, host: { styleAttribute: "display: contents;" }, viewQueries: [{ propertyName: "nodesSelectionBox", first: true, predicate: ["nodesSelectionBox"], descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
151
|
+
@if (isVisible()) {
|
|
152
|
+
<div
|
|
153
|
+
class="ng-flow__selection xy-flow__selection"
|
|
154
|
+
style="position: absolute; pointer-events: all; z-index: 10;"
|
|
155
|
+
[style.left.px]="rect()!.x"
|
|
156
|
+
[style.top.px]="rect()!.y"
|
|
157
|
+
[style.width.px]="rect()!.width"
|
|
158
|
+
[style.height.px]="rect()!.height"
|
|
159
|
+
(contextmenu)="onContextMenu($event)"
|
|
160
|
+
></div>
|
|
161
|
+
}
|
|
162
|
+
@if (store.nodesSelectionActive()) {
|
|
163
|
+
<div
|
|
164
|
+
#nodesSelectionBox
|
|
165
|
+
class="ng-flow__selection ng-flow__nodesselection xy-flow__selection xy-flow__nodesselection"
|
|
166
|
+
style="position: absolute; pointer-events: all; z-index: 10; transform-origin: left top;"
|
|
167
|
+
[style.transform]="nodesSelectionTransform()"
|
|
168
|
+
[style.width.px]="nodesSelectionBounds().width"
|
|
169
|
+
[style.height.px]="nodesSelectionBounds().height"
|
|
170
|
+
tabindex="-1"
|
|
171
|
+
(keydown)="onKeyDown($event)"
|
|
172
|
+
(contextmenu)="onContextMenu($event)"
|
|
173
|
+
></div>
|
|
174
|
+
}
|
|
163
175
|
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
164
176
|
}
|
|
165
177
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImport: i0, type: SelectionBoxComponent, decorators: [{
|
|
@@ -171,31 +183,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
|
|
|
171
183
|
host: {
|
|
172
184
|
'style': 'display: contents;',
|
|
173
185
|
},
|
|
174
|
-
template: `
|
|
175
|
-
@if (isVisible()) {
|
|
176
|
-
<div
|
|
177
|
-
class="ng-flow__selection xy-flow__selection"
|
|
178
|
-
style="position: absolute; pointer-events: all; z-index: 10;"
|
|
179
|
-
[style.left.px]="rect()!.x"
|
|
180
|
-
[style.top.px]="rect()!.y"
|
|
181
|
-
[style.width.px]="rect()!.width"
|
|
182
|
-
[style.height.px]="rect()!.height"
|
|
183
|
-
(contextmenu)="onContextMenu($event)"
|
|
184
|
-
></div>
|
|
185
|
-
}
|
|
186
|
-
@if (store.nodesSelectionActive()) {
|
|
187
|
-
<div
|
|
188
|
-
#nodesSelectionBox
|
|
189
|
-
class="ng-flow__selection ng-flow__nodesselection xy-flow__selection xy-flow__nodesselection"
|
|
190
|
-
style="position: absolute; pointer-events: all; z-index: 10; transform-origin: left top;"
|
|
191
|
-
[style.transform]="nodesSelectionTransform()"
|
|
192
|
-
[style.width.px]="nodesSelectionBounds().width"
|
|
193
|
-
[style.height.px]="nodesSelectionBounds().height"
|
|
194
|
-
tabindex="-1"
|
|
195
|
-
(keydown)="onKeyDown($event)"
|
|
196
|
-
(contextmenu)="onContextMenu($event)"
|
|
197
|
-
></div>
|
|
198
|
-
}
|
|
186
|
+
template: `
|
|
187
|
+
@if (isVisible()) {
|
|
188
|
+
<div
|
|
189
|
+
class="ng-flow__selection xy-flow__selection"
|
|
190
|
+
style="position: absolute; pointer-events: all; z-index: 10;"
|
|
191
|
+
[style.left.px]="rect()!.x"
|
|
192
|
+
[style.top.px]="rect()!.y"
|
|
193
|
+
[style.width.px]="rect()!.width"
|
|
194
|
+
[style.height.px]="rect()!.height"
|
|
195
|
+
(contextmenu)="onContextMenu($event)"
|
|
196
|
+
></div>
|
|
197
|
+
}
|
|
198
|
+
@if (store.nodesSelectionActive()) {
|
|
199
|
+
<div
|
|
200
|
+
#nodesSelectionBox
|
|
201
|
+
class="ng-flow__selection ng-flow__nodesselection xy-flow__selection xy-flow__nodesselection"
|
|
202
|
+
style="position: absolute; pointer-events: all; z-index: 10; transform-origin: left top;"
|
|
203
|
+
[style.transform]="nodesSelectionTransform()"
|
|
204
|
+
[style.width.px]="nodesSelectionBounds().width"
|
|
205
|
+
[style.height.px]="nodesSelectionBounds().height"
|
|
206
|
+
tabindex="-1"
|
|
207
|
+
(keydown)="onKeyDown($event)"
|
|
208
|
+
(contextmenu)="onContextMenu($event)"
|
|
209
|
+
></div>
|
|
210
|
+
}
|
|
199
211
|
`,
|
|
200
212
|
}]
|
|
201
213
|
}], ctorParameters: () => [], propDecorators: { contextMenu: [{ type: i0.Output, args: ["contextMenu"] }], nodesSelectionBox: [{ type: i0.ViewChild, args: ['nodesSelectionBox', { isSignal: true }] }] } });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"selection-box.component.js","sourceRoot":"","sources":["../../../../../src/lib/components/selection-box/selection-box.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,uBAAuB,EACvB,MAAM,EACN,QAAQ,EACR,MAAM,EACN,SAAS,EACT,MAAM,EAEN,UAAU,GACX,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,MAAM,EAGN,qBAAqB,EACrB,YAAY,GACb,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;;AAE9D,iFAAiF;AACjF,MAAM,aAAa,GAA+B;IAChD,OAAO,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE;IACxB,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;IACzB,SAAS,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;IAC1B,UAAU,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;CAC3B,CAAC;AAoCF,MAAM,OAAO,qBAAqB;IAShC;QARS,UAAK,GAAG,MAAM,CAAC,SAAS,CAAC,CAAC;QAE1B,gBAAW,GAAG,MAAM,EAAc,CAAC;QAE3B,eAAU,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC;QAChC,sBAAiB,GAAG,SAAS,CAA6B,mBAAmB,wFAAC,CAAC;QACxF,iBAAY,GAA0B,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"selection-box.component.js","sourceRoot":"","sources":["../../../../../src/lib/components/selection-box/selection-box.component.ts"],"names":[],"mappings":"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"}
|