@ng-atomic/components 2.0.1 → 3.2.0

package/fesm2015/ng-atomic-components-atoms-smart-menu-button.mjs

@@ -0,0 +1,151 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, NgModule } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i2 from '@angular/material/button';
+import { MatButtonModule } from '@angular/material/button';
+import * as i3 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i4 from '@angular/material/menu';
+import { MatMenuModule } from '@angular/material/menu';
+
+function SmartMenuButtonAtom_ng_container_1_Template(rf, ctx) {
+    if (rf & 1) {
+        i0.ɵɵelementContainer(0);
+    }
+}
+function SmartMenuButtonAtom_ng_container_2_Template(rf, ctx) {
+    if (rf & 1) {
+        const _r6 = i0.ɵɵgetCurrentView();
+        i0.ɵɵelementContainerStart(0);
+        i0.ɵɵelementStart(1, "button", 5);
+        i0.ɵɵlistener("click", function SmartMenuButtonAtom_ng_container_2_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r6); const ctx_r5 = i0.ɵɵnextContext(); return ctx_r5.actionItemClick.emit([ctx_r5.actionItems[0]]); });
+        i0.ɵɵelementStart(2, "mat-icon");
+        i0.ɵɵtext(3);
+        i0.ɵɵelementEnd()();
+        i0.ɵɵelementContainerEnd();
+    }
+    if (rf & 2) {
+        const ctx_r1 = i0.ɵɵnextContext();
+        i0.ɵɵadvance(3);
+        i0.ɵɵtextInterpolate(ctx_r1.actionItems[0] == null ? null : ctx_r1.actionItems[0].icon);
+    }
+}
+function SmartMenuButtonAtom_ng_container_3_button_1_Template(rf, ctx) {
+    if (rf & 1) {
+        i0.ɵɵelementStart(0, "button", 7)(1, "mat-icon");
+        i0.ɵɵtext(2, "menu");
+        i0.ɵɵelementEnd()();
+    }
+    if (rf & 2) {
+        i0.ɵɵnextContext(2);
+        const _r3 = i0.ɵɵreference(5);
+        i0.ɵɵproperty("matMenuTriggerFor", _r3);
+    }
+}
+function SmartMenuButtonAtom_ng_container_3_Template(rf, ctx) {
+    if (rf & 1) {
+        i0.ɵɵelementContainerStart(0);
+        i0.ɵɵtemplate(1, SmartMenuButtonAtom_ng_container_3_button_1_Template, 3, 1, "button", 6);
+        i0.ɵɵelementContainerEnd();
+    }
+    if (rf & 2) {
+        const ctx_r2 = i0.ɵɵnextContext();
+        i0.ɵɵadvance(1);
+        i0.ɵɵproperty("ngIf", ctx_r2.actionItems.length);
+    }
+}
+function SmartMenuButtonAtom_button_6_Template(rf, ctx) {
+    if (rf & 1) {
+        const _r10 = i0.ɵɵgetCurrentView();
+        i0.ɵɵelementStart(0, "button", 8);
+        i0.ɵɵlistener("click", function SmartMenuButtonAtom_button_6_Template_button_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r10); const actionItem_r8 = restoredCtx.$implicit; const ctx_r9 = i0.ɵɵnextContext(); return ctx_r9.actionItemClick.emit([actionItem_r8]); });
+        i0.ɵɵtext(1);
+        i0.ɵɵelementEnd();
+    }
+    if (rf & 2) {
+        const actionItem_r8 = ctx.$implicit;
+        i0.ɵɵadvance(1);
+        i0.ɵɵtextInterpolate(actionItem_r8.name);
+    }
+}
+class SmartMenuButtonAtom {
+    constructor() {
+        this.actionItems = [];
+        this.actionItemClick = new EventEmitter();
+    }
+}
+SmartMenuButtonAtom.ɵfac = function SmartMenuButtonAtom_Factory(t) { return new (t || SmartMenuButtonAtom)(); };
+SmartMenuButtonAtom.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SmartMenuButtonAtom, selectors: [["atoms-smart-menu-button"]], inputs: { actionItems: "actionItems" }, outputs: { actionItemClick: "actionItemClick" }, decls: 7, vars: 4, consts: [[3, "ngSwitch"], [4, "ngSwitchCase"], [4, "ngSwitchDefault"], ["menu", "matMenu"], ["mat-menu-item", "", 3, "click", 4, "ngFor", "ngForOf"], ["mat-icon-button", "", 3, "click"], ["mat-icon-button", "", 3, "matMenuTriggerFor", 4, "ngIf"], ["mat-icon-button", "", 3, "matMenuTriggerFor"], ["mat-menu-item", "", 3, "click"]], template: function SmartMenuButtonAtom_Template(rf, ctx) {
+        if (rf & 1) {
+            i0.ɵɵelementContainerStart(0, 0);
+            i0.ɵɵtemplate(1, SmartMenuButtonAtom_ng_container_1_Template, 1, 0, "ng-container", 1);
+            i0.ɵɵtemplate(2, SmartMenuButtonAtom_ng_container_2_Template, 4, 1, "ng-container", 1);
+            i0.ɵɵtemplate(3, SmartMenuButtonAtom_ng_container_3_Template, 2, 1, "ng-container", 2);
+            i0.ɵɵelementContainerEnd();
+            i0.ɵɵelementStart(4, "mat-menu", null, 3);
+            i0.ɵɵtemplate(6, SmartMenuButtonAtom_button_6_Template, 2, 1, "button", 4);
+            i0.ɵɵelementEnd();
+        }
+        if (rf & 2) {
+            i0.ɵɵproperty("ngSwitch", ctx.actionItems.length);
+            i0.ɵɵadvance(1);
+            i0.ɵɵproperty("ngSwitchCase", 0);
+            i0.ɵɵadvance(1);
+            i0.ɵɵproperty("ngSwitchCase", 1);
+            i0.ɵɵadvance(4);
+            i0.ɵɵproperty("ngForOf", ctx.actionItems);
+        }
+    }, directives: [i1.NgSwitch, i1.NgSwitchCase, i2.MatButton, i3.MatIcon, i1.NgSwitchDefault, i1.NgIf, i4.MatMenuTrigger, i4.MatMenu, i1.NgForOf, i4.MatMenuItem], styles: ["[_nghost-%COMP%]{display:block;width:100%;height:100%}"], changeDetection: 0 });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SmartMenuButtonAtom, [{
+            type: Component,
+            args: [{ selector: 'atoms-smart-menu-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngSwitch]=\"actionItems.length\">\n  <ng-container *ngSwitchCase=\"0\"></ng-container>\n  <ng-container *ngSwitchCase=\"1\">\n    <button mat-icon-button (click)=\"actionItemClick.emit([actionItems[0]])\">\n      <mat-icon>{{ actionItems[0]?.icon }}</mat-icon>\n    </button>\n  </ng-container>\n  <ng-container *ngSwitchDefault>\n    <button mat-icon-button [matMenuTriggerFor]=\"menu\" *ngIf=\"actionItems.length\">\n      <mat-icon>menu</mat-icon>\n    </button>\n  </ng-container>\n</ng-container>\n\n<mat-menu #menu=\"matMenu\">\n  <button \n    *ngFor=\"let actionItem of actionItems\"\n    mat-menu-item \n    (click)=\"actionItemClick.emit([actionItem])\"\n  >{{ actionItem.name }}</button>\n</mat-menu>\n", styles: [":host{display:block;width:100%;height:100%}\n"] }]
+        }], null, { actionItems: [{
+                type: Input
+            }], actionItemClick: [{
+                type: Output
+            }] });
+})();
+
+class SmartMenuButtonModule {
+}
+SmartMenuButtonModule.ɵfac = function SmartMenuButtonModule_Factory(t) { return new (t || SmartMenuButtonModule)(); };
+SmartMenuButtonModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: SmartMenuButtonModule });
+SmartMenuButtonModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [[
+            CommonModule,
+            // Material
+            MatButtonModule,
+            MatIconModule,
+            MatMenuModule,
+        ]] });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SmartMenuButtonModule, [{
+            type: NgModule,
+            args: [{
+                    declarations: [SmartMenuButtonAtom],
+                    imports: [
+                        CommonModule,
+                        // Material
+                        MatButtonModule,
+                        MatIconModule,
+                        MatMenuModule,
+                    ],
+                    exports: [SmartMenuButtonAtom]
+                }]
+        }], null, null);
+})();
+(function () {
+    (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(SmartMenuButtonModule, { declarations: [SmartMenuButtonAtom], imports: [CommonModule,
+            // Material
+            MatButtonModule,
+            MatIconModule,
+            MatMenuModule], exports: [SmartMenuButtonAtom] });
+})();
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SmartMenuButtonAtom, SmartMenuButtonModule };
+//# sourceMappingURL=ng-atomic-components-atoms-smart-menu-button.mjs.map

package/fesm2015/ng-atomic-components-atoms-smart-menu-button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ng-atomic-components-atoms-smart-menu-button.mjs","sources":["../../../../libs/components/src/atoms/smart-menu-button/smart-menu-button.atom.html","../../../../libs/components/src/atoms/smart-menu-button/smart-menu-button.atom.ts","../../../../libs/components/src/atoms/smart-menu-button/smart-menu-button.module.ts","../../../../libs/components/src/atoms/smart-menu-button/ng-atomic-components-atoms-smart-menu-button.ts"],"sourcesContent":["<ng-container [ngSwitch]=\"actionItems.length\">\n  <ng-container *ngSwitchCase=\"0\"></ng-container>\n  <ng-container *ngSwitchCase=\"1\">\n    <button mat-icon-button (click)=\"actionItemClick.emit([actionItems[0]])\">\n      <mat-icon>{{ actionItems[0]?.icon }}</mat-icon>\n    </button>\n  </ng-container>\n  <ng-container *ngSwitchDefault>\n    <button mat-icon-button [matMenuTriggerFor]=\"menu\" *ngIf=\"actionItems.length\">\n      <mat-icon>menu</mat-icon>\n    </button>\n  </ng-container>\n</ng-container>\n\n<mat-menu #menu=\"matMenu\">\n  <button \n    *ngFor=\"let actionItem of actionItems\"\n    mat-menu-item \n    (click)=\"actionItemClick.emit([actionItem])\"\n  >{{ actionItem.name }}</button>\n</mat-menu>\n","import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';\nimport { ActionItem } from '@ng-atomic/common/models';\n\n@Component({\n  selector: 'atoms-smart-menu-button',\n  templateUrl: './smart-menu-button.atom.html',\n  styleUrls: ['./smart-menu-button.atom.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SmartMenuButtonAtom {\n  @Input()\n  actionItems: ActionItem[] = [];\n\n  @Output()\n  actionItemClick = new EventEmitter<ActionItem>();\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatMenuModule } from '@angular/material/menu';\n\nimport { SmartMenuButtonAtom } from './smart-menu-button.atom';\n\n\n@NgModule({\n  declarations: [SmartMenuButtonAtom],\n  imports: [\n    CommonModule,\n    // Material\n    MatButtonModule,\n    MatIconModule,\n    MatMenuModule,\n  ],\n  exports: [SmartMenuButtonAtom]\n})\nexport class SmartMenuButtonModule { }","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2015/ng-atomic-components-frames-auto-layout.mjs

@@ -0,0 +1,52 @@
+import * as i0 from '@angular/core';
+import { Component, ChangeDetectionStrategy, NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+const _c0 = ["*"];
+class AutoLayoutFrame {
+}
+AutoLayoutFrame.ɵfac = function AutoLayoutFrame_Factory(t) { return new (t || AutoLayoutFrame)(); };
+AutoLayoutFrame.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AutoLayoutFrame, selectors: [["frames-auto-layout"]], ngContentSelectors: _c0, decls: 1, vars: 0, template: function AutoLayoutFrame_Template(rf, ctx) {
+        if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+        }
+    }, styles: ["[_nghost-%COMP%]{--gap: 24px;--gap-SCOPED-IN-auto-layout-17iU: var(--gap);--vertical-padding: 24px;--vertical-padding-SCOPED-IN-auto-layout-17iU: var(--vertical-padding)}[_nghost-%COMP%]{display:flex;width:100%;height:100%;justify-content:center;grid-gap:var(--gap-SCOPED-IN-auto-layout-17iU);gap:var(--gap-SCOPED-IN-auto-layout-17iU);box-sizing:border-box;padding:var(--vertical-padding-SCOPED-IN-auto-layout-17iU) 0}[horizontal][_nghost-%COMP%]{flex-direction:row}[vertical][_nghost-%COMP%]{flex-direction:column}"], changeDetection: 0 });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AutoLayoutFrame, [{
+            type: Component,
+            args: [{ selector: 'frames-auto-layout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>", styles: [":host{--gap: 24px;--gap-SCOPED-IN-auto-layout-17iU: var(--gap);--vertical-padding: 24px;--vertical-padding-SCOPED-IN-auto-layout-17iU: var(--vertical-padding)}:host{display:flex;width:100%;height:100%;justify-content:center;grid-gap:var(--gap-SCOPED-IN-auto-layout-17iU);gap:var(--gap-SCOPED-IN-auto-layout-17iU);box-sizing:border-box;padding:var(--vertical-padding-SCOPED-IN-auto-layout-17iU) 0}:host[horizontal]{flex-direction:row}:host[vertical]{flex-direction:column}\n"] }]
+        }], null, null);
+})();
+
+class AutoLayoutModule {
+}
+AutoLayoutModule.ɵfac = function AutoLayoutModule_Factory(t) { return new (t || AutoLayoutModule)(); };
+AutoLayoutModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: AutoLayoutModule });
+AutoLayoutModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [[
+            CommonModule
+        ]] });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AutoLayoutModule, [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        AutoLayoutFrame
+                    ],
+                    imports: [
+                        CommonModule
+                    ],
+                    exports: [
+                        AutoLayoutFrame
+                    ]
+                }]
+        }], null, null);
+})();
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(AutoLayoutModule, { declarations: [AutoLayoutFrame], imports: [CommonModule], exports: [AutoLayoutFrame] }); })();
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AutoLayoutFrame, AutoLayoutModule };
+//# sourceMappingURL=ng-atomic-components-frames-auto-layout.mjs.map

package/fesm2015/ng-atomic-components-frames-auto-layout.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ng-atomic-components-frames-auto-layout.mjs","sources":["../../../../libs/components/src/frames/auto-layout/auto-layout.frame.ts","../../../../libs/components/src/frames/auto-layout/auto-layout.frame.html","../../../../libs/components/src/frames/auto-layout/auto-layout.module.ts","../../../../libs/components/src/frames/auto-layout/ng-atomic-components-frames-auto-layout.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n  selector: 'frames-auto-layout',\n  templateUrl: './auto-layout.frame.html',\n  styleUrls: ['./auto-layout.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class AutoLayoutFrame { }\n","<ng-content></ng-content>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { AutoLayoutFrame } from './auto-layout.frame';\n\n\n@NgModule({\n  declarations: [\n    AutoLayoutFrame\n  ],\n  imports: [\n    CommonModule\n  ],\n  exports: [\n    AutoLayoutFrame\n  ]\n})\nexport class AutoLayoutModule { }","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAQa,eAAe,CAAA;;8EAAf,eAAe,GAAA,CAAA,EAAA,CAAA;kEAAf,eAAe,EAAA,SAAA,EAAA,CAAA,CAAA,oBAAA,CAAA,CAAA,EAAA,kBAAA,EAAA,GAAA,EAAA,KAAA,EAAA,CAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,SAAA,wBAAA,CAAA,EAAA,EAAA,GAAA,EAAA;QAAA,IAAA,EAAA,GAAA,CAAA,EAAA;;ACR5B,YAAA,EAAyB,CAAA,YAAA,CAAA,CAAA,CAAA,CAAA;;;;4EDQZ,eAAe,EAAA,CAAA;kBAN3B,SAAS;+BACE,oBAAoB,EAAA,eAAA,EAGb,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,2BAAA,EAAA,MAAA,EAAA,CAAA,2dAAA,CAAA,EAAA,CAAA;;;;MEWpC,gBAAgB,CAAA;;gFAAhB,gBAAgB,GAAA,CAAA,EAAA,CAAA;kEAAhB,gBAAgB,EAAA,CAAA,CAAA;AAPlB,gBAAA,CAAA,IAAA,iBAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,OAAA,EAAA,CAAA;YACP,YAAY;SACb,CAAA,EAAA,CAAA,CAAA;;4EAKU,gBAAgB,EAAA,CAAA;kBAX5B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,YAAY,EAAE;wBACZ,eAAe;AAChB,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,YAAY;AACb,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,eAAe;AAChB,qBAAA;iBACF,CAAA;;;AACY,CAAA,cAAA,CAAA,OAAA,SAAA,KAAA,WAAA,IAAA,SAAA,KAAA,EAAA,CAAA,kBAAA,CAAA,gBAAgB,EATzB,EAAA,YAAA,EAAA,CAAA,eAAe,CAGf,EAAA,OAAA,EAAA,CAAA,YAAY,aAGZ,eAAe,CAAA,EAAA,CAAA,CAAA,EAAA,GAAA;;ACdnB;;AAEG;;;;"}

package/fesm2015/ng-atomic-components-frames-card.mjs

@@ -0,0 +1,64 @@
+import * as i0 from '@angular/core';
+import { Component, ChangeDetectionStrategy, NgModule } from '@angular/core';
+import * as i1 from '@angular/material/card';
+import { MatCardModule } from '@angular/material/card';
+import { CommonModule } from '@angular/common';
+
+const _c0 = ["*"];
+class CardFrame {
+}
+CardFrame.ɵfac = function CardFrame_Factory(t) { return new (t || CardFrame)(); };
+CardFrame.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CardFrame, selectors: [["frames-card"]], ngContentSelectors: _c0, decls: 2, vars: 0, template: function CardFrame_Template(rf, ctx) {
+        if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵelementStart(0, "mat-card");
+            i0.ɵɵprojection(1);
+            i0.ɵɵelementEnd();
+        }
+    }, directives: [i1.MatCard], styles: ["[_nghost-%COMP%]{display:block}[_nghost-%COMP%]   mat-card[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;flex-direction:column;box-sizing:border-box;width:100%;height:100%}"], changeDetection: 0 });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CardFrame, [{
+            type: Component,
+            args: [{ selector: 'frames-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-card><ng-content></ng-content></mat-card>", styles: [":host{display:block}:host mat-card{display:flex;justify-content:center;align-items:center;flex-direction:column;box-sizing:border-box;width:100%;height:100%}\n"] }]
+        }], null, null);
+})();
+
+class CardModule {
+}
+CardModule.ɵfac = function CardModule_Factory(t) { return new (t || CardModule)(); };
+CardModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: CardModule });
+CardModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [[
+            CommonModule,
+            // Material
+            MatCardModule,
+        ]] });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CardModule, [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        CardFrame
+                    ],
+                    imports: [
+                        CommonModule,
+                        // Material
+                        MatCardModule,
+                    ],
+                    exports: [
+                        CardFrame
+                    ]
+                }]
+        }], null, null);
+})();
+(function () {
+    (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(CardModule, { declarations: [CardFrame], imports: [CommonModule,
+            // Material
+            MatCardModule], exports: [CardFrame] });
+})();
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CardFrame, CardModule };
+//# sourceMappingURL=ng-atomic-components-frames-card.mjs.map

package/fesm2015/ng-atomic-components-frames-card.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ng-atomic-components-frames-card.mjs","sources":["../../../../libs/components/src/frames/card/card.frame.ts","../../../../libs/components/src/frames/card/card.frame.html","../../../../libs/components/src/frames/card/card.module.ts","../../../../libs/components/src/frames/card/ng-atomic-components-frames-card.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n  selector: 'frames-card',\n  templateUrl: './card.frame.html',\n  styleUrls: ['./card.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class CardFrame { }\n","<mat-card><ng-content></ng-content></mat-card>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatCardModule } from '@angular/material/card';\nimport { CardFrame } from './card.frame';\n\n\n\n@NgModule({\n  declarations: [\n    CardFrame\n  ],\n  imports: [\n    CommonModule,\n    // Material\n    MatCardModule,\n  ],\n  exports: [\n    CardFrame\n  ]\n})\nexport class CardModule { }","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;MAQa,SAAS,CAAA;;kEAAT,SAAS,GAAA,CAAA,EAAA,CAAA;4DAAT,SAAS,EAAA,SAAA,EAAA,CAAA,CAAA,aAAA,CAAA,CAAA,EAAA,kBAAA,EAAA,GAAA,EAAA,KAAA,EAAA,CAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,SAAA,kBAAA,CAAA,EAAA,EAAA,GAAA,EAAA;QAAA,IAAA,EAAA,GAAA,CAAA,EAAA;;ACRtB,YAAA,EAAU,CAAA,cAAA,CAAA,CAAA,EAAA,UAAA,CAAA,CAAA;AAAA,YAAA,EAAyB,CAAA,YAAA,CAAA,CAAA,CAAA,CAAA;YAAA,EAAW,CAAA,YAAA,EAAA,CAAA;;;;4EDQjC,SAAS,EAAA,CAAA;kBANrB,SAAS;+BACE,aAAa,EAAA,eAAA,EAGN,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,gDAAA,EAAA,MAAA,EAAA,CAAA,iKAAA,CAAA,EAAA,CAAA;;;;MEcpC,UAAU,CAAA;;oEAAV,UAAU,GAAA,CAAA,EAAA,CAAA;4DAAV,UAAU,EAAA,CAAA,CAAA;AATZ,UAAA,CAAA,IAAA,iBAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,OAAA,EAAA,CAAA;YACP,YAAY;;YAEZ,aAAa;SACd,CAAA,EAAA,CAAA,CAAA;;4EAKU,UAAU,EAAA,CAAA;kBAbtB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,YAAY,EAAE;wBACZ,SAAS;AACV,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,YAAY;;wBAEZ,aAAa;AACd,qBAAA;AACD,oBAAA,OAAO,EAAE;wBACP,SAAS;AACV,qBAAA;iBACF,CAAA;;;;6EACY,UAAU,EAAA,EAAA,YAAA,EAAA,CAXnB,SAAS,CAAA,EAAA,OAAA,EAAA,CAGT,YAAY;;YAEZ,aAAa,aAGb,SAAS,CAAA,EAAA,CAAA,CAAA;AAAA,CAAA,GAAA;;ACjBb;;AAEG;;;;"}

package/fesm2015/ng-atomic-components-frames-drawer.mjs

@@ -0,0 +1,88 @@
+import * as i0 from '@angular/core';
+import { Component, ChangeDetectionStrategy, ViewChild, Input, NgModule } from '@angular/core';
+import * as i1 from '@angular/material/sidenav';
+import { MatDrawer, MatSidenavModule } from '@angular/material/sidenav';
+import { CommonModule } from '@angular/common';
+
+const _c0 = [[["", "drawer", ""]], [["", "contents", ""]]];
+const _c1 = ["[drawer]", "[contents]"];
+class DrawerFrame {
+    constructor() {
+        this._isOpen = false;
+    }
+    set isOpen(_isOpen) {
+        var _a, _b;
+        _isOpen ? (_a = this.drawer) === null || _a === void 0 ? void 0 : _a.open() : (_b = this.drawer) === null || _b === void 0 ? void 0 : _b.close();
+        this._isOpen = _isOpen;
+    }
+    get isOpen() {
+        return this._isOpen;
+    }
+}
+DrawerFrame.ɵfac = function DrawerFrame_Factory(t) { return new (t || DrawerFrame)(); };
+DrawerFrame.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DrawerFrame, selectors: [["frames-drawer"]], viewQuery: function DrawerFrame_Query(rf, ctx) {
+        if (rf & 1) {
+            i0.ɵɵviewQuery(MatDrawer, 5);
+        }
+        if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.drawer = _t.first);
+        }
+    }, inputs: { isOpen: "isOpen" }, ngContentSelectors: _c1, decls: 6, vars: 1, consts: [[3, "autosize"], ["mode", "side"], ["drawer", ""]], template: function DrawerFrame_Template(rf, ctx) {
+        if (rf & 1) {
+            i0.ɵɵprojectionDef(_c0);
+            i0.ɵɵelementStart(0, "mat-drawer-container", 0)(1, "mat-drawer", 1, 2);
+            i0.ɵɵprojection(3);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(4, "mat-drawer-content");
+            i0.ɵɵprojection(5, 1);
+            i0.ɵɵelementEnd()();
+        }
+        if (rf & 2) {
+            i0.ɵɵproperty("autosize", false);
+        }
+    }, directives: [i1.MatDrawerContainer, i1.MatDrawer, i1.MatDrawerContent], styles: ["[_nghost-%COMP%]{--content-width: 360px;--content-width-SCOPED-IN-drawer-TNSX: var(--content-width)}[_nghost-%COMP%]   mat-drawer-content[_ngcontent-%COMP%]{width:100%}"], changeDetection: 0 });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrawerFrame, [{
+            type: Component,
+            args: [{ selector: 'frames-drawer', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-drawer-container [autosize]=\"false\">\n  <mat-drawer #drawer mode=\"side\">\n    <ng-content select=[drawer]></ng-content>\n  </mat-drawer>\n\n  <mat-drawer-content>\n    <ng-content select=[contents]></ng-content>\n  </mat-drawer-content>\n  \n</mat-drawer-container>", styles: [":host{--content-width: 360px;--content-width-SCOPED-IN-drawer-TNSX: var(--content-width)}:host mat-drawer-content{width:100%}\n"] }]
+        }], null, { drawer: [{
+                type: ViewChild,
+                args: [MatDrawer]
+            }], isOpen: [{
+                type: Input
+            }] });
+})();
+
+class DrawerModule {
+}
+DrawerModule.ɵfac = function DrawerModule_Factory(t) { return new (t || DrawerModule)(); };
+DrawerModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: DrawerModule });
+DrawerModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [[
+            CommonModule,
+            MatSidenavModule,
+        ]] });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DrawerModule, [{
+            type: NgModule,
+            args: [{
+                    declarations: [DrawerFrame],
+                    imports: [
+                        CommonModule,
+                        MatSidenavModule,
+                    ],
+                    exports: [DrawerFrame]
+                }]
+        }], null, null);
+})();
+(function () {
+    (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(DrawerModule, { declarations: [DrawerFrame], imports: [CommonModule,
+            MatSidenavModule], exports: [DrawerFrame] });
+})();
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { DrawerFrame, DrawerModule };
+//# sourceMappingURL=ng-atomic-components-frames-drawer.mjs.map

package/fesm2015/ng-atomic-components-frames-drawer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ng-atomic-components-frames-drawer.mjs","sources":["../../../../libs/components/src/frames/drawer/drawer.frame.ts","../../../../libs/components/src/frames/drawer/drawer.frame.html","../../../../libs/components/src/frames/drawer/drawer.module.ts","../../../../libs/components/src/frames/drawer/ng-atomic-components-frames-drawer.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input, ViewChild } from '@angular/core';\nimport { MatDrawer } from '@angular/material/sidenav';\n\n@Component({\n  selector: 'frames-drawer',\n  templateUrl: './drawer.frame.html',\n  styleUrls: ['./drawer.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class DrawerFrame {\n\n  @ViewChild(MatDrawer)\n  drawer!: MatDrawer;\n\n  private _isOpen = false;\n\n  @Input()\n  set isOpen(_isOpen: boolean) {\n    _isOpen ? this.drawer?.open() : this.drawer?.close();\n    this._isOpen = _isOpen\n  }\n\n  get isOpen(): boolean {\n    return this._isOpen\n  }\n\n}\n","<mat-drawer-container [autosize]=\"false\">\n  <mat-drawer #drawer mode=\"side\">\n    <ng-content select=[drawer]></ng-content>\n  </mat-drawer>\n\n  <mat-drawer-content>\n    <ng-content select=[contents]></ng-content>\n  </mat-drawer-content>\n  \n</mat-drawer-container>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatSidenavModule } from '@angular/material/sidenav';\n\nimport { DrawerFrame } from './drawer.frame';\n\n\n\n@NgModule({\n  declarations: [DrawerFrame],\n  imports: [\n    CommonModule,\n    MatSidenavModule,\n  ],\n  exports: [DrawerFrame]\n})\nexport class DrawerModule { }","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;MASa,WAAW,CAAA;AANxB,IAAA,WAAA,GAAA;AAWU,QAAA,IAAO,CAAA,OAAA,GAAG,KAAK,CAAC;KAYzB;IAVC,IACI,MAAM,CAAC,OAAgB,EAAA;;QACzB,OAAO,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,MAAM,0CAAE,IAAI,EAAE,GAAG,MAAA,IAAI,CAAC,MAAM,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAK,EAAE,CAAC;AACrD,QAAA,IAAI,CAAC,OAAO,GAAG,OAAO,CAAA;KACvB;AAED,IAAA,IAAI,MAAM,GAAA;QACR,OAAO,IAAI,CAAC,OAAO,CAAA;KACpB;;sEAfU,WAAW,GAAA,CAAA,EAAA,CAAA;8DAAX,WAAW,EAAA,SAAA,EAAA,CAAA,CAAA,eAAA,CAAA,CAAA,EAAA,SAAA,EAAA,SAAA,iBAAA,CAAA,EAAA,EAAA,GAAA,EAAA;QAAA,IAAA,EAAA,GAAA,CAAA,EAAA;2BAEX,SAAS,EAAA,CAAA,CAAA,CAAA;;;;;;;;;ACXtB,YAAA,EAAA,CAAA,cAAA,CAAA,CAAA,EAAA,sBAAA,EAAA,CAAA,CAAyC,CAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,CAAA,CAAA,CAAA;AAErC,YAAA,EAAyC,CAAA,YAAA,CAAA,CAAA,CAAA,CAAA;YAC3C,EAAa,CAAA,YAAA,EAAA,CAAA;AAEb,YAAA,EAAoB,CAAA,cAAA,CAAA,CAAA,EAAA,oBAAA,CAAA,CAAA;AAClB,YAAA,EAA2C,CAAA,YAAA,CAAA,CAAA,EAAA,CAAA,CAAA,CAAA;AAC7C,YAAA,EAAA,CAAA,YAAA,EAAqB,EAAA,CAAA;;;AAPD,YAAA,EAAkB,CAAA,UAAA,CAAA,UAAA,EAAA,KAAA,CAAA,CAAA;;;;4EDS3B,WAAW,EAAA,CAAA;kBANvB,SAAS;+BACE,eAAe,EAAA,eAAA,EAGR,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,oRAAA,EAAA,MAAA,EAAA,CAAA,iIAAA,CAAA,EAAA,CAAA;oBAK/C,MAAM,EAAA,CAAA;sBADL,SAAS;uBAAC,SAAS,CAAA;gBAMhB,MAAM,EAAA,CAAA;sBADT,KAAK;;;;MEAK,YAAY,CAAA;;wEAAZ,YAAY,GAAA,CAAA,EAAA,CAAA;8DAAZ,YAAY,EAAA,CAAA,CAAA;AANd,YAAA,CAAA,IAAA,iBAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,OAAA,EAAA,CAAA;YACP,YAAY;YACZ,gBAAgB;SACjB,CAAA,EAAA,CAAA,CAAA;;4EAGU,YAAY,EAAA,CAAA;kBARxB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,WAAW,CAAC;AAC3B,oBAAA,OAAO,EAAE;wBACP,YAAY;wBACZ,gBAAgB;AACjB,qBAAA;oBACD,OAAO,EAAE,CAAC,WAAW,CAAC;iBACvB,CAAA;;;;6EACY,YAAY,EAAA,EAAA,YAAA,EAAA,CAPR,WAAW,CAAA,EAAA,OAAA,EAAA,CAExB,YAAY;YACZ,gBAAgB,aAER,WAAW,CAAA,EAAA,CAAA,CAAA;AAAA,CAAA,GAAA;;ACdvB;;AAEG;;;;"}

package/fesm2015/ng-atomic-components-frames-line-up-v2.mjs

@@ -0,0 +1,228 @@
+import * as i0 from '@angular/core';
+import { Injectable, Component, ChangeDetectionStrategy, Input, ViewChild, NgModule } from '@angular/core';
+import { Observable, ReplaySubject, BehaviorSubject, combineLatest } from 'rxjs';
+import { map, startWith, distinctUntilChanged, takeUntil } from 'rxjs/operators';
+import { trigger, state, style, transition, animate, sequence, query, group } from '@angular/animations';
+import ResizeObserver from 'resize-observer-polyfill';
+import { CommonModule } from '@angular/common';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+
+const MAIN_ANIMATION = trigger('modeChangeForMain', [
+    state('*', style({
+        width: '100%',
+    })),
+    state('Next', style({
+        display: 'none',
+        width: '0%',
+    })),
+    transition('* => Next', [
+        animate('0.5s', style({ width: '0%' })),
+        style({ display: 'none' }),
+    ]),
+    transition('Next => *', [
+        sequence([
+            style({ display: 'inherit' }),
+            animate('0.5s', style({ width: '100%' })),
+        ]),
+    ]),
+]);
+const NEXT_ANIMATION = trigger('modeChangeForNext', [
+    state('Next', style({
+        position: 'relative',
+        width: '100%',
+    })),
+    state('Both', style({
+        position: 'relative',
+        width: '100%',
+    })),
+    state('Main', style({
+        position: 'relative',
+        display: 'none',
+    })),
+    transition('Main => Next', [
+        query(':enter', [animate('0.5s')], { optional: true }),
+        sequence([
+            style({ display: 'inherit', width: '100%' }),
+            animate('0.5s'),
+        ]),
+    ]),
+    transition('Main => Both', [
+        query(':enter', [animate('0.5s')], { optional: true }),
+        sequence([
+            style({ display: 'inherit', width: '100%' }),
+            animate('0.5s'),
+        ]),
+    ]),
+    transition('Next => Main', group([
+        query(':leave', animate('0.5s', style({ width: '100%' })), { optional: true }),
+        sequence([
+            style({ position: 'absolute', display: 'block', left: '0%' }),
+            animate('0.5s', style({ left: '100%' })),
+        ]),
+    ])),
+    transition('Both => Main', group([
+        query(':leave', animate('0.5s', style({ width: '100%' })), { optional: true }),
+        sequence([
+            style({ position: 'absolute', display: 'block', left: '100%' }),
+            animate('0.5s', style({})),
+        ]),
+    ])),
+]);
+const LINE_UP_ANIMATIONS = [MAIN_ANIMATION, NEXT_ANIMATION];
+
+function fromResize({ nativeElement }) {
+    return Observable.create(function (observer) {
+        const callback = (entries) => entries.forEach((e) => observer.next(e));
+        const resizeObserver = new ResizeObserver(callback);
+        resizeObserver.observe(nativeElement);
+        return () => resizeObserver.disconnect();
+    }).pipe(map(({ contentRect }) => { var _a; return (_a = contentRect === null || contentRect === void 0 ? void 0 : contentRect.width) !== null && _a !== void 0 ? _a : 0; }), startWith(0), distinctUntilChanged());
+}
+
+const _c0 = ["next"];
+const _c1 = [[["", "main", ""]], [["", "next", ""]]];
+const _c2 = ["[main]", "[next]"];
+var Mode;
+(function (Mode) {
+    Mode["MAIN"] = "Main";
+    Mode["BOTH"] = "Both";
+    Mode["NEXT"] = "Next";
+})(Mode || (Mode = {}));
+class LineUpFrameService {
+    constructor() {
+        this.frames = [];
+    }
+    register(frame) {
+        this.frames.push(frame);
+        console.debug('this.frames:', this.frames);
+    }
+    unregister(frame) {
+        this.frames = this.frames.slice(0, this.findIndex(frame));
+    }
+    findIndex(frame) {
+        return this.frames.findIndex((value) => value === frame);
+    }
+    propagate(frame) {
+        var _a;
+        const target = (_a = this.frames) === null || _a === void 0 ? void 0 : _a[this.findIndex(frame) - 1];
+        target === null || target === void 0 ? void 0 : target.refresh();
+    }
+}
+LineUpFrameService.ɵfac = function LineUpFrameService_Factory(t) { return new (t || LineUpFrameService)(); };
+LineUpFrameService.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: LineUpFrameService, factory: LineUpFrameService.ɵfac, providedIn: 'root' });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LineUpFrameService, [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], null, null);
+})();
+class LineUpFrame {
+    constructor(service) {
+        this.service = service;
+        this.Mode = Mode;
+        this.mode = Mode.MAIN;
+        this.refresh$ = new ReplaySubject(1);
+        this.destroy$ = new ReplaySubject(1);
+        this.hasNext$ = new BehaviorSubject(false);
+        this.minNextWidth = 360;
+    }
+    set hasNext(value) {
+        this.hasNext$.next(value);
+    }
+    ;
+    ngOnInit() {
+        this.service.register(this);
+        this.refresh();
+        combineLatest([
+            this.hasNext$,
+            fromResize(this.nextElementRef),
+            this.refresh$,
+        ]).pipe(takeUntil(this.destroy$)).subscribe(([hasNext, width]) => {
+            this.mode = this.resolveMode(hasNext, width);
+            setTimeout(() => this.service.propagate(this), 0);
+        });
+    }
+    ngOnDestroy() {
+        this.service.unregister(this);
+        this.destroy$.next();
+    }
+    refresh() {
+        this.refresh$.next();
+    }
+    resolveMode(hasNext, width) {
+        if (hasNext && width <= this.minNextWidth)
+            return Mode.BOTH;
+        return hasNext ? Mode.NEXT : Mode.MAIN;
+    }
+}
+LineUpFrame.ɵfac = function LineUpFrame_Factory(t) { return new (t || LineUpFrame)(i0.ɵɵdirectiveInject(LineUpFrameService)); };
+LineUpFrame.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LineUpFrame, selectors: [["frames-line-up"]], viewQuery: function LineUpFrame_Query(rf, ctx) {
+        if (rf & 1) {
+            i0.ɵɵviewQuery(_c0, 7);
+        }
+        if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.nextElementRef = _t.first);
+        }
+    }, inputs: { hasNext: "hasNext", minNextWidth: "minNextWidth" }, ngContentSelectors: _c2, decls: 6, vars: 2, consts: [[1, "main"], ["main", ""], [1, "next"], ["next", ""]], template: function LineUpFrame_Template(rf, ctx) {
+        if (rf & 1) {
+            i0.ɵɵprojectionDef(_c1);
+            i0.ɵɵelementStart(0, "div", 0, 1);
+            i0.ɵɵprojection(2);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(3, "div", 2, 3);
+            i0.ɵɵprojection(5, 1);
+            i0.ɵɵelementEnd();
+        }
+        if (rf & 2) {
+            i0.ɵɵproperty("@modeChangeForMain", ctx.mode);
+            i0.ɵɵadvance(3);
+            i0.ɵɵproperty("@modeChangeForNext", ctx.mode);
+        }
+    }, styles: ["[_nghost-%COMP%]{--gap: 1px;--gap-SCOPED-IN-line-up-wHDG: var(--gap);--background: #ccc;--background-SCOPED-IN-line-up-wHDG: var(--background);--contents-background: transparent;--contents-background-SCOPED-IN-line-up-wHDG: var(--contents-background)}[_nghost-%COMP%]{position:relative;display:flex;justify-content:flex-start;grid-gap:var(--gap-SCOPED-IN-line-up-wHDG);gap:var(--gap-SCOPED-IN-line-up-wHDG);width:-moz-fit-content;width:fit-content;height:100%;background:var(--background-SCOPED-IN-line-up-wHDG)}[_nghost-%COMP%]   div[_ngcontent-%COMP%]{display:flex;max-width:-moz-fit-content;max-width:fit-content;height:100%;background:var(--contents-background-SCOPED-IN-line-up-wHDG)}[_nghost-%COMP%]   div.main[_ngcontent-%COMP%]{overflow:hidden;justify-content:flex-end}[_nghost-%COMP%]   div.next[_ngcontent-%COMP%]{overflow:visible;justify-content:flex-start}"], data: { animation: LINE_UP_ANIMATIONS } });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LineUpFrame, [{
+            type: Component,
+            args: [{ selector: 'frames-line-up', changeDetection: ChangeDetectionStrategy.Default, animations: LINE_UP_ANIMATIONS, template: "<div class=\"main\" [@modeChangeForMain]=\"mode\" #main>\n  <ng-content select=\"[main]\"></ng-content>\n</div>\n<div class=\"next\" [@modeChangeForNext]=\"mode\" #next>\n  <ng-content select=\"[next]\"></ng-content>\n</div>", styles: [":host{--gap: 1px;--gap-SCOPED-IN-line-up-wHDG: var(--gap);--background: #ccc;--background-SCOPED-IN-line-up-wHDG: var(--background);--contents-background: transparent;--contents-background-SCOPED-IN-line-up-wHDG: var(--contents-background)}:host{position:relative;display:flex;justify-content:flex-start;grid-gap:var(--gap-SCOPED-IN-line-up-wHDG);gap:var(--gap-SCOPED-IN-line-up-wHDG);width:-moz-fit-content;width:fit-content;height:100%;background:var(--background-SCOPED-IN-line-up-wHDG)}:host div{display:flex;max-width:-moz-fit-content;max-width:fit-content;height:100%;background:var(--contents-background-SCOPED-IN-line-up-wHDG)}:host div.main{overflow:hidden;justify-content:flex-end}:host div.next{overflow:visible;justify-content:flex-start}\n"] }]
+        }], function () { return [{ type: LineUpFrameService }]; }, { hasNext: [{
+                type: Input
+            }], minNextWidth: [{
+                type: Input
+            }], nextElementRef: [{
+                type: ViewChild,
+                args: ['next', { static: true }]
+            }] });
+})();
+
+class LineUpModule {
+}
+LineUpModule.ɵfac = function LineUpModule_Factory(t) { return new (t || LineUpModule)(); };
+LineUpModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: LineUpModule });
+LineUpModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [[
+            CommonModule,
+            MatProgressSpinnerModule
+        ]] });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LineUpModule, [{
+            type: NgModule,
+            args: [{
+                    declarations: [LineUpFrame],
+                    imports: [
+                        CommonModule,
+                        MatProgressSpinnerModule
+                    ],
+                    exports: [LineUpFrame]
+                }]
+        }], null, null);
+})();
+(function () {
+    (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(LineUpModule, { declarations: [LineUpFrame], imports: [CommonModule,
+            MatProgressSpinnerModule], exports: [LineUpFrame] });
+})();
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { LineUpFrame, LineUpFrameService, LineUpModule };
+//# sourceMappingURL=ng-atomic-components-frames-line-up-v2.mjs.map