@ng-atomic/components 16.2.0 → 16.3.1

package/fesm2022/ng-atomic-components-frames-side-nav.mjs

@@ -1,44 +1,71 @@
-import * as i1 from '@angular/common';
-import { CommonModule } from '@angular/common';
+import { __decorate } from 'tslib';
+import { NgTemplateOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
-import { InjectionToken, Directive, Input, HostBinding, inject, Component, ChangeDetectionStrategy } from '@angular/core';
-import { injectUiConfig } from '@ng-atomic/common/services/ui';
+import { signal, input, Directive, HostBinding, inject, Component, ChangeDetectionStrategy } from '@angular/core';
+import { makeConfig } from '@ng-atomic/common/services/ui';
 import { DrawerFrame } from '@ng-atomic/components/frames/drawer';
 import { LineUpFrame } from '@ng-atomic/components/frames/line-up';
 import { MenuTemplateStore } from '@ng-atomic/components/templates/menu';
-import { InjectableComponent, NgAtomicComponent } from '@ng-atomic/core';
-import { signalize } from '@ng-atomic/common/pipes/signal';
+import { InjectableComponent, _computed, TokenizedType, NgAtomicComponent } from '@ng-atomic/core';
 import { IconButtonMenuTemplateStore } from '@ng-atomic/components/templates/icon-button-menu';
 
-class SideNavFrameStore extends InjectableComponent {
+var SideNavFrameStore_1;
+function injectSideNavMode() {
+    return signal('collapsed');
+}
+let SideNavFrameStore = class SideNavFrameStore extends InjectableComponent {
     constructor() {
         super(...arguments);
-        this.actions = [];
-        this.menuType = injectUiConfig(['frames', 'sideNav', 'menuType']);
-        this.mode = 'expanded';
-        this.frameType = injectUiConfig(['frames', 'sideNav', 'frameType']);
+        this.config = SideNavFrameStore_1.Config.inject();
+        this.actions = input(_computed(() => this.config().actions));
+        this.menuType = input(_computed(() => this.config().menuType));
+        this.menuTitle = input(_computed(() => this.config().menuTitle));
+        this.mode = input(_computed(() => this.config().mode));
+        this.frameType = input(_computed(() => this.config().frameType));
     }
-    static { this.TOKEN = new InjectionToken('side-nav-frame-store'); }
+    static { SideNavFrameStore_1 = this; }
+    static { this.Config = makeConfig(() => {
+        const getFrameType = (breakpoint) => {
+            switch (breakpoint) {
+                case 'xSmall': return 'drawer';
+                default: return 'lineup';
+            }
+        };
+        const getMenuType = (breakpoint) => {
+            switch (breakpoint) {
+                case 'xSmall': return 'menu';
+                case 'small':
+                case 'medium': return 'icon-button-menu';
+                default: return 'menu';
+            }
+        };
+        const getMode = (breakpoint) => {
+            switch (breakpoint) {
+                case 'xSmall': return 'collapsed';
+                default: return 'expanded';
+            }
+        };
+        return (_, context) => ({
+            actions: [],
+            menuType: getMenuType(context.breakpoint),
+            menuTitle: undefined,
+            mode: getMode(context.breakpoint),
+            frameType: getFrameType(context.breakpoint),
+        });
+    }, ['components', 'frames', 'sideNav']); }
     get attrFrame() {
         return this.frameType();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SideNavFrameStore, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "16.2.12", type: SideNavFrameStore, isStandalone: true, selector: "frames-side-nav", inputs: { actions: "actions", menuType: ["menuType", "menuType", (v) => signalize(v)], mode: "mode", frameType: ["frameType", "frameType", (v) => signalize(v)] }, host: { properties: { "attr.frame": "this.attrFrame" } }, usesInheritance: true, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SideNavFrameStore, decorators: [{
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: SideNavFrameStore, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "17.2.2", type: SideNavFrameStore, isStandalone: true, selector: "frames-side-nav", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, menuType: { classPropertyName: "menuType", publicName: "menuType", isSignal: true, isRequired: false, transformFunction: null }, menuTitle: { classPropertyName: "menuTitle", publicName: "menuTitle", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, frameType: { classPropertyName: "frameType", publicName: "frameType", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.frame": "this.attrFrame" } }, usesInheritance: true, ngImport: i0 }); }
+};
+SideNavFrameStore = SideNavFrameStore_1 = __decorate([
+    TokenizedType()
+], SideNavFrameStore);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: SideNavFrameStore, decorators: [{
             type: Directive,
             args: [{ standalone: true, selector: 'frames-side-nav' }]
-        }], propDecorators: { actions: [{
-                type: Input
-            }], menuType: [{
-                type: Input,
-                args: [{ transform: (v) => signalize(v) }]
-            }], mode: [{
-                type: Input
-            }], frameType: [{
-                type: Input,
-                args: [{ transform: (v) => signalize(v) }]
-            }], attrFrame: [{
+        }], propDecorators: { attrFrame: [{
                 type: HostBinding,
                 args: ['attr.frame']
             }] } });
@@ -47,86 +74,112 @@ class SideNavFrame extends NgAtomicComponent {
         super(...arguments);
         this.store = inject(SideNavFrameStore);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SideNavFrame, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SideNavFrame, isStandalone: true, selector: "frames-side-nav", usesInheritance: true, hostDirectives: [{ directive: SideNavFrameStore, inputs: ["actions", "actions", "menuType", "menuType", "mode", "mode", "frameType", "frameType"] }], ngImport: i0, template: `
-  <ng-container [ngSwitch]="store.frameType()">
-    <frames-drawer *ngSwitchCase="'drawer'" [isOpen]="store.mode === 'expanded'">
-      <ng-container drawer *ngTemplateOutlet="menu"></ng-container>
-      <ng-container contents *ngTemplateOutlet="contents"></ng-container>
-    </frames-drawer>
-    <frames-line-up *ngSwitchCase="'lineup'" [hasNext]="true" [scope]="'nav'">
-      <ng-container main *ngTemplateOutlet="menu"></ng-container>
-      <div class="content" next><ng-container *ngTemplateOutlet="contents"></ng-container></div>
-    </frames-line-up>
-  </ng-container>
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: SideNavFrame, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: SideNavFrame, isStandalone: true, selector: "frames-side-nav", usesInheritance: true, hostDirectives: [{ directive: SideNavFrameStore, inputs: ["actions", "actions", "menuType", "menuType", "menuTitle", "menuTitle", "mode", "mode", "frameType", "frameType"] }], ngImport: i0, template: `
+  @switch (store.frameType()) {
+    @case ('drawer') {
+      @defer {
+        <frames-drawer [opened]="store.mode() === 'expanded'">
+          <ng-container *ngTemplateOutlet="menu" drawer/>
+          <ng-container *ngTemplateOutlet="contents" contents/>
+        </frames-drawer>
+      }
+    }
+    @default {
+      <!-- @defer { -->
+        <frames-line-up [hasNext]="true" [scope]="'nav'">
+          <ng-container *ngTemplateOutlet="menu" main/>
+          <div class="content" next><ng-container *ngTemplateOutlet="contents"/></div>
+        </frames-line-up>
+      <!-- } -->
+    }
+  }
 
   <ng-template #menu>
-    <ng-container [ngSwitch]="store.menuType()">
-      <templates-icon-button-menu injectable
-        *ngSwitchCase="'icon-button-menu'"
-        [actions]="store.actions"
-        (action)="dispatch($event)"
-      ></templates-icon-button-menu>
-      <templates-menu injectable
-        *ngSwitchCase="'menu'"
-        [actions]="store.actions"
-        (action)="dispatch($event)"
-      ></templates-menu>
-    </ng-container>
-  </ng-template>
-  <ng-template #contents>
-    <ng-content select="[contents]"></ng-content>
+    @switch (store.menuType()) {
+      @case ('icon-button-menu') {
+        <!-- @defer { -->
+          <templates-icon-button-menu injectable
+            [actions]="store.actions()"
+            (action)="dispatch($event)"
+          />
+        <!-- } -->
+      }
+      @default {
+        <!-- @defer { -->
+          <templates-menu injectable
+            [title]="store.menuTitle()"
+            [actions]="store.actions()"
+            (action)="dispatch($event)"
+          />
+        <!-- } -->
+      }
+    }
   </ng-template>
-  `, isInline: true, styles: [":host{--primary-color: #3aa1f2;--primary-color-SCOPED-IN-side-nav-p7rw: var(--primary-color);--secondary-color: #3aa1f2;--secondary-color-SCOPED-IN-side-nav-p7rw: var(--secondary-color);--menu-width: 220px;--menu-width-SCOPED-IN-side-nav-p7rw: var(--menu-width)}:host{display:block;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-side-nav-p7rw);--secondary-color: var(--secondary-color-SCOPED-IN-side-nav-p7rw)}:host .content{width:100%;height:100%}:host[frame=lineup] .menu{width:var(--menu-width-SCOPED-IN-side-nav-p7rw)}:host[frame=lineup] templates-icon-button-menu,:host[frame=lineup] templates-menu{width:var(--menu-width-SCOPED-IN-side-nav-p7rw)}:host[frame=lineup] .content{width:calc(100vw - var(--menu-width-SCOPED-IN-side-nav-p7rw))}:host[frame=drawer] .menu{width:300px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: DrawerFrame, selector: "frames-drawer", inputs: ["isOpen"] }, { kind: "component", type: LineUpFrame, selector: "frames-line-up", inputs: ["hasNext", "scope"] }, { kind: "directive", type: IconButtonMenuTemplateStore, selector: "templates-icon-button-menu", inputs: ["actions"] }, { kind: "directive", type: MenuTemplateStore, selector: "templates-menu", inputs: ["actions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  <ng-template #contents><ng-content/></ng-template>
+  `, isInline: true, styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-side-nav-tEBg: var(--primary-color);--secondary-color: #B0B0B0;--secondary-color-SCOPED-IN-side-nav-tEBg: var(--secondary-color);--background-color: #B0B0B0;--background-color-SCOPED-IN-side-nav-tEBg: var(--background-color);--surface-color: transparent;--surface-color-SCOPED-IN-side-nav-tEBg: var(--surface-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-side-nav-tEBg: var(--on-primary-color);--on-background-color: #f0f0f0;--on-background-color-SCOPED-IN-side-nav-tEBg: var(--on-background-color);--on-surface-color: #f0f0f0;--on-surface-color-SCOPED-IN-side-nav-tEBg: var(--on-surface-color);--menu-width: 220px;--menu-width-SCOPED-IN-side-nav-tEBg: var(--menu-width);--menu-background-color: var(--primary-color-SCOPED-IN-side-nav-tEBg);--menu-background-color-SCOPED-IN-side-nav-tEBg: var(--menu-background-color);--menu-on-background-color: var(--on-primary-color-SCOPED-IN-side-nav-tEBg);--menu-on-background-color-SCOPED-IN-side-nav-tEBg: var(--menu-on-background-color)}:host{display:block;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-side-nav-tEBg);--secondary-color: var(--secondary-color-SCOPED-IN-side-nav-tEBg);--surface-color: var(--surface-color-SCOPED-IN-side-nav-tEBg);--background-color: var(--background-color-SCOPED-IN-side-nav-tEBg);--on-primary-color: var(--on-primary-color-SCOPED-IN-side-nav-tEBg);--on-surface-color: var(--on-surface-color-SCOPED-IN-side-nav-tEBg);--on-background-color: var(--on-background-color-SCOPED-IN-side-nav-tEBg)}:host .content{width:100%;height:100%}:host templates-icon-button-menu,:host templates-menu{width:var(--menu-width-SCOPED-IN-side-nav-tEBg);--background-color: var(--menu-background-color-SCOPED-IN-side-nav-tEBg);--on-background-color: var(--menu-on-background-color-SCOPED-IN-side-nav-tEBg)}:host[frame=lineup] .content{width:calc(100vw - var(--menu-width-SCOPED-IN-side-nav-tEBg));overflow:hidden}:host[frame=drawer] .menu,:host[frame=drawer] templates-menu{width:300px}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: LineUpFrame, selector: "frames-line-up" }, { kind: "directive", type: IconButtonMenuTemplateStore, selector: "templates-icon-button-menu", inputs: ["actions"] }, { kind: "directive", type: MenuTemplateStore, selector: "templates-menu", inputs: ["actions", "title"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SideNavFrame, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: SideNavFrame, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [
-                        CommonModule,
+                        NgTemplateOutlet,
                         DrawerFrame,
                         LineUpFrame,
                         IconButtonMenuTemplateStore,
                         MenuTemplateStore,
                     ], selector: 'frames-side-nav', template: `
-  <ng-container [ngSwitch]="store.frameType()">
-    <frames-drawer *ngSwitchCase="'drawer'" [isOpen]="store.mode === 'expanded'">
-      <ng-container drawer *ngTemplateOutlet="menu"></ng-container>
-      <ng-container contents *ngTemplateOutlet="contents"></ng-container>
-    </frames-drawer>
-    <frames-line-up *ngSwitchCase="'lineup'" [hasNext]="true" [scope]="'nav'">
-      <ng-container main *ngTemplateOutlet="menu"></ng-container>
-      <div class="content" next><ng-container *ngTemplateOutlet="contents"></ng-container></div>
-    </frames-line-up>
-  </ng-container>
+  @switch (store.frameType()) {
+    @case ('drawer') {
+      @defer {
+        <frames-drawer [opened]="store.mode() === 'expanded'">
+          <ng-container *ngTemplateOutlet="menu" drawer/>
+          <ng-container *ngTemplateOutlet="contents" contents/>
+        </frames-drawer>
+      }
+    }
+    @default {
+      <!-- @defer { -->
+        <frames-line-up [hasNext]="true" [scope]="'nav'">
+          <ng-container *ngTemplateOutlet="menu" main/>
+          <div class="content" next><ng-container *ngTemplateOutlet="contents"/></div>
+        </frames-line-up>
+      <!-- } -->
+    }
+  }
 
   <ng-template #menu>
-    <ng-container [ngSwitch]="store.menuType()">
-      <templates-icon-button-menu injectable
-        *ngSwitchCase="'icon-button-menu'"
-        [actions]="store.actions"
-        (action)="dispatch($event)"
-      ></templates-icon-button-menu>
-      <templates-menu injectable
-        *ngSwitchCase="'menu'"
-        [actions]="store.actions"
-        (action)="dispatch($event)"
-      ></templates-menu>
-    </ng-container>
-  </ng-template>
-  <ng-template #contents>
-    <ng-content select="[contents]"></ng-content>
+    @switch (store.menuType()) {
+      @case ('icon-button-menu') {
+        <!-- @defer { -->
+          <templates-icon-button-menu injectable
+            [actions]="store.actions()"
+            (action)="dispatch($event)"
+          />
+        <!-- } -->
+      }
+      @default {
+        <!-- @defer { -->
+          <templates-menu injectable
+            [title]="store.menuTitle()"
+            [actions]="store.actions()"
+            (action)="dispatch($event)"
+          />
+        <!-- } -->
+      }
+    }
   </ng-template>
+  <ng-template #contents><ng-content/></ng-template>
   `, changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
                         {
                             directive: SideNavFrameStore,
-                            inputs: ['actions', 'menuType', 'mode', 'frameType'],
+                            inputs: ['actions', 'menuType', 'menuTitle', 'mode', 'frameType'],
                         },
-                    ], styles: [":host{--primary-color: #3aa1f2;--primary-color-SCOPED-IN-side-nav-p7rw: var(--primary-color);--secondary-color: #3aa1f2;--secondary-color-SCOPED-IN-side-nav-p7rw: var(--secondary-color);--menu-width: 220px;--menu-width-SCOPED-IN-side-nav-p7rw: var(--menu-width)}:host{display:block;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-side-nav-p7rw);--secondary-color: var(--secondary-color-SCOPED-IN-side-nav-p7rw)}:host .content{width:100%;height:100%}:host[frame=lineup] .menu{width:var(--menu-width-SCOPED-IN-side-nav-p7rw)}:host[frame=lineup] templates-icon-button-menu,:host[frame=lineup] templates-menu{width:var(--menu-width-SCOPED-IN-side-nav-p7rw)}:host[frame=lineup] .content{width:calc(100vw - var(--menu-width-SCOPED-IN-side-nav-p7rw))}:host[frame=drawer] .menu{width:300px}\n"] }]
+                    ], styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-side-nav-tEBg: var(--primary-color);--secondary-color: #B0B0B0;--secondary-color-SCOPED-IN-side-nav-tEBg: var(--secondary-color);--background-color: #B0B0B0;--background-color-SCOPED-IN-side-nav-tEBg: var(--background-color);--surface-color: transparent;--surface-color-SCOPED-IN-side-nav-tEBg: var(--surface-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-side-nav-tEBg: var(--on-primary-color);--on-background-color: #f0f0f0;--on-background-color-SCOPED-IN-side-nav-tEBg: var(--on-background-color);--on-surface-color: #f0f0f0;--on-surface-color-SCOPED-IN-side-nav-tEBg: var(--on-surface-color);--menu-width: 220px;--menu-width-SCOPED-IN-side-nav-tEBg: var(--menu-width);--menu-background-color: var(--primary-color-SCOPED-IN-side-nav-tEBg);--menu-background-color-SCOPED-IN-side-nav-tEBg: var(--menu-background-color);--menu-on-background-color: var(--on-primary-color-SCOPED-IN-side-nav-tEBg);--menu-on-background-color-SCOPED-IN-side-nav-tEBg: var(--menu-on-background-color)}:host{display:block;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-side-nav-tEBg);--secondary-color: var(--secondary-color-SCOPED-IN-side-nav-tEBg);--surface-color: var(--surface-color-SCOPED-IN-side-nav-tEBg);--background-color: var(--background-color-SCOPED-IN-side-nav-tEBg);--on-primary-color: var(--on-primary-color-SCOPED-IN-side-nav-tEBg);--on-surface-color: var(--on-surface-color-SCOPED-IN-side-nav-tEBg);--on-background-color: var(--on-background-color-SCOPED-IN-side-nav-tEBg)}:host .content{width:100%;height:100%}:host templates-icon-button-menu,:host templates-menu{width:var(--menu-width-SCOPED-IN-side-nav-tEBg);--background-color: var(--menu-background-color-SCOPED-IN-side-nav-tEBg);--on-background-color: var(--menu-on-background-color-SCOPED-IN-side-nav-tEBg)}:host[frame=lineup] .content{width:calc(100vw - var(--menu-width-SCOPED-IN-side-nav-tEBg));overflow:hidden}:host[frame=drawer] .menu,:host[frame=drawer] templates-menu{width:300px}\n"] }]
         }] });
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { SideNavFrame, SideNavFrameStore };
+export { SideNavFrame, SideNavFrameStore, injectSideNavMode };
 //# sourceMappingURL=ng-atomic-components-frames-side-nav.mjs.map

package/fesm2022/ng-atomic-components-frames-side-nav.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-frames-side-nav.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/side-nav/side-nav.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/side-nav/ng-atomic-components-frames-side-nav.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Directive, HostBinding, InjectionToken, Input, Signal, computed, inject, isSignal, signal } from '@angular/core';\nimport { injectUiConfig } from '@ng-atomic/common/services/ui';\nimport { DrawerFrame } from '@ng-atomic/components/frames/drawer';\nimport { LineUpFrame } from '@ng-atomic/components/frames/line-up';\nimport { MenuTemplateStore } from '@ng-atomic/components/templates/menu';\nimport { NgAtomicComponent } from '@ng-atomic/core';\nimport { signalize } from '@ng-atomic/common/pipes/signal';\nimport { IconButtonMenuTemplateStore } from '@ng-atomic/components/templates/icon-button-menu';\nimport { Action } from '@ng-atomic/core';\nimport { InjectableComponent } from '@ng-atomic/core';\n\n@Directive({ standalone: true, selector: 'frames-side-nav' })\nexport class SideNavFrameStore extends InjectableComponent {\n  static TOKEN = new InjectionToken('side-nav-frame-store');\n\n  @Input()\n  readonly actions: Action[] = [];\n\n  @Input({transform: (v: any) => signalize(v)})\n  readonly menuType = injectUiConfig(['frames', 'sideNav', 'menuType']);\n\n  @Input()\n  readonly mode: 'expanded' | 'collapsed' = 'expanded';\n\n  @Input({transform: (v: any) => signalize(v)})\n  readonly frameType = injectUiConfig(['frames', 'sideNav', 'frameType']);\n\n  @HostBinding('attr.frame')\n  get attrFrame() {\n    return this.frameType();\n  }\n}\n\n\n@Component({\n  standalone: true,\n  imports: [\n    CommonModule,\n    DrawerFrame,\n    LineUpFrame,\n    IconButtonMenuTemplateStore,\n    MenuTemplateStore,\n  ],\n  selector: 'frames-side-nav',\n  template: `\n  <ng-container [ngSwitch]=\"store.frameType()\">\n    <frames-drawer *ngSwitchCase=\"'drawer'\" [isOpen]=\"store.mode === 'expanded'\">\n      <ng-container drawer *ngTemplateOutlet=\"menu\"></ng-container>\n      <ng-container contents *ngTemplateOutlet=\"contents\"></ng-container>\n    </frames-drawer>\n    <frames-line-up *ngSwitchCase=\"'lineup'\" [hasNext]=\"true\" [scope]=\"'nav'\">\n      <ng-container main *ngTemplateOutlet=\"menu\"></ng-container>\n      <div class=\"content\" next><ng-container *ngTemplateOutlet=\"contents\"></ng-container></div>\n    </frames-line-up>\n  </ng-container>\n\n  <ng-template #menu>\n    <ng-container [ngSwitch]=\"store.menuType()\">\n      <templates-icon-button-menu injectable\n        *ngSwitchCase=\"'icon-button-menu'\"\n        [actions]=\"store.actions\"\n        (action)=\"dispatch($event)\"\n      ></templates-icon-button-menu>\n      <templates-menu injectable\n        *ngSwitchCase=\"'menu'\"\n        [actions]=\"store.actions\"\n        (action)=\"dispatch($event)\"\n      ></templates-menu>\n    </ng-container>\n  </ng-template>\n  <ng-template #contents>\n    <ng-content select=\"[contents]\"></ng-content>\n  </ng-template>\n  `,\n  styleUrls: ['./side-nav.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  hostDirectives: [\n    {\n      directive: SideNavFrameStore,\n      inputs: ['actions', 'menuType', 'mode', 'frameType'],\n    },\n  ],\n})\nexport class SideNavFrame extends NgAtomicComponent {\n  protected store = inject(SideNavFrameStore);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ng-atomic-components-frames-side-nav.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/side-nav/side-nav.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/side-nav/ng-atomic-components-frames-side-nav.ts"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Directive, HostBinding, WritableSignal, inject, input, signal } from '@angular/core';\nimport { Breakpoint, makeConfig } from '@ng-atomic/common/services/ui';\nimport { DrawerFrame } from '@ng-atomic/components/frames/drawer';\nimport { LineUpFrame } from '@ng-atomic/components/frames/line-up';\nimport { MenuTemplateStore } from '@ng-atomic/components/templates/menu';\nimport { NgAtomicComponent, TokenizedType, _computed } from '@ng-atomic/core';\nimport { IconButtonMenuTemplateStore } from '@ng-atomic/components/templates/icon-button-menu';\nimport { InjectableComponent } from '@ng-atomic/core';\n\nexport function injectSideNavMode(): WritableSignal<'collapsed' | 'expanded'> {\n  return signal<'collapsed' | 'expanded'>('collapsed');\n}\n\n@TokenizedType()\n@Directive({ standalone: true, selector: 'frames-side-nav' })\nexport class SideNavFrameStore extends InjectableComponent {\n  static readonly Config = makeConfig(() => {\n    const getFrameType = (breakpoint: Breakpoint) => {\n      switch (breakpoint) {\n        case 'xSmall': return 'drawer';\n        default: return 'lineup';\n      }\n    }\n\n    const getMenuType = (breakpoint: Breakpoint) => {\n      switch (breakpoint) {\n        case 'xSmall': return 'menu';\n        case 'small':\n        case 'medium': return 'icon-button-menu';\n        default: return 'menu';\n      }\n    }\n\n    const getMode = (breakpoint: Breakpoint) => {\n      switch (breakpoint) {\n        case 'xSmall': return 'collapsed';\n        default: return 'expanded';\n      }\n    }\n\n    return (_, context) => ({\n      actions: [],\n      menuType: getMenuType(context.breakpoint),\n      menuTitle: undefined as string,\n      mode: getMode(context.breakpoint),\n      frameType: getFrameType(context.breakpoint) as 'lineup' | 'drawer',\n    });\n  }, ['components', 'frames', 'sideNav']);\n\n  readonly config = SideNavFrameStore.Config.inject();\n  readonly actions = input(_computed(() => this.config().actions));\n  readonly menuType = input(_computed(() => this.config().menuType));\n  readonly menuTitle = input(_computed(() => this.config().menuTitle));\n  readonly mode = input(_computed(() => this.config().mode));\n  readonly frameType = input(_computed(() => this.config().frameType));\n\n  @HostBinding('attr.frame')\n  get attrFrame() {\n    return this.frameType();\n  }\n}\n\n\n@Component({\n  standalone: true,\n  imports: [\n    NgTemplateOutlet,\n    DrawerFrame,\n    LineUpFrame,\n    IconButtonMenuTemplateStore,\n    MenuTemplateStore,\n  ],\n  selector: 'frames-side-nav',\n  template: `\n  @switch (store.frameType()) {\n    @case ('drawer') {\n      @defer {\n        <frames-drawer [opened]=\"store.mode() === 'expanded'\">\n          <ng-container *ngTemplateOutlet=\"menu\" drawer/>\n          <ng-container *ngTemplateOutlet=\"contents\" contents/>\n        </frames-drawer>\n      }\n    }\n    @default {\n      <!-- @defer { -->\n        <frames-line-up [hasNext]=\"true\" [scope]=\"'nav'\">\n          <ng-container *ngTemplateOutlet=\"menu\" main/>\n          <div class=\"content\" next><ng-container *ngTemplateOutlet=\"contents\"/></div>\n        </frames-line-up>\n      <!-- } -->\n    }\n  }\n\n  <ng-template #menu>\n    @switch (store.menuType()) {\n      @case ('icon-button-menu') {\n        <!-- @defer { -->\n          <templates-icon-button-menu injectable\n            [actions]=\"store.actions()\"\n            (action)=\"dispatch($event)\"\n          />\n        <!-- } -->\n      }\n      @default {\n        <!-- @defer { -->\n          <templates-menu injectable\n            [title]=\"store.menuTitle()\"\n            [actions]=\"store.actions()\"\n            (action)=\"dispatch($event)\"\n          />\n        <!-- } -->\n      }\n    }\n  </ng-template>\n  <ng-template #contents><ng-content/></ng-template>\n  `,\n  styleUrls: ['./side-nav.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  hostDirectives: [\n    {\n      directive: SideNavFrameStore,\n      inputs: ['actions', 'menuType', 'menuTitle', 'mode', 'frameType'],\n    },\n  ],\n})\nexport class SideNavFrame extends NgAtomicComponent {\n  protected store = inject(SideNavFrameStore);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ng-atomic-components-frames-smart-menu.mjs

@@ -13,14 +13,14 @@ class SmartMenuFrame {
         const page = this.outlet?.activatedRouteData?.['page'];
         return page === 'Blank' ? 'Blank' : this.isMainHidden ? `Next` : `NextWithMainPage`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SmartMenuFrame, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SmartMenuFrame, isStandalone: true, selector: "frames-smart-menu", inputs: { label: "label", outlet: "outlet", minNextWidth: "minNextWidth" }, host: { properties: { "attr.is-main-hidden": "this.isMainHidden" } }, viewQueries: [{ propertyName: "next", first: true, predicate: ["next"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"menu\" #menu>\n  <ng-content select=\"[menu]\"></ng-content>\n</div>\n<div class=\"contents\" #contents>\n  <ng-content select=\"[contents]\"></ng-content>\n</div>", styles: [":host{--gap: 1px;--gap-SCOPED-IN-smart-menu-mjDV: var(--gap);--background: #ccc;--background-SCOPED-IN-smart-menu-mjDV: var(--background);--contents-background: transparent;--contents-background-SCOPED-IN-smart-menu-mjDV: var(--contents-background)}:host{position:relative;display:flex;justify-content:flex-start;gap:var(--gap-SCOPED-IN-smart-menu-mjDV);width:-moz-fit-content;width:fit-content;height:100%;background:var(--background-SCOPED-IN-smart-menu-mjDV)}:host .contents{display:flex;max-width:-moz-fit-content;max-width:fit-content;height:100%;background:var(--contents-background-SCOPED-IN-smart-menu-mjDV)}:host .contents.menu{overflow:hidden;justify-content:flex-end}:host .contents.contents{overflow:visible;justify-content:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: SmartMenuFrame, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: SmartMenuFrame, isStandalone: true, selector: "frames-smart-menu", inputs: { label: "label", outlet: "outlet", minNextWidth: "minNextWidth" }, host: { properties: { "attr.is-main-hidden": "this.isMainHidden" } }, viewQueries: [{ propertyName: "next", first: true, predicate: ["next"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"menu\" #menu>\n  <ng-content select=\"[menu]\"></ng-content>\n</div>\n<div class=\"contents\" #contents>\n  <ng-content select=\"[contents]\"></ng-content>\n</div>", styles: [":host{--gap: 1px;--gap-SCOPED-IN-smart-menu-ETU0: var(--gap);--background: #ccc;--background-SCOPED-IN-smart-menu-ETU0: var(--background);--contents-background: transparent;--contents-background-SCOPED-IN-smart-menu-ETU0: var(--contents-background)}:host{position:relative;display:flex;justify-content:flex-start;gap:var(--gap-SCOPED-IN-smart-menu-ETU0);width:-moz-fit-content;width:fit-content;height:100%;background:var(--background-SCOPED-IN-smart-menu-ETU0)}:host .contents{display:flex;max-width:-moz-fit-content;max-width:fit-content;height:100%;background:var(--contents-background-SCOPED-IN-smart-menu-ETU0)}:host .contents.menu{overflow:hidden;justify-content:flex-end}:host .contents.contents{overflow:visible;justify-content:flex-start}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SmartMenuFrame, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: SmartMenuFrame, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [
                         CommonModule,
-                    ], selector: 'frames-smart-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"menu\" #menu>\n  <ng-content select=\"[menu]\"></ng-content>\n</div>\n<div class=\"contents\" #contents>\n  <ng-content select=\"[contents]\"></ng-content>\n</div>", styles: [":host{--gap: 1px;--gap-SCOPED-IN-smart-menu-mjDV: var(--gap);--background: #ccc;--background-SCOPED-IN-smart-menu-mjDV: var(--background);--contents-background: transparent;--contents-background-SCOPED-IN-smart-menu-mjDV: var(--contents-background)}:host{position:relative;display:flex;justify-content:flex-start;gap:var(--gap-SCOPED-IN-smart-menu-mjDV);width:-moz-fit-content;width:fit-content;height:100%;background:var(--background-SCOPED-IN-smart-menu-mjDV)}:host .contents{display:flex;max-width:-moz-fit-content;max-width:fit-content;height:100%;background:var(--contents-background-SCOPED-IN-smart-menu-mjDV)}:host .contents.menu{overflow:hidden;justify-content:flex-end}:host .contents.contents{overflow:visible;justify-content:flex-start}\n"] }]
+                    ], selector: 'frames-smart-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"menu\" #menu>\n  <ng-content select=\"[menu]\"></ng-content>\n</div>\n<div class=\"contents\" #contents>\n  <ng-content select=\"[contents]\"></ng-content>\n</div>", styles: [":host{--gap: 1px;--gap-SCOPED-IN-smart-menu-ETU0: var(--gap);--background: #ccc;--background-SCOPED-IN-smart-menu-ETU0: var(--background);--contents-background: transparent;--contents-background-SCOPED-IN-smart-menu-ETU0: var(--contents-background)}:host{position:relative;display:flex;justify-content:flex-start;gap:var(--gap-SCOPED-IN-smart-menu-ETU0);width:-moz-fit-content;width:fit-content;height:100%;background:var(--background-SCOPED-IN-smart-menu-ETU0)}:host .contents{display:flex;max-width:-moz-fit-content;max-width:fit-content;height:100%;background:var(--contents-background-SCOPED-IN-smart-menu-ETU0)}:host .contents.menu{overflow:hidden;justify-content:flex-end}:host .contents.contents{overflow:visible;justify-content:flex-start}\n"] }]
         }], propDecorators: { isMainHidden: [{
                 type: HostBinding,
                 args: ['attr.is-main-hidden']

package/fesm2022/ng-atomic-components-frames-smart-menu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-frames-smart-menu.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/smart-menu/smart-menu.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/smart-menu/smart-menu.frame.html","../../../../../packages/@ng-atomic/components/src/lib/frames/smart-menu/ng-atomic-components-frames-smart-menu.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, ElementRef, HostBinding, Input, ViewChild } from '@angular/core';\nimport { RouterOutlet } from '@angular/router';\n\n@Component({\n  standalone: true,\n  imports: [\n    CommonModule,\n  ],\n  selector: 'frames-smart-menu',\n  templateUrl: './smart-menu.frame.html',\n  styleUrls: ['./smart-menu.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SmartMenuFrame {\n  @HostBinding('attr.is-main-hidden')\n  isMainHidden = false;\n\n  @Input()\n  label = 'root';\n\n  @Input()\n  outlet?: RouterOutlet;\n\n  @Input()\n  minNextWidth: number = 360;\n\n  @ViewChild('next', {static: true})\n  next!: ElementRef;\n\n  get page(): string {\n    const page: string = this.outlet?.activatedRouteData?.['page'];\n    return page === 'Blank' ? 'Blank' : this.isMainHidden ? `Next` : `NextWithMainPage`;\n  }\n\n}\n","<div class=\"menu\" #menu>\n  <ng-content select=\"[menu]\"></ng-content>\n</div>\n<div class=\"contents\" #contents>\n  <ng-content select=\"[contents]\"></ng-content>\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAca,cAAc,CAAA;AAV3B,IAAA,WAAA,GAAA;QAYE,IAAY,CAAA,YAAA,GAAG,KAAK,CAAC;QAGrB,IAAK,CAAA,KAAA,GAAG,MAAM,CAAC;QAMf,IAAY,CAAA,YAAA,GAAW,GAAG,CAAC;AAU5B,KAAA;AALC,IAAA,IAAI,IAAI,GAAA;QACN,MAAM,IAAI,GAAW,IAAI,CAAC,MAAM,EAAE,kBAAkB,GAAG,MAAM,CAAC,CAAC;QAC/D,OAAO,IAAI,KAAK,OAAO,GAAG,OAAO,GAAG,IAAI,CAAC,YAAY,GAAG,MAAM,GAAG,CAAA,gBAAA,CAAkB,CAAC;KACrF;+GAnBU,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;mGAAd,cAAc,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,MAAA,EAAA,QAAA,EAAA,YAAA,EAAA,cAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,qBAAA,EAAA,mBAAA,EAAA,EAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,MAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,MAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECd3B,kLAKM,EAAA,MAAA,EAAA,CAAA,+uBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDEF,YAAY,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;4FAOH,cAAc,EAAA,UAAA,EAAA,CAAA;kBAV1B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,UAAA,EAAA,IAAI,EACP,OAAA,EAAA;wBACP,YAAY;AACb,qBAAA,EAAA,QAAA,EACS,mBAAmB,EAAA,eAAA,EAGZ,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,kLAAA,EAAA,MAAA,EAAA,CAAA,+uBAAA,CAAA,EAAA,CAAA;8BAI/C,YAAY,EAAA,CAAA;sBADX,WAAW;uBAAC,qBAAqB,CAAA;gBAIlC,KAAK,EAAA,CAAA;sBADJ,KAAK;gBAIN,MAAM,EAAA,CAAA;sBADL,KAAK;gBAIN,YAAY,EAAA,CAAA;sBADX,KAAK;gBAIN,IAAI,EAAA,CAAA;sBADH,SAAS;AAAC,gBAAA,IAAA,EAAA,CAAA,MAAM,EAAE,EAAC,MAAM,EAAE,IAAI,EAAC,CAAA;;;AE3BnC;;AAEG;;;;"}
+{"version":3,"file":"ng-atomic-components-frames-smart-menu.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/smart-menu/smart-menu.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/smart-menu/smart-menu.frame.html","../../../../../packages/@ng-atomic/components/src/lib/frames/smart-menu/ng-atomic-components-frames-smart-menu.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, ElementRef, HostBinding, Input, ViewChild } from '@angular/core';\nimport { RouterOutlet } from '@angular/router';\n\n@Component({\n  standalone: true,\n  imports: [\n    CommonModule,\n  ],\n  selector: 'frames-smart-menu',\n  templateUrl: './smart-menu.frame.html',\n  styleUrls: ['./smart-menu.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class SmartMenuFrame {\n  @HostBinding('attr.is-main-hidden')\n  isMainHidden = false;\n\n  @Input()\n  label = 'root';\n\n  @Input()\n  outlet?: RouterOutlet;\n\n  @Input()\n  minNextWidth: number = 360;\n\n  @ViewChild('next', {static: true})\n  next!: ElementRef;\n\n  get page(): string {\n    const page: string = this.outlet?.activatedRouteData?.['page'];\n    return page === 'Blank' ? 'Blank' : this.isMainHidden ? `Next` : `NextWithMainPage`;\n  }\n\n}\n","<div class=\"menu\" #menu>\n  <ng-content select=\"[menu]\"></ng-content>\n</div>\n<div class=\"contents\" #contents>\n  <ng-content select=\"[contents]\"></ng-content>\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAca,cAAc,CAAA;AAV3B,IAAA,WAAA,GAAA;QAYE,IAAY,CAAA,YAAA,GAAG,KAAK,CAAC;QAGrB,IAAK,CAAA,KAAA,GAAG,MAAM,CAAC;QAMf,IAAY,CAAA,YAAA,GAAW,GAAG,CAAC;AAU5B,KAAA;AALC,IAAA,IAAI,IAAI,GAAA;QACN,MAAM,IAAI,GAAW,IAAI,CAAC,MAAM,EAAE,kBAAkB,GAAG,MAAM,CAAC,CAAC;QAC/D,OAAO,IAAI,KAAK,OAAO,GAAG,OAAO,GAAG,IAAI,CAAC,YAAY,GAAG,MAAM,GAAG,CAAA,gBAAA,CAAkB,CAAC;KACrF;8GAnBU,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;kGAAd,cAAc,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,MAAA,EAAA,QAAA,EAAA,YAAA,EAAA,cAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,qBAAA,EAAA,mBAAA,EAAA,EAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,MAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,MAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECd3B,kLAKM,EAAA,MAAA,EAAA,CAAA,+uBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDEF,YAAY,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FAOH,cAAc,EAAA,UAAA,EAAA,CAAA;kBAV1B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,UAAA,EAAA,IAAI,EACP,OAAA,EAAA;wBACP,YAAY;AACb,qBAAA,EAAA,QAAA,EACS,mBAAmB,EAAA,eAAA,EAGZ,uBAAuB,CAAC,MAAM,EAAA,QAAA,EAAA,kLAAA,EAAA,MAAA,EAAA,CAAA,+uBAAA,CAAA,EAAA,CAAA;8BAI/C,YAAY,EAAA,CAAA;sBADX,WAAW;uBAAC,qBAAqB,CAAA;gBAIlC,KAAK,EAAA,CAAA;sBADJ,KAAK;gBAIN,MAAM,EAAA,CAAA;sBADL,KAAK;gBAIN,YAAY,EAAA,CAAA;sBADX,KAAK;gBAIN,IAAI,EAAA,CAAA;sBADH,SAAS;AAAC,gBAAA,IAAA,EAAA,CAAA,MAAM,EAAE,EAAC,MAAM,EAAE,IAAI,EAAC,CAAA;;;AE3BnC;;AAEG;;;;"}

package/fesm2022/ng-atomic-components-frames-tabs.mjs

@@ -0,0 +1,48 @@
+import * as i0 from '@angular/core';
+import { Component, ChangeDetectionStrategy, ContentChildren } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i2 from '@angular/material/tabs';
+import { MatTabsModule } from '@angular/material/tabs';
+
+class TabsFrame {
+    constructor() {
+        this.tabs = [];
+    }
+    ngAfterContentInit() {
+        this.tabContents.forEach((content, index) => {
+            this.tabs.push({ content: content });
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: TabsFrame, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: TabsFrame, isStandalone: true, selector: "frames-tabs", queries: [{ propertyName: "tabContents", predicate: ["tab"] }], ngImport: i0, template: `
+    <mat-tab-group>
+      <mat-tab *ngFor="let tab of tabs; let i = index" [label]="'Tab ' + (i + 1)">
+        <ng-container *ngTemplateOutlet="tab.content"></ng-container>
+      </mat-tab>
+    </mat-tab-group>
+  `, isInline: true, styles: [":host{display:block}:host{height:100%}:host mat-tab-group{height:100%}:host mat-tab-group ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "component", type: i2.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass"], exportAs: ["matTab"] }, { kind: "component", type: i2.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: TabsFrame, decorators: [{
+            type: Component,
+            args: [{ selector: 'frames-tabs', standalone: true, imports: [
+                        CommonModule,
+                        MatTabsModule,
+                    ], template: `
+    <mat-tab-group>
+      <mat-tab *ngFor="let tab of tabs; let i = index" [label]="'Tab ' + (i + 1)">
+        <ng-container *ngTemplateOutlet="tab.content"></ng-container>
+      </mat-tab>
+    </mat-tab-group>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}:host{height:100%}:host mat-tab-group{height:100%}:host mat-tab-group ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}\n"] }]
+        }], propDecorators: { tabContents: [{
+                type: ContentChildren,
+                args: ['tab']
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { TabsFrame };
+//# sourceMappingURL=ng-atomic-components-frames-tabs.mjs.map

package/fesm2022/ng-atomic-components-frames-tabs.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ng-atomic-components-frames-tabs.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/tabs/tabs.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/tabs/ng-atomic-components-frames-tabs.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, ContentChildren, ElementRef, QueryList } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatTabsModule } from '@angular/material/tabs';\n\n@Component({\n  selector: 'frames-tabs',\n  standalone: true,\n  imports: [\n    CommonModule,\n    MatTabsModule,\n  ],\n  template: `\n    <mat-tab-group>\n      <mat-tab *ngFor=\"let tab of tabs; let i = index\" [label]=\"'Tab ' + (i + 1)\">\n        <ng-container *ngTemplateOutlet=\"tab.content\"></ng-container>\n      </mat-tab>\n    </mat-tab-group>\n  `,\n  styleUrls: ['./tabs.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class TabsFrame {\n  @ContentChildren('tab') tabContents: QueryList<ElementRef>;\n\n  tabs: any[] = [];\n\n  ngAfterContentInit() {\n    this.tabContents.forEach((content, index) => {\n      this.tabs.push({ content: content });\n    });\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;MAqBa,SAAS,CAAA;AAjBtB,IAAA,WAAA,GAAA;QAoBE,IAAI,CAAA,IAAA,GAAU,EAAE,CAAC;AAOlB,KAAA;IALC,kBAAkB,GAAA;QAChB,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,KAAK,KAAI;YAC1C,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,CAAC;AACvC,SAAC,CAAC,CAAC;KACJ;8GATU,SAAS,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAT,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,SAAS,EAVV,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,aAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,aAAA,EAAA,SAAA,EAAA,CAAA,KAAA,CAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;;;;GAMT,EATC,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,8IAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,YAAY,kUACZ,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,OAAA,EAAA,YAAA,EAAA,iBAAA,EAAA,YAAA,EAAA,WAAA,CAAA,EAAA,QAAA,EAAA,CAAA,QAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,WAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,oBAAA,EAAA,kBAAA,EAAA,eAAA,EAAA,eAAA,EAAA,gBAAA,EAAA,mBAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,iBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,qBAAA,EAAA,aAAA,EAAA,eAAA,EAAA,mBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,aAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FAYJ,SAAS,EAAA,UAAA,EAAA,CAAA;kBAjBrB,SAAS;+BACE,aAAa,EAAA,UAAA,EACX,IAAI,EACP,OAAA,EAAA;wBACP,YAAY;wBACZ,aAAa;qBACd,EACS,QAAA,EAAA,CAAA;;;;;;GAMT,EAEgB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,8IAAA,CAAA,EAAA,CAAA;8BAGvB,WAAW,EAAA,CAAA;sBAAlC,eAAe;uBAAC,KAAK,CAAA;;;ACtBxB;;AAEG;;;;"}

package/fesm2022/ng-atomic-components-frames-toggle.mjs

@@ -0,0 +1,55 @@
+import * as i0 from '@angular/core';
+import { Component, ChangeDetectionStrategy, Input } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import * as i1 from '@angular/material/button-toggle';
+import { MatButtonToggleModule } from '@angular/material/button-toggle';
+import * as i2 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import { NgAtomicComponent } from '@ng-atomic/core';
+
+class ToggleFrame extends NgAtomicComponent {
+    constructor() {
+        super(...arguments);
+        this.actions = [];
+    }
+    onChange($event) {
+        this.dispatch($event.value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToggleFrame, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: ToggleFrame, isStandalone: true, selector: "frames-toggle", inputs: { actions: "actions" }, usesInheritance: true, ngImport: i0, template: `
+    <ng-content />
+    <mat-button-toggle-group #group="matButtonToggleGroup" (change)="onChange($event)">
+      @for (action of actions; track action.id) {
+        <mat-button-toggle [value]="action">
+          <mat-icon>{{ action.icon }}</mat-icon>
+        </mat-button-toggle>
+      }
+    </mat-button-toggle-group>
+  `, isInline: true, styles: [":host{position:relative;display:contents}:host mat-button-toggle-group{position:absolute;bottom:8px;left:16px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ToggleFrame, decorators: [{
+            type: Component,
+            args: [{ selector: 'frames-toggle', standalone: true, imports: [
+                        CommonModule,
+                        MatButtonToggleModule,
+                        MatIconModule,
+                    ], template: `
+    <ng-content />
+    <mat-button-toggle-group #group="matButtonToggleGroup" (change)="onChange($event)">
+      @for (action of actions; track action.id) {
+        <mat-button-toggle [value]="action">
+          <mat-icon>{{ action.icon }}</mat-icon>
+        </mat-button-toggle>
+      }
+    </mat-button-toggle-group>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{position:relative;display:contents}:host mat-button-toggle-group{position:absolute;bottom:8px;left:16px}\n"] }]
+        }], propDecorators: { actions: [{
+                type: Input
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ToggleFrame };
+//# sourceMappingURL=ng-atomic-components-frames-toggle.mjs.map

package/fesm2022/ng-atomic-components-frames-toggle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ng-atomic-components-frames-toggle.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/toggle/toggle.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/toggle/ng-atomic-components-frames-toggle.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatButtonToggleChange, MatButtonToggleModule } from '@angular/material/button-toggle';\nimport { MatIconModule } from '@angular/material/icon';\nimport { SelectionModel } from '@angular/cdk/collections';\nimport { Action, NgAtomicComponent } from '@ng-atomic/core';\n\n@Component({\n  selector: 'frames-toggle',\n  standalone: true,\n  imports: [\n    CommonModule,\n    MatButtonToggleModule,\n    MatIconModule,\n  ],\n  template: `\n    <ng-content />\n    <mat-button-toggle-group #group=\"matButtonToggleGroup\" (change)=\"onChange($event)\">\n      @for (action of actions; track action.id) {\n        <mat-button-toggle [value]=\"action\">\n          <mat-icon>{{ action.icon }}</mat-icon>\n        </mat-button-toggle>\n      }\n    </mat-button-toggle-group>\n  `,\n  styleUrls: ['./toggle.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class ToggleFrame extends NgAtomicComponent {\n  @Input() actions: Action[] = [];\n\n  protected onChange($event: MatButtonToggleChange) {\n    this.dispatch($event.value);\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;AA4BM,MAAO,WAAY,SAAQ,iBAAiB,CAAA;AArBlD,IAAA,WAAA,GAAA;;QAsBW,IAAO,CAAA,OAAA,GAAa,EAAE,CAAC;AAKjC,KAAA;AAHW,IAAA,QAAQ,CAAC,MAA6B,EAAA;AAC9C,QAAA,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;KAC7B;8GALU,WAAW,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAX,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,WAAW,EAbZ,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;;;;;;;AAST,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,kHAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAbC,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACZ,qBAAqB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,yBAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,MAAA,EAAA,UAAA,EAAA,OAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,aAAA,EAAA,QAAA,CAAA,EAAA,QAAA,EAAA,CAAA,sBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,MAAA,EAAA,OAAA,EAAA,UAAA,EAAA,eAAA,EAAA,YAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,QAAA,CAAA,EAAA,QAAA,EAAA,CAAA,iBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACrB,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FAeJ,WAAW,EAAA,UAAA,EAAA,CAAA;kBArBvB,SAAS;+BACE,eAAe,EAAA,UAAA,EACb,IAAI,EACP,OAAA,EAAA;wBACP,YAAY;wBACZ,qBAAqB;wBACrB,aAAa;qBACd,EACS,QAAA,EAAA,CAAA;;;;;;;;;GAST,EAEgB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,kHAAA,CAAA,EAAA,CAAA;8BAGtC,OAAO,EAAA,CAAA;sBAAf,KAAK;;;AC7BR;;AAEG;;;;"}

package/fesm2022/ng-atomic-components-frames-vertical-hide.mjs

@@ -7,13 +7,13 @@ class VerticalHideFrame {
     constructor() {
         this.mode = 'collapsed';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: VerticalHideFrame, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: VerticalHideFrame, isStandalone: true, selector: "frames-vertical-hide", inputs: { mode: "mode" }, host: { properties: { "attr.mode": "this.mode" } }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: VerticalHideFrame, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: VerticalHideFrame, isStandalone: true, selector: "frames-vertical-hide", inputs: { mode: "mode" }, host: { properties: { "attr.mode": "this.mode" } }, ngImport: i0, template: `
     <ng-content></ng-content>
     <organisms-vertical-divider></organisms-vertical-divider>
-  `, isInline: true, styles: [":host{--collapsed-height: 200px;--collapsed-height-SCOPED-IN-vertical-hide-NbeI: var(--collapsed-height);--expanded-height: 400px;--expanded-height-SCOPED-IN-vertical-hide-NbeI: var(--expanded-height)}:host{position:relative;display:block;transition:.5s height}:host organisms-vertical-divider{position:absolute;bottom:0;width:100%}:host[mode=collapsed]{height:var(--collapsed-height-SCOPED-IN-vertical-hide-NbeI)}:host[mode=expanded]{height:var(--expanded-height-SCOPED-IN-vertical-hide-NbeI)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: VerticalDividerOrganism, selector: "organisms-vertical-divider" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, styles: [":host{--collapsed-height: 200px;--collapsed-height-SCOPED-IN-vertical-hide-hYta: var(--collapsed-height);--expanded-height: 400px;--expanded-height-SCOPED-IN-vertical-hide-hYta: var(--expanded-height)}:host{position:relative;display:block;transition:.5s height}:host organisms-vertical-divider{position:absolute;bottom:0;width:100%}:host[mode=collapsed]{height:var(--collapsed-height-SCOPED-IN-vertical-hide-hYta)}:host[mode=expanded]{height:var(--expanded-height-SCOPED-IN-vertical-hide-hYta)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: VerticalDividerOrganism, selector: "organisms-vertical-divider" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: VerticalHideFrame, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: VerticalHideFrame, decorators: [{
             type: Component,
             args: [{ selector: 'frames-vertical-hide', standalone: true, imports: [
                         CommonModule,
@@ -21,7 +21,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                     ], template: `
     <ng-content></ng-content>
     <organisms-vertical-divider></organisms-vertical-divider>
-  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--collapsed-height: 200px;--collapsed-height-SCOPED-IN-vertical-hide-NbeI: var(--collapsed-height);--expanded-height: 400px;--expanded-height-SCOPED-IN-vertical-hide-NbeI: var(--expanded-height)}:host{position:relative;display:block;transition:.5s height}:host organisms-vertical-divider{position:absolute;bottom:0;width:100%}:host[mode=collapsed]{height:var(--collapsed-height-SCOPED-IN-vertical-hide-NbeI)}:host[mode=expanded]{height:var(--expanded-height-SCOPED-IN-vertical-hide-NbeI)}\n"] }]
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--collapsed-height: 200px;--collapsed-height-SCOPED-IN-vertical-hide-hYta: var(--collapsed-height);--expanded-height: 400px;--expanded-height-SCOPED-IN-vertical-hide-hYta: var(--expanded-height)}:host{position:relative;display:block;transition:.5s height}:host organisms-vertical-divider{position:absolute;bottom:0;width:100%}:host[mode=collapsed]{height:var(--collapsed-height-SCOPED-IN-vertical-hide-hYta)}:host[mode=expanded]{height:var(--expanded-height-SCOPED-IN-vertical-hide-hYta)}\n"] }]
         }], propDecorators: { mode: [{
                 type: Input
             }, {

package/fesm2022/ng-atomic-components-frames-vertical-hide.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-frames-vertical-hide.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/vertical-hide/vertical-hide.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/vertical-hide/ng-atomic-components-frames-vertical-hide.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, HostBinding, Input } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { VerticalDividerOrganism } from '@ng-atomic/components/organisms/vertical-divider';\n\n@Component({\n  selector: 'frames-vertical-hide',\n  standalone: true,\n  imports: [\n    CommonModule,\n    VerticalDividerOrganism,\n  ],\n  template: `\n    <ng-content></ng-content>\n    <organisms-vertical-divider></organisms-vertical-divider>\n  `,\n  styleUrls: ['./vertical-hide.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class VerticalHideFrame {\n\n  @Input()\n  @HostBinding('attr.mode')\n  mode: 'collapsed' | 'expanded' = 'collapsed';\n\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAkBa,iBAAiB,CAAA;AAd9B,IAAA,WAAA,GAAA;QAkBE,IAAI,CAAA,IAAA,GAA6B,WAAW,CAAC;AAE9C,KAAA;+GANY,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAjB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,iBAAiB,EAPlB,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,WAAA,EAAA,WAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;GAGT,EANC,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,kfAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,YAAY,+BACZ,uBAAuB,EAAA,QAAA,EAAA,4BAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;4FASd,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAd7B,SAAS;+BACE,sBAAsB,EAAA,UAAA,EACpB,IAAI,EACP,OAAA,EAAA;wBACP,YAAY;wBACZ,uBAAuB;qBACxB,EACS,QAAA,EAAA,CAAA;;;GAGT,EAEgB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,kfAAA,CAAA,EAAA,CAAA;8BAM/C,IAAI,EAAA,CAAA;sBAFH,KAAK;;sBACL,WAAW;uBAAC,WAAW,CAAA;;;ACrB1B;;AAEG;;;;"}
+{"version":3,"file":"ng-atomic-components-frames-vertical-hide.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/vertical-hide/vertical-hide.frame.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/vertical-hide/ng-atomic-components-frames-vertical-hide.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, HostBinding, Input } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { VerticalDividerOrganism } from '@ng-atomic/components/organisms/vertical-divider';\n\n@Component({\n  selector: 'frames-vertical-hide',\n  standalone: true,\n  imports: [\n    CommonModule,\n    VerticalDividerOrganism,\n  ],\n  template: `\n    <ng-content></ng-content>\n    <organisms-vertical-divider></organisms-vertical-divider>\n  `,\n  styleUrls: ['./vertical-hide.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class VerticalHideFrame {\n\n  @Input()\n  @HostBinding('attr.mode')\n  mode: 'collapsed' | 'expanded' = 'collapsed';\n\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAkBa,iBAAiB,CAAA;AAd9B,IAAA,WAAA,GAAA;QAkBE,IAAI,CAAA,IAAA,GAA6B,WAAW,CAAC;AAE9C,KAAA;8GANY,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAjB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,iBAAiB,EAPlB,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,WAAA,EAAA,WAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;GAGT,EANC,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,kfAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,YAAY,+BACZ,uBAAuB,EAAA,QAAA,EAAA,4BAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FASd,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAd7B,SAAS;+BACE,sBAAsB,EAAA,UAAA,EACpB,IAAI,EACP,OAAA,EAAA;wBACP,YAAY;wBACZ,uBAAuB;qBACxB,EACS,QAAA,EAAA,CAAA;;;GAGT,EAEgB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,kfAAA,CAAA,EAAA,CAAA;8BAM/C,IAAI,EAAA,CAAA;sBAFH,KAAK;;sBACL,WAAW;uBAAC,WAAW,CAAA;;;ACrB1B;;AAEG;;;;"}