@eui/ecl 18.0.0-next.43 → 18.0.0-next.44

package/fesm2022/eui-ecl.mjs

@@ -1268,9 +1268,7 @@ i022.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 }] });
 
 // lib/components/ecl-text-input/ecl-text-input.directive.mjs
-import { __decorate } from "tslib";
-import { Directive as Directive7, HostBinding as HostBinding12, Input as Input8, Optional as Optional3, Self } from "@angular/core";
-import { coerceBoolean } from "@eui/base";
+import { Directive as Directive7, HostBinding as HostBinding12, Input as Input8, Optional as Optional3, Self, booleanAttribute as booleanAttribute6 } from "@angular/core";
 import * as i023 from "@angular/core";
 import * as i14 from "@angular/forms";
 var EclTextInputDirective = class _EclTextInputDirective extends ECLBaseDirective {
@@ -1295,12 +1293,9 @@ var EclTextInputDirective = class _EclTextInputDirective extends ECLBaseDirectiv
     this.ɵfac = i023.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i023, type: _EclTextInputDirective, deps: [{ token: i14.NgControl, optional: true, self: true }], target: i023.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i023.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.5", type: _EclTextInputDirective, isStandalone: true, selector: "input[eclTextInput]", inputs: { eclSize: "eclSize", isInvalid: "isInvalid" }, host: { properties: { "attr.type": "this.type", "class": "this.cssClasses", "class.ecl-text-input--invalid": "this.invalidState" } }, usesInheritance: true, ngImport: i023 });
+    this.ɵdir = i023.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclTextInputDirective, isStandalone: true, selector: "input[eclTextInput]", inputs: { eclSize: "eclSize", isInvalid: ["isInvalid", "isInvalid", booleanAttribute6] }, host: { properties: { "attr.type": "this.type", "class": "this.cssClasses", "class.ecl-text-input--invalid": "this.invalidState" } }, usesInheritance: true, ngImport: i023 });
   }
 };
-__decorate([
-  coerceBoolean
-], EclTextInputDirective.prototype, "isInvalid", void 0);
 i023.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i023, type: EclTextInputDirective, decorators: [{
   type: Directive7,
   args: [{
@@ -1311,27 +1306,21 @@ i023.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
   type: Optional3
 }, {
   type: Self
-}] }], propDecorators: {
-  type: [{
-    type: HostBinding12,
-    args: ["attr.type"]
-  }],
-  eclSize: [{
-    type: Input8
-  }],
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  isInvalid: [{
-    type: Input8
-  }],
-  cssClasses: [{
-    type: HostBinding12,
-    args: ["class"]
-  }],
-  invalidState: [{
-    type: HostBinding12,
-    args: ["class.ecl-text-input--invalid"]
-  }]
-} });
+}] }], propDecorators: { type: [{
+  type: HostBinding12,
+  args: ["attr.type"]
+}], eclSize: [{
+  type: Input8
+}], isInvalid: [{
+  type: Input8,
+  args: [{ transform: booleanAttribute6 }]
+}], cssClasses: [{
+  type: HostBinding12,
+  args: ["class"]
+}], invalidState: [{
+  type: HostBinding12,
+  args: ["class.ecl-text-input--invalid"]
+}] } });
 
 // lib/components/ecl-text-input/ecl-text-input.module.mjs
 import { NgModule as NgModule8 } from "@angular/core";
@@ -1912,7 +1901,7 @@ i031.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 }] } });
 
 // lib/components/ecl-site-header/language/ecl-site-header-language.component.mjs
-import { __decorate as __decorate2 } from "tslib";
+import { __decorate } from "tslib";
 import { Component as Component12, ElementRef as ElementRef7, EventEmitter as EventEmitter5, HostBinding as HostBinding19, HostListener as HostListener4, Input as Input11, Output as Output5, ViewChild as ViewChild2 } from "@angular/core";
 import { coerceElement } from "@eui/base";
 import { debounceTime, fromEvent, Subject as Subject5, takeUntil as takeUntil5 } from "rxjs";
@@ -2092,10 +2081,10 @@ var EclSiteHeaderLanguageComponent = class _EclSiteHeaderLanguageComponent exten
 }`, dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }, { kind: "component", type: EclSiteHeaderLanguagePopoverComponent, selector: "ecl-site-header-language-popover", inputs: ["languageCode", "euLanguages", "nonEuLanguages", "euColumnsCount", "nonEuColumnsCount", "isHidden", "isPushRight", "isStack", "isFull", "rightPosition", "languageArrowPosition"], outputs: ["languageClosed", "languageSelected"] }, { kind: "pipe", type: i62.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
   }
 };
-__decorate2([
+__decorate([
   coerceElement
 ], EclSiteHeaderLanguageComponent.prototype, "languagePopoverElement", void 0);
-__decorate2([
+__decorate([
   coerceElement
 ], EclSiteHeaderLanguageComponent.prototype, "languageLinkElement", void 0);
 i032.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i032, type: EclSiteHeaderLanguageComponent, decorators: [{
@@ -2170,9 +2159,9 @@ i032.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 }] } });
 
 // lib/components/ecl-site-header/login/ecl-site-header-login.component.mjs
-import { __decorate as __decorate3 } from "tslib";
+import { __decorate as __decorate2 } from "tslib";
 import { Component as Component13, EventEmitter as EventEmitter6, HostBinding as HostBinding20, Input as Input12, Output as Output6 } from "@angular/core";
-import { coerceBoolean as coerceBoolean2 } from "@eui/base";
+import { coerceBoolean } from "@eui/base";
 import * as i033 from "@angular/core";
 import * as i16 from "@angular/common";
 import * as i3 from "@ngx-translate/core";
@@ -2245,8 +2234,8 @@ var EclSiteHeaderLoginComponent = class _EclSiteHeaderLoginComponent extends ECL
 `, styles: [".ecl-site-header__login-toggle .ecl-site-header__login-arrow{display:inline-flex}\n"], dependencies: [{ kind: "directive", type: i16.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
   }
 };
-__decorate3([
-  coerceBoolean2
+__decorate2([
+  coerceBoolean
 ], EclSiteHeaderLoginComponent.prototype, "isLoggedIn", void 0);
 i033.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i033, type: EclSiteHeaderLoginComponent, decorators: [{
   type: Component13,
@@ -3119,7 +3108,7 @@ i044.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 }] } });
 
 // lib/components/ecl-banner/ecl-banner.component.mjs
-import { Component as Component18, ContentChild as ContentChild3, ContentChildren as ContentChildren4, HostBinding as HostBinding30, Input as Input15, ViewChild as ViewChild4, booleanAttribute as booleanAttribute6, forwardRef as forwardRef9 } from "@angular/core";
+import { Component as Component18, ContentChild as ContentChild3, ContentChildren as ContentChildren4, HostBinding as HostBinding30, Input as Input15, ViewChild as ViewChild4, booleanAttribute as booleanAttribute7, forwardRef as forwardRef9 } from "@angular/core";
 import * as i045 from "@angular/core";
 import * as i18 from "@angular/common";
 var EclBannerComponent = class _EclBannerComponent extends ECLBaseDirective {
@@ -3192,7 +3181,7 @@ var EclBannerComponent = class _EclBannerComponent extends ECLBaseDirective {
     this.ɵfac = i045.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i045, type: _EclBannerComponent, deps: [{ token: i045.ElementRef }, { token: i045.Renderer2 }], target: i045.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i045.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclBannerComponent, selector: "ecl-banner", inputs: { variant: "variant", eclSize: "eclSize", copyright: "copyright", isCentered: ["isCentered", "isCentered", booleanAttribute6], isFullWidth: ["isFullWidth", "isFullWidth", booleanAttribute6] }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "eclBannerImage", first: true, predicate: EclBannerImageDirective, descendants: true }, { propertyName: "eclLinkComponents", predicate: i045.forwardRef(() => EclLinkDirective) }], viewQueries: [{ propertyName: "bannerContainer", first: true, predicate: ["bannerContainer"], descendants: true }], usesInheritance: true, ngImport: i045, template: '<figure class="ecl-banner__picture-container">\n    <ng-content select="[eclBannerPicture]"></ng-content>\n    @if(copyright) {\n        <footer class="ecl-banner__credit"><small>© {{copyright}}</small></footer>\n    }\n</figure>\n\n<div class="ecl-container">\n    <div #bannerContainer class="ecl-banner__container">\n        <div class="ecl-banner__content">\n            <ng-content select="[eclBannerTitle]"></ng-content>\n            <ng-content select="[eclBannerDescription]"></ng-content>\n            <div *ngIf="hasCtaLink" class="ecl-banner__cta">\n                <ng-content select="[eclLink]"></ng-content>\n            </div>\n            <ng-content></ng-content>\n        </div>\n    </div>\n</div>', dependencies: [{ kind: "directive", type: i18.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    this.ɵcmp = i045.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclBannerComponent, selector: "ecl-banner", inputs: { variant: "variant", eclSize: "eclSize", copyright: "copyright", isCentered: ["isCentered", "isCentered", booleanAttribute7], isFullWidth: ["isFullWidth", "isFullWidth", booleanAttribute7] }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "eclBannerImage", first: true, predicate: EclBannerImageDirective, descendants: true }, { propertyName: "eclLinkComponents", predicate: i045.forwardRef(() => EclLinkDirective) }], viewQueries: [{ propertyName: "bannerContainer", first: true, predicate: ["bannerContainer"], descendants: true }], usesInheritance: true, ngImport: i045, template: '<figure class="ecl-banner__picture-container">\n    <ng-content select="[eclBannerPicture]"></ng-content>\n    @if(copyright) {\n        <footer class="ecl-banner__credit"><small>© {{copyright}}</small></footer>\n    }\n</figure>\n\n<div class="ecl-container">\n    <div #bannerContainer class="ecl-banner__container">\n        <div class="ecl-banner__content">\n            <ng-content select="[eclBannerTitle]"></ng-content>\n            <ng-content select="[eclBannerDescription]"></ng-content>\n            <div *ngIf="hasCtaLink" class="ecl-banner__cta">\n                <ng-content select="[eclLink]"></ng-content>\n            </div>\n            <ng-content></ng-content>\n        </div>\n    </div>\n</div>', dependencies: [{ kind: "directive", type: i18.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
   }
 };
 i045.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i045, type: EclBannerComponent, decorators: [{
@@ -3206,10 +3195,10 @@ i045.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
   type: Input15
 }], isCentered: [{
   type: Input15,
-  args: [{ transform: booleanAttribute6 }]
+  args: [{ transform: booleanAttribute7 }]
 }], isFullWidth: [{
   type: Input15,
-  args: [{ transform: booleanAttribute6 }]
+  args: [{ transform: booleanAttribute7 }]
 }], eclLinkComponents: [{
   type: ContentChildren4,
   args: [forwardRef9(() => EclLinkDirective)]
@@ -3413,7 +3402,7 @@ i050.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 }] });
 
 // lib/components/ecl-breadcrumb/ecl-breadcrumb-segment.component.mjs
-import { Component as Component20, EventEmitter as EventEmitter10, HostBinding as HostBinding34, Input as Input17, Output as Output10, ViewEncapsulation as ViewEncapsulation3, booleanAttribute as booleanAttribute7 } from "@angular/core";
+import { Component as Component20, EventEmitter as EventEmitter10, HostBinding as HostBinding34, Input as Input17, Output as Output10, ViewEncapsulation as ViewEncapsulation3, booleanAttribute as booleanAttribute8 } from "@angular/core";
 import * as i051 from "@angular/core";
 import * as i110 from "@angular/common";
 import * as i25 from "@angular/router";
@@ -3452,7 +3441,7 @@ var EclBreadcrumbSegmentComponent = class _EclBreadcrumbSegmentComponent extends
     this.ɵfac = i051.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i051, type: _EclBreadcrumbSegmentComponent, deps: [{ token: i051.ElementRef }], target: i051.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i051.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclBreadcrumbSegmentComponent, selector: "ecl-breadcrumb-segment", inputs: { routerLink: "routerLink", queryParams: "queryParams", href: "href", queryParamsHandling: "queryParamsHandling", isCurrentPage: ["isCurrentPage", "isCurrentPage", booleanAttribute7], isHidden: ["isHidden", "isHidden", booleanAttribute7] }, outputs: { segmentClick: "segmentClick" }, host: { properties: { "attr.tabindex": "this.tabIndex", "attr.role": "this.role", "attr.aria-hidden": "this.isHidden", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i051, template: '@if (!isEllipsis) {\n@if (!isCurrentPage && href) {\n<a eclLink variant="standalone" [isNoVisited]="true" [href]="href" tabindex="0" (click)="onSegmentClick($event)"\n    class="ecl-breadcrumb__link">\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</a>\n}\n@if (!isCurrentPage && !href) {\n<a eclLink [routerLink]="routerLink" [queryParams]="queryParams" [queryParamsHandling]="queryParamsHandling"\n    variant="standalone" [isNoVisited]="true" tabindex="0" (click)="onSegmentClick($event)"\n    class="ecl-breadcrumb__link">\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</a>\n}\n} @else {\n<ng-container *ngTemplateOutlet="content"></ng-container>\n}\n\n@if (isCurrentPage) {\n<ng-container *ngTemplateOutlet="content"></ng-container>\n} @else {\n<ecl-icon role="presentation" icon="corner-arrow" ariaHidden="true" focusable="false" size="fluid"\n    class="ecl-breadcrumb__icon">\n</ecl-icon>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>', dependencies: [{ kind: "directive", type: i110.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i25.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["isInverted", "isIconOnly", "isNoVisited", "variant"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }], encapsulation: i051.ViewEncapsulation.None });
+    this.ɵcmp = i051.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclBreadcrumbSegmentComponent, selector: "ecl-breadcrumb-segment", inputs: { routerLink: "routerLink", queryParams: "queryParams", href: "href", queryParamsHandling: "queryParamsHandling", isCurrentPage: ["isCurrentPage", "isCurrentPage", booleanAttribute8], isHidden: ["isHidden", "isHidden", booleanAttribute8] }, outputs: { segmentClick: "segmentClick" }, host: { properties: { "attr.tabindex": "this.tabIndex", "attr.role": "this.role", "attr.aria-hidden": "this.isHidden", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i051, template: '@if (!isEllipsis) {\n@if (!isCurrentPage && href) {\n<a eclLink variant="standalone" [isNoVisited]="true" [href]="href" tabindex="0" (click)="onSegmentClick($event)"\n    class="ecl-breadcrumb__link">\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</a>\n}\n@if (!isCurrentPage && !href) {\n<a eclLink [routerLink]="routerLink" [queryParams]="queryParams" [queryParamsHandling]="queryParamsHandling"\n    variant="standalone" [isNoVisited]="true" tabindex="0" (click)="onSegmentClick($event)"\n    class="ecl-breadcrumb__link">\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</a>\n}\n} @else {\n<ng-container *ngTemplateOutlet="content"></ng-container>\n}\n\n@if (isCurrentPage) {\n<ng-container *ngTemplateOutlet="content"></ng-container>\n} @else {\n<ecl-icon role="presentation" icon="corner-arrow" ariaHidden="true" focusable="false" size="fluid"\n    class="ecl-breadcrumb__icon">\n</ecl-icon>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>', dependencies: [{ kind: "directive", type: i110.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i25.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["isInverted", "isIconOnly", "isNoVisited", "variant"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }], encapsulation: i051.ViewEncapsulation.None });
   }
 };
 i051.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i051, type: EclBreadcrumbSegmentComponent, decorators: [{
@@ -3474,10 +3463,10 @@ i051.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
   type: Input17
 }], isCurrentPage: [{
   type: Input17,
-  args: [{ transform: booleanAttribute7 }]
+  args: [{ transform: booleanAttribute8 }]
 }], isHidden: [{
   type: Input17,
-  args: [{ transform: booleanAttribute7 }]
+  args: [{ transform: booleanAttribute8 }]
 }, {
   type: HostBinding34,
   args: ["attr.aria-hidden"]
@@ -3489,7 +3478,7 @@ i051.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 }] } });
 
 // lib/components/ecl-breadcrumb/ecl-breadcrumb.component.mjs
-import { Component as Component21, ContentChildren as ContentChildren5, HostBinding as HostBinding35, Input as Input18, ViewChild as ViewChild5, booleanAttribute as booleanAttribute8, forwardRef as forwardRef11, HostListener as HostListener5 } from "@angular/core";
+import { Component as Component21, ContentChildren as ContentChildren5, HostBinding as HostBinding35, Input as Input18, ViewChild as ViewChild5, booleanAttribute as booleanAttribute9, forwardRef as forwardRef11, HostListener as HostListener5 } from "@angular/core";
 import { Subject as Subject8, takeUntil as takeUntil8 } from "rxjs";
 import * as i052 from "@angular/core";
 import * as i111 from "@ngx-translate/core";
@@ -3615,7 +3604,7 @@ var EclBreadcrumbComponent = class _EclBreadcrumbComponent extends ECLBaseDirect
     this.ɵfac = i052.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i052, type: _EclBreadcrumbComponent, deps: [{ token: i052.ElementRef }, { token: i111.TranslateService }, { token: i052.Renderer2 }], target: i052.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i052.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclBreadcrumbComponent, selector: "ecl-breadcrumb", inputs: { isExpanded: ["isExpanded", "isExpanded", booleanAttribute8] }, host: { listeners: { "window:resize": "onWindowResize($event)" }, properties: { "attr.role": "this.role", "attr.aria-label": "this.ariaLabel", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclSegments", predicate: i052.forwardRef(() => EclBreadcrumbSegmentComponent) }], viewQueries: [{ propertyName: "eclEllipsisSegment", first: true, predicate: ["ellipsisSegment"], descendants: true }, { propertyName: "breadcrumbContainer", first: true, predicate: ["breadcrumbContainer"], descendants: true }], usesInheritance: true, ngImport: i052, template: `<ol class="ecl-breadcrumb__container" #breadcrumbContainer>
+    this.ɵcmp = i052.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclBreadcrumbComponent, selector: "ecl-breadcrumb", inputs: { isExpanded: ["isExpanded", "isExpanded", booleanAttribute9] }, host: { listeners: { "window:resize": "onWindowResize($event)" }, properties: { "attr.role": "this.role", "attr.aria-label": "this.ariaLabel", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclSegments", predicate: i052.forwardRef(() => EclBreadcrumbSegmentComponent) }], viewQueries: [{ propertyName: "eclEllipsisSegment", first: true, predicate: ["ellipsisSegment"], descendants: true }, { propertyName: "breadcrumbContainer", first: true, predicate: ["breadcrumbContainer"], descendants: true }], usesInheritance: true, ngImport: i052, template: `<ol class="ecl-breadcrumb__container" #breadcrumbContainer>
     <ecl-breadcrumb-segment #ellipsisSegment [isHidden]="true" class="ecl-breadcrumb__segment--ellipsis">
         <button
             tabindex="0"
@@ -3651,7 +3640,7 @@ i052.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 `, styles: [":host{display:block}\n"] }]
 }], ctorParameters: () => [{ type: i052.ElementRef }, { type: i111.TranslateService }, { type: i052.Renderer2 }], propDecorators: { isExpanded: [{
   type: Input18,
-  args: [{ transform: booleanAttribute8 }]
+  args: [{ transform: booleanAttribute9 }]
 }], role: [{
   type: HostBinding35,
   args: ["attr.role"]
@@ -4367,7 +4356,7 @@ var EclSlideEvent = class extends EclBaseEvent {
 };
 
 // lib/components/ecl-carousel/ecl-carousel-item.component.mjs
-import { Component as Component25, EventEmitter as EventEmitter11, HostBinding as HostBinding42, HostListener as HostListener6, Input as Input20, Output as Output11, booleanAttribute as booleanAttribute9, ContentChild as ContentChild6, forwardRef as forwardRef15 } from "@angular/core";
+import { Component as Component25, EventEmitter as EventEmitter11, HostBinding as HostBinding42, HostListener as HostListener6, Input as Input20, Output as Output11, booleanAttribute as booleanAttribute10, ContentChild as ContentChild6, forwardRef as forwardRef15 } from "@angular/core";
 import * as i063 from "@angular/core";
 var EclCarouselItemComponent = class _EclCarouselItemComponent extends ECLBaseDirective {
   constructor(el) {
@@ -4390,7 +4379,7 @@ var EclCarouselItemComponent = class _EclCarouselItemComponent extends ECLBaseDi
     this.ɵfac = i063.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i063, type: _EclCarouselItemComponent, deps: [{ token: i063.ElementRef }], target: i063.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i063.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclCarouselItemComponent, selector: "ecl-carousel-item", inputs: { id: "id", isCurrent: ["isCurrent", "isCurrent", booleanAttribute9] }, outputs: { slideClick: "slideClick" }, host: { listeners: { "click": "onSlideClick()" }, properties: { "attr.aria-label": "this.ariaLabel", "attr.role": "this.role", "style.width.%": "this.width", "class": "this.cssClasses", "attr.inert": "this.isInert" } }, queries: [{ propertyName: "banner", first: true, predicate: i063.forwardRef(() => EclBannerComponent), descendants: true }], usesInheritance: true, ngImport: i063, template: "<ng-content></ng-content>\n", styles: [":host:before{left:0!important;display:none}\n"] });
+    this.ɵcmp = i063.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclCarouselItemComponent, selector: "ecl-carousel-item", inputs: { id: "id", isCurrent: ["isCurrent", "isCurrent", booleanAttribute10] }, outputs: { slideClick: "slideClick" }, host: { listeners: { "click": "onSlideClick()" }, properties: { "attr.aria-label": "this.ariaLabel", "attr.role": "this.role", "style.width.%": "this.width", "class": "this.cssClasses", "attr.inert": "this.isInert" } }, queries: [{ propertyName: "banner", first: true, predicate: i063.forwardRef(() => EclBannerComponent), descendants: true }], usesInheritance: true, ngImport: i063, template: "<ng-content></ng-content>\n", styles: [":host:before{left:0!important;display:none}\n"] });
   }
 };
 i063.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i063, type: EclCarouselItemComponent, decorators: [{
@@ -4409,7 +4398,7 @@ i063.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
   type: Input20
 }], isCurrent: [{
   type: Input20,
-  args: [{ transform: booleanAttribute9 }]
+  args: [{ transform: booleanAttribute10 }]
 }], slideClick: [{
   type: Output11
 }], banner: [{
@@ -4427,7 +4416,7 @@ i063.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 }] } });
 
 // lib/components/ecl-carousel/ecl-carousel.component.mjs
-import { Component as Component26, ContentChildren as ContentChildren6, EventEmitter as EventEmitter12, HostBinding as HostBinding43, Input as Input21, Output as Output12, ViewChild as ViewChild6, ViewChildren, booleanAttribute as booleanAttribute10, forwardRef as forwardRef17, numberAttribute as numberAttribute2 } from "@angular/core";
+import { Component as Component26, ContentChildren as ContentChildren6, EventEmitter as EventEmitter12, HostBinding as HostBinding43, Input as Input21, Output as Output12, ViewChild as ViewChild6, ViewChildren, booleanAttribute as booleanAttribute11, forwardRef as forwardRef17, numberAttribute as numberAttribute2 } from "@angular/core";
 import { Subject as Subject9, interval, switchMap as switchMap2, takeUntil as takeUntil9 } from "rxjs";
 import * as i064 from "@angular/core";
 import * as i112 from "@angular/cdk/layout";
@@ -4898,7 +4887,7 @@ var EclCarouselComponent = class _EclCarouselComponent extends ECLBaseDirective
     this.ɵfac = i064.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i064, type: _EclCarouselComponent, deps: [{ token: i112.BreakpointObserver }, { token: i064.ChangeDetectorRef }, { token: i064.Renderer2 }, { token: EclRtlService }], target: i064.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i064.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclCarouselComponent, selector: "ecl-carousel", inputs: { ariaLabel: ["aria-label", "ariaLabel"], isAutoplay: ["isAutoplay", "isAutoplay", booleanAttribute10], playInterval: ["playInterval", "playInterval", numberAttribute2] }, outputs: { slide: "slide" }, host: { properties: { "attr.aria-label": "this.ariaLabel", "attr.aria-roledescription": "this.ariaRoleDescription", "class": "this.cssClasses" } }, queries: [{ propertyName: "slides", predicate: i064.forwardRef(() => EclCarouselItemComponent) }], viewQueries: [{ propertyName: "carouselContainerElement", first: true, predicate: ["carouselContainer"], descendants: true }, { propertyName: "playButton", first: true, predicate: ["playButton"], descendants: true }, { propertyName: "pauseButton", first: true, predicate: ["pauseButton"], descendants: true }, { propertyName: "prevButton", first: true, predicate: ["prevButton"], descendants: true }, { propertyName: "nextButton", first: true, predicate: ["nextButton"], descendants: true }, { propertyName: "firstHiddenItem", first: true, predicate: ["firstHiddenItem"], descendants: true }, { propertyName: "lastHiddenItem", first: true, predicate: ["lastHiddenItem"], descendants: true }, { propertyName: "slidesContainer", first: true, predicate: ["slidesContainer"], descendants: true }, { propertyName: "navigationButtons", predicate: ["currButton"], descendants: true }], usesInheritance: true, ngImport: i064, template: `<div #carouselContainer class="ecl-carousel__container" [class.ecl-carousel-container--padded]="isPadded()">
+    this.ɵcmp = i064.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclCarouselComponent, selector: "ecl-carousel", inputs: { ariaLabel: ["aria-label", "ariaLabel"], isAutoplay: ["isAutoplay", "isAutoplay", booleanAttribute11], playInterval: ["playInterval", "playInterval", numberAttribute2] }, outputs: { slide: "slide" }, host: { properties: { "attr.aria-label": "this.ariaLabel", "attr.aria-roledescription": "this.ariaRoleDescription", "class": "this.cssClasses" } }, queries: [{ propertyName: "slides", predicate: i064.forwardRef(() => EclCarouselItemComponent) }], viewQueries: [{ propertyName: "carouselContainerElement", first: true, predicate: ["carouselContainer"], descendants: true }, { propertyName: "playButton", first: true, predicate: ["playButton"], descendants: true }, { propertyName: "pauseButton", first: true, predicate: ["pauseButton"], descendants: true }, { propertyName: "prevButton", first: true, predicate: ["prevButton"], descendants: true }, { propertyName: "nextButton", first: true, predicate: ["nextButton"], descendants: true }, { propertyName: "firstHiddenItem", first: true, predicate: ["firstHiddenItem"], descendants: true }, { propertyName: "lastHiddenItem", first: true, predicate: ["lastHiddenItem"], descendants: true }, { propertyName: "slidesContainer", first: true, predicate: ["slidesContainer"], descendants: true }, { propertyName: "navigationButtons", predicate: ["currButton"], descendants: true }], usesInheritance: true, ngImport: i064, template: `<div #carouselContainer class="ecl-carousel__container" [class.ecl-carousel-container--padded]="isPadded()">
     <div #slidesContainer (keyup)="onFirstCarouselElementPress($event)" class="ecl-carousel__slides"
         [style.width.px]="getCarouselSlidesWidth()" [style.left.px]="!isRtl ? getCarouselSlidesOffsetLeft() : null"
         [style.right.px]="isRtl ? getCarouselSlidesOffsetRight() : null"
@@ -5079,7 +5068,7 @@ i064.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
   args: ["attr.aria-roledescription"]
 }], isAutoplay: [{
   type: Input21,
-  args: [{ transform: booleanAttribute10 }]
+  args: [{ transform: booleanAttribute11 }]
 }], playInterval: [{
   type: Input21,
   args: [{ transform: numberAttribute2 }]
@@ -5439,9 +5428,9 @@ i069.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 }] });
 
 // lib/components/ecl-help-block/ecl-help-block.directive.mjs
-import { __decorate as __decorate4 } from "tslib";
+import { __decorate as __decorate3 } from "tslib";
 import { Directive as Directive19, HostBinding as HostBinding47, Input as Input24 } from "@angular/core";
-import { coerceBoolean as coerceBoolean3 } from "@eui/base";
+import { coerceBoolean as coerceBoolean2 } from "@eui/base";
 import * as i070 from "@angular/core";
 var EclHelpBlockDirective = class _EclHelpBlockDirective extends ECLBaseDirective {
   constructor() {
@@ -5458,8 +5447,8 @@ var EclHelpBlockDirective = class _EclHelpBlockDirective extends ECLBaseDirectiv
     this.ɵdir = i070.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.5", type: _EclHelpBlockDirective, selector: "[eclHelpBlock]", inputs: { isDisabled: "isDisabled" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i070 });
   }
 };
-__decorate4([
-  coerceBoolean3
+__decorate3([
+  coerceBoolean2
 ], EclHelpBlockDirective.prototype, "isDisabled", void 0);
 i070.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i070, type: EclHelpBlockDirective, decorators: [{
   type: Directive19,
@@ -5474,7 +5463,7 @@ i070.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 }] } });
 
 // lib/components/ecl-checkbox/ecl-checkbox-help.component.mjs
-import { Component as Component30, HostBinding as HostBinding48, Input as Input25, booleanAttribute as booleanAttribute11 } from "@angular/core";
+import { Component as Component30, HostBinding as HostBinding48, Input as Input25, booleanAttribute as booleanAttribute12 } from "@angular/core";
 import * as i071 from "@angular/core";
 var EclCheckboxHelpComponent = class _EclCheckboxHelpComponent extends ECLBaseDirective {
   constructor() {
@@ -5488,7 +5477,7 @@ var EclCheckboxHelpComponent = class _EclCheckboxHelpComponent extends ECLBaseDi
     this.ɵfac = i071.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i071, type: _EclCheckboxHelpComponent, deps: null, target: i071.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i071.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclCheckboxHelpComponent, selector: "[eclCheckboxHelp]", inputs: { isDisabled: ["isDisabled", "isDisabled", booleanAttribute11] }, host: { properties: { "class.ecl-checkbox__help--disabled": "this.isDisabled", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i071, template: "<ng-content></ng-content>\n" });
+    this.ɵcmp = i071.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclCheckboxHelpComponent, selector: "[eclCheckboxHelp]", inputs: { isDisabled: ["isDisabled", "isDisabled", booleanAttribute12] }, host: { properties: { "class.ecl-checkbox__help--disabled": "this.isDisabled", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i071, template: "<ng-content></ng-content>\n" });
   }
 };
 i071.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i071, type: EclCheckboxHelpComponent, decorators: [{
@@ -5496,7 +5485,7 @@ i071.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
   args: [{ selector: "[eclCheckboxHelp]", template: "<ng-content></ng-content>\n" }]
 }], propDecorators: { isDisabled: [{
   type: Input25,
-  args: [{ transform: booleanAttribute11 }]
+  args: [{ transform: booleanAttribute12 }]
 }, {
   type: HostBinding48,
   args: ["class.ecl-checkbox__help--disabled"]
@@ -5506,7 +5495,7 @@ i071.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 }] } });
 
 // lib/components/ecl-checkbox/ecl-checkbox-label.component.mjs
-import { Component as Component31, HostBinding as HostBinding49, Input as Input26, ViewEncapsulation as ViewEncapsulation5, booleanAttribute as booleanAttribute12 } from "@angular/core";
+import { Component as Component31, HostBinding as HostBinding49, Input as Input26, ViewEncapsulation as ViewEncapsulation5, booleanAttribute as booleanAttribute13 } from "@angular/core";
 import * as i072 from "@angular/core";
 var EclCheckboxLabelComponent = class _EclCheckboxLabelComponent extends ECLBaseDirective {
   constructor() {
@@ -5522,7 +5511,7 @@ var EclCheckboxLabelComponent = class _EclCheckboxLabelComponent extends ECLBase
     this.ɵfac = i072.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i072, type: _EclCheckboxLabelComponent, deps: null, target: i072.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i072.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclCheckboxLabelComponent, selector: "label[eclCheckboxLabel]", inputs: { isInvalid: ["isInvalid", "isInvalid", booleanAttribute12], isDisabled: ["isDisabled", "isDisabled", booleanAttribute12], isRequired: ["isRequired", "isRequired", booleanAttribute12] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i072, template: '<span class="ecl-checkbox__box" [class.ecl-checkbox__box--disabled]="isDisabled" [class.ecl-checkbox__box--invalid]="isInvalid">\n    <ecl-icon size="m" icon="check" class="ecl-checkbox__icon"></ecl-icon>\n</span>\n\n<span class="ecl-checkbox__text">\n    <ng-content></ng-content>\n</span>\n@if(isRequired) {\n<span class="ecl-form-label__required" role="note" aria-label="required">*</span>\n}', dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }], encapsulation: i072.ViewEncapsulation.None });
+    this.ɵcmp = i072.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclCheckboxLabelComponent, selector: "label[eclCheckboxLabel]", inputs: { isInvalid: ["isInvalid", "isInvalid", booleanAttribute13], isDisabled: ["isDisabled", "isDisabled", booleanAttribute13], isRequired: ["isRequired", "isRequired", booleanAttribute13] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i072, template: '<span class="ecl-checkbox__box" [class.ecl-checkbox__box--disabled]="isDisabled" [class.ecl-checkbox__box--invalid]="isInvalid">\n    <ecl-icon size="m" icon="check" class="ecl-checkbox__icon"></ecl-icon>\n</span>\n\n<span class="ecl-checkbox__text">\n    <ng-content></ng-content>\n</span>\n@if(isRequired) {\n<span class="ecl-form-label__required" role="note" aria-label="required">*</span>\n}', dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }], encapsulation: i072.ViewEncapsulation.None });
   }
 };
 i072.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i072, type: EclCheckboxLabelComponent, decorators: [{
@@ -5530,20 +5519,20 @@ i072.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
   args: [{ selector: "label[eclCheckboxLabel]", encapsulation: ViewEncapsulation5.None, template: '<span class="ecl-checkbox__box" [class.ecl-checkbox__box--disabled]="isDisabled" [class.ecl-checkbox__box--invalid]="isInvalid">\n    <ecl-icon size="m" icon="check" class="ecl-checkbox__icon"></ecl-icon>\n</span>\n\n<span class="ecl-checkbox__text">\n    <ng-content></ng-content>\n</span>\n@if(isRequired) {\n<span class="ecl-form-label__required" role="note" aria-label="required">*</span>\n}' }]
 }], propDecorators: { isInvalid: [{
   type: Input26,
-  args: [{ transform: booleanAttribute12 }]
+  args: [{ transform: booleanAttribute13 }]
 }], isDisabled: [{
   type: Input26,
-  args: [{ transform: booleanAttribute12 }]
+  args: [{ transform: booleanAttribute13 }]
 }], isRequired: [{
   type: Input26,
-  args: [{ transform: booleanAttribute12 }]
+  args: [{ transform: booleanAttribute13 }]
 }], cssClasses: [{
   type: HostBinding49,
   args: ["class"]
 }] } });
 
 // lib/components/ecl-checkbox/ecl-checkbox.directive.mjs
-import { ContentChild as ContentChild9, Directive as Directive20, HostBinding as HostBinding50, Input as Input27, booleanAttribute as booleanAttribute13, forwardRef as forwardRef25 } from "@angular/core";
+import { ContentChild as ContentChild9, Directive as Directive20, HostBinding as HostBinding50, Input as Input27, booleanAttribute as booleanAttribute14, forwardRef as forwardRef25 } from "@angular/core";
 import * as i073 from "@angular/core";
 var EclCheckboxDirective = class _EclCheckboxDirective extends ECLBaseDirective {
   constructor() {
@@ -5574,7 +5563,7 @@ var EclCheckboxDirective = class _EclCheckboxDirective extends ECLBaseDirective
     this.ɵfac = i073.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i073, type: _EclCheckboxDirective, deps: null, target: i073.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i073.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclCheckboxDirective, isStandalone: true, selector: "[eclCheckbox]", inputs: { isDisabled: ["isDisabled", "isDisabled", booleanAttribute13], isInvalid: ["isInvalid", "isInvalid", booleanAttribute13], isSingle: ["isSingle", "isSingle", booleanAttribute13] }, host: { properties: { "class.ecl-checkbox--disabled": "this.isDisabled", "class.ecl-checkbox--invalid": "this.isInvalid", "class.ecl-checkbox--single": "this.isSingle", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclCheckboxLabelComponent", first: true, predicate: i073.forwardRef(() => EclCheckboxLabelComponent), descendants: true }, { propertyName: "eclCheckboxHelpComponent", first: true, predicate: i073.forwardRef(() => EclCheckboxHelpComponent), descendants: true }, { propertyName: "eclFormLabelDirective", first: true, predicate: i073.forwardRef(() => EclFormLabelComponent), descendants: true }, { propertyName: "eclHelpBlockDirective", first: true, predicate: i073.forwardRef(() => EclHelpBlockDirective), descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i073 });
+    this.ɵdir = i073.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclCheckboxDirective, isStandalone: true, selector: "[eclCheckbox]", inputs: { isDisabled: ["isDisabled", "isDisabled", booleanAttribute14], isInvalid: ["isInvalid", "isInvalid", booleanAttribute14], isSingle: ["isSingle", "isSingle", booleanAttribute14] }, host: { properties: { "class.ecl-checkbox--disabled": "this.isDisabled", "class.ecl-checkbox--invalid": "this.isInvalid", "class.ecl-checkbox--single": "this.isSingle", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclCheckboxLabelComponent", first: true, predicate: i073.forwardRef(() => EclCheckboxLabelComponent), descendants: true }, { propertyName: "eclCheckboxHelpComponent", first: true, predicate: i073.forwardRef(() => EclCheckboxHelpComponent), descendants: true }, { propertyName: "eclFormLabelDirective", first: true, predicate: i073.forwardRef(() => EclFormLabelComponent), descendants: true }, { propertyName: "eclHelpBlockDirective", first: true, predicate: i073.forwardRef(() => EclHelpBlockDirective), descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i073 });
   }
 };
 i073.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i073, type: EclCheckboxDirective, decorators: [{
@@ -5585,19 +5574,19 @@ i073.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
   }]
 }], propDecorators: { isDisabled: [{
   type: Input27,
-  args: [{ transform: booleanAttribute13 }]
+  args: [{ transform: booleanAttribute14 }]
 }, {
   type: HostBinding50,
   args: ["class.ecl-checkbox--disabled"]
 }], isInvalid: [{
   type: Input27,
-  args: [{ transform: booleanAttribute13 }]
+  args: [{ transform: booleanAttribute14 }]
 }, {
   type: HostBinding50,
   args: ["class.ecl-checkbox--invalid"]
 }], isSingle: [{
   type: Input27,
-  args: [{ transform: booleanAttribute13 }]
+  args: [{ transform: booleanAttribute14 }]
 }, {
   type: HostBinding50,
   args: ["class.ecl-checkbox--single"]
@@ -6185,7 +6174,7 @@ i082.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 }] });
 
 // lib/components/ecl-expandable/ecl-expandable.component.mjs
-import { Component as Component34, Input as Input31, Output as Output15, EventEmitter as EventEmitter15, HostBinding as HostBinding56, booleanAttribute as booleanAttribute14 } from "@angular/core";
+import { Component as Component34, Input as Input31, Output as Output15, EventEmitter as EventEmitter15, HostBinding as HostBinding56, booleanAttribute as booleanAttribute15 } from "@angular/core";
 import * as i083 from "@angular/core";
 import * as i43 from "@ngx-translate/core";
 var EclExpandableToggleEvent = class extends EclBaseEvent {
@@ -6220,7 +6209,7 @@ var EclExpandableComponent = class _EclExpandableComponent extends ECLBaseDirect
     this.ɵfac = i083.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i083, type: _EclExpandableComponent, deps: null, target: i083.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i083.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclExpandableComponent, selector: "ecl-expandable", inputs: { isExpanded: ["isExpanded", "isExpanded", booleanAttribute14], collapsedLabel: "collapsedLabel", expandedLabel: "expandedLabel" }, outputs: { toggle: "toggle" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i083, template: `<button
+    this.ɵcmp = i083.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclExpandableComponent, selector: "ecl-expandable", inputs: { isExpanded: ["isExpanded", "isExpanded", booleanAttribute15], collapsedLabel: "collapsedLabel", expandedLabel: "expandedLabel" }, outputs: { toggle: "toggle" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i083, template: `<button
     eclButton
     variant="ghost"
     type="button"
@@ -6269,7 +6258,7 @@ i083.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
   args: ["class"]
 }], isExpanded: [{
   type: Input31,
-  args: [{ transform: booleanAttribute14 }]
+  args: [{ transform: booleanAttribute15 }]
 }], collapsedLabel: [{
   type: Input31
 }], expandedLabel: [{
@@ -6513,7 +6502,7 @@ i091.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 }] });
 
 // lib/components/ecl-media-container/ecl-media-container.component.mjs
-import { Component as Component41, ContentChild as ContentChild12, HostBinding as HostBinding63, Input as Input33, booleanAttribute as booleanAttribute15 } from "@angular/core";
+import { Component as Component41, ContentChild as ContentChild12, HostBinding as HostBinding63, Input as Input33, booleanAttribute as booleanAttribute16 } from "@angular/core";
 import * as i092 from "@angular/core";
 var EclMediaContainerComponent = class _EclMediaContainerComponent extends ECLBaseDirective {
   constructor() {
@@ -6532,7 +6521,7 @@ var EclMediaContainerComponent = class _EclMediaContainerComponent extends ECLBa
     this.ɵfac = i092.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i092, type: _EclMediaContainerComponent, deps: null, target: i092.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i092.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclMediaContainerComponent, selector: "ecl-media-container", inputs: { isFullWidth: ["isFullWidth", "isFullWidth", booleanAttribute15] }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "expandable", first: true, predicate: EclExpandableComponent, descendants: true }], usesInheritance: true, ngImport: i092, template: '<figure class="ecl-media-container__figure" [class.ecl-media-container--full-width]="isFullWidth">\n    <ng-content select="video[eclMediaContainerItem]"></ng-content>\n    <ng-content select="div[eclMediaContainerItem]"></ng-content>\n    <ng-content select="picture[eclMediaContainerPicture]"></ng-content>\n\n    <figcaption class="ecl-media-container__caption">\n        <ng-content></ng-content>\n    </figcaption>\n    <ng-content select="ecl-expandable"></ng-content>\n</figure>\n', styles: [":host{display:block}\n"] });
+    this.ɵcmp = i092.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclMediaContainerComponent, selector: "ecl-media-container", inputs: { isFullWidth: ["isFullWidth", "isFullWidth", booleanAttribute16] }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "expandable", first: true, predicate: EclExpandableComponent, descendants: true }], usesInheritance: true, ngImport: i092, template: '<figure class="ecl-media-container__figure" [class.ecl-media-container--full-width]="isFullWidth">\n    <ng-content select="video[eclMediaContainerItem]"></ng-content>\n    <ng-content select="div[eclMediaContainerItem]"></ng-content>\n    <ng-content select="picture[eclMediaContainerPicture]"></ng-content>\n\n    <figcaption class="ecl-media-container__caption">\n        <ng-content></ng-content>\n    </figcaption>\n    <ng-content select="ecl-expandable"></ng-content>\n</figure>\n', styles: [":host{display:block}\n"] });
   }
 };
 i092.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i092, type: EclMediaContainerComponent, decorators: [{
@@ -6540,7 +6529,7 @@ i092.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
   args: [{ selector: "ecl-media-container", template: '<figure class="ecl-media-container__figure" [class.ecl-media-container--full-width]="isFullWidth">\n    <ng-content select="video[eclMediaContainerItem]"></ng-content>\n    <ng-content select="div[eclMediaContainerItem]"></ng-content>\n    <ng-content select="picture[eclMediaContainerPicture]"></ng-content>\n\n    <figcaption class="ecl-media-container__caption">\n        <ng-content></ng-content>\n    </figcaption>\n    <ng-content select="ecl-expandable"></ng-content>\n</figure>\n', styles: [":host{display:block}\n"] }]
 }], propDecorators: { isFullWidth: [{
   type: Input33,
-  args: [{ transform: booleanAttribute15 }]
+  args: [{ transform: booleanAttribute16 }]
 }], expandable: [{
   type: ContentChild12,
   args: [EclExpandableComponent]
@@ -6819,7 +6808,7 @@ i099.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5"
 }] } });
 
 // lib/components/ecl-featured/ecl-featured.component.mjs
-import { Component as Component44, HostBinding as HostBinding70, Input as Input37, booleanAttribute as booleanAttribute16 } from "@angular/core";
+import { Component as Component44, HostBinding as HostBinding70, Input as Input37, booleanAttribute as booleanAttribute17 } from "@angular/core";
 import * as i0100 from "@angular/core";
 var EclFeaturedComponent = class _EclFeaturedComponent extends ECLBaseDirective {
   constructor() {
@@ -6835,7 +6824,7 @@ var EclFeaturedComponent = class _EclFeaturedComponent extends ECLBaseDirective
     this.ɵfac = i0100.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0100, type: _EclFeaturedComponent, deps: null, target: i0100.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0100.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclFeaturedComponent, selector: "ecl-featured", inputs: { position: "position", isHighlighted: ["isHighlighted", "isHighlighted", booleanAttribute16] }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0100, template: `<div class="ecl-featured-item__container" [class.ecl-featured-item__container--right]="position === 'right'">
+    this.ɵcmp = i0100.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclFeaturedComponent, selector: "ecl-featured", inputs: { position: "position", isHighlighted: ["isHighlighted", "isHighlighted", booleanAttribute17] }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0100, template: `<div class="ecl-featured-item__container" [class.ecl-featured-item__container--right]="position === 'right'">
     <ng-content></ng-content>
 </div>
 <ng-content select="[eclFeaturedItemFooter]"></ng-content>` });
@@ -6851,7 +6840,7 @@ i0100.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Input37
 }], isHighlighted: [{
   type: Input37,
-  args: [{ transform: booleanAttribute16 }]
+  args: [{ transform: booleanAttribute17 }]
 }], role: [{
   type: HostBinding70,
   args: ["attr.role"]
@@ -6994,7 +6983,7 @@ i0104.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] });
 
 // lib/components/ecl-file-upload/ecl-file-upload.directive.mjs
-import { Directive as Directive29, HostBinding as HostBinding73, Input as Input38, Optional as Optional5, Self as Self3, HostListener as HostListener8, Output as Output16, EventEmitter as EventEmitter16, booleanAttribute as booleanAttribute17 } from "@angular/core";
+import { Directive as Directive29, HostBinding as HostBinding73, Input as Input38, Optional as Optional5, Self as Self3, HostListener as HostListener8, Output as Output16, EventEmitter as EventEmitter16, booleanAttribute as booleanAttribute18 } from "@angular/core";
 import { takeUntil as takeUntil12 } from "rxjs/operators";
 import { Subject as Subject12 } from "rxjs";
 import * as i0105 from "@angular/core";
@@ -7161,7 +7150,7 @@ var EclFileUploadDirective = class _EclFileUploadDirective extends ECLBaseDirect
     this.ɵfac = i0105.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0105, type: _EclFileUploadDirective, deps: [{ token: i116.NgControl, optional: true, self: true }, { token: i0105.ElementRef }, { token: i28.TranslateService }, { token: i0105.Renderer2 }], target: i0105.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0105.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclFileUploadDirective, selector: "[eclFileUpload]", inputs: { variant: "variant", isInvalid: "isInvalid", id: "id", disabled: ["disabled", "disabled", booleanAttribute17], multiple: ["multiple", "multiple", booleanAttribute17] }, outputs: { filesSelected: "filesSelected" }, host: { listeners: { "click": "onClick($event)", "change": "onFilesSelected($event)" }, properties: { "attr.id": "this.id", "attr.disabled": "this.disabled", "attr.multiple": "this.multiple", "attr.type": "this.type", "class": "this.cssClasses", "class.ecl-file-upload--invalid": "this.invalidState" } }, usesInheritance: true, ngImport: i0105 });
+    this.ɵdir = i0105.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclFileUploadDirective, selector: "[eclFileUpload]", inputs: { variant: "variant", isInvalid: "isInvalid", id: "id", disabled: ["disabled", "disabled", booleanAttribute18], multiple: ["multiple", "multiple", booleanAttribute18] }, outputs: { filesSelected: "filesSelected" }, host: { listeners: { "click": "onClick($event)", "change": "onFilesSelected($event)" }, properties: { "attr.id": "this.id", "attr.disabled": "this.disabled", "attr.multiple": "this.multiple", "attr.type": "this.type", "class": "this.cssClasses", "class.ecl-file-upload--invalid": "this.invalidState" } }, usesInheritance: true, ngImport: i0105 });
   }
 };
 i0105.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0105, type: EclFileUploadDirective, decorators: [{
@@ -7184,13 +7173,13 @@ i0105.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: ["attr.id"]
 }], disabled: [{
   type: Input38,
-  args: [{ transform: booleanAttribute17 }]
+  args: [{ transform: booleanAttribute18 }]
 }, {
   type: HostBinding73,
   args: ["attr.disabled"]
 }], multiple: [{
   type: Input38,
-  args: [{ transform: booleanAttribute17 }]
+  args: [{ transform: booleanAttribute18 }]
 }, {
   type: HostBinding73,
   args: ["attr.multiple"]
@@ -7353,7 +7342,7 @@ i0108.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-file/ecl-file-item/ecl-file-item.component.mjs
-import { Component as Component47, HostBinding as HostBinding76, Input as Input41, booleanAttribute as booleanAttribute18 } from "@angular/core";
+import { Component as Component47, HostBinding as HostBinding76, Input as Input41, booleanAttribute as booleanAttribute19 } from "@angular/core";
 import * as i0109 from "@angular/core";
 import * as i210 from "@angular/common";
 var EclFileItemComponent = class _EclFileItemComponent extends ECLBaseDirective {
@@ -7372,7 +7361,7 @@ var EclFileItemComponent = class _EclFileItemComponent extends ECLBaseDirective
     this.ɵfac = i0109.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0109, type: _EclFileItemComponent, deps: [{ token: EclFileComponent }], target: i0109.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0109.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclFileItemComponent, selector: "ecl-file-item", inputs: { isDescription: ["isDescription", "isDescription", booleanAttribute18], eclTitle: "eclTitle", titleId: "titleId", meta: "meta", label: "label", langDetail: "langDetail" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0109, template: '<ng-template [ngIf]="!isDescription">\n    <div class="ecl-file__translation-info">\n        <div class="ecl-file__translation-title" [id]="titleId" [attr.lang]="langDetail">{{ eclTitle }}</div>    \n        <div class="ecl-file__translation-meta">{{ meta }}</div>\n    </div>\n        <ng-content select="[eclFileTranslationDownload]"></ng-content>\n</ng-template>\n<ng-template [ngIf]="isDescription">\n    <ng-content></ng-content>\n</ng-template>', dependencies: [{ kind: "directive", type: i210.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    this.ɵcmp = i0109.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclFileItemComponent, selector: "ecl-file-item", inputs: { isDescription: ["isDescription", "isDescription", booleanAttribute19], eclTitle: "eclTitle", titleId: "titleId", meta: "meta", label: "label", langDetail: "langDetail" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0109, template: '<ng-template [ngIf]="!isDescription">\n    <div class="ecl-file__translation-info">\n        <div class="ecl-file__translation-title" [id]="titleId" [attr.lang]="langDetail">{{ eclTitle }}</div>    \n        <div class="ecl-file__translation-meta">{{ meta }}</div>\n    </div>\n        <ng-content select="[eclFileTranslationDownload]"></ng-content>\n</ng-template>\n<ng-template [ngIf]="isDescription">\n    <ng-content></ng-content>\n</ng-template>', dependencies: [{ kind: "directive", type: i210.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
   }
 };
 i0109.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0109, type: EclFileItemComponent, decorators: [{
@@ -7380,7 +7369,7 @@ i0109.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: [{ selector: "ecl-file-item", template: '<ng-template [ngIf]="!isDescription">\n    <div class="ecl-file__translation-info">\n        <div class="ecl-file__translation-title" [id]="titleId" [attr.lang]="langDetail">{{ eclTitle }}</div>    \n        <div class="ecl-file__translation-meta">{{ meta }}</div>\n    </div>\n        <ng-content select="[eclFileTranslationDownload]"></ng-content>\n</ng-template>\n<ng-template [ngIf]="isDescription">\n    <ng-content></ng-content>\n</ng-template>' }]
 }], ctorParameters: () => [{ type: EclFileComponent }], propDecorators: { isDescription: [{
   type: Input41,
-  args: [{ transform: booleanAttribute18 }]
+  args: [{ transform: booleanAttribute19 }]
 }], eclTitle: [{
   type: Input41
 }], titleId: [{
@@ -7397,7 +7386,7 @@ i0109.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-file/ecl-file-items/ecl-file-items.component.mjs
-import { Component as Component48, Input as Input42, ContentChildren as ContentChildren11, Output as Output17, EventEmitter as EventEmitter17, HostBinding as HostBinding77, booleanAttribute as booleanAttribute19 } from "@angular/core";
+import { Component as Component48, Input as Input42, ContentChildren as ContentChildren11, Output as Output17, EventEmitter as EventEmitter17, HostBinding as HostBinding77, booleanAttribute as booleanAttribute20 } from "@angular/core";
 import * as i0110 from "@angular/core";
 import * as i44 from "@ngx-translate/core";
 var EclFileItemsToggleEvent = class extends EclBaseEvent {
@@ -7430,7 +7419,7 @@ var EclFileItemsComponent = class _EclFileItemsComponent extends ECLBaseDirectiv
     this.ɵfac = i0110.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0110, type: _EclFileItemsComponent, deps: null, target: i0110.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0110.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclFileItemsComponent, selector: "ecl-file-items", inputs: { label: "label", isExpanded: ["isExpanded", "isExpanded", booleanAttribute19] }, outputs: { toggle: "toggle" }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "items", predicate: EclFileItemComponent }], usesInheritance: true, ngImport: i0110, template: `<button eclButton variant="ghost" class="ecl-file__translation-toggle" [attr.aria-expanded]="isExpanded" (click)="onToggleClick($event)">
+    this.ɵcmp = i0110.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclFileItemsComponent, selector: "ecl-file-items", inputs: { label: "label", isExpanded: ["isExpanded", "isExpanded", booleanAttribute20] }, outputs: { toggle: "toggle" }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "items", predicate: EclFileItemComponent }], usesInheritance: true, ngImport: i0110, template: `<button eclButton variant="ghost" class="ecl-file__translation-toggle" [attr.aria-expanded]="isExpanded" (click)="onToggleClick($event)">
     <span eclButtonLabel>
         {{ label || 'ecl.file.OTHER-LANGUAGES' | translate: { count: getItemsCount() } }}
     </span>
@@ -7461,7 +7450,7 @@ i0110.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Input42
 }], isExpanded: [{
   type: Input42,
-  args: [{ transform: booleanAttribute19 }]
+  args: [{ transform: booleanAttribute20 }]
 }], toggle: [{
   type: Output17
 }], items: [{
@@ -7789,7 +7778,7 @@ i0115.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-gallery/ecl-gallery-item.component.mjs
-import { Component as Component51, ContentChild as ContentChild16, EventEmitter as EventEmitter19, HostBinding as HostBinding81, HostListener as HostListener9, Input as Input44, Output as Output19, booleanAttribute as booleanAttribute20 } from "@angular/core";
+import { Component as Component51, ContentChild as ContentChild16, EventEmitter as EventEmitter19, HostBinding as HostBinding81, HostListener as HostListener9, Input as Input44, Output as Output19, booleanAttribute as booleanAttribute21 } from "@angular/core";
 import * as i0116 from "@angular/core";
 import * as i117 from "@angular/platform-browser";
 var EclGalleryItemClickEvent = class extends EclBaseEvent {
@@ -7847,7 +7836,7 @@ var EclGalleryItemComponent = class _EclGalleryItemComponent extends ECLBaseDire
     this.ɵfac = i0116.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0116, type: _EclGalleryItemComponent, deps: [{ token: i117.DomSanitizer }, { token: i0116.ElementRef }], target: i0116.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0116.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclGalleryItemComponent, selector: "ecl-gallery-item", inputs: { isShareable: ["isShareable", "isShareable", booleanAttribute20], mediaType: "mediaType", src: "src", label: "label", meta: "meta", description: "description", icon: "icon" }, outputs: { itemClick: "itemClick" }, host: { listeners: { "click": "onItemClick($event)" }, properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, queries: [{ propertyName: "mediaChild", first: true, predicate: EclGalleryMediaDirective, descendants: true }], usesInheritance: true, ngImport: i0116, template: `<a [href]="src" class="ecl-gallery__item-link" [attr.aria-label]="label" [class.ecl-gallery__item__link--frozen]="isNoOverlay">
+    this.ɵcmp = i0116.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclGalleryItemComponent, selector: "ecl-gallery-item", inputs: { isShareable: ["isShareable", "isShareable", booleanAttribute21], mediaType: "mediaType", src: "src", label: "label", meta: "meta", description: "description", icon: "icon" }, outputs: { itemClick: "itemClick" }, host: { listeners: { "click": "onItemClick($event)" }, properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, queries: [{ propertyName: "mediaChild", first: true, predicate: EclGalleryMediaDirective, descendants: true }], usesInheritance: true, ngImport: i0116, template: `<a [href]="src" class="ecl-gallery__item-link" [attr.aria-label]="label" [class.ecl-gallery__item__link--frozen]="isNoOverlay">
     <figure class="ecl-gallery__image-container">
         @if(mediaType !== 'image') {
         <div class="ecl-gallery__item-icon-wrapper">
@@ -7891,7 +7880,7 @@ i0116.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 </a>`, styles: [".ecl-gallery__description{width:100%}\n"] }]
 }], ctorParameters: () => [{ type: i117.DomSanitizer }, { type: i0116.ElementRef }], propDecorators: { isShareable: [{
   type: Input44,
-  args: [{ transform: booleanAttribute20 }]
+  args: [{ transform: booleanAttribute21 }]
 }], mediaType: [{
   type: Input44
 }], src: [{
@@ -7922,7 +7911,7 @@ i0116.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 
 // lib/components/ecl-gallery/ecl-gallery.component.mjs
 import { Breakpoints } from "@angular/cdk/layout";
-import { Component as Component52, ContentChild as ContentChild17, ContentChildren as ContentChildren12, EventEmitter as EventEmitter20, HostBinding as HostBinding82, HostListener as HostListener10, Input as Input45, Output as Output20, ViewChild as ViewChild7, booleanAttribute as booleanAttribute21, numberAttribute as numberAttribute3 } from "@angular/core";
+import { Component as Component52, ContentChild as ContentChild17, ContentChildren as ContentChildren12, EventEmitter as EventEmitter20, HostBinding as HostBinding82, HostListener as HostListener10, Input as Input45, Output as Output20, ViewChild as ViewChild7, booleanAttribute as booleanAttribute22, numberAttribute as numberAttribute3 } from "@angular/core";
 import { Subject as Subject13, delay } from "rxjs";
 import { takeUntil as takeUntil13 } from "rxjs/operators";
 import * as i0117 from "@angular/core";
@@ -8151,7 +8140,7 @@ var EclGalleryComponent = class _EclGalleryComponent extends ECLBaseDirective {
     this.ɵfac = i0117.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0117, type: _EclGalleryComponent, deps: [{ token: i118.BreakpointObserver }], target: i0117.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0117.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclGalleryComponent, selector: "ecl-gallery", inputs: { isOpenInFullScreenPossible: ["isOpenInFullScreenPossible", "isOpenInFullScreenPossible", booleanAttribute21], isShareable: ["isShareable", "isShareable", booleanAttribute21], isFullWidth: ["isFullWidth", "isFullWidth", booleanAttribute21], isNoOverlay: ["isNoOverlay", "isNoOverlay", booleanAttribute21], maxVisibleItems: ["maxVisibleItems", "maxVisibleItems", numberAttribute3] }, outputs: { show: "show", hide: "hide", openFullScreen: "openFullScreen", share: "share", itemSwitch: "itemSwitch" }, host: { listeners: { "document:keydown.escape": "onEscapeKeydownHandler($event)", "window:resize": "iframeResize($event)" }, properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, queries: [{ propertyName: "galleryFooter", first: true, predicate: EclGalleryFooterComponent, descendants: true }, { propertyName: "galleryItems", predicate: EclGalleryItemComponent }], viewQueries: [{ propertyName: "videoChild", first: true, predicate: ["video"], descendants: true }, { propertyName: "imageChild", first: true, predicate: ["image"], descendants: true }, { propertyName: "externalVideoChild", first: true, predicate: ["externalVideo"], descendants: true }, { propertyName: "overlayChild", first: true, predicate: ["overlay"], descendants: true }, { propertyName: "headerChild", first: true, predicate: ["header"], descendants: true }, { propertyName: "footerChild", first: true, predicate: ["footer"], descendants: true }], usesInheritance: true, ngImport: i0117, template: `<ul class="ecl-gallery__list">
+    this.ɵcmp = i0117.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclGalleryComponent, selector: "ecl-gallery", inputs: { isOpenInFullScreenPossible: ["isOpenInFullScreenPossible", "isOpenInFullScreenPossible", booleanAttribute22], isShareable: ["isShareable", "isShareable", booleanAttribute22], isFullWidth: ["isFullWidth", "isFullWidth", booleanAttribute22], isNoOverlay: ["isNoOverlay", "isNoOverlay", booleanAttribute22], maxVisibleItems: ["maxVisibleItems", "maxVisibleItems", numberAttribute3] }, outputs: { show: "show", hide: "hide", openFullScreen: "openFullScreen", share: "share", itemSwitch: "itemSwitch" }, host: { listeners: { "document:keydown.escape": "onEscapeKeydownHandler($event)", "window:resize": "iframeResize($event)" }, properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, queries: [{ propertyName: "galleryFooter", first: true, predicate: EclGalleryFooterComponent, descendants: true }, { propertyName: "galleryItems", predicate: EclGalleryItemComponent }], viewQueries: [{ propertyName: "videoChild", first: true, predicate: ["video"], descendants: true }, { propertyName: "imageChild", first: true, predicate: ["image"], descendants: true }, { propertyName: "externalVideoChild", first: true, predicate: ["externalVideo"], descendants: true }, { propertyName: "overlayChild", first: true, predicate: ["overlay"], descendants: true }, { propertyName: "headerChild", first: true, predicate: ["header"], descendants: true }, { propertyName: "footerChild", first: true, predicate: ["footer"], descendants: true }], usesInheritance: true, ngImport: i0117, template: `<ul class="ecl-gallery__list">
     <ng-content></ng-content>
 </ul>
 
@@ -8335,16 +8324,16 @@ i0117.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 </dialog>`, styles: [":host{display:block}\n"] }]
 }], ctorParameters: () => [{ type: i118.BreakpointObserver }], propDecorators: { isOpenInFullScreenPossible: [{
   type: Input45,
-  args: [{ transform: booleanAttribute21 }]
+  args: [{ transform: booleanAttribute22 }]
 }], isShareable: [{
   type: Input45,
-  args: [{ transform: booleanAttribute21 }]
+  args: [{ transform: booleanAttribute22 }]
 }], isFullWidth: [{
   type: Input45,
-  args: [{ transform: booleanAttribute21 }]
+  args: [{ transform: booleanAttribute22 }]
 }], isNoOverlay: [{
   type: Input45,
-  args: [{ transform: booleanAttribute21 }]
+  args: [{ transform: booleanAttribute22 }]
 }], maxVisibleItems: [{
   type: Input45,
   args: [{ transform: numberAttribute3 }]
@@ -8514,7 +8503,7 @@ i0120.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-sticky-container/ecl-sticky-container.component.mjs
-import { Component as Component54, HostBinding as HostBinding84, Input as Input47, booleanAttribute as booleanAttribute22 } from "@angular/core";
+import { Component as Component54, HostBinding as HostBinding84, Input as Input47, booleanAttribute as booleanAttribute23 } from "@angular/core";
 import { Subject as Subject14, delay as delay2 } from "rxjs";
 import { takeUntil as takeUntil14 } from "rxjs/operators";
 import * as i0121 from "@angular/core";
@@ -8560,7 +8549,7 @@ var EclStickyContainerComponent = class _EclStickyContainerComponent extends ECL
     this.ɵfac = i0121.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0121, type: _EclStickyContainerComponent, deps: [{ token: i119.BreakpointObserver }, { token: i0121.Renderer2 }, { token: i0121.ElementRef }], target: i0121.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0121.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclStickyContainerComponent, selector: "ecl-sticky-container", inputs: { isEnabled: ["isEnabled", "isEnabled", booleanAttribute22], marginTop: "marginTop", marginBottom: "marginBottom" }, host: { properties: { "class": "this.cssClasses", "style.top.px": "this.top", "style.bottom.px": "this.bottom" } }, usesInheritance: true, ngImport: i0121, template: "<ng-content></ng-content>\n", styles: [":host{display:block;align-self:flex-start;top:0;position:sticky;position:-webkit-sticky}:host.ecl-sticky-container--disabled{position:static}\n"] });
+    this.ɵcmp = i0121.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclStickyContainerComponent, selector: "ecl-sticky-container", inputs: { isEnabled: ["isEnabled", "isEnabled", booleanAttribute23], marginTop: "marginTop", marginBottom: "marginBottom" }, host: { properties: { "class": "this.cssClasses", "style.top.px": "this.top", "style.bottom.px": "this.bottom" } }, usesInheritance: true, ngImport: i0121, template: "<ng-content></ng-content>\n", styles: [":host{display:block;align-self:flex-start;top:0;position:sticky;position:-webkit-sticky}:host.ecl-sticky-container--disabled{position:static}\n"] });
   }
 };
 i0121.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0121, type: EclStickyContainerComponent, decorators: [{
@@ -8568,7 +8557,7 @@ i0121.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: [{ selector: "ecl-sticky-container", template: "<ng-content></ng-content>\n", styles: [":host{display:block;align-self:flex-start;top:0;position:sticky;position:-webkit-sticky}:host.ecl-sticky-container--disabled{position:static}\n"] }]
 }], ctorParameters: () => [{ type: i119.BreakpointObserver }, { type: i0121.Renderer2 }, { type: i0121.ElementRef }], propDecorators: { isEnabled: [{
   type: Input47,
-  args: [{ transform: booleanAttribute22 }]
+  args: [{ transform: booleanAttribute23 }]
 }], marginTop: [{
   type: Input47
 }], marginBottom: [{
@@ -8893,7 +8882,7 @@ i0126.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-list-illustration/ecl-list-illustration-picture.directive.mjs
-import { Directive as Directive34, HostBinding as HostBinding87, Input as Input50, booleanAttribute as booleanAttribute23 } from "@angular/core";
+import { Directive as Directive34, HostBinding as HostBinding87, Input as Input50, booleanAttribute as booleanAttribute24 } from "@angular/core";
 import * as i0127 from "@angular/core";
 var EclListIllustrationPictureDirective = class _EclListIllustrationPictureDirective extends ECLBaseDirective {
   get cssClasses() {
@@ -8932,7 +8921,7 @@ var EclListIllustrationImageDirective = class _EclListIllustrationImageDirective
     this.ɵfac = i0127.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0127, type: _EclListIllustrationImageDirective, deps: null, target: i0127.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0127.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclListIllustrationImageDirective, selector: "img[eclListIllustrationImage]", inputs: { isSquare: ["isSquare", "isSquare", booleanAttribute23], size: "size" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0127 });
+    this.ɵdir = i0127.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclListIllustrationImageDirective, selector: "img[eclListIllustrationImage]", inputs: { isSquare: ["isSquare", "isSquare", booleanAttribute24], size: "size" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0127 });
   }
 };
 i0127.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0127, type: EclListIllustrationImageDirective, decorators: [{
@@ -8942,7 +8931,7 @@ i0127.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   }]
 }], propDecorators: { isSquare: [{
   type: Input50,
-  args: [{ transform: booleanAttribute23 }]
+  args: [{ transform: booleanAttribute24 }]
 }], size: [{
   type: Input50
 }], cssClasses: [{
@@ -8951,7 +8940,7 @@ i0127.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-list-illustration/ecl-list-illustration.component.mjs
-import { Component as Component57, HostBinding as HostBinding88, Input as Input51, booleanAttribute as booleanAttribute24, numberAttribute as numberAttribute4 } from "@angular/core";
+import { Component as Component57, HostBinding as HostBinding88, Input as Input51, booleanAttribute as booleanAttribute25, numberAttribute as numberAttribute4 } from "@angular/core";
 import * as i0128 from "@angular/core";
 var EclListIllustrationComponent = class _EclListIllustrationComponent extends ECLBaseDirective {
   constructor() {
@@ -8970,7 +8959,7 @@ var EclListIllustrationComponent = class _EclListIllustrationComponent extends E
     this.ɵfac = i0128.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0128, type: _EclListIllustrationComponent, deps: null, target: i0128.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0128.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclListIllustrationComponent, selector: "ecl-list-illustration", inputs: { isZebra: ["isZebra", "isZebra", booleanAttribute24], horizontalColumns: ["horizontalColumns", "horizontalColumns", numberAttribute4] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0128, template: "<ng-content></ng-content>\n" });
+    this.ɵcmp = i0128.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclListIllustrationComponent, selector: "ecl-list-illustration", inputs: { isZebra: ["isZebra", "isZebra", booleanAttribute25], horizontalColumns: ["horizontalColumns", "horizontalColumns", numberAttribute4] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0128, template: "<ng-content></ng-content>\n" });
   }
 };
 i0128.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0128, type: EclListIllustrationComponent, decorators: [{
@@ -8978,7 +8967,7 @@ i0128.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: [{ selector: "ecl-list-illustration", template: "<ng-content></ng-content>\n" }]
 }], propDecorators: { isZebra: [{
   type: Input51,
-  args: [{ transform: booleanAttribute24 }]
+  args: [{ transform: booleanAttribute25 }]
 }], horizontalColumns: [{
   type: Input51,
   args: [{ transform: numberAttribute4 }]
@@ -9171,7 +9160,7 @@ i0131.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-list/ecl-list.directive.mjs
-import { ContentChildren as ContentChildren16, Directive as Directive36, HostBinding as HostBinding91, Input as Input53, booleanAttribute as booleanAttribute25, numberAttribute as numberAttribute5 } from "@angular/core";
+import { ContentChildren as ContentChildren16, Directive as Directive36, HostBinding as HostBinding91, Input as Input53, booleanAttribute as booleanAttribute26, numberAttribute as numberAttribute5 } from "@angular/core";
 import * as i0132 from "@angular/core";
 var EclOrderedListDirective = class _EclOrderedListDirective extends ECLBaseDirective {
   constructor() {
@@ -9226,7 +9215,7 @@ var EclUnorderedListDirective = class _EclUnorderedListDirective extends ECLBase
     this.ɵfac = i0132.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0132, type: _EclUnorderedListDirective, deps: null, target: i0132.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0132.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclUnorderedListDirective, selector: "[eclUnorderedList]", inputs: { isDivider: ["isDivider", "isDivider", booleanAttribute25], isNoMarker: ["isNoMarker", "isNoMarker", booleanAttribute25] }, host: { properties: { "class.ecl-unordered-list": "this.cmpClass", "class.ecl-unordered-list--divider": "this.isDivider", "class.ecl-unordered-list--no-marker": "this.isNoMarker" } }, usesInheritance: true, ngImport: i0132 });
+    this.ɵdir = i0132.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclUnorderedListDirective, selector: "[eclUnorderedList]", inputs: { isDivider: ["isDivider", "isDivider", booleanAttribute26], isNoMarker: ["isNoMarker", "isNoMarker", booleanAttribute26] }, host: { properties: { "class.ecl-unordered-list": "this.cmpClass", "class.ecl-unordered-list--divider": "this.isDivider", "class.ecl-unordered-list--no-marker": "this.isNoMarker" } }, usesInheritance: true, ngImport: i0132 });
   }
 };
 i0132.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0132, type: EclUnorderedListDirective, decorators: [{
@@ -9239,13 +9228,13 @@ i0132.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: ["class.ecl-unordered-list"]
 }], isDivider: [{
   type: Input53,
-  args: [{ transform: booleanAttribute25 }]
+  args: [{ transform: booleanAttribute26 }]
 }, {
   type: HostBinding91,
   args: ["class.ecl-unordered-list--divider"]
 }], isNoMarker: [{
   type: Input53,
-  args: [{ transform: booleanAttribute25 }]
+  args: [{ transform: booleanAttribute26 }]
 }, {
   type: HostBinding91,
   args: ["class.ecl-unordered-list--no-marker"]
@@ -9291,7 +9280,7 @@ var EclDescriptionListDirective = class _EclDescriptionListDirective extends ECL
     this.ɵfac = i0132.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0132, type: _EclDescriptionListDirective, deps: [{ token: i0132.ChangeDetectorRef }], target: i0132.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0132.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclDescriptionListDirective, selector: "[eclDescriptionList]", inputs: { isHorizontal: ["isHorizontal", "isHorizontal", booleanAttribute25], maxVisibleItems: ["maxVisibleItems", "maxVisibleItems", numberAttribute5] }, host: { properties: { "class.ecl-description-list--horizontal": "this.isHorizontal", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclListItems", predicate: EclDescriptionListDefinitionComponent }], usesInheritance: true, ngImport: i0132 });
+    this.ɵdir = i0132.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclDescriptionListDirective, selector: "[eclDescriptionList]", inputs: { isHorizontal: ["isHorizontal", "isHorizontal", booleanAttribute26], maxVisibleItems: ["maxVisibleItems", "maxVisibleItems", numberAttribute5] }, host: { properties: { "class.ecl-description-list--horizontal": "this.isHorizontal", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclListItems", predicate: EclDescriptionListDefinitionComponent }], usesInheritance: true, ngImport: i0132 });
   }
 };
 i0132.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0132, type: EclDescriptionListDirective, decorators: [{
@@ -9301,7 +9290,7 @@ i0132.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   }]
 }], ctorParameters: () => [{ type: i0132.ChangeDetectorRef }], propDecorators: { isHorizontal: [{
   type: Input53,
-  args: [{ transform: booleanAttribute25 }]
+  args: [{ transform: booleanAttribute26 }]
 }, {
   type: HostBinding91,
   args: ["class.ecl-description-list--horizontal"]
@@ -9444,7 +9433,7 @@ var EclMenuItemParentFocusEvent = class {
 
 // lib/components/ecl-menu/ecl-menu-mega/ecl-menu-mega-item.component.mjs
 import { ENTER } from "@angular/cdk/keycodes";
-import { Component as Component59, ContentChildren as ContentChildren17, EventEmitter as EventEmitter23, HostBinding as HostBinding92, HostListener as HostListener11, Input as Input54, Output as Output23, ViewChild as ViewChild8, booleanAttribute as booleanAttribute26, forwardRef as forwardRef35 } from "@angular/core";
+import { Component as Component59, ContentChildren as ContentChildren17, EventEmitter as EventEmitter23, HostBinding as HostBinding92, HostListener as HostListener11, Input as Input54, Output as Output23, ViewChild as ViewChild8, booleanAttribute as booleanAttribute27, forwardRef as forwardRef35 } from "@angular/core";
 import * as i0134 from "@angular/core";
 import * as i121 from "@angular/common";
 import * as i214 from "@angular/router";
@@ -9507,7 +9496,7 @@ var EclMenuMegaItemComponent = class _EclMenuMegaItemComponent extends ECLBaseDi
     this.ɵfac = i0134.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0134, type: _EclMenuMegaItemComponent, deps: null, target: i0134.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0134.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclMenuMegaItemComponent, selector: "ecl-menu-mega-item", inputs: { id: "id", label: "label", routerLink: "routerLink", queryParams: "queryParams", queryParamsHandling: "queryParamsHandling", href: "href", target: "target", isCurrent: ["isCurrent", "isCurrent", booleanAttribute26], isSeeAll: ["isSeeAll", "isSeeAll", booleanAttribute26] }, outputs: { menuItemSelect: "menuItemSelect", menuItemKeydown: "menuItemKeydown" }, host: { listeners: { "click": "onHostClick($event)" }, properties: { "class.ecl-menu__subitem": "this.cmpClass", "attr.role": "this.role", "class.ecl-menu__subitem--current": "this.isCurrent", "class.ecl-menu__see-all": "this.isSeeAll" } }, queries: [{ propertyName: "iconComponents", predicate: i0134.forwardRef(() => EclIconComponent) }, { propertyName: "links", predicate: i0134.forwardRef(() => EclLinkDirective) }], viewQueries: [{ propertyName: "megaMenuLink", first: true, predicate: ["megaMenuLink"], descendants: true }], usesInheritance: true, ngImport: i0134, template: '@if (!isSeeAll) {\n<a  #megaMenuLink\n    *ngIf="href"\n    [href]="href"\n    [target]="target"\n    class="ecl-menu__sublink"\n    [class.ecl-menu__sublink--current]="isCurrent"\n    (click)="onItemClick($event)"\n    (keydown)="onKeydown($event)">\n    {{ label }}\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</a>\n\n<a  #megaMenuLink\n    *ngIf="!href"\n    tabindex="0"\n    [routerLink]="routerLink"\n    [queryParams]="queryParams"\n    [queryParamsHandling]="queryParamsHandling"\n    class="ecl-menu__sublink"\n    [class.ecl-menu__sublink--current]="isCurrent"\n    (click)="onItemClick($event)"\n    (keydown)="onKeydown($event)">\n    {{ label }}\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</a>\n} @else {\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n', styles: [":host{display:list-item}\n"], dependencies: [{ kind: "directive", type: i121.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i121.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i214.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+    this.ɵcmp = i0134.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclMenuMegaItemComponent, selector: "ecl-menu-mega-item", inputs: { id: "id", label: "label", routerLink: "routerLink", queryParams: "queryParams", queryParamsHandling: "queryParamsHandling", href: "href", target: "target", isCurrent: ["isCurrent", "isCurrent", booleanAttribute27], isSeeAll: ["isSeeAll", "isSeeAll", booleanAttribute27] }, outputs: { menuItemSelect: "menuItemSelect", menuItemKeydown: "menuItemKeydown" }, host: { listeners: { "click": "onHostClick($event)" }, properties: { "class.ecl-menu__subitem": "this.cmpClass", "attr.role": "this.role", "class.ecl-menu__subitem--current": "this.isCurrent", "class.ecl-menu__see-all": "this.isSeeAll" } }, queries: [{ propertyName: "iconComponents", predicate: i0134.forwardRef(() => EclIconComponent) }, { propertyName: "links", predicate: i0134.forwardRef(() => EclLinkDirective) }], viewQueries: [{ propertyName: "megaMenuLink", first: true, predicate: ["megaMenuLink"], descendants: true }], usesInheritance: true, ngImport: i0134, template: '@if (!isSeeAll) {\n<a  #megaMenuLink\n    *ngIf="href"\n    [href]="href"\n    [target]="target"\n    class="ecl-menu__sublink"\n    [class.ecl-menu__sublink--current]="isCurrent"\n    (click)="onItemClick($event)"\n    (keydown)="onKeydown($event)">\n    {{ label }}\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</a>\n\n<a  #megaMenuLink\n    *ngIf="!href"\n    tabindex="0"\n    [routerLink]="routerLink"\n    [queryParams]="queryParams"\n    [queryParamsHandling]="queryParamsHandling"\n    class="ecl-menu__sublink"\n    [class.ecl-menu__sublink--current]="isCurrent"\n    (click)="onItemClick($event)"\n    (keydown)="onKeydown($event)">\n    {{ label }}\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</a>\n} @else {\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n', styles: [":host{display:list-item}\n"], dependencies: [{ kind: "directive", type: i121.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i121.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i214.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
   }
 };
 i0134.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0134, type: EclMenuMegaItemComponent, decorators: [{
@@ -9535,13 +9524,13 @@ i0134.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: ["attr.role"]
 }], isCurrent: [{
   type: Input54,
-  args: [{ transform: booleanAttribute26 }]
+  args: [{ transform: booleanAttribute27 }]
 }, {
   type: HostBinding92,
   args: ["class.ecl-menu__subitem--current"]
 }], isSeeAll: [{
   type: Input54,
-  args: [{ transform: booleanAttribute26 }]
+  args: [{ transform: booleanAttribute27 }]
 }, {
   type: HostBinding92,
   args: ["class.ecl-menu__see-all"]
@@ -11121,7 +11110,7 @@ i0141.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-modal/ecl-modal-body.component.mjs
-import { Component as Component65, HostBinding as HostBinding98, Input as Input60, booleanAttribute as booleanAttribute27 } from "@angular/core";
+import { Component as Component65, HostBinding as HostBinding98, Input as Input60, booleanAttribute as booleanAttribute28 } from "@angular/core";
 import * as i0142 from "@angular/core";
 import * as i124 from "@angular/common";
 var EclModalBodyComponent = class _EclModalBodyComponent extends ECLBaseDirective {
@@ -11139,7 +11128,7 @@ var EclModalBodyComponent = class _EclModalBodyComponent extends ECLBaseDirectiv
     this.ɵfac = i0142.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0142, type: _EclModalBodyComponent, deps: null, target: i0142.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0142.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclModalBodyComponent, selector: "[eclModalBody]", inputs: { isScrollable: ["isScrollable", "isScrollable", booleanAttribute27] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0142, template: '@if (isScrollable) {\n<div class="ecl-modal__body-scroll">\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</div>\n<div class="ecl-modal__body-overflow" aria-hidden="true"></div>\n<ng-content select="[eclModalBodyFixedContent]"></ng-content>\n} @else {\n<ng-container *ngTemplateOutlet="content"></ng-container>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>', dependencies: [{ kind: "directive", type: i124.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+    this.ɵcmp = i0142.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclModalBodyComponent, selector: "[eclModalBody]", inputs: { isScrollable: ["isScrollable", "isScrollable", booleanAttribute28] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0142, template: '@if (isScrollable) {\n<div class="ecl-modal__body-scroll">\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</div>\n<div class="ecl-modal__body-overflow" aria-hidden="true"></div>\n<ng-content select="[eclModalBodyFixedContent]"></ng-content>\n} @else {\n<ng-container *ngTemplateOutlet="content"></ng-container>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>', dependencies: [{ kind: "directive", type: i124.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
   }
 };
 i0142.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0142, type: EclModalBodyComponent, decorators: [{
@@ -11147,7 +11136,7 @@ i0142.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: [{ selector: "[eclModalBody]", template: '@if (isScrollable) {\n<div class="ecl-modal__body-scroll">\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</div>\n<div class="ecl-modal__body-overflow" aria-hidden="true"></div>\n<ng-content select="[eclModalBodyFixedContent]"></ng-content>\n} @else {\n<ng-container *ngTemplateOutlet="content"></ng-container>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>' }]
 }], propDecorators: { isScrollable: [{
   type: Input60,
-  args: [{ transform: booleanAttribute27 }]
+  args: [{ transform: booleanAttribute28 }]
 }], cssClasses: [{
   type: HostBinding98,
   args: ["class"]
@@ -11327,7 +11316,7 @@ i0147.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] });
 
 // lib/components/ecl-multiselect/ecl-multiselect-option/ecl-multiselect-option.component.mjs
-import { Component as Component67, EventEmitter as EventEmitter30, HostBinding as HostBinding101, Input as Input62, Output as Output30, ViewChild as ViewChild11, booleanAttribute as booleanAttribute28 } from "@angular/core";
+import { Component as Component67, EventEmitter as EventEmitter30, HostBinding as HostBinding101, Input as Input62, Output as Output30, ViewChild as ViewChild11, booleanAttribute as booleanAttribute29 } from "@angular/core";
 import { Subject as Subject20 } from "rxjs";
 import { v4 as uuidgen3 } from "uuid";
 import * as i0148 from "@angular/core";
@@ -11414,7 +11403,7 @@ var EclMultiselectOptionComponent = class _EclMultiselectOptionComponent extends
     this.ɵfac = i0148.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0148, type: _EclMultiselectOptionComponent, deps: [{ token: i0148.Renderer2 }], target: i0148.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0148.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclMultiselectOptionComponent, selector: "div[eclMultiselectOption]", inputs: { value: "value", label: "label", disabled: ["disabled", "disabled", booleanAttribute28], isChecked: "isChecked" }, outputs: { optionClick: "optionClick", optionKeydown: "optionKeydown" }, host: { properties: { "class.ecl-checkbox--disabled": "this.disabled", "attr.disabled": "this.disabled", "style.display": "this.display", "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "eclCheckboxInput", first: true, predicate: ["checkboxInput"], descendants: true }], usesInheritance: true, usesOnChanges: true, hostDirectives: [{ directive: EclCheckboxDirective }], ngImport: i0148, template: '<input\n    eclCheckboxInput\n    type="checkbox"\n    [id]="id"\n    [value]="value"\n    (click)="onOptionClick()"\n    (keydown)="onOptionKeydown($event)"\n    [checked]="isChecked"\n    [disabled]="disabled"\n    #checkboxInput />\n<label [for]="id" eclCheckboxLabel><span [innerHTML]="label | boldText: keyword"></span></label>\n', dependencies: [{ kind: "component", type: EclCheckboxLabelComponent, selector: "label[eclCheckboxLabel]", inputs: ["isInvalid", "isDisabled", "isRequired"] }, { kind: "directive", type: EclCheckboxInputDirective, selector: "input[eclCheckboxInput]" }, { kind: "pipe", type: BoldTextPipe, name: "boldText" }] });
+    this.ɵcmp = i0148.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclMultiselectOptionComponent, selector: "div[eclMultiselectOption]", inputs: { value: "value", label: "label", disabled: ["disabled", "disabled", booleanAttribute29], isChecked: "isChecked" }, outputs: { optionClick: "optionClick", optionKeydown: "optionKeydown" }, host: { properties: { "class.ecl-checkbox--disabled": "this.disabled", "attr.disabled": "this.disabled", "style.display": "this.display", "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "eclCheckboxInput", first: true, predicate: ["checkboxInput"], descendants: true }], usesInheritance: true, usesOnChanges: true, hostDirectives: [{ directive: EclCheckboxDirective }], ngImport: i0148, template: '<input\n    eclCheckboxInput\n    type="checkbox"\n    [id]="id"\n    [value]="value"\n    (click)="onOptionClick()"\n    (keydown)="onOptionKeydown($event)"\n    [checked]="isChecked"\n    [disabled]="disabled"\n    #checkboxInput />\n<label [for]="id" eclCheckboxLabel><span [innerHTML]="label | boldText: keyword"></span></label>\n', dependencies: [{ kind: "component", type: EclCheckboxLabelComponent, selector: "label[eclCheckboxLabel]", inputs: ["isInvalid", "isDisabled", "isRequired"] }, { kind: "directive", type: EclCheckboxInputDirective, selector: "input[eclCheckboxInput]" }, { kind: "pipe", type: BoldTextPipe, name: "boldText" }] });
   }
 };
 i0148.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0148, type: EclMultiselectOptionComponent, decorators: [{
@@ -11429,7 +11418,7 @@ i0148.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Input62
 }], disabled: [{
   type: Input62,
-  args: [{ transform: booleanAttribute28 }]
+  args: [{ transform: booleanAttribute29 }]
 }, {
   type: HostBinding101,
   args: ["class.ecl-checkbox--disabled"]
@@ -11451,7 +11440,7 @@ i0148.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-multiselect/ecl-multiselect-input/ecl-multiselect-input.component.mjs
-import { Component as Component68, EventEmitter as EventEmitter31, HostBinding as HostBinding102, Input as Input63, Output as Output31, ViewChild as ViewChild12, booleanAttribute as booleanAttribute29 } from "@angular/core";
+import { Component as Component68, EventEmitter as EventEmitter31, HostBinding as HostBinding102, Input as Input63, Output as Output31, ViewChild as ViewChild12, booleanAttribute as booleanAttribute30 } from "@angular/core";
 import * as i0149 from "@angular/core";
 import * as i53 from "@ngx-translate/core";
 var EclMultiselectMainInputClickEvent = class {
@@ -11521,7 +11510,7 @@ var EclMultiselectInputComponent = class _EclMultiselectInputComponent extends E
     this.ɵfac = i0149.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0149, type: _EclMultiselectInputComponent, deps: [{ token: EclThemeService }, { token: i0149.Renderer2 }], target: i0149.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0149.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclMultiselectInputComponent, selector: "div[eclMultiselectInput]", inputs: { eclSize: "eclSize", toggleId: "toggleId", toggleLabel: "toggleLabel", isDisabled: ["isDisabled", "isDisabled", booleanAttribute29], isInvalid: ["isInvalid", "isInvalid", booleanAttribute29], inputPlaceholder: "inputPlaceholder", selectedItems: "selectedItems", isDropdownExpanded: "isDropdownExpanded", ariaControls: "ariaControls", ariaDescribedby: "ariaDescribedby", ariaLabeledby: "ariaLabeledby" }, outputs: { mainInputClick: "mainInputClick", mainInputKeydown: "mainInputKeydown" }, host: { properties: { "class.ecl-select__container--disabled": "this.isDisabled", "class.ecl-select__container--invalid": "this.isInvalid", "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "inputMultiselect", first: true, predicate: ["inputMultiselect"], descendants: true }], usesInheritance: true, ngImport: i0149, template: `<div [class.ecl-select-multiple-selections-counter--visible]="isShowCounter" class="ecl-select-multiple-selections-counter">
+    this.ɵcmp = i0149.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclMultiselectInputComponent, selector: "div[eclMultiselectInput]", inputs: { eclSize: "eclSize", toggleId: "toggleId", toggleLabel: "toggleLabel", isDisabled: ["isDisabled", "isDisabled", booleanAttribute30], isInvalid: ["isInvalid", "isInvalid", booleanAttribute30], inputPlaceholder: "inputPlaceholder", selectedItems: "selectedItems", isDropdownExpanded: "isDropdownExpanded", ariaControls: "ariaControls", ariaDescribedby: "ariaDescribedby", ariaLabeledby: "ariaLabeledby" }, outputs: { mainInputClick: "mainInputClick", mainInputKeydown: "mainInputKeydown" }, host: { properties: { "class.ecl-select__container--disabled": "this.isDisabled", "class.ecl-select__container--invalid": "this.isInvalid", "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "inputMultiselect", first: true, predicate: ["inputMultiselect"], descendants: true }], usesInheritance: true, ngImport: i0149, template: `<div [class.ecl-select-multiple-selections-counter--visible]="isShowCounter" class="ecl-select-multiple-selections-counter">
     <span>{{ selectedItemsCount }}</span>
 </div>
 <button
@@ -11585,13 +11574,13 @@ i0149.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Input63
 }], isDisabled: [{
   type: Input63,
-  args: [{ transform: booleanAttribute29 }]
+  args: [{ transform: booleanAttribute30 }]
 }, {
   type: HostBinding102,
   args: ["class.ecl-select__container--disabled"]
 }], isInvalid: [{
   type: Input63,
-  args: [{ transform: booleanAttribute29 }]
+  args: [{ transform: booleanAttribute30 }]
 }, {
   type: HostBinding102,
   args: ["class.ecl-select__container--invalid"]
@@ -11655,7 +11644,7 @@ i0150.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-multiselect/ecl-multiselect-dropdown/ecl-multiselect-dropdown.component.mjs
-import { booleanAttribute as booleanAttribute30, Component as Component70, ElementRef as ElementRef24, EventEmitter as EventEmitter32, forwardRef as forwardRef43, HostBinding as HostBinding104, HostListener as HostListener17, Input as Input65, Output as Output32, ViewChild as ViewChild13, ViewChildren as ViewChildren2 } from "@angular/core";
+import { booleanAttribute as booleanAttribute31, Component as Component70, ElementRef as ElementRef24, EventEmitter as EventEmitter32, forwardRef as forwardRef43, HostBinding as HostBinding104, HostListener as HostListener17, Input as Input65, Output as Output32, ViewChild as ViewChild13, ViewChildren as ViewChildren2 } from "@angular/core";
 import { NG_VALUE_ACCESSOR as NG_VALUE_ACCESSOR4 } from "@angular/forms";
 import { Subject as Subject21 } from "rxjs";
 import { v4 as uuidgen4 } from "uuid";
@@ -12041,7 +12030,7 @@ var EclMultiselectDropdownComponent = class _EclMultiselectDropdownComponent ext
     this.ɵfac = i0151.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0151, type: _EclMultiselectDropdownComponent, deps: [{ token: i0151.ElementRef }, { token: i0151.IterableDiffers }, { token: i0151.Renderer2 }], target: i0151.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0151.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclMultiselectDropdownComponent, selector: "div[eclMultiselectDropdown]", inputs: { isInvalid: ["isInvalid", "isInvalid", booleanAttribute30], mainInputPlaceholder: "mainInputPlaceholder", searchFieldPlaceholder: "searchFieldPlaceholder", eclSize: "eclSize", disabled: ["disabled", "disabled", booleanAttribute30] }, outputs: { eclChange: "eclChange" }, host: { listeners: { "document:keyup.escape": "onEscapeKey($event)", "document:click": "onKeyUp($event)" }, properties: { "class": "this.cssClasses", "attr.disabled": "this.disabled" } }, providers: [
+    this.ɵcmp = i0151.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclMultiselectDropdownComponent, selector: "div[eclMultiselectDropdown]", inputs: { isInvalid: ["isInvalid", "isInvalid", booleanAttribute31], mainInputPlaceholder: "mainInputPlaceholder", searchFieldPlaceholder: "searchFieldPlaceholder", eclSize: "eclSize", disabled: ["disabled", "disabled", booleanAttribute31] }, outputs: { eclChange: "eclChange" }, host: { listeners: { "document:keyup.escape": "onEscapeKey($event)", "document:click": "onKeyUp($event)" }, properties: { "class": "this.cssClasses", "attr.disabled": "this.disabled" } }, providers: [
       {
         provide: NG_VALUE_ACCESSOR4,
         useExisting: forwardRef43(() => _EclMultiselectDropdownComponent),
@@ -12262,7 +12251,7 @@ i0151.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Output32
 }], isInvalid: [{
   type: Input65,
-  args: [{ transform: booleanAttribute30 }]
+  args: [{ transform: booleanAttribute31 }]
 }], cssClasses: [{
   type: HostBinding104,
   args: ["class"]
@@ -12274,7 +12263,7 @@ i0151.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Input65
 }], disabled: [{
   type: Input65,
-  args: [{ transform: booleanAttribute30 }]
+  args: [{ transform: booleanAttribute31 }]
 }, {
   type: HostBinding104,
   args: ["attr.disabled"]
@@ -12353,7 +12342,7 @@ i0152.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 
 // lib/components/ecl-multiselect/ecl-multiselect.component.mjs
 import { coerceBooleanProperty as coerceBooleanProperty3 } from "@angular/cdk/coercion";
-import { booleanAttribute as booleanAttribute31, Component as Component71, ContentChildren as ContentChildren23, EventEmitter as EventEmitter33, forwardRef as forwardRef44, HostBinding as HostBinding106, Input as Input67, Output as Output33, ViewEncapsulation as ViewEncapsulation9 } from "@angular/core";
+import { booleanAttribute as booleanAttribute32, Component as Component71, ContentChildren as ContentChildren23, EventEmitter as EventEmitter33, forwardRef as forwardRef44, HostBinding as HostBinding106, Input as Input67, Output as Output33, ViewEncapsulation as ViewEncapsulation9 } from "@angular/core";
 import { NG_VALUE_ACCESSOR as NG_VALUE_ACCESSOR5, NgControl as NgControl4 } from "@angular/forms";
 import { Subject as Subject23, takeUntil as takeUntil20 } from "rxjs";
 import * as i0153 from "@angular/core";
@@ -12488,7 +12477,7 @@ var EclMultiselectComponent = class _EclMultiselectComponent extends ECLBaseDire
     this.ɵfac = i0153.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0153, type: _EclMultiselectComponent, deps: [{ token: i0153.Injector }, { token: i0153.ElementRef }, { token: i0153.ViewContainerRef }, { token: i0153.IterableDiffers }, { token: i0153.Renderer2 }], target: i0153.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0153.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclMultiselectComponent, selector: "select[eclMultiselect]", inputs: { ariaDescribedby: "ariaDescribedby", ariaLabeledby: "ariaLabeledby", id: "id", toggleLabel: "toggleLabel", isInvalid: ["isInvalid", "isInvalid", booleanAttribute31], disabled: "disabled", eclPlaceholder: "eclPlaceholder", eclSize: "eclSize" }, outputs: { eclChange: "eclChange" }, host: { properties: { "attr.disabled": "this.disabled", "class": "this.cssClasses" } }, providers: [
+    this.ɵcmp = i0153.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclMultiselectComponent, selector: "select[eclMultiselect]", inputs: { ariaDescribedby: "ariaDescribedby", ariaLabeledby: "ariaLabeledby", id: "id", toggleLabel: "toggleLabel", isInvalid: ["isInvalid", "isInvalid", booleanAttribute32], disabled: "disabled", eclPlaceholder: "eclPlaceholder", eclSize: "eclSize" }, outputs: { eclChange: "eclChange" }, host: { properties: { "attr.disabled": "this.disabled", "class": "this.cssClasses" } }, providers: [
       {
         provide: NG_VALUE_ACCESSOR5,
         useExisting: forwardRef44(() => _EclMultiselectComponent),
@@ -12519,7 +12508,7 @@ i0153.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Input67
 }], isInvalid: [{
   type: Input67,
-  args: [{ transform: booleanAttribute31 }]
+  args: [{ transform: booleanAttribute32 }]
 }], disabled: [{
   type: Input67
 }, {
@@ -12645,7 +12634,7 @@ i0155.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-navigation-list/ecl-navigation-list.component.mjs
-import { Component as Component73, ContentChildren as ContentChildren24, HostBinding as HostBinding108, Input as Input69, booleanAttribute as booleanAttribute32, forwardRef as forwardRef48, numberAttribute as numberAttribute7 } from "@angular/core";
+import { Component as Component73, ContentChildren as ContentChildren24, HostBinding as HostBinding108, Input as Input69, booleanAttribute as booleanAttribute33, forwardRef as forwardRef48, numberAttribute as numberAttribute7 } from "@angular/core";
 import * as i0156 from "@angular/core";
 var EclNavigationListComponent = class _EclNavigationListComponent extends ECLBaseDirective {
   constructor() {
@@ -12668,7 +12657,7 @@ var EclNavigationListComponent = class _EclNavigationListComponent extends ECLBa
     this.ɵfac = i0156.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0156, type: _EclNavigationListComponent, deps: null, target: i0156.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0156.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclNavigationListComponent, selector: "ecl-navigation-list", inputs: { columns: ["columns", "columns", numberAttribute7], hasBorders: ["hasBorders", "hasBorders", booleanAttribute32] }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "listItems", predicate: i0156.forwardRef(() => EclNavigationListItemComponent) }], usesInheritance: true, ngImport: i0156, template: "<ng-content></ng-content>\n" });
+    this.ɵcmp = i0156.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclNavigationListComponent, selector: "ecl-navigation-list", inputs: { columns: ["columns", "columns", numberAttribute7], hasBorders: ["hasBorders", "hasBorders", booleanAttribute33] }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "listItems", predicate: i0156.forwardRef(() => EclNavigationListItemComponent) }], usesInheritance: true, ngImport: i0156, template: "<ng-content></ng-content>\n" });
   }
 };
 i0156.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0156, type: EclNavigationListComponent, decorators: [{
@@ -12682,7 +12671,7 @@ i0156.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: [{ transform: numberAttribute7 }]
 }], hasBorders: [{
   type: Input69,
-  args: [{ transform: booleanAttribute32 }]
+  args: [{ transform: booleanAttribute33 }]
 }], listItems: [{
   type: ContentChildren24,
   args: [forwardRef48(() => EclNavigationListItemComponent)]
@@ -12881,7 +12870,7 @@ i0160.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-news-ticker/ecl-news-ticker.component.mjs
-import { Component as Component76, ContentChildren as ContentChildren25, EventEmitter as EventEmitter35, HostBinding as HostBinding112, HostListener as HostListener18, Input as Input71, Output as Output35, ViewChild as ViewChild14, booleanAttribute as booleanAttribute33 } from "@angular/core";
+import { Component as Component76, ContentChildren as ContentChildren25, EventEmitter as EventEmitter35, HostBinding as HostBinding112, HostListener as HostListener18, Input as Input71, Output as Output35, ViewChild as ViewChild14, booleanAttribute as booleanAttribute34 } from "@angular/core";
 import { Subject as Subject25, takeUntil as takeUntil22 } from "rxjs";
 import * as i0161 from "@angular/core";
 import * as i54 from "@ngx-translate/core";
@@ -13072,7 +13061,7 @@ var EclNewsTickerComponent = class _EclNewsTickerComponent extends ECLBaseDirect
     this.ɵfac = i0161.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0161, type: _EclNewsTickerComponent, deps: [{ token: i0161.Renderer2 }], target: i0161.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0161.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclNewsTickerComponent, selector: "ecl-news-ticker", inputs: { isAutoplay: ["isAutoplay", "isAutoplay", booleanAttribute33] }, outputs: { itemSwitch: "itemSwitch" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "newsTickerItems", predicate: EclNewsTickerItemComponent }], viewQueries: [{ propertyName: "firstHiddenItem", first: true, predicate: ["firstHiddenItem"], descendants: true }, { propertyName: "lastHiddenItem", first: true, predicate: ["lastHiddenItem"], descendants: true }, { propertyName: "slidesContainer", first: true, predicate: ["slidesContainer"], descendants: true }], usesInheritance: true, ngImport: i0161, template: `<div class="ecl-news-ticker__container" [style.height.px]="containerHeight">
+    this.ɵcmp = i0161.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclNewsTickerComponent, selector: "ecl-news-ticker", inputs: { isAutoplay: ["isAutoplay", "isAutoplay", booleanAttribute34] }, outputs: { itemSwitch: "itemSwitch" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "newsTickerItems", predicate: EclNewsTickerItemComponent }], viewQueries: [{ propertyName: "firstHiddenItem", first: true, predicate: ["firstHiddenItem"], descendants: true }, { propertyName: "lastHiddenItem", first: true, predicate: ["lastHiddenItem"], descendants: true }, { propertyName: "slidesContainer", first: true, predicate: ["slidesContainer"], descendants: true }], usesInheritance: true, ngImport: i0161, template: `<div class="ecl-news-ticker__container" [style.height.px]="containerHeight">
     <ecl-icon icon="information" size="m" class="ecl-news-ticker__icon"></ecl-icon>
     <div class="ecl-news-ticker__content" [style.height.px]="contentHeight">
         <ul
@@ -13186,7 +13175,7 @@ i0161.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }` }]
 }], ctorParameters: () => [{ type: i0161.Renderer2 }], propDecorators: { isAutoplay: [{
   type: Input71,
-  args: [{ transform: booleanAttribute33 }]
+  args: [{ transform: booleanAttribute34 }]
 }], itemSwitch: [{
   type: Output35
 }], newsTickerItems: [{
@@ -13235,7 +13224,7 @@ i0162.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] });
 
 // lib/components/ecl-notification/ecl-notification.component.mjs
-import { Component as Component77, Input as Input72, Output as Output36, EventEmitter as EventEmitter36, HostBinding as HostBinding113, booleanAttribute as booleanAttribute34 } from "@angular/core";
+import { Component as Component77, Input as Input72, Output as Output36, EventEmitter as EventEmitter36, HostBinding as HostBinding113, booleanAttribute as booleanAttribute35 } from "@angular/core";
 import * as i0163 from "@angular/core";
 import * as i55 from "@angular/common";
 import * as i63 from "@ngx-translate/core";
@@ -13281,7 +13270,7 @@ var EclNotificationComponent = class _EclNotificationComponent extends ECLBaseDi
     this.ɵfac = i0163.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0163, type: _EclNotificationComponent, deps: [{ token: EclThemeService }], target: i0163.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0163.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclNotificationComponent, selector: "ecl-notification", inputs: { notificationTitle: "notificationTitle", variant: "variant", isVisible: ["isVisible", "isVisible", booleanAttribute34], isCloseable: ["isCloseable", "isCloseable", booleanAttribute34] }, outputs: { close: "close" }, host: { properties: { "attr.role": "this.role", "class.ecl-u-d-none": "this.isHidden", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0163, template: `@if( eclThemeService.isEC$ | async ){
+    this.ɵcmp = i0163.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclNotificationComponent, selector: "ecl-notification", inputs: { notificationTitle: "notificationTitle", variant: "variant", isVisible: ["isVisible", "isVisible", booleanAttribute35], isCloseable: ["isCloseable", "isCloseable", booleanAttribute35] }, outputs: { close: "close" }, host: { properties: { "attr.role": "this.role", "class.ecl-u-d-none": "this.isHidden", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0163, template: `@if( eclThemeService.isEC$ | async ){
     <ecl-icon size="l" class="ecl-notification__icon" [icon]="icon" [ariaHidden]="false" role="img">
         <title>{{ icon | titlecase }}</title>
     </ecl-icon>
@@ -13357,10 +13346,10 @@ i0163.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Input72
 }], isVisible: [{
   type: Input72,
-  args: [{ transform: booleanAttribute34 }]
+  args: [{ transform: booleanAttribute35 }]
 }], isCloseable: [{
   type: Input72,
-  args: [{ transform: booleanAttribute34 }]
+  args: [{ transform: booleanAttribute35 }]
 }], close: [{
   type: Output36
 }], role: [{
@@ -13399,7 +13388,7 @@ i0164.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-site-footer/ecl-footer-elements/ecl-site-footer-section.directive.mjs
-import { Directive as Directive43, HostBinding as HostBinding115, Input as Input73, booleanAttribute as booleanAttribute35 } from "@angular/core";
+import { Directive as Directive43, HostBinding as HostBinding115, Input as Input73, booleanAttribute as booleanAttribute36 } from "@angular/core";
 import * as i0165 from "@angular/core";
 var EclSiteFooterSectionDirective = class _EclSiteFooterSectionDirective extends ECLBaseDirective {
   constructor() {
@@ -13414,7 +13403,7 @@ var EclSiteFooterSectionDirective = class _EclSiteFooterSectionDirective extends
     this.ɵfac = i0165.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0165, type: _EclSiteFooterSectionDirective, deps: null, target: i0165.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0165.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclSiteFooterSectionDirective, selector: "[eclSiteFooterSection]", inputs: { isCondensed: ["isCondensed", "isCondensed", booleanAttribute35], isSiteInfo: ["isSiteInfo", "isSiteInfo", booleanAttribute35], isSplitList: ["isSplitList", "isSplitList", booleanAttribute35], hasSeparator: ["hasSeparator", "hasSeparator", booleanAttribute35] }, host: { properties: { "class.ecl-site-footer__section": "this.cmpClass", "class.ecl-site-footer__section--condensed": "this.isCondensed", "class.ecl-site-footer__section--site-info": "this.isSiteInfo", "class.ecl-site-footer__section--split-list": "this.isSplitList", "class.ecl-site-footer__section--separator": "this.hasSeparator" } }, usesInheritance: true, ngImport: i0165 });
+    this.ɵdir = i0165.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclSiteFooterSectionDirective, selector: "[eclSiteFooterSection]", inputs: { isCondensed: ["isCondensed", "isCondensed", booleanAttribute36], isSiteInfo: ["isSiteInfo", "isSiteInfo", booleanAttribute36], isSplitList: ["isSplitList", "isSplitList", booleanAttribute36], hasSeparator: ["hasSeparator", "hasSeparator", booleanAttribute36] }, host: { properties: { "class.ecl-site-footer__section": "this.cmpClass", "class.ecl-site-footer__section--condensed": "this.isCondensed", "class.ecl-site-footer__section--site-info": "this.isSiteInfo", "class.ecl-site-footer__section--split-list": "this.isSplitList", "class.ecl-site-footer__section--separator": "this.hasSeparator" } }, usesInheritance: true, ngImport: i0165 });
   }
 };
 i0165.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0165, type: EclSiteFooterSectionDirective, decorators: [{
@@ -13427,19 +13416,19 @@ i0165.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: ["class.ecl-site-footer__section"]
 }], isCondensed: [{
   type: Input73,
-  args: [{ transform: booleanAttribute35 }]
+  args: [{ transform: booleanAttribute36 }]
 }, {
   type: HostBinding115,
   args: ["class.ecl-site-footer__section--condensed"]
 }], isSiteInfo: [{
   type: Input73,
-  args: [{ transform: booleanAttribute35 }]
+  args: [{ transform: booleanAttribute36 }]
 }, {
   type: HostBinding115,
   args: ["class.ecl-site-footer__section--site-info"]
 }], isSplitList: [{
   type: Input73,
-  args: [{ transform: booleanAttribute35 }]
+  args: [{ transform: booleanAttribute36 }]
 }, {
   type: HostBinding115,
   args: ["class.ecl-site-footer__section--split-list"]
@@ -13448,11 +13437,11 @@ i0165.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: ["class.ecl-site-footer__section--separator"]
 }, {
   type: Input73,
-  args: [{ transform: booleanAttribute35 }]
+  args: [{ transform: booleanAttribute36 }]
 }] } });
 
 // lib/components/ecl-site-footer/ecl-footer-elements/ecl-site-footer-title.directive.mjs
-import { Directive as Directive44, HostBinding as HostBinding116, Input as Input74, booleanAttribute as booleanAttribute36 } from "@angular/core";
+import { Directive as Directive44, HostBinding as HostBinding116, Input as Input74, booleanAttribute as booleanAttribute37 } from "@angular/core";
 import * as i0166 from "@angular/core";
 var EclSiteFooterTitleDirective = class _EclSiteFooterTitleDirective extends ECLBaseDirective {
   constructor() {
@@ -13464,7 +13453,7 @@ var EclSiteFooterTitleDirective = class _EclSiteFooterTitleDirective extends ECL
     this.ɵfac = i0166.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0166, type: _EclSiteFooterTitleDirective, deps: null, target: i0166.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0166.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclSiteFooterTitleDirective, selector: "[eclSiteFooterTitle]", inputs: { isSeparator: ["isSeparator", "isSeparator", booleanAttribute36] }, host: { properties: { "class.ecl-site-footer__title": "this.cmpClass", "class.ecl-site-footer__title--separator": "this.isSeparator" } }, usesInheritance: true, ngImport: i0166 });
+    this.ɵdir = i0166.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclSiteFooterTitleDirective, selector: "[eclSiteFooterTitle]", inputs: { isSeparator: ["isSeparator", "isSeparator", booleanAttribute37] }, host: { properties: { "class.ecl-site-footer__title": "this.cmpClass", "class.ecl-site-footer__title--separator": "this.isSeparator" } }, usesInheritance: true, ngImport: i0166 });
   }
 };
 i0166.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0166, type: EclSiteFooterTitleDirective, decorators: [{
@@ -13477,7 +13466,7 @@ i0166.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: ["class.ecl-site-footer__title"]
 }], isSeparator: [{
   type: Input74,
-  args: [{ transform: booleanAttribute36 }]
+  args: [{ transform: booleanAttribute37 }]
 }, {
   type: HostBinding116,
   args: ["class.ecl-site-footer__title--separator"]
@@ -13530,7 +13519,7 @@ i0167.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-site-footer/ecl-footer-elements/ecl-site-footer-list.directive.mjs
-import { Directive as Directive46, HostBinding as HostBinding118, Input as Input75, booleanAttribute as booleanAttribute37 } from "@angular/core";
+import { Directive as Directive46, HostBinding as HostBinding118, Input as Input75, booleanAttribute as booleanAttribute38 } from "@angular/core";
 import * as i0168 from "@angular/core";
 var EclSiteFooterListDirective = class _EclSiteFooterListDirective extends ECLBaseDirective {
   constructor() {
@@ -13541,7 +13530,7 @@ var EclSiteFooterListDirective = class _EclSiteFooterListDirective extends ECLBa
     this.ɵfac = i0168.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0168, type: _EclSiteFooterListDirective, deps: null, target: i0168.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0168.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclSiteFooterListDirective, selector: "[eclSiteFooterList]", inputs: { isInline: ["isInline", "isInline", booleanAttribute37], isColumns: ["isColumns", "isColumns", booleanAttribute37] }, host: { properties: { "class.ecl-site-footer__list": "this.cmpClass", "class.ecl-site-footer__list--inline": "this.isInline", "class.ecl-site-footer__list--columns": "this.isColumns" } }, usesInheritance: true, ngImport: i0168 });
+    this.ɵdir = i0168.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclSiteFooterListDirective, selector: "[eclSiteFooterList]", inputs: { isInline: ["isInline", "isInline", booleanAttribute38], isColumns: ["isColumns", "isColumns", booleanAttribute38] }, host: { properties: { "class.ecl-site-footer__list": "this.cmpClass", "class.ecl-site-footer__list--inline": "this.isInline", "class.ecl-site-footer__list--columns": "this.isColumns" } }, usesInheritance: true, ngImport: i0168 });
   }
 };
 i0168.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0168, type: EclSiteFooterListDirective, decorators: [{
@@ -13554,13 +13543,13 @@ i0168.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: ["class.ecl-site-footer__list"]
 }], isInline: [{
   type: Input75,
-  args: [{ transform: booleanAttribute37 }]
+  args: [{ transform: booleanAttribute38 }]
 }, {
   type: HostBinding118,
   args: ["class.ecl-site-footer__list--inline"]
 }], isColumns: [{
   type: Input75,
-  args: [{ transform: booleanAttribute37 }]
+  args: [{ transform: booleanAttribute38 }]
 }, {
   type: HostBinding118,
   args: ["class.ecl-site-footer__list--columns"]
@@ -13806,7 +13795,7 @@ i0170.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-site-footer/ecl-footer-elements/ec/ecl-site-footer-fixed-content.mjs
-import { Component as Component78, Input as Input76, booleanAttribute as booleanAttribute38 } from "@angular/core";
+import { Component as Component78, Input as Input76, booleanAttribute as booleanAttribute39 } from "@angular/core";
 import * as i0171 from "@angular/core";
 import * as i126 from "@ngx-translate/core";
 import * as i32 from "@angular/common";
@@ -13821,7 +13810,7 @@ var EclSiteFooterFixedContentECComponent = class _EclSiteFooterFixedContentECCom
     this.ɵfac = i0171.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0171, type: _EclSiteFooterFixedContentECComponent, deps: [{ token: i126.TranslateService }, { token: EclLanguageService }], target: i0171.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0171.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclSiteFooterFixedContentECComponent, selector: "ecl-site-footer-fixed-content-ec", inputs: { isCore: ["isCore", "isCore", booleanAttribute38], languageCode: "languageCode", ecLogoLanguageCode: "ecLogoLanguageCode", content: "content" }, usesInheritance: true, ngImport: i0171, template: `@if(isCore){
+    this.ɵcmp = i0171.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclSiteFooterFixedContentECComponent, selector: "ecl-site-footer-fixed-content-ec", inputs: { isCore: ["isCore", "isCore", booleanAttribute39], languageCode: "languageCode", ecLogoLanguageCode: "ecLogoLanguageCode", content: "content" }, usesInheritance: true, ngImport: i0171, template: `@if(isCore){
     <div eclSiteFooterRow>
         <div eclSiteFooterColumn>
             <div eclSiteFooterSection>
@@ -14715,7 +14704,7 @@ i0171.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 ` }]
 }], ctorParameters: () => [{ type: i126.TranslateService }, { type: EclLanguageService }], propDecorators: { isCore: [{
   type: Input76,
-  args: [{ transform: booleanAttribute38 }]
+  args: [{ transform: booleanAttribute39 }]
 }], languageCode: [{
   type: Input76
 }], ecLogoLanguageCode: [{
@@ -14725,7 +14714,7 @@ i0171.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-site-footer/ecl-footer-elements/eu/ecl-site-footer-fixed-content.mjs
-import { Component as Component79, Input as Input77, booleanAttribute as booleanAttribute39 } from "@angular/core";
+import { Component as Component79, Input as Input77, booleanAttribute as booleanAttribute40 } from "@angular/core";
 import * as i0172 from "@angular/core";
 import * as i127 from "@ngx-translate/core";
 import * as i33 from "@angular/common";
@@ -14749,7 +14738,7 @@ var EclSiteFooterFixedContentEUComponent = class _EclSiteFooterFixedContentEUCom
     this.ɵfac = i0172.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0172, type: _EclSiteFooterFixedContentEUComponent, deps: [{ token: i127.TranslateService }, { token: EclLanguageService }], target: i0172.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0172.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclSiteFooterFixedContentEUComponent, selector: "ecl-site-footer-fixed-content-eu", inputs: { isCore: ["isCore", "isCore", booleanAttribute39], languageCode: "languageCode", ecLogoLanguageCode: "ecLogoLanguageCode", content: "content" }, usesInheritance: true, ngImport: i0172, template: `@if(isCore){
+    this.ɵcmp = i0172.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclSiteFooterFixedContentEUComponent, selector: "ecl-site-footer-fixed-content-eu", inputs: { isCore: ["isCore", "isCore", booleanAttribute40], languageCode: "languageCode", ecLogoLanguageCode: "ecLogoLanguageCode", content: "content" }, usesInheritance: true, ngImport: i0172, template: `@if(isCore){
     <div eclSiteFooterRow>
         <div eclSiteFooterColumn>
             <div eclSiteFooterSection>
@@ -16063,7 +16052,7 @@ i0172.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 ` }]
 }], ctorParameters: () => [{ type: i127.TranslateService }, { type: EclLanguageService }], propDecorators: { isCore: [{
   type: Input77,
-  args: [{ transform: booleanAttribute39 }]
+  args: [{ transform: booleanAttribute40 }]
 }], languageCode: [{
   type: Input77
 }], ecLogoLanguageCode: [{
@@ -16073,7 +16062,7 @@ i0172.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-site-footer/ecl-site-footer.component.mjs
-import { Component as Component80, HostBinding as HostBinding121, Input as Input78, booleanAttribute as booleanAttribute40 } from "@angular/core";
+import { Component as Component80, HostBinding as HostBinding121, Input as Input78, booleanAttribute as booleanAttribute41 } from "@angular/core";
 import * as i0173 from "@angular/core";
 import * as i128 from "@ngx-translate/core";
 import * as i56 from "@angular/common";
@@ -16105,7 +16094,7 @@ var EclSiteFooterComponent = class _EclSiteFooterComponent extends ECLBaseDirect
     this.ɵfac = i0173.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0173, type: _EclSiteFooterComponent, deps: [{ token: i128.TranslateService }, { token: EclLanguageService }, { token: EclThemeService }], target: i0173.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0173.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclSiteFooterComponent, selector: "ecl-site-footer", inputs: { isCore: ["isCore", "isCore", booleanAttribute40] }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, usesInheritance: true, ngImport: i0173, template: '<div class="ecl-container ecl-site-footer__container">\n    @if(eclThemeService.isEC$ | async) {\n    <ecl-site-footer-fixed-content-ec\n        [isCore]="isCore"\n        [languageCode]="languageCode"\n        [ecLogoLanguageCode]="getLanguageCode()"\n        [content]="content">\n    </ecl-site-footer-fixed-content-ec>\n    }\n    @if(eclThemeService.isEU$ | async) {\n        <ecl-site-footer-fixed-content-eu\n            [isCore]="isCore"\n            [languageCode]="languageCode"\n            [ecLogoLanguageCode]="getLanguageCode()"\n            [content]="content">\n        </ecl-site-footer-fixed-content-eu>\n    }\n\n    <ng-template #content>\n        <ng-content></ng-content>\n    </ng-template>\n</div>\n', dependencies: [{ kind: "component", type: EclSiteFooterFixedContentECComponent, selector: "ecl-site-footer-fixed-content-ec", inputs: ["isCore", "languageCode", "ecLogoLanguageCode", "content"] }, { kind: "component", type: EclSiteFooterFixedContentEUComponent, selector: "ecl-site-footer-fixed-content-eu", inputs: ["isCore", "languageCode", "ecLogoLanguageCode", "content"] }, { kind: "pipe", type: i56.AsyncPipe, name: "async" }] });
+    this.ɵcmp = i0173.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclSiteFooterComponent, selector: "ecl-site-footer", inputs: { isCore: ["isCore", "isCore", booleanAttribute41] }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, usesInheritance: true, ngImport: i0173, template: '<div class="ecl-container ecl-site-footer__container">\n    @if(eclThemeService.isEC$ | async) {\n    <ecl-site-footer-fixed-content-ec\n        [isCore]="isCore"\n        [languageCode]="languageCode"\n        [ecLogoLanguageCode]="getLanguageCode()"\n        [content]="content">\n    </ecl-site-footer-fixed-content-ec>\n    }\n    @if(eclThemeService.isEU$ | async) {\n        <ecl-site-footer-fixed-content-eu\n            [isCore]="isCore"\n            [languageCode]="languageCode"\n            [ecLogoLanguageCode]="getLanguageCode()"\n            [content]="content">\n        </ecl-site-footer-fixed-content-eu>\n    }\n\n    <ng-template #content>\n        <ng-content></ng-content>\n    </ng-template>\n</div>\n', dependencies: [{ kind: "component", type: EclSiteFooterFixedContentECComponent, selector: "ecl-site-footer-fixed-content-ec", inputs: ["isCore", "languageCode", "ecLogoLanguageCode", "content"] }, { kind: "component", type: EclSiteFooterFixedContentEUComponent, selector: "ecl-site-footer-fixed-content-eu", inputs: ["isCore", "languageCode", "ecLogoLanguageCode", "content"] }, { kind: "pipe", type: i56.AsyncPipe, name: "async" }] });
   }
 };
 i0173.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0173, type: EclSiteFooterComponent, decorators: [{
@@ -16113,7 +16102,7 @@ i0173.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: [{ selector: "ecl-site-footer", template: '<div class="ecl-container ecl-site-footer__container">\n    @if(eclThemeService.isEC$ | async) {\n    <ecl-site-footer-fixed-content-ec\n        [isCore]="isCore"\n        [languageCode]="languageCode"\n        [ecLogoLanguageCode]="getLanguageCode()"\n        [content]="content">\n    </ecl-site-footer-fixed-content-ec>\n    }\n    @if(eclThemeService.isEU$ | async) {\n        <ecl-site-footer-fixed-content-eu\n            [isCore]="isCore"\n            [languageCode]="languageCode"\n            [ecLogoLanguageCode]="getLanguageCode()"\n            [content]="content">\n        </ecl-site-footer-fixed-content-eu>\n    }\n\n    <ng-template #content>\n        <ng-content></ng-content>\n    </ng-template>\n</div>\n' }]
 }], ctorParameters: () => [{ type: i128.TranslateService }, { type: EclLanguageService }, { type: EclThemeService }], propDecorators: { isCore: [{
   type: Input78,
-  args: [{ transform: booleanAttribute40 }]
+  args: [{ transform: booleanAttribute41 }]
 }], cssClasses: [{
   type: HostBinding121,
   args: ["class"]
@@ -16325,7 +16314,7 @@ i0176.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-page-header/ecl-page-header-title.directive.mjs
-import { Directive as Directive50, HostBinding as HostBinding123, Input as Input79, booleanAttribute as booleanAttribute41 } from "@angular/core";
+import { Directive as Directive50, HostBinding as HostBinding123, Input as Input79, booleanAttribute as booleanAttribute42 } from "@angular/core";
 import * as i0177 from "@angular/core";
 var EclPageHeaderTitleDirective = class _EclPageHeaderTitleDirective extends ECLBaseDirective {
   constructor() {
@@ -16339,7 +16328,7 @@ var EclPageHeaderTitleDirective = class _EclPageHeaderTitleDirective extends ECL
     this.ɵfac = i0177.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0177, type: _EclPageHeaderTitleDirective, deps: null, target: i0177.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0177.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclPageHeaderTitleDirective, selector: "[eclPageHeaderTitle]", inputs: { isTitleVisible: ["isTitleVisible", "isTitleVisible", booleanAttribute41] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0177 });
+    this.ɵdir = i0177.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclPageHeaderTitleDirective, selector: "[eclPageHeaderTitle]", inputs: { isTitleVisible: ["isTitleVisible", "isTitleVisible", booleanAttribute42] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0177 });
   }
 };
 i0177.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0177, type: EclPageHeaderTitleDirective, decorators: [{
@@ -16349,7 +16338,7 @@ i0177.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   }]
 }], propDecorators: { isTitleVisible: [{
   type: Input79,
-  args: [{ transform: booleanAttribute41 }]
+  args: [{ transform: booleanAttribute42 }]
 }], cssClasses: [{
   type: HostBinding123,
   args: ["class"]
@@ -16585,7 +16574,7 @@ i0182.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] });
 
 // lib/components/ecl-pagination/ecl-pagination-item.component.mjs
-import { Component as Component82, EventEmitter as EventEmitter37, HostBinding as HostBinding128, Input as Input81, Output as Output37, ViewEncapsulation as ViewEncapsulation11, booleanAttribute as booleanAttribute42 } from "@angular/core";
+import { Component as Component82, EventEmitter as EventEmitter37, HostBinding as HostBinding128, Input as Input81, Output as Output37, ViewEncapsulation as ViewEncapsulation11, booleanAttribute as booleanAttribute43 } from "@angular/core";
 import * as i0183 from "@angular/core";
 import * as i215 from "@angular/router";
 import * as i64 from "@ngx-translate/core";
@@ -16646,7 +16635,7 @@ var EclPaginationItemComponent = class _EclPaginationItemComponent extends ECLBa
     this.ɵfac = i0183.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0183, type: _EclPaginationItemComponent, deps: [{ token: EclThemeService }], target: i0183.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0183.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclPaginationItemComponent, selector: "ecl-pagination-item", inputs: { label: "label", ariaLabel: "ariaLabel", pagesCount: "pagesCount", isCurrent: ["isCurrent", "isCurrent", booleanAttribute42], isNext: ["isNext", "isNext", booleanAttribute42], isPrevious: ["isPrevious", "isPrevious", booleanAttribute42], isTruncated: ["isTruncated", "isTruncated", booleanAttribute42], routerLink: "routerLink", queryParams: "queryParams", queryParamsHandling: "queryParamsHandling", href: "href" }, outputs: { pageClick: "pageClick" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "class.ecl-pagination__item--truncation": "this.isTruncated" } }, usesInheritance: true, ngImport: i0183, template: `@if (!isCurrent && !isTruncated) {
+    this.ɵcmp = i0183.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclPaginationItemComponent, selector: "ecl-pagination-item", inputs: { label: "label", ariaLabel: "ariaLabel", pagesCount: "pagesCount", isCurrent: ["isCurrent", "isCurrent", booleanAttribute43], isNext: ["isNext", "isNext", booleanAttribute43], isPrevious: ["isPrevious", "isPrevious", booleanAttribute43], isTruncated: ["isTruncated", "isTruncated", booleanAttribute43], routerLink: "routerLink", queryParams: "queryParams", queryParamsHandling: "queryParamsHandling", href: "href" }, outputs: { pageClick: "pageClick" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "class.ecl-pagination__item--truncation": "this.isTruncated" } }, usesInheritance: true, ngImport: i0183, template: `@if (!isCurrent && !isTruncated) {
     @if(routerLink && !isPrevOrNextVisible()){
         <a  eclLink (click)="onPageClick($event)" variant="standalone"
            attr.aria-label="{{ ariaLabel || geti18nPageAriaLabelKey() | translate: { pageNumber: label } }}"
@@ -16786,16 +16775,16 @@ i0183.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Input81
 }], isCurrent: [{
   type: Input81,
-  args: [{ transform: booleanAttribute42 }]
+  args: [{ transform: booleanAttribute43 }]
 }], isNext: [{
   type: Input81,
-  args: [{ transform: booleanAttribute42 }]
+  args: [{ transform: booleanAttribute43 }]
 }], isPrevious: [{
   type: Input81,
-  args: [{ transform: booleanAttribute42 }]
+  args: [{ transform: booleanAttribute43 }]
 }], isTruncated: [{
   type: Input81,
-  args: [{ transform: booleanAttribute42 }]
+  args: [{ transform: booleanAttribute43 }]
 }, {
   type: HostBinding128,
   args: ["class.ecl-pagination__item--truncation"]
@@ -17264,9 +17253,7 @@ i0189.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] });
 
 // lib/components/ecl-radio/ecl-radio-help.component.mjs
-import { __decorate as __decorate5 } from "tslib";
-import { Component as Component85, HostBinding as HostBinding133, Input as Input83 } from "@angular/core";
-import { coerceBoolean as coerceBoolean4 } from "@eui/base";
+import { Component as Component85, HostBinding as HostBinding133, Input as Input83, booleanAttribute as booleanAttribute44 } from "@angular/core";
 import * as i0190 from "@angular/core";
 var EclRadioHelpComponent = class _EclRadioHelpComponent extends ECLBaseDirective {
   constructor() {
@@ -17280,17 +17267,15 @@ var EclRadioHelpComponent = class _EclRadioHelpComponent extends ECLBaseDirectiv
     this.ɵfac = i0190.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0190, type: _EclRadioHelpComponent, deps: null, target: i0190.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0190.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.5", type: _EclRadioHelpComponent, selector: "[eclRadioHelp]", inputs: { isDisabled: "isDisabled" }, host: { properties: { "class.ecl-radio__help--disabled": "this.isDisabled", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0190, template: "<ng-content></ng-content>\n" });
+    this.ɵcmp = i0190.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclRadioHelpComponent, selector: "[eclRadioHelp]", inputs: { isDisabled: ["isDisabled", "isDisabled", booleanAttribute44] }, host: { properties: { "class.ecl-radio__help--disabled": "this.isDisabled", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0190, template: "<ng-content></ng-content>\n" });
   }
 };
-__decorate5([
-  coerceBoolean4
-], EclRadioHelpComponent.prototype, "isDisabled", void 0);
 i0190.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0190, type: EclRadioHelpComponent, decorators: [{
   type: Component85,
   args: [{ selector: "[eclRadioHelp]", template: "<ng-content></ng-content>\n" }]
 }], propDecorators: { isDisabled: [{
-  type: Input83
+  type: Input83,
+  args: [{ transform: booleanAttribute44 }]
 }, {
   type: HostBinding133,
   args: ["class.ecl-radio__help--disabled"]
@@ -17300,9 +17285,7 @@ i0190.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-radio/ecl-radio-label.component.mjs
-import { __decorate as __decorate6 } from "tslib";
-import { Component as Component86, HostBinding as HostBinding134, Input as Input84, ViewEncapsulation as ViewEncapsulation13 } from "@angular/core";
-import { coerceBoolean as coerceBoolean5 } from "@eui/base";
+import { Component as Component86, HostBinding as HostBinding134, Input as Input84, ViewEncapsulation as ViewEncapsulation13, booleanAttribute as booleanAttribute45 } from "@angular/core";
 import * as i0191 from "@angular/core";
 var EclRadioLabelComponent = class _EclRadioLabelComponent extends ECLBaseDirective {
   constructor() {
@@ -17317,31 +17300,25 @@ var EclRadioLabelComponent = class _EclRadioLabelComponent extends ECLBaseDirect
     this.ɵfac = i0191.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0191, type: _EclRadioLabelComponent, deps: null, target: i0191.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0191.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.5", type: _EclRadioLabelComponent, selector: "[eclRadioLabel]", inputs: { isInvalid: "isInvalid", isDisabled: "isDisabled" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0191, template: '<span class="ecl-radio__box" [class.ecl-radio__box--disabled]="isDisabled" [class.ecl-radio__box--invalid]="isInvalid">\n    <span class="ecl-radio__box-inner"></span>\n</span>\n\n<ng-content></ng-content>\n', encapsulation: i0191.ViewEncapsulation.None });
+    this.ɵcmp = i0191.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclRadioLabelComponent, selector: "[eclRadioLabel]", inputs: { isInvalid: ["isInvalid", "isInvalid", booleanAttribute45], isDisabled: ["isDisabled", "isDisabled", booleanAttribute45] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0191, template: '<span class="ecl-radio__box" [class.ecl-radio__box--disabled]="isDisabled" [class.ecl-radio__box--invalid]="isInvalid">\n    <span class="ecl-radio__box-inner"></span>\n</span>\n\n<ng-content></ng-content>\n', encapsulation: i0191.ViewEncapsulation.None });
   }
 };
-__decorate6([
-  coerceBoolean5
-], EclRadioLabelComponent.prototype, "isInvalid", void 0);
-__decorate6([
-  coerceBoolean5
-], EclRadioLabelComponent.prototype, "isDisabled", void 0);
 i0191.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0191, type: EclRadioLabelComponent, decorators: [{
   type: Component86,
   args: [{ selector: "[eclRadioLabel]", encapsulation: ViewEncapsulation13.None, template: '<span class="ecl-radio__box" [class.ecl-radio__box--disabled]="isDisabled" [class.ecl-radio__box--invalid]="isInvalid">\n    <span class="ecl-radio__box-inner"></span>\n</span>\n\n<ng-content></ng-content>\n' }]
 }], propDecorators: { isInvalid: [{
-  type: Input84
+  type: Input84,
+  args: [{ transform: booleanAttribute45 }]
 }], isDisabled: [{
-  type: Input84
+  type: Input84,
+  args: [{ transform: booleanAttribute45 }]
 }], cssClasses: [{
   type: HostBinding134,
   args: ["class"]
 }] } });
 
 // lib/components/ecl-radio/ecl-radio.directive.mjs
-import { __decorate as __decorate7 } from "tslib";
-import { ContentChild as ContentChild24, Directive as Directive56, forwardRef as forwardRef50, HostBinding as HostBinding135, Input as Input85 } from "@angular/core";
-import { coerceBoolean as coerceBoolean6 } from "@eui/base";
+import { booleanAttribute as booleanAttribute46, ContentChild as ContentChild24, Directive as Directive56, forwardRef as forwardRef50, HostBinding as HostBinding135, Input as Input85 } from "@angular/core";
 import * as i0192 from "@angular/core";
 var EclRadioDirective = class _EclRadioDirective extends ECLBaseDirective {
   constructor() {
@@ -17368,32 +17345,26 @@ var EclRadioDirective = class _EclRadioDirective extends ECLBaseDirective {
     this.ɵfac = i0192.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0192, type: _EclRadioDirective, deps: null, target: i0192.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0192.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.5", type: _EclRadioDirective, selector: "[eclRadio]", inputs: { isBinary: "isBinary", isDisabled: "isDisabled", isInvalid: "isInvalid" }, host: { properties: { "class.ecl-radio--disabled": "this.isDisabled", "class.ecl-radio--invalid": "this.isInvalid", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclRadioLabelComponent", first: true, predicate: i0192.forwardRef(() => EclRadioLabelComponent), descendants: true }, { propertyName: "eclRadioHelpComponent", first: true, predicate: i0192.forwardRef(() => EclRadioHelpComponent), descendants: true }], usesInheritance: true, ngImport: i0192 });
+    this.ɵdir = i0192.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclRadioDirective, selector: "[eclRadio]", inputs: { isBinary: ["isBinary", "isBinary", booleanAttribute46], isDisabled: ["isDisabled", "isDisabled", booleanAttribute46], isInvalid: ["isInvalid", "isInvalid", booleanAttribute46] }, host: { properties: { "class.ecl-radio--disabled": "this.isDisabled", "class.ecl-radio--invalid": "this.isInvalid", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclRadioLabelComponent", first: true, predicate: i0192.forwardRef(() => EclRadioLabelComponent), descendants: true }, { propertyName: "eclRadioHelpComponent", first: true, predicate: i0192.forwardRef(() => EclRadioHelpComponent), descendants: true }], usesInheritance: true, ngImport: i0192 });
   }
 };
-__decorate7([
-  coerceBoolean6
-], EclRadioDirective.prototype, "isBinary", void 0);
-__decorate7([
-  coerceBoolean6
-], EclRadioDirective.prototype, "isDisabled", void 0);
-__decorate7([
-  coerceBoolean6
-], EclRadioDirective.prototype, "isInvalid", void 0);
 i0192.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0192, type: EclRadioDirective, decorators: [{
   type: Directive56,
   args: [{
     selector: "[eclRadio]"
   }]
 }], propDecorators: { isBinary: [{
-  type: Input85
+  type: Input85,
+  args: [{ transform: booleanAttribute46 }]
 }], isDisabled: [{
-  type: Input85
+  type: Input85,
+  args: [{ transform: booleanAttribute46 }]
 }, {
   type: HostBinding135,
   args: ["class.ecl-radio--disabled"]
 }], isInvalid: [{
-  type: Input85
+  type: Input85,
+  args: [{ transform: booleanAttribute46 }]
 }, {
   type: HostBinding135,
   args: ["class.ecl-radio--invalid"]
@@ -17479,12 +17450,9 @@ i0194.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] });
 
 // lib/components/ecl-rating-field/ecl-rating-field.component.mjs
-import { __decorate as __decorate8 } from "tslib";
-import { Component as Component87, EventEmitter as EventEmitter40, forwardRef as forwardRef53, HostBinding as HostBinding137, Input as Input86, Output as Output40 } from "@angular/core";
+import { booleanAttribute as booleanAttribute47, Component as Component87, EventEmitter as EventEmitter40, forwardRef as forwardRef53, HostBinding as HostBinding137, Input as Input86, Output as Output40 } from "@angular/core";
 import { NG_VALUE_ACCESSOR as NG_VALUE_ACCESSOR6 } from "@angular/forms";
-import { coerceBoolean as coerceBoolean7, coerceNumber } from "@eui/base";
 import * as i0195 from "@angular/core";
-import * as i132 from "@angular/common";
 var EclRatingChangeEvent = class extends EclBaseEvent {
   constructor(value) {
     super();
@@ -17538,46 +17506,32 @@ var EclRatingFieldComponent = class _EclRatingFieldComponent extends ECLBaseDire
     this.ɵfac = i0195.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0195, type: _EclRatingFieldComponent, deps: [], target: i0195.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0195.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.5", type: _EclRatingFieldComponent, selector: "ecl-rating-field", inputs: { name: "name", numberOfStars: "numberOfStars", rating: "rating", disabled: "disabled" }, outputs: { ratingChange: "ratingChange" }, host: { properties: { "attr.disabled": "this.disabled", "class": "this.cssClasses" } }, providers: [ECL_RATINGFIELD_VALUE_ACCESSOR], usesInheritance: true, ngImport: i0195, template: '<ng-container *ngFor="let n of numbers">\n    <input\n        type="radio"\n        id="{{ name }}-{{ n }}"\n        [name]="name"\n        class="ecl-rating-field__input"\n        [value]="n"\n        required=""\n        [attr.checked]="rating === n ? true : undefined"\n        [attr.disabled]="disabled ? true : undefined"\n        (click)="onRadioClick(n)" />\n    <label class="ecl-rating-field__label" for="{{ name }}-{{ n }}">\n        <span class="ecl-u-sr-only">{{ n }} stars</span>\n        <ecl-icon icon="star-filled" class="ecl-rating-field__icon-filled" size="m"> </ecl-icon>\n        <ecl-icon icon="star-outline" class="ecl-rating-field__icon-outline" size="m"> </ecl-icon>\n    </label>\n</ng-container>\n', dependencies: [{ kind: "directive", type: i132.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }] });
+    this.ɵcmp = i0195.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclRatingFieldComponent, selector: "ecl-rating-field", inputs: { name: "name", numberOfStars: ["numberOfStars", "numberOfStars", booleanAttribute47], rating: ["rating", "rating", booleanAttribute47], disabled: ["disabled", "disabled", booleanAttribute47] }, outputs: { ratingChange: "ratingChange" }, host: { properties: { "attr.disabled": "this.disabled", "class": "this.cssClasses" } }, providers: [ECL_RATINGFIELD_VALUE_ACCESSOR], usesInheritance: true, ngImport: i0195, template: '@for(n of numbers;track n) {\n    <input\n        type="radio"\n        id="{{ name }}-{{ n }}"\n        [name]="name"\n        class="ecl-rating-field__input"\n        [value]="n"\n        required=""\n        [attr.checked]="rating === n ? true : undefined"\n        [attr.disabled]="disabled ? true : undefined"\n        (click)="onRadioClick(n)" />\n    <label class="ecl-rating-field__label" for="{{ name }}-{{ n }}">\n        <span class="ecl-u-sr-only">{{ n }} stars</span>\n        <ecl-icon icon="star-filled" class="ecl-rating-field__icon-filled" size="l"> </ecl-icon>\n        <ecl-icon icon="star-outline" class="ecl-rating-field__icon-outline" size="l"> </ecl-icon>\n    </label>\n}\n', dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }] });
   }
 };
-__decorate8([
-  coerceNumber
-], EclRatingFieldComponent.prototype, "numberOfStars", void 0);
-__decorate8([
-  coerceNumber
-], EclRatingFieldComponent.prototype, "rating", void 0);
-__decorate8([
-  coerceBoolean7
-], EclRatingFieldComponent.prototype, "disabled", void 0);
 i0195.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0195, type: EclRatingFieldComponent, decorators: [{
   type: Component87,
-  args: [{ selector: "ecl-rating-field", providers: [ECL_RATINGFIELD_VALUE_ACCESSOR], template: '<ng-container *ngFor="let n of numbers">\n    <input\n        type="radio"\n        id="{{ name }}-{{ n }}"\n        [name]="name"\n        class="ecl-rating-field__input"\n        [value]="n"\n        required=""\n        [attr.checked]="rating === n ? true : undefined"\n        [attr.disabled]="disabled ? true : undefined"\n        (click)="onRadioClick(n)" />\n    <label class="ecl-rating-field__label" for="{{ name }}-{{ n }}">\n        <span class="ecl-u-sr-only">{{ n }} stars</span>\n        <ecl-icon icon="star-filled" class="ecl-rating-field__icon-filled" size="m"> </ecl-icon>\n        <ecl-icon icon="star-outline" class="ecl-rating-field__icon-outline" size="m"> </ecl-icon>\n    </label>\n</ng-container>\n' }]
-}], ctorParameters: () => [], propDecorators: {
-  name: [{
-    type: Input86
-  }],
-  numberOfStars: [{
-    type: Input86
-  }],
-  rating: [{
-    type: Input86
-  }],
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  disabled: [{
-    type: Input86
-  }, {
-    type: HostBinding137,
-    args: ["attr.disabled"]
-  }],
-  ratingChange: [{
-    type: Output40
-  }],
-  cssClasses: [{
-    type: HostBinding137,
-    args: ["class"]
-  }]
-} });
+  args: [{ selector: "ecl-rating-field", providers: [ECL_RATINGFIELD_VALUE_ACCESSOR], template: '@for(n of numbers;track n) {\n    <input\n        type="radio"\n        id="{{ name }}-{{ n }}"\n        [name]="name"\n        class="ecl-rating-field__input"\n        [value]="n"\n        required=""\n        [attr.checked]="rating === n ? true : undefined"\n        [attr.disabled]="disabled ? true : undefined"\n        (click)="onRadioClick(n)" />\n    <label class="ecl-rating-field__label" for="{{ name }}-{{ n }}">\n        <span class="ecl-u-sr-only">{{ n }} stars</span>\n        <ecl-icon icon="star-filled" class="ecl-rating-field__icon-filled" size="l"> </ecl-icon>\n        <ecl-icon icon="star-outline" class="ecl-rating-field__icon-outline" size="l"> </ecl-icon>\n    </label>\n}\n' }]
+}], ctorParameters: () => [], propDecorators: { name: [{
+  type: Input86
+}], numberOfStars: [{
+  type: Input86,
+  args: [{ transform: booleanAttribute47 }]
+}], rating: [{
+  type: Input86,
+  args: [{ transform: booleanAttribute47 }]
+}], disabled: [{
+  type: Input86,
+  args: [{ transform: booleanAttribute47 }]
+}, {
+  type: HostBinding137,
+  args: ["attr.disabled"]
+}], ratingChange: [{
+  type: Output40
+}], cssClasses: [{
+  type: HostBinding137,
+  args: ["class"]
+}] } });
 
 // lib/components/ecl-rating-field/ecl-rating-field.module.mjs
 import { NgModule as NgModule48 } from "@angular/core";
@@ -17607,7 +17561,7 @@ i0196.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 // lib/components/ecl-range/ecl-range-value.component.mjs
 import { Component as Component88, HostBinding as HostBinding138, Input as Input87 } from "@angular/core";
 import * as i0197 from "@angular/core";
-import * as i133 from "@ngx-translate/core";
+import * as i132 from "@ngx-translate/core";
 var EclRangeValueComponent = class _EclRangeValueComponent extends ECLBaseDirective {
   get cssClasses() {
     return [super.getCssClasses("ecl-range__value")].join(" ").trim();
@@ -17617,7 +17571,7 @@ var EclRangeValueComponent = class _EclRangeValueComponent extends ECLBaseDirect
   }
   static {
     this.ɵcmp = i0197.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.5", type: _EclRangeValueComponent, selector: "ecl-range-value", inputs: { value: "value" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0197, template: `{{ 'ecl.common.VALUE' | translate }}: <span class="ecl-range__value-current"> {{ value }} </span>
-`, styles: [":host{display:block}\n"], dependencies: [{ kind: "pipe", type: i133.TranslatePipe, name: "translate" }] });
+`, styles: [":host{display:block}\n"], dependencies: [{ kind: "pipe", type: i132.TranslatePipe, name: "translate" }] });
   }
 };
 i0197.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0197, type: EclRangeValueComponent, decorators: [{
@@ -17632,10 +17586,10 @@ i0197.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-range/ecl-range.directive.mjs
-import { Directive as Directive58, EventEmitter as EventEmitter41, HostBinding as HostBinding139, HostListener as HostListener21, Input as Input88, Optional as Optional7, Output as Output41, Self as Self5, booleanAttribute as booleanAttribute43 } from "@angular/core";
+import { Directive as Directive58, EventEmitter as EventEmitter41, HostBinding as HostBinding139, HostListener as HostListener21, Input as Input88, Optional as Optional7, Output as Output41, Self as Self5, booleanAttribute as booleanAttribute48 } from "@angular/core";
 import { distinctUntilChanged } from "rxjs";
 import * as i0198 from "@angular/core";
-import * as i134 from "@angular/forms";
+import * as i133 from "@angular/forms";
 var EclRangeEvent = class extends EclBaseEvent {
   constructor(value) {
     super();
@@ -17684,10 +17638,10 @@ var EclRangeDirective = class _EclRangeDirective extends ECLBaseDirective {
     this.rangeChange.next(new EclRangeEvent(numberValue));
   }
   static {
-    this.ɵfac = i0198.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0198, type: _EclRangeDirective, deps: [{ token: i0198.ViewContainerRef }, { token: i134.NgControl, optional: true, self: true }], target: i0198.ɵɵFactoryTarget.Directive });
+    this.ɵfac = i0198.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0198, type: _EclRangeDirective, deps: [{ token: i0198.ViewContainerRef }, { token: i133.NgControl, optional: true, self: true }], target: i0198.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0198.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclRangeDirective, selector: "input[eclRange]", inputs: { eclSize: "eclSize", value: "value", hasValueLabel: ["hasValueLabel", "hasValueLabel", booleanAttribute43] }, outputs: { rangeChange: "rangeChange" }, host: { listeners: { "input": "onInput($event)" }, properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0198 });
+    this.ɵdir = i0198.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclRangeDirective, selector: "input[eclRange]", inputs: { eclSize: "eclSize", value: "value", hasValueLabel: ["hasValueLabel", "hasValueLabel", booleanAttribute48] }, outputs: { rangeChange: "rangeChange" }, host: { listeners: { "input": "onInput($event)" }, properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0198 });
   }
 };
 i0198.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0198, type: EclRangeDirective, decorators: [{
@@ -17695,7 +17649,7 @@ i0198.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: [{
     selector: "input[eclRange]"
   }]
-}], ctorParameters: () => [{ type: i0198.ViewContainerRef }, { type: i134.NgControl, decorators: [{
+}], ctorParameters: () => [{ type: i0198.ViewContainerRef }, { type: i133.NgControl, decorators: [{
   type: Optional7
 }, {
   type: Self5
@@ -17705,7 +17659,7 @@ i0198.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Input88
 }], hasValueLabel: [{
   type: Input88,
-  args: [{ transform: booleanAttribute43 }]
+  args: [{ transform: booleanAttribute48 }]
 }], rangeChange: [{
   type: Output41
 }], cssClasses: [{
@@ -17743,13 +17697,10 @@ i0199.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] });
 
 // lib/components/ecl-select/ecl-select-container.component.mjs
-import { Component as Component89, HostBinding as HostBinding140, Input as Input89 } from "@angular/core";
+import { Component as Component89, HostBinding as HostBinding140, Input as Input89, booleanAttribute as booleanAttribute49 } from "@angular/core";
 import * as i0200 from "@angular/core";
+import * as i57 from "@ngx-translate/core";
 var EclSelectContainerComponent = class _EclSelectContainerComponent extends ECLBaseDirective {
-  constructor() {
-    super(...arguments);
-    this.eclSize = "m";
-  }
   get cssClasses() {
     return [
       super.getCssClasses("ecl-select__container"),
@@ -17758,33 +17709,59 @@ var EclSelectContainerComponent = class _EclSelectContainerComponent extends ECL
       this.isInvalid ? "ecl-select__container--invalid" : ""
     ].join(" ").trim();
   }
+  constructor(eclThemeService) {
+    super();
+    this.eclThemeService = eclThemeService;
+    this.eclSize = "m";
+    this.ICON_SIZE_EC = "xs";
+    this.ICON_SIZE_EU = "s";
+  }
+  get iconSize() {
+    if (this.eclThemeService.isECTheme()) {
+      return this.ICON_SIZE_EC;
+    } else {
+      return this.ICON_SIZE_EU;
+    }
+  }
   static {
-    this.ɵfac = i0200.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0200, type: _EclSelectContainerComponent, deps: null, target: i0200.ɵɵFactoryTarget.Component });
+    this.ɵfac = i0200.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0200, type: _EclSelectContainerComponent, deps: [{ token: EclThemeService }], target: i0200.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0200.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.5", type: _EclSelectContainerComponent, selector: "ecl-select-container", inputs: { eclSize: "eclSize", disabled: "disabled", isInvalid: "isInvalid" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0200, template: '<div class="ecl-select__icon">\n    <ecl-icon icon="corner-arrow" size="s" transform="rotate-180" class="ecl-select__icon-shape"> </ecl-icon>\n</div>\n', dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }] });
+    this.ɵcmp = i0200.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclSelectContainerComponent, selector: "ecl-select-container", inputs: { eclSize: "eclSize", disabled: ["disabled", "disabled", booleanAttribute49], isInvalid: ["isInvalid", "isInvalid", booleanAttribute49] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0200, template: `<div class="ecl-select__icon">
+    <button eclButton variant="ghost" isIconOnly>
+        <span eclButtonLabel>{{ 'ecl.multiselect.TOGGLE.DROPDOWN' | translate }}</span>
+        <ecl-icon icon="corner-arrow" [size]="iconSize" transform="rotate-180"></ecl-icon>
+    </button>
+</div>
+`, dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }, { kind: "component", type: EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "containerStyleClass"] }, { kind: "directive", type: EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "pipe", type: i57.TranslatePipe, name: "translate" }] });
   }
 };
 i0200.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0200, type: EclSelectContainerComponent, decorators: [{
   type: Component89,
-  args: [{ selector: "ecl-select-container", template: '<div class="ecl-select__icon">\n    <ecl-icon icon="corner-arrow" size="s" transform="rotate-180" class="ecl-select__icon-shape"> </ecl-icon>\n</div>\n' }]
-}], propDecorators: { eclSize: [{
+  args: [{ selector: "ecl-select-container", template: `<div class="ecl-select__icon">
+    <button eclButton variant="ghost" isIconOnly>
+        <span eclButtonLabel>{{ 'ecl.multiselect.TOGGLE.DROPDOWN' | translate }}</span>
+        <ecl-icon icon="corner-arrow" [size]="iconSize" transform="rotate-180"></ecl-icon>
+    </button>
+</div>
+` }]
+}], ctorParameters: () => [{ type: EclThemeService }], propDecorators: { eclSize: [{
   type: Input89
 }], disabled: [{
-  type: Input89
+  type: Input89,
+  args: [{ transform: booleanAttribute49 }]
 }], isInvalid: [{
-  type: Input89
+  type: Input89,
+  args: [{ transform: booleanAttribute49 }]
 }], cssClasses: [{
   type: HostBinding140,
   args: ["class"]
 }] } });
 
 // lib/components/ecl-select/ecl-select.directive.mjs
-import { __decorate as __decorate9 } from "tslib";
-import { Directive as Directive59, HostBinding as HostBinding141, Input as Input90, Optional as Optional8, Self as Self6 } from "@angular/core";
-import { coerceBoolean as coerceBoolean8 } from "@eui/base";
+import { Directive as Directive59, HostBinding as HostBinding141, Input as Input90, Optional as Optional8, Self as Self6, booleanAttribute as booleanAttribute50 } from "@angular/core";
 import * as i0201 from "@angular/core";
-import * as i135 from "@angular/forms";
+import * as i134 from "@angular/forms";
 var EclSelectDirective = class _EclSelectDirective extends ECLBaseDirective {
   get cssClasses() {
     return [super.getCssClasses("ecl-select")].join(" ").trim();
@@ -17826,34 +17803,30 @@ var EclSelectDirective = class _EclSelectDirective extends ECLBaseDirective {
     this.containerComponent.isInvalid = this.isInvalidState;
   }
   static {
-    this.ɵfac = i0201.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0201, type: _EclSelectDirective, deps: [{ token: i135.NgControl, optional: true, self: true }, { token: i0201.ElementRef }, { token: i0201.ViewContainerRef }], target: i0201.ɵɵFactoryTarget.Directive });
+    this.ɵfac = i0201.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0201, type: _EclSelectDirective, deps: [{ token: i134.NgControl, optional: true, self: true }, { token: i0201.ElementRef }, { token: i0201.ViewContainerRef }], target: i0201.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0201.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.5", type: _EclSelectDirective, selector: "select[eclSelect]", inputs: { disabled: "disabled", isInvalid: "isInvalid", eclSize: "eclSize" }, host: { properties: { "attr.disabled": "this.isDisabled", "class": "this.cssClasses", "class.ecl-select--invalid": "this.isInvalidState" } }, usesInheritance: true, ngImport: i0201 });
+    this.ɵdir = i0201.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclSelectDirective, selector: "select[eclSelect]", inputs: { disabled: ["disabled", "disabled", booleanAttribute50], isInvalid: ["isInvalid", "isInvalid", booleanAttribute50], eclSize: "eclSize" }, host: { properties: { "attr.disabled": "this.isDisabled", "class": "this.cssClasses", "class.ecl-select--invalid": "this.isInvalidState" } }, usesInheritance: true, ngImport: i0201 });
   }
 };
-__decorate9([
-  coerceBoolean8
-], EclSelectDirective.prototype, "disabled", void 0);
-__decorate9([
-  coerceBoolean8
-], EclSelectDirective.prototype, "isInvalid", void 0);
 i0201.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0201, type: EclSelectDirective, decorators: [{
   type: Directive59,
   args: [{
     selector: "select[eclSelect]"
   }]
-}], ctorParameters: () => [{ type: i135.NgControl, decorators: [{
+}], ctorParameters: () => [{ type: i134.NgControl, decorators: [{
   type: Optional8
 }, {
   type: Self6
 }] }, { type: i0201.ElementRef }, { type: i0201.ViewContainerRef }], propDecorators: { disabled: [{
-  type: Input90
+  type: Input90,
+  args: [{ transform: booleanAttribute50 }]
 }, {
   type: HostBinding141,
   args: ["attr.disabled"]
 }], isInvalid: [{
-  type: Input90
+  type: Input90,
+  args: [{ transform: booleanAttribute50 }]
 }], eclSize: [{
   type: Input90
 }], cssClasses: [{
@@ -17870,6 +17843,7 @@ i0201.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 // lib/components/ecl-select/ecl-select.module.mjs
 import { NgModule as NgModule50 } from "@angular/core";
 import { CommonModule as CommonModule50 } from "@angular/common";
+import { TranslateModule as TranslateModule26 } from "@ngx-translate/core";
 import * as i0202 from "@angular/core";
 var COMPONENTS24 = [EclSelectDirective, EclSelectContainerComponent];
 var EclSelectDirectiveModule = class _EclSelectDirectiveModule {
@@ -17877,25 +17851,25 @@ var EclSelectDirectiveModule = class _EclSelectDirectiveModule {
     this.ɵfac = i0202.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0202, type: _EclSelectDirectiveModule, deps: [], target: i0202.ɵɵFactoryTarget.NgModule });
   }
   static {
-    this.ɵmod = i0202.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.5", ngImport: i0202, type: _EclSelectDirectiveModule, declarations: [EclSelectDirective, EclSelectContainerComponent], imports: [CommonModule50, EclIconComponentModule], exports: [EclSelectDirective, EclSelectContainerComponent] });
+    this.ɵmod = i0202.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.5", ngImport: i0202, type: _EclSelectDirectiveModule, declarations: [EclSelectDirective, EclSelectContainerComponent], imports: [CommonModule50, EclIconComponentModule, TranslateModule26, EclButtonComponentModule], exports: [EclSelectDirective, EclSelectContainerComponent] });
   }
   static {
-    this.ɵinj = i0202.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0202, type: _EclSelectDirectiveModule, imports: [CommonModule50, EclIconComponentModule] });
+    this.ɵinj = i0202.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0202, type: _EclSelectDirectiveModule, imports: [CommonModule50, EclIconComponentModule, TranslateModule26, EclButtonComponentModule] });
   }
 };
 i0202.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0202, type: EclSelectDirectiveModule, decorators: [{
   type: NgModule50,
   args: [{
-    imports: [CommonModule50, EclIconComponentModule],
+    imports: [CommonModule50, EclIconComponentModule, TranslateModule26, EclButtonComponentModule],
     exports: [...COMPONENTS24],
     declarations: [...COMPONENTS24]
   }]
 }] });
 
 // lib/components/ecl-social-media-follow/ecl-social-media-follow.component.mjs
-import { Component as Component90, HostBinding as HostBinding142, Input as Input91, booleanAttribute as booleanAttribute44 } from "@angular/core";
+import { Component as Component90, HostBinding as HostBinding142, Input as Input91, booleanAttribute as booleanAttribute51 } from "@angular/core";
 import * as i0203 from "@angular/core";
-import * as i136 from "@angular/common";
+import * as i135 from "@angular/common";
 var EclSocialMediaFollowComponent = class _EclSocialMediaFollowComponent extends ECLBaseDirective {
   constructor() {
     super(...arguments);
@@ -17908,7 +17882,7 @@ var EclSocialMediaFollowComponent = class _EclSocialMediaFollowComponent extends
     this.ɵfac = i0203.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0203, type: _EclSocialMediaFollowComponent, deps: null, target: i0203.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0203.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclSocialMediaFollowComponent, selector: "ecl-social-media-follow", inputs: { description: "description", isVertical: ["isVertical", "isVertical", booleanAttribute44] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0203, template: '<p *ngIf="description" class="ecl-social-media-follow__description">{{ description }}</p>\n<ul class="ecl-social-media-follow__list">\n    <ng-content></ng-content>\n</ul>\n', styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i136.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    this.ɵcmp = i0203.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclSocialMediaFollowComponent, selector: "ecl-social-media-follow", inputs: { description: "description", isVertical: ["isVertical", "isVertical", booleanAttribute51] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0203, template: '<p *ngIf="description" class="ecl-social-media-follow__description">{{ description }}</p>\n<ul class="ecl-social-media-follow__list">\n    <ng-content></ng-content>\n</ul>\n', styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i135.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
   }
 };
 i0203.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0203, type: EclSocialMediaFollowComponent, decorators: [{
@@ -17918,7 +17892,7 @@ i0203.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Input91
 }], isVertical: [{
   type: Input91,
-  args: [{ transform: booleanAttribute44 }]
+  args: [{ transform: booleanAttribute51 }]
 }], cssClasses: [{
   type: HostBinding142,
   args: ["class"]
@@ -17927,7 +17901,7 @@ i0203.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 // lib/components/ecl-social-media-follow/ecl-social-media-follow-item.component.mjs
 import { Component as Component91, EventEmitter as EventEmitter42, HostBinding as HostBinding143, Input as Input92, Output as Output42 } from "@angular/core";
 import * as i0204 from "@angular/core";
-import * as i137 from "@angular/common";
+import * as i136 from "@angular/common";
 import * as i216 from "@angular/router";
 var EclSocialMediaFollowItemClickEvent = class extends EclBaseEvent {
 };
@@ -17954,7 +17928,7 @@ var EclSocialMediaFollowItemComponent = class _EclSocialMediaFollowItemComponent
     this.ɵfac = i0204.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0204, type: _EclSocialMediaFollowItemComponent, deps: null, target: i0204.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0204.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclSocialMediaFollowItemComponent, selector: "ecl-social-media-follow-item", inputs: { icon: "icon", iconSet: "iconSet", href: "href", routerLink: "routerLink", target: "target", size: "size" }, outputs: { itemClick: "itemClick" }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0204, template: '@if(href) {\n<a eclLink (click)="onItemClick($event)" variant="standalone" [href]="href" [attr.target]="target"\n    class="ecl-social-media-follow__link">\n    @if(icon) {\n    <ecl-icon [iconSet]="iconSet" icon="{{ icon }}" [size]="size" class="ecl-social-media-follow__icon"> </ecl-icon>\n    }\n    <span eclLinkLabel>\n        <ng-container *ngTemplateOutlet="content"></ng-container>\n    </span>\n</a>\n}\n\n@if(!href && routerLink) {\n<a eclLink (click)="onItemClick($event)" variant="standalone" [routerLink]="routerLink" [attr.target]="target"\n    class="ecl-social-media-follow__link">\n    @if(icon) {\n    <ecl-icon [iconSet]="iconSet" icon="{{ icon }}" [size]="size" class="ecl-social-media-follow__icon"> </ecl-icon>\n    }\n    <span eclLinkLabel>\n        <ng-container *ngTemplateOutlet="content"></ng-container>\n    </span>\n</a>\n}\n\n@if(!href && !routerLink) {\n<ng-container *ngTemplateOutlet="content"></ng-container>\n}\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>', dependencies: [{ kind: "directive", type: i137.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i216.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }, { kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["isInverted", "isIconOnly", "isNoVisited", "variant"] }, { kind: "directive", type: EclLinkLabelDirective, selector: "[eclLinkLabel]" }] });
+    this.ɵcmp = i0204.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclSocialMediaFollowItemComponent, selector: "ecl-social-media-follow-item", inputs: { icon: "icon", iconSet: "iconSet", href: "href", routerLink: "routerLink", target: "target", size: "size" }, outputs: { itemClick: "itemClick" }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0204, template: '@if(href) {\n<a eclLink (click)="onItemClick($event)" variant="standalone" [href]="href" [attr.target]="target"\n    class="ecl-social-media-follow__link">\n    @if(icon) {\n    <ecl-icon [iconSet]="iconSet" icon="{{ icon }}" [size]="size" class="ecl-social-media-follow__icon"> </ecl-icon>\n    }\n    <span eclLinkLabel>\n        <ng-container *ngTemplateOutlet="content"></ng-container>\n    </span>\n</a>\n}\n\n@if(!href && routerLink) {\n<a eclLink (click)="onItemClick($event)" variant="standalone" [routerLink]="routerLink" [attr.target]="target"\n    class="ecl-social-media-follow__link">\n    @if(icon) {\n    <ecl-icon [iconSet]="iconSet" icon="{{ icon }}" [size]="size" class="ecl-social-media-follow__icon"> </ecl-icon>\n    }\n    <span eclLinkLabel>\n        <ng-container *ngTemplateOutlet="content"></ng-container>\n    </span>\n</a>\n}\n\n@if(!href && !routerLink) {\n<ng-container *ngTemplateOutlet="content"></ng-container>\n}\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>', dependencies: [{ kind: "directive", type: i136.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i216.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }, { kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["isInverted", "isIconOnly", "isNoVisited", "variant"] }, { kind: "directive", type: EclLinkLabelDirective, selector: "[eclLinkLabel]" }] });
   }
 };
 i0204.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0204, type: EclSocialMediaFollowItemComponent, decorators: [{
@@ -18041,9 +18015,9 @@ i0206.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] });
 
 // lib/components/ecl-social-media-share/ecl-social-media-share.component.mjs
-import { __decorate as __decorate10 } from "tslib";
+import { __decorate as __decorate4 } from "tslib";
 import { Component as Component92, HostBinding as HostBinding145, Input as Input93 } from "@angular/core";
-import { coerceBoolean as coerceBoolean9 } from "@eui/base";
+import { coerceBoolean as coerceBoolean3 } from "@eui/base";
 import * as i0207 from "@angular/core";
 var EclSocialMediaShareComponent = class _EclSocialMediaShareComponent extends ECLBaseDirective {
   constructor() {
@@ -18060,8 +18034,8 @@ var EclSocialMediaShareComponent = class _EclSocialMediaShareComponent extends E
     this.ɵcmp = i0207.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.5", type: _EclSocialMediaShareComponent, selector: "ecl-social-media-share", inputs: { description: "description", isVertical: "isVertical" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0207, template: '<p class="ecl-social-media-share__description">{{ description }}</p>\n<ul class="ecl-social-media-share__list">\n    <ng-content></ng-content>\n</ul>\n', styles: [":host{display:block}\n"] });
   }
 };
-__decorate10([
-  coerceBoolean9
+__decorate4([
+  coerceBoolean3
 ], EclSocialMediaShareComponent.prototype, "isVertical", void 0);
 i0207.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0207, type: EclSocialMediaShareComponent, decorators: [{
   type: Component92,
@@ -18078,7 +18052,7 @@ i0207.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 // lib/components/ecl-social-media-share/ecl-social-media-share-item.component.mjs
 import { Component as Component93, EventEmitter as EventEmitter43, HostBinding as HostBinding146, Input as Input94, Output as Output43 } from "@angular/core";
 import * as i0208 from "@angular/core";
-import * as i138 from "@angular/common";
+import * as i137 from "@angular/common";
 var EclSocialMediaShareItemClickEvent = class extends EclBaseEvent {
 };
 var EclSocialMediaShareItemComponent = class _EclSocialMediaShareItemComponent extends ECLBaseDirective {
@@ -18103,7 +18077,7 @@ var EclSocialMediaShareItemComponent = class _EclSocialMediaShareItemComponent e
     this.ɵfac = i0208.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0208, type: _EclSocialMediaShareItemComponent, deps: null, target: i0208.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0208.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.5", type: _EclSocialMediaShareItemComponent, selector: "ecl-social-media-share-item", inputs: { icon: "icon", iconSet: "iconSet", size: "size", href: "href", target: "target" }, outputs: { itemClick: "itemClick" }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0208, template: '<a\n    eclLink\n    *ngIf="href"\n    (click)="onItemClick($event)"\n    variant="standalone"\n    [href]="href"\n    [attr.target]="target"\n    class="ecl-social-media-share__link">\n    <ecl-icon *ngIf="icon" [iconSet]="iconSet" icon="{{ icon }}" [size]="size" class="ecl-social-media-share__icon"> </ecl-icon>\n\n    <span eclLinkLabel>\n        <ng-container *ngTemplateOutlet="content"></ng-container>\n    </span>\n</a>\n\n<ng-container *ngIf="!href">\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</ng-container>\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n', dependencies: [{ kind: "directive", type: i138.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i138.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["isInverted", "isIconOnly", "isNoVisited", "variant"] }, { kind: "directive", type: EclLinkLabelDirective, selector: "[eclLinkLabel]" }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }] });
+    this.ɵcmp = i0208.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.5", type: _EclSocialMediaShareItemComponent, selector: "ecl-social-media-share-item", inputs: { icon: "icon", iconSet: "iconSet", size: "size", href: "href", target: "target" }, outputs: { itemClick: "itemClick" }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0208, template: '<a\n    eclLink\n    *ngIf="href"\n    (click)="onItemClick($event)"\n    variant="standalone"\n    [href]="href"\n    [attr.target]="target"\n    class="ecl-social-media-share__link">\n    <ecl-icon *ngIf="icon" [iconSet]="iconSet" icon="{{ icon }}" [size]="size" class="ecl-social-media-share__icon"> </ecl-icon>\n\n    <span eclLinkLabel>\n        <ng-container *ngTemplateOutlet="content"></ng-container>\n    </span>\n</a>\n\n<ng-container *ngIf="!href">\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</ng-container>\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n', dependencies: [{ kind: "directive", type: i137.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i137.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["isInverted", "isIconOnly", "isNoVisited", "variant"] }, { kind: "directive", type: EclLinkLabelDirective, selector: "[eclLinkLabel]" }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }] });
   }
 };
 i0208.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0208, type: EclSocialMediaShareItemComponent, decorators: [{
@@ -18187,7 +18161,7 @@ i0210.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] });
 
 // lib/components/ecl-loading-indicator/ecl-loading-indicator.component.mjs
-import { Component as Component94, HostBinding as HostBinding148, Input as Input95, booleanAttribute as booleanAttribute45 } from "@angular/core";
+import { Component as Component94, HostBinding as HostBinding148, Input as Input95, booleanAttribute as booleanAttribute52 } from "@angular/core";
 import * as i0211 from "@angular/core";
 var EclLoadingIndicatorComponent = class _EclLoadingIndicatorComponent extends ECLBaseDirective {
   constructor() {
@@ -18210,7 +18184,7 @@ var EclLoadingIndicatorComponent = class _EclLoadingIndicatorComponent extends E
     this.ɵfac = i0211.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0211, type: _EclLoadingIndicatorComponent, deps: null, target: i0211.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0211.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclLoadingIndicatorComponent, selector: "ecl-loading-indicator", inputs: { size: "size", variant: "variant", isCentered: ["isCentered", "isCentered", booleanAttribute45], isVisible: ["isVisible", "isVisible", booleanAttribute45] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0211, template: '<svg class="ecl-spinner__loader" viewBox="25 25 50 50">\n    <circle\n        class="ecl-spinner__circle"\n        cx="50"\n        cy="50"\n        r="20"\n        fill="none"\n        stroke-width="4px"\n        stroke-miterlimit="10"\n        vector-effect="non-scaling-stroke"></circle>\n</svg>\n<ng-content></ng-content>\n' });
+    this.ɵcmp = i0211.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclLoadingIndicatorComponent, selector: "ecl-loading-indicator", inputs: { size: "size", variant: "variant", isCentered: ["isCentered", "isCentered", booleanAttribute52], isVisible: ["isVisible", "isVisible", booleanAttribute52] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0211, template: '<svg class="ecl-spinner__loader" viewBox="25 25 50 50">\n    <circle\n        class="ecl-spinner__circle"\n        cx="50"\n        cy="50"\n        r="20"\n        fill="none"\n        stroke-width="4px"\n        stroke-miterlimit="10"\n        vector-effect="non-scaling-stroke"></circle>\n</svg>\n<ng-content></ng-content>\n' });
   }
 };
 i0211.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0211, type: EclLoadingIndicatorComponent, decorators: [{
@@ -18225,10 +18199,10 @@ i0211.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Input95
 }], isCentered: [{
   type: Input95,
-  args: [{ transform: booleanAttribute45 }]
+  args: [{ transform: booleanAttribute52 }]
 }], isVisible: [{
   type: Input95,
-  args: [{ transform: booleanAttribute45 }]
+  args: [{ transform: booleanAttribute52 }]
 }] } });
 
 // lib/components/ecl-loading-indicator/ecl-loading-indicator-label.directive.mjs
@@ -18282,23 +18256,23 @@ i0213.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 // lib/components/ecl-loading-indicator/ecl-loading-indicator.module.mjs
 import { NgModule as NgModule53 } from "@angular/core";
 import { CommonModule as CommonModule53 } from "@angular/common";
-import { TranslateModule as TranslateModule26 } from "@ngx-translate/core";
+import { TranslateModule as TranslateModule27 } from "@ngx-translate/core";
 import * as i0214 from "@angular/core";
 var EclLoadingIndicatorComponentModule = class _EclLoadingIndicatorComponentModule {
   static {
     this.ɵfac = i0214.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0214, type: _EclLoadingIndicatorComponentModule, deps: [], target: i0214.ɵɵFactoryTarget.NgModule });
   }
   static {
-    this.ɵmod = i0214.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.5", ngImport: i0214, type: _EclLoadingIndicatorComponentModule, declarations: [EclLoadingIndicatorComponent, EclLoadingIndicatorLabelDirective, EclLoadingIndicatorOverlayDirective], imports: [CommonModule53, TranslateModule26], exports: [EclLoadingIndicatorComponent, EclLoadingIndicatorLabelDirective, EclLoadingIndicatorOverlayDirective] });
+    this.ɵmod = i0214.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.5", ngImport: i0214, type: _EclLoadingIndicatorComponentModule, declarations: [EclLoadingIndicatorComponent, EclLoadingIndicatorLabelDirective, EclLoadingIndicatorOverlayDirective], imports: [CommonModule53, TranslateModule27], exports: [EclLoadingIndicatorComponent, EclLoadingIndicatorLabelDirective, EclLoadingIndicatorOverlayDirective] });
   }
   static {
-    this.ɵinj = i0214.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0214, type: _EclLoadingIndicatorComponentModule, imports: [CommonModule53, TranslateModule26] });
+    this.ɵinj = i0214.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0214, type: _EclLoadingIndicatorComponentModule, imports: [CommonModule53, TranslateModule27] });
   }
 };
 i0214.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0214, type: EclLoadingIndicatorComponentModule, decorators: [{
   type: NgModule53,
   args: [{
-    imports: [CommonModule53, TranslateModule26],
+    imports: [CommonModule53, TranslateModule27],
     exports: [EclLoadingIndicatorComponent, EclLoadingIndicatorLabelDirective, EclLoadingIndicatorOverlayDirective],
     declarations: [EclLoadingIndicatorComponent, EclLoadingIndicatorLabelDirective, EclLoadingIndicatorOverlayDirective]
   }]
@@ -18340,7 +18314,7 @@ i0215.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-table/ecl-table.directive.mjs
-import { ContentChildren as ContentChildren26, Directive as Directive64, EventEmitter as EventEmitter44, forwardRef as forwardRef54, HostBinding as HostBinding152, HostListener as HostListener22, Input as Input96, Output as Output44, booleanAttribute as booleanAttribute46 } from "@angular/core";
+import { ContentChildren as ContentChildren26, Directive as Directive64, EventEmitter as EventEmitter44, forwardRef as forwardRef54, HostBinding as HostBinding152, HostListener as HostListener22, Input as Input96, Output as Output44, booleanAttribute as booleanAttribute53 } from "@angular/core";
 import { Subject as Subject27 } from "rxjs";
 import { takeUntil as takeUntil24 } from "rxjs/operators";
 import * as i0216 from "@angular/core";
@@ -18386,7 +18360,7 @@ var EclTableDirective = class _EclTableDirective extends ECLBaseDirective {
     this.ɵfac = i0216.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0216, type: _EclTableDirective, deps: [{ token: i0216.IterableDiffers }], target: i0216.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0216.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclTableDirective, selector: "[eclTable]", inputs: { isZebra: ["isZebra", "isZebra", booleanAttribute46] }, outputs: { sort: "sort" }, host: { properties: { "class.ecl-table--zebra": "this.isZebra", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclTableHeaders", predicate: i0216.forwardRef(() => EclTableHeaderDirective), descendants: true }], usesInheritance: true, ngImport: i0216 });
+    this.ɵdir = i0216.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclTableDirective, selector: "[eclTable]", inputs: { isZebra: ["isZebra", "isZebra", booleanAttribute53] }, outputs: { sort: "sort" }, host: { properties: { "class.ecl-table--zebra": "this.isZebra", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclTableHeaders", predicate: i0216.forwardRef(() => EclTableHeaderDirective), descendants: true }], usesInheritance: true, ngImport: i0216 });
   }
 };
 i0216.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0216, type: EclTableDirective, decorators: [{
@@ -18396,7 +18370,7 @@ i0216.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   }]
 }], ctorParameters: () => [{ type: i0216.IterableDiffers }], propDecorators: { isZebra: [{
   type: Input96,
-  args: [{ transform: booleanAttribute46 }]
+  args: [{ transform: booleanAttribute53 }]
 }, {
   type: HostBinding152,
   args: ["class.ecl-table--zebra"]
@@ -18732,7 +18706,7 @@ i0218.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }], ctorParameters: () => [{ type: i0218.ElementRef }] });
 
 // lib/components/ecl-tabs/ecl-tab.component.mjs
-import { Component as Component97, ContentChild as ContentChild27, EventEmitter as EventEmitter45, HostBinding as HostBinding153, Input as Input97, Output as Output45, ViewChild as ViewChild16, booleanAttribute as booleanAttribute47 } from "@angular/core";
+import { Component as Component97, ContentChild as ContentChild27, EventEmitter as EventEmitter45, HostBinding as HostBinding153, Input as Input97, Output as Output45, ViewChild as ViewChild16, booleanAttribute as booleanAttribute54 } from "@angular/core";
 import * as i0219 from "@angular/core";
 var EclTabSelectEvent = class extends EclBaseEvent {
   constructor(tab) {
@@ -18786,7 +18760,7 @@ var EclTabComponent = class _EclTabComponent extends ECLBaseDirective {
     this.ɵfac = i0219.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0219, type: _EclTabComponent, deps: [{ token: i0219.ElementRef }], target: i0219.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0219.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclTabComponent, selector: "ecl-tab, [eclTab]", inputs: { id: "id", isHidden: ["isHidden", "isHidden", booleanAttribute47], isActive: ["isActive", "isActive", booleanAttribute47] }, outputs: { selectTab: "selectTab", keydownTab: "keydownTab" }, host: { properties: { "class.ecl-tabs__item--hidden": "this.isHidden", "class": "this.cssClasses" } }, queries: [{ propertyName: "label", first: true, predicate: EclTabLabelComponent, descendants: true }], viewQueries: [{ propertyName: "contentTemplate", first: true, predicate: ["content"], descendants: true }, { propertyName: "link", first: true, predicate: EclLinkDirective, descendants: true }], usesInheritance: true, ngImport: i0219, template: '<a\n    eclLink\n    role="tab"\n    class="ecl-tabs__link"\n    [class.ecl-tabs__link--active]="isActive"\n    [attr.aria-selected]="isActive"\n    tabindex="0"\n    (keydown)="onKeydown($event)"\n    (click)="onTabClick()">\n    <ng-content select="ecl-tab-label"></ng-content>\n</a>\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n', dependencies: [{ kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["isInverted", "isIconOnly", "isNoVisited", "variant"] }] });
+    this.ɵcmp = i0219.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclTabComponent, selector: "ecl-tab, [eclTab]", inputs: { id: "id", isHidden: ["isHidden", "isHidden", booleanAttribute54], isActive: ["isActive", "isActive", booleanAttribute54] }, outputs: { selectTab: "selectTab", keydownTab: "keydownTab" }, host: { properties: { "class.ecl-tabs__item--hidden": "this.isHidden", "class": "this.cssClasses" } }, queries: [{ propertyName: "label", first: true, predicate: EclTabLabelComponent, descendants: true }], viewQueries: [{ propertyName: "contentTemplate", first: true, predicate: ["content"], descendants: true }, { propertyName: "link", first: true, predicate: EclLinkDirective, descendants: true }], usesInheritance: true, ngImport: i0219, template: '<a\n    eclLink\n    role="tab"\n    class="ecl-tabs__link"\n    [class.ecl-tabs__link--active]="isActive"\n    [attr.aria-selected]="isActive"\n    tabindex="0"\n    (keydown)="onKeydown($event)"\n    (click)="onTabClick()">\n    <ng-content select="ecl-tab-label"></ng-content>\n</a>\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n', dependencies: [{ kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["isInverted", "isIconOnly", "isNoVisited", "variant"] }] });
   }
 };
 i0219.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0219, type: EclTabComponent, decorators: [{
@@ -18796,13 +18770,13 @@ i0219.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Input97
 }], isHidden: [{
   type: Input97,
-  args: [{ transform: booleanAttribute47 }]
+  args: [{ transform: booleanAttribute54 }]
 }, {
   type: HostBinding153,
   args: ["class.ecl-tabs__item--hidden"]
 }], isActive: [{
   type: Input97,
-  args: [{ transform: booleanAttribute47 }]
+  args: [{ transform: booleanAttribute54 }]
 }], selectTab: [{
   type: Output45
 }], keydownTab: [{
@@ -18822,7 +18796,7 @@ i0219.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-tabs/ecl-tab-more.component.mjs
-import { Component as Component98, HostBinding as HostBinding154, Input as Input98, booleanAttribute as booleanAttribute48 } from "@angular/core";
+import { Component as Component98, HostBinding as HostBinding154, Input as Input98, booleanAttribute as booleanAttribute55 } from "@angular/core";
 import * as i0220 from "@angular/core";
 var EclTabMoreComponent = class _EclTabMoreComponent extends ECLBaseDirective {
   constructor() {
@@ -18836,7 +18810,7 @@ var EclTabMoreComponent = class _EclTabMoreComponent extends ECLBaseDirective {
     this.ɵfac = i0220.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0220, type: _EclTabMoreComponent, deps: null, target: i0220.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0220.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclTabMoreComponent, selector: "ecl-tab-more", inputs: { isHidden: ["isHidden", "isHidden", booleanAttribute48] }, host: { properties: { "class.ecl-tabs__item--hidden": "this.isHidden", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0220, template: "<ng-content></ng-content>\n" });
+    this.ɵcmp = i0220.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclTabMoreComponent, selector: "ecl-tab-more", inputs: { isHidden: ["isHidden", "isHidden", booleanAttribute55] }, host: { properties: { "class.ecl-tabs__item--hidden": "this.isHidden", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0220, template: "<ng-content></ng-content>\n" });
   }
 };
 i0220.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0220, type: EclTabMoreComponent, decorators: [{
@@ -18844,7 +18818,7 @@ i0220.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   args: [{ selector: "ecl-tab-more", template: "<ng-content></ng-content>\n" }]
 }], propDecorators: { isHidden: [{
   type: Input98,
-  args: [{ transform: booleanAttribute48 }]
+  args: [{ transform: booleanAttribute55 }]
 }, {
   type: HostBinding154,
   args: ["class.ecl-tabs__item--hidden"]
@@ -18858,7 +18832,7 @@ import { Component as Component99, ContentChildren as ContentChildren27, EventEm
 import { of as of4, Subject as Subject28 } from "rxjs";
 import { mergeWith as mergeWith3, takeUntil as takeUntil25 } from "rxjs/operators";
 import * as i0221 from "@angular/core";
-import * as i139 from "@angular/cdk/layout";
+import * as i138 from "@angular/cdk/layout";
 import * as i35 from "@angular/common";
 import * as i10 from "@ngx-translate/core";
 var ShiftDirection;
@@ -19266,7 +19240,7 @@ var EclTabsComponent = class _EclTabsComponent extends ECLBaseDirective {
     this.index = 0;
   }
   static {
-    this.ɵfac = i0221.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0221, type: _EclTabsComponent, deps: [{ token: i0221.IterableDiffers }, { token: i139.BreakpointObserver }, { token: i0221.ChangeDetectorRef }, { token: i0221.ElementRef }, { token: EclRtlService }], target: i0221.ɵɵFactoryTarget.Component });
+    this.ɵfac = i0221.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0221, type: _EclTabsComponent, deps: [{ token: i0221.IterableDiffers }, { token: i138.BreakpointObserver }, { token: i0221.ChangeDetectorRef }, { token: i0221.ElementRef }, { token: EclRtlService }], target: i0221.ɵɵFactoryTarget.Component });
   }
   static {
     this.ɵcmp = i0221.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclTabsComponent, selector: "nav[eclTabs], ecl-tabs", inputs: { bodyClass: "bodyClass" }, outputs: { tabSelect: "tabSelect" }, host: { listeners: { "document:click": "onClick($event.target)", "window:resize": "onWindowResize($event)" } }, queries: [{ propertyName: "tabs", predicate: i0221.forwardRef(() => EclTabComponent) }], viewQueries: [{ propertyName: "tabsList", first: true, predicate: ["tabsList"], descendants: true }, { propertyName: "moreButton", first: true, predicate: ["moreButton"], descendants: true }, { propertyName: "btnPrev", first: true, predicate: ["btnPrev"], descendants: true }, { propertyName: "btnNext", first: true, predicate: ["btnNext"], descendants: true }, { propertyName: "dropdownList", first: true, predicate: ["dropdownList"], descendants: true }], usesInheritance: true, ngImport: i0221, template: `<div class="ecl-tabs">
@@ -19417,7 +19391,7 @@ i0221.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
         <ng-container *ngTemplateOutlet="tab.contentTemplate"></ng-container>
     </div>
 }` }]
-}], ctorParameters: () => [{ type: i0221.IterableDiffers }, { type: i139.BreakpointObserver }, { type: i0221.ChangeDetectorRef }, { type: i0221.ElementRef }, { type: EclRtlService }], propDecorators: { bodyClass: [{
+}], ctorParameters: () => [{ type: i0221.IterableDiffers }, { type: i138.BreakpointObserver }, { type: i0221.ChangeDetectorRef }, { type: i0221.ElementRef }, { type: EclRtlService }], propDecorators: { bodyClass: [{
   type: Input99
 }], tabSelect: [{
   type: Output46
@@ -19450,7 +19424,7 @@ i0221.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 // lib/components/ecl-tabs/ecl-tabs.module.mjs
 import { CommonModule as CommonModule55 } from "@angular/common";
 import { NgModule as NgModule55 } from "@angular/core";
-import { TranslateModule as TranslateModule27 } from "@ngx-translate/core";
+import { TranslateModule as TranslateModule28 } from "@ngx-translate/core";
 import * as i0222 from "@angular/core";
 var COMPONENTS28 = [EclTabsComponent, EclTabComponent, EclTabLabelComponent, EclTabMoreComponent];
 var EclTabsComponentModule = class _EclTabsComponentModule {
@@ -19463,7 +19437,7 @@ var EclTabsComponentModule = class _EclTabsComponentModule {
       EclLinkDirectiveModule,
       EclButtonComponentModule,
       EclIconComponentModule,
-      TranslateModule27,
+      TranslateModule28,
       ECLClickOutsideDirective
     ], exports: [EclTabsComponent, EclTabComponent, EclTabLabelComponent, EclTabMoreComponent] });
   }
@@ -19473,7 +19447,7 @@ var EclTabsComponentModule = class _EclTabsComponentModule {
       EclLinkDirectiveModule,
       EclButtonComponentModule,
       EclIconComponentModule,
-      TranslateModule27
+      TranslateModule28
     ] });
   }
 };
@@ -19485,7 +19459,7 @@ i0222.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
       EclLinkDirectiveModule,
       EclButtonComponentModule,
       EclIconComponentModule,
-      TranslateModule27,
+      TranslateModule28,
       ECLClickOutsideDirective
     ],
     exports: [...COMPONENTS28],
@@ -19494,7 +19468,7 @@ i0222.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] });
 
 // lib/components/ecl-tag/ecl-tag.component.mjs
-import { Component as Component100, Input as Input100, HostBinding as HostBinding155, Output as Output47, EventEmitter as EventEmitter47, booleanAttribute as booleanAttribute49 } from "@angular/core";
+import { Component as Component100, Input as Input100, HostBinding as HostBinding155, Output as Output47, EventEmitter as EventEmitter47, booleanAttribute as booleanAttribute56 } from "@angular/core";
 import * as i0223 from "@angular/core";
 import * as i217 from "@angular/common";
 var EclTagRemoveEvent = class extends EclBaseEvent {
@@ -19531,7 +19505,7 @@ var EclTagComponent = class _EclTagComponent extends ECLBaseDirective {
     this.ɵfac = i0223.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0223, type: _EclTagComponent, deps: null, target: i0223.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0223.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclTagComponent, selector: "ecl-tag, [eclTag]", inputs: { variant: "variant", isWrapped: ["isWrapped", "isWrapped", booleanAttribute49] }, outputs: { remove: "remove" }, host: { properties: { "attr.hidden": "this.isHidden", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0223, template: '<ng-content></ng-content>\n@if(isRemovable) {\n    <span class="ecl-tag__icon" (click)="onRemoveClick($event)">\n    <ecl-icon icon="close-outline" class="ecl-tag__icon-close" role="img">\n        <title>{{title | titlecase}}</title>\n    </ecl-icon>\n</span>\n}\n', dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }, { kind: "pipe", type: i217.TitleCasePipe, name: "titlecase" }] });
+    this.ɵcmp = i0223.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.5", type: _EclTagComponent, selector: "ecl-tag, [eclTag]", inputs: { variant: "variant", isWrapped: ["isWrapped", "isWrapped", booleanAttribute56] }, outputs: { remove: "remove" }, host: { properties: { "attr.hidden": "this.isHidden", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0223, template: '<ng-content></ng-content>\n@if(isRemovable) {\n    <span class="ecl-tag__icon" (click)="onRemoveClick($event)">\n    <ecl-icon icon="close-outline" class="ecl-tag__icon-close" role="img">\n        <title>{{title | titlecase}}</title>\n    </ecl-icon>\n</span>\n}\n', dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }, { kind: "pipe", type: i217.TitleCasePipe, name: "titlecase" }] });
   }
 };
 i0223.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0223, type: EclTagComponent, decorators: [{
@@ -19541,7 +19515,7 @@ i0223.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
   type: Input100
 }], isWrapped: [{
   type: Input100,
-  args: [{ transform: booleanAttribute49 }]
+  args: [{ transform: booleanAttribute56 }]
 }], remove: [{
   type: Output47
 }], isHidden: [{
@@ -19601,11 +19575,9 @@ i0225.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] });
 
 // lib/components/ecl-text-area/ecl-text-area.directive.mjs
-import { __decorate as __decorate11 } from "tslib";
-import { Directive as Directive66, HostBinding as HostBinding157, Input as Input101, Optional as Optional9, Self as Self7 } from "@angular/core";
-import { coerceBoolean as coerceBoolean10 } from "@eui/base";
+import { Directive as Directive66, HostBinding as HostBinding157, Input as Input101, Optional as Optional9, Self as Self7, booleanAttribute as booleanAttribute57 } from "@angular/core";
 import * as i0226 from "@angular/core";
-import * as i140 from "@angular/forms";
+import * as i139 from "@angular/forms";
 var EclTextAreaDirective = class _EclTextAreaDirective extends ECLBaseDirective {
   get cssClasses() {
     return [super.getCssClasses("ecl-text-area"), this.eclSize ? `ecl-text-area--${this.eclSize}` : ""].join(" ").trim();
@@ -19624,28 +19596,26 @@ var EclTextAreaDirective = class _EclTextAreaDirective extends ECLBaseDirective
     this.isInvalid = false;
   }
   static {
-    this.ɵfac = i0226.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0226, type: _EclTextAreaDirective, deps: [{ token: i140.NgControl, optional: true, self: true }], target: i0226.ɵɵFactoryTarget.Directive });
+    this.ɵfac = i0226.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0226, type: _EclTextAreaDirective, deps: [{ token: i139.NgControl, optional: true, self: true }], target: i0226.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0226.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.5", type: _EclTextAreaDirective, selector: "textarea[eclTextArea]", inputs: { eclSize: "eclSize", isInvalid: "isInvalid" }, host: { properties: { "class": "this.cssClasses", "class.ecl-text-area--invalid": "this.invalidState" } }, usesInheritance: true, ngImport: i0226 });
+    this.ɵdir = i0226.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.5", type: _EclTextAreaDirective, selector: "textarea[eclTextArea]", inputs: { eclSize: "eclSize", isInvalid: ["isInvalid", "isInvalid", booleanAttribute57] }, host: { properties: { "class": "this.cssClasses", "class.ecl-text-area--invalid": "this.invalidState" } }, usesInheritance: true, ngImport: i0226 });
   }
 };
-__decorate11([
-  coerceBoolean10
-], EclTextAreaDirective.prototype, "isInvalid", void 0);
 i0226.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0226, type: EclTextAreaDirective, decorators: [{
   type: Directive66,
   args: [{
     selector: "textarea[eclTextArea]"
   }]
-}], ctorParameters: () => [{ type: i140.NgControl, decorators: [{
+}], ctorParameters: () => [{ type: i139.NgControl, decorators: [{
   type: Optional9
 }, {
   type: Self7
 }] }], propDecorators: { eclSize: [{
   type: Input101
 }], isInvalid: [{
-  type: Input101
+  type: Input101,
+  args: [{ transform: booleanAttribute57 }]
 }], cssClasses: [{
   type: HostBinding157,
   args: ["class"]
@@ -19755,14 +19725,14 @@ i0230.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 }] } });
 
 // lib/components/ecl-timeline/ecl-timeline-item.component.mjs
-import { __decorate as __decorate12 } from "tslib";
+import { __decorate as __decorate5 } from "tslib";
 import { Component as Component102, Input as Input102, HostBinding as HostBinding160, ViewEncapsulation as ViewEncapsulation17, Output as Output49, EventEmitter as EventEmitter49, ContentChild as ContentChild28, forwardRef as forwardRef58 } from "@angular/core";
-import { coerceBoolean as coerceBoolean11 } from "@eui/base";
+import { coerceBoolean as coerceBoolean4 } from "@eui/base";
 import { Subject as Subject29 } from "rxjs";
 import { takeUntil as takeUntil26 } from "rxjs/operators";
 import * as i0231 from "@angular/core";
-import * as i141 from "@angular/common";
-import * as i57 from "@ngx-translate/core";
+import * as i140 from "@angular/common";
+import * as i58 from "@ngx-translate/core";
 var EclTimelineItemToggleEvent = class extends EclBaseEvent {
   constructor(isExpanded, toggleGroup) {
     super();
@@ -19854,11 +19824,11 @@ var EclTimelineItemComponent = class _EclTimelineItemComponent extends ECLBaseDi
 
 <ng-template #content>
     <ng-content></ng-content>
-</ng-template>`, styles: ["ecl-timeline-item{display:list-item}\n"], dependencies: [{ kind: "directive", type: i141.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i141.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "containerStyleClass"] }, { kind: "directive", type: EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }, { kind: "pipe", type: i57.TranslatePipe, name: "translate" }], encapsulation: i0231.ViewEncapsulation.None });
+</ng-template>`, styles: ["ecl-timeline-item{display:list-item}\n"], dependencies: [{ kind: "directive", type: i140.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i140.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "containerStyleClass"] }, { kind: "directive", type: EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }, { kind: "pipe", type: i58.TranslatePipe, name: "translate" }], encapsulation: i0231.ViewEncapsulation.None });
   }
 };
-__decorate12([
-  coerceBoolean11
+__decorate5([
+  coerceBoolean4
 ], EclTimelineItemComponent.prototype, "isTogglerExpanded", void 0);
 i0231.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0231, type: EclTimelineItemComponent, decorators: [{
   type: Component102,
@@ -19984,7 +19954,7 @@ i0232.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5
 // lib/components/ecl-timeline/ecl-timeline.module.mjs
 import { CommonModule as CommonModule58 } from "@angular/common";
 import { NgModule as NgModule58 } from "@angular/core";
-import { TranslateModule as TranslateModule28 } from "@ngx-translate/core";
+import { TranslateModule as TranslateModule29 } from "@ngx-translate/core";
 import * as i0233 from "@angular/core";
 var EclTimelineComponentModule = class _EclTimelineComponentModule {
   static {
@@ -19997,7 +19967,7 @@ var EclTimelineComponentModule = class _EclTimelineComponentModule {
       EclTimelineItemTogglerComponent,
       EclTimelineItemLabelDirective,
       EclTimelineItemTitleDirective
-    ], imports: [CommonModule58, TranslateModule28, EclButtonComponentModule, EclIconComponentModule], exports: [
+    ], imports: [CommonModule58, TranslateModule29, EclButtonComponentModule, EclIconComponentModule], exports: [
       EclTimelineComponent,
       EclTimelineItemComponent,
       EclTimelineItemTogglerComponent,
@@ -20006,13 +19976,13 @@ var EclTimelineComponentModule = class _EclTimelineComponentModule {
     ] });
   }
   static {
-    this.ɵinj = i0233.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0233, type: _EclTimelineComponentModule, imports: [CommonModule58, TranslateModule28, EclButtonComponentModule, EclIconComponentModule] });
+    this.ɵinj = i0233.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0233, type: _EclTimelineComponentModule, imports: [CommonModule58, TranslateModule29, EclButtonComponentModule, EclIconComponentModule] });
   }
 };
 i0233.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0233, type: EclTimelineComponentModule, decorators: [{
   type: NgModule58,
   args: [{
-    imports: [CommonModule58, TranslateModule28, EclButtonComponentModule, EclIconComponentModule],
+    imports: [CommonModule58, TranslateModule29, EclButtonComponentModule, EclIconComponentModule],
     exports: [
       EclTimelineComponent,
       EclTimelineItemComponent,