@ngutil/layout 0.0.81 → 0.0.82
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/fesm2022/ngutil-layout.mjs +219 -104
- package/fesm2022/ngutil-layout.mjs.map +1 -1
- package/package.json +7 -8
- package/services/slots.service.d.ts +2 -2
- package/sliding/index.d.ts +4 -11
- package/sliding/infinite-slide.directive.d.ts +7 -0
- package/sliding/infinite-sliding.component.d.ts +48 -0
- package/sliding/slide.directive.d.ts +28 -0
- package/sliding/sliding.component.d.ts +6 -4
- package/esm2022/docking/docking-backdrop.component.mjs +0 -16
- package/esm2022/docking/docking-content.component.mjs +0 -11
- package/esm2022/docking/docking-layout.component.mjs +0 -40
- package/esm2022/docking/docking-panel.component.mjs +0 -70
- package/esm2022/docking/index.mjs +0 -20
- package/esm2022/index.mjs +0 -5
- package/esm2022/l9/index.mjs +0 -3
- package/esm2022/l9/range.mjs +0 -131
- package/esm2022/l9/state.mjs +0 -21
- package/esm2022/ngutil-layout.mjs +0 -5
- package/esm2022/services/slots.service.mjs +0 -240
- package/esm2022/sliding/index.mjs +0 -19
- package/esm2022/sliding/sliding-item.component.mjs +0 -11
- package/esm2022/sliding/sliding-item.directive.mjs +0 -25
- package/esm2022/sliding/sliding.component.mjs +0 -183
- package/sliding/sliding-item.component.d.ts +0 -13
- package/sliding/sliding-item.directive.d.ts +0 -13
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { BehaviorSubject, map, shareReplay, switchMap, Subject, scan, tap, distinctUntilChanged, finalize, of } from 'rxjs';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { Component, input, inject, ElementRef, model, computed, viewChild, contentChildren, NgModule, Injectable, TemplateRef, Directive, ViewContainerRef, Injector, signal, output, effect } from '@angular/core';
|
|
3
|
+
import { Component, input, inject, ElementRef, model, computed, viewChild, contentChildren, NgModule, Injectable, TemplateRef, Directive, ViewContainerRef, Injector, signal, output, effect, contentChild, linkedSignal, ChangeDetectionStrategy } from '@angular/core';
|
|
4
4
|
import { toObservable, takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
|
|
5
5
|
import { coerceBoolAttr, Destructible } from '@ngutil/common';
|
|
6
6
|
import { DimensionWatcher, Duration, Ease } from '@ngutil/style';
|
|
7
|
-
import { trigger, state, style, transition, animate } from '@angular/animations';
|
|
8
7
|
import * as i1 from '@angular/common';
|
|
9
|
-
import { CommonModule } from '@angular/common';
|
|
10
|
-
import {
|
|
8
|
+
import { CommonModule, NgTemplateOutlet } from '@angular/common';
|
|
9
|
+
import { trigger, state, transition, style, animate } from '@angular/animations';
|
|
10
|
+
import { clamp } from 'es-toolkit';
|
|
11
11
|
|
|
12
12
|
const vertical = ["top", "middle", "bottom"];
|
|
13
13
|
const horizontal = ["left", "center", "right"];
|
|
@@ -161,24 +161,24 @@ class L9State {
|
|
|
161
161
|
}
|
|
162
162
|
|
|
163
163
|
class DockingContentComponent {
|
|
164
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
165
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
164
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DockingContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
165
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.8", type: DockingContentComponent, isStandalone: true, selector: "nu-docking-content", exportAs: ["nuDockingContent"], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [":host{grid-column:2;grid-row:2;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;align-items:stretch;justify-items:stretch;overflow:hidden;position:relative;z-index:10}\n"] }); }
|
|
166
166
|
}
|
|
167
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
167
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DockingContentComponent, decorators: [{
|
|
168
168
|
type: Component,
|
|
169
|
-
args: [{ selector: "nu-docking-content", exportAs: "nuDockingContent",
|
|
169
|
+
args: [{ selector: "nu-docking-content", exportAs: "nuDockingContent", template: `<ng-content></ng-content>`, styles: [":host{grid-column:2;grid-row:2;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;align-items:stretch;justify-items:stretch;overflow:hidden;position:relative;z-index:10}\n"] }]
|
|
170
170
|
}] });
|
|
171
171
|
|
|
172
172
|
class DockingBackdropComponent {
|
|
173
173
|
constructor() {
|
|
174
174
|
this.visible = input.required();
|
|
175
175
|
}
|
|
176
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
177
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
176
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DockingBackdropComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
177
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.8", type: DockingBackdropComponent, isStandalone: true, selector: "nu-docking-backdrop", inputs: { visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "attr.state": "visible() ? 'visible' : 'hidden'" } }, ngImport: i0, template: ``, isInline: true, styles: [":host{display:flex;flex-direction:column;align-items:stretch;position:absolute;inset:0;transition:opacity .2s cubic-bezier(0,0,.2,1);z-index:200;background-color:#000}:host[state=hidden]{animation:.2s cubic-bezier(0,0,.2,1) hide;animation-fill-mode:forwards;pointer-events:none;touch-action:none;opacity:0}:host[state=visible]{visibility:visible;opacity:.7}@keyframes hide{99%{visibility:visible}to{visibility:hidden}}\n"] }); }
|
|
178
178
|
}
|
|
179
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
179
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DockingBackdropComponent, decorators: [{
|
|
180
180
|
type: Component,
|
|
181
|
-
args: [{
|
|
181
|
+
args: [{ selector: "nu-docking-backdrop", host: {
|
|
182
182
|
"[attr.state]": "visible() ? 'visible' : 'hidden'"
|
|
183
183
|
}, template: ``, styles: [":host{display:flex;flex-direction:column;align-items:stretch;position:absolute;inset:0;transition:opacity .2s cubic-bezier(0,0,.2,1);z-index:200;background-color:#000}:host[state=hidden]{animation:.2s cubic-bezier(0,0,.2,1) hide;animation-fill-mode:forwards;pointer-events:none;touch-action:none;opacity:0}:host[state=visible]{visibility:visible;opacity:.7}@keyframes hide{99%{visibility:visible}to{visibility:hidden}}\n"] }]
|
|
184
184
|
}] });
|
|
@@ -231,12 +231,12 @@ class DockingPanelComponent {
|
|
|
231
231
|
close() {
|
|
232
232
|
this.opened.set(false);
|
|
233
233
|
}
|
|
234
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
235
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "
|
|
234
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DockingPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
235
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.8", type: DockingPanelComponent, isStandalone: true, selector: "nu-docking-panel", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, opened: { classPropertyName: "opened", publicName: "opened", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, maxSize: { classPropertyName: "maxSize", publicName: "maxSize", isSignal: true, isRequired: false, transformFunction: null }, backdrop: { classPropertyName: "backdrop", publicName: "backdrop", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { opened: "openedChange" }, host: { properties: { "style.grid-area": "gridArea()", "style.--nudp-content-size.px": "contentSize()", "attr.state": "_opened() ? 'opened' : 'closed'", "attr.orient": "orient()", "attr.side": "side()", "attr.mode": "mode()" } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, read: ElementRef, isSignal: true }], exportAs: ["nuDockingPanel"], ngImport: i0, template: `<div class="wrapper" #content><ng-content /></div>`, isInline: true, styles: [":host{--nudp-tx: 0;--nudp-ty: 0;--nudp-t: auto;--nudp-r: auto;--nudp-b: auto;--nudp-l: auto;display:block;position:relative;z-index:100}:host .wrapper{all:inherit;display:grid;grid-template-columns:auto;grid-template-rows:auto;align-items:stretch;justify-items:stretch;position:absolute;top:var(--nudp-t);right:var(--nudp-r);bottom:var(--nudp-b);left:var(--nudp-l);width:auto;height:auto;transition:transform .2s cubic-bezier(0,0,.2,1);transform:translate(var(--nudp-tx),var(--nudp-ty))}:host[mode=rigid]{overflow:clip}:host[mode=rigid][orient=horizontal]{transition:height .2s cubic-bezier(0,0,.2,1);height:var(--nudp-content-size)}:host[mode=rigid][orient=horizontal][state=closed]{height:0px}:host[mode=rigid][orient=vertical]{transition:width .2s cubic-bezier(0,0,.2,1);width:var(--nudp-content-size)}:host[mode=rigid][orient=vertical][state=closed]{width:0}:host[mode=over]{z-index:300}:host[orient=horizontal]{--nudp-l: 0px;--nudp-r: 0px}:host[orient=horizontal][side=top]{--nudp-t: 0px}:host[orient=horizontal][side=top][state=closed]{--nudp-ty: -100%}:host[orient=horizontal][side=bottom]{--nudp-b: 0px}:host[orient=horizontal][side=bottom][state=closed]{--nudp-ty: 100%}:host[orient=horizontal]:not([mode=rigid]){height:0px}:host[orient=vertical]{--nudp-t: 0px;--nudp-b: 0px}:host[orient=vertical][side=left]{--nudp-l: 0px}:host[orient=vertical][side=left][state=closed]{--nudp-tx: -100%}:host[orient=vertical][side=right]{--nudp-r: 0px}:host[orient=vertical][side=right][state=closed]{--nudp-tx: 100%}:host[orient=vertical]:not([mode=rigid]){width:0px}\n"] }); }
|
|
236
236
|
}
|
|
237
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
237
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DockingPanelComponent, decorators: [{
|
|
238
238
|
type: Component,
|
|
239
|
-
args: [{ selector: "nu-docking-panel", exportAs: "nuDockingPanel",
|
|
239
|
+
args: [{ selector: "nu-docking-panel", exportAs: "nuDockingPanel", host: {
|
|
240
240
|
"[style.grid-area]": "gridArea()",
|
|
241
241
|
"[style.--nudp-content-size.px]": "contentSize()",
|
|
242
242
|
"[attr.state]": "_opened() ? 'opened' : 'closed'",
|
|
@@ -268,31 +268,31 @@ class DockingLayoutComponent {
|
|
|
268
268
|
activePanel.close();
|
|
269
269
|
}
|
|
270
270
|
}
|
|
271
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
272
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "
|
|
271
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DockingLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
272
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.8", type: DockingLayoutComponent, isStandalone: true, selector: "nu-docking", queries: [{ propertyName: "panels", predicate: DockingPanelComponent, isSignal: true }], exportAs: ["nuDocking"], ngImport: i0, template: `
|
|
273
273
|
<ng-content />
|
|
274
274
|
<nu-docking-backdrop [visible]="backdropVisible()" (click)="doCloseActiveOverPanel()"></nu-docking-backdrop>
|
|
275
275
|
`, isInline: true, styles: [":host{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto 1fr auto;position:relative;align-items:stretch;justify-items:stretch;overflow:clip}\n"], dependencies: [{ kind: "component", type: DockingBackdropComponent, selector: "nu-docking-backdrop", inputs: ["visible"] }] }); }
|
|
276
276
|
}
|
|
277
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
277
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DockingLayoutComponent, decorators: [{
|
|
278
278
|
type: Component,
|
|
279
|
-
args: [{ selector: "nu-docking", exportAs: "nuDocking",
|
|
279
|
+
args: [{ selector: "nu-docking", exportAs: "nuDocking", imports: [DockingBackdropComponent], template: `
|
|
280
280
|
<ng-content />
|
|
281
281
|
<nu-docking-backdrop [visible]="backdropVisible()" (click)="doCloseActiveOverPanel()"></nu-docking-backdrop>
|
|
282
282
|
`, styles: [":host{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto 1fr auto;position:relative;align-items:stretch;justify-items:stretch;overflow:clip}\n"] }]
|
|
283
283
|
}] });
|
|
284
284
|
|
|
285
|
-
const members
|
|
285
|
+
const members = [DockingLayoutComponent, DockingPanelComponent, DockingContentComponent];
|
|
286
286
|
class NuDockingLayout {
|
|
287
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
288
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
289
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
287
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: NuDockingLayout, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
288
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.8", ngImport: i0, type: NuDockingLayout, imports: [DockingLayoutComponent, DockingPanelComponent, DockingContentComponent], exports: [DockingLayoutComponent, DockingPanelComponent, DockingContentComponent] }); }
|
|
289
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: NuDockingLayout }); }
|
|
290
290
|
}
|
|
291
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
291
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: NuDockingLayout, decorators: [{
|
|
292
292
|
type: NgModule,
|
|
293
293
|
args: [{
|
|
294
|
-
imports: members
|
|
295
|
-
exports: members
|
|
294
|
+
imports: members,
|
|
295
|
+
exports: members
|
|
296
296
|
}]
|
|
297
297
|
}] });
|
|
298
298
|
|
|
@@ -397,10 +397,10 @@ class SlotsService extends Destructible {
|
|
|
397
397
|
delete this.#watchers[slot];
|
|
398
398
|
}), shareReplay(1));
|
|
399
399
|
}
|
|
400
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
401
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
400
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SlotsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
401
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SlotsService }); }
|
|
402
402
|
}
|
|
403
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
403
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SlotsService, decorators: [{
|
|
404
404
|
type: Injectable
|
|
405
405
|
}], ctorParameters: () => [] });
|
|
406
406
|
class SlotDirective {
|
|
@@ -427,10 +427,10 @@ class SlotDirective {
|
|
|
427
427
|
this.slotSvc.delTpl(this.#slotDef);
|
|
428
428
|
}
|
|
429
429
|
}
|
|
430
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
431
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
430
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
431
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.8", type: SlotDirective, isStandalone: true, ngImport: i0 }); }
|
|
432
432
|
}
|
|
433
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
433
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SlotDirective, decorators: [{
|
|
434
434
|
type: Directive
|
|
435
435
|
}] });
|
|
436
436
|
class SlotOutletDirective extends Destructible {
|
|
@@ -525,45 +525,52 @@ class SlotOutletDirective extends Destructible {
|
|
|
525
525
|
this.vcr.clear();
|
|
526
526
|
this.#views = [];
|
|
527
527
|
}
|
|
528
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
529
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
528
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SlotOutletDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
529
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.8", type: SlotOutletDirective, isStandalone: true, usesInheritance: true, ngImport: i0 }); }
|
|
530
530
|
}
|
|
531
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
531
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SlotOutletDirective, decorators: [{
|
|
532
532
|
type: Directive
|
|
533
533
|
}], ctorParameters: () => [] });
|
|
534
534
|
|
|
535
|
-
|
|
535
|
+
// TODO: remove old variant: nuInfiniteSlidingItem
|
|
536
|
+
class InfiniteSlideDirective {
|
|
537
|
+
constructor() {
|
|
538
|
+
this.tpl = inject(TemplateRef);
|
|
539
|
+
}
|
|
540
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: InfiniteSlideDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
541
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.8", type: InfiniteSlideDirective, isStandalone: true, selector: "ng-template[nuInfiniteSlide]", exportAs: ["nuInfiniteSlide"], ngImport: i0 }); }
|
|
542
|
+
}
|
|
543
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: InfiniteSlideDirective, decorators: [{
|
|
544
|
+
type: Directive,
|
|
545
|
+
args: [{
|
|
546
|
+
selector: "ng-template[nuInfiniteSlide]",
|
|
547
|
+
exportAs: "nuInfiniteSlide"
|
|
548
|
+
}]
|
|
549
|
+
}] });
|
|
550
|
+
|
|
551
|
+
class SlideDirective {
|
|
536
552
|
constructor() {
|
|
537
553
|
this.tpl = inject(TemplateRef);
|
|
538
554
|
this.rendered = signal(false);
|
|
539
555
|
this.active = signal(false);
|
|
540
556
|
this.animation = signal(null);
|
|
541
557
|
this.activated = output();
|
|
558
|
+
this.state = output();
|
|
542
559
|
effect(() => {
|
|
543
560
|
this.activated.emit(this.active());
|
|
544
|
-
}
|
|
561
|
+
});
|
|
545
562
|
}
|
|
546
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
547
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
563
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SlideDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
564
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.8", type: SlideDirective, isStandalone: true, selector: "ng-template[nuSlide]", outputs: { activated: "activated", state: "state" }, exportAs: ["nuSlide"], ngImport: i0 }); }
|
|
548
565
|
}
|
|
549
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
566
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SlideDirective, decorators: [{
|
|
550
567
|
type: Directive,
|
|
551
568
|
args: [{
|
|
552
|
-
selector: "ng-template[
|
|
553
|
-
exportAs: "
|
|
554
|
-
standalone: true
|
|
569
|
+
selector: "ng-template[nuSlide]",
|
|
570
|
+
exportAs: "nuSlide"
|
|
555
571
|
}]
|
|
556
572
|
}], ctorParameters: () => [] });
|
|
557
573
|
|
|
558
|
-
class SlidingItemComponent {
|
|
559
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: SlidingItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
560
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.6", type: SlidingItemComponent, isStandalone: true, selector: "nu-sliding-item", ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host{grid-column:1;grid-row:1;display:flex;flex-direction:column;align-items:stretch;position:relative;overflow:hidden}\n"] }); }
|
|
561
|
-
}
|
|
562
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.6", ngImport: i0, type: SlidingItemComponent, decorators: [{
|
|
563
|
-
type: Component,
|
|
564
|
-
args: [{ selector: "nu-sliding-item", standalone: true, template: `<ng-content />`, styles: [":host{grid-column:1;grid-row:1;display:flex;flex-direction:column;align-items:stretch;position:relative;overflow:hidden}\n"] }]
|
|
565
|
-
}] });
|
|
566
|
-
|
|
567
574
|
const absolute = { position: "absolute", top: "0px", left: "0px" };
|
|
568
575
|
const anim = `${Duration.Fast} ${Ease.Acceleration}`;
|
|
569
576
|
class SlidingComponent {
|
|
@@ -571,7 +578,7 @@ class SlidingComponent {
|
|
|
571
578
|
/**
|
|
572
579
|
* List of items
|
|
573
580
|
*/
|
|
574
|
-
this.items = contentChildren(
|
|
581
|
+
this.items = contentChildren(SlideDirective);
|
|
575
582
|
/**
|
|
576
583
|
* Lazily rendering items
|
|
577
584
|
*/
|
|
@@ -579,7 +586,7 @@ class SlidingComponent {
|
|
|
579
586
|
/**
|
|
580
587
|
* Index of the preferred item
|
|
581
588
|
*/
|
|
582
|
-
this.preferred =
|
|
589
|
+
this.preferred = model(0);
|
|
583
590
|
/**
|
|
584
591
|
* Index of the active item
|
|
585
592
|
*/
|
|
@@ -623,16 +630,16 @@ class SlidingComponent {
|
|
|
623
630
|
if (item.animation() || item.rendered()) {
|
|
624
631
|
if (currentlyActive) {
|
|
625
632
|
if (activeIndex < currentActiveIndex) {
|
|
626
|
-
item.animation.set("right-out" /*
|
|
627
|
-
inAnimation = "left-in" /*
|
|
633
|
+
item.animation.set("right-out" /* SlideAnimationState.RightOut */);
|
|
634
|
+
inAnimation = "left-in" /* SlideAnimationState.LeftIn */;
|
|
628
635
|
}
|
|
629
636
|
else {
|
|
630
|
-
item.animation.set("left-out" /*
|
|
631
|
-
inAnimation = "right-in" /*
|
|
637
|
+
item.animation.set("left-out" /* SlideAnimationState.LeftOut */);
|
|
638
|
+
inAnimation = "right-in" /* SlideAnimationState.RightIn */;
|
|
632
639
|
}
|
|
633
640
|
}
|
|
634
641
|
else {
|
|
635
|
-
item.animation.set("fast-out" /*
|
|
642
|
+
item.animation.set("fast-out" /* SlideAnimationState.FastOut */);
|
|
636
643
|
}
|
|
637
644
|
}
|
|
638
645
|
}
|
|
@@ -642,13 +649,13 @@ class SlidingComponent {
|
|
|
642
649
|
activeItem.animation.set(inAnimation);
|
|
643
650
|
}
|
|
644
651
|
else if (items.length === 1) {
|
|
645
|
-
activeItem.animation.set("fast-in" /*
|
|
652
|
+
activeItem.animation.set("fast-in" /* SlideAnimationState.FastIn */);
|
|
646
653
|
}
|
|
647
654
|
else if (activeIndex < currentActiveIndex) {
|
|
648
|
-
activeItem.animation.set("left-in" /*
|
|
655
|
+
activeItem.animation.set("left-in" /* SlideAnimationState.LeftIn */);
|
|
649
656
|
}
|
|
650
657
|
else {
|
|
651
|
-
activeItem.animation.set("right-in" /*
|
|
658
|
+
activeItem.animation.set("right-in" /* SlideAnimationState.RightIn */);
|
|
652
659
|
}
|
|
653
660
|
activeItem.active.set(true);
|
|
654
661
|
activeItem.rendered.set(true);
|
|
@@ -658,69 +665,84 @@ class SlidingComponent {
|
|
|
658
665
|
this.preferred.set(preferredClamp);
|
|
659
666
|
}
|
|
660
667
|
this.changes.emit(this);
|
|
661
|
-
}
|
|
668
|
+
});
|
|
662
669
|
}
|
|
663
|
-
|
|
664
|
-
|
|
670
|
+
onAnimationEvent(event, item) {
|
|
671
|
+
const isHiding = event.toState.endsWith("-out");
|
|
672
|
+
const isBegin = event.phaseName === "start";
|
|
673
|
+
if (isBegin) {
|
|
674
|
+
item.state.emit(isHiding ? 3 /* SlideState.Hiding */ : 1 /* SlideState.Showing */);
|
|
675
|
+
}
|
|
676
|
+
else {
|
|
677
|
+
item.state.emit(isHiding ? 4 /* SlideState.Hidden */ : 2 /* SlideState.Shown */);
|
|
678
|
+
}
|
|
679
|
+
}
|
|
680
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SlidingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
681
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: SlidingComponent, isStandalone: true, selector: "nu-sliding", inputs: { lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, preferred: { classPropertyName: "preferred", publicName: "preferred", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { preferred: "preferredChange", changes: "changes" }, queries: [{ propertyName: "items", predicate: SlideDirective, isSignal: true }], ngImport: i0, template: `
|
|
665
682
|
@if (items(); as _items) {
|
|
666
683
|
@for (item of _items; track item; let index = $index) {
|
|
667
684
|
@if (item.rendered()) {
|
|
668
|
-
<
|
|
685
|
+
<div
|
|
686
|
+
class="nu-slide"
|
|
687
|
+
[@animate]="item.animation()"
|
|
688
|
+
(@animate.start)="onAnimationEvent($event, item)"
|
|
689
|
+
(@animate.done)="onAnimationEvent($event, item)"
|
|
690
|
+
>
|
|
669
691
|
<ng-template [ngTemplateOutlet]="item.tpl" />
|
|
670
|
-
</
|
|
692
|
+
</div>
|
|
671
693
|
}
|
|
672
694
|
}
|
|
673
695
|
}
|
|
674
|
-
`, isInline: true, styles: [":host{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;overflow:hidden;position:relative}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }
|
|
696
|
+
`, isInline: true, styles: [":host{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;overflow:hidden;position:relative}:host .nu-slide{grid-column:1;grid-row:1;display:flex;flex-direction:column;align-items:stretch;position:relative;overflow:hidden}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [
|
|
675
697
|
trigger("animate", [
|
|
676
|
-
state("fast-out" /*
|
|
677
|
-
state("left-out" /*
|
|
678
|
-
state("right-out" /*
|
|
679
|
-
state("fast-in" /*
|
|
680
|
-
state("left-in" /*
|
|
681
|
-
state("right-in" /*
|
|
682
|
-
transition(`* => ${"left-out" /*
|
|
698
|
+
state("fast-out" /* SlideAnimationState.FastOut */, style({ display: "none", ...absolute, transform: "translateX(-100%)" })),
|
|
699
|
+
state("left-out" /* SlideAnimationState.LeftOut */, style({ display: "none", ...absolute, transform: "translateX(-100%)" })),
|
|
700
|
+
state("right-out" /* SlideAnimationState.RightOut */, style({ display: "none", ...absolute, transform: "translateX(100%)" })),
|
|
701
|
+
state("fast-in" /* SlideAnimationState.FastIn */, style({ display: "", position: "relative", transform: "translateX(0)" })),
|
|
702
|
+
state("left-in" /* SlideAnimationState.LeftIn */, style({ display: "", position: "relative", transform: "translateX(0)" })),
|
|
703
|
+
state("right-in" /* SlideAnimationState.RightIn */, style({ display: "", position: "relative", transform: "translateX(0)" })),
|
|
704
|
+
transition(`* => ${"left-out" /* SlideAnimationState.LeftOut */}`, [
|
|
683
705
|
style({ width: "*", ...absolute, transform: "translateX(0)" }),
|
|
684
706
|
animate(anim, style({ transform: "translateX(-100%)" }))
|
|
685
707
|
]),
|
|
686
|
-
transition(`* => ${"right-out" /*
|
|
708
|
+
transition(`* => ${"right-out" /* SlideAnimationState.RightOut */}`, [
|
|
687
709
|
style({ width: "*", ...absolute, transform: "translateX(0)" }),
|
|
688
710
|
animate(anim, style({ transform: "translateX(100%)" }))
|
|
689
711
|
]),
|
|
690
|
-
transition(`* => ${"left-in" /*
|
|
712
|
+
transition(`* => ${"left-in" /* SlideAnimationState.LeftIn */}`, [
|
|
691
713
|
style({ display: "", position: "relative", transform: "translateX(-100%)" }),
|
|
692
714
|
animate(anim, style({ transform: "translateX(0)" }))
|
|
693
715
|
]),
|
|
694
|
-
transition(`* => ${"right-in" /*
|
|
716
|
+
transition(`* => ${"right-in" /* SlideAnimationState.RightIn */}`, [
|
|
695
717
|
style({ display: "", position: "relative", transform: "translateX(100%)" }),
|
|
696
718
|
animate(anim, style({ transform: "translateX(0%)" }))
|
|
697
719
|
])
|
|
698
720
|
])
|
|
699
721
|
] }); }
|
|
700
722
|
}
|
|
701
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
723
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SlidingComponent, decorators: [{
|
|
702
724
|
type: Component,
|
|
703
|
-
args: [{ selector: "nu-sliding",
|
|
725
|
+
args: [{ selector: "nu-sliding", imports: [CommonModule], animations: [
|
|
704
726
|
trigger("animate", [
|
|
705
|
-
state("fast-out" /*
|
|
706
|
-
state("left-out" /*
|
|
707
|
-
state("right-out" /*
|
|
708
|
-
state("fast-in" /*
|
|
709
|
-
state("left-in" /*
|
|
710
|
-
state("right-in" /*
|
|
711
|
-
transition(`* => ${"left-out" /*
|
|
727
|
+
state("fast-out" /* SlideAnimationState.FastOut */, style({ display: "none", ...absolute, transform: "translateX(-100%)" })),
|
|
728
|
+
state("left-out" /* SlideAnimationState.LeftOut */, style({ display: "none", ...absolute, transform: "translateX(-100%)" })),
|
|
729
|
+
state("right-out" /* SlideAnimationState.RightOut */, style({ display: "none", ...absolute, transform: "translateX(100%)" })),
|
|
730
|
+
state("fast-in" /* SlideAnimationState.FastIn */, style({ display: "", position: "relative", transform: "translateX(0)" })),
|
|
731
|
+
state("left-in" /* SlideAnimationState.LeftIn */, style({ display: "", position: "relative", transform: "translateX(0)" })),
|
|
732
|
+
state("right-in" /* SlideAnimationState.RightIn */, style({ display: "", position: "relative", transform: "translateX(0)" })),
|
|
733
|
+
transition(`* => ${"left-out" /* SlideAnimationState.LeftOut */}`, [
|
|
712
734
|
style({ width: "*", ...absolute, transform: "translateX(0)" }),
|
|
713
735
|
animate(anim, style({ transform: "translateX(-100%)" }))
|
|
714
736
|
]),
|
|
715
|
-
transition(`* => ${"right-out" /*
|
|
737
|
+
transition(`* => ${"right-out" /* SlideAnimationState.RightOut */}`, [
|
|
716
738
|
style({ width: "*", ...absolute, transform: "translateX(0)" }),
|
|
717
739
|
animate(anim, style({ transform: "translateX(100%)" }))
|
|
718
740
|
]),
|
|
719
|
-
transition(`* => ${"left-in" /*
|
|
741
|
+
transition(`* => ${"left-in" /* SlideAnimationState.LeftIn */}`, [
|
|
720
742
|
style({ display: "", position: "relative", transform: "translateX(-100%)" }),
|
|
721
743
|
animate(anim, style({ transform: "translateX(0)" }))
|
|
722
744
|
]),
|
|
723
|
-
transition(`* => ${"right-in" /*
|
|
745
|
+
transition(`* => ${"right-in" /* SlideAnimationState.RightIn */}`, [
|
|
724
746
|
style({ display: "", position: "relative", transform: "translateX(100%)" }),
|
|
725
747
|
animate(anim, style({ transform: "translateX(0%)" }))
|
|
726
748
|
])
|
|
@@ -729,32 +751,125 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.6", ngImpor
|
|
|
729
751
|
@if (items(); as _items) {
|
|
730
752
|
@for (item of _items; track item; let index = $index) {
|
|
731
753
|
@if (item.rendered()) {
|
|
732
|
-
<
|
|
754
|
+
<div
|
|
755
|
+
class="nu-slide"
|
|
756
|
+
[@animate]="item.animation()"
|
|
757
|
+
(@animate.start)="onAnimationEvent($event, item)"
|
|
758
|
+
(@animate.done)="onAnimationEvent($event, item)"
|
|
759
|
+
>
|
|
733
760
|
<ng-template [ngTemplateOutlet]="item.tpl" />
|
|
734
|
-
</
|
|
761
|
+
</div>
|
|
735
762
|
}
|
|
736
763
|
}
|
|
737
764
|
}
|
|
738
|
-
`, styles: [":host{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;overflow:hidden;position:relative}\n"] }]
|
|
765
|
+
`, styles: [":host{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;overflow:hidden;position:relative}:host .nu-slide{grid-column:1;grid-row:1;display:flex;flex-direction:column;align-items:stretch;position:relative;overflow:hidden}\n"] }]
|
|
739
766
|
}], ctorParameters: () => [] });
|
|
740
767
|
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
768
|
+
class Item {
|
|
769
|
+
constructor(data) {
|
|
770
|
+
this.data = data;
|
|
771
|
+
this.state = signal(0 /* SlideState.Pending */);
|
|
772
|
+
this.currentState = 0 /* SlideState.Pending */;
|
|
773
|
+
this.id = `${++uid}`;
|
|
774
|
+
}
|
|
775
|
+
setState(state) {
|
|
776
|
+
if (this.currentState !== state) {
|
|
777
|
+
this.currentState = state;
|
|
778
|
+
this.state.set(state);
|
|
779
|
+
}
|
|
780
|
+
}
|
|
746
781
|
}
|
|
747
|
-
|
|
748
|
-
|
|
782
|
+
let uid = 0;
|
|
783
|
+
/**
|
|
784
|
+
* @example
|
|
785
|
+
* ```html
|
|
786
|
+
* <nu-infinite-sliding [data]="newSlide">
|
|
787
|
+
* <ng-template nuInfiniteSlide let-data>{{ data }}</ng-template>
|
|
788
|
+
* </nu-infinite-sliding>
|
|
789
|
+
* ```
|
|
790
|
+
*
|
|
791
|
+
* ```typescript
|
|
792
|
+
* export class MyComponent {
|
|
793
|
+
* readonly newSlide = signal<SlideData<string>>({ position: 1, data: "Hello" })
|
|
794
|
+
*
|
|
795
|
+
* addNewSlide() {
|
|
796
|
+
* this.newSlide.set({ position: 1, data: "World" })
|
|
797
|
+
* }
|
|
798
|
+
* }
|
|
799
|
+
* ```
|
|
800
|
+
*/
|
|
801
|
+
class InfiniteSlidingComponent {
|
|
802
|
+
constructor() {
|
|
803
|
+
this.slide = contentChild.required(InfiniteSlideDirective);
|
|
804
|
+
this.data = model();
|
|
805
|
+
this.#items = linkedSignal({
|
|
806
|
+
source: this.data,
|
|
807
|
+
computation: (data, prev) => insertData(prev?.value ?? [], data)
|
|
808
|
+
});
|
|
809
|
+
this.items = computed(() => this.#items().filter(item => item.state() !== 4 /* SlideState.Hidden */));
|
|
810
|
+
this.preferredIndex = linkedSignal({
|
|
811
|
+
source: computed(() => this.items().findIndex(item => item.state() === 0 /* SlideState.Pending */)),
|
|
812
|
+
computation: (index, prev) => (index > -1 ? index : prev?.value ?? 0)
|
|
813
|
+
});
|
|
814
|
+
}
|
|
815
|
+
#items;
|
|
816
|
+
push(data) {
|
|
817
|
+
this.data.set({ position: 1, data });
|
|
818
|
+
}
|
|
819
|
+
unshift(data) {
|
|
820
|
+
this.data.set({ position: -1, data });
|
|
821
|
+
}
|
|
822
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: InfiniteSlidingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
823
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: InfiniteSlidingComponent, isStandalone: true, selector: "nu-infinite-sliding", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { data: "dataChange" }, queries: [{ propertyName: "slide", first: true, predicate: InfiniteSlideDirective, descendants: true, isSignal: true }], exportAs: ["nuInfiniteSliding"], ngImport: i0, template: `
|
|
824
|
+
<nu-sliding [lazy]="true" [preferred]="preferredIndex()">
|
|
825
|
+
@for (item of items(); track item.id) {
|
|
826
|
+
<ng-template nuSlide (state)="item.setState($event)">
|
|
827
|
+
<ng-template
|
|
828
|
+
[ngTemplateOutlet]="slide().tpl"
|
|
829
|
+
[ngTemplateOutletContext]="{ $implicit: item.data }"
|
|
830
|
+
/>
|
|
831
|
+
</ng-template>
|
|
832
|
+
}
|
|
833
|
+
</nu-sliding>
|
|
834
|
+
`, isInline: true, dependencies: [{ kind: "component", type: SlidingComponent, selector: "nu-sliding", inputs: ["lazy", "preferred"], outputs: ["preferredChange", "changes"] }, { kind: "directive", type: SlideDirective, selector: "ng-template[nuSlide]", outputs: ["activated", "state"], exportAs: ["nuSlide"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
835
|
+
}
|
|
836
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: InfiniteSlidingComponent, decorators: [{
|
|
837
|
+
type: Component,
|
|
749
838
|
args: [{
|
|
750
|
-
|
|
751
|
-
|
|
839
|
+
selector: "nu-infinite-sliding",
|
|
840
|
+
exportAs: "nuInfiniteSliding",
|
|
841
|
+
imports: [SlidingComponent, SlideDirective, NgTemplateOutlet],
|
|
842
|
+
template: `
|
|
843
|
+
<nu-sliding [lazy]="true" [preferred]="preferredIndex()">
|
|
844
|
+
@for (item of items(); track item.id) {
|
|
845
|
+
<ng-template nuSlide (state)="item.setState($event)">
|
|
846
|
+
<ng-template
|
|
847
|
+
[ngTemplateOutlet]="slide().tpl"
|
|
848
|
+
[ngTemplateOutletContext]="{ $implicit: item.data }"
|
|
849
|
+
/>
|
|
850
|
+
</ng-template>
|
|
851
|
+
}
|
|
852
|
+
</nu-sliding>
|
|
853
|
+
`,
|
|
854
|
+
changeDetection: ChangeDetectionStrategy.OnPush
|
|
752
855
|
}]
|
|
753
856
|
}] });
|
|
857
|
+
function insertData(list, slideData) {
|
|
858
|
+
if (slideData == null) {
|
|
859
|
+
return list;
|
|
860
|
+
}
|
|
861
|
+
const { position, data } = slideData;
|
|
862
|
+
if (position === -1) {
|
|
863
|
+
return [new Item(data), ...list];
|
|
864
|
+
}
|
|
865
|
+
else {
|
|
866
|
+
return [...list, new Item(data)];
|
|
867
|
+
}
|
|
868
|
+
}
|
|
754
869
|
|
|
755
870
|
/**
|
|
756
871
|
* Generated bundle index. Do not edit.
|
|
757
872
|
*/
|
|
758
873
|
|
|
759
|
-
export { DockingContentComponent, DockingLayoutComponent, DockingPanelComponent, L9Cell, L9GridTopLeft, L9Range, L9State, NuDockingLayout,
|
|
874
|
+
export { DockingContentComponent, DockingLayoutComponent, DockingPanelComponent, InfiniteSlideDirective, InfiniteSlidingComponent, L9Cell, L9GridTopLeft, L9Range, L9State, NuDockingLayout, SlideDirective, SlidingComponent, SlotDef, SlotDirective, SlotOutletDirective, SlotsService };
|
|
760
875
|
//# sourceMappingURL=ngutil-layout.mjs.map
|