@ng-atomic/components 16.2.0 → 16.3.1

package/fesm2022/ng-atomic-components-molecules-tree-column.mjs

@@ -1,31 +1,39 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, Input, Output } from '@angular/core';
-import * as i1 from '@angular/common';
+import { input, Directive, inject, EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, Output } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import * as i6 from '@angular/material/table';
+import * as i5 from '@angular/material/table';
 import { MatTextColumn, MatTableModule } from '@angular/material/table';
-import * as i2 from '@angular/cdk/clipboard';
+import * as i1 from '@angular/cdk/clipboard';
 import { ClipboardModule } from '@angular/cdk/clipboard';
-import * as i3 from '@ng-atomic/common/pipes/smart-exp';
+import * as i2 from '@ng-atomic/common/pipes/smart-exp';
 import { SmartExpModule } from '@ng-atomic/common/pipes/smart-exp';
 import { DataAccessorPipe } from '@ng-atomic/common/pipes/data-accessor';
-import * as i4 from '@angular/material/button';
+import * as i3 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
-import * as i5 from '@angular/material/icon';
+import * as i4 from '@angular/material/icon';
 import { MatIconModule } from '@angular/material/icon';
-import * as i7 from '@angular/material/tooltip';
+import * as i6 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { FlatTreeControl } from '@angular/cdk/tree';
 
+class TreeColumnMoleculeStore {
+    constructor() {
+        this.sort = input('none');
+        this.treeControl = input(new FlatTreeControl((node) => node.level, (node) => node.isExpandable));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: TreeColumnMoleculeStore, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "17.2.2", type: TreeColumnMoleculeStore, isStandalone: true, selector: "molecules-tree-column", inputs: { sort: { classPropertyName: "sort", publicName: "sort", isSignal: true, isRequired: false, transformFunction: null }, treeControl: { classPropertyName: "treeControl", publicName: "treeControl", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: TreeColumnMoleculeStore, decorators: [{
+            type: Directive,
+            args: [{ standalone: true, selector: 'molecules-tree-column' }]
+        }] });
 class TreeColumnMolecule extends MatTextColumn {
     constructor() {
         super(...arguments);
-        this.sort = 'none';
+        this.store = inject(TreeColumnMoleculeStore);
         this.headerClick = new EventEmitter();
-        // @Input()
-        // override dataAccessor = (data, name) => data[name.replace(/^__tree_/, '')] ?? '';
         this.text = 'copy';
-        this.treeControl = new FlatTreeControl((node) => node.level, (node) => node.isExpandable);
     }
     get key() {
         return this.name.slice('__tree_'.length);
@@ -34,8 +42,8 @@ class TreeColumnMolecule extends MatTextColumn {
         this.text = 'copied!';
         setTimeout(() => this.text = 'copy', 1000);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TreeColumnMolecule, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TreeColumnMolecule, isStandalone: true, selector: "molecules-tree-column", inputs: { sort: "sort", treeControl: "treeControl" }, outputs: { headerClick: "headerClick" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: TreeColumnMolecule, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: TreeColumnMolecule, isStandalone: true, selector: "molecules-tree-column", outputs: { headerClick: "headerClick" }, usesInheritance: true, hostDirectives: [{ directive: TreeColumnMoleculeStore, inputs: ["sort", "sort", "treeControl", "treeControl"] }], ngImport: i0, template: `
   <ng-container matColumnDef>
     <th
       mat-header-cell
@@ -45,10 +53,14 @@ class TreeColumnMolecule extends MatTextColumn {
     >
       <p class="nowrap" style="display: flex; align-items: center; margin-left: 48px">
         <span>{{ key }}</span>
-        <ng-container [ngSwitch]="sort">
-          <mat-icon class="order" *ngSwitchCase="'asc'">south</mat-icon>
-          <mat-icon class="order" *ngSwitchCase="'desc'">north</mat-icon>
-        </ng-container>
+        @switch(store.sort()) {
+          @case ('asc') {
+            <mat-icon class="order">south</mat-icon>
+          }
+          @case ('desc') { 
+            <mat-icon class="order">north</mat-icon>
+          }
+        }
       </p>
     </th>
     <td mat-cell *matCellDef="let data"> 
@@ -61,18 +73,18 @@ class TreeColumnMolecule extends MatTextColumn {
           mat-icon-button 
           [style.visibility]="!data.isExpandable ? 'hidden' : ''"
           [style.marginLeft.px]="data.level * 32"
-          (click)="treeControl.toggle(data)"
+          (click)="store.treeControl().toggle(data)"
         >
           <mat-icon>
-            {{ treeControl.isExpanded(data) ? 'expand_more' : 'chevron_right' }}
+            {{ store.treeControl().isExpanded(data) ? 'expand_more' : 'chevron_right' }}
           </mat-icon>
         </button>
         <span> {{ data | dataAccessor: key }} </span>
       </p>
     </td>
-  </ng-container> `, isInline: true, styles: ["th[mat-header-cell],td[mat-cell]{cursor:pointer}th[mat-header-cell] mat-icon.order,td[mat-cell] mat-icon.order{width:12px;height:12px;font-size:12px}th[mat-header-cell] p.nowrap,td[mat-cell] p.nowrap{margin-block-start:0em;margin-block-end:0em;display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: ClipboardModule }, { kind: "directive", type: i2.CdkCopyToClipboard, selector: "[cdkCopyToClipboard]", inputs: ["cdkCopyToClipboard", "cdkCopyToClipboardAttempts"], outputs: ["cdkCopyToClipboardCopied"] }, { kind: "ngmodule", type: SmartExpModule }, { kind: "pipe", type: i3.SmartExpPipe, name: "smartExp" }, { kind: "pipe", type: DataAccessorPipe, name: "dataAccessor" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "directive", type: i6.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i6.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i6.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i6.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+  </ng-container> `, isInline: true, styles: ["th[mat-header-cell],td[mat-cell]{cursor:pointer}th[mat-header-cell] mat-icon.order,td[mat-cell] mat-icon.order{width:12px;height:12px;font-size:12px}th[mat-header-cell] p.nowrap,td[mat-cell] p.nowrap{margin-block-start:0em;margin-block-end:0em;display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ClipboardModule }, { kind: "directive", type: i1.CdkCopyToClipboard, selector: "[cdkCopyToClipboard]", inputs: ["cdkCopyToClipboard", "cdkCopyToClipboardAttempts"], outputs: ["cdkCopyToClipboardCopied"] }, { kind: "ngmodule", type: SmartExpModule }, { kind: "pipe", type: i2.SmartExpPipe, name: "smartExp" }, { kind: "pipe", type: DataAccessorPipe, name: "dataAccessor" }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "directive", type: i5.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i5.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i5.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i5.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i5.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TreeColumnMolecule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: TreeColumnMolecule, decorators: [{
             type: Component,
             args: [{ selector: 'molecules-tree-column', standalone: true, imports: [
                         CommonModule,
@@ -93,10 +105,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
     >
       <p class="nowrap" style="display: flex; align-items: center; margin-left: 48px">
         <span>{{ key }}</span>
-        <ng-container [ngSwitch]="sort">
-          <mat-icon class="order" *ngSwitchCase="'asc'">south</mat-icon>
-          <mat-icon class="order" *ngSwitchCase="'desc'">north</mat-icon>
-        </ng-container>
+        @switch(store.sort()) {
+          @case ('asc') {
+            <mat-icon class="order">south</mat-icon>
+          }
+          @case ('desc') { 
+            <mat-icon class="order">north</mat-icon>
+          }
+        }
       </p>
     </th>
     <td mat-cell *matCellDef="let data"> 
@@ -109,27 +125,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
           mat-icon-button 
           [style.visibility]="!data.isExpandable ? 'hidden' : ''"
           [style.marginLeft.px]="data.level * 32"
-          (click)="treeControl.toggle(data)"
+          (click)="store.treeControl().toggle(data)"
         >
           <mat-icon>
-            {{ treeControl.isExpanded(data) ? 'expand_more' : 'chevron_right' }}
+            {{ store.treeControl().isExpanded(data) ? 'expand_more' : 'chevron_right' }}
           </mat-icon>
         </button>
         <span> {{ data | dataAccessor: key }} </span>
       </p>
     </td>
-  </ng-container> `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["th[mat-header-cell],td[mat-cell]{cursor:pointer}th[mat-header-cell] mat-icon.order,td[mat-cell] mat-icon.order{width:12px;height:12px;font-size:12px}th[mat-header-cell] p.nowrap,td[mat-cell] p.nowrap{margin-block-start:0em;margin-block-end:0em;display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
-        }], propDecorators: { sort: [{
-                type: Input
-            }], headerClick: [{
+  </ng-container> `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
+                        {
+                            directive: TreeColumnMoleculeStore,
+                            inputs: ['sort', 'treeControl'],
+                        }
+                    ], styles: ["th[mat-header-cell],td[mat-cell]{cursor:pointer}th[mat-header-cell] mat-icon.order,td[mat-cell] mat-icon.order{width:12px;height:12px;font-size:12px}th[mat-header-cell] p.nowrap,td[mat-cell] p.nowrap{margin-block-start:0em;margin-block-end:0em;display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
+        }], propDecorators: { headerClick: [{
                 type: Output
-            }], treeControl: [{
-                type: Input
             }] } });
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { TreeColumnMolecule };
+export { TreeColumnMolecule, TreeColumnMoleculeStore };
 //# sourceMappingURL=ng-atomic-components-molecules-tree-column.mjs.map

package/fesm2022/ng-atomic-components-molecules-tree-column.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-molecules-tree-column.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/molecules/tree-column/tree-column.molecule.ts","../../../../../packages/@ng-atomic/components/src/lib/molecules/tree-column/ng-atomic-components-molecules-tree-column.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatTableModule, MatTextColumn } from '@angular/material/table';\nimport { ClipboardModule } from '@angular/cdk/clipboard';\nimport { SmartExpModule } from '@ng-atomic/common/pipes/smart-exp';\nimport { DataAccessorPipe } from '@ng-atomic/common/pipes/data-accessor';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { FlatTreeControl } from '@angular/cdk/tree';\n\n@Component({\n  selector: 'molecules-tree-column',\n  standalone: true,\n  imports: [\n    CommonModule,\n    ClipboardModule,\n    SmartExpModule,\n    DataAccessorPipe,\n    MatButtonModule,\n    MatIconModule,\n    MatTableModule,\n    MatTooltipModule,\n  ],\n  template: `\n  <ng-container matColumnDef>\n    <th\n      mat-header-cell\n      *matHeaderCellDef\n      [style.text-align]=\"justify\"\n      (click)=\"headerClick.emit()\"\n    >\n      <p class=\"nowrap\" style=\"display: flex; align-items: center; margin-left: 48px\">\n        <span>{{ key }}</span>\n        <ng-container [ngSwitch]=\"sort\">\n          <mat-icon class=\"order\" *ngSwitchCase=\"'asc'\">south</mat-icon>\n          <mat-icon class=\"order\" *ngSwitchCase=\"'desc'\">north</mat-icon>\n        </ng-container>\n      </p>\n    </th>\n    <td mat-cell *matCellDef=\"let data\"> \n      <p class=\"nowrap\"\n        [cdkCopyToClipboard]=\"data | dataAccessor: key | smartExp: key\"\n        (click)=\"copied(); tooltip.show()\"\n        #tooltip=\"matTooltip\" [matTooltip]=\"text\" matTooltipPosition=\"below\"\n      >\n        <button \n          mat-icon-button \n          [style.visibility]=\"!data.isExpandable ? 'hidden' : ''\"\n          [style.marginLeft.px]=\"data.level * 32\"\n          (click)=\"treeControl.toggle(data)\"\n        >\n          <mat-icon>\n            {{ treeControl.isExpanded(data) ? 'expand_more' : 'chevron_right' }}\n          </mat-icon>\n        </button>\n        <span> {{ data | dataAccessor: key }} </span>\n      </p>\n    </td>\n  </ng-container> `,\n  styleUrls: ['./tree-column.molecule.scss'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class TreeColumnMolecule<T> extends MatTextColumn<T> {\n\n  @Input()\n  sort: 'asc' | 'desc' | 'none' = 'none';\n\n  @Output()\n  headerClick = new EventEmitter<void>();\n\n  // @Input()\n  // override dataAccessor = (data, name) => data[name.replace(/^__tree_/, '')] ?? '';\n\n  text = 'copy';\n\n  get key() {\n    return this.name.slice('__tree_'.length);\n  }\n\n  copied() {\n    this.text = 'copied!';\n    setTimeout(() => this.text = 'copy', 1000);\n  }\n\n  @Input()\n  treeControl = new FlatTreeControl<any>(\n    (node) => node.level,\n    (node) => node.isExpandable\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-tree-column.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/molecules/tree-column/tree-column.molecule.ts","../../../../../packages/@ng-atomic/components/src/lib/molecules/tree-column/ng-atomic-components-molecules-tree-column.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Directive, EventEmitter, Input, Output, ViewEncapsulation, inject, input } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatTableModule, MatTextColumn } from '@angular/material/table';\nimport { ClipboardModule } from '@angular/cdk/clipboard';\nimport { SmartExpModule } from '@ng-atomic/common/pipes/smart-exp';\nimport { DataAccessorPipe } from '@ng-atomic/common/pipes/data-accessor';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { FlatTreeControl } from '@angular/cdk/tree';\n\n@Directive({standalone: true, selector: 'molecules-tree-column'})\nexport class TreeColumnMoleculeStore {\n  readonly sort = input<'asc' | 'desc' | 'none'>('none');\n  readonly treeControl = input(new FlatTreeControl<any>(\n    (node) => node.level,\n    (node) => node.isExpandable\n  ));\n\n}\n\n@Component({\n  selector: 'molecules-tree-column',\n  standalone: true,\n  imports: [\n    CommonModule,\n    ClipboardModule,\n    SmartExpModule,\n    DataAccessorPipe,\n    MatButtonModule,\n    MatIconModule,\n    MatTableModule,\n    MatTooltipModule,\n  ],\n  template: `\n  <ng-container matColumnDef>\n    <th\n      mat-header-cell\n      *matHeaderCellDef\n      [style.text-align]=\"justify\"\n      (click)=\"headerClick.emit()\"\n    >\n      <p class=\"nowrap\" style=\"display: flex; align-items: center; margin-left: 48px\">\n        <span>{{ key }}</span>\n        @switch(store.sort()) {\n          @case ('asc') {\n            <mat-icon class=\"order\">south</mat-icon>\n          }\n          @case ('desc') { \n            <mat-icon class=\"order\">north</mat-icon>\n          }\n        }\n      </p>\n    </th>\n    <td mat-cell *matCellDef=\"let data\"> \n      <p class=\"nowrap\"\n        [cdkCopyToClipboard]=\"data | dataAccessor: key | smartExp: key\"\n        (click)=\"copied(); tooltip.show()\"\n        #tooltip=\"matTooltip\" [matTooltip]=\"text\" matTooltipPosition=\"below\"\n      >\n        <button \n          mat-icon-button \n          [style.visibility]=\"!data.isExpandable ? 'hidden' : ''\"\n          [style.marginLeft.px]=\"data.level * 32\"\n          (click)=\"store.treeControl().toggle(data)\"\n        >\n          <mat-icon>\n            {{ store.treeControl().isExpanded(data) ? 'expand_more' : 'chevron_right' }}\n          </mat-icon>\n        </button>\n        <span> {{ data | dataAccessor: key }} </span>\n      </p>\n    </td>\n  </ng-container> `,\n  styleUrls: ['./tree-column.molecule.scss'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  hostDirectives: [\n    {\n      directive: TreeColumnMoleculeStore,\n      inputs: ['sort', 'treeControl'],\n    }\n  ],\n})\nexport class TreeColumnMolecule<T> extends MatTextColumn<T> {\n  protected store = inject(TreeColumnMoleculeStore);\n\n  @Output()\n  headerClick = new EventEmitter<void>();\n\n  text = 'copy';\n\n  get key() {\n    return this.name.slice('__tree_'.length);\n  }\n\n  copied() {\n    this.text = 'copied!';\n    setTimeout(() => this.text = 'copy', 1000);\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.mjs

@@ -2,24 +2,42 @@ import * as i0 from '@angular/core';
 import { NgModule } from '@angular/core';
 import { provideComponent } from '@ng-atomic/core';
 import { NavigationListItemMoleculeStore } from '@ng-atomic/components/molecules/navigation-list-item';
+import { ChipsInputFieldMoleculeStore } from '@ng-atomic/components/molecules/chips-input-field';
+import { HeaderMoleculeStore } from '@ng-atomic/components/molecules/header';
+import { MatChipsModule } from '@angular/material/chips';
+import { TextInputFieldMoleculeStore } from '@ng-atomic/components/molecules/text-input-field';
+import { LoadingBoxMoleculeStore } from '@ng-atomic/components/molecules/loading-box';
 
 class NgAtomicMoleculesModule {
     static forRoot() {
         return {
             ngModule: NgAtomicMoleculesModule,
             providers: [
+                provideComponent(ChipsInputFieldMoleculeStore, () => import('@ng-atomic/components/molecules/chips-input-field').then(m => m.ChipsInputFieldMolecule)),
+                ChipsInputFieldMoleculeStore.Config.provide(),
+                provideComponent(HeaderMoleculeStore, () => import('@ng-atomic/components/molecules/header').then(m => m.HeaderMolecule)),
+                LoadingBoxMoleculeStore.Config.provide(),
+                provideComponent(LoadingBoxMoleculeStore, () => {
+                    return import('@ng-atomic/components/molecules/loading-box').then(m => m.LoadingBoxMolecule);
+                }),
+                provideComponent(NavigationListItemMoleculeStore, () => import('@ng-atomic/components/molecules/navigation-list-item').then(m => m.NavigationListItemMolecule)),
                 provideComponent(NavigationListItemMoleculeStore, () => import('@ng-atomic/components/molecules/navigation-list-item')
                     .then(m => m.NavigationListItemMolecule)),
+                provideComponent(TextInputFieldMoleculeStore, () => import('@ng-atomic/components/molecules/text-input-field').then(m => m.TextInputFieldMolecule)),
             ],
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NgAtomicMoleculesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: NgAtomicMoleculesModule }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NgAtomicMoleculesModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: NgAtomicMoleculesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.2.2", ngImport: i0, type: NgAtomicMoleculesModule, imports: [MatChipsModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: NgAtomicMoleculesModule, imports: [MatChipsModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NgAtomicMoleculesModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: NgAtomicMoleculesModule, decorators: [{
             type: NgModule,
-            args: [{}]
+            args: [{
+                    imports: [
+                        MatChipsModule,
+                    ]
+                }]
         }] });
 
 /**

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

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-molecules.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/molecules/molecules.module.ts","../../../../../packages/@ng-atomic/components/src/lib/molecules/ng-atomic-components-molecules.ts"],"sourcesContent":["import { NgModule } from \"@angular/core\";\nimport { provideComponent } from \"@ng-atomic/core\";\nimport { NavigationListItemMoleculeStore } from \"@ng-atomic/components/molecules/navigation-list-item\";\n\n@NgModule({})\nexport class NgAtomicMoleculesModule {\n  static forRoot() {\n    return {\n      ngModule: NgAtomicMoleculesModule,\n      providers: [\n        provideComponent(\n          NavigationListItemMoleculeStore,\n          () => import('@ng-atomic/components/molecules/navigation-list-item')\n            .then(m => m.NavigationListItemMolecule)\n        ),\n      ],\n    };\n  }\n}","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;MAKa,uBAAuB,CAAA;AAClC,IAAA,OAAO,OAAO,GAAA;QACZ,OAAO;AACL,YAAA,QAAQ,EAAE,uBAAuB;AACjC,YAAA,SAAS,EAAE;gBACT,gBAAgB,CACd,+BAA+B,EAC/B,MAAM,OAAO,sDAAsD,CAAC;qBACjE,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,0BAA0B,CAAC,CAC3C;AACF,aAAA;SACF,CAAC;KACH;+GAZU,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;gHAAvB,uBAAuB,EAAA,CAAA,CAAA,EAAA;gHAAvB,uBAAuB,EAAA,CAAA,CAAA,EAAA;;4FAAvB,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBADnC,QAAQ;mBAAC,EAAE,CAAA;;;ACJZ;;AAEG;;;;"}
+{"version":3,"file":"ng-atomic-components-molecules.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/molecules/molecules.module.ts","../../../../../packages/@ng-atomic/components/src/lib/molecules/ng-atomic-components-molecules.ts"],"sourcesContent":["import { NgModule } from \"@angular/core\";\nimport { provideComponent } from \"@ng-atomic/core\";\nimport { NavigationListItemMoleculeStore } from \"@ng-atomic/components/molecules/navigation-list-item\";\nimport { ChipsInputFieldMoleculeStore } from \"@ng-atomic/components/molecules/chips-input-field\";\nimport { HeaderMoleculeStore } from \"@ng-atomic/components/molecules/header\";\nimport { MatChipsModule } from \"@angular/material/chips\";\nimport { TextInputFieldMoleculeStore } from \"@ng-atomic/components/molecules/text-input-field\";\nimport { LoadingBoxMoleculeStore } from \"@ng-atomic/components/molecules/loading-box\";\n\n@NgModule({\n  imports: [\n    MatChipsModule,\n  ]\n})\nexport class NgAtomicMoleculesModule {\n  static forRoot() {\n    return {\n      ngModule: NgAtomicMoleculesModule,\n      providers: [\n        provideComponent(ChipsInputFieldMoleculeStore, () => import('@ng-atomic/components/molecules/chips-input-field').then(m => m.ChipsInputFieldMolecule)),\n        ChipsInputFieldMoleculeStore.Config.provide(),\n        provideComponent(HeaderMoleculeStore, () => import('@ng-atomic/components/molecules/header').then(m => m.HeaderMolecule)),\n        LoadingBoxMoleculeStore.Config.provide(),\n        provideComponent(LoadingBoxMoleculeStore, () => {\n          return import('@ng-atomic/components/molecules/loading-box').then(m => m.LoadingBoxMolecule);\n        }),\n        provideComponent(NavigationListItemMoleculeStore, () => import('@ng-atomic/components/molecules/navigation-list-item').then(m => m.NavigationListItemMolecule)),\n        provideComponent(\n          NavigationListItemMoleculeStore,\n          () => import('@ng-atomic/components/molecules/navigation-list-item')\n            .then(m => m.NavigationListItemMolecule)\n        ),\n        provideComponent(TextInputFieldMoleculeStore, () => import('@ng-atomic/components/molecules/text-input-field').then(m => m.TextInputFieldMolecule)),\n      ],\n    };\n  }\n}","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;MAca,uBAAuB,CAAA;AAClC,IAAA,OAAO,OAAO,GAAA;QACZ,OAAO;AACL,YAAA,QAAQ,EAAE,uBAAuB;AACjC,YAAA,SAAS,EAAE;gBACT,gBAAgB,CAAC,4BAA4B,EAAE,MAAM,OAAO,mDAAmD,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,uBAAuB,CAAC,CAAC;AACtJ,gBAAA,4BAA4B,CAAC,MAAM,CAAC,OAAO,EAAE;gBAC7C,gBAAgB,CAAC,mBAAmB,EAAE,MAAM,OAAO,wCAAwC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,cAAc,CAAC,CAAC;AACzH,gBAAA,uBAAuB,CAAC,MAAM,CAAC,OAAO,EAAE;AACxC,gBAAA,gBAAgB,CAAC,uBAAuB,EAAE,MAAK;AAC7C,oBAAA,OAAO,OAAO,6CAA6C,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,kBAAkB,CAAC,CAAC;AAC/F,iBAAC,CAAC;gBACF,gBAAgB,CAAC,+BAA+B,EAAE,MAAM,OAAO,sDAAsD,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,0BAA0B,CAAC,CAAC;gBAC/J,gBAAgB,CACd,+BAA+B,EAC/B,MAAM,OAAO,sDAAsD,CAAC;qBACjE,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,0BAA0B,CAAC,CAC3C;gBACD,gBAAgB,CAAC,2BAA2B,EAAE,MAAM,OAAO,kDAAkD,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,sBAAsB,CAAC,CAAC;AACpJ,aAAA;SACF,CAAC;KACH;8GArBU,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA,EAAA;AAAvB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,uBAAuB,YAHhC,cAAc,CAAA,EAAA,CAAA,CAAA,EAAA;AAGL,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,uBAAuB,YAHhC,cAAc,CAAA,EAAA,CAAA,CAAA,EAAA;;2FAGL,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBALnC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE;wBACP,cAAc;AACf,qBAAA;AACF,iBAAA,CAAA;;;ACbD;;AAEG;;;;"}

package/fesm2022/ng-atomic-components-organisms-action-buttons-section.mjs

@@ -1,34 +1,143 @@
-import * as i1 from '@angular/common';
-import { CommonModule } from '@angular/common';
+import { __decorate } from 'tslib';
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output } from '@angular/core';
-import * as i2 from '@angular/material/button';
+import { input, Directive, inject, Component, ChangeDetectionStrategy } from '@angular/core';
+import * as i1 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
+import { InjectableComponent, TokenizedType, NgAtomicComponent } from '@ng-atomic/core';
 
-class ActionButtonsSectionOrganism {
+let ActionButtonsSectionOrganismStore = class ActionButtonsSectionOrganismStore extends InjectableComponent {
     constructor() {
-        this.actions = [];
-        this.action = new EventEmitter();
-        this.trackById = (item) => item.id;
+        super(...arguments);
+        this.actions = input([]);
+        this.type = input('raised');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionButtonsSectionOrganism, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ActionButtonsSectionOrganism, isStandalone: true, selector: "organisms-action-buttons-section", inputs: { actions: "actions" }, outputs: { action: "action" }, host: { classAttribute: "organism section" }, ngImport: i0, template: "<ng-container *ngFor=\"let _action of actions; trackBy: trackById\">\n  <button mat-raised-button color=\"primary\" [disabled]=\"_action?.disabled\" (click)=\"action.emit(_action)\">{{ _action?.name }}</button>\n</ng-container>", styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-action-buttons-section-WhSg: var(--horizontal-padding)}:host{display:flex;flex-direction:row;gap:8px;width:100%;padding:0 var(--horizontal-padding-SCOPED-IN-action-buttons-section-WhSg);box-sizing:border-box}:host button{width:100%;height:48px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ActionButtonsSectionOrganismStore, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "17.2.2", type: ActionButtonsSectionOrganismStore, isStandalone: true, selector: "organisms-action-buttons-section", inputs: { actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "organism section" }, usesInheritance: true, ngImport: i0 }); }
+};
+ActionButtonsSectionOrganismStore = __decorate([
+    TokenizedType()
+], ActionButtonsSectionOrganismStore);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ActionButtonsSectionOrganismStore, decorators: [{
+            type: Directive,
+            args: [{
+                    standalone: true,
+                    selector: 'organisms-action-buttons-section',
+                    host: { class: 'organism section' },
+                }]
+        }] });
+class ActionButtonsSectionOrganism extends NgAtomicComponent {
+    constructor() {
+        super(...arguments);
+        this.store = inject(ActionButtonsSectionOrganismStore);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ActionButtonsSectionOrganism, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.2.2", type: ActionButtonsSectionOrganism, isStandalone: true, selector: "organisms-action-buttons-section", host: { classAttribute: "organism section" }, usesInheritance: true, hostDirectives: [{ directive: ActionButtonsSectionOrganismStore, inputs: ["actions", "actions", "type", "type"] }], ngImport: i0, template: `
+    @for (action of store.actions(); track action.id) {
+      @switch (store.type()) {
+        @case ('basic') {
+          <button
+            mat-button
+            [color]="action.color"
+            [disabled]="action?.disabled"
+            (click)="dispatch(action)"
+          >{{ action?.name }}</button>
+        }
+        @case ('raised') {
+          <button
+            mat-raised-button
+            [color]="action.color"
+            [disabled]="action?.disabled"
+            (click)="dispatch(action)"
+          >{{ action?.name }}</button>
+        }
+        @case ('stroked') {
+          <button
+            mat-stroked-button
+            [color]="action.color"
+            [disabled]="action?.disabled"
+            (click)="dispatch(action)"
+          >{{ action?.name }}</button>
+        }
+        @case ('flat') {
+          <button
+            mat-flat-button
+            [color]="action.color"
+            [disabled]="action?.disabled"
+            (click)="dispatch(action)"
+          >{{ action?.name }}</button>
+        }
+        @case ('icon') {
+          <button
+            mat-icon-button
+            [color]="action.color"
+            [disabled]="action?.disabled"
+            (click)="dispatch(action)"
+          >{{ action?.name }}</button>
+        }
+      }
+    }
+  `, isInline: true, styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-action-buttons-section-mGxI: var(--horizontal-padding)}:host{display:flex;flex-direction:row;gap:8px;width:100%;padding:0 var(--horizontal-padding-SCOPED-IN-action-buttons-section-mGxI);box-sizing:border-box}:host button{width:100%;height:48px;text-wrap:nowrap}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i1.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionButtonsSectionOrganism, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ActionButtonsSectionOrganism, decorators: [{
             type: Component,
             args: [{ selector: 'organisms-action-buttons-section', standalone: true, imports: [
-                        CommonModule,
                         MatButtonModule,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'organism section' }, template: "<ng-container *ngFor=\"let _action of actions; trackBy: trackById\">\n  <button mat-raised-button color=\"primary\" [disabled]=\"_action?.disabled\" (click)=\"action.emit(_action)\">{{ _action?.name }}</button>\n</ng-container>", styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-action-buttons-section-WhSg: var(--horizontal-padding)}:host{display:flex;flex-direction:row;gap:8px;width:100%;padding:0 var(--horizontal-padding-SCOPED-IN-action-buttons-section-WhSg);box-sizing:border-box}:host button{width:100%;height:48px}\n"] }]
-        }], propDecorators: { actions: [{
-                type: Input
-            }], action: [{
-                type: Output
-            }] } });
+                    ], template: `
+    @for (action of store.actions(); track action.id) {
+      @switch (store.type()) {
+        @case ('basic') {
+          <button
+            mat-button
+            [color]="action.color"
+            [disabled]="action?.disabled"
+            (click)="dispatch(action)"
+          >{{ action?.name }}</button>
+        }
+        @case ('raised') {
+          <button
+            mat-raised-button
+            [color]="action.color"
+            [disabled]="action?.disabled"
+            (click)="dispatch(action)"
+          >{{ action?.name }}</button>
+        }
+        @case ('stroked') {
+          <button
+            mat-stroked-button
+            [color]="action.color"
+            [disabled]="action?.disabled"
+            (click)="dispatch(action)"
+          >{{ action?.name }}</button>
+        }
+        @case ('flat') {
+          <button
+            mat-flat-button
+            [color]="action.color"
+            [disabled]="action?.disabled"
+            (click)="dispatch(action)"
+          >{{ action?.name }}</button>
+        }
+        @case ('icon') {
+          <button
+            mat-icon-button
+            [color]="action.color"
+            [disabled]="action?.disabled"
+            (click)="dispatch(action)"
+          >{{ action?.name }}</button>
+        }
+      }
+    }
+  `, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'organism section' }, hostDirectives: [
+                        {
+                            directive: ActionButtonsSectionOrganismStore,
+                            inputs: ['actions', 'type'],
+                        }
+                    ], styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-action-buttons-section-mGxI: var(--horizontal-padding)}:host{display:flex;flex-direction:row;gap:8px;width:100%;padding:0 var(--horizontal-padding-SCOPED-IN-action-buttons-section-mGxI);box-sizing:border-box}:host button{width:100%;height:48px;text-wrap:nowrap}\n"] }]
+        }] });
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { ActionButtonsSectionOrganism };
+export { ActionButtonsSectionOrganism, ActionButtonsSectionOrganismStore };
 //# sourceMappingURL=ng-atomic-components-organisms-action-buttons-section.mjs.map

package/fesm2022/ng-atomic-components-organisms-action-buttons-section.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-organisms-action-buttons-section.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/organisms/action-buttons-section/action-buttons-section.organism.ts","../../../../../packages/@ng-atomic/components/src/lib/organisms/action-buttons-section/action-buttons-section.organism.html","../../../../../packages/@ng-atomic/components/src/lib/organisms/action-buttons-section/ng-atomic-components-organisms-action-buttons-section.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { Action } from '@ng-atomic/core';\n\n@Component({\n  selector: 'organisms-action-buttons-section',\n  standalone: true,\n  imports: [\n    CommonModule,\n    MatButtonModule,\n  ],\n  templateUrl: './action-buttons-section.organism.html',\n  styleUrls: ['./action-buttons-section.organism.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {class: 'organism section'},\n})\nexport class ActionButtonsSectionOrganism {\n  @Input()\n  actions: Action[] = [];\n\n  @Output()\n  action = new EventEmitter<Action>();\n\n  trackById = (item: Action) => item.id;\n}\n","<ng-container *ngFor=\"let _action of actions; trackBy: trackById\">\n  <button mat-raised-button color=\"primary\" [disabled]=\"_action?.disabled\" (click)=\"action.emit(_action)\">{{ _action?.name }}</button>\n</ng-container>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;MAiBa,4BAA4B,CAAA;AAZzC,IAAA,WAAA,GAAA;QAcE,IAAO,CAAA,OAAA,GAAa,EAAE,CAAC;AAGvB,QAAA,IAAA,CAAA,MAAM,GAAG,IAAI,YAAY,EAAU,CAAC;QAEpC,IAAS,CAAA,SAAA,GAAG,CAAC,IAAY,KAAK,IAAI,CAAC,EAAE,CAAC;AACvC,KAAA;+GARY,4BAA4B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAA5B,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,4BAA4B,ECjBzC,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kCAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,OAAA,EAAA,EAAA,MAAA,EAAA,QAAA,EAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,kBAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,qOAEe,EDOX,MAAA,EAAA,CAAA,wTAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,YAAY,2JACZ,eAAe,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,QAAA,EAAA,6GAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,eAAA,EAAA,OAAA,CAAA,EAAA,QAAA,EAAA,CAAA,WAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA,EAAA;;4FAON,4BAA4B,EAAA,UAAA,EAAA,CAAA;kBAZxC,SAAS;+BACE,kCAAkC,EAAA,UAAA,EAChC,IAAI,EACP,OAAA,EAAA;wBACP,YAAY;wBACZ,eAAe;qBAChB,EAGgB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,IAAA,EACzC,EAAC,KAAK,EAAE,kBAAkB,EAAC,EAAA,QAAA,EAAA,qOAAA,EAAA,MAAA,EAAA,CAAA,wTAAA,CAAA,EAAA,CAAA;8BAIjC,OAAO,EAAA,CAAA;sBADN,KAAK;gBAIN,MAAM,EAAA,CAAA;sBADL,MAAM;;;AErBT;;AAEG;;;;"}
+{"version":3,"file":"ng-atomic-components-organisms-action-buttons-section.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/organisms/action-buttons-section/action-buttons-section.organism.ts","../../../../../packages/@ng-atomic/components/src/lib/organisms/action-buttons-section/ng-atomic-components-organisms-action-buttons-section.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Directive, inject, input } from '@angular/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { Action, InjectableComponent, NgAtomicComponent, TokenizedType } from '@ng-atomic/core';\n\n@TokenizedType()\n@Directive({\n  standalone: true,\n  selector: 'organisms-action-buttons-section',\n  host: {class: 'organism section'},\n})\nexport class ActionButtonsSectionOrganismStore extends InjectableComponent {\n  readonly actions = input<Action[]>([]);\n  readonly type = input<'basic' | 'raised' | 'stroked' | 'flat' | 'icon' | 'fab' | 'mini-fab'>('raised');\n}\n\n@Component({\n  selector: 'organisms-action-buttons-section',\n  standalone: true,\n  imports: [\n    MatButtonModule,\n  ],\n  template: `\n    @for (action of store.actions(); track action.id) {\n      @switch (store.type()) {\n        @case ('basic') {\n          <button\n            mat-button\n            [color]=\"action.color\"\n            [disabled]=\"action?.disabled\"\n            (click)=\"dispatch(action)\"\n          >{{ action?.name }}</button>\n        }\n        @case ('raised') {\n          <button\n            mat-raised-button\n            [color]=\"action.color\"\n            [disabled]=\"action?.disabled\"\n            (click)=\"dispatch(action)\"\n          >{{ action?.name }}</button>\n        }\n        @case ('stroked') {\n          <button\n            mat-stroked-button\n            [color]=\"action.color\"\n            [disabled]=\"action?.disabled\"\n            (click)=\"dispatch(action)\"\n          >{{ action?.name }}</button>\n        }\n        @case ('flat') {\n          <button\n            mat-flat-button\n            [color]=\"action.color\"\n            [disabled]=\"action?.disabled\"\n            (click)=\"dispatch(action)\"\n          >{{ action?.name }}</button>\n        }\n        @case ('icon') {\n          <button\n            mat-icon-button\n            [color]=\"action.color\"\n            [disabled]=\"action?.disabled\"\n            (click)=\"dispatch(action)\"\n          >{{ action?.name }}</button>\n        }\n      }\n    }\n  `,\n  styleUrls: ['./action-buttons-section.organism.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {class: 'organism section'},\n  hostDirectives: [\n    {\n      directive: ActionButtonsSectionOrganismStore,\n      inputs: ['actions', 'type'],\n    }\n  ]\n})\nexport class ActionButtonsSectionOrganism extends NgAtomicComponent {\n  protected store = inject(ActionButtonsSectionOrganismStore);\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-organisms-action-input-section.mjs

@@ -1,56 +1,70 @@
+import { __decorate } from 'tslib';
 import * as i0 from '@angular/core';
-import { Component, ChangeDetectionStrategy, Input } from '@angular/core';
-import { CommonModule } from '@angular/common';
+import { input, Directive, inject, Component, ChangeDetectionStrategy } from '@angular/core';
 import { ActionInputFieldMolecule } from '@ng-atomic/components/molecules/action-input-field';
 import { FormControl } from '@angular/forms';
-import { NgAtomicComponent } from '@ng-atomic/core';
+import { InjectableComponent, TokenizedType, NgAtomicComponent } from '@ng-atomic/core';
 
+let ActionInputSectionOrganismStore = class ActionInputSectionOrganismStore extends InjectableComponent {
+    constructor() {
+        super(...arguments);
+        this.control = input(new FormControl(''));
+        this.label = input('label');
+        this.placeholder = input('placeholder');
+        this.actions = input([]);
+        this.hint = input(null);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ActionInputSectionOrganismStore, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "17.2.2", type: ActionInputSectionOrganismStore, isStandalone: true, selector: "organisms-action-input-section", inputs: { control: { classPropertyName: "control", publicName: "control", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
+};
+ActionInputSectionOrganismStore = __decorate([
+    TokenizedType()
+], ActionInputSectionOrganismStore);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ActionInputSectionOrganismStore, decorators: [{
+            type: Directive,
+            args: [{ standalone: true, selector: 'organisms-action-input-section' }]
+        }] });
 class ActionInputSectionOrganism extends NgAtomicComponent {
     constructor() {
         super(...arguments);
-        this.control = new FormControl('');
-        this.label = 'label';
-        this.placeholder = 'placeholder';
-        this.actions = [];
+        this.store = inject(ActionInputSectionOrganismStore);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionInputSectionOrganism, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ActionInputSectionOrganism, isStandalone: true, selector: "organisms-action-input-section", inputs: { control: "control", label: "label", placeholder: "placeholder", actions: "actions" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ActionInputSectionOrganism, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.2", type: ActionInputSectionOrganism, isStandalone: true, selector: "organisms-action-input-section", usesInheritance: true, hostDirectives: [{ directive: ActionInputSectionOrganismStore, inputs: ["control", "control", "label", "label", "placeholder", "placeholder", "actions", "actions", "hint", "hint"] }], ngImport: i0, template: `
     <molecules-action-input-field
-      [actions]="actions"
-      [control]="control"
-      [label]="label"
-      [placeholder]="placeholder"
+      [actions]="store.actions()"
+      [control]="store.control()"
+      [label]="store.label()"
+      [placeholder]="store.placeholder()"
+      [hint]="store.hint()"
       (action)="dispatch($event)"
     ></molecules-action-input-field>
-  `, isInline: true, styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-action-input-section-q45D: var(--horizontal-padding)}:host{display:block;width:100%;padding:0 var(--horizontal-padding-SCOPED-IN-action-input-section-q45D);box-sizing:border-box}:host .molecule.input-field,:host mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ActionInputFieldMolecule, selector: "molecules-action-input-field", inputs: ["appearance", "type", "name", "label", "control", "placeholder", "hint", "actions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-action-input-section-m66m: var(--horizontal-padding)}:host{display:block;width:100%;padding:0 var(--horizontal-padding-SCOPED-IN-action-input-section-m66m);box-sizing:border-box}:host .molecule.input-field,:host mat-form-field{width:100%}\n"], dependencies: [{ kind: "component", type: ActionInputFieldMolecule, selector: "molecules-action-input-field", inputs: ["appearance", "type", "name", "label", "control", "placeholder", "hint", "actions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ActionInputSectionOrganism, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.2", ngImport: i0, type: ActionInputSectionOrganism, decorators: [{
             type: Component,
             args: [{ selector: 'organisms-action-input-section', standalone: true, imports: [
-                        CommonModule,
                         ActionInputFieldMolecule,
                     ], template: `
     <molecules-action-input-field
-      [actions]="actions"
-      [control]="control"
-      [label]="label"
-      [placeholder]="placeholder"
+      [actions]="store.actions()"
+      [control]="store.control()"
+      [label]="store.label()"
+      [placeholder]="store.placeholder()"
+      [hint]="store.hint()"
       (action)="dispatch($event)"
     ></molecules-action-input-field>
-  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-action-input-section-q45D: var(--horizontal-padding)}:host{display:block;width:100%;padding:0 var(--horizontal-padding-SCOPED-IN-action-input-section-q45D);box-sizing:border-box}:host .molecule.input-field,:host mat-form-field{width:100%}\n"] }]
-        }], propDecorators: { control: [{
-                type: Input
-            }], label: [{
-                type: Input
-            }], placeholder: [{
-                type: Input
-            }], actions: [{
-                type: Input
-            }] } });
+  `, changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
+                        {
+                            directive: ActionInputSectionOrganismStore,
+                            inputs: ['control', 'label', 'placeholder', 'actions', 'hint'],
+                        }
+                    ], styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-action-input-section-m66m: var(--horizontal-padding)}:host{display:block;width:100%;padding:0 var(--horizontal-padding-SCOPED-IN-action-input-section-m66m);box-sizing:border-box}:host .molecule.input-field,:host mat-form-field{width:100%}\n"] }]
+        }] });
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { ActionInputSectionOrganism };
+export { ActionInputSectionOrganism, ActionInputSectionOrganismStore };
 //# sourceMappingURL=ng-atomic-components-organisms-action-input-section.mjs.map