@elderbyte/ngx-starter 17.1.3 → 17.2.0

package/esm2022/lib/components/overlays/elder-overlay-trigger.directive.mjs

@@ -45,10 +45,10 @@ export class ElderOverlayTriggerDirective {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderOverlayTriggerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderOverlayTriggerDirective, selector: "[elderOverlayTrigger]", inputs: { overlay: ["elderOverlayTrigger", "overlay"], type: ["elderOverlayTriggerType", "type"], enabled: ["elderOverlayTriggerEnabled", "enabled"] }, host: { listeners: { "click": "handleClick($event)", "focus": "handleFocus($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderOverlayTriggerDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderOverlayTriggerDirective, selector: "[elderOverlayTrigger]", inputs: { overlay: ["elderOverlayTrigger", "overlay"], type: ["elderOverlayTriggerType", "type"], enabled: ["elderOverlayTriggerEnabled", "enabled"] }, host: { listeners: { "click": "handleClick($event)", "focus": "handleFocus($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderOverlayTriggerDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderOverlayTriggerDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[elderOverlayTrigger]'

package/esm2022/lib/components/overlays/elder-overlay.component.mjs

@@ -152,14 +152,14 @@ export class ElderOverlayComponent {
         const searchPanelPortal = new TemplatePortal(this.templateRef, this.viewContainer);
         return this._overlayRef.attach(searchPanelPortal);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderOverlayComponent, deps: [{ token: i0.ViewContainerRef }, { token: i1.Overlay }, { token: i1.OverlayPositionBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ElderOverlayComponent, selector: "elder-overlay", inputs: { originX: "originX", originY: "originY", overlayX: "overlayX", overlayY: "overlayY", offsetY: "offsetY", offsetX: "offsetX", backdrop: "backdrop", backdropVisible: "backdropVisible", origin: "origin", positionStrategy: "positionStrategy", overlaySize: "overlaySize" }, outputs: { keydownEvents: "keydownEvents", attachedChange: "attachedChange" }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true, static: true }], exportAs: ["elderOverlay"], ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderOverlayComponent, deps: [{ token: i0.ViewContainerRef }, { token: i1.Overlay }, { token: i1.OverlayPositionBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ElderOverlayComponent, selector: "elder-overlay", inputs: { originX: "originX", originY: "originY", overlayX: "overlayX", overlayY: "overlayY", offsetY: "offsetY", offsetX: "offsetX", backdrop: "backdrop", backdropVisible: "backdropVisible", origin: "origin", positionStrategy: "positionStrategy", overlaySize: "overlaySize" }, outputs: { keydownEvents: "keydownEvents", attachedChange: "attachedChange" }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true, static: true }], exportAs: ["elderOverlay"], ngImport: i0, template: `
     <ng-template>
       <ng-content></ng-content>
     </ng-template>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderOverlayComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderOverlayComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'elder-overlay',

package/esm2022/lib/components/overlays/elder-overlay.module.mjs

@@ -9,17 +9,17 @@ export { ElderOverlayComponent } from './elder-overlay.component';
 export { ElderOverlayTriggerDirective } from './elder-overlay-trigger.directive';
 export { ElderOverlayOriginDirective } from './elder-overlay-origin.directive';
 export class ElderOverlayModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderOverlayModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: ElderOverlayModule, declarations: [ElderOverlayComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderOverlayModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.1", ngImport: i0, type: ElderOverlayModule, declarations: [ElderOverlayComponent,
             ElderOverlayTriggerDirective,
             ElderOverlayOriginDirective], imports: [CommonModule,
             OverlayModule], exports: [ElderOverlayComponent,
             ElderOverlayTriggerDirective,
             ElderOverlayOriginDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderOverlayModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderOverlayModule, imports: [CommonModule,
             OverlayModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderOverlayModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderOverlayModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/esm2022/lib/components/panels/card-panel/elder-card-panel.component.mjs

@@ -2,10 +2,10 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 import * as i0 from "@angular/core";
 export class ElderCardPanelComponent {
     constructor() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderCardPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ElderCardPanelComponent, selector: "elder-card-panel", ngImport: i0, template: "<div class=\"layout-col elder-card-panel\">\n  <ng-content></ng-content>\n</div>\n\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderCardPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ElderCardPanelComponent, selector: "elder-card-panel", ngImport: i0, template: "<div class=\"layout-col elder-card-panel\">\n  <ng-content></ng-content>\n</div>\n\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderCardPanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderCardPanelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-card-panel', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-col elder-card-panel\">\n  <ng-content></ng-content>\n</div>\n\n" }]
         }], ctorParameters: () => [] });

package/esm2022/lib/components/panels/elder-dialog-panel/elder-dialog-panel.component.mjs

@@ -2,10 +2,10 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 import * as i0 from "@angular/core";
 export class ElderDialogPanelComponent {
     constructor() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderDialogPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ElderDialogPanelComponent, selector: "elder-dialog-panel", ngImport: i0, template: "<div class=\"layout-col elder-dialog-panel\">\n  <ng-content></ng-content>\n</div>\n\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderDialogPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ElderDialogPanelComponent, selector: "elder-dialog-panel", ngImport: i0, template: "<div class=\"layout-col elder-dialog-panel\">\n  <ng-content></ng-content>\n</div>\n\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderDialogPanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderDialogPanelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-dialog-panel', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-col elder-dialog-panel\">\n  <ng-content></ng-content>\n</div>\n\n" }]
         }], ctorParameters: () => [] });

package/esm2022/lib/components/panels/elder-panel.module.mjs

@@ -13,8 +13,8 @@ export { ElderDialogPanelComponent } from './elder-dialog-panel/elder-dialog-pan
 export * from './toggle-panel/elder-toggle-panel.component';
 export { ElderTogglePanelTriggerDirective } from './toggle-panel/elder-toggle-panel-trigger.directive';
 export class ElderPanelModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: ElderPanelModule, declarations: [ElderPanelComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.1", ngImport: i0, type: ElderPanelModule, declarations: [ElderPanelComponent,
             ElderCardPanelComponent,
             ElderDialogPanelComponent,
             ElderTogglePanelComponent,
@@ -27,9 +27,9 @@ export class ElderPanelModule {
             ElderTogglePanelPrimaryDirective,
             ElderTogglePanelSecondaryDirective,
             ElderTogglePanelTriggerDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderPanelModule, imports: [CommonModule, MatCommonModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderPanelModule, imports: [CommonModule, MatCommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderPanelModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderPanelModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/esm2022/lib/components/panels/flat/elder-panel.component.mjs

@@ -12,10 +12,10 @@ export class ElderPanelComponent extends _ElderPanelMixinBase {
     constructor(renderer, elementRef) {
         super(renderer, elementRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderPanelComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ElderPanelComponent, selector: "elder-panel, mat-panel", inputs: { color: "color" }, host: { classAttribute: "mat-panel" }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n\n", styles: [".test{padding:10px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderPanelComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ElderPanelComponent, selector: "elder-panel, mat-panel", inputs: { color: "color" }, host: { classAttribute: "mat-panel" }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n\n", styles: [".test{padding:10px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderPanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderPanelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-panel, mat-panel', inputs: ['color'], host: {
                         'class': 'mat-panel',

package/esm2022/lib/components/panels/toggle-panel/elder-toggle-panel-trigger.directive.mjs

@@ -42,10 +42,10 @@ export class ElderTogglePanelTriggerDirective {
             this.panel.toggle();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderTogglePanelTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderTogglePanelTriggerDirective, selector: "[elderTogglePanelTrigger]", inputs: { panel: ["elderTogglePanelTrigger", "panel"], type: ["elderTogglePanelTriggerType", "type"], enabled: ["elderTogglePanelTriggerEnabled", "enabled"] }, host: { listeners: { "click": "handleClick($event)", "focus": "handleFocus($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderTogglePanelTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderTogglePanelTriggerDirective, selector: "[elderTogglePanelTrigger]", inputs: { panel: ["elderTogglePanelTrigger", "panel"], type: ["elderTogglePanelTriggerType", "type"], enabled: ["elderTogglePanelTriggerEnabled", "enabled"] }, host: { listeners: { "click": "handleClick($event)", "focus": "handleFocus($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderTogglePanelTriggerDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderTogglePanelTriggerDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[elderTogglePanelTrigger]'

package/esm2022/lib/components/panels/toggle-panel/elder-toggle-panel.component.mjs

@@ -8,10 +8,10 @@ export class ElderTogglePanelPrimaryDirective {
         this.templateRef = templateRef;
         this.viewContainer = viewContainer;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderTogglePanelPrimaryDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderTogglePanelPrimaryDirective, selector: "[elderTogglePanelPrimary]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderTogglePanelPrimaryDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderTogglePanelPrimaryDirective, selector: "[elderTogglePanelPrimary]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderTogglePanelPrimaryDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderTogglePanelPrimaryDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[elderTogglePanelPrimary]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }] });
@@ -20,10 +20,10 @@ export class ElderTogglePanelSecondaryDirective {
         this.templateRef = templateRef;
         this.viewContainer = viewContainer;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderTogglePanelSecondaryDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderTogglePanelSecondaryDirective, selector: "[elderTogglePanelSecondary]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderTogglePanelSecondaryDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderTogglePanelSecondaryDirective, selector: "[elderTogglePanelSecondary]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderTogglePanelSecondaryDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderTogglePanelSecondaryDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[elderTogglePanelSecondary]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }] });
@@ -52,10 +52,10 @@ export class ElderTogglePanelComponent {
         this.logger.debug('Toggling elder-toggle-panel');
         this.showPrimary$.next(!this.showPrimary$.getValue());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderTogglePanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ElderTogglePanelComponent, selector: "elder-toggle-panel", queries: [{ propertyName: "primaryPanel", first: true, predicate: ElderTogglePanelPrimaryDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "secondaryPanel", first: true, predicate: ElderTogglePanelSecondaryDirective, descendants: true, read: TemplateRef, static: true }], exportAs: ["elderTogglePanel"], ngImport: i0, template: "\n<div class=\"layout-col full\">\n\n  <ng-container\n    *ngIf=\"showPrimary$ | async; then primaryPanel; else secondaryPanel\">\n  </ng-container>\n\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderTogglePanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ElderTogglePanelComponent, selector: "elder-toggle-panel", queries: [{ propertyName: "primaryPanel", first: true, predicate: ElderTogglePanelPrimaryDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "secondaryPanel", first: true, predicate: ElderTogglePanelSecondaryDirective, descendants: true, read: TemplateRef, static: true }], exportAs: ["elderTogglePanel"], ngImport: i0, template: "\n<div class=\"layout-col full\">\n\n  <ng-container\n    *ngIf=\"showPrimary$ | async; then primaryPanel; else secondaryPanel\">\n  </ng-container>\n\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderTogglePanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderTogglePanelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-toggle-panel', exportAs: 'elderTogglePanel', changeDetection: ChangeDetectionStrategy.OnPush, template: "\n<div class=\"layout-col full\">\n\n  <ng-container\n    *ngIf=\"showPrimary$ | async; then primaryPanel; else secondaryPanel\">\n  </ng-container>\n\n</div>\n" }]
         }], propDecorators: { primaryPanel: [{

package/esm2022/lib/components/scrollbar/elder-scrollbar.directive.mjs

@@ -48,10 +48,10 @@ export class ElderScrollbarDirective extends ElderClassHostBindingBase {
     static buildClass(size) {
         return `scrollbar-${size}`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderScrollbarDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderScrollbarDirective, selector: "[elderScrollbar]", inputs: { size: "size" }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderScrollbarDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderScrollbarDirective, selector: "[elderScrollbar]", inputs: { size: "size" }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderScrollbarDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderScrollbarDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[elderScrollbar]'

package/esm2022/lib/components/scrollbar/elder-scrollbar.module.mjs

@@ -3,11 +3,11 @@ import { ElderScrollbarDirective } from './elder-scrollbar.directive';
 import * as i0 from "@angular/core";
 export { ElderScrollbarDirective } from './elder-scrollbar.directive';
 export class ElderScrollbarModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderScrollbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: ElderScrollbarModule, declarations: [ElderScrollbarDirective], exports: [ElderScrollbarDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderScrollbarModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderScrollbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.1", ngImport: i0, type: ElderScrollbarModule, declarations: [ElderScrollbarDirective], exports: [ElderScrollbarDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderScrollbarModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderScrollbarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderScrollbarModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ElderScrollbarDirective],

package/esm2022/lib/components/select/auto/elder-auto-select-first.directive.mjs

@@ -62,10 +62,10 @@ export class ElderAutoSelectFirstDirective {
             this.log.warn('Conflict avoided: Aborted auto selection because value id already present!');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderAutoSelectFirstDirective, deps: [{ token: i1.ElderSelectComponent }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderAutoSelectFirstDirective, selector: "[autoSelectFirst]", inputs: { autoSelectFirstEnabled: ["autoSelectFirst", "autoSelectFirstEnabled"] }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderAutoSelectFirstDirective, deps: [{ token: i1.ElderSelectComponent }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderAutoSelectFirstDirective, selector: "[autoSelectFirst]", inputs: { autoSelectFirstEnabled: ["autoSelectFirst", "autoSelectFirstEnabled"] }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderAutoSelectFirstDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderAutoSelectFirstDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[autoSelectFirst]'

package/esm2022/lib/components/select/elder-select-base.mjs

@@ -261,10 +261,10 @@ export class ElderSelectBase extends ElderFormFieldControlBase {
         }
         return String(value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderSelectBase, inputs: { cleanUp: "cleanUp", pageSize: "pageSize", queryFilter: "queryFilter", sorts: "sorts", icon: "icon", isOptionDisabledFn: "isOptionDisabledFn", isOptionHiddenFn: "isOptionHiddenFn", valueAsId: "valueAsId", displayProperty: "displayProperty", displayPropertyResolver: "displayPropertyResolver", filters: "filters", dataSource: "dataSource", data: "data", valueTemplate: "valueTemplate" }, outputs: { currentClicked: "currentClicked" }, queries: [{ propertyName: "valueTemplateQuery", first: true, predicate: ElderSelectValueDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "selectionPopup", first: true, predicate: SelectionModelPopupDirective, descendants: true }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderSelectBase, inputs: { cleanUp: "cleanUp", pageSize: "pageSize", queryFilter: "queryFilter", sorts: "sorts", icon: "icon", isOptionDisabledFn: "isOptionDisabledFn", isOptionHiddenFn: "isOptionHiddenFn", valueAsId: "valueAsId", displayProperty: "displayProperty", displayPropertyResolver: "displayPropertyResolver", filters: "filters", dataSource: "dataSource", data: "data", valueTemplate: "valueTemplate" }, outputs: { currentClicked: "currentClicked" }, queries: [{ propertyName: "valueTemplateQuery", first: true, predicate: ElderSelectValueDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "selectionPopup", first: true, predicate: SelectionModelPopupDirective, descendants: true }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectBase, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: i0.NgZone }, { type: i0.ElementRef }, { type: undefined }, { type: i1.FocusMonitor }, { type: i2.TranslateService }, { type: i3.NgControl }], propDecorators: { cleanUp: [{
                 type: Input

package/esm2022/lib/components/select/elder-select-chip.directive.mjs

@@ -5,10 +5,10 @@ export class ElderSelectChipDirective {
         this.templateRef = templateRef;
         this.viewContainer = viewContainer;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectChipDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderSelectChipDirective, selector: "[elderSelectChip]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectChipDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderSelectChipDirective, selector: "[elderSelectChip]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectChipDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectChipDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[elderSelectChip]'
@@ -19,10 +19,10 @@ export class ElderSelectChipAvatarDirective {
         this.templateRef = templateRef;
         this.viewContainer = viewContainer;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectChipAvatarDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderSelectChipAvatarDirective, selector: "[elderSelectChipAvatar]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectChipAvatarDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderSelectChipAvatarDirective, selector: "[elderSelectChipAvatar]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectChipAvatarDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectChipAvatarDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[elderSelectChipAvatar]'
@@ -33,10 +33,10 @@ export class ElderSelectCustomInputDirective {
         this.templateRef = templateRef;
         this.viewContainer = viewContainer;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectCustomInputDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderSelectCustomInputDirective, selector: "[elderCustomInput]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectCustomInputDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderSelectCustomInputDirective, selector: "[elderCustomInput]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectCustomInputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectCustomInputDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[elderCustomInput]'

package/esm2022/lib/components/select/elder-select-on-tab.directive.mjs

@@ -107,10 +107,10 @@ export class ElderSelectOnTabDirective {
             return entity;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectOnTabDirective, deps: [{ token: i1.MatAutocompleteTrigger }, { token: ELDER_SELECT_BASE, skipSelf: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderSelectOnTabDirective, selector: "[elderSelectOnTab]", host: { listeners: { "keydown.arrowup": "onOptionSelect()", "keydown.arrowdown": "onOptionSelect()", "keydown.tab": "onBlur()" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectOnTabDirective, deps: [{ token: i1.MatAutocompleteTrigger }, { token: ELDER_SELECT_BASE, skipSelf: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderSelectOnTabDirective, selector: "[elderSelectOnTab]", host: { listeners: { "keydown.arrowup": "onOptionSelect()", "keydown.arrowdown": "onOptionSelect()", "keydown.tab": "onBlur()" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectOnTabDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectOnTabDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[elderSelectOnTab]'

package/esm2022/lib/components/select/elder-select-value.directive.mjs

@@ -5,10 +5,10 @@ export class ElderSelectValueDirective {
         this.templateRef = templateRef;
         this.viewContainer = viewContainer;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectValueDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderSelectValueDirective, selector: "[elderSelectValue]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectValueDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderSelectValueDirective, selector: "[elderSelectValue]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectValueDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectValueDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[elderSelectValue]' }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }] });

package/esm2022/lib/components/select/elder-select.module.mjs

@@ -47,8 +47,8 @@ export { ElderMultiSelectChipOptionsComponent } from './multi/elder-multi-select
 export { ElderAutoSelectFirstDirective } from './auto/elder-auto-select-first.directive';
 export { ElderClearSelectDirective } from './single/elder-clear-select.directive';
 export class ElderSelectModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectModule, declarations: [ElderSelectComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectModule, declarations: [ElderSelectComponent,
             ElderSelectValueDirective,
             TemplatedSelectionDialogComponent,
             SelectionModelPopupDirective,
@@ -85,7 +85,7 @@ export class ElderSelectModule {
             ElderClearSelectDirective,
             ElderSelectCustomInputDirective,
             ElderMultiSelectChipOptionsComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectModule, imports: [CommonModule, FormsModule, ReactiveFormsModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectModule, imports: [CommonModule, FormsModule, ReactiveFormsModule,
             MatFormFieldModule,
             MatIconModule,
             MatSelectModule,
@@ -99,7 +99,7 @@ export class ElderSelectModule {
             ElderAutocompleteModule,
             ElderPipesModule, ElderThemeModule, ElderChipsModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/esm2022/lib/components/select/multi/elder-multi-select-base.mjs

@@ -345,10 +345,10 @@ export class ElderMultiSelectBase extends ElderSelectBase {
         }
         return entities;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderMultiSelectBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderMultiSelectBase, inputs: { entitiesSorts: "entitiesSorts", confirmRemoval: "confirmRemoval", entities: "entities", entityIds: "entityIds" }, outputs: { entityIdsChange: "entityIdsChange", entitiesChange: "entitiesChange", entityIdsUpdated: "entityIdsUpdated", entitiesUpdated: "entitiesUpdated" }, host: { properties: { "class": "this.hostClass", "class.mat-select-disabled": "this.disabledClass", "class.mat-select-invalid": "this.errorStateClass", "class.mat-select-required": "this.requiredClass", "class.mat-select-empty": "this.emptyClass" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderMultiSelectBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderMultiSelectBase, inputs: { entitiesSorts: "entitiesSorts", confirmRemoval: "confirmRemoval", entities: "entities", entityIds: "entityIds" }, outputs: { entityIdsChange: "entityIdsChange", entitiesChange: "entitiesChange", entityIdsUpdated: "entityIdsUpdated", entitiesUpdated: "entitiesUpdated" }, host: { properties: { "class": "this.hostClass", "class.mat-select-disabled": "this.disabledClass", "class.mat-select-invalid": "this.errorStateClass", "class.mat-select-required": "this.requiredClass", "class.mat-select-empty": "this.emptyClass" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderMultiSelectBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderMultiSelectBase, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: i0.NgZone }, { type: i0.ElementRef }, { type: undefined }, { type: i1.FocusMonitor }, { type: i2.TranslateService }, { type: i3.ElderDialogService }, { type: i4.NgControl }], propDecorators: { entitiesSorts: [{
                 type: Input

package/esm2022/lib/components/select/multi/elder-multi-select-chip-options/elder-multi-select-chip-options.component.mjs

@@ -234,16 +234,16 @@ export class ElderMultiSelectChipOptionsComponent extends ElderMultiSelectBase {
             themeColor: selected ? 'accent' : undefined
         }, locked, chipSpec.avatarSpec, chipSpec.trailingSpec, selected);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderMultiSelectChipOptionsComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i1.FocusMonitor }, { token: i2.TranslateService }, { token: i3.ElderDialogService }, { token: i4.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ElderMultiSelectChipOptionsComponent, selector: "elder-multi-select-chip-options", inputs: { defaultChipSpec: "defaultChipSpec", chipSpecFn: "chipSpecFn", stacked: "stacked", multiple: "multiple", chipTemplate: "chipTemplate", chipAvatarTemplate: "chipAvatarTemplate" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderMultiSelectChipOptionsComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i1.FocusMonitor }, { token: i2.TranslateService }, { token: i3.ElderDialogService }, { token: i4.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ElderMultiSelectChipOptionsComponent, selector: "elder-multi-select-chip-options", inputs: { defaultChipSpec: "defaultChipSpec", chipSpecFn: "chipSpecFn", stacked: "stacked", multiple: "multiple", chipTemplate: "chipTemplate", chipAvatarTemplate: "chipAvatarTemplate" }, providers: [
             { provide: MatFormFieldControl, useExisting: ElderMultiSelectChipOptionsComponent },
             {
                 provide: ELDER_SELECT_BASE,
                 useExisting: forwardRef(() => ElderMultiSelectChipOptionsComponent)
             }
-        ], queries: [{ propertyName: "chipTemplateQuery", first: true, predicate: ElderSelectChipDirective, descendants: true, read: TemplateRef }, { propertyName: "chipAvatarTemplateQuery", first: true, predicate: ElderSelectChipAvatarDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "_listBox", first: true, predicate: MatChipListbox, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"(selectChips$ | async) as chipValues\"\n     class=\"elder-flex-control\"\n     [matTooltip]=\"(state$ | async)?.error\"\n>\n  <mat-chip-listbox #chips\n                    [class.mat-mdc-chip-set-stacked]=\"stacked\"\n                    [multiple]=\"multiple\"\n  >\n\n    <ng-container *ngIf=\"(mergedState$ | async) as state\">\n      <div *ngIf=\"icon\"\n           class=\"elder-input-prefix-icon-container flex-none\"\n      >\n        <mat-icon *ngIf=\"icon\" disabled\n                  class=\"elder-prefix-icon elder-mdc-control-icon elder-icon-small noselect\"\n                  [class.loading]=\"state.loading\"\n        >\n          {{icon}}\n        </mat-icon>\n      </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"templates$ | async as templates\">\n\n      <mat-chip-option  *ngFor=\"let chipModel of chipValues\"\n                       class=\"noselect\"\n                       [value]=\"resolveChipValue(chipModel.value)\"\n                        elderChipLabel\n                        [levelColor]=\"chipModel.colorSpec?.levelColor\"\n                        [stateColor]=\"chipModel.colorSpec?.stateColor\"\n                       [color]=\"chipModel.colorSpec?.themeColor\"\n                       [selectable]=\"!chipModel.locked\"\n                       [disabled]=\"chipModel.locked\"\n                       [selected]=\"chipModel.selected\"\n                       (selectionChange)=\"selectionChanged($event, chipModel.value)\"\n      >\n\n        <mat-chip-avatar\n          *ngIf=\"templates.avatar && !chipModel.avatarSpec?.hide\"\n          [class.chip-avatar-xl]=\"chipModel.avatarSpec?.large\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"templates.avatar; context: {$implicit: chipModel}\">\n          </ng-container>\n        </mat-chip-avatar>\n\n        <ng-container\n          *ngTemplateOutlet=\"templates.chip || simpleChipTemplate; context: {$implicit: chipModel}\">\n        </ng-container>\n\n        <mat-icon matChipTrailingIcon class=\"elder-trailing-icon\"\n                  *ngIf=\"chipModel.trailingSpec?.icon\"\n                  [fontSet]=\"chipModel.trailingSpec?.iconFontSet\"\n        >{{chipModel.trailingSpec?.icon}}</mat-icon>\n\n\n      </mat-chip-option>\n\n      <div class=\"layout-row place-start-center elder-chip-input\">\n\n        <button mat-icon-button type=\"button\" class=\"elder-control-icon-button elder-browse-icon\"\n                *ngIf=\"selectionPopup\"\n                [disabled]=\"isLocked\"\n                (click)=\"openSelectionPopup($event)\" aria-label=\"Search\"\n                elderStopEventPropagation\n                tabIndex=\"-1\"\n        >\n          <mat-icon class=\"elder-mdc-control-icon\">search</mat-icon>\n        </button>\n      </div>\n    </ng-container>\n  </mat-chip-listbox>\n</div>\n\n<ng-template #simpleChipTemplate let-chipModel>\n  <span class=\"elder-chip-text\">{{chipModel.displayText | elderTruncate:20}}</span>\n</ng-template>\n\n", styles: [".elder-chip-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.elder-trailing-icon{color:var(--mdc-chip-with-trailing-icon-trailing-icon-color);opacity:.54}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i8.MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "component", type: i8.MatChipListbox, selector: "mat-chip-listbox", inputs: ["tabIndex", "multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "component", type: i8.MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["color", "disabled", "disableRipple", "tabIndex", "selectable", "selected"], outputs: ["selectionChange"] }, { kind: "directive", type: i8.MatChipTrailingIcon, selector: "mat-chip-trailing-icon, [matChipTrailingIcon]" }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i10.ElderStopEventPropagationDirective, selector: "[elderStopEventPropagation]" }, { kind: "directive", type: i11.ElderChipLabelDirective, selector: "[elderChipLabel]", inputs: ["appearance", "color", "stateColor", "levelColor"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i12.ElderTruncatePipe, name: "elderTruncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], queries: [{ propertyName: "chipTemplateQuery", first: true, predicate: ElderSelectChipDirective, descendants: true, read: TemplateRef }, { propertyName: "chipAvatarTemplateQuery", first: true, predicate: ElderSelectChipAvatarDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "_listBox", first: true, predicate: MatChipListbox, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"(selectChips$ | async) as chipValues\"\n     class=\"elder-flex-control\"\n     [matTooltip]=\"(state$ | async)?.error\"\n>\n  <mat-chip-listbox #chips\n                    [class.mat-mdc-chip-set-stacked]=\"stacked\"\n                    [multiple]=\"multiple\"\n  >\n\n    <ng-container *ngIf=\"(mergedState$ | async) as state\">\n      <div *ngIf=\"icon\"\n           class=\"elder-input-prefix-icon-container flex-none\"\n      >\n        <mat-icon *ngIf=\"icon\" disabled\n                  class=\"elder-prefix-icon elder-mdc-control-icon elder-icon-small noselect\"\n                  [class.loading]=\"state.loading\"\n        >\n          {{icon}}\n        </mat-icon>\n      </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"templates$ | async as templates\">\n\n      <mat-chip-option  *ngFor=\"let chipModel of chipValues\"\n                       class=\"noselect\"\n                       [value]=\"resolveChipValue(chipModel.value)\"\n                        elderChipLabel\n                        [levelColor]=\"chipModel.colorSpec?.levelColor\"\n                        [stateColor]=\"chipModel.colorSpec?.stateColor\"\n                       [color]=\"chipModel.colorSpec?.themeColor\"\n                       [selectable]=\"!chipModel.locked\"\n                       [disabled]=\"chipModel.locked\"\n                       [selected]=\"chipModel.selected\"\n                       (selectionChange)=\"selectionChanged($event, chipModel.value)\"\n      >\n\n        <mat-chip-avatar\n          *ngIf=\"templates.avatar && !chipModel.avatarSpec?.hide\"\n          [class.chip-avatar-xl]=\"chipModel.avatarSpec?.large\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"templates.avatar; context: {$implicit: chipModel}\">\n          </ng-container>\n        </mat-chip-avatar>\n\n        <ng-container\n          *ngTemplateOutlet=\"templates.chip || simpleChipTemplate; context: {$implicit: chipModel}\">\n        </ng-container>\n\n        <mat-icon matChipTrailingIcon class=\"elder-trailing-icon\"\n                  *ngIf=\"chipModel.trailingSpec?.icon\"\n                  [fontSet]=\"chipModel.trailingSpec?.iconFontSet\"\n        >{{chipModel.trailingSpec?.icon}}</mat-icon>\n\n\n      </mat-chip-option>\n\n      <div class=\"layout-row place-start-center elder-chip-input\">\n\n        <button mat-icon-button type=\"button\" class=\"elder-control-icon-button elder-browse-icon\"\n                *ngIf=\"selectionPopup\"\n                [disabled]=\"isLocked\"\n                (click)=\"openSelectionPopup($event)\" aria-label=\"Search\"\n                elderStopEventPropagation\n                tabIndex=\"-1\"\n        >\n          <mat-icon class=\"elder-mdc-control-icon\">search</mat-icon>\n        </button>\n      </div>\n    </ng-container>\n  </mat-chip-listbox>\n</div>\n\n<ng-template #simpleChipTemplate let-chipModel>\n  <span class=\"elder-chip-text\">{{chipModel.displayText | elderTruncate:20}}</span>\n</ng-template>\n\n", styles: [".elder-chip-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.elder-trailing-icon{color:var(--mdc-chip-with-trailing-icon-trailing-icon-color);opacity:.54}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i8.MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "component", type: i8.MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "component", type: i8.MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["selectable", "selected"], outputs: ["selectionChange"] }, { kind: "directive", type: i8.MatChipTrailingIcon, selector: "mat-chip-trailing-icon, [matChipTrailingIcon]" }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i10.ElderStopEventPropagationDirective, selector: "[elderStopEventPropagation]" }, { kind: "directive", type: i11.ElderChipLabelDirective, selector: "[elderChipLabel]", inputs: ["appearance", "color", "stateColor", "levelColor"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i12.ElderTruncatePipe, name: "elderTruncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderMultiSelectChipOptionsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderMultiSelectChipOptionsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-multi-select-chip-options', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         { provide: MatFormFieldControl, useExisting: ElderMultiSelectChipOptionsComponent },

package/esm2022/lib/components/select/multi/elder-multi-select-chips/elder-multi-select-chips.component.mjs

@@ -187,16 +187,16 @@ export class ElderMultiSelectChipsComponent extends ElderMultiSelectBase {
         }
         return new ChipModel(e, dPR(e), chipSpec?.colorSpec, removable, chipSpec.avatarSpec, chipSpec.trailingSpec);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderMultiSelectChipsComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i1.FocusMonitor }, { token: i2.TranslateService }, { token: i3.ElderDialogService }, { token: i4.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ElderMultiSelectChipsComponent, selector: "elder-multi-select-chips", inputs: { defaultChipSpec: "defaultChipSpec", chipSpecFn: "chipSpecFn", allowRemove: "allowRemove", allowSorting: "allowSorting", stacked: "stacked", chipTemplate: "chipTemplate", chipAvatarTemplate: "chipAvatarTemplate", customInputTemplate: "customInputTemplate" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderMultiSelectChipsComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i1.FocusMonitor }, { token: i2.TranslateService }, { token: i3.ElderDialogService }, { token: i4.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.1", type: ElderMultiSelectChipsComponent, selector: "elder-multi-select-chips", inputs: { defaultChipSpec: "defaultChipSpec", chipSpecFn: "chipSpecFn", allowRemove: "allowRemove", allowSorting: "allowSorting", stacked: "stacked", chipTemplate: "chipTemplate", chipAvatarTemplate: "chipAvatarTemplate", customInputTemplate: "customInputTemplate" }, providers: [
             { provide: MatFormFieldControl, useExisting: ElderMultiSelectChipsComponent },
             {
                 provide: ELDER_SELECT_BASE,
                 useExisting: forwardRef(() => ElderMultiSelectChipsComponent)
             }
-        ], queries: [{ propertyName: "_customChipInput", first: true, predicate: MatFormFieldControl, descendants: true }, { propertyName: "chipTemplateQuery", first: true, predicate: ElderSelectChipDirective, descendants: true, read: TemplateRef }, { propertyName: "chipAvatarTemplateQuery", first: true, predicate: ElderSelectChipAvatarDirective, descendants: true, read: TemplateRef }, { propertyName: "customInputTemplateQuery", first: true, predicate: ElderSelectCustomInputDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "_chipInput", first: true, predicate: ElderSelectComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"(selectChips$ | async) as chipValues\"\n                class=\"elder-flex-control\"\n     [matTooltip]=\"(state$ | async)?.error\"\n>\n  <mat-chip-set #chips\n                [class.mat-mdc-chip-set-stacked]=\"stacked\"\n                cdkDropList\n                [cdkDropListOrientation]=\"stacked ? 'vertical' : 'horizontal'\"\n                (cdkDropListDropped)=\"drop($event)\"\n                [cdkDropListDisabled]=\"!allowSorting\"\n  >\n\n    <ng-container *ngIf=\"(mergedState$ | async) as state\">\n      <div *ngIf=\"icon\"\n           class=\"elder-input-prefix-icon-container flex-none\"\n      >\n        <mat-icon *ngIf=\"icon\" disabled\n                  class=\"elder-prefix-icon elder-mdc-control-icon elder-icon-small noselect\"\n                  [class.loading]=\"state.loading\"\n        >\n          {{icon}}\n        </mat-icon>\n      </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"templates$ | async as templates\">\n      <mat-chip-row elderChipLabel *ngFor=\"let chipModel of chipValues\"\n                class=\"noselect clickable-chip\"\n                [value]=\"resolveChipValue(chipModel.value)\"\n                [color]=\"chipModel.colorSpec?.themeColor\"\n                [levelColor]=\"chipModel.colorSpec?.levelColor\"\n                [stateColor]=\"chipModel.colorSpec?.stateColor\"\n                [removable]=\"chipModel.removable\"\n                (keydown)=\"onChipKeyDown($event, chipModel.value)\"\n                (click)=\"onCurrentClicked(chipModel.value)\"\n                cdkDrag [cdkDragData]=\"chipModel.value\" [cdkDragDisabled]=\"!allowSorting\"\n      >\n        <mat-chip-avatar\n          *ngIf=\"templates.avatar && !chipModel.avatarSpec?.hide\"\n          [class.chip-avatar-xl]=\"chipModel.avatarSpec?.large\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"templates.avatar; context: {$implicit: chipModel}\">\n          </ng-container>\n        </mat-chip-avatar>\n\n        <ng-container\n          *ngTemplateOutlet=\"templates.chip || simpleChipTemplate; context: {$implicit: chipModel}\">\n        </ng-container>\n\n        <mat-icon matChipTrailingIcon class=\"elder-trailing-icon\"\n                  *ngIf=\"chipModel.trailingSpec?.icon\"\n                  [fontSet]=\"chipModel.trailingSpec?.iconFontSet\"\n        >{{chipModel.trailingSpec?.icon}}</mat-icon>\n\n        <mat-icon matChipRemove\n                  *ngIf=\"chipModel.removable\"\n                  (click)=\"onClickRemoveChip($event, chipModel.value)\">\n          cancel\n        </mat-icon>\n      </mat-chip-row>\n\n      <div class=\"layout-row place-start-center elder-chip-input\">\n\n        <!-- [matChipInputFor]=\"chips\" -->\n        <ng-container\n          *ngTemplateOutlet=\"templates.input || selectInput;\">\n        </ng-container>\n\n        <button mat-icon-button type=\"button\" class=\"elder-control-icon-button elder-browse-icon\"\n                *ngIf=\"selectionPopup\"\n                [disabled]=\"isLocked\"\n                (click)=\"openSelectionPopup($event)\" aria-label=\"Search\"\n                elderStopEventPropagation\n                tabIndex=\"-1\"\n        >\n          <mat-icon class=\"elder-mdc-control-icon\">search</mat-icon>\n        </button>\n      </div>\n    </ng-container>\n  </mat-chip-set>\n</div>\n\n<ng-template #selectInput>\n  <!-- mat-mdc-chip-input -->\n  <elder-select autocomplete elderClearSelect\n                class=\"elder-chip-input-select flex\"\n                [data]=\"dataContext$ | async\"\n                [disabled]=\"!!disabled\"\n                [required]=\"!!required\"\n                [readonly]=\"!!readonly\"\n                [placeholder]=\"placeholder\"\n                (entityUpdated)=\"appendEntity($event)\"\n                [displayPropertyResolver]=\"displayPropertyResolver$ | async\"\n                [valueTemplate]=\"valueTemplate\"\n                [queryFilter]=\"queryFilter\" [filters]=\"filters\" [sorts]=\"sorts\"\n                [isOptionDisabledFn]=\"isOptionDisabledInternalFn\"\n                [isOptionHiddenFn]=\"isOptionHiddenInternalFn\"\n  ></elder-select>\n</ng-template>\n\n<ng-template #simpleChipTemplate let-chipModel>\n  <span class=\"elder-chip-text\">{{chipModel.displayText | elderTruncate:20}}</span>\n</ng-template>\n\n", styles: [".elder-chip-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.elder-trailing-icon{color:var(--mdc-chip-with-trailing-icon-trailing-icon-color);opacity:.54}.cdk-drag-preview{box-sizing:border-box;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i8.MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "directive", type: i8.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i8.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["color", "disabled", "disableRipple", "tabIndex", "editable"], outputs: ["edited"] }, { kind: "component", type: i8.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role"] }, { kind: "directive", type: i8.MatChipTrailingIcon, selector: "mat-chip-trailing-icon, [matChipTrailingIcon]" }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i10.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i10.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i11.ElderStopEventPropagationDirective, selector: "[elderStopEventPropagation]" }, { kind: "directive", type: i12.ElderChipLabelDirective, selector: "[elderChipLabel]", inputs: ["appearance", "color", "stateColor", "levelColor"] }, { kind: "component", type: i13.ElderSelectComponent, selector: "elder-select", inputs: ["nullDisplay", "autocomplete", "allowNull", "entity", "entityId"], outputs: ["entityIdChange", "entityIdUpdated", "entityChange", "entityUpdated"] }, { kind: "directive", type: i14.ElderClearSelectDirective, selector: "[elderClearSelect]" }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i15.ElderTruncatePipe, name: "elderTruncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], queries: [{ propertyName: "_customChipInput", first: true, predicate: MatFormFieldControl, descendants: true }, { propertyName: "chipTemplateQuery", first: true, predicate: ElderSelectChipDirective, descendants: true, read: TemplateRef }, { propertyName: "chipAvatarTemplateQuery", first: true, predicate: ElderSelectChipAvatarDirective, descendants: true, read: TemplateRef }, { propertyName: "customInputTemplateQuery", first: true, predicate: ElderSelectCustomInputDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "_chipInput", first: true, predicate: ElderSelectComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"(selectChips$ | async) as chipValues\"\n                class=\"elder-flex-control\"\n     [matTooltip]=\"(state$ | async)?.error\"\n>\n  <mat-chip-set #chips\n                [class.mat-mdc-chip-set-stacked]=\"stacked\"\n                cdkDropList\n                [cdkDropListOrientation]=\"stacked ? 'vertical' : 'horizontal'\"\n                (cdkDropListDropped)=\"drop($event)\"\n                [cdkDropListDisabled]=\"!allowSorting\"\n  >\n\n    <ng-container *ngIf=\"(mergedState$ | async) as state\">\n      <div *ngIf=\"icon\"\n           class=\"elder-input-prefix-icon-container flex-none\"\n      >\n        <mat-icon *ngIf=\"icon\" disabled\n                  class=\"elder-prefix-icon elder-mdc-control-icon elder-icon-small noselect\"\n                  [class.loading]=\"state.loading\"\n        >\n          {{icon}}\n        </mat-icon>\n      </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"templates$ | async as templates\">\n      <mat-chip-row elderChipLabel *ngFor=\"let chipModel of chipValues\"\n                class=\"noselect clickable-chip\"\n                [value]=\"resolveChipValue(chipModel.value)\"\n                [color]=\"chipModel.colorSpec?.themeColor\"\n                [levelColor]=\"chipModel.colorSpec?.levelColor\"\n                [stateColor]=\"chipModel.colorSpec?.stateColor\"\n                [removable]=\"chipModel.removable\"\n                (keydown)=\"onChipKeyDown($event, chipModel.value)\"\n                (click)=\"onCurrentClicked(chipModel.value)\"\n                cdkDrag [cdkDragData]=\"chipModel.value\" [cdkDragDisabled]=\"!allowSorting\"\n      >\n        <mat-chip-avatar\n          *ngIf=\"templates.avatar && !chipModel.avatarSpec?.hide\"\n          [class.chip-avatar-xl]=\"chipModel.avatarSpec?.large\"\n        >\n          <ng-container\n            *ngTemplateOutlet=\"templates.avatar; context: {$implicit: chipModel}\">\n          </ng-container>\n        </mat-chip-avatar>\n\n        <ng-container\n          *ngTemplateOutlet=\"templates.chip || simpleChipTemplate; context: {$implicit: chipModel}\">\n        </ng-container>\n\n        <mat-icon matChipTrailingIcon class=\"elder-trailing-icon\"\n                  *ngIf=\"chipModel.trailingSpec?.icon\"\n                  [fontSet]=\"chipModel.trailingSpec?.iconFontSet\"\n        >{{chipModel.trailingSpec?.icon}}</mat-icon>\n\n        <mat-icon matChipRemove\n                  *ngIf=\"chipModel.removable\"\n                  (click)=\"onClickRemoveChip($event, chipModel.value)\">\n          cancel\n        </mat-icon>\n      </mat-chip-row>\n\n      <div class=\"layout-row place-start-center elder-chip-input\">\n\n        <!-- [matChipInputFor]=\"chips\" -->\n        <ng-container\n          *ngTemplateOutlet=\"templates.input || selectInput;\">\n        </ng-container>\n\n        <button mat-icon-button type=\"button\" class=\"elder-control-icon-button elder-browse-icon\"\n                *ngIf=\"selectionPopup\"\n                [disabled]=\"isLocked\"\n                (click)=\"openSelectionPopup($event)\" aria-label=\"Search\"\n                elderStopEventPropagation\n                tabIndex=\"-1\"\n        >\n          <mat-icon class=\"elder-mdc-control-icon\">search</mat-icon>\n        </button>\n      </div>\n    </ng-container>\n  </mat-chip-set>\n</div>\n\n<ng-template #selectInput>\n  <!-- mat-mdc-chip-input -->\n  <elder-select autocomplete elderClearSelect\n                class=\"elder-chip-input-select flex\"\n                [data]=\"dataContext$ | async\"\n                [disabled]=\"!!disabled\"\n                [required]=\"!!required\"\n                [readonly]=\"!!readonly\"\n                [placeholder]=\"placeholder\"\n                (entityUpdated)=\"appendEntity($event)\"\n                [displayPropertyResolver]=\"displayPropertyResolver$ | async\"\n                [valueTemplate]=\"valueTemplate\"\n                [queryFilter]=\"queryFilter\" [filters]=\"filters\" [sorts]=\"sorts\"\n                [isOptionDisabledFn]=\"isOptionDisabledInternalFn\"\n                [isOptionHiddenFn]=\"isOptionHiddenInternalFn\"\n  ></elder-select>\n</ng-template>\n\n<ng-template #simpleChipTemplate let-chipModel>\n  <span class=\"elder-chip-text\">{{chipModel.displayText | elderTruncate:20}}</span>\n</ng-template>\n\n", styles: [".elder-chip-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.elder-trailing-icon{color:var(--mdc-chip-with-trailing-icon-trailing-icon-color);opacity:.54}.cdk-drag-preview{box-sizing:border-box;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i6.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i8.MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "directive", type: i8.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i8.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "component", type: i8.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "directive", type: i8.MatChipTrailingIcon, selector: "mat-chip-trailing-icon, [matChipTrailingIcon]" }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i10.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i10.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i11.ElderStopEventPropagationDirective, selector: "[elderStopEventPropagation]" }, { kind: "directive", type: i12.ElderChipLabelDirective, selector: "[elderChipLabel]", inputs: ["appearance", "color", "stateColor", "levelColor"] }, { kind: "component", type: i13.ElderSelectComponent, selector: "elder-select", inputs: ["nullDisplay", "autocomplete", "allowNull", "entity", "entityId"], outputs: ["entityIdChange", "entityIdUpdated", "entityChange", "entityUpdated"] }, { kind: "directive", type: i14.ElderClearSelectDirective, selector: "[elderClearSelect]" }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i15.ElderTruncatePipe, name: "elderTruncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderMultiSelectChipsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderMultiSelectChipsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-multi-select-chips', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         { provide: MatFormFieldControl, useExisting: ElderMultiSelectChipsComponent },

package/esm2022/lib/components/select/multi/elder-multi-select-form-field.mjs

@@ -62,10 +62,10 @@ export class ElderMultiSelectFormField extends ElderFromFieldMultiEntityBase {
             control.customInputTemplate = dir?.templateRef;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderMultiSelectFormField, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderMultiSelectFormField, viewQueries: [{ propertyName: "selectValueTemplate", first: true, predicate: ElderSelectValueDirective, descendants: true }, { propertyName: "selectionModelPopupDirective", first: true, predicate: SelectionModelPopupDirective, descendants: true }, { propertyName: "selectChipDirective", first: true, predicate: ElderSelectChipDirective, descendants: true }, { propertyName: "selectChipAvatarDirective", first: true, predicate: ElderSelectChipAvatarDirective, descendants: true }, { propertyName: "selectCustomInputDirective", first: true, predicate: ElderSelectCustomInputDirective, descendants: true }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderMultiSelectFormField, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderMultiSelectFormField, viewQueries: [{ propertyName: "selectValueTemplate", first: true, predicate: ElderSelectValueDirective, descendants: true }, { propertyName: "selectionModelPopupDirective", first: true, predicate: SelectionModelPopupDirective, descendants: true }, { propertyName: "selectChipDirective", first: true, predicate: ElderSelectChipDirective, descendants: true }, { propertyName: "selectChipAvatarDirective", first: true, predicate: ElderSelectChipAvatarDirective, descendants: true }, { propertyName: "selectCustomInputDirective", first: true, predicate: ElderSelectCustomInputDirective, descendants: true }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderMultiSelectFormField, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderMultiSelectFormField, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: undefined }], propDecorators: { selectValueTemplate: [{
                 type: ViewChild,

package/esm2022/lib/components/select/popup/selection-model-popup-trigger-adapter.directive.mjs

@@ -53,10 +53,10 @@ export class ElderSelectionPopupTriggerAdapterDirective {
             this.log.warn('Cant open selection browser popup, since [SelectionModelPopupDirective] was not found!');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectionPopupTriggerAdapterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElderSelectionPopupTriggerAdapterDirective, selector: "[elderSelectionPopupTriggerAdapter]", inputs: { keyGetter: "keyGetter", selection: "selection", filters: "filters", sorts: "sorts", multiSelectionEnabled: "multiSelectionEnabled" }, outputs: { selectionChange: "selectionChange", selectionSingleChange: "selectionSingleChange" }, host: { listeners: { "click": "handleClick($event)" } }, queries: [{ propertyName: "selectionPopup", first: true, predicate: SelectionModelPopupDirective, descendants: true }], exportAs: ["elderSelectionPopupTriggerAdapter"], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectionPopupTriggerAdapterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.1", type: ElderSelectionPopupTriggerAdapterDirective, selector: "[elderSelectionPopupTriggerAdapter]", inputs: { keyGetter: "keyGetter", selection: "selection", filters: "filters", sorts: "sorts", multiSelectionEnabled: "multiSelectionEnabled" }, outputs: { selectionChange: "selectionChange", selectionSingleChange: "selectionSingleChange" }, host: { listeners: { "click": "handleClick($event)" } }, queries: [{ propertyName: "selectionPopup", first: true, predicate: SelectionModelPopupDirective, descendants: true }], exportAs: ["elderSelectionPopupTriggerAdapter"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElderSelectionPopupTriggerAdapterDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.1", ngImport: i0, type: ElderSelectionPopupTriggerAdapterDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[elderSelectionPopupTriggerAdapter]',