@ng-atomic/components 3.1.0 → 3.2.0

package/fesm2015/ng-atomic-components-molecules-smart-column.mjs

@@ -1,17 +1,72 @@
 import * as i0 from '@angular/core';
 import { EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, Input, Output, NgModule } from '@angular/core';
-import * as i3 from '@angular/common';
+import * as i2 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i2 from '@angular/material/table';
+import * as i1 from '@angular/material/table';
 import { MatTextColumn, MatTableModule } from '@angular/material/table';
-import * as i1 from '@angular/material/icon';
+import * as i3 from '@angular/material/icon';
 import { MatIconModule } from '@angular/material/icon';
-import * as i4 from '@ng-atomic/common/pipes';
-import { SmartExpModule } from '@ng-atomic/common/pipes';
-import { ElementsModule } from '@ng-atomic/elements';
+import * as i4 from '@ng-atomic/common/pipes/smart-exp';
+import { SmartExpModule } from '@ng-atomic/common/pipes/smart-exp';
 import { toObject } from '@ng-atomic/common/utils';
 import { flatten } from 'flat';
 
+function SmartColumnMolecule_th_1_mat_icon_5_Template(rf, ctx) {
+    if (rf & 1) {
+        i0.ɵɵelementStart(0, "mat-icon", 7);
+        i0.ɵɵtext(1, "south");
+        i0.ɵɵelementEnd();
+    }
+}
+function SmartColumnMolecule_th_1_mat_icon_6_Template(rf, ctx) {
+    if (rf & 1) {
+        i0.ɵɵelementStart(0, "mat-icon", 7);
+        i0.ɵɵtext(1, "north");
+        i0.ɵɵelementEnd();
+    }
+}
+function SmartColumnMolecule_th_1_Template(rf, ctx) {
+    if (rf & 1) {
+        const _r5 = i0.ɵɵgetCurrentView();
+        i0.ɵɵelementStart(0, "th", 3);
+        i0.ɵɵlistener("click", function SmartColumnMolecule_th_1_Template_th_click_0_listener() { i0.ɵɵrestoreView(_r5); const ctx_r4 = i0.ɵɵnextContext(); return ctx_r4.headerClick.emit(); });
+        i0.ɵɵelementStart(1, "p", 4)(2, "span");
+        i0.ɵɵtext(3);
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementContainerStart(4, 5);
+        i0.ɵɵtemplate(5, SmartColumnMolecule_th_1_mat_icon_5_Template, 2, 0, "mat-icon", 6);
+        i0.ɵɵtemplate(6, SmartColumnMolecule_th_1_mat_icon_6_Template, 2, 0, "mat-icon", 6);
+        i0.ɵɵelementContainerEnd();
+        i0.ɵɵelementEnd()();
+    }
+    if (rf & 2) {
+        const ctx_r0 = i0.ɵɵnextContext();
+        i0.ɵɵstyleProp("text-align", ctx_r0.justify);
+        i0.ɵɵadvance(3);
+        i0.ɵɵtextInterpolate(ctx_r0.headerText);
+        i0.ɵɵadvance(1);
+        i0.ɵɵproperty("ngSwitch", ctx_r0.sort);
+        i0.ɵɵadvance(1);
+        i0.ɵɵproperty("ngSwitchCase", "asc");
+        i0.ɵɵadvance(1);
+        i0.ɵɵproperty("ngSwitchCase", "desc");
+    }
+}
+function SmartColumnMolecule_td_2_Template(rf, ctx) {
+    if (rf & 1) {
+        i0.ɵɵelementStart(0, "td", 8)(1, "p", 9);
+        i0.ɵɵtext(2);
+        i0.ɵɵpipe(3, "smartExp");
+        i0.ɵɵelementEnd()();
+    }
+    if (rf & 2) {
+        const data_r6 = ctx.$implicit;
+        const ctx_r1 = i0.ɵɵnextContext();
+        i0.ɵɵstyleProp("text-align", ctx_r1.justify);
+        i0.ɵɵadvance(2);
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(3, 3, ctx_r1.dataAccessor(data_r6, ctx_r1.name), ctx_r1.name));
+    }
+}
 class SmartColumnMolecule extends MatTextColumn {
     constructor() {
         super(...arguments);
@@ -23,27 +78,31 @@ class SmartColumnMolecule extends MatTextColumn {
         this.headerClick = new EventEmitter();
     }
 }
-SmartColumnMolecule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SmartColumnMolecule, deps: null, target: i0.ɵɵFactoryTarget.Component });
-SmartColumnMolecule.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: SmartColumnMolecule, selector: "molecules-smart-column", inputs: { sort: "sort" }, outputs: { headerClick: "headerClick" }, usesInheritance: true, ngImport: i0, template: "<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;\">\n      <span>{{headerText}}</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\" [style.text-align]=\"justify\">\n    <p class=\"nowrap\">{{dataAccessor(data, name) | smartExp:name}}</p>\n  </td>\n</ng-container>", 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] .nowrap,td[mat-cell] .nowrap{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], components: [{ type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i2.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2.MatCellDef, selector: "[matCellDef]" }, { type: i2.MatCell, selector: "mat-cell, td[mat-cell]" }], pipes: { "smartExp": i4.SmartExpPipe }, changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SmartColumnMolecule, decorators: [{
+SmartColumnMolecule.ɵfac = /*@__PURE__*/ function () { let ɵSmartColumnMolecule_BaseFactory; return function SmartColumnMolecule_Factory(t) { return (ɵSmartColumnMolecule_BaseFactory || (ɵSmartColumnMolecule_BaseFactory = i0.ɵɵgetInheritedFactory(SmartColumnMolecule)))(t || SmartColumnMolecule); }; }();
+SmartColumnMolecule.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SmartColumnMolecule, selectors: [["molecules-smart-column"]], inputs: { sort: "sort" }, outputs: { headerClick: "headerClick" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 3, vars: 0, consts: [["matColumnDef", ""], ["mat-header-cell", "", 3, "text-align", "click", 4, "matHeaderCellDef"], ["mat-cell", "", 3, "text-align", 4, "matCellDef"], ["mat-header-cell", "", 3, "click"], [1, "nowrap", 2, "display", "flex", "align-items", "center"], [3, "ngSwitch"], ["class", "order", 4, "ngSwitchCase"], [1, "order"], ["mat-cell", ""], [1, "nowrap"]], template: function SmartColumnMolecule_Template(rf, ctx) {
+        if (rf & 1) {
+            i0.ɵɵelementContainerStart(0, 0);
+            i0.ɵɵtemplate(1, SmartColumnMolecule_th_1_Template, 7, 6, "th", 1);
+            i0.ɵɵtemplate(2, SmartColumnMolecule_td_2_Template, 4, 6, "td", 2);
+            i0.ɵɵelementContainerEnd();
+        }
+    }, directives: [i1.MatColumnDef, i1.MatHeaderCellDef, i1.MatHeaderCell, i2.NgSwitch, i2.NgSwitchCase, i3.MatIcon, i1.MatCellDef, i1.MatCell], pipes: [i4.SmartExpPipe], 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] .nowrap,td[mat-cell] .nowrap{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"], encapsulation: 2 });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SmartColumnMolecule, [{
             type: Component,
             args: [{ selector: 'molecules-smart-column', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, template: "<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;\">\n      <span>{{headerText}}</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\" [style.text-align]=\"justify\">\n    <p class=\"nowrap\">{{dataAccessor(data, name) | smartExp:name}}</p>\n  </td>\n</ng-container>", 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] .nowrap,td[mat-cell] .nowrap{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n"] }]
-        }], propDecorators: { sort: [{
+        }], null, { sort: [{
                 type: Input
             }], headerClick: [{
                 type: Output
-            }] } });
+            }] });
+})();
 
-class SmartColumnModule extends ElementsModule {
+class SmartColumnModule {
 }
-SmartColumnModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SmartColumnModule, deps: null, target: i0.ɵɵFactoryTarget.NgModule });
-SmartColumnModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SmartColumnModule, declarations: [SmartColumnMolecule], imports: [CommonModule,
-        // Pipes
-        SmartExpModule,
-        // Materials
-        MatIconModule,
-        MatTableModule], exports: [SmartColumnMolecule] });
-SmartColumnModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SmartColumnModule, imports: [[
+SmartColumnModule.ɵfac = function SmartColumnModule_Factory(t) { return new (t || SmartColumnModule)(); };
+SmartColumnModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: SmartColumnModule, bootstrap: [SmartColumnMolecule] });
+SmartColumnModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [[
             CommonModule,
             // Pipes
             SmartExpModule,
@@ -51,7 +110,8 @@ SmartColumnModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", versi
             MatIconModule,
             MatTableModule,
         ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SmartColumnModule, decorators: [{
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SmartColumnModule, [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -65,11 +125,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         MatIconModule,
                         MatTableModule,
                     ],
-                    exports: [
-                        SmartColumnMolecule
-                    ]
+                    exports: [SmartColumnMolecule],
+                    bootstrap: [SmartColumnMolecule],
                 }]
-        }] });
+        }], null, null);
+})();
+(function () {
+    (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(SmartColumnModule, { declarations: [SmartColumnMolecule], imports: [CommonModule,
+            // Pipes
+            SmartExpModule,
+            // Materials
+            MatIconModule,
+            MatTableModule], exports: [SmartColumnMolecule] });
+})();
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2015/ng-atomic-components-molecules-smart-column.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-molecules-smart-column.mjs","sources":["../../../../libs/components/molecules/smart-column/smart-column.molecule.ts","../../../../libs/components/molecules/smart-column/smart-column.molecule.html","../../../../libs/components/molecules/smart-column/smart-column.module.ts","../../../../libs/components/molecules/smart-column/ng-atomic-components-molecules-smart-column.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Input, Output, EventEmitter, Component, ViewEncapsulation } from '@angular/core';\nimport { MatTextColumn } from '@angular/material/table';\n// TODO(nontangent): 依存を引き剥がす\nimport { toObject } from '@ng-atomic/common/utils';\nimport { flatten } from 'flat';\n\n@Component({\n  selector: 'molecules-smart-column',\n  templateUrl: './smart-column.molecule.html',\n  styleUrls: ['./smart-column.molecule.scss'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.Default,\n})\nexport class SmartColumnMolecule<T> extends MatTextColumn<T> {\n  dataAccessor = (data: any, name: string): string => {\n    return name.includes('.') ? flatten(toObject(data))?.[name] : data?.[name];\n  }\n  \n  @Input()\n  sort: 'asc' | 'desc' | 'none' = 'none';\n\n  @Output()\n  headerClick = new EventEmitter<void>();\n\n}\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;\">\n      <span>{{headerText}}</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\" [style.text-align]=\"justify\">\n    <p class=\"nowrap\">{{dataAccessor(data, name) | smartExp:name}}</p>\n  </td>\n</ng-container>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatTableModule } from '@angular/material/table';\nimport { MatIconModule } from '@angular/material/icon';\nimport { SmartExpModule } from '@ng-atomic/common/pipes';\nimport { ElementsModule } from '@ng-atomic/elements';\n\nimport { SmartColumnMolecule } from './smart-column.molecule';\n\n@NgModule({\n  declarations: [\n    SmartColumnMolecule,\n  ],\n  imports: [\n    CommonModule,\n    // Pipes\n    SmartExpModule,\n    // Materials\n    MatIconModule,\n    MatTableModule,\n  ],\n  exports: [\n    SmartColumnMolecule\n  ]\n})\nexport class SmartColumnModule extends ElementsModule { }\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-smart-column.mjs","sources":["../../../../libs/components/src/molecules/smart-column/smart-column.molecule.html","../../../../libs/components/src/molecules/smart-column/smart-column.molecule.ts","../../../../libs/components/src/molecules/smart-column/smart-column.module.ts","../../../../libs/components/src/molecules/smart-column/ng-atomic-components-molecules-smart-column.ts"],"sourcesContent":["<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;\">\n      <span>{{headerText}}</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\" [style.text-align]=\"justify\">\n    <p class=\"nowrap\">{{dataAccessor(data, name) | smartExp:name}}</p>\n  </td>\n</ng-container>","import { ChangeDetectionStrategy, Input, Output, EventEmitter, Component, ViewEncapsulation } from '@angular/core';\nimport { MatTextColumn } from '@angular/material/table';\n// TODO(nontangent): 依存を引き剥がす\nimport { toObject } from '@ng-atomic/common/utils';\nimport { flatten } from 'flat';\n\n@Component({\n  selector: 'molecules-smart-column',\n  templateUrl: './smart-column.molecule.html',\n  styleUrls: ['./smart-column.molecule.scss'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.Default,\n})\nexport class SmartColumnMolecule<T> extends MatTextColumn<T> {\n  override dataAccessor = (data: any, name: string): string => {\n    return name.includes('.') ? flatten<object, any>(toObject(data))?.[name] : data?.[name];\n  }\n  \n  @Input()\n  sort: 'asc' | 'desc' | 'none' = 'none';\n\n  @Output()\n  headerClick = new EventEmitter<void>();\n\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatTableModule } from '@angular/material/table';\nimport { MatIconModule } from '@angular/material/icon';\nimport { SmartExpModule } from '@ng-atomic/common/pipes/smart-exp';\nimport { SmartColumnMolecule } from './smart-column.molecule';\n\n\n@NgModule({\n  declarations: [\n    SmartColumnMolecule,\n  ],\n  imports: [\n    CommonModule,\n    // Pipes\n    SmartExpModule,\n    // Materials\n    MatIconModule,\n    MatTableModule,\n  ],\n  exports: [SmartColumnMolecule],\n  bootstrap: [SmartColumnMolecule],\n})\nexport class SmartColumnModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2015/ng-atomic-components-molecules-text-input-field.mjs

@@ -8,8 +8,19 @@ import * as i3 from '@angular/forms';
 import { ReactiveFormsModule } from '@angular/forms';
 import * as i4 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import { ElementsModule } from '@ng-atomic/elements';
 
+function TextInputFieldMolecule_mat_hint_4_Template(rf, ctx) {
+    if (rf & 1) {
+        i0.ɵɵelementStart(0, "mat-hint");
+        i0.ɵɵtext(1);
+        i0.ɵɵelementEnd();
+    }
+    if (rf & 2) {
+        const ctx_r0 = i0.ɵɵnextContext();
+        i0.ɵɵadvance(1);
+        i0.ɵɵtextInterpolate(ctx_r0.hint);
+    }
+}
 class TextInputFieldMolecule {
     constructor() {
         this.type = 'text';
@@ -18,12 +29,30 @@ class TextInputFieldMolecule {
         this.placeholder = 'placeholder';
     }
 }
-TextInputFieldMolecule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TextInputFieldMolecule, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TextInputFieldMolecule.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: TextInputFieldMolecule, selector: "molecules-text-input-field", inputs: { type: "type", name: "name", label: "label", control: "control", placeholder: "placeholder", hint: "hint" }, host: { classAttribute: "molecule field" }, ngImport: i0, template: "<mat-form-field appearance=\"outline\">\n  <mat-label>{{ label }}</mat-label>\n  <input matInput [name]=\"name\" [type]=\"type\" [formControl]=\"control\" [placeholder]=\"placeholder\">\n  <!-- <mat-icon matSuffix>sentiment_very_satisfied</mat-icon> -->\n  <mat-hint *ngIf=\"hint\">{{ hint }}</mat-hint>\n</mat-form-field>", styles: [":host{display:block;width:100%}:host mat-form-field{width:100%}\n"], components: [{ type: i1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i1.MatLabel, selector: "mat-label" }, { type: i2.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"] }, { type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TextInputFieldMolecule, decorators: [{
+TextInputFieldMolecule.ɵfac = function TextInputFieldMolecule_Factory(t) { return new (t || TextInputFieldMolecule)(); };
+TextInputFieldMolecule.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TextInputFieldMolecule, selectors: [["molecules-text-input-field"]], hostAttrs: [1, "molecule", "field"], inputs: { type: "type", name: "name", label: "label", control: "control", placeholder: "placeholder", hint: "hint" }, decls: 5, vars: 6, consts: [["appearance", "outline"], ["matInput", "", 3, "name", "type", "formControl", "placeholder"], [4, "ngIf"]], template: function TextInputFieldMolecule_Template(rf, ctx) {
+        if (rf & 1) {
+            i0.ɵɵelementStart(0, "mat-form-field", 0)(1, "mat-label");
+            i0.ɵɵtext(2);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelement(3, "input", 1);
+            i0.ɵɵtemplate(4, TextInputFieldMolecule_mat_hint_4_Template, 2, 1, "mat-hint", 2);
+            i0.ɵɵelementEnd();
+        }
+        if (rf & 2) {
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate(ctx.label);
+            i0.ɵɵadvance(1);
+            i0.ɵɵproperty("name", ctx.name)("type", ctx.type)("formControl", ctx.control)("placeholder", ctx.placeholder);
+            i0.ɵɵadvance(1);
+            i0.ɵɵproperty("ngIf", ctx.hint);
+        }
+    }, directives: [i1.MatFormField, i1.MatLabel, i2.MatInput, i3.DefaultValueAccessor, i3.NgControlStatus, i3.FormControlDirective, i4.NgIf, i1.MatHint], styles: ["[_nghost-%COMP%]{display:block;width:100%}[_nghost-%COMP%]   mat-form-field[_ngcontent-%COMP%]{width:100%}"], changeDetection: 0 });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TextInputFieldMolecule, [{
             type: Component,
             args: [{ selector: 'molecules-text-input-field', changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'molecule field' }, template: "<mat-form-field appearance=\"outline\">\n  <mat-label>{{ label }}</mat-label>\n  <input matInput [name]=\"name\" [type]=\"type\" [formControl]=\"control\" [placeholder]=\"placeholder\">\n  <!-- <mat-icon matSuffix>sentiment_very_satisfied</mat-icon> -->\n  <mat-hint *ngIf=\"hint\">{{ hint }}</mat-hint>\n</mat-form-field>", styles: [":host{display:block;width:100%}:host mat-form-field{width:100%}\n"] }]
-        }], propDecorators: { type: [{
+        }], null, { type: [{
                 type: Input
             }], name: [{
                 type: Input
@@ -35,24 +64,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 type: Input
             }], hint: [{
                 type: Input
-            }] } });
+            }] });
+})();
 
-class TextInputFieldModule extends ElementsModule {
+class TextInputFieldModule {
 }
-TextInputFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TextInputFieldModule, deps: null, target: i0.ɵɵFactoryTarget.NgModule });
-TextInputFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TextInputFieldModule, declarations: [TextInputFieldMolecule], imports: [CommonModule,
-        ReactiveFormsModule,
-        // Materials
-        // MatFormFieldModule,
-        MatInputModule], exports: [TextInputFieldMolecule] });
-TextInputFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TextInputFieldModule, imports: [[
+TextInputFieldModule.ɵfac = function TextInputFieldModule_Factory(t) { return new (t || TextInputFieldModule)(); };
+TextInputFieldModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: TextInputFieldModule, bootstrap: [TextInputFieldMolecule] });
+TextInputFieldModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [[
             CommonModule,
             ReactiveFormsModule,
             // Materials
             // MatFormFieldModule,
             MatInputModule,
         ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TextInputFieldModule, decorators: [{
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TextInputFieldModule, [{
             type: NgModule,
             args: [{
                     declarations: [TextInputFieldMolecule],
@@ -63,9 +90,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         // MatFormFieldModule,
                         MatInputModule,
                     ],
-                    exports: [TextInputFieldMolecule]
+                    exports: [TextInputFieldMolecule],
+                    bootstrap: [TextInputFieldMolecule],
                 }]
-        }] });
+        }], null, null);
+})();
+(function () {
+    (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(TextInputFieldModule, { declarations: [TextInputFieldMolecule], imports: [CommonModule,
+            ReactiveFormsModule,
+            // Materials
+            // MatFormFieldModule,
+            MatInputModule], exports: [TextInputFieldMolecule] });
+})();
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2015/ng-atomic-components-molecules-text-input-field.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-molecules-text-input-field.mjs","sources":["../../../../libs/components/molecules/text-input-field/text-input-field.molecule.ts","../../../../libs/components/molecules/text-input-field/text-input-field.molecule.html","../../../../libs/components/molecules/text-input-field/text-input-field.module.ts","../../../../libs/components/molecules/text-input-field/ng-atomic-components-molecules-text-input-field.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input } from '@angular/core';\nimport { FormControl } from '@ngneat/reactive-forms';\n\n@Component({\n  selector: 'molecules-text-input-field',\n  templateUrl: './text-input-field.molecule.html',\n  styleUrls: ['./text-input-field.molecule.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {class: 'molecule field'},\n})\nexport class TextInputFieldMolecule {\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 | number>();\n\n  @Input()\n  placeholder = 'placeholder';\n\n  @Input()\n  hint?: string;\n\n}\n","<mat-form-field appearance=\"outline\">\n  <mat-label>{{ label }}</mat-label>\n  <input matInput [name]=\"name\" [type]=\"type\" [formControl]=\"control\" [placeholder]=\"placeholder\">\n  <!-- <mat-icon matSuffix>sentiment_very_satisfied</mat-icon> -->\n  <mat-hint *ngIf=\"hint\">{{ hint }}</mat-hint>\n</mat-form-field>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\n// import { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatInputModule } from '@angular/material/input';\nimport { ElementsModule } from '@ng-atomic/elements';\n\nimport { TextInputFieldMolecule } from './text-input-field.molecule';\n\n\n\n@NgModule({\n  declarations: [TextInputFieldMolecule],\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    // Materials\n    // MatFormFieldModule,\n    MatInputModule,\n  ],\n  exports: [TextInputFieldMolecule]\n})\nexport class TextInputFieldModule extends ElementsModule { }\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-text-input-field.mjs","sources":["../../../../libs/components/src/molecules/text-input-field/text-input-field.molecule.html","../../../../libs/components/src/molecules/text-input-field/text-input-field.molecule.ts","../../../../libs/components/src/molecules/text-input-field/text-input-field.module.ts","../../../../libs/components/src/molecules/text-input-field/ng-atomic-components-molecules-text-input-field.ts"],"sourcesContent":["<mat-form-field appearance=\"outline\">\n  <mat-label>{{ label }}</mat-label>\n  <input matInput [name]=\"name\" [type]=\"type\" [formControl]=\"control\" [placeholder]=\"placeholder\">\n  <!-- <mat-icon matSuffix>sentiment_very_satisfied</mat-icon> -->\n  <mat-hint *ngIf=\"hint\">{{ hint }}</mat-hint>\n</mat-form-field>","import { ChangeDetectionStrategy, Component, Input } from '@angular/core';\nimport { FormControl } from '@ngneat/reactive-forms';\n\n@Component({\n  selector: 'molecules-text-input-field',\n  templateUrl: './text-input-field.molecule.html',\n  styleUrls: ['./text-input-field.molecule.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {class: 'molecule field'},\n})\nexport class TextInputFieldMolecule {\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 | number>();\n\n  @Input()\n  placeholder = 'placeholder';\n\n  @Input()\n  hint?: string;\n\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\n// import { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatInputModule } from '@angular/material/input';\n\nimport { TextInputFieldMolecule } from './text-input-field.molecule';\n\n\n\n@NgModule({\n  declarations: [TextInputFieldMolecule],\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    // Materials\n    // MatFormFieldModule,\n    MatInputModule,\n  ],\n  exports: [TextInputFieldMolecule],\n  bootstrap: [TextInputFieldMolecule],\n})\nexport class TextInputFieldModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2015/ng-atomic-components-molecules-textarea-field.mjs

@@ -5,39 +5,68 @@ import * as i2 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
 import * as i3 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import { ElementsModule } from '@ng-atomic/elements';
 
+function TextareaFieldMolecule_mat_hint_4_Template(rf, ctx) {
+    if (rf & 1) {
+        i0.ɵɵelementStart(0, "mat-hint");
+        i0.ɵɵtext(1);
+        i0.ɵɵelementEnd();
+    }
+    if (rf & 2) {
+        const ctx_r0 = i0.ɵɵnextContext();
+        i0.ɵɵadvance(1);
+        i0.ɵɵtextInterpolate(ctx_r0.hint);
+    }
+}
 class TextareaFieldMolecule {
     constructor() {
         this.label = 'label';
         this.placeholder = 'placeholder';
     }
 }
-TextareaFieldMolecule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TextareaFieldMolecule, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TextareaFieldMolecule.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: TextareaFieldMolecule, selector: "molecules-textarea-field", inputs: { label: "label", hint: "hint", placeholder: "placeholder" }, host: { classAttribute: "molecule field" }, ngImport: i0, template: "<mat-form-field class=\"example-full-width\">\n  <mat-label>{{ label }}</mat-label>\n  <textarea matInput [placeholder]=\"placeholder\" rows=\"10\"></textarea>\n  <mat-hint *ngIf=\"hint\">{{ hint }}</mat-hint>\n</mat-form-field>", styles: [":host{display:block;width:100%}:host mat-form-field{width:100%}\n"], components: [{ type: i1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }], directives: [{ type: i1.MatLabel, selector: "mat-label" }, { type: i2.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"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TextareaFieldMolecule, decorators: [{
+TextareaFieldMolecule.ɵfac = function TextareaFieldMolecule_Factory(t) { return new (t || TextareaFieldMolecule)(); };
+TextareaFieldMolecule.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TextareaFieldMolecule, selectors: [["molecules-textarea-field"]], hostAttrs: [1, "molecule", "field"], inputs: { label: "label", hint: "hint", placeholder: "placeholder" }, decls: 5, vars: 3, consts: [[1, "example-full-width"], ["matInput", "", "rows", "10", 3, "placeholder"], [4, "ngIf"]], template: function TextareaFieldMolecule_Template(rf, ctx) {
+        if (rf & 1) {
+            i0.ɵɵelementStart(0, "mat-form-field", 0)(1, "mat-label");
+            i0.ɵɵtext(2);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelement(3, "textarea", 1);
+            i0.ɵɵtemplate(4, TextareaFieldMolecule_mat_hint_4_Template, 2, 1, "mat-hint", 2);
+            i0.ɵɵelementEnd();
+        }
+        if (rf & 2) {
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate(ctx.label);
+            i0.ɵɵadvance(1);
+            i0.ɵɵproperty("placeholder", ctx.placeholder);
+            i0.ɵɵadvance(1);
+            i0.ɵɵproperty("ngIf", ctx.hint);
+        }
+    }, directives: [i1.MatFormField, i1.MatLabel, i2.MatInput, i3.NgIf, i1.MatHint], styles: ["[_nghost-%COMP%]{display:block;width:100%}[_nghost-%COMP%]   mat-form-field[_ngcontent-%COMP%]{width:100%}"], changeDetection: 0 });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TextareaFieldMolecule, [{
             type: Component,
             args: [{ selector: 'molecules-textarea-field', changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'molecule field' }, template: "<mat-form-field class=\"example-full-width\">\n  <mat-label>{{ label }}</mat-label>\n  <textarea matInput [placeholder]=\"placeholder\" rows=\"10\"></textarea>\n  <mat-hint *ngIf=\"hint\">{{ hint }}</mat-hint>\n</mat-form-field>", styles: [":host{display:block;width:100%}:host mat-form-field{width:100%}\n"] }]
-        }], propDecorators: { label: [{
+        }], null, { label: [{
                 type: Input
             }], hint: [{
                 type: Input
             }], placeholder: [{
                 type: Input
-            }] } });
+            }] });
+})();
 
-class TextareaFieldModule extends ElementsModule {
+class TextareaFieldModule {
 }
-TextareaFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TextareaFieldModule, deps: null, target: i0.ɵɵFactoryTarget.NgModule });
-TextareaFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TextareaFieldModule, declarations: [TextareaFieldMolecule], imports: [CommonModule,
-        // Material
-        MatInputModule], exports: [TextareaFieldMolecule] });
-TextareaFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TextareaFieldModule, imports: [[
+TextareaFieldModule.ɵfac = function TextareaFieldModule_Factory(t) { return new (t || TextareaFieldModule)(); };
+TextareaFieldModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: TextareaFieldModule, bootstrap: [TextareaFieldMolecule] });
+TextareaFieldModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [[
             CommonModule,
             // Material
             MatInputModule,
         ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TextareaFieldModule, decorators: [{
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TextareaFieldModule, [{
             type: NgModule,
             args: [{
                     declarations: [TextareaFieldMolecule],
@@ -46,9 +75,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         // Material
                         MatInputModule,
                     ],
-                    exports: [TextareaFieldMolecule]
+                    exports: [TextareaFieldMolecule],
+                    bootstrap: [TextareaFieldMolecule],
                 }]
-        }] });
+        }], null, null);
+})();
+(function () {
+    (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(TextareaFieldModule, { declarations: [TextareaFieldMolecule], imports: [CommonModule,
+            // Material
+            MatInputModule], exports: [TextareaFieldMolecule] });
+})();
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2015/ng-atomic-components-molecules-textarea-field.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-molecules-textarea-field.mjs","sources":["../../../../libs/components/molecules/textarea-field/textarea-field.molecule.ts","../../../../libs/components/molecules/textarea-field/textarea-field.molecule.html","../../../../libs/components/molecules/textarea-field/textarea-field.module.ts","../../../../libs/components/molecules/textarea-field/ng-atomic-components-molecules-textarea-field.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Input } from '@angular/core';\n\n@Component({\n  selector: 'molecules-textarea-field',\n  templateUrl: './textarea-field.molecule.html',\n  styleUrls: ['./textarea-field.molecule.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {class: 'molecule field'},\n})\nexport class TextareaFieldMolecule {\n\n  @Input()\n  label = 'label';\n\n  @Input()\n  hint?: string;\n\n  @Input()\n  placeholder = 'placeholder';\n\n}\n","<mat-form-field class=\"example-full-width\">\n  <mat-label>{{ label }}</mat-label>\n  <textarea matInput [placeholder]=\"placeholder\" rows=\"10\"></textarea>\n  <mat-hint *ngIf=\"hint\">{{ hint }}</mat-hint>\n</mat-form-field>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatInputModule } from '@angular/material/input';\nimport { ElementsModule } from '@ng-atomic/elements';\n\nimport { TextareaFieldMolecule } from './textarea-field.molecule';\n\n\n@NgModule({\n  declarations: [TextareaFieldMolecule],\n  imports: [\n    CommonModule,\n    // Material\n    MatInputModule,\n  ],\n  exports: [TextareaFieldMolecule]\n})\nexport class TextareaFieldModule extends ElementsModule { }\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-textarea-field.mjs","sources":["../../../../libs/components/src/molecules/textarea-field/textarea-field.molecule.html","../../../../libs/components/src/molecules/textarea-field/textarea-field.molecule.ts","../../../../libs/components/src/molecules/textarea-field/textarea-field.module.ts","../../../../libs/components/src/molecules/textarea-field/ng-atomic-components-molecules-textarea-field.ts"],"sourcesContent":["<mat-form-field class=\"example-full-width\">\n  <mat-label>{{ label }}</mat-label>\n  <textarea matInput [placeholder]=\"placeholder\" rows=\"10\"></textarea>\n  <mat-hint *ngIf=\"hint\">{{ hint }}</mat-hint>\n</mat-form-field>","import { ChangeDetectionStrategy, Component, Input } from '@angular/core';\n\n@Component({\n  selector: 'molecules-textarea-field',\n  templateUrl: './textarea-field.molecule.html',\n  styleUrls: ['./textarea-field.molecule.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {class: 'molecule field'},\n})\nexport class TextareaFieldMolecule {\n\n  @Input()\n  label = 'label';\n\n  @Input()\n  hint?: string;\n\n  @Input()\n  placeholder = 'placeholder';\n\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatInputModule } from '@angular/material/input';\n\nimport { TextareaFieldMolecule } from './textarea-field.molecule';\n\n\n@NgModule({\n  declarations: [TextareaFieldMolecule],\n  imports: [\n    CommonModule,\n    // Material\n    MatInputModule,\n  ],\n  exports: [TextareaFieldMolecule],\n  bootstrap: [TextareaFieldMolecule],\n})\nexport class TextareaFieldModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

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

@@ -1,11 +1,26 @@
 import * as i0 from '@angular/core';
 import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, NgModule } from '@angular/core';
-import * as i2 from '@angular/common';
+import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i1 from '@angular/material/button';
+import * as i2 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
-import { ElementsModule } from '@ng-atomic/elements';
 
+function ActionButtonsSectionOrganism_ng_container_0_Template(rf, ctx) {
+    if (rf & 1) {
+        const _r3 = i0.ɵɵgetCurrentView();
+        i0.ɵɵelementContainerStart(0);
+        i0.ɵɵelementStart(1, "button", 1);
+        i0.ɵɵlistener("click", function ActionButtonsSectionOrganism_ng_container_0_Template_button_click_1_listener() { const restoredCtx = i0.ɵɵrestoreView(_r3); const item_r1 = restoredCtx.$implicit; const ctx_r2 = i0.ɵɵnextContext(); return ctx_r2.actionItemClick.emit([item_r1]); });
+        i0.ɵɵtext(2);
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementContainerEnd();
+    }
+    if (rf & 2) {
+        const item_r1 = ctx.$implicit;
+        i0.ɵɵadvance(2);
+        i0.ɵɵtextInterpolate(item_r1 == null ? null : item_r1.name);
+    }
+}
 class ActionButtonsSectionOrganism {
     constructor() {
         this.actionItems = [];
@@ -13,29 +28,37 @@ class ActionButtonsSectionOrganism {
         this.trackById = (item) => item.id;
     }
 }
-ActionButtonsSectionOrganism.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ActionButtonsSectionOrganism, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ActionButtonsSectionOrganism.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ActionButtonsSectionOrganism, selector: "organisms-action-buttons-section", inputs: { actionItems: "actionItems" }, outputs: { actionItemClick: "actionItemClick" }, host: { classAttribute: "organism section" }, ngImport: i0, template: "<ng-container *ngFor=\"let item of actionItems; trackBy: trackById\">\n  <button mat-raised-button color=\"primary\" (click)=\"actionItemClick.emit([item])\">{{ item?.name }}</button>\n</ng-container>", styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-action-buttons-section-h7LK: var(--horizontal-padding)}:host{display:flex;flex-direction:row;grid-gap:8px;gap:8px;width:100%;padding:0 var(--horizontal-padding-SCOPED-IN-action-buttons-section-h7LK);box-sizing:border-box}:host button{width:100%;height:48px}\n"], components: [{ type: i1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ActionButtonsSectionOrganism, decorators: [{
+ActionButtonsSectionOrganism.ɵfac = function ActionButtonsSectionOrganism_Factory(t) { return new (t || ActionButtonsSectionOrganism)(); };
+ActionButtonsSectionOrganism.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ActionButtonsSectionOrganism, selectors: [["organisms-action-buttons-section"]], hostAttrs: [1, "organism", "section"], inputs: { actionItems: "actionItems" }, outputs: { actionItemClick: "actionItemClick" }, decls: 1, vars: 2, consts: [[4, "ngFor", "ngForOf", "ngForTrackBy"], ["mat-raised-button", "", "color", "primary", 3, "click"]], template: function ActionButtonsSectionOrganism_Template(rf, ctx) {
+        if (rf & 1) {
+            i0.ɵɵtemplate(0, ActionButtonsSectionOrganism_ng_container_0_Template, 3, 1, "ng-container", 0);
+        }
+        if (rf & 2) {
+            i0.ɵɵproperty("ngForOf", ctx.actionItems)("ngForTrackBy", ctx.trackById);
+        }
+    }, directives: [i1.NgForOf, i2.MatButton], styles: ["[_nghost-%COMP%]{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-action-buttons-section-eOAr: var(--horizontal-padding)}[_nghost-%COMP%]{display:flex;flex-direction:row;grid-gap:8px;gap:8px;width:100%;padding:0 var(--horizontal-padding-SCOPED-IN-action-buttons-section-eOAr);box-sizing:border-box}[_nghost-%COMP%]   button[_ngcontent-%COMP%]{width:100%;height:48px}"], changeDetection: 0 });
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ActionButtonsSectionOrganism, [{
             type: Component,
-            args: [{ selector: 'organisms-action-buttons-section', changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'organism section' }, template: "<ng-container *ngFor=\"let item of actionItems; trackBy: trackById\">\n  <button mat-raised-button color=\"primary\" (click)=\"actionItemClick.emit([item])\">{{ item?.name }}</button>\n</ng-container>", styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-action-buttons-section-h7LK: var(--horizontal-padding)}:host{display:flex;flex-direction:row;grid-gap:8px;gap:8px;width:100%;padding:0 var(--horizontal-padding-SCOPED-IN-action-buttons-section-h7LK);box-sizing:border-box}:host button{width:100%;height:48px}\n"] }]
-        }], propDecorators: { actionItems: [{
+            args: [{ selector: 'organisms-action-buttons-section', changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'organism section' }, template: "<ng-container *ngFor=\"let item of actionItems; trackBy: trackById\">\n  <button mat-raised-button color=\"primary\" (click)=\"actionItemClick.emit([item])\">{{ item?.name }}</button>\n</ng-container>", styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-action-buttons-section-eOAr: var(--horizontal-padding)}:host{display:flex;flex-direction:row;grid-gap:8px;gap:8px;width:100%;padding:0 var(--horizontal-padding-SCOPED-IN-action-buttons-section-eOAr);box-sizing:border-box}:host button{width:100%;height:48px}\n"] }]
+        }], null, { actionItems: [{
                 type: Input
             }], actionItemClick: [{
                 type: Output
-            }] } });
+            }] });
+})();
 
-class ActionButtonsSectionModule extends ElementsModule {
+class ActionButtonsSectionModule {
 }
-ActionButtonsSectionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ActionButtonsSectionModule, deps: null, target: i0.ɵɵFactoryTarget.NgModule });
-ActionButtonsSectionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ActionButtonsSectionModule, declarations: [ActionButtonsSectionOrganism], imports: [CommonModule,
-        // Materials
-        MatButtonModule], exports: [ActionButtonsSectionOrganism] });
-ActionButtonsSectionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ActionButtonsSectionModule, imports: [[
+ActionButtonsSectionModule.ɵfac = function ActionButtonsSectionModule_Factory(t) { return new (t || ActionButtonsSectionModule)(); };
+ActionButtonsSectionModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: ActionButtonsSectionModule, bootstrap: [ActionButtonsSectionOrganism] });
+ActionButtonsSectionModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [[
             CommonModule,
             // Materials
             MatButtonModule,
         ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ActionButtonsSectionModule, decorators: [{
+(function () {
+    (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ActionButtonsSectionModule, [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -48,9 +71,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     ],
                     exports: [
                         ActionButtonsSectionOrganism
-                    ]
+                    ],
+                    bootstrap: [
+                        ActionButtonsSectionOrganism,
+                    ],
                 }]
-        }] });
+        }], null, null);
+})();
+(function () {
+    (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(ActionButtonsSectionModule, { declarations: [ActionButtonsSectionOrganism], imports: [CommonModule,
+            // Materials
+            MatButtonModule], exports: [ActionButtonsSectionOrganism] });
+})();
 
 /**
  * Generated bundle index. Do not edit.