@ng-atomic/components 18.2.0 → 18.4.0

package/fesm2022/ng-atomic-components-molecules-list-item.mjs

@@ -0,0 +1,203 @@
+import { __decorate } from 'tslib';
+import * as i0 from '@angular/core';
+import { Pipe, input, Directive, inject, Component, ChangeDetectionStrategy } from '@angular/core';
+import * as i1 from '@angular/material/list';
+import { MatListModule } from '@angular/material/list';
+import { InjectableComponent, _computed, TokenizedType, NgAtomicComponent } from '@ng-atomic/core';
+import { injectDataAccessor, DataAccessorPipe } from '@ng-atomic/common/pipes/data-accessor';
+import * as i2 from '@angular/material/tooltip';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import { makeConfig } from '@ng-atomic/common/services/ui';
+import * as i3 from '@angular/material/core';
+import { MatRippleModule } from '@angular/material/core';
+import * as i4 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
+import * as i5 from '@angular/material/button';
+import { MatButtonModule } from '@angular/material/button';
+
+var ListItemMoleculeStore_1;
+class LinePipe {
+    constructor() {
+        this.dataAccessor = injectDataAccessor();
+    }
+    transform(value) {
+        return [
+            this.dataAccessor(value, 'title'),
+            this.dataAccessor(value, 'description'),
+            this.dataAccessor(value, 'subLine'),
+        ].filter(Boolean).length;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: LinePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.1.2", ngImport: i0, type: LinePipe, isStandalone: true, name: "itemToLines" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: LinePipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'itemToLines',
+                    pure: true,
+                    standalone: true,
+                }]
+        }] });
+var ActionId;
+(function (ActionId) {
+    ActionId["CLICK_ITEM"] = "[@ng-atomic/components/molecules/list] Click Item";
+    ActionId["ITEM_BUTTON_CLICK"] = "[@ng-atomic/components/molecules/list] Item Button Click";
+})(ActionId || (ActionId = {}));
+let ListItemMoleculeStore = class ListItemMoleculeStore extends InjectableComponent {
+    constructor() {
+        super(...arguments);
+        this.config = ListItemMoleculeStore_1.Config.inject();
+        this.item = input();
+        this.actions = input();
+        this.itemActionsType = input(_computed(() => this.config().itemActionsType));
+    }
+    static { ListItemMoleculeStore_1 = this; }
+    static { this.ActionId = ActionId; }
+    static { this.Config = makeConfig(() => {
+        return () => ({
+            items: [],
+            itemActions: [],
+            groupedBy: '',
+            groupKeys: [],
+            itemActionsType: 'menu'
+        });
+    }, ['components', 'molecules', 'list-item']); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: ListItemMoleculeStore, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "18.1.2", type: ListItemMoleculeStore, isStandalone: true, selector: "molecules-list-item", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, itemActionsType: { classPropertyName: "itemActionsType", publicName: "itemActionsType", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
+};
+ListItemMoleculeStore = ListItemMoleculeStore_1 = __decorate([
+    TokenizedType()
+], ListItemMoleculeStore);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: ListItemMoleculeStore, decorators: [{
+            type: Directive,
+            args: [{ standalone: true, selector: 'molecules-list-item' }]
+        }] });
+class ListItemMolecule extends NgAtomicComponent {
+    constructor() {
+        super(...arguments);
+        this.store = inject(ListItemMoleculeStore);
+    }
+    onItemActionsClick(item, $event) {
+        $event.stopPropagation();
+        $event.preventDefault();
+        this.dispatch({ id: ActionId.ITEM_BUTTON_CLICK, payload: item });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: ListItemMolecule, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.2", type: ListItemMolecule, isStandalone: true, selector: "molecules-list-item", usesInheritance: true, hostDirectives: [{ directive: ListItemMoleculeStore, inputs: ["actions", "actions", "item", "item", "itemActionsType", "itemActionsType"] }], ngImport: i0, template: `
+    <mat-list-item
+      [lines]="store.item() | itemToLines"
+      matRipple
+    >
+      <span
+        matListItemTitle
+        [matTooltip]="store.item() | dataAccessor:'title'"
+      >
+        {{ store.item() | dataAccessor:'title' }}
+      </span>
+      @if (store.item() | dataAccessor:'description') {
+        <span matListItemLine>
+          {{ store.item() | dataAccessor:'description' }}
+        </span>
+      }
+      @if(store.item() | dataAccessor:'subLine') {
+        <span matListItemLine>
+          {{ store.item() | dataAccessor:'subLine' }}
+        </span>
+      }
+      @if ((store.actions()); as actions) {
+        <ng-container matListItemMeta>
+          @if (actions.length) {
+            @switch (store.itemActionsType()) {
+              @case ('dispatch') {
+                <button
+                  mat-icon-button
+                  (click)="onItemActionsClick(item, $event)"
+                >
+                  <mat-icon>menu</mat-icon>
+                </button>
+              }
+              @case ('menu') {
+                <atoms-smart-menu-button
+                  [actions]="actions"
+                  (action)="dispatch($event)"
+                />
+              }
+            }
+          }
+        </ng-container>
+      }
+    </mat-list-item>
+  `, isInline: true, styles: [":host{display:block}:host mat-list-item{cursor:pointer;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: MatListModule }, { kind: "component", type: i1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i1.MatListItemLine, selector: "[matListItemLine]" }, { kind: "directive", type: i1.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "directive", type: i1.MatListItemMeta, selector: "[matListItemMeta]" }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatRippleModule }, { kind: "directive", type: i3.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "pipe", type: LinePipe, name: "itemToLines" }, { kind: "pipe", type: DataAccessorPipe, name: "dataAccessor" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: ListItemMolecule, decorators: [{
+            type: Component,
+            args: [{ selector: 'molecules-list-item', standalone: true, imports: [
+                        MatListModule,
+                        MatTooltipModule,
+                        MatRippleModule,
+                        MatIconModule,
+                        MatButtonModule,
+                        LinePipe,
+                        DataAccessorPipe,
+                    ], template: `
+    <mat-list-item
+      [lines]="store.item() | itemToLines"
+      matRipple
+    >
+      <span
+        matListItemTitle
+        [matTooltip]="store.item() | dataAccessor:'title'"
+      >
+        {{ store.item() | dataAccessor:'title' }}
+      </span>
+      @if (store.item() | dataAccessor:'description') {
+        <span matListItemLine>
+          {{ store.item() | dataAccessor:'description' }}
+        </span>
+      }
+      @if(store.item() | dataAccessor:'subLine') {
+        <span matListItemLine>
+          {{ store.item() | dataAccessor:'subLine' }}
+        </span>
+      }
+      @if ((store.actions()); as actions) {
+        <ng-container matListItemMeta>
+          @if (actions.length) {
+            @switch (store.itemActionsType()) {
+              @case ('dispatch') {
+                <button
+                  mat-icon-button
+                  (click)="onItemActionsClick(item, $event)"
+                >
+                  <mat-icon>menu</mat-icon>
+                </button>
+              }
+              @case ('menu') {
+                <atoms-smart-menu-button
+                  [actions]="actions"
+                  (action)="dispatch($event)"
+                />
+              }
+            }
+          }
+        </ng-container>
+      }
+    </mat-list-item>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
+                        {
+                            directive: ListItemMoleculeStore,
+                            inputs: [
+                                'actions',
+                                'item',
+                                'itemActionsType',
+                            ],
+                        },
+                    ], styles: [":host{display:block}:host mat-list-item{cursor:pointer;align-items:center}\n"] }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { LinePipe, ListItemMolecule, ListItemMoleculeStore };
+//# sourceMappingURL=ng-atomic-components-molecules-list-item.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ng-atomic-components-molecules-list-item.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/molecules/list-item/list-item.molecule.ts","../../../../../packages/@ng-atomic/components/src/lib/molecules/list-item/ng-atomic-components-molecules-list-item.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, Directive, inject, input, Pipe } from '@angular/core';\nimport { MatListModule } from '@angular/material/list';\nimport { _computed, Action, Actions, InjectableComponent, NgAtomicComponent } from '@ng-atomic/core'; \nimport { ActionsPipe } from '@ng-atomic/common/pipes/actions';\nimport { DataAccessorPipe, injectDataAccessor } from '@ng-atomic/common/pipes/data-accessor';\nimport { TokenizedType } from '@ng-atomic/core';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { makeConfig } from '@ng-atomic/common/services/ui';\nimport { JsonPipe } from '@angular/common';\nimport { MatRippleModule } from '@angular/material/core';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatButtonModule } from '@angular/material/button';\n\n@Pipe({\n  name: 'itemToLines',\n  pure: true,\n  standalone: true,\n})\nexport class LinePipe {\n  protected dataAccessor = injectDataAccessor();\n\n  transform(value: any): number {\n    return [\n      this.dataAccessor(value, 'title'),\n      this.dataAccessor(value, 'description'),\n      this.dataAccessor(value, 'subLine'),\n    ].filter(Boolean).length;\n  }\n}\n\nenum ActionId {\n  CLICK_ITEM = '[@ng-atomic/components/molecules/list] Click Item',\n  ITEM_BUTTON_CLICK = '[@ng-atomic/components/molecules/list] Item Button Click',\n}\n\n@TokenizedType()\n@Directive({standalone: true, selector: 'molecules-list-item'})\nexport class ListItemMoleculeStore<T> extends InjectableComponent {\n  static readonly ActionId = ActionId;\n  static readonly Config = makeConfig(() => {\n    return () => ({\n      items: <any[]>[],\n      itemActions: <Actions>[],\n      groupedBy: '',\n      groupKeys: <string[]>[],\n      itemActionsType: <'menu' | 'dispatch'>'menu'\n    });\n  }, ['components', 'molecules', 'list-item']);\n  readonly config = ListItemMoleculeStore.Config.inject();\n  readonly item = input<T>();\n  readonly actions = input<Action[]>();\n  readonly itemActionsType = input(_computed(() => this.config().itemActionsType));\n\n}\n\n@Component({\n  selector: 'molecules-list-item',\n  standalone: true,\n  imports: [\n    MatListModule,\n    MatTooltipModule,\n    MatRippleModule,\n    MatIconModule,\n    MatButtonModule,\n    LinePipe,\n    DataAccessorPipe,\n  ],\n  template: `\n    <mat-list-item\n      [lines]=\"store.item() | itemToLines\"\n      matRipple\n    >\n      <span\n        matListItemTitle\n        [matTooltip]=\"store.item() | dataAccessor:'title'\"\n      >\n        {{ store.item() | dataAccessor:'title' }}\n      </span>\n      @if (store.item() | dataAccessor:'description') {\n        <span matListItemLine>\n          {{ store.item() | dataAccessor:'description' }}\n        </span>\n      }\n      @if(store.item() | dataAccessor:'subLine') {\n        <span matListItemLine>\n          {{ store.item() | dataAccessor:'subLine' }}\n        </span>\n      }\n      @if ((store.actions()); as actions) {\n        <ng-container matListItemMeta>\n          @if (actions.length) {\n            @switch (store.itemActionsType()) {\n              @case ('dispatch') {\n                <button\n                  mat-icon-button\n                  (click)=\"onItemActionsClick(item, $event)\"\n                >\n                  <mat-icon>menu</mat-icon>\n                </button>\n              }\n              @case ('menu') {\n                <atoms-smart-menu-button\n                  [actions]=\"actions\"\n                  (action)=\"dispatch($event)\"\n                />\n              }\n            }\n          }\n        </ng-container>\n      }\n    </mat-list-item>\n  `,\n  styleUrl: './list-item.molecule.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  hostDirectives: [\n    {\n      directive: ListItemMoleculeStore,\n      inputs: [\n        'actions',\n        'item',\n        'itemActionsType',\n      ],\n    },\n  ]\n})\nexport class ListItemMolecule<T> extends NgAtomicComponent {\n  protected readonly store = inject(ListItemMoleculeStore);\n\n  protected onItemActionsClick(item: T, $event: Event) {\n    $event.stopPropagation();\n    $event.preventDefault();\n    this.dispatch({id: ActionId.ITEM_BUTTON_CLICK, payload: item});\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-loading-box.mjs

@@ -37,7 +37,7 @@ class LoadingBoxMolecule {
   <div class="loading-dots">
     @for (i of [0, 1, 2]; track $index) { <div class="dot"></div> }
   </div>
-  `, isInline: true, styles: [":host{display:block;--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6: rgba(0, 0, 0, .6);--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6-SCOPED-IN-loading-box-7lSy: var(--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6)}:host{display:flex;width:100%;justify-content:center}:host .initializing{color:var(--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6-SCOPED-IN-loading-box-7lSy);font-size:12px}@keyframes dotFlashing{0%,to{opacity:0}50%{opacity:1}}:host .loading-box{display:flex;justify-content:center;align-items:center;flex-direction:column}:host .loading-dots .dot{height:10px;width:10px;margin:0 5px;background-color:#333;border-radius:50%;display:inline-block;animation:dotFlashing 1s infinite}:host .loading-dots .dot:nth-child(1){animation-delay:0s}:host .loading-dots .dot:nth-child(2){animation-delay:.2s}:host .loading-dots .dot:nth-child(3){animation-delay:.4s}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, styles: [":host{display:block;--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6: rgba(0, 0, 0, .6);--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6-SCOPED-IN-loading-box-ipig: var(--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6)}:host{display:flex;width:100%;justify-content:center}:host .initializing{color:var(--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6-SCOPED-IN-loading-box-ipig);font-size:12px}@keyframes dotFlashing{0%,to{opacity:0}50%{opacity:1}}:host .loading-box{display:flex;justify-content:center;align-items:center;flex-direction:column}:host .loading-dots .dot{height:10px;width:10px;margin:0 5px;background-color:#333;border-radius:50%;display:inline-block;animation:dotFlashing 1s infinite}:host .loading-dots .dot:nth-child(1){animation-delay:0s}:host .loading-dots .dot:nth-child(2){animation-delay:.2s}:host .loading-dots .dot:nth-child(3){animation-delay:.4s}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: LoadingBoxMolecule, decorators: [{
             type: Component,
@@ -51,7 +51,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImpor
                             directive: LoadingBoxMoleculeStore,
                             inputs: ['loadingMessage'],
                         }
-                    ], styles: [":host{display:block;--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6: rgba(0, 0, 0, .6);--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6-SCOPED-IN-loading-box-7lSy: var(--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6)}:host{display:flex;width:100%;justify-content:center}:host .initializing{color:var(--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6-SCOPED-IN-loading-box-7lSy);font-size:12px}@keyframes dotFlashing{0%,to{opacity:0}50%{opacity:1}}:host .loading-box{display:flex;justify-content:center;align-items:center;flex-direction:column}:host .loading-dots .dot{height:10px;width:10px;margin:0 5px;background-color:#333;border-radius:50%;display:inline-block;animation:dotFlashing 1s infinite}:host .loading-dots .dot:nth-child(1){animation-delay:0s}:host .loading-dots .dot:nth-child(2){animation-delay:.2s}:host .loading-dots .dot:nth-child(3){animation-delay:.4s}\n"] }]
+                    ], styles: [":host{display:block;--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6: rgba(0, 0, 0, .6);--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6-SCOPED-IN-loading-box-ipig: var(--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6)}:host{display:flex;width:100%;justify-content:center}:host .initializing{color:var(--mdc-outlined-text-field-label-text-color-SCOPED-IN-definition-list-gBL6-SCOPED-IN-loading-box-ipig);font-size:12px}@keyframes dotFlashing{0%,to{opacity:0}50%{opacity:1}}:host .loading-box{display:flex;justify-content:center;align-items:center;flex-direction:column}:host .loading-dots .dot{height:10px;width:10px;margin:0 5px;background-color:#333;border-radius:50%;display:inline-block;animation:dotFlashing 1s infinite}:host .loading-dots .dot:nth-child(1){animation-delay:0s}:host .loading-dots .dot:nth-child(2){animation-delay:.2s}:host .loading-dots .dot:nth-child(3){animation-delay:.4s}\n"] }]
         }] });
 
 /**

package/fesm2022/ng-atomic-components-molecules-navigation-list-item.mjs

@@ -48,7 +48,7 @@ class NavigationListItemMolecule extends NgAtomicComponent {
         }
       </div>
     </mat-list-item>
-  `, isInline: true, styles: [":host{display:block;--primary-color: #404040;--primary-color-SCOPED-IN-navigation-list-item-P4h1: var(--primary-color);--surface-color: #f0f0f0;--surface-color-SCOPED-IN-navigation-list-item-P4h1: var(--surface-color);--background-color: #f0f0f0;--background-color-SCOPED-IN-navigation-list-item-P4h1: var(--background-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-navigation-list-item-P4h1: var(--on-primary-color);--on-background-color: #404040;--on-background-color-SCOPED-IN-navigation-list-item-P4h1: var(--on-background-color);--on-surface-color: #404040;--on-surface-color-SCOPED-IN-navigation-list-item-P4h1: var(--on-surface-color);--mat-badge-background-color-SCOPED-IN-navigation-list-item-P4h1: var(--mat-badge-background-color)}:host{--mdc-list-list-item-hover-label-text-color: var(--on-background-color);--mdc-list-list-item-label-text-color: var(--on-background-color);--mdc-list-list-item-supporting-text-color: var(--on-background-color);--mat-list-list-item-leading-icon-end-space: 16px}:host [matListItemTitle]{display:flex;align-items:center;gap:4px}:host mat-list-item.activated{background-color:var(--on-background-color-SCOPED-IN-navigation-list-item-P4h1);color:var(--on-surface-color-SCOPED-IN-navigation-list-item-P4h1)}:host mat-list-item.activated atoms-icon{--on-background-color: var(--background-color-SCOPED-IN-navigation-list-item-P4h1)}:host ::ng-deep .mat-list-item .mat-list-item-content{display:flex;align-items:center;grid-gap:8px;padding-top:8px;padding-bottom:8px;cursor:pointer;color:var(--on-background-color-SCOPED-IN-navigation-list-item-P4h1);font-size:12px}:host ::ng-deep .mat-list-item .mat-list-text{padding-left:8px!important}:host *{--background-color: var(--background-color-SCOPED-IN-navigation-list-item-P4h1);--on-background-color: var(--on-background-color-SCOPED-IN-navigation-list-item-P4h1);--surface-color: var(--surface-color-SCOPED-IN-navigation-list-item-P4h1);--on-surface-color: var(--on-surface-color-SCOPED-IN-navigation-list-item-P4h1);--primary-color: var(--on-primary-color-SCOPED-IN-navigation-list-item-P4h1);--on-primary-color: var(--primary-color-SCOPED-IN-navigation-list-item-P4h1)}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i1.MatListItemIcon, selector: "[matListItemIcon]" }, { kind: "directive", type: i1.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "directive", type: i1.MatListItemMeta, selector: "[matListItemMeta]" }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "component", type: IconAtom, selector: "atoms-icon", inputs: ["name", "color"] }, { kind: "component", type: BadgeAtom, selector: "atoms-badge", inputs: ["value"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, styles: [":host{display:block;--primary-color: #404040;--primary-color-SCOPED-IN-navigation-list-item-DgwV: var(--primary-color);--surface-color: #f0f0f0;--surface-color-SCOPED-IN-navigation-list-item-DgwV: var(--surface-color);--background-color: #f0f0f0;--background-color-SCOPED-IN-navigation-list-item-DgwV: var(--background-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-navigation-list-item-DgwV: var(--on-primary-color);--on-background-color: #404040;--on-background-color-SCOPED-IN-navigation-list-item-DgwV: var(--on-background-color);--on-surface-color: #404040;--on-surface-color-SCOPED-IN-navigation-list-item-DgwV: var(--on-surface-color);--mat-badge-background-color-SCOPED-IN-navigation-list-item-DgwV: var(--mat-badge-background-color)}:host{--mdc-list-list-item-hover-label-text-color: var(--on-background-color);--mdc-list-list-item-label-text-color: var(--on-background-color);--mdc-list-list-item-supporting-text-color: var(--on-background-color);--mat-list-list-item-leading-icon-end-space: 16px}:host [matListItemTitle]{display:flex;align-items:center;gap:4px}:host mat-list-item.activated{background-color:var(--on-background-color-SCOPED-IN-navigation-list-item-DgwV);color:var(--on-surface-color-SCOPED-IN-navigation-list-item-DgwV)}:host mat-list-item.activated atoms-icon{--on-background-color: var(--background-color-SCOPED-IN-navigation-list-item-DgwV)}:host ::ng-deep .mat-list-item .mat-list-item-content{display:flex;align-items:center;grid-gap:8px;padding-top:8px;padding-bottom:8px;cursor:pointer;color:var(--on-background-color-SCOPED-IN-navigation-list-item-DgwV);font-size:12px}:host ::ng-deep .mat-list-item .mat-list-text{padding-left:8px!important}:host *{--background-color: var(--background-color-SCOPED-IN-navigation-list-item-DgwV);--on-background-color: var(--on-background-color-SCOPED-IN-navigation-list-item-DgwV);--surface-color: var(--surface-color-SCOPED-IN-navigation-list-item-DgwV);--on-surface-color: var(--on-surface-color-SCOPED-IN-navigation-list-item-DgwV);--primary-color: var(--on-primary-color-SCOPED-IN-navigation-list-item-DgwV);--on-primary-color: var(--primary-color-SCOPED-IN-navigation-list-item-DgwV)}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatListModule }, { kind: "component", type: i1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "directive", type: i1.MatListItemIcon, selector: "[matListItemIcon]" }, { kind: "directive", type: i1.MatListItemTitle, selector: "[matListItemTitle]" }, { kind: "directive", type: i1.MatListItemMeta, selector: "[matListItemMeta]" }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "component", type: IconAtom, selector: "atoms-icon", inputs: ["name", "color"] }, { kind: "component", type: BadgeAtom, selector: "atoms-badge", inputs: ["value"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: NavigationListItemMolecule, decorators: [{
             type: Component,
@@ -79,7 +79,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImpor
                             directive: NavigationListItemMoleculeStore,
                             inputs: ['action', 'selected', 'activated'],
                         },
-                    ], styles: [":host{display:block;--primary-color: #404040;--primary-color-SCOPED-IN-navigation-list-item-P4h1: var(--primary-color);--surface-color: #f0f0f0;--surface-color-SCOPED-IN-navigation-list-item-P4h1: var(--surface-color);--background-color: #f0f0f0;--background-color-SCOPED-IN-navigation-list-item-P4h1: var(--background-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-navigation-list-item-P4h1: var(--on-primary-color);--on-background-color: #404040;--on-background-color-SCOPED-IN-navigation-list-item-P4h1: var(--on-background-color);--on-surface-color: #404040;--on-surface-color-SCOPED-IN-navigation-list-item-P4h1: var(--on-surface-color);--mat-badge-background-color-SCOPED-IN-navigation-list-item-P4h1: var(--mat-badge-background-color)}:host{--mdc-list-list-item-hover-label-text-color: var(--on-background-color);--mdc-list-list-item-label-text-color: var(--on-background-color);--mdc-list-list-item-supporting-text-color: var(--on-background-color);--mat-list-list-item-leading-icon-end-space: 16px}:host [matListItemTitle]{display:flex;align-items:center;gap:4px}:host mat-list-item.activated{background-color:var(--on-background-color-SCOPED-IN-navigation-list-item-P4h1);color:var(--on-surface-color-SCOPED-IN-navigation-list-item-P4h1)}:host mat-list-item.activated atoms-icon{--on-background-color: var(--background-color-SCOPED-IN-navigation-list-item-P4h1)}:host ::ng-deep .mat-list-item .mat-list-item-content{display:flex;align-items:center;grid-gap:8px;padding-top:8px;padding-bottom:8px;cursor:pointer;color:var(--on-background-color-SCOPED-IN-navigation-list-item-P4h1);font-size:12px}:host ::ng-deep .mat-list-item .mat-list-text{padding-left:8px!important}:host *{--background-color: var(--background-color-SCOPED-IN-navigation-list-item-P4h1);--on-background-color: var(--on-background-color-SCOPED-IN-navigation-list-item-P4h1);--surface-color: var(--surface-color-SCOPED-IN-navigation-list-item-P4h1);--on-surface-color: var(--on-surface-color-SCOPED-IN-navigation-list-item-P4h1);--primary-color: var(--on-primary-color-SCOPED-IN-navigation-list-item-P4h1);--on-primary-color: var(--primary-color-SCOPED-IN-navigation-list-item-P4h1)}\n"] }]
+                    ], styles: [":host{display:block;--primary-color: #404040;--primary-color-SCOPED-IN-navigation-list-item-DgwV: var(--primary-color);--surface-color: #f0f0f0;--surface-color-SCOPED-IN-navigation-list-item-DgwV: var(--surface-color);--background-color: #f0f0f0;--background-color-SCOPED-IN-navigation-list-item-DgwV: var(--background-color);--on-primary-color: #f0f0f0;--on-primary-color-SCOPED-IN-navigation-list-item-DgwV: var(--on-primary-color);--on-background-color: #404040;--on-background-color-SCOPED-IN-navigation-list-item-DgwV: var(--on-background-color);--on-surface-color: #404040;--on-surface-color-SCOPED-IN-navigation-list-item-DgwV: var(--on-surface-color);--mat-badge-background-color-SCOPED-IN-navigation-list-item-DgwV: var(--mat-badge-background-color)}:host{--mdc-list-list-item-hover-label-text-color: var(--on-background-color);--mdc-list-list-item-label-text-color: var(--on-background-color);--mdc-list-list-item-supporting-text-color: var(--on-background-color);--mat-list-list-item-leading-icon-end-space: 16px}:host [matListItemTitle]{display:flex;align-items:center;gap:4px}:host mat-list-item.activated{background-color:var(--on-background-color-SCOPED-IN-navigation-list-item-DgwV);color:var(--on-surface-color-SCOPED-IN-navigation-list-item-DgwV)}:host mat-list-item.activated atoms-icon{--on-background-color: var(--background-color-SCOPED-IN-navigation-list-item-DgwV)}:host ::ng-deep .mat-list-item .mat-list-item-content{display:flex;align-items:center;grid-gap:8px;padding-top:8px;padding-bottom:8px;cursor:pointer;color:var(--on-background-color-SCOPED-IN-navigation-list-item-DgwV);font-size:12px}:host ::ng-deep .mat-list-item .mat-list-text{padding-left:8px!important}:host *{--background-color: var(--background-color-SCOPED-IN-navigation-list-item-DgwV);--on-background-color: var(--on-background-color-SCOPED-IN-navigation-list-item-DgwV);--surface-color: var(--surface-color-SCOPED-IN-navigation-list-item-DgwV);--on-surface-color: var(--on-surface-color-SCOPED-IN-navigation-list-item-DgwV);--primary-color: var(--on-primary-color-SCOPED-IN-navigation-list-item-DgwV);--on-primary-color: var(--primary-color-SCOPED-IN-navigation-list-item-DgwV)}\n"] }]
         }] });
 
 /**

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

@@ -44,9 +44,11 @@ class SelectInputFieldMolecule {
     @if (store.hint()) {
       <mat-hint>{{ store.hint() }}</mat-hint>
     }
-    <mat-error>{{ store.control().errors | error }}</mat-error>
+    @if (store.control()?.errors?.length) {
+      <mat-error>{{ store.control().errors | error }}</mat-error>
+    }
   </mat-form-field>
-  `, isInline: true, styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-select-input-field-g9IP: var(--horizontal-padding)}:host{display:block;width:100%}:host mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "pipe", type: ErrorPipe, name: "error" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-select-input-field-yZIB: var(--horizontal-padding)}:host{display:block;width:100%}:host mat-form-field{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "pipe", type: ErrorPipe, name: "error" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImport: i0, type: SelectInputFieldMolecule, decorators: [{
             type: Component,
@@ -68,14 +70,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.2", ngImpor
     @if (store.hint()) {
       <mat-hint>{{ store.hint() }}</mat-hint>
     }
-    <mat-error>{{ store.control().errors | error }}</mat-error>
+    @if (store.control()?.errors?.length) {
+      <mat-error>{{ store.control().errors | error }}</mat-error>
+    }
   </mat-form-field>
   `, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'molecule input-field field' }, hostDirectives: [
                         {
                             directive: SelectInputFieldMoleculeStore,
                             inputs: ['control', 'label', 'appearance', 'options', 'hint', 'placeholder', 'multiple'],
                         },
-                    ], styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-select-input-field-g9IP: var(--horizontal-padding)}:host{display:block;width:100%}:host mat-form-field{width:100%}\n"] }]
+                    ], styles: [":host{--horizontal-padding: 16px;--horizontal-padding-SCOPED-IN-select-input-field-yZIB: var(--horizontal-padding)}:host{display:block;width:100%}:host mat-form-field{width:100%}\n"] }]
         }] });
 
 /**

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

@@ -1 +1 @@
-{"version":3,"file":"ng-atomic-components-molecules-select-input-field.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/molecules/select-input-field/select-input-field.molecule.ts","../../../../../packages/@ng-atomic/components/src/lib/molecules/select-input-field/ng-atomic-components-molecules-select-input-field.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Directive, Input, inject, input } from '@angular/core';\nimport { FormControl, ReactiveFormsModule } from '@angular/forms';\nimport { MatSelectModule } from '@angular/material/select';\nimport { ErrorPipe } from '@ng-atomic/common/pipes/error';\n\nexport interface Option<T> {\n  name: string;\n  value: T;\n}\n\n@Directive({standalone: true})\nexport class SelectInputFieldMoleculeStore<T> {\n  readonly control = input(new FormControl<T>({} as T));\n  readonly label = input('');\n  readonly appearance = input<'outline' | 'fill'>('outline');\n  readonly options = input<Option<T>[]>([]);\n  readonly hint = input(null); \n  readonly placeholder = input(null);\n  readonly multiple = input(false);\n}\n\n@Component({\n  selector: 'molecules-select-input-field',\n  standalone: true,\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    MatSelectModule,\n    ErrorPipe,\n  ],\n  template: `\n  <mat-form-field [appearance]=\"store.appearance()\">\n    <mat-label>{{ store.label() }}</mat-label>\n    <mat-select [formControl]=\"store.control()\" [multiple]=\"store.multiple()\">\n    @for (option of store.options(); track option?.value) {\n      <mat-option [value]=\"option.value\">\n        {{ option.name }}\n      </mat-option>\n    }\n    </mat-select>\n    @if (store.hint()) {\n      <mat-hint>{{ store.hint() }}</mat-hint>\n    }\n    <mat-error>{{ store.control().errors | error }}</mat-error>\n  </mat-form-field>\n  `,\n  styleUrls: ['./select-input-field.molecule.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {class: 'molecule input-field field'},\n  hostDirectives: [\n    {\n      directive: SelectInputFieldMoleculeStore,\n      inputs: ['control', 'label', 'appearance', 'options', 'hint', 'placeholder', 'multiple'],\n    },\n  ],\n})\nexport class SelectInputFieldMolecule<T> {\n  protected readonly store = inject(SelectInputFieldMoleculeStore);\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-select-input-field.mjs","sources":["../../../../../packages/@ng-atomic/components/src/lib/molecules/select-input-field/select-input-field.molecule.ts","../../../../../packages/@ng-atomic/components/src/lib/molecules/select-input-field/ng-atomic-components-molecules-select-input-field.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, Directive, Input, inject, input } from '@angular/core';\nimport { FormControl, ReactiveFormsModule } from '@angular/forms';\nimport { MatSelectModule } from '@angular/material/select';\nimport { ErrorPipe } from '@ng-atomic/common/pipes/error';\n\nexport interface Option<T> {\n  name: string;\n  value: T;\n}\n\n@Directive({standalone: true})\nexport class SelectInputFieldMoleculeStore<T> {\n  readonly control = input(new FormControl<T>({} as T));\n  readonly label = input('');\n  readonly appearance = input<'outline' | 'fill'>('outline');\n  readonly options = input<Option<T>[]>([]);\n  readonly hint = input(null); \n  readonly placeholder = input(null);\n  readonly multiple = input(false);\n}\n\n@Component({\n  selector: 'molecules-select-input-field',\n  standalone: true,\n  imports: [\n    CommonModule,\n    ReactiveFormsModule,\n    MatSelectModule,\n    ErrorPipe,\n  ],\n  template: `\n  <mat-form-field [appearance]=\"store.appearance()\">\n    <mat-label>{{ store.label() }}</mat-label>\n    <mat-select [formControl]=\"store.control()\" [multiple]=\"store.multiple()\">\n    @for (option of store.options(); track option?.value) {\n      <mat-option [value]=\"option.value\">\n        {{ option.name }}\n      </mat-option>\n    }\n    </mat-select>\n    @if (store.hint()) {\n      <mat-hint>{{ store.hint() }}</mat-hint>\n    }\n    @if (store.control()?.errors?.length) {\n      <mat-error>{{ store.control().errors | error }}</mat-error>\n    }\n  </mat-form-field>\n  `,\n  styleUrls: ['./select-input-field.molecule.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {class: 'molecule input-field field'},\n  hostDirectives: [\n    {\n      directive: SelectInputFieldMoleculeStore,\n      inputs: ['control', 'label', 'appearance', 'options', 'hint', 'placeholder', 'multiple'],\n    },\n  ],\n})\nexport class SelectInputFieldMolecule<T> {\n  protected readonly store = inject(SelectInputFieldMoleculeStore);\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}