@ng-atomic/components 18.2.0 → 18.4.0

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

@@ -1,12 +1,11 @@
 import { __decorate } from 'tslib';
-import { NgTemplateOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
 import { signal, input, Directive, HostBinding, inject, Component, ChangeDetectionStrategy } from '@angular/core';
+import { NgTemplateOutlet } from '@angular/common';
 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, _computed, TokenizedType, NgAtomicComponent } from '@ng-atomic/core';
-import { IconButtonMenuTemplateStore } from '@ng-atomic/components/templates/icon-button-menu';
 
 var SideNavFrameStore_1;
 function injectSideNavMode() {
@@ -17,6 +16,7 @@ let SideNavFrameStore = class SideNavFrameStore extends InjectableComponent {
         super(...arguments);
         this.config = SideNavFrameStore_1.Config.inject();
         this.actions = input(_computed(() => this.config().actions));
+        this.bottomActions = input(_computed(() => this.config().bottomActions));
         this.menuType = input(_computed(() => this.config().menuType));
         this.menuTitle = input(_computed(() => this.config().menuTitle));
         this.mode = input(_computed(() => this.config().mode));
@@ -46,6 +46,7 @@ let SideNavFrameStore = class SideNavFrameStore extends InjectableComponent {
     static { this.Config = makeConfig(() => {
         return (context) => ({
             actions: [],
+            bottomActions: [],
             menuType: SideNavFrameStore_1.getMenuType(context),
             menuTitle: undefined,
             mode: SideNavFrameStore_1.getMode(context),
@@ -56,7 +57,7 @@ let SideNavFrameStore = class SideNavFrameStore extends InjectableComponent {
         return this.frameType();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SideNavFrameStore, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.1.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 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.1.2", type: SideNavFrameStore, isStandalone: true, selector: "frames-side-nav", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, bottomActions: { classPropertyName: "bottomActions", publicName: "bottomActions", 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()
@@ -74,17 +75,18 @@ class SideNavFrame extends NgAtomicComponent {
         this.store = inject(SideNavFrameStore);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SideNavFrame, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.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: `
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.2", type: SideNavFrame, isStandalone: true, selector: "frames-side-nav", usesInheritance: true, hostDirectives: [{ directive: SideNavFrameStore, inputs: ["actions", "actions", "bottomActions", "bottomActions", "menuType", "menuType", "menuTitle", "menuTitle", "mode", "mode", "frameType", "frameType"] }], ngImport: i0, template: `
   @switch (store.frameType()) {
     @case ('drawer') {
-      @defer {
+      <!-- @defer { -->
         <frames-drawer [opened]="store.mode() === 'expanded'">
           <ng-container *ngTemplateOutlet="menu" drawer/>
           <ng-container *ngTemplateOutlet="contents" contents/>
         </frames-drawer>
-      }
+      <!-- } -->
     }
     @default {
+      <!-- @MEMO(NozomuMiyamoto): @deferを消すとDuplicate argument name "NgTemplateOutlet"になる -->
       <!-- @defer { -->
         <frames-line-up [hasNext]="true" [scope]="'nav'">
           <ng-container *ngTemplateOutlet="menu" main/>
@@ -97,28 +99,29 @@ class SideNavFrame extends NgAtomicComponent {
   <ng-template #menu>
     @switch (store.menuType()) {
       @case ('icon-button-menu') {
-        <!-- @defer { -->
+        @defer {
           <templates-icon-button-menu injectable
             [actions]="store.actions()"
+            [bottomActions]="store.bottomActions()"
             (action)="dispatch($event)"
           />
-        <!-- } -->
+        }
       }
       @default {
-        <!-- @defer { -->
+        @defer {
           <templates-menu injectable
             [title]="store.menuTitle()"
             [actions]="store.actions()"
             (action)="dispatch($event)"
           />
-        <!-- } -->
+        }
       }
     }
   </ng-template>
   <ng-template #contents><ng-content/></ng-template>
-  `, isInline: true, styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-side-nav-fHz9: var(--primary-color);--secondary-color: #B0B0B0;--secondary-color-SCOPED-IN-side-nav-fHz9: var(--secondary-color);--background-color: #B0B0B0;--background-color-SCOPED-IN-side-nav-fHz9: var(--background-color);--on-background-color: #f0f0f0;--on-background-color-SCOPED-IN-side-nav-fHz9: var(--on-background-color);--surface-color: transparent;--surface-color-SCOPED-IN-side-nav-fHz9: var(--surface-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-side-nav-fHz9: var(--on-primary-color);--on-surface-color: #f0f0f0;--on-surface-color-SCOPED-IN-side-nav-fHz9: var(--on-surface-color);--menu-width: 220px;--menu-width-SCOPED-IN-side-nav-fHz9: var(--menu-width);--menu-background-color: var(--primary-color-SCOPED-IN-side-nav-fHz9);--menu-background-color-SCOPED-IN-side-nav-fHz9: var(--menu-background-color);--menu-on-background-color: var(--on-primary-color-SCOPED-IN-side-nav-fHz9);--menu-on-background-color-SCOPED-IN-side-nav-fHz9: var(--menu-on-background-color)}:host{display:block;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-side-nav-fHz9);--secondary-color: var(--secondary-color-SCOPED-IN-side-nav-fHz9);--surface-color: var(--surface-color-SCOPED-IN-side-nav-fHz9);--background-color: var(--background-color-SCOPED-IN-side-nav-fHz9);--on-background-color: var(--on-background-color-SCOPED-IN-side-nav-fHz9);--on-primary-color: var(--on-primary-color-SCOPED-IN-side-nav-fHz9);--on-surface-color: var(--on-surface-color-SCOPED-IN-side-nav-fHz9)}:host .content{width:100%;height:100%}:host templates-icon-button-menu,:host templates-menu{width:var(--menu-width-SCOPED-IN-side-nav-fHz9);--background-color: var(--menu-background-color-SCOPED-IN-side-nav-fHz9);--on-background-color: var(--menu-on-background-color-SCOPED-IN-side-nav-fHz9)}:host[frame=lineup] .content{width:calc(100vw - var(--menu-width-SCOPED-IN-side-nav-fHz9));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, deferBlockDependencies: [() => [NgTemplateOutlet, import('@ng-atomic/components/frames/drawer').then(m => m.DrawerFrame)]] }); }
+  `, isInline: true, styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-side-nav-gW9A: var(--primary-color);--secondary-color: #B0B0B0;--secondary-color-SCOPED-IN-side-nav-gW9A: var(--secondary-color);--background-color: #B0B0B0;--background-color-SCOPED-IN-side-nav-gW9A: var(--background-color);--on-background-color: #f0f0f0;--on-background-color-SCOPED-IN-side-nav-gW9A: var(--on-background-color);--surface-color: transparent;--surface-color-SCOPED-IN-side-nav-gW9A: var(--surface-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-side-nav-gW9A: var(--on-primary-color);--on-surface-color: #f0f0f0;--on-surface-color-SCOPED-IN-side-nav-gW9A: var(--on-surface-color);--menu-width: 220px;--menu-width-SCOPED-IN-side-nav-gW9A: var(--menu-width);--menu-background-color: var(--primary-color-SCOPED-IN-side-nav-gW9A);--menu-background-color-SCOPED-IN-side-nav-gW9A: var(--menu-background-color);--menu-on-background-color: var(--on-primary-color-SCOPED-IN-side-nav-gW9A);--menu-on-background-color-SCOPED-IN-side-nav-gW9A: var(--menu-on-background-color)}:host{display:block;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-side-nav-gW9A);--secondary-color: var(--secondary-color-SCOPED-IN-side-nav-gW9A);--surface-color: var(--surface-color-SCOPED-IN-side-nav-gW9A);--background-color: var(--background-color-SCOPED-IN-side-nav-gW9A);--on-background-color: var(--on-background-color-SCOPED-IN-side-nav-gW9A);--on-primary-color: var(--on-primary-color-SCOPED-IN-side-nav-gW9A);--on-surface-color: var(--on-surface-color-SCOPED-IN-side-nav-gW9A)}:host .content{width:100%;height:100%}:host templates-icon-button-menu,:host templates-menu{width:var(--menu-width-SCOPED-IN-side-nav-gW9A);--background-color: var(--menu-background-color-SCOPED-IN-side-nav-gW9A);--on-background-color: var(--menu-on-background-color-SCOPED-IN-side-nav-gW9A)}:host[frame=lineup] .content{width:calc(100vw - var(--menu-width-SCOPED-IN-side-nav-gW9A));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: DrawerFrame, selector: "frames-drawer" }, { kind: "component", type: LineUpFrame, selector: "frames-line-up" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, deferBlockDependencies: [() => [import('@ng-atomic/components/templates/icon-button-menu').then(m => m.IconButtonMenuTemplateStore)], () => [import('@ng-atomic/components/templates/menu').then(m => m.MenuTemplateStore)]] }); }
 }
-i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "18.1.2", ngImport: i0, type: SideNavFrame, resolveDeferredDeps: () => [import('@ng-atomic/components/frames/drawer').then(m => m.DrawerFrame)], resolveMetadata: DrawerFrame => ({ decorators: [{
+i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "18.1.2", ngImport: i0, type: SideNavFrame, resolveDeferredDeps: () => [import('@ng-atomic/components/templates/icon-button-menu').then(m => m.IconButtonMenuTemplateStore), import('@ng-atomic/components/templates/menu').then(m => m.MenuTemplateStore)], resolveMetadata: (IconButtonMenuTemplateStore, MenuTemplateStore) => ({ decorators: [{
                 type: Component,
                 args: [{ standalone: true, imports: [
                             NgTemplateOutlet,
@@ -129,14 +132,15 @@ i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "18.1.2", ng
                         ], selector: 'frames-side-nav', template: `
   @switch (store.frameType()) {
     @case ('drawer') {
-      @defer {
+      <!-- @defer { -->
         <frames-drawer [opened]="store.mode() === 'expanded'">
           <ng-container *ngTemplateOutlet="menu" drawer/>
           <ng-container *ngTemplateOutlet="contents" contents/>
         </frames-drawer>
-      }
+      <!-- } -->
     }
     @default {
+      <!-- @MEMO(NozomuMiyamoto): @deferを消すとDuplicate argument name "NgTemplateOutlet"になる -->
       <!-- @defer { -->
         <frames-line-up [hasNext]="true" [scope]="'nav'">
           <ng-container *ngTemplateOutlet="menu" main/>
@@ -149,21 +153,22 @@ i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "18.1.2", ng
   <ng-template #menu>
     @switch (store.menuType()) {
       @case ('icon-button-menu') {
-        <!-- @defer { -->
+        @defer {
           <templates-icon-button-menu injectable
             [actions]="store.actions()"
+            [bottomActions]="store.bottomActions()"
             (action)="dispatch($event)"
           />
-        <!-- } -->
+        }
       }
       @default {
-        <!-- @defer { -->
+        @defer {
           <templates-menu injectable
             [title]="store.menuTitle()"
             [actions]="store.actions()"
             (action)="dispatch($event)"
           />
-        <!-- } -->
+        }
       }
     }
   </ng-template>
@@ -173,13 +178,14 @@ i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "18.1.2", ng
                                 directive: SideNavFrameStore,
                                 inputs: [
                                     'actions',
+                                    'bottomActions',
                                     'menuType',
                                     'menuTitle',
                                     'mode',
                                     'frameType',
                                 ],
                             },
-                        ], styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-side-nav-fHz9: var(--primary-color);--secondary-color: #B0B0B0;--secondary-color-SCOPED-IN-side-nav-fHz9: var(--secondary-color);--background-color: #B0B0B0;--background-color-SCOPED-IN-side-nav-fHz9: var(--background-color);--on-background-color: #f0f0f0;--on-background-color-SCOPED-IN-side-nav-fHz9: var(--on-background-color);--surface-color: transparent;--surface-color-SCOPED-IN-side-nav-fHz9: var(--surface-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-side-nav-fHz9: var(--on-primary-color);--on-surface-color: #f0f0f0;--on-surface-color-SCOPED-IN-side-nav-fHz9: var(--on-surface-color);--menu-width: 220px;--menu-width-SCOPED-IN-side-nav-fHz9: var(--menu-width);--menu-background-color: var(--primary-color-SCOPED-IN-side-nav-fHz9);--menu-background-color-SCOPED-IN-side-nav-fHz9: var(--menu-background-color);--menu-on-background-color: var(--on-primary-color-SCOPED-IN-side-nav-fHz9);--menu-on-background-color-SCOPED-IN-side-nav-fHz9: var(--menu-on-background-color)}:host{display:block;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-side-nav-fHz9);--secondary-color: var(--secondary-color-SCOPED-IN-side-nav-fHz9);--surface-color: var(--surface-color-SCOPED-IN-side-nav-fHz9);--background-color: var(--background-color-SCOPED-IN-side-nav-fHz9);--on-background-color: var(--on-background-color-SCOPED-IN-side-nav-fHz9);--on-primary-color: var(--on-primary-color-SCOPED-IN-side-nav-fHz9);--on-surface-color: var(--on-surface-color-SCOPED-IN-side-nav-fHz9)}:host .content{width:100%;height:100%}:host templates-icon-button-menu,:host templates-menu{width:var(--menu-width-SCOPED-IN-side-nav-fHz9);--background-color: var(--menu-background-color-SCOPED-IN-side-nav-fHz9);--on-background-color: var(--menu-on-background-color-SCOPED-IN-side-nav-fHz9)}:host[frame=lineup] .content{width:calc(100vw - var(--menu-width-SCOPED-IN-side-nav-fHz9));overflow:hidden}:host[frame=drawer] .menu,:host[frame=drawer] templates-menu{width:300px}\n"] }]
+                        ], styles: [":host{--primary-color: #404040;--primary-color-SCOPED-IN-side-nav-gW9A: var(--primary-color);--secondary-color: #B0B0B0;--secondary-color-SCOPED-IN-side-nav-gW9A: var(--secondary-color);--background-color: #B0B0B0;--background-color-SCOPED-IN-side-nav-gW9A: var(--background-color);--on-background-color: #f0f0f0;--on-background-color-SCOPED-IN-side-nav-gW9A: var(--on-background-color);--surface-color: transparent;--surface-color-SCOPED-IN-side-nav-gW9A: var(--surface-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-side-nav-gW9A: var(--on-primary-color);--on-surface-color: #f0f0f0;--on-surface-color-SCOPED-IN-side-nav-gW9A: var(--on-surface-color);--menu-width: 220px;--menu-width-SCOPED-IN-side-nav-gW9A: var(--menu-width);--menu-background-color: var(--primary-color-SCOPED-IN-side-nav-gW9A);--menu-background-color-SCOPED-IN-side-nav-gW9A: var(--menu-background-color);--menu-on-background-color: var(--on-primary-color-SCOPED-IN-side-nav-gW9A);--menu-on-background-color-SCOPED-IN-side-nav-gW9A: var(--menu-on-background-color)}:host{display:block;width:100%;height:100%}:host *{--primary-color: var(--primary-color-SCOPED-IN-side-nav-gW9A);--secondary-color: var(--secondary-color-SCOPED-IN-side-nav-gW9A);--surface-color: var(--surface-color-SCOPED-IN-side-nav-gW9A);--background-color: var(--background-color-SCOPED-IN-side-nav-gW9A);--on-background-color: var(--on-background-color-SCOPED-IN-side-nav-gW9A);--on-primary-color: var(--on-primary-color-SCOPED-IN-side-nav-gW9A);--on-surface-color: var(--on-surface-color-SCOPED-IN-side-nav-gW9A)}:host .content{width:100%;height:100%}:host templates-icon-button-menu,:host templates-menu{width:var(--menu-width-SCOPED-IN-side-nav-gW9A);--background-color: var(--menu-background-color-SCOPED-IN-side-nav-gW9A);--on-background-color: var(--menu-on-background-color-SCOPED-IN-side-nav-gW9A)}:host[frame=lineup] .content{width:calc(100vw - var(--menu-width-SCOPED-IN-side-nav-gW9A));overflow:hidden}:host[frame=drawer] .menu,:host[frame=drawer] templates-menu{width:300px}\n"] }]
             }], ctorParameters: null, propDecorators: null }) });
 
 /**

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 { NgTemplateOutlet } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Directive, HostBinding, WritableSignal, inject, input, signal } from '@angular/core';\nimport { Breakpoint } from '@ng-atomic/common/services/breakpoint';\nimport { makeConfig, UIContext } 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 getMode = (context: UIContext) => {\n    switch (context.breakpoint) {\n      case 'xSmall': return 'collapsed';\n      default: return 'expanded';\n    }\n  };\n\n  static getFrameType = (context: UIContext): 'lineup' | 'drawer' => {\n    switch (context.breakpoint) {\n      case 'xSmall': return 'drawer';\n      default: return 'lineup';\n    }\n  };\n\n  static getMenuType = (context: UIContext): 'menu' | 'icon-button-menu' => {\n    switch (context.breakpoint) {\n      case 'xSmall': return 'menu';\n      case 'small':\n      case 'medium': return 'icon-button-menu';\n      default: return 'menu';\n    }\n  };\n\n  static readonly Config = makeConfig(() => {\n    return (context) => ({\n      actions: [],\n      menuType: SideNavFrameStore.getMenuType(context),\n      menuTitle: undefined as string,\n      mode: SideNavFrameStore.getMode(context),\n      frameType: SideNavFrameStore.getFrameType(context),\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: [\n        'actions',\n        'menuType',\n        'menuTitle',\n        'mode',\n        'frameType',\n      ],\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 { ChangeDetectionStrategy, Component, Directive, HostBinding, WritableSignal, inject, input, signal } from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { makeConfig, UIContext } 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 getMode = (context: UIContext) => {\n    switch (context.breakpoint) {\n      case 'xSmall': return 'collapsed';\n      default: return 'expanded';\n    }\n  };\n\n  static getFrameType = (context: UIContext): 'lineup' | 'drawer' => {\n    switch (context.breakpoint) {\n      case 'xSmall': return 'drawer';\n      default: return 'lineup';\n    }\n  };\n\n  static getMenuType = (context: UIContext): 'menu' | 'icon-button-menu' => {\n    switch (context.breakpoint) {\n      case 'xSmall': return 'menu';\n      case 'small':\n      case 'medium': return 'icon-button-menu';\n      default: return 'menu';\n    }\n  };\n\n  static readonly Config = makeConfig(() => {\n    return (context) => ({\n      actions: [],\n      bottomActions: [],\n      menuType: SideNavFrameStore.getMenuType(context),\n      menuTitle: undefined as string,\n      mode: SideNavFrameStore.getMode(context),\n      frameType: SideNavFrameStore.getFrameType(context),\n    });\n  }, ['components', 'frames', 'sideNav']);\n\n  readonly config = SideNavFrameStore.Config.inject();\n  readonly actions = input(_computed(() => this.config().actions));\n  readonly bottomActions = input(_computed(() => this.config().bottomActions));\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      <!-- @MEMO(NozomuMiyamoto): @deferを消すとDuplicate argument name \"NgTemplateOutlet\"になる -->\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            [bottomActions]=\"store.bottomActions()\"\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: [\n        'actions',\n        'bottomActions',\n        'menuType',\n        'menuTitle',\n        'mode',\n        'frameType',\n      ],\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

@@ -14,13 +14,13 @@ class SmartMenuFrame {
         return page === 'Blank' ? 'Blank' : this.isMainHidden ? `Next` : `NextWithMainPage`;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SmartMenuFrame, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.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-TzZW: var(--gap);--background: #ccc;--background-SCOPED-IN-smart-menu-TzZW: var(--background);--contents-background: transparent;--contents-background-SCOPED-IN-smart-menu-TzZW: var(--contents-background)}:host{position:relative;display:flex;justify-content:flex-start;gap:var(--gap-SCOPED-IN-smart-menu-TzZW);width:fit-content;height:100%;background:var(--background-SCOPED-IN-smart-menu-TzZW)}:host .contents{display:flex;max-width:fit-content;height:100%;background:var(--contents-background-SCOPED-IN-smart-menu-TzZW)}: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.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.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-fHPM: var(--gap);--background: #ccc;--background-SCOPED-IN-smart-menu-fHPM: var(--background);--contents-background: transparent;--contents-background-SCOPED-IN-smart-menu-fHPM: var(--contents-background)}:host{position:relative;display:flex;justify-content:flex-start;gap:var(--gap-SCOPED-IN-smart-menu-fHPM);width:fit-content;height:100%;background:var(--background-SCOPED-IN-smart-menu-fHPM)}:host .contents{display:flex;max-width:fit-content;height:100%;background:var(--contents-background-SCOPED-IN-smart-menu-fHPM)}: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: "18.1.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-TzZW: var(--gap);--background: #ccc;--background-SCOPED-IN-smart-menu-TzZW: var(--background);--contents-background: transparent;--contents-background-SCOPED-IN-smart-menu-TzZW: var(--contents-background)}:host{position:relative;display:flex;justify-content:flex-start;gap:var(--gap-SCOPED-IN-smart-menu-TzZW);width:fit-content;height:100%;background:var(--background-SCOPED-IN-smart-menu-TzZW)}:host .contents{display:flex;max-width:fit-content;height:100%;background:var(--contents-background-SCOPED-IN-smart-menu-TzZW)}: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-fHPM: var(--gap);--background: #ccc;--background-SCOPED-IN-smart-menu-fHPM: var(--background);--contents-background: transparent;--contents-background-SCOPED-IN-smart-menu-fHPM: var(--contents-background)}:host{position:relative;display:flex;justify-content:flex-start;gap:var(--gap-SCOPED-IN-smart-menu-fHPM);width:fit-content;height:100%;background:var(--background-SCOPED-IN-smart-menu-fHPM)}:host .contents{display:flex;max-width:fit-content;height:100%;background:var(--contents-background-SCOPED-IN-smart-menu-fHPM)}: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-tabs.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Component, ChangeDetectionStrategy, ContentChildren } from '@angular/core';
+import { input, Component, ChangeDetectionStrategy, ContentChildren } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i2 from '@angular/material/tabs';
@@ -7,21 +7,25 @@ import { MatTabsModule } from '@angular/material/tabs';
 
 class TabsFrame {
     constructor() {
+        this.labels = input([]);
         this.tabs = [];
     }
     ngAfterContentInit() {
         this.tabContents.forEach((content, index) => {
             this.tabs.push({ content: content });
         });
+        console.debug('tabs', this.tabs);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: TabsFrame, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.2", type: TabsFrame, isStandalone: true, selector: "frames-tabs", queries: [{ propertyName: "tabContents", predicate: ["tab"] }], ngImport: i0, template: `
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.2", type: TabsFrame, isStandalone: true, selector: "frames-tabs", inputs: { labels: { classPropertyName: "labels", publicName: "labels", isSignal: true, isRequired: false, transformFunction: null } }, 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)">
+      @for(tab of tabs; track $index; let i = $index) {
+        <mat-tab [label]="labels()?.[i] ?? '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 }); }
+  `, isInline: true, styles: [":host{display:block}:host{display:contents}:host mat-tab-group{width:100%;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.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: "18.1.2", ngImport: i0, type: TabsFrame, decorators: [{
             type: Component,
@@ -30,11 +34,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImpor
                         MatTabsModule,
                     ], template: `
     <mat-tab-group>
-      <mat-tab *ngFor="let tab of tabs; let i = index" [label]="'Tab ' + (i + 1)">
+      @for(tab of tabs; track $index; let i = $index) {
+        <mat-tab [label]="labels()?.[i] ?? '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"] }]
+  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}:host{display:contents}:host mat-tab-group{width:100%;height:100%}:host mat-tab-group ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}\n"] }]
         }], propDecorators: { tabContents: [{
                 type: ContentChildren,
                 args: ['tab']

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

@@ -1 +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, AfterContentInit } 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 implements AfterContentInit {\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;;;;"}
+{"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, AfterContentInit, input } 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      @for(tab of tabs; track $index; let i = $index) {\n        <mat-tab [label]=\"labels()?.[i] ?? 'Tab ' + (i + 1)\">\n        <ng-container *ngTemplateOutlet=\"tab.content\"></ng-container>\n      </mat-tab>\n      }\n    </mat-tab-group>\n  `,\n  styleUrls: ['./tabs.frame.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class TabsFrame implements AfterContentInit {\n  @ContentChildren('tab') tabContents: QueryList<ElementRef>;\n  protected readonly labels = input<string[]>([]);\n  tabs: any[] = [];\n\n  ngAfterContentInit() {\n    this.tabContents.forEach((content, index) => {\n      this.tabs.push({ content: content });\n    });\n    console.debug('tabs', this.tabs);\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;MAuBa,SAAS,CAAA;AAnBtB,IAAA,WAAA,GAAA;AAqBqB,QAAA,IAAA,CAAA,MAAM,GAAG,KAAK,CAAW,EAAE,CAAC,CAAC;QAChD,IAAI,CAAA,IAAA,GAAU,EAAE,CAAC;AAQlB,KAAA;IANC,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;QACH,OAAO,CAAC,KAAK,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;KAClC;8GAVU,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,EAZV,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,aAAA,EAAA,SAAA,EAAA,CAAA,KAAA,CAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;;;;;;GAQT,EAXC,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,8JAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,YAAY,qMACZ,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;;2FAcJ,SAAS,EAAA,UAAA,EAAA,CAAA;kBAnBrB,SAAS;+BACE,aAAa,EAAA,UAAA,EACX,IAAI,EACP,OAAA,EAAA;wBACP,YAAY;wBACZ,aAAa;qBACd,EACS,QAAA,EAAA,CAAA;;;;;;;;GAQT,EAEgB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,8JAAA,CAAA,EAAA,CAAA;8BAGvB,WAAW,EAAA,CAAA;sBAAlC,eAAe;uBAAC,KAAK,CAAA;;;ACxBxB;;AAEG;;;;"}

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

@@ -1,33 +1,26 @@
 import * as i0 from '@angular/core';
-import { Component, ChangeDetectionStrategy, Input, HostBinding } from '@angular/core';
-import { CommonModule } from '@angular/common';
+import { input, Component, ChangeDetectionStrategy } from '@angular/core';
 import { VerticalDividerOrganism } from '@ng-atomic/components/organisms/vertical-divider';
 
 class VerticalHideFrame {
     constructor() {
-        this.mode = 'collapsed';
+        this.mode = input('expanded');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: VerticalHideFrame, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.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-pVzz: var(--collapsed-height);--expanded-height: 400px;--expanded-height-SCOPED-IN-vertical-hide-pVzz: 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-pVzz)}:host[mode=expanded]{height:var(--expanded-height-SCOPED-IN-vertical-hide-pVzz)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: VerticalDividerOrganism, selector: "organisms-vertical-divider" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.1.2", type: VerticalHideFrame, isStandalone: true, selector: "frames-vertical-hide", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.mode": "mode()" } }, ngImport: i0, template: `
+    <ng-content />
+    <organisms-vertical-divider />
+  `, isInline: true, styles: [":host{--collapsed-height: 56px;--collapsed-height-SCOPED-IN-vertical-hide-mrz7: var(--collapsed-height);--expanded-height: fit-height;--expanded-height-SCOPED-IN-vertical-hide-mrz7: var(--expanded-height)}:host{position:relative;display:block;transition:.5s max-height linear;overflow:hidden}:host organisms-vertical-divider{position:absolute;bottom:0;width:100%}:host[mode=collapsed]{max-height:var(--collapsed-height-SCOPED-IN-vertical-hide-mrz7)}:host[mode=expanded]{max-height:100vh}\n"], dependencies: [{ kind: "component", type: VerticalDividerOrganism, selector: "organisms-vertical-divider" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: VerticalHideFrame, decorators: [{
             type: Component,
             args: [{ selector: 'frames-vertical-hide', standalone: true, imports: [
-                        CommonModule,
                         VerticalDividerOrganism,
                     ], 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-pVzz: var(--collapsed-height);--expanded-height: 400px;--expanded-height-SCOPED-IN-vertical-hide-pVzz: 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-pVzz)}:host[mode=expanded]{height:var(--expanded-height-SCOPED-IN-vertical-hide-pVzz)}\n"] }]
-        }], propDecorators: { mode: [{
-                type: Input
-            }, {
-                type: HostBinding,
-                args: ['attr.mode']
-            }] } });
+    <ng-content />
+    <organisms-vertical-divider />
+  `, host: { '[attr.mode]': 'mode()' }, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--collapsed-height: 56px;--collapsed-height-SCOPED-IN-vertical-hide-mrz7: var(--collapsed-height);--expanded-height: fit-height;--expanded-height-SCOPED-IN-vertical-hide-mrz7: var(--expanded-height)}:host{position:relative;display:block;transition:.5s max-height linear;overflow:hidden}:host organisms-vertical-divider{position:absolute;bottom:0;width:100%}:host[mode=collapsed]{max-height:var(--collapsed-height-SCOPED-IN-vertical-hide-mrz7)}:host[mode=expanded]{max-height:100vh}\n"] }]
+        }] });
 
 /**
  * Generated bundle index. Do not edit.

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;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;;;;"}
+{"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, input } from '@angular/core';\nimport { VerticalDividerOrganism } from '@ng-atomic/components/organisms/vertical-divider';\n\n@Component({\n  selector: 'frames-vertical-hide',\n  standalone: true,\n  imports: [\n    VerticalDividerOrganism,\n  ],\n  template: `\n    <ng-content />\n    <organisms-vertical-divider />\n  `,\n  styleUrls: ['./vertical-hide.frame.scss'],\n  host: { '[attr.mode]': 'mode()' },\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class VerticalHideFrame {\n  readonly mode = input<'collapsed' | 'expanded'>('expanded');\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;MAiBa,iBAAiB,CAAA;AAd9B,IAAA,WAAA,GAAA;AAeW,QAAA,IAAA,CAAA,IAAI,GAAG,KAAK,CAA2B,UAAU,CAAC,CAAC;AAC7D,KAAA;8GAFY,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,EARlB,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,WAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;AAGT,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,2eAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EALC,uBAAuB,EAAA,QAAA,EAAA,4BAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;2FAUd,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAd7B,SAAS;+BACE,sBAAsB,EAAA,UAAA,EACpB,IAAI,EACP,OAAA,EAAA;wBACP,uBAAuB;qBACxB,EACS,QAAA,EAAA,CAAA;;;GAGT,EAEK,IAAA,EAAA,EAAE,aAAa,EAAE,QAAQ,EAAE,EAChB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,MAAA,EAAA,CAAA,2eAAA,CAAA,EAAA,CAAA;;;ACfjD;;AAEG;;;;"}

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

@@ -13,8 +13,7 @@ class NgAtomicFramesModule {
         return {
             ngModule: NgAtomicFramesModule,
             providers: [
-                AppFrameStore.Config.provide(),
-                AppFrameStore.provideDefaultEffects(),
+                AppFrameStore.provideDefault(),
                 provideComponent(AppFrameStore, () => import('@ng-atomic/components/frames/app').then(m => m.AppFrame)),
                 ColumnsFrameStore.Config.provide(),
                 provideComponent(ColumnsFrameStore, () => import('@ng-atomic/components/frames/columns').then(m => m.ColumnsFrame)),
@@ -26,6 +25,7 @@ class NgAtomicFramesModule {
                 provideComponent(SideNavFrame, () => import('@ng-atomic/components/frames/side-nav').then(m => m.SideNavFrame)),
                 RouterOutletFrameStore.Config.provide(),
                 provideComponent(RouterOutletFrameStore, () => import('@ng-atomic/components/frames/router-outlet').then(m => m.RouterOutletFrame)),
+                RouterOutletFrameStore.provideDefault(),
             ]
         };
     }

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

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-frames.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/frames.module.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/ng-atomic-components-frames.ts"],"sourcesContent":["import { NgModule } from '@angular/core';\nimport { provideComponent } from '@ng-atomic/core';\nimport { SideNavFrame, SideNavFrameStore } from '@ng-atomic/components/frames/side-nav';\nimport { RouterOutletFrameStore } from '@ng-atomic/components/frames/router-outlet';\nimport { ColumnsFrameStore } from '@ng-atomic/components/frames/columns';\nimport { AppFrameStore } from '@ng-atomic/components/frames/app';\nimport { DrawerFrameStore } from '@ng-atomic/components/frames/drawer';\nimport { FabFrameStore } from '@ng-atomic/components/frames/fab';\n\n@NgModule({})\nexport class NgAtomicFramesModule {\n  static forRoot() {\n    return {\n      ngModule: NgAtomicFramesModule,\n      providers: [\n        AppFrameStore.Config.provide(),\n        AppFrameStore.provideDefaultEffects(),\n        provideComponent(AppFrameStore, () => import('@ng-atomic/components/frames/app').then(m => m.AppFrame)),\n        ColumnsFrameStore.Config.provide(),\n        provideComponent(ColumnsFrameStore, () => import('@ng-atomic/components/frames/columns').then(m => m.ColumnsFrame)),\n        FabFrameStore.Config.provide(),\n        provideComponent(FabFrameStore, () => import('@ng-atomic/components/frames/fab').then(m => m.FabFrame)),\n        // DrawerFrameStore.Config.provide(),\n        provideComponent(DrawerFrameStore, () => import('@ng-atomic/components/frames/drawer').then(m => m.DrawerFrame)),\n        SideNavFrameStore.Config.provide(),\n        provideComponent(SideNavFrame, () => import('@ng-atomic/components/frames/side-nav').then(m => m.SideNavFrame)),\n        RouterOutletFrameStore.Config.provide(),\n        provideComponent(RouterOutletFrameStore, () => import('@ng-atomic/components/frames/router-outlet').then(m => m.RouterOutletFrame)),\n      ]\n    };\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;MAUa,oBAAoB,CAAA;AAC/B,IAAA,OAAO,OAAO,GAAA;QACZ,OAAO;AACL,YAAA,QAAQ,EAAE,oBAAoB;AAC9B,YAAA,SAAS,EAAE;AACT,gBAAA,aAAa,CAAC,MAAM,CAAC,OAAO,EAAE;gBAC9B,aAAa,CAAC,qBAAqB,EAAE;gBACrC,gBAAgB,CAAC,aAAa,EAAE,MAAM,OAAO,kCAAkC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC;AACvG,gBAAA,iBAAiB,CAAC,MAAM,CAAC,OAAO,EAAE;gBAClC,gBAAgB,CAAC,iBAAiB,EAAE,MAAM,OAAO,sCAAsC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,YAAY,CAAC,CAAC;AACnH,gBAAA,aAAa,CAAC,MAAM,CAAC,OAAO,EAAE;gBAC9B,gBAAgB,CAAC,aAAa,EAAE,MAAM,OAAO,kCAAkC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC;;gBAEvG,gBAAgB,CAAC,gBAAgB,EAAE,MAAM,OAAO,qCAAqC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,CAAC;AAChH,gBAAA,iBAAiB,CAAC,MAAM,CAAC,OAAO,EAAE;gBAClC,gBAAgB,CAAC,YAAY,EAAE,MAAM,OAAO,uCAAuC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,YAAY,CAAC,CAAC;AAC/G,gBAAA,sBAAsB,CAAC,MAAM,CAAC,OAAO,EAAE;gBACvC,gBAAgB,CAAC,sBAAsB,EAAE,MAAM,OAAO,4CAA4C,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,iBAAiB,CAAC,CAAC;AACpI,aAAA;SACF,CAAC;KACH;8GApBU,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;+GAApB,oBAAoB,EAAA,CAAA,CAAA,EAAA;+GAApB,oBAAoB,EAAA,CAAA,CAAA,EAAA;;2FAApB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBADhC,QAAQ;mBAAC,EAAE,CAAA;;;ACTZ;;AAEG;;;;"}
+{"version":3,"file":"ng-atomic-components-frames.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/frames/frames.module.ts","../../../../../packages/@ng-atomic/components/src/lib/frames/ng-atomic-components-frames.ts"],"sourcesContent":["import { NgModule } from '@angular/core';\nimport { provideComponent } from '@ng-atomic/core';\nimport { SideNavFrame, SideNavFrameStore } from '@ng-atomic/components/frames/side-nav';\nimport { RouterOutletFrameStore } from '@ng-atomic/components/frames/router-outlet';\nimport { ColumnsFrameStore } from '@ng-atomic/components/frames/columns';\nimport { AppFrameStore } from '@ng-atomic/components/frames/app';\nimport { DrawerFrameStore } from '@ng-atomic/components/frames/drawer';\nimport { FabFrameStore } from '@ng-atomic/components/frames/fab';\n\n@NgModule({})\nexport class NgAtomicFramesModule {\n  static forRoot() {\n    return {\n      ngModule: NgAtomicFramesModule,\n      providers: [\n        AppFrameStore.provideDefault(),\n        provideComponent(AppFrameStore, () => import('@ng-atomic/components/frames/app').then(m => m.AppFrame)),\n        ColumnsFrameStore.Config.provide(),\n        provideComponent(ColumnsFrameStore, () => import('@ng-atomic/components/frames/columns').then(m => m.ColumnsFrame)),\n        FabFrameStore.Config.provide(),\n        provideComponent(FabFrameStore, () => import('@ng-atomic/components/frames/fab').then(m => m.FabFrame)),\n        // DrawerFrameStore.Config.provide(),\n        provideComponent(DrawerFrameStore, () => import('@ng-atomic/components/frames/drawer').then(m => m.DrawerFrame)),\n        SideNavFrameStore.Config.provide(),\n        provideComponent(SideNavFrame, () => import('@ng-atomic/components/frames/side-nav').then(m => m.SideNavFrame)),\n        RouterOutletFrameStore.Config.provide(),\n        provideComponent(RouterOutletFrameStore, () => import('@ng-atomic/components/frames/router-outlet').then(m => m.RouterOutletFrame)),\n        RouterOutletFrameStore.provideDefault(),\n      ]\n    };\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;MAUa,oBAAoB,CAAA;AAC/B,IAAA,OAAO,OAAO,GAAA;QACZ,OAAO;AACL,YAAA,QAAQ,EAAE,oBAAoB;AAC9B,YAAA,SAAS,EAAE;gBACT,aAAa,CAAC,cAAc,EAAE;gBAC9B,gBAAgB,CAAC,aAAa,EAAE,MAAM,OAAO,kCAAkC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC;AACvG,gBAAA,iBAAiB,CAAC,MAAM,CAAC,OAAO,EAAE;gBAClC,gBAAgB,CAAC,iBAAiB,EAAE,MAAM,OAAO,sCAAsC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,YAAY,CAAC,CAAC;AACnH,gBAAA,aAAa,CAAC,MAAM,CAAC,OAAO,EAAE;gBAC9B,gBAAgB,CAAC,aAAa,EAAE,MAAM,OAAO,kCAAkC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC;;gBAEvG,gBAAgB,CAAC,gBAAgB,EAAE,MAAM,OAAO,qCAAqC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,CAAC;AAChH,gBAAA,iBAAiB,CAAC,MAAM,CAAC,OAAO,EAAE;gBAClC,gBAAgB,CAAC,YAAY,EAAE,MAAM,OAAO,uCAAuC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,YAAY,CAAC,CAAC;AAC/G,gBAAA,sBAAsB,CAAC,MAAM,CAAC,OAAO,EAAE;gBACvC,gBAAgB,CAAC,sBAAsB,EAAE,MAAM,OAAO,4CAA4C,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,iBAAiB,CAAC,CAAC;gBACnI,sBAAsB,CAAC,cAAc,EAAE;AACxC,aAAA;SACF,CAAC;KACH;8GApBU,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;+GAApB,oBAAoB,EAAA,CAAA,CAAA,EAAA;+GAApB,oBAAoB,EAAA,CAAA,CAAA,EAAA;;2FAApB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBADhC,QAAQ;mBAAC,EAAE,CAAA;;;ACTZ;;AAEG;;;;"}

package/fesm2022/ng-atomic-components-molecules-action-input-field.mjs

@@ -46,7 +46,7 @@ class ActionInputFieldMolecule extends NgAtomicComponent {
     [actions]="actions"
     (action)="dispatch($event)"
   ></atoms-smart-menu-button>
-  `, isInline: true, styles: [":host{display:block}:host{display:flex;width:100%;flex-direction:row;align-items:center;justify-content:space-between}:host mat-form-field{width:100%}:host atoms-smart-menu-button{width:fit-content;margin-bottom:20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: SmartMenuButtonAtom, selector: "atoms-smart-menu-button" }, { kind: "pipe", type: ErrorPipe, name: "error" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, styles: [":host{display:block}:host{display:flex;width:100%;flex-direction:row;align-items:center;justify-content:space-between}:host mat-form-field{width:100%}:host atoms-smart-menu-button{width:fit-content;margin-bottom:20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: SmartMenuButtonAtom, selector: "atoms-smart-menu-button, atoms-menu-button" }, { kind: "pipe", type: ErrorPipe, name: "error" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: ActionInputFieldMolecule, decorators: [{
             type: Component,

package/fesm2022/ng-atomic-components-molecules-action-input-field.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-molecules-action-input-field.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/molecules/action-input-field/action-input-field.molecule.ts","../../../../../packages/@ng-atomic/components/src/lib/molecules/action-input-field/ng-atomic-components-molecules-action-input-field.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input, Pipe, ViewChild, AfterViewInit } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { FormControl, ReactiveFormsModule } from '@angular/forms';\nimport { MatInput, MatInputModule } from '@angular/material/input';\nimport { Action } from '@ng-atomic/core';\nimport { SmartMenuButtonAtom } from '@ng-atomic/components/atoms/smart-menu-button';\nimport { NgAtomicComponent } from '@ng-atomic/core';\nimport { MatFormField } from '@angular/material/form-field';\nimport { ErrorPipe } from '@ng-atomic/common/pipes/error';\nimport { startWith } from 'rxjs';\n\n\n@Component({\n  selector: 'molecules-action-input-field',\n  standalone: true,\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    MatInputModule,\n    SmartMenuButtonAtom,\n    ErrorPipe,\n  ],\n  template: `\n  <mat-form-field class=\"mat-form-field-disabled\" [appearance]=\"appearance\">\n    <mat-label>{{ label }}</mat-label>\n    <input matInput [name]=\"name\" type=\"text\" [formControl]=\"control\" [placeholder]=\"placeholder\">\n    <!-- <mat-icon matSuffix>sentiment_very_satisfied</mat-icon> -->\n    <mat-hint *ngIf=\"hint\">{{ hint }}</mat-hint>\n    <mat-error>{{ control.errors | error }}</mat-error>\n  </mat-form-field>\n  <atoms-smart-menu-button\n    [actions]=\"actions\"\n    (action)=\"dispatch($event)\"\n  ></atoms-smart-menu-button>\n  `,\n  styleUrls: ['./action-input-field.molecule.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class ActionInputFieldMolecule extends NgAtomicComponent implements AfterViewInit {\n\n  @ViewChild(MatFormField)\n  formField!: MatFormField;\n\n  @ViewChild('matInput', { read: MatInput })\n  input!: MatInput;\n\n  @Input()\n  appearance: 'outline' | 'fill' = 'outline';\n\n  @Input()\n  type: 'text' | 'number' | 'password' = 'text';\n\n  @Input()\n  name?: string;\n\n  @Input()\n  label = 'label';\n\n  @Input()\n  control = new FormControl<string>('');\n\n  @Input()\n  placeholder = 'placeholder';\n\n  @Input()\n  hint?: string;\n\n  @Input()\n  get actions(): Action[] {\n    return this._actions.map((action) => ({...action}));\n  }\n  set actions(value: Action[]) {\n    this._actions = value;\n  }\n  private _actions: Action[] = [];\n\n  ngAfterViewInit() {\n    this.formField._getDisplayedMessages = function (): 'error' | 'hint' {\n      return this._errorChildren && this._errorChildren.length > 0 ? 'error' : 'hint';\n    };\n  }\n\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-molecules-action-input-field.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/molecules/action-input-field/action-input-field.molecule.ts","../../../../../packages/@ng-atomic/components/src/lib/molecules/action-input-field/ng-atomic-components-molecules-action-input-field.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input, Pipe, ViewChild, AfterViewInit } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { FormControl, ReactiveFormsModule } from '@angular/forms';\nimport { MatInput, MatInputModule } from '@angular/material/input';\nimport { Action } from '@ng-atomic/core';\nimport { SmartMenuButtonAtom } from '@ng-atomic/components/atoms/smart-menu-button';\nimport { NgAtomicComponent } from '@ng-atomic/core';\nimport { MatFormField } from '@angular/material/form-field';\nimport { ErrorPipe } from '@ng-atomic/common/pipes/error';\nimport { startWith } from 'rxjs';\n\n\n@Component({\n  selector: 'molecules-action-input-field',\n  standalone: true,\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    MatInputModule,\n    SmartMenuButtonAtom,\n    ErrorPipe,\n  ],\n  template: `\n  <mat-form-field class=\"mat-form-field-disabled\" [appearance]=\"appearance\">\n    <mat-label>{{ label }}</mat-label>\n    <input matInput [name]=\"name\" type=\"text\" [formControl]=\"control\" [placeholder]=\"placeholder\">\n    <!-- <mat-icon matSuffix>sentiment_very_satisfied</mat-icon> -->\n    <mat-hint *ngIf=\"hint\">{{ hint }}</mat-hint>\n    <mat-error>{{ control.errors | error }}</mat-error>\n  </mat-form-field>\n  <atoms-smart-menu-button\n    [actions]=\"actions\"\n    (action)=\"dispatch($event)\"\n  ></atoms-smart-menu-button>\n  `,\n  styleUrls: ['./action-input-field.molecule.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class ActionInputFieldMolecule extends NgAtomicComponent implements AfterViewInit {\n\n  @ViewChild(MatFormField)\n  formField!: MatFormField;\n\n  @ViewChild('matInput', { read: MatInput })\n  input!: MatInput;\n\n  @Input()\n  appearance: 'outline' | 'fill' = 'outline';\n\n  @Input()\n  type: 'text' | 'number' | 'password' = 'text';\n\n  @Input()\n  name?: string;\n\n  @Input()\n  label = 'label';\n\n  @Input()\n  control = new FormControl<string>('');\n\n  @Input()\n  placeholder = 'placeholder';\n\n  @Input()\n  hint?: string;\n\n  @Input()\n  get actions(): Action[] {\n    return this._actions.map((action) => ({...action}));\n  }\n  set actions(value: Action[]) {\n    this._actions = value;\n  }\n  private _actions: Action[] = [];\n\n  ngAfterViewInit() {\n    this.formField._getDisplayedMessages = function (): 'error' | 'hint' {\n      return this._errorChildren && this._errorChildren.length > 0 ? 'error' : 'hint';\n    };\n  }\n\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-molecules-actions-column.mjs

@@ -21,6 +21,7 @@ let ActionsColumnMoleculeStore = class ActionsColumnMoleculeStore extends Inject
         this.headerText = input(_computed(() => this.config().headerText));
         this.name = input.required();
         this.itemActions = input(_computed(() => this.config().itemActions));
+        this.sticky = input(false);
         this.style = computed(() => this.config().style);
     }
     static { ActionsColumnMoleculeStore_1 = this; }
@@ -34,7 +35,7 @@ let ActionsColumnMoleculeStore = class ActionsColumnMoleculeStore extends Inject
         });
     }, ['components', 'molecules', 'actions-column']); }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: ActionsColumnMoleculeStore, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.1.2", type: ActionsColumnMoleculeStore, isStandalone: true, inputs: { headerText: { classPropertyName: "headerText", publicName: "headerText", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, itemActions: { classPropertyName: "itemActions", publicName: "itemActions", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.1.2", type: ActionsColumnMoleculeStore, isStandalone: true, inputs: { headerText: { classPropertyName: "headerText", publicName: "headerText", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, itemActions: { classPropertyName: "itemActions", publicName: "itemActions", isSignal: true, isRequired: false, transformFunction: null }, sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
 };
 ActionsColumnMoleculeStore = ActionsColumnMoleculeStore_1 = __decorate([
     TokenizedType()
@@ -70,8 +71,8 @@ class ActionsColumnMolecule extends NgAtomicComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: ActionsColumnMolecule, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.1.2", type: ActionsColumnMolecule, isStandalone: true, selector: "molecules-actions-column", viewQueries: [{ propertyName: "columnDef", first: true, predicate: CdkColumnDef, descendants: true, isSignal: true }, { propertyName: "cell", first: true, predicate: CdkCellDef, descendants: true, isSignal: true }, { propertyName: "headerCell", first: true, predicate: CdkHeaderCellDef, descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: ActionsColumnMoleculeStore, inputs: ["headerText", "headerText", "name", "name", "itemActions", "itemActions"] }], ngImport: i0, template: `
-  <ng-container matColumnDef>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.1.2", type: ActionsColumnMolecule, isStandalone: true, selector: "molecules-actions-column", viewQueries: [{ propertyName: "columnDef", first: true, predicate: CdkColumnDef, descendants: true, isSignal: true }, { propertyName: "cell", first: true, predicate: CdkCellDef, descendants: true, isSignal: true }, { propertyName: "headerCell", first: true, predicate: CdkHeaderCellDef, descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: ActionsColumnMoleculeStore, inputs: ["headerText", "headerText", "name", "name", "itemActions", "itemActions", "sticky", "sticky"] }], ngImport: i0, template: `
+  <ng-container matColumnDef [sticky]="store.sticky()">
     <th mat-header-cell *matHeaderCellDef [style.width]="store.style()?.width">{{ store.headerText() }}</th>
     <td mat-cell *matCellDef="let item">
       <atoms-smart-menu-button
@@ -80,7 +81,7 @@ class ActionsColumnMolecule extends NgAtomicComponent {
       />
     </td>
   </ng-container>
-  `, isInline: true, styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatTableModule }, { kind: "directive", type: i1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: SmartMenuButtonAtom, selector: "atoms-smart-menu-button" }, { kind: "pipe", type: ActionsPipe, name: "resolveActions" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+  `, isInline: true, styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatTableModule }, { kind: "directive", type: i1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: SmartMenuButtonAtom, selector: "atoms-smart-menu-button, atoms-menu-button" }, { kind: "pipe", type: ActionsPipe, name: "resolveActions" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: ActionsColumnMolecule, decorators: [{
             type: Component,
@@ -93,7 +94,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImpor
                         SmartMenuButtonAtom,
                         ActionsPipe,
                     ], template: `
-  <ng-container matColumnDef>
+  <ng-container matColumnDef [sticky]="store.sticky()">
     <th mat-header-cell *matHeaderCellDef [style.width]="store.style()?.width">{{ store.headerText() }}</th>
     <td mat-cell *matCellDef="let item">
       <atoms-smart-menu-button
@@ -105,7 +106,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImpor
   `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
                         {
                             directive: ActionsColumnMoleculeStore,
-                            inputs: ['headerText', 'name', 'itemActions'],
+                            inputs: [
+                                'headerText',
+                                'name',
+                                'itemActions',
+                                'sticky',
+                            ],
                         },
                     ] }]
         }], ctorParameters: () => [] });