@eui/ecl 18.0.0-next.14 → 18.0.0-next.16

package/fesm2022/eui-ecl.mjs

@@ -471,9 +471,7 @@ i04.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3",
 }] }, { type: EclThemeService }, { type: EclDefaultLanguageService }] });
 
 // lib/components/ecl-icon/ecl-icon.component.mjs
-import { __decorate } from "tslib";
 import { Component, HostBinding as HostBinding2, Input as Input2, ViewChild, booleanAttribute } from "@angular/core";
-import { coerceElement } from "@eui/base";
 import { of, switchMap } from "rxjs";
 import * as i05 from "@angular/core";
 import * as i2 from "@angular/common";
@@ -505,13 +503,13 @@ var EclIconComponent = class _EclIconComponent extends ECLBaseDirective {
     const hostParentEl = hostEl.parentElement;
     if (hostParentEl != null) {
       this.renderer.setStyle(hostEl, "display", "none");
-      hostEl.after(this.svgEl);
+      hostEl.after(this.svgEl.nativeElement);
     }
   }
   ngOnDestroy() {
     try {
       if (this.svgEl) {
-        const hostParentEl = this.svgEl.parentElement;
+        const hostParentEl = this.svgEl.nativeElement.parentElement;
         if (hostParentEl) {
           hostParentEl.removeChild(this.svgEl);
         }
@@ -555,9 +553,6 @@ var EclIconComponent = class _EclIconComponent extends ECLBaseDirective {
     this.ɵcmp = i05.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.3", type: _EclIconComponent, selector: "ecl-icon", inputs: { iconSet: "iconSet", icon: "icon", size: "size", color: "color", transform: "transform", ariaLabelledby: "ariaLabelledby", role: "role", ariaHidden: ["ariaHidden", "ariaHidden", booleanAttribute], focusable: ["focusable", "focusable", booleanAttribute] }, host: { properties: { "class.ecl-u-bg-dark": "this.isColorInverted" } }, viewQueries: [{ propertyName: "svgEl", first: true, predicate: ["svg"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i05, template: '<svg\n    #svg\n    [ngClass]="getClasses()"\n    [attr.aria-hidden]="ariaHidden"\n    [attr.aria-labelledby]="ariaLabelledby || null"\n    [attr.role]="role || null"\n    [attr.focusable]="focusable">\n    <use [attr.xlink:href]="iconUrl$ | async"></use>\n    <ng-content></ng-content>\n</svg>\n', dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
   }
 };
-__decorate([
-  coerceElement
-], EclIconComponent.prototype, "svgEl", void 0);
 i05.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i05, type: EclIconComponent, decorators: [{
   type: Component,
   args: [{ selector: "ecl-icon", template: '<svg\n    #svg\n    [ngClass]="getClasses()"\n    [attr.aria-hidden]="ariaHidden"\n    [attr.aria-labelledby]="ariaLabelledby || null"\n    [attr.role]="role || null"\n    [attr.focusable]="focusable">\n    <use [attr.xlink:href]="iconUrl$ | async"></use>\n    <ng-content></ng-content>\n</svg>\n' }]
@@ -1023,7 +1018,7 @@ i015.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3"
 }] });
 
 // lib/components/ecl-form-label/ecl-form-label.component.mjs
-import { __decorate as __decorate2 } from "tslib";
+import { __decorate } from "tslib";
 import { ChangeDetectionStrategy as ChangeDetectionStrategy5, Component as Component5, HostBinding as HostBinding8, Input as Input6 } from "@angular/core";
 import { coerceBoolean } from "@eui/base";
 import * as i016 from "@angular/core";
@@ -1054,16 +1049,16 @@ var EclFormLabelComponent = class _EclFormLabelComponent extends ECLBaseDirectiv
 `, dependencies: [{ kind: "directive", type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i23.TranslatePipe, name: "translate" }], changeDetection: i016.ChangeDetectionStrategy.OnPush });
   }
 };
-__decorate2([
+__decorate([
   coerceBoolean
 ], EclFormLabelComponent.prototype, "isOptional", void 0);
-__decorate2([
+__decorate([
   coerceBoolean
 ], EclFormLabelComponent.prototype, "isInvalid", void 0);
-__decorate2([
+__decorate([
   coerceBoolean
 ], EclFormLabelComponent.prototype, "isDisabled", void 0);
-__decorate2([
+__decorate([
   coerceBoolean
 ], EclFormLabelComponent.prototype, "isRequired", void 0);
 i016.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i016, type: EclFormLabelComponent, decorators: [{
@@ -1180,7 +1175,7 @@ var EclLinkDirective = class _EclLinkDirective extends ECLBaseDirective {
     if (this.eclIconComponents) {
       setTimeout(() => {
         this.eclIconComponents.forEach((icn) => {
-          icn.class = "ecl-link__icon";
+          icn.class = icn.class + " ecl-link__icon";
         });
       });
     }
@@ -1277,7 +1272,7 @@ i022.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3"
 }] });
 
 // lib/components/ecl-text-input/ecl-text-input.directive.mjs
-import { __decorate as __decorate3 } from "tslib";
+import { __decorate as __decorate2 } from "tslib";
 import { Directive as Directive7, HostBinding as HostBinding12, Input as Input8, Optional as Optional3, Self } from "@angular/core";
 import { coerceBoolean as coerceBoolean2 } from "@eui/base";
 import * as i023 from "@angular/core";
@@ -1307,7 +1302,7 @@ var EclTextInputDirective = class _EclTextInputDirective extends ECLBaseDirectiv
     this.ɵdir = i023.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", 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 });
   }
 };
-__decorate3([
+__decorate2([
   coerceBoolean2
 ], EclTextInputDirective.prototype, "isInvalid", void 0);
 i023.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i023, type: EclTextInputDirective, decorators: [{
@@ -1898,9 +1893,9 @@ i031.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3"
 }] } });
 
 // lib/components/ecl-site-header/language/ecl-site-header-language.component.mjs
-import { __decorate as __decorate4 } from "tslib";
+import { __decorate as __decorate3 } from "tslib";
 import { Component as Component12, ElementRef as ElementRef7, EventEmitter as EventEmitter5, HostBinding as HostBinding18, HostListener as HostListener4, Input as Input11, Output as Output5, ViewChild as ViewChild2 } from "@angular/core";
-import { coerceElement as coerceElement2 } from "@eui/base";
+import { coerceElement } from "@eui/base";
 import { debounceTime, fromEvent, Subject as Subject5, takeUntil as takeUntil5 } from "rxjs";
 import * as i032 from "@angular/core";
 import * as i4 from "@angular/common";
@@ -2074,11 +2069,11 @@ var EclSiteHeaderLanguageComponent = class _EclSiteHeaderLanguageComponent exten
 `, dependencies: [{ kind: "directive", type: i4.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: "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: i7.TranslatePipe, name: "translate" }] });
   }
 };
-__decorate4([
-  coerceElement2
+__decorate3([
+  coerceElement
 ], EclSiteHeaderLanguageComponent.prototype, "languagePopoverElement", void 0);
-__decorate4([
-  coerceElement2
+__decorate3([
+  coerceElement
 ], EclSiteHeaderLanguageComponent.prototype, "languageLinkElement", void 0);
 i032.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i032, type: EclSiteHeaderLanguageComponent, decorators: [{
   type: Component12,
@@ -2149,7 +2144,7 @@ i032.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3"
 }] } });
 
 // lib/components/ecl-site-header/login/ecl-site-header-login.component.mjs
-import { __decorate as __decorate5 } from "tslib";
+import { __decorate as __decorate4 } from "tslib";
 import { Component as Component13, EventEmitter as EventEmitter6, HostBinding as HostBinding19, Input as Input12, Output as Output6 } from "@angular/core";
 import { coerceBoolean as coerceBoolean3 } from "@eui/base";
 import * as i033 from "@angular/core";
@@ -2224,7 +2219,7 @@ 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: i18.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" }] });
   }
 };
-__decorate5([
+__decorate4([
   coerceBoolean3
 ], EclSiteHeaderLoginComponent.prototype, "isLoggedIn", void 0);
 i033.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i033, type: EclSiteHeaderLoginComponent, decorators: [{
@@ -2399,9 +2394,9 @@ i034.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3"
 }] } });
 
 // lib/components/ecl-site-header/ecl-site-header.component.mjs
-import { __decorate as __decorate6 } from "tslib";
+import { __decorate as __decorate5 } from "tslib";
 import { Component as Component15, ContentChild, EventEmitter as EventEmitter8, HostBinding as HostBinding21, Input as Input14, Output as Output8, ViewChild as ViewChild3 } from "@angular/core";
-import { coerceElement as coerceElement3 } from "@eui/base";
+import { coerceElement as coerceElement2 } from "@eui/base";
 import { Subject as Subject6, takeUntil as takeUntil6 } from "rxjs";
 import * as i035 from "@angular/core";
 import * as i24 from "@ngx-translate/core";
@@ -2518,8 +2513,8 @@ var EclSiteHeaderComponent = class _EclSiteHeaderComponent extends ECLBaseDirect
 `, styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i43.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["isInverted", "isHiddenLabel", "isNoVisited", "variant"] }, { kind: "pipe", type: i43.AsyncPipe, name: "async" }, { kind: "pipe", type: i24.TranslatePipe, name: "translate" }] });
   }
 };
-__decorate6([
-  coerceElement3
+__decorate5([
+  coerceElement2
 ], EclSiteHeaderComponent.prototype, "topContainerElement", void 0);
 i035.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i035, type: EclSiteHeaderComponent, decorators: [{
   type: Component15,
@@ -3356,12 +3351,12 @@ var EclBreadcrumbSegmentComponent = class _EclBreadcrumbSegmentComponent extends
     this.ɵfac = i050.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i050, type: _EclBreadcrumbSegmentComponent, deps: [{ token: i050.ElementRef }], target: i050.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i050.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.3", type: _EclBreadcrumbSegmentComponent, selector: "ecl-breadcrumb-segment", inputs: { routerLink: "routerLink", queryParams: "queryParams", href: "href", queryParamsHandling: "queryParamsHandling", isCurrentPage: ["isCurrentPage", "isCurrentPage", booleanAttribute6], isHidden: ["isHidden", "isHidden", booleanAttribute6] }, outputs: { segmentClick: "segmentClick" }, host: { properties: { "attr.tabindex": "this.tabIndex", "attr.role": "this.role", "attr.aria-hidden": "this.isHidden", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i050, template: '@if (!isEllipsis) {\n<a *ngIf="!isCurrentPage && href" eclLink variant="standalone" [isNoVisited]="true" [href]="href" tabindex="0"\n    (click)="onSegmentClick($event)" class="ecl-breadcrumb__link">\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</a>\n<a *ngIf="!isCurrentPage && !href" eclLink [routerLink]="routerLink" [queryParams]="queryParams"\n    [queryParamsHandling]="queryParamsHandling" variant="standalone" [isNoVisited]="true" [href]="href" tabindex="0"\n    (click)="onSegmentClick($event)" class="ecl-breadcrumb__link">\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</a>\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: i112.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i112.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", "isHiddenLabel", "isNoVisited", "variant"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }], encapsulation: i050.ViewEncapsulation.None });
+    this.ɵcmp = i050.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.3", type: _EclBreadcrumbSegmentComponent, selector: "ecl-breadcrumb-segment", inputs: { routerLink: "routerLink", queryParams: "queryParams", href: "href", queryParamsHandling: "queryParamsHandling", isCurrentPage: ["isCurrentPage", "isCurrentPage", booleanAttribute6], isHidden: ["isHidden", "isHidden", booleanAttribute6] }, outputs: { segmentClick: "segmentClick" }, host: { properties: { "attr.tabindex": "this.tabIndex", "attr.role": "this.role", "attr.aria-hidden": "this.isHidden", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i050, 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: i112.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", "isHiddenLabel", "isNoVisited", "variant"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }], encapsulation: i050.ViewEncapsulation.None });
   }
 };
 i050.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i050, type: EclBreadcrumbSegmentComponent, decorators: [{
   type: Component20,
-  args: [{ selector: "ecl-breadcrumb-segment", encapsulation: ViewEncapsulation3.None, template: '@if (!isEllipsis) {\n<a *ngIf="!isCurrentPage && href" eclLink variant="standalone" [isNoVisited]="true" [href]="href" tabindex="0"\n    (click)="onSegmentClick($event)" class="ecl-breadcrumb__link">\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</a>\n<a *ngIf="!isCurrentPage && !href" eclLink [routerLink]="routerLink" [queryParams]="queryParams"\n    [queryParamsHandling]="queryParamsHandling" variant="standalone" [isNoVisited]="true" [href]="href" tabindex="0"\n    (click)="onSegmentClick($event)" class="ecl-breadcrumb__link">\n    <ng-container *ngTemplateOutlet="content"></ng-container>\n</a>\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>' }]
+  args: [{ selector: "ecl-breadcrumb-segment", encapsulation: ViewEncapsulation3.None, 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>' }]
 }], ctorParameters: () => [{ type: i050.ElementRef }], propDecorators: { tabIndex: [{
   type: HostBinding32,
   args: ["attr.tabindex"]
@@ -5343,7 +5338,7 @@ i068.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3"
 }] });
 
 // lib/components/ecl-help-block/ecl-help-block.directive.mjs
-import { __decorate as __decorate7 } from "tslib";
+import { __decorate as __decorate6 } from "tslib";
 import { Directive as Directive18, HostBinding as HostBinding45, Input as Input24 } from "@angular/core";
 import { coerceBoolean as coerceBoolean4 } from "@eui/base";
 import * as i069 from "@angular/core";
@@ -5362,7 +5357,7 @@ var EclHelpBlockDirective = class _EclHelpBlockDirective extends ECLBaseDirectiv
     this.ɵdir = i069.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclHelpBlockDirective, selector: "[eclHelpBlock]", inputs: { isDisabled: "isDisabled" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i069 });
   }
 };
-__decorate7([
+__decorate6([
   coerceBoolean4
 ], EclHelpBlockDirective.prototype, "isDisabled", void 0);
 i069.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i069, type: EclHelpBlockDirective, decorators: [{
@@ -5378,7 +5373,7 @@ i069.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3"
 }] } });
 
 // lib/components/ecl-checkbox/ecl-checkbox-label.component.mjs
-import { __decorate as __decorate8 } from "tslib";
+import { __decorate as __decorate7 } from "tslib";
 import { Component as Component30, HostBinding as HostBinding46, Input as Input25, ViewEncapsulation as ViewEncapsulation5 } from "@angular/core";
 import { coerceBoolean as coerceBoolean5 } from "@eui/base";
 import * as i070 from "@angular/core";
@@ -5398,10 +5393,10 @@ var EclCheckboxLabelComponent = class _EclCheckboxLabelComponent extends ECLBase
     this.ɵcmp = i070.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclCheckboxLabelComponent, selector: "label[eclCheckboxLabel]", inputs: { isInvalid: "isInvalid", isDisabled: "isDisabled" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i070, 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', dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }], encapsulation: i070.ViewEncapsulation.None });
   }
 };
-__decorate8([
+__decorate7([
   coerceBoolean5
 ], EclCheckboxLabelComponent.prototype, "isInvalid", void 0);
-__decorate8([
+__decorate7([
   coerceBoolean5
 ], EclCheckboxLabelComponent.prototype, "isDisabled", void 0);
 i070.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i070, type: EclCheckboxLabelComponent, decorators: [{
@@ -5448,7 +5443,7 @@ i071.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3"
 }] } });
 
 // lib/components/ecl-checkbox/ecl-checkbox.directive.mjs
-import { __decorate as __decorate9 } from "tslib";
+import { __decorate as __decorate8 } from "tslib";
 import { Directive as Directive19, HostBinding as HostBinding48, Input as Input27, forwardRef as forwardRef25, ContentChild as ContentChild9 } from "@angular/core";
 import { coerceBoolean as coerceBoolean6 } from "@eui/base";
 import * as i072 from "@angular/core";
@@ -5483,10 +5478,10 @@ var EclCheckboxDirective = class _EclCheckboxDirective extends ECLBaseDirective
     this.ɵdir = i072.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclCheckboxDirective, isStandalone: true, selector: "[eclCheckbox]", inputs: { isDisabled: "isDisabled", isInvalid: "isInvalid" }, host: { properties: { "class.ecl-checkbox--disabled": "this.isDisabled", "class.ecl-checkbox--invalid": "this.isInvalid", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclCheckboxLabelComponent", first: true, predicate: i072.forwardRef(() => EclCheckboxLabelComponent), descendants: true }, { propertyName: "eclCheckboxHelpComponent", first: true, predicate: i072.forwardRef(() => EclCheckboxHelpComponent), descendants: true }, { propertyName: "eclFormLabelDirective", first: true, predicate: i072.forwardRef(() => EclFormLabelComponent), descendants: true }, { propertyName: "eclHelpBlockDirective", first: true, predicate: i072.forwardRef(() => EclHelpBlockDirective), descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i072 });
   }
 };
-__decorate9([
+__decorate8([
   coerceBoolean6
 ], EclCheckboxDirective.prototype, "isDisabled", void 0);
-__decorate9([
+__decorate8([
   coerceBoolean6
 ], EclCheckboxDirective.prototype, "isInvalid", void 0);
 i072.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i072, type: EclCheckboxDirective, decorators: [{
@@ -6714,7 +6709,7 @@ i098.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3"
 }] } });
 
 // lib/components/ecl-featured/ecl-featured.component.mjs
-import { __decorate as __decorate10 } from "tslib";
+import { __decorate as __decorate9 } from "tslib";
 import { Component as Component44, HostBinding as HostBinding68, Input as Input37 } from "@angular/core";
 import { coerceBoolean as coerceBoolean7 } from "@eui/base";
 import * as i099 from "@angular/core";
@@ -6735,7 +6730,7 @@ var EclFeaturedComponent = class _EclFeaturedComponent extends ECLBaseDirective
     this.ɵcmp = i099.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclFeaturedComponent, selector: "ecl-featured", inputs: { position: "position", isExtended: "isExtended" }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i099, template: '<div class="ecl-featured-item__container ecl-featured-item__container--{{ position }}">\n    <ng-content></ng-content>\n</div>\n' });
   }
 };
-__decorate10([
+__decorate9([
   coerceBoolean7
 ], EclFeaturedComponent.prototype, "isExtended", void 0);
 i099.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i099, type: EclFeaturedComponent, decorators: [{
@@ -6839,7 +6834,7 @@ i0102.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] });
 
 // lib/components/ecl-file-upload/ecl-file-upload.directive.mjs
-import { __decorate as __decorate11 } from "tslib";
+import { __decorate as __decorate10 } from "tslib";
 import { Directive as Directive28, HostBinding as HostBinding70, Input as Input38, Optional as Optional5, Self as Self3, HostListener as HostListener8, Output as Output16, EventEmitter as EventEmitter16 } from "@angular/core";
 import { takeUntil as takeUntil12 } from "rxjs/operators";
 import { Subject as Subject12 } from "rxjs";
@@ -7004,10 +6999,10 @@ var EclFileUploadDirective = class _EclFileUploadDirective extends ECLBaseDirect
     this.ɵdir = i0103.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclFileUploadDirective, selector: "[eclFileUpload]", inputs: { variant: "variant", isInvalid: "isInvalid", id: "id", disabled: "disabled", multiple: "multiple" }, 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: i0103 });
   }
 };
-__decorate11([
+__decorate10([
   coerceBoolean8
 ], EclFileUploadDirective.prototype, "disabled", void 0);
-__decorate11([
+__decorate10([
   coerceBoolean8
 ], EclFileUploadDirective.prototype, "multiple", void 0);
 i0103.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0103, type: EclFileUploadDirective, decorators: [{
@@ -7551,7 +7546,7 @@ i0112.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-gallery/ecl-gallery-item.component.mjs
-import { __decorate as __decorate12 } from "tslib";
+import { __decorate as __decorate11 } from "tslib";
 import { Component as Component49, ContentChild as ContentChild16, EventEmitter as EventEmitter18, HostBinding as HostBinding78, HostListener as HostListener9, Input as Input44, Output as Output18 } from "@angular/core";
 import { coerceBoolean as coerceBoolean9 } from "@eui/base";
 import * as i0113 from "@angular/core";
@@ -7653,7 +7648,7 @@ var EclGalleryItemComponent = class _EclGalleryItemComponent extends ECLBaseDire
 `, styles: [".ecl-gallery__description{width:100%}\n"], dependencies: [{ kind: "directive", type: i211.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i211.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }] });
   }
 };
-__decorate12([
+__decorate11([
   coerceBoolean9
 ], EclGalleryItemComponent.prototype, "isShareable", void 0);
 i0113.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0113, type: EclGalleryItemComponent, decorators: [{
@@ -7810,7 +7805,7 @@ i0114.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-gallery/ecl-gallery.component.mjs
-import { __decorate as __decorate13 } from "tslib";
+import { __decorate as __decorate12 } from "tslib";
 import { Component as Component51, Input as Input45, Output as Output20, ContentChildren as ContentChildren12, EventEmitter as EventEmitter20, HostListener as HostListener10, ViewChild as ViewChild7, HostBinding as HostBinding79, ContentChild as ContentChild17 } from "@angular/core";
 import { Subject as Subject13, delay } from "rxjs";
 import { takeUntil as takeUntil13 } from "rxjs/operators";
@@ -8161,22 +8156,22 @@ var EclGalleryComponent = class _EclGalleryComponent extends ECLBaseDirective {
 `, styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i212.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i212.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["isInverted", "isHiddenLabel", "isNoVisited", "variant"] }, { kind: "directive", type: EclLinkLabelDirective, selector: "[eclLinkLabel]" }, { kind: "pipe", type: i82.TranslatePipe, name: "translate" }] });
   }
 };
-__decorate13([
+__decorate12([
   coerceBoolean10
 ], EclGalleryComponent.prototype, "isDownloadable", void 0);
-__decorate13([
+__decorate12([
   coerceBoolean10
 ], EclGalleryComponent.prototype, "isOpenInFullScreenPossible", void 0);
-__decorate13([
+__decorate12([
   coerceBoolean10
 ], EclGalleryComponent.prototype, "isShareable", void 0);
-__decorate13([
+__decorate12([
   coerceBoolean10
 ], EclGalleryComponent.prototype, "isFullWidth", void 0);
-__decorate13([
+__decorate12([
   coerceBoolean10
 ], EclGalleryComponent.prototype, "isNoOverlay", void 0);
-__decorate13([
+__decorate12([
   coerceNumber
 ], EclGalleryComponent.prototype, "maxVisibleItems", void 0);
 i0115.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0115, type: EclGalleryComponent, decorators: [{
@@ -8456,7 +8451,7 @@ i0118.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-sticky-container/ecl-sticky-container.component.mjs
-import { __decorate as __decorate14 } from "tslib";
+import { __decorate as __decorate13 } from "tslib";
 import { Component as Component53, HostBinding as HostBinding81, Input as Input47 } from "@angular/core";
 import { Subject as Subject14, delay as delay2 } from "rxjs";
 import { takeUntil as takeUntil14 } from "rxjs/operators";
@@ -8507,7 +8502,7 @@ var EclStickyContainerComponent = class _EclStickyContainerComponent extends ECL
     this.ɵcmp = i0119.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclStickyContainerComponent, selector: "ecl-sticky-container", inputs: { isEnabled: "isEnabled", marginTop: "marginTop", marginBottom: "marginBottom" }, host: { properties: { "class": "this.cssClasses", "style.top.px": "this.top", "style.bottom.px": "this.bottom" } }, usesInheritance: true, ngImport: i0119, 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"] });
   }
 };
-__decorate14([
+__decorate13([
   coerceBoolean11
 ], EclStickyContainerComponent.prototype, "isEnabled", void 0);
 i0119.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0119, type: EclStickyContainerComponent, decorators: [{
@@ -9369,7 +9364,7 @@ var EclMenuItemParentFocusEvent = class {
 };
 
 // lib/components/ecl-menu/ecl-menu-mega/ecl-menu-mega-item.component.mjs
-import { __decorate as __decorate15 } from "tslib";
+import { __decorate as __decorate14 } from "tslib";
 import { Component as Component58, Input as Input54, HostBinding as HostBinding89, Output as Output23, EventEmitter as EventEmitter23, HostListener as HostListener11, ContentChildren as ContentChildren17, forwardRef as forwardRef35, ViewChild as ViewChild8 } from "@angular/core";
 import { coerceBoolean as coerceBoolean12 } from "@eui/base";
 import { ENTER } from "@angular/cdk/keycodes";
@@ -9426,7 +9421,7 @@ var EclMenuMegaItemComponent = class _EclMenuMegaItemComponent extends ECLBaseDi
     this.ɵcmp = i0132.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclMenuMegaItemComponent, selector: "ecl-menu-mega-item", inputs: { id: "id", label: "label", routerLink: "routerLink", queryParams: "queryParams", queryParamsHandling: "queryParamsHandling", href: "href", target: "target", isCurrent: "isCurrent" }, 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" } }, queries: [{ propertyName: "iconComponents", predicate: i0132.forwardRef(() => EclIconComponent) }], viewQueries: [{ propertyName: "megaMenuLink", first: true, predicate: ["megaMenuLink"], descendants: true }], usesInheritance: true, ngImport: i0132, template: '<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\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n', styles: [":host{display:list-item}\n"], dependencies: [{ kind: "directive", type: i126.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i126.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"] }] });
   }
 };
-__decorate15([
+__decorate14([
   coerceBoolean12
 ], EclMenuMegaItemComponent.prototype, "isCurrent", void 0);
 i0132.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0132, type: EclMenuMegaItemComponent, decorators: [{
@@ -9473,7 +9468,7 @@ i0132.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-menu/ecl-menu-mega/ecl-menu-mega.component.mjs
-import { __decorate as __decorate16 } from "tslib";
+import { __decorate as __decorate15 } from "tslib";
 import { Component as Component59, Input as Input55, ContentChildren as ContentChildren18, Output as Output24, EventEmitter as EventEmitter24, HostBinding as HostBinding90 } from "@angular/core";
 import { Subject as Subject16, of as of2 } from "rxjs";
 import { takeUntil as takeUntil16, mergeWith } from "rxjs/operators";
@@ -9595,7 +9590,7 @@ var EclMenuMegaComponent = class _EclMenuMegaComponent extends ECLBaseDirective
     this.ɵcmp = i0133.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclMenuMegaComponent, selector: "ecl-menu-mega", inputs: { isRtl: "isRtl" }, outputs: { menuItemSelect: "menuItemSelect", menuMegaItemParentFocus: "menuMegaItemParentFocus" }, host: { properties: { "class.ecl-menu__mega--rtl": "this.isRtlDisplay", "style.left.px": "this.offsetLeft", "style.right.px": "this.offsetRight", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclMenuMegaItems", predicate: EclMenuMegaItemComponent }], usesInheritance: true, ngImport: i0133, template: '<ul class="ecl-menu__sublist">\n    <ng-content></ng-content>\n</ul>\n' });
   }
 };
-__decorate16([
+__decorate15([
   coerceBoolean13
 ], EclMenuMegaComponent.prototype, "isRtl", void 0);
 i0133.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0133, type: EclMenuMegaComponent, decorators: [{
@@ -10085,7 +10080,7 @@ i0134.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-menu/ecl-menu/ecl-menu.component.mjs
-import { __decorate as __decorate17 } from "tslib";
+import { __decorate as __decorate16 } from "tslib";
 import { Breakpoints as Breakpoints3 } from "@angular/cdk/layout";
 import { Component as Component61, ContentChildren as ContentChildren19, EventEmitter as EventEmitter26, HostBinding as HostBinding92, HostListener as HostListener13, Input as Input57, Output as Output26, ViewChild as ViewChild10 } from "@angular/core";
 import { coerceNumber as coerceNumber2 } from "@eui/base";
@@ -10648,7 +10643,7 @@ var EclMenuComponent = class _EclMenuComponent extends ECLBaseDirective {
 `, styles: [":host{display:block}\n"], dependencies: [{ 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: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["isInverted", "isHiddenLabel", "isNoVisited", "variant"] }, { kind: "pipe", type: i72.TranslatePipe, name: "translate" }] });
   }
 };
-__decorate17([
+__decorate16([
   coerceNumber2
 ], EclMenuComponent.prototype, "maxLines", void 0);
 i0135.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0135, type: EclMenuComponent, decorators: [{
@@ -11222,7 +11217,7 @@ i0145.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] });
 
 // lib/components/ecl-multiselect/ecl-multiselect-option/ecl-multiselect-option.component.mjs
-import { __decorate as __decorate18 } from "tslib";
+import { __decorate as __decorate17 } from "tslib";
 import { Component as Component66, EventEmitter as EventEmitter30, HostBinding as HostBinding98, Input as Input63, Output as Output30, ViewChild as ViewChild11 } from "@angular/core";
 import { coerceBoolean as coerceBoolean14 } from "@eui/base";
 import { Subject as Subject20 } from "rxjs";
@@ -11313,7 +11308,7 @@ var EclMultiselectOptionComponent = class _EclMultiselectOptionComponent extends
     this.ɵcmp = i0146.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclMultiselectOptionComponent, selector: "div[eclMultiselectOption]", inputs: { value: "value", label: "label", disabled: "disabled", 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: i0146, 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"] }, { kind: "directive", type: EclCheckboxInputDirective, selector: "input[eclCheckboxInput]" }, { kind: "pipe", type: BoldTextPipe, name: "boldText" }] });
   }
 };
-__decorate18([
+__decorate17([
   coerceBoolean14
 ], EclMultiselectOptionComponent.prototype, "disabled", void 0);
 i0146.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0146, type: EclMultiselectOptionComponent, decorators: [{
@@ -11360,7 +11355,7 @@ i0146.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 } });
 
 // lib/components/ecl-multiselect/ecl-multiselect-input/ecl-multiselect-input.component.mjs
-import { __decorate as __decorate19 } from "tslib";
+import { __decorate as __decorate18 } from "tslib";
 import { Component as Component67, EventEmitter as EventEmitter31, HostBinding as HostBinding99, Input as Input64, Output as Output31, ViewChild as ViewChild12 } from "@angular/core";
 import { coerceBoolean as coerceBoolean15 } from "@eui/base";
 import * as i0147 from "@angular/core";
@@ -11419,10 +11414,10 @@ var EclMultiselectInputComponent = class _EclMultiselectInputComponent extends E
     this.ɵcmp = i0147.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclMultiselectInputComponent, selector: "div[eclMultiselectInput]", inputs: { eclSize: "eclSize", toggleId: "toggleId", isDisabled: "isDisabled", isInvalid: "isInvalid", 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: i0147, template: '<div [class.ecl-select-multiple-selections-counter--visible]="isShowCounter" class="ecl-select-multiple-selections-counter">\n    <span>{{ selectedItemsCount }}</span>\n</div>\n<button\n    class="ecl-select ecl-select__multiple-toggle"\n    #inputMultiselect\n    type="button"\n    [id]="toggleId"\n    [attr.aria-expanded]="isDropdownExpanded"\n    [attr.aria-controls]="ariaControls"\n    [attr.disabled]="isDisabled ? true : undefined"\n    [attr.aria-labelledby]="ariaLabeledby"\n    [attr.aria-describedby]="ariaDescribedby"\n    (keydown)="onKeydown($event)"\n    (click)="onClick($event)"> {{ buttonText }}\n</button>\n<div class="ecl-select__icon">\n    <ecl-icon icon="corner-arrow" size="s" class="ecl-select__icon-shape" transform="rotate-180"></ecl-icon>\n</div>\n', dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }] });
   }
 };
-__decorate19([
+__decorate18([
   coerceBoolean15
 ], EclMultiselectInputComponent.prototype, "isDisabled", void 0);
-__decorate19([
+__decorate18([
   coerceBoolean15
 ], EclMultiselectInputComponent.prototype, "isInvalid", void 0);
 i0147.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0147, type: EclMultiselectInputComponent, decorators: [{
@@ -11502,7 +11497,7 @@ i0148.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-multiselect/ecl-multiselect-dropdown/ecl-multiselect-dropdown.component.mjs
-import { __decorate as __decorate20 } from "tslib";
+import { __decorate as __decorate19 } from "tslib";
 import { Component as Component69, ElementRef as ElementRef25, EventEmitter as EventEmitter32, forwardRef as forwardRef43, HostBinding as HostBinding101, HostListener as HostListener17, Input as Input66, Output as Output32, ViewChild as ViewChild13, ViewChildren as ViewChildren2 } from "@angular/core";
 import { NG_VALUE_ACCESSOR as NG_VALUE_ACCESSOR4 } from "@angular/forms";
 import { coerceBoolean as coerceBoolean16 } from "@eui/base";
@@ -11979,10 +11974,10 @@ var EclMultiselectDropdownComponent = class _EclMultiselectDropdownComponent ext
 `, dependencies: [{ kind: "directive", type: i130.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i130.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: EclCheckboxDirective, selector: "[eclCheckbox]", inputs: ["isDisabled", "isInvalid"] }, { kind: "component", type: EclCheckboxLabelComponent, selector: "label[eclCheckboxLabel]", inputs: ["isInvalid", "isDisabled"] }, { kind: "directive", type: EclCheckboxInputDirective, selector: "input[eclCheckboxInput]" }, { kind: "component", type: EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "containerStyleClass"] }, { kind: "component", type: EclMultiselectOptionComponent, selector: "div[eclMultiselectOption]", inputs: ["value", "label", "disabled", "isChecked"], outputs: ["optionClick", "optionKeydown"] }, { kind: "component", type: EclMultiselectInputComponent, selector: "div[eclMultiselectInput]", inputs: ["eclSize", "toggleId", "isDisabled", "isInvalid", "inputPlaceholder", "selectedItems", "isDropdownExpanded", "ariaControls", "ariaDescribedby", "ariaLabeledby"], outputs: ["mainInputClick", "mainInputKeydown"] }, { kind: "component", type: EclMultiselectOptgroupComponent, selector: "fieldset[eclMultiselectOptgroup]", inputs: ["label"] }, { kind: "pipe", type: i9.TranslatePipe, name: "translate" }] });
   }
 };
-__decorate20([
+__decorate19([
   coerceBoolean16
 ], EclMultiselectDropdownComponent.prototype, "isInvalid", null);
-__decorate20([
+__decorate19([
   coerceBoolean16
 ], EclMultiselectDropdownComponent.prototype, "disabled", null);
 i0149.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0149, type: EclMultiselectDropdownComponent, decorators: [{
@@ -12187,7 +12182,7 @@ i0150.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-multiselect/ecl-multiselect.component.mjs
-import { __decorate as __decorate21 } from "tslib";
+import { __decorate as __decorate20 } from "tslib";
 import { coerceBooleanProperty as coerceBooleanProperty3 } from "@angular/cdk/coercion";
 import { Component as Component70, ContentChildren as ContentChildren23, EventEmitter as EventEmitter33, forwardRef as forwardRef44, HostBinding as HostBinding103, Input as Input68, Output as Output33, ViewEncapsulation as ViewEncapsulation9 } from "@angular/core";
 import { NG_VALUE_ACCESSOR as NG_VALUE_ACCESSOR5, NgControl as NgControl4 } from "@angular/forms";
@@ -12327,7 +12322,7 @@ var EclMultiselectComponent = class _EclMultiselectComponent extends ECLBaseDire
     ], queries: [{ propertyName: "eclOptionItems", predicate: i0151.forwardRef(() => EclMultiselectOptionDirective) }], usesInheritance: true, ngImport: i0151, template: "<ng-content></ng-content>\n", encapsulation: i0151.ViewEncapsulation.None });
   }
 };
-__decorate21([
+__decorate20([
   coerceBoolean17
 ], EclMultiselectComponent.prototype, "isInvalid", null);
 i0151.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0151, type: EclMultiselectComponent, decorators: [{
@@ -12470,7 +12465,7 @@ i0153.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-navigation-list/ecl-navigation-list.component.mjs
-import { __decorate as __decorate22 } from "tslib";
+import { __decorate as __decorate21 } from "tslib";
 import { Component as Component72, HostBinding as HostBinding105, Input as Input70 } from "@angular/core";
 import { coerceNumber as coerceNumber3 } from "@eui/base";
 import * as i0154 from "@angular/core";
@@ -12489,7 +12484,7 @@ var EclNavigationListComponent = class _EclNavigationListComponent extends ECLBa
     this.ɵcmp = i0154.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclNavigationListComponent, selector: "ecl-navigation-list", inputs: { columns: "columns" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0154, template: "<ng-content></ng-content>\n" });
   }
 };
-__decorate22([
+__decorate21([
   coerceNumber3
 ], EclNavigationListComponent.prototype, "columns", void 0);
 i0154.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0154, type: EclNavigationListComponent, decorators: [{
@@ -13213,7 +13208,7 @@ i0162.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-site-footer/ecl-footer-elements/ecl-site-footer-section.directive.mjs
-import { __decorate as __decorate23 } from "tslib";
+import { __decorate as __decorate22 } from "tslib";
 import { Directive as Directive42, HostBinding as HostBinding112, Input as Input74 } from "@angular/core";
 import { coerceBoolean as coerceBoolean18 } from "@eui/base";
 import * as i0163 from "@angular/core";
@@ -13233,16 +13228,16 @@ var EclSiteFooterSectionDirective = class _EclSiteFooterSectionDirective extends
     this.ɵdir = i0163.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclSiteFooterSectionDirective, selector: "[eclSiteFooterSection]", inputs: { isCondensed: "isCondensed", isSiteInfo: "isSiteInfo", isSplitList: "isSplitList", hasSeparator: "hasSeparator" }, 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: i0163 });
   }
 };
-__decorate23([
+__decorate22([
   coerceBoolean18
 ], EclSiteFooterSectionDirective.prototype, "isCondensed", void 0);
-__decorate23([
+__decorate22([
   coerceBoolean18
 ], EclSiteFooterSectionDirective.prototype, "isSiteInfo", void 0);
-__decorate23([
+__decorate22([
   coerceBoolean18
 ], EclSiteFooterSectionDirective.prototype, "isSplitList", void 0);
-__decorate23([
+__decorate22([
   coerceBoolean18
 ], EclSiteFooterSectionDirective.prototype, "hasSeparator", void 0);
 i0163.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0163, type: EclSiteFooterSectionDirective, decorators: [{
@@ -13276,7 +13271,7 @@ i0163.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-site-footer/ecl-footer-elements/ecl-site-footer-title.directive.mjs
-import { __decorate as __decorate24 } from "tslib";
+import { __decorate as __decorate23 } from "tslib";
 import { Directive as Directive43, HostBinding as HostBinding113, Input as Input75 } from "@angular/core";
 import { coerceBoolean as coerceBoolean19 } from "@eui/base";
 import * as i0164 from "@angular/core";
@@ -13293,7 +13288,7 @@ var EclSiteFooterTitleDirective = class _EclSiteFooterTitleDirective extends ECL
     this.ɵdir = i0164.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclSiteFooterTitleDirective, selector: "[eclSiteFooterTitle]", inputs: { isSeparator: "isSeparator" }, host: { properties: { "class.ecl-site-footer__title": "this.cmpClass", "class.ecl-site-footer__title--separator": "this.isSeparator" } }, usesInheritance: true, ngImport: i0164 });
   }
 };
-__decorate24([
+__decorate23([
   coerceBoolean19
 ], EclSiteFooterTitleDirective.prototype, "isSeparator", void 0);
 i0164.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0164, type: EclSiteFooterTitleDirective, decorators: [{
@@ -13358,7 +13353,7 @@ i0165.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-site-footer/ecl-footer-elements/ecl-site-footer-list.directive.mjs
-import { __decorate as __decorate25 } from "tslib";
+import { __decorate as __decorate24 } from "tslib";
 import { Directive as Directive45, HostBinding as HostBinding115, Input as Input76 } from "@angular/core";
 import { coerceBoolean as coerceBoolean20 } from "@eui/base";
 import * as i0166 from "@angular/core";
@@ -13374,10 +13369,10 @@ var EclSiteFooterListDirective = class _EclSiteFooterListDirective extends ECLBa
     this.ɵdir = i0166.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclSiteFooterListDirective, selector: "[eclSiteFooterList]", inputs: { isInline: "isInline", isColumns: "isColumns" }, 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: i0166 });
   }
 };
-__decorate25([
+__decorate24([
   coerceBoolean20
 ], EclSiteFooterListDirective.prototype, "isInline", void 0);
-__decorate25([
+__decorate24([
   coerceBoolean20
 ], EclSiteFooterListDirective.prototype, "isColumns", void 0);
 i0166.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0166, type: EclSiteFooterListDirective, decorators: [{
@@ -13661,7 +13656,7 @@ i0168.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-site-footer/ecl-footer-elements/ec/ecl-site-footer-fixed-content.mjs
-import { __decorate as __decorate26 } from "tslib";
+import { __decorate as __decorate25 } from "tslib";
 import { Component as Component77, Input as Input77 } from "@angular/core";
 import { coerceBoolean as coerceBoolean21 } from "@eui/base";
 import * as i0169 from "@angular/core";
@@ -14099,7 +14094,7 @@ var EclSiteFooterFixedContentECComponent = class _EclSiteFooterFixedContentECCom
 `, dependencies: [{ kind: "directive", type: i34.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i34.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["isInverted", "isHiddenLabel", "isNoVisited", "variant"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }, { kind: "directive", type: EclSiteFooterSectionDirective, selector: "[eclSiteFooterSection]", inputs: ["isCondensed", "isSiteInfo", "isSplitList", "hasSeparator"] }, { kind: "directive", type: EclSiteFooterTitleDirective, selector: "[eclSiteFooterTitle]", inputs: ["isSeparator"] }, { kind: "directive", type: EclSiteFooterListDirective, selector: "[eclSiteFooterList]", inputs: ["isInline", "isColumns"] }, { kind: "directive", type: EclSiteFooterLinkDirective, selector: "[eclSiteFooterLink]" }, { kind: "directive", type: EclSiteFooterColumnDirective, selector: "[eclSiteFooterColumn]" }, { kind: "directive", type: EclSiteFooterListItemDirective, selector: "[eclSiteFooterListItem]" }, { kind: "directive", type: EclSiteFooterRowDirective, selector: "[eclSiteFooterRow]" }, { kind: "directive", type: EclSiteFooterTitleLinkDirective, selector: "[eclSiteFooterTitleLink]" }, { kind: "directive", type: EclSiteFooterLogoLinkDirective, selector: "[eclSiteFooterLogoLink]" }, { kind: "directive", type: EclSiteFooterPictureDirective, selector: "picture[eclSiteFooterPicture]" }, { kind: "directive", type: EclSiteFooterLogoImageDirective, selector: "img[eclSiteFooterLogoImage]" }, { kind: "pipe", type: i131.TranslatePipe, name: "translate" }] });
   }
 };
-__decorate26([
+__decorate25([
   coerceBoolean21
 ], EclSiteFooterFixedContentECComponent.prototype, "isCore", void 0);
 i0169.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0169, type: EclSiteFooterFixedContentECComponent, decorators: [{
@@ -14534,7 +14529,7 @@ i0169.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-site-footer/ecl-footer-elements/eu/ecl-site-footer-fixed-content.mjs
-import { __decorate as __decorate27 } from "tslib";
+import { __decorate as __decorate26 } from "tslib";
 import { Component as Component78, Input as Input78 } from "@angular/core";
 import { coerceBoolean as coerceBoolean22 } from "@eui/base";
 import * as i0170 from "@angular/core";
@@ -15217,7 +15212,7 @@ var EclSiteFooterFixedContentEUComponent = class _EclSiteFooterFixedContentEUCom
 `, dependencies: [{ kind: "directive", type: i35.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i35.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["isInverted", "isHiddenLabel", "isNoVisited", "variant"] }, { kind: "directive", type: EclSiteFooterSectionDirective, selector: "[eclSiteFooterSection]", inputs: ["isCondensed", "isSiteInfo", "isSplitList", "hasSeparator"] }, { kind: "directive", type: EclSiteFooterTitleDirective, selector: "[eclSiteFooterTitle]", inputs: ["isSeparator"] }, { kind: "directive", type: EclSiteFooterListDirective, selector: "[eclSiteFooterList]", inputs: ["isInline", "isColumns"] }, { kind: "directive", type: EclSiteFooterLinkDirective, selector: "[eclSiteFooterLink]" }, { kind: "directive", type: EclSiteFooterColumnDirective, selector: "[eclSiteFooterColumn]" }, { kind: "directive", type: EclSiteFooterListItemDirective, selector: "[eclSiteFooterListItem]" }, { kind: "directive", type: EclSiteFooterRowDirective, selector: "[eclSiteFooterRow]" }, { kind: "directive", type: EclSiteFooterLogoLinkDirective, selector: "[eclSiteFooterLogoLink]" }, { kind: "directive", type: EclSiteFooterPictureDirective, selector: "picture[eclSiteFooterPicture]" }, { kind: "directive", type: EclSiteFooterLogoImageDirective, selector: "img[eclSiteFooterLogoImage]" }, { kind: "pipe", type: i132.TranslatePipe, name: "translate" }] });
   }
 };
-__decorate27([
+__decorate26([
   coerceBoolean22
 ], EclSiteFooterFixedContentEUComponent.prototype, "isCore", void 0);
 i0170.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0170, type: EclSiteFooterFixedContentEUComponent, decorators: [{
@@ -15888,7 +15883,7 @@ i0170.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-site-footer/ecl-site-footer.component.mjs
-import { __decorate as __decorate28 } from "tslib";
+import { __decorate as __decorate27 } from "tslib";
 import { Component as Component79, HostBinding as HostBinding118, Input as Input79 } from "@angular/core";
 import { coerceBoolean as coerceBoolean23 } from "@eui/base";
 import * as i0171 from "@angular/core";
@@ -15925,7 +15920,7 @@ var EclSiteFooterComponent = class _EclSiteFooterComponent extends ECLBaseDirect
     this.ɵcmp = i0171.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclSiteFooterComponent, selector: "ecl-site-footer", inputs: { isCore: "isCore" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, usesInheritance: true, ngImport: i0171, template: '<div class="ecl-container ecl-site-footer__container">\n    <ecl-site-footer-fixed-content-ec\n        *ngIf="eclThemeService.isEC$ | async"\n        [isCore]="isCore"\n        [languageCode]="languageCode"\n        [ecLogoLanguageCode]="getLanguageCode()"\n        [content]="content">\n    </ecl-site-footer-fixed-content-ec>\n\n    <ecl-site-footer-fixed-content-eu\n        *ngIf="eclThemeService.isEU$ | async"\n        [isCore]="isCore"\n        [languageCode]="languageCode"\n        [ecLogoLanguageCode]="getLanguageCode()"\n        [content]="content">\n    </ecl-site-footer-fixed-content-eu>\n\n    <ng-template #content>\n        <ng-content></ng-content>\n    </ng-template>\n</div>\n', dependencies: [{ kind: "directive", type: i36.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: i36.AsyncPipe, name: "async" }] });
   }
 };
-__decorate28([
+__decorate27([
   coerceBoolean23
 ], EclSiteFooterComponent.prototype, "isCore", void 0);
 i0171.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0171, type: EclSiteFooterComponent, decorators: [{
@@ -16243,7 +16238,7 @@ i0177.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-page-header/ecl-page-header.component.mjs
-import { __decorate as __decorate29 } from "tslib";
+import { __decorate as __decorate28 } from "tslib";
 import { Component as Component80, ContentChild as ContentChild22, HostBinding as HostBinding123, Input as Input80 } from "@angular/core";
 import { coerceBoolean as coerceBoolean24 } from "@eui/base";
 import * as i0178 from "@angular/core";
@@ -16275,7 +16270,7 @@ var EclPageHeaderComponent = class _EclPageHeaderComponent extends ECLBaseDirect
     this.ɵcmp = i0178.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclPageHeaderComponent, selector: "ecl-page-header", inputs: { backgroundImage: "backgroundImage", isNegative: "isNegative" }, host: { properties: { "class.ecl-page-header--negative": "this.isNegative", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclBreadcrumbComponent", first: true, predicate: EclBreadcrumbComponent, descendants: true }, { propertyName: "eclBackgroundPicture", first: true, predicate: EclPageHeaderBackgroundPictureDirective, descendants: true }], usesInheritance: true, ngImport: i0178, template: '<div *ngIf="hasBackgroundImage" class="ecl-page-header__background-container" aria-hidden="true">\n    <picture eclPageHeaderBackgroundPicture>\n        <img eclPageHeaderBackgroundImage [src]="backgroundImage" />\n    </picture>\n</div>\n\n<div *ngIf="hasPicture" class="ecl-page-header__background-container" aria-hidden="true">\n    <ng-content select="[eclPageHeaderBackgroundPicture]"></ng-content>\n</div>\n\n<div class="ecl-container">\n    <ng-container *ngTemplateOutlet="content"> </ng-container>\n</div>\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n', styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i134.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i134.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: EclPageHeaderBackgroundPictureDirective, selector: "[eclPageHeaderBackgroundPicture]" }, { kind: "directive", type: EclPageHeaderBackgroundImageDirective, selector: "[eclPageHeaderBackgroundImage]" }] });
   }
 };
-__decorate29([
+__decorate28([
   coerceBoolean24
 ], EclPageHeaderComponent.prototype, "isNegative", void 0);
 i0178.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0178, type: EclPageHeaderComponent, decorators: [{
@@ -16403,7 +16398,7 @@ i0180.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] });
 
 // lib/components/ecl-pagination/ecl-pagination-item.component.mjs
-import { __decorate as __decorate30 } from "tslib";
+import { __decorate as __decorate29 } from "tslib";
 import { Component as Component82, EventEmitter as EventEmitter37, HostBinding as HostBinding125, Input as Input81, Output as Output37, ViewEncapsulation as ViewEncapsulation11 } from "@angular/core";
 import { coerceBoolean as coerceBoolean25 } from "@eui/base";
 import * as i0181 from "@angular/core";
@@ -16494,13 +16489,13 @@ var EclPaginationItemComponent = class _EclPaginationItemComponent extends ECLBa
 }`, dependencies: [{ kind: "directive", type: i136.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i215.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", "isHiddenLabel", "isNoVisited", "variant"] }, { kind: "directive", type: EclLinkLabelDirective, selector: "[eclLinkLabel]" }, { kind: "pipe", type: i62.TranslatePipe, name: "translate" }], encapsulation: i0181.ViewEncapsulation.None });
   }
 };
-__decorate30([
+__decorate29([
   coerceBoolean25
 ], EclPaginationItemComponent.prototype, "isCurrent", void 0);
-__decorate30([
+__decorate29([
   coerceBoolean25
 ], EclPaginationItemComponent.prototype, "isNext", void 0);
-__decorate30([
+__decorate29([
   coerceBoolean25
 ], EclPaginationItemComponent.prototype, "isPrevious", void 0);
 i0181.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0181, type: EclPaginationItemComponent, decorators: [{
@@ -16567,7 +16562,7 @@ i0181.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-pagination/ecl-pagination.component.mjs
-import { __decorate as __decorate31 } from "tslib";
+import { __decorate as __decorate30 } from "tslib";
 import { Component as Component83, EventEmitter as EventEmitter38, HostBinding as HostBinding126, Input as Input82, Output as Output38 } from "@angular/core";
 import { DefaultConfig, EuiPagination } from "@eui/base";
 import { coerceNumber as coerceNumber4 } from "@eui/base";
@@ -16637,16 +16632,16 @@ var EclPaginationComponent = class _EclPaginationComponent extends ECLBaseDirect
     this.ɵcmp = i0182.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclPaginationComponent, selector: "ecl-pagination", inputs: { mode: "mode", totalItems: "totalItems", pageSize: "pageSize", currentPage: "currentPage", pageWindowSize: "pageWindowSize" }, outputs: { page: "page" }, host: { properties: { "class.ecl-pagination": "this.cmpClass", "attr.role": "this.role" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0182, template: '<ul class="ecl-pagination__list">\n    <ng-container *ngIf="isModeAuto()">\n        <ecl-pagination-item *ngIf="model.hasPreviousPage()" [isPrevious]="true" (pageClick)="onPreviousPage()"> </ecl-pagination-item>\n\n        <ecl-pagination-item\n            *ngFor="let page of model.getPages()"\n            [label]="page.toString()"\n            [isCurrent]="model.getCurrentPage() === page"\n            (pageClick)="onPage(page)">\n        </ecl-pagination-item>\n\n        <ecl-pagination-item *ngIf="model.hasNextPage()" [isNext]="true" (pageClick)="onNextPage()"> </ecl-pagination-item>\n    </ng-container>\n\n    <ng-container *ngIf="!isModeAuto()">\n        <ng-content></ng-content>\n    </ng-container>\n</ul>\n', styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i137.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i137.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EclPaginationItemComponent, selector: "ecl-pagination-item", inputs: ["label", "ariaLabel", "isCurrent", "isNext", "isPrevious", "routerLink", "queryParams", "queryParamsHandling", "href"], outputs: ["pageClick"] }] });
   }
 };
-__decorate31([
+__decorate30([
   coerceNumber4
 ], EclPaginationComponent.prototype, "totalItems", void 0);
-__decorate31([
+__decorate30([
   coerceNumber4
 ], EclPaginationComponent.prototype, "pageSize", void 0);
-__decorate31([
+__decorate30([
   coerceNumber4
 ], EclPaginationComponent.prototype, "currentPage", void 0);
-__decorate31([
+__decorate30([
   coerceNumber4
 ], EclPaginationComponent.prototype, "pageWindowSize", void 0);
 i0182.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0182, type: EclPaginationComponent, decorators: [{
@@ -17029,7 +17024,7 @@ i0187.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] });
 
 // lib/components/ecl-radio/ecl-radio-help.component.mjs
-import { __decorate as __decorate32 } from "tslib";
+import { __decorate as __decorate31 } from "tslib";
 import { Component as Component85, HostBinding as HostBinding130, Input as Input83 } from "@angular/core";
 import { coerceBoolean as coerceBoolean26 } from "@eui/base";
 import * as i0188 from "@angular/core";
@@ -17048,7 +17043,7 @@ var EclRadioHelpComponent = class _EclRadioHelpComponent extends ECLBaseDirectiv
     this.ɵcmp = i0188.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclRadioHelpComponent, selector: "[eclRadioHelp]", inputs: { isDisabled: "isDisabled" }, host: { properties: { "class.ecl-radio__help--disabled": "this.isDisabled", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0188, template: "<ng-content></ng-content>\n" });
   }
 };
-__decorate32([
+__decorate31([
   coerceBoolean26
 ], EclRadioHelpComponent.prototype, "isDisabled", void 0);
 i0188.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0188, type: EclRadioHelpComponent, decorators: [{
@@ -17065,7 +17060,7 @@ i0188.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-radio/ecl-radio-label.component.mjs
-import { __decorate as __decorate33 } from "tslib";
+import { __decorate as __decorate32 } from "tslib";
 import { Component as Component86, HostBinding as HostBinding131, Input as Input84, ViewEncapsulation as ViewEncapsulation13 } from "@angular/core";
 import { coerceBoolean as coerceBoolean27 } from "@eui/base";
 import * as i0189 from "@angular/core";
@@ -17085,10 +17080,10 @@ var EclRadioLabelComponent = class _EclRadioLabelComponent extends ECLBaseDirect
     this.ɵcmp = i0189.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclRadioLabelComponent, selector: "[eclRadioLabel]", inputs: { isInvalid: "isInvalid", isDisabled: "isDisabled" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0189, 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: i0189.ViewEncapsulation.None });
   }
 };
-__decorate33([
+__decorate32([
   coerceBoolean27
 ], EclRadioLabelComponent.prototype, "isInvalid", void 0);
-__decorate33([
+__decorate32([
   coerceBoolean27
 ], EclRadioLabelComponent.prototype, "isDisabled", void 0);
 i0189.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0189, type: EclRadioLabelComponent, decorators: [{
@@ -17104,7 +17099,7 @@ i0189.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-radio/ecl-radio.directive.mjs
-import { __decorate as __decorate34 } from "tslib";
+import { __decorate as __decorate33 } from "tslib";
 import { ContentChild as ContentChild25, Directive as Directive54, forwardRef as forwardRef48, HostBinding as HostBinding132, Input as Input85 } from "@angular/core";
 import { coerceBoolean as coerceBoolean28 } from "@eui/base";
 import * as i0190 from "@angular/core";
@@ -17136,13 +17131,13 @@ var EclRadioDirective = class _EclRadioDirective extends ECLBaseDirective {
     this.ɵdir = i0190.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", 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: i0190.forwardRef(() => EclRadioLabelComponent), descendants: true }, { propertyName: "eclRadioHelpComponent", first: true, predicate: i0190.forwardRef(() => EclRadioHelpComponent), descendants: true }], usesInheritance: true, ngImport: i0190 });
   }
 };
-__decorate34([
+__decorate33([
   coerceBoolean28
 ], EclRadioDirective.prototype, "isBinary", void 0);
-__decorate34([
+__decorate33([
   coerceBoolean28
 ], EclRadioDirective.prototype, "isDisabled", void 0);
-__decorate34([
+__decorate33([
   coerceBoolean28
 ], EclRadioDirective.prototype, "isInvalid", void 0);
 i0190.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0190, type: EclRadioDirective, decorators: [{
@@ -17244,7 +17239,7 @@ i0192.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] });
 
 // lib/components/ecl-rating-field/ecl-rating-field.component.mjs
-import { __decorate as __decorate35 } from "tslib";
+import { __decorate as __decorate34 } from "tslib";
 import { Component as Component87, EventEmitter as EventEmitter40, forwardRef as forwardRef51, HostBinding as HostBinding134, Input as Input86, Output as Output40 } from "@angular/core";
 import { NG_VALUE_ACCESSOR as NG_VALUE_ACCESSOR6 } from "@angular/forms";
 import { coerceBoolean as coerceBoolean29, coerceNumber as coerceNumber5 } from "@eui/base";
@@ -17306,13 +17301,13 @@ var EclRatingFieldComponent = class _EclRatingFieldComponent extends ECLBaseDire
     this.ɵcmp = i0193.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", 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: i0193, 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: i139.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"] }] });
   }
 };
-__decorate35([
+__decorate34([
   coerceNumber5
 ], EclRatingFieldComponent.prototype, "numberOfStars", void 0);
-__decorate35([
+__decorate34([
   coerceNumber5
 ], EclRatingFieldComponent.prototype, "rating", void 0);
-__decorate35([
+__decorate34([
   coerceBoolean29
 ], EclRatingFieldComponent.prototype, "disabled", void 0);
 i0193.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0193, type: EclRatingFieldComponent, decorators: [{
@@ -17397,7 +17392,7 @@ i0195.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-range/ecl-range.directive.mjs
-import { __decorate as __decorate36 } from "tslib";
+import { __decorate as __decorate35 } from "tslib";
 import { Directive as Directive56, EventEmitter as EventEmitter41, HostBinding as HostBinding136, HostListener as HostListener21, Input as Input88, Optional as Optional7, Output as Output41, Self as Self5 } from "@angular/core";
 import { coerceBoolean as coerceBoolean30 } from "@eui/base";
 import { distinctUntilChanged } from "rxjs";
@@ -17457,7 +17452,7 @@ var EclRangeDirective = class _EclRangeDirective extends ECLBaseDirective {
     this.ɵdir = i0196.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclRangeDirective, selector: "input[eclRange]", inputs: { eclSize: "eclSize", value: "value", hasValueLabel: "hasValueLabel" }, outputs: { rangeChange: "rangeChange" }, host: { listeners: { "input": "onInput($event)" }, properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0196 });
   }
 };
-__decorate36([
+__decorate35([
   coerceBoolean30
 ], EclRangeDirective.prototype, "hasValueLabel", void 0);
 i0196.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0196, type: EclRangeDirective, decorators: [{
@@ -17549,7 +17544,7 @@ i0198.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-select/ecl-select.directive.mjs
-import { __decorate as __decorate37 } from "tslib";
+import { __decorate as __decorate36 } from "tslib";
 import { Directive as Directive57, HostBinding as HostBinding138, Input as Input90, Optional as Optional8, Self as Self6 } from "@angular/core";
 import { coerceBoolean as coerceBoolean31 } from "@eui/base";
 import * as i0199 from "@angular/core";
@@ -17601,10 +17596,10 @@ var EclSelectDirective = class _EclSelectDirective extends ECLBaseDirective {
     this.ɵdir = i0199.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", 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: i0199 });
   }
 };
-__decorate37([
+__decorate36([
   coerceBoolean31
 ], EclSelectDirective.prototype, "disabled", void 0);
-__decorate37([
+__decorate36([
   coerceBoolean31
 ], EclSelectDirective.prototype, "isInvalid", void 0);
 i0199.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0199, type: EclSelectDirective, decorators: [{
@@ -17662,9 +17657,7 @@ i0200.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] });
 
 // lib/components/ecl-social-media-follow/ecl-social-media-follow.component.mjs
-import { __decorate as __decorate38 } from "tslib";
-import { Component as Component90, HostBinding as HostBinding139, Input as Input91 } from "@angular/core";
-import { coerceBoolean as coerceBoolean32 } from "@eui/base";
+import { Component as Component90, HostBinding as HostBinding139, Input as Input91, booleanAttribute as booleanAttribute19 } from "@angular/core";
 import * as i0201 from "@angular/core";
 import * as i143 from "@angular/common";
 var EclSocialMediaFollowComponent = class _EclSocialMediaFollowComponent extends ECLBaseDirective {
@@ -17679,19 +17672,17 @@ var EclSocialMediaFollowComponent = class _EclSocialMediaFollowComponent extends
     this.ɵfac = i0201.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0201, type: _EclSocialMediaFollowComponent, deps: null, target: i0201.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0201.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclSocialMediaFollowComponent, selector: "ecl-social-media-follow", inputs: { description: "description", isVertical: "isVertical" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0201, 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: i143.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    this.ɵcmp = i0201.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.3", type: _EclSocialMediaFollowComponent, selector: "ecl-social-media-follow", inputs: { description: "description", isVertical: ["isVertical", "isVertical", booleanAttribute19] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0201, 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: i143.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
   }
 };
-__decorate38([
-  coerceBoolean32
-], EclSocialMediaFollowComponent.prototype, "isVertical", void 0);
 i0201.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0201, type: EclSocialMediaFollowComponent, decorators: [{
   type: Component90,
   args: [{ selector: "ecl-social-media-follow", 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"] }]
 }], propDecorators: { description: [{
   type: Input91
 }], isVertical: [{
-  type: Input91
+  type: Input91,
+  args: [{ transform: booleanAttribute19 }]
 }], cssClasses: [{
   type: HostBinding139,
   args: ["class"]
@@ -17701,6 +17692,7 @@ i0201.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 import { Component as Component91, EventEmitter as EventEmitter42, HostBinding as HostBinding140, Input as Input92, Output as Output42 } from "@angular/core";
 import * as i0202 from "@angular/core";
 import * as i144 from "@angular/common";
+import * as i216 from "@angular/router";
 var EclSocialMediaFollowItemClickEvent = class extends EclBaseEvent {
 };
 var EclSocialMediaFollowItemComponent = class _EclSocialMediaFollowItemComponent extends ECLBaseDirective {
@@ -17709,7 +17701,8 @@ var EclSocialMediaFollowItemComponent = class _EclSocialMediaFollowItemComponent
     this.role = "listitem";
     this.iconSet = "social-media";
     this.href = "";
-    this.size = "m";
+    this.routerLink = "";
+    this.size = "xs";
     this.itemClick = new EventEmitter42();
   }
   get cssClasses() {
@@ -17717,7 +17710,7 @@ var EclSocialMediaFollowItemComponent = class _EclSocialMediaFollowItemComponent
   }
   onItemClick(evt) {
     this.itemClick.next(new EclSocialMediaFollowItemClickEvent());
-    if (!this.href) {
+    if (!this.href && !this.routerLink) {
       evt.preventDefault();
     }
   }
@@ -17725,12 +17718,12 @@ var EclSocialMediaFollowItemComponent = class _EclSocialMediaFollowItemComponent
     this.ɵfac = i0202.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0202, type: _EclSocialMediaFollowItemComponent, deps: null, target: i0202.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0202.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclSocialMediaFollowItemComponent, selector: "ecl-social-media-follow-item", inputs: { icon: "icon", iconSet: "iconSet", href: "href", target: "target", size: "size" }, outputs: { itemClick: "itemClick" }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0202, 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-follow__link">\n    <ecl-icon *ngIf="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<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: i144.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i144.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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", "isHiddenLabel", "isNoVisited", "variant"] }, { kind: "directive", type: EclLinkLabelDirective, selector: "[eclLinkLabel]" }] });
+    this.ɵcmp = i0202.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.3", 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: i0202, 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: i144.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", "isHiddenLabel", "isNoVisited", "variant"] }, { kind: "directive", type: EclLinkLabelDirective, selector: "[eclLinkLabel]" }] });
   }
 };
 i0202.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0202, type: EclSocialMediaFollowItemComponent, decorators: [{
   type: Component91,
-  args: [{ selector: "ecl-social-media-follow-item", 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-follow__link">\n    <ecl-icon *ngIf="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<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' }]
+  args: [{ selector: "ecl-social-media-follow-item", 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>' }]
 }], propDecorators: { role: [{
   type: HostBinding140,
   args: ["attr.role"]
@@ -17740,6 +17733,8 @@ i0202.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
   type: Input92
 }], href: [{
   type: Input92
+}], routerLink: [{
+  type: Input92
 }], target: [{
   type: Input92
 }], size: [{
@@ -17786,6 +17781,7 @@ i0203.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 // lib/components/ecl-social-media-follow/ecl-social-media-follow.module.mjs
 import { NgModule as NgModule51 } from "@angular/core";
 import { CommonModule as CommonModule51 } from "@angular/common";
+import { RouterModule as RouterModule7 } from "@angular/router";
 import * as i0204 from "@angular/core";
 var COMPONENTS24 = [EclSocialMediaFollowComponent, EclSocialMediaFollowItemComponent, EclSocialMediaFollowLinkDirective];
 var EclSocialMediaFollowComponentModule = class _EclSocialMediaFollowComponentModule {
@@ -17793,25 +17789,25 @@ var EclSocialMediaFollowComponentModule = class _EclSocialMediaFollowComponentMo
     this.ɵfac = i0204.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0204, type: _EclSocialMediaFollowComponentModule, deps: [], target: i0204.ɵɵFactoryTarget.NgModule });
   }
   static {
-    this.ɵmod = i0204.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.3", ngImport: i0204, type: _EclSocialMediaFollowComponentModule, declarations: [EclSocialMediaFollowComponent, EclSocialMediaFollowItemComponent, EclSocialMediaFollowLinkDirective], imports: [CommonModule51, EclIconComponentModule, EclLinkDirectiveModule], exports: [EclSocialMediaFollowComponent, EclSocialMediaFollowItemComponent, EclSocialMediaFollowLinkDirective] });
+    this.ɵmod = i0204.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.3", ngImport: i0204, type: _EclSocialMediaFollowComponentModule, declarations: [EclSocialMediaFollowComponent, EclSocialMediaFollowItemComponent, EclSocialMediaFollowLinkDirective], imports: [CommonModule51, RouterModule7, EclIconComponentModule, EclLinkDirectiveModule], exports: [EclSocialMediaFollowComponent, EclSocialMediaFollowItemComponent, EclSocialMediaFollowLinkDirective] });
   }
   static {
-    this.ɵinj = i0204.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0204, type: _EclSocialMediaFollowComponentModule, imports: [CommonModule51, EclIconComponentModule, EclLinkDirectiveModule] });
+    this.ɵinj = i0204.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0204, type: _EclSocialMediaFollowComponentModule, imports: [CommonModule51, RouterModule7, EclIconComponentModule, EclLinkDirectiveModule] });
   }
 };
 i0204.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0204, type: EclSocialMediaFollowComponentModule, decorators: [{
   type: NgModule51,
   args: [{
-    imports: [CommonModule51, EclIconComponentModule, EclLinkDirectiveModule],
+    imports: [CommonModule51, RouterModule7, EclIconComponentModule, EclLinkDirectiveModule],
     exports: [...COMPONENTS24],
     declarations: [...COMPONENTS24]
   }]
 }] });
 
 // lib/components/ecl-social-media-share/ecl-social-media-share.component.mjs
-import { __decorate as __decorate39 } from "tslib";
+import { __decorate as __decorate37 } from "tslib";
 import { Component as Component92, HostBinding as HostBinding142, Input as Input93 } from "@angular/core";
-import { coerceBoolean as coerceBoolean33 } from "@eui/base";
+import { coerceBoolean as coerceBoolean32 } from "@eui/base";
 import * as i0205 from "@angular/core";
 var EclSocialMediaShareComponent = class _EclSocialMediaShareComponent extends ECLBaseDirective {
   constructor() {
@@ -17828,8 +17824,8 @@ var EclSocialMediaShareComponent = class _EclSocialMediaShareComponent extends E
     this.ɵcmp = i0205.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclSocialMediaShareComponent, selector: "ecl-social-media-share", inputs: { description: "description", isVertical: "isVertical" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0205, 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"] });
   }
 };
-__decorate39([
-  coerceBoolean33
+__decorate37([
+  coerceBoolean32
 ], EclSocialMediaShareComponent.prototype, "isVertical", void 0);
 i0205.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0205, type: EclSocialMediaShareComponent, decorators: [{
   type: Component92,
@@ -17955,7 +17951,7 @@ i0208.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] });
 
 // lib/components/ecl-loading-indicator/ecl-loading-indicator.component.mjs
-import { Component as Component94, HostBinding as HostBinding145, Input as Input95, booleanAttribute as booleanAttribute19 } from "@angular/core";
+import { Component as Component94, HostBinding as HostBinding145, Input as Input95, booleanAttribute as booleanAttribute20 } from "@angular/core";
 import * as i0209 from "@angular/core";
 var EclLoadingIndicatorComponent = class _EclLoadingIndicatorComponent extends ECLBaseDirective {
   constructor() {
@@ -17978,7 +17974,7 @@ var EclLoadingIndicatorComponent = class _EclLoadingIndicatorComponent extends E
     this.ɵfac = i0209.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0209, type: _EclLoadingIndicatorComponent, deps: null, target: i0209.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0209.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.3", type: _EclLoadingIndicatorComponent, selector: "ecl-loading-indicator", inputs: { size: "size", variant: "variant", isCentered: ["isCentered", "isCentered", booleanAttribute19], isVisible: ["isVisible", "isVisible", booleanAttribute19] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0209, 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 = i0209.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.3", type: _EclLoadingIndicatorComponent, selector: "ecl-loading-indicator", inputs: { size: "size", variant: "variant", isCentered: ["isCentered", "isCentered", booleanAttribute20], isVisible: ["isVisible", "isVisible", booleanAttribute20] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0209, 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' });
   }
 };
 i0209.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0209, type: EclLoadingIndicatorComponent, decorators: [{
@@ -17993,10 +17989,10 @@ i0209.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
   type: Input95
 }], isCentered: [{
   type: Input95,
-  args: [{ transform: booleanAttribute19 }]
+  args: [{ transform: booleanAttribute20 }]
 }], isVisible: [{
   type: Input95,
-  args: [{ transform: booleanAttribute19 }]
+  args: [{ transform: booleanAttribute20 }]
 }] } });
 
 // lib/components/ecl-loading-indicator/ecl-loading-indicator-label.directive.mjs
@@ -18073,14 +18069,14 @@ i0212.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] });
 
 // lib/components/ecl-table/ecl-table-sort-button.component.mjs
-import { Component as Component95, HostBinding as HostBinding148, Input as Input96 } from "@angular/core";
+import { Component as Component95, HostBinding as HostBinding148 } from "@angular/core";
 import * as i0213 from "@angular/core";
 import * as i37 from "@angular/common";
 var EclTableSortButtonComponent = class _EclTableSortButtonComponent extends ECLBaseDirective {
   constructor(eclThemeService) {
     super();
     this.eclThemeService = eclThemeService;
-    this.eclSize = "m";
+    this.ariaLabel = "Sort table";
   }
   get cssClasses() {
     return [super.getCssClasses("ecl-table__arrow")].join(" ").trim();
@@ -18089,29 +18085,28 @@ var EclTableSortButtonComponent = class _EclTableSortButtonComponent extends ECL
     this.ɵfac = i0213.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0213, type: _EclTableSortButtonComponent, deps: [{ token: EclThemeService }], target: i0213.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i0213.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclTableSortButtonComponent, selector: "button[eclTableSortButton]", inputs: { eclSize: "eclSize" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0213, template: `<ecl-icon icon="solid-arrow" class="ecl-table__icon ecl-table__icon-up" [size]="(eclThemeService.isEC$ | async) ? 'l' : 'm'"> </ecl-icon>
-<ecl-icon icon="solid-arrow" class="ecl-table__icon ecl-table__icon-down" [size]="(eclThemeService.isEC$ | async) ? 'l' : 'm'"> </ecl-icon>
+    this.ɵcmp = i0213.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclTableSortButtonComponent, selector: "button[eclTableSortButton]", host: { properties: { "attr.aria-label": "this.ariaLabel", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0213, template: `<ecl-icon icon="solid-arrow" class="ecl-table__icon ecl-table__icon-up" [size]="(eclThemeService.isEC$ | async) ? 'xs' : 'm'"> </ecl-icon>
+<ecl-icon icon="solid-arrow" class="ecl-table__icon ecl-table__icon-down" [size]="(eclThemeService.isEC$ | async) ? 'xs' : 'm'"> </ecl-icon>
 `, dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "ariaHidden", "focusable"] }, { kind: "pipe", type: i37.AsyncPipe, name: "async" }] });
   }
 };
 i0213.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0213, type: EclTableSortButtonComponent, decorators: [{
   type: Component95,
-  args: [{ selector: "button[eclTableSortButton]", template: `<ecl-icon icon="solid-arrow" class="ecl-table__icon ecl-table__icon-up" [size]="(eclThemeService.isEC$ | async) ? 'l' : 'm'"> </ecl-icon>
-<ecl-icon icon="solid-arrow" class="ecl-table__icon ecl-table__icon-down" [size]="(eclThemeService.isEC$ | async) ? 'l' : 'm'"> </ecl-icon>
+  args: [{ selector: "button[eclTableSortButton]", template: `<ecl-icon icon="solid-arrow" class="ecl-table__icon ecl-table__icon-up" [size]="(eclThemeService.isEC$ | async) ? 'xs' : 'm'"> </ecl-icon>
+<ecl-icon icon="solid-arrow" class="ecl-table__icon ecl-table__icon-down" [size]="(eclThemeService.isEC$ | async) ? 'xs' : 'm'"> </ecl-icon>
 ` }]
-}], ctorParameters: () => [{ type: EclThemeService }], propDecorators: { eclSize: [{
-  type: Input96
+}], ctorParameters: () => [{ type: EclThemeService }], propDecorators: { ariaLabel: [{
+  type: HostBinding148,
+  args: ["attr.aria-label"]
 }], cssClasses: [{
   type: HostBinding148,
   args: ["class"]
 }] } });
 
 // lib/components/ecl-table/ecl-table.directive.mjs
-import { __decorate as __decorate40 } from "tslib";
-import { ContentChildren as ContentChildren25, Directive as Directive62, EventEmitter as EventEmitter44, forwardRef as forwardRef52, HostBinding as HostBinding149, HostListener as HostListener22, Input as Input97, Output as Output44 } from "@angular/core";
+import { ContentChildren as ContentChildren25, Directive as Directive62, EventEmitter as EventEmitter44, forwardRef as forwardRef52, HostBinding as HostBinding149, HostListener as HostListener22, Input as Input96, Output as Output44, booleanAttribute as booleanAttribute21 } from "@angular/core";
 import { Subject as Subject27 } from "rxjs";
 import { takeUntil as takeUntil24 } from "rxjs/operators";
-import { coerceBoolean as coerceBoolean34 } from "@eui/base";
 import * as i0214 from "@angular/core";
 var SortOrder;
 (function(SortOrder2) {
@@ -18155,19 +18150,17 @@ var EclTableDirective = class _EclTableDirective extends ECLBaseDirective {
     this.ɵfac = i0214.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0214, type: _EclTableDirective, deps: [{ token: i0214.IterableDiffers }], target: i0214.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0214.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclTableDirective, selector: "[eclTable]", inputs: { isZebra: "isZebra" }, outputs: { sort: "sort" }, host: { properties: { "class.ecl-table--zebra": "this.isZebra", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclTableHeaders", predicate: i0214.forwardRef(() => EclTableHeaderDirective), descendants: true }], usesInheritance: true, ngImport: i0214 });
+    this.ɵdir = i0214.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.0-next.3", type: _EclTableDirective, selector: "[eclTable]", inputs: { isZebra: ["isZebra", "isZebra", booleanAttribute21] }, outputs: { sort: "sort" }, host: { properties: { "class.ecl-table--zebra": "this.isZebra", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclTableHeaders", predicate: i0214.forwardRef(() => EclTableHeaderDirective), descendants: true }], usesInheritance: true, ngImport: i0214 });
   }
 };
-__decorate40([
-  coerceBoolean34
-], EclTableDirective.prototype, "isZebra", void 0);
 i0214.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0214, type: EclTableDirective, decorators: [{
   type: Directive62,
   args: [{
     selector: "[eclTable]"
   }]
 }], ctorParameters: () => [{ type: i0214.IterableDiffers }], propDecorators: { isZebra: [{
-  type: Input97
+  type: Input96,
+  args: [{ transform: booleanAttribute21 }]
 }, {
   type: HostBinding149,
   args: ["class.ecl-table--zebra"]
@@ -18229,10 +18222,11 @@ var EclTableHeaderDirective = class _EclTableHeaderDirective extends ECLBaseDire
   get cssClasses() {
     return [super.getCssClasses("ecl-table__header")].join(" ").trim();
   }
-  constructor(el, viewContainerRef) {
+  constructor(el, viewContainerRef, renderer) {
     super();
     this.el = el;
     this.viewContainerRef = viewContainerRef;
+    this.renderer = renderer;
     this.sortOrder = null;
     this.eclSortable = null;
     this.sort = new EventEmitter44();
@@ -18268,15 +18262,18 @@ var EclTableHeaderDirective = class _EclTableHeaderDirective extends ECLBaseDire
     if (this.eclSortable) {
       setTimeout(() => {
         const containerComponentRef = this.viewContainerRef.createComponent(EclTableSortButtonComponent);
-        this.el.nativeElement.appendChild(containerComponentRef.location.nativeElement);
+        this.renderer.appendChild(this.el.nativeElement, containerComponentRef.location.nativeElement);
+        if (this.sortButtonAriaLabel) {
+          containerComponentRef.instance.ariaLabel = this.sortButtonAriaLabel;
+        }
       });
     }
   }
   static {
-    this.ɵfac = i0214.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0214, type: _EclTableHeaderDirective, deps: [{ token: i0214.ElementRef }, { token: i0214.ViewContainerRef }], target: i0214.ɵɵFactoryTarget.Directive });
+    this.ɵfac = i0214.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0214, type: _EclTableHeaderDirective, deps: [{ token: i0214.ElementRef }, { token: i0214.ViewContainerRef }, { token: i0214.Renderer2 }], target: i0214.ɵɵFactoryTarget.Directive });
   }
   static {
-    this.ɵdir = i0214.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclTableHeaderDirective, selector: "[eclTableHeader]", inputs: { eclSortable: "eclSortable" }, outputs: { sort: "sort" }, host: { listeners: { "click": "onClick($event)" }, properties: { "attr.aria-sort": "this.sortOrder", "attr.data-ecl-table-sort-toggle": "this.eclSortable", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0214 });
+    this.ɵdir = i0214.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclTableHeaderDirective, selector: "[eclTableHeader]", inputs: { eclSortable: "eclSortable", sortButtonAriaLabel: "sortButtonAriaLabel" }, outputs: { sort: "sort" }, host: { listeners: { "click": "onClick($event)" }, properties: { "attr.aria-sort": "this.sortOrder", "attr.data-ecl-table-sort-toggle": "this.eclSortable", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0214 });
   }
 };
 i0214.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0214, type: EclTableHeaderDirective, decorators: [{
@@ -18284,14 +18281,16 @@ i0214.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
   args: [{
     selector: "[eclTableHeader]"
   }]
-}], ctorParameters: () => [{ type: i0214.ElementRef }, { type: i0214.ViewContainerRef }], propDecorators: { sortOrder: [{
+}], ctorParameters: () => [{ type: i0214.ElementRef }, { type: i0214.ViewContainerRef }, { type: i0214.Renderer2 }], propDecorators: { sortOrder: [{
   type: HostBinding149,
   args: ["attr.aria-sort"]
 }], eclSortable: [{
-  type: Input97
+  type: Input96
 }, {
   type: HostBinding149,
   args: ["attr.data-ecl-table-sort-toggle"]
+}], sortButtonAriaLabel: [{
+  type: Input96
 }], cssClasses: [{
   type: HostBinding149,
   args: ["class"]
@@ -18362,12 +18361,12 @@ i0214.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
     selector: "[eclTableCell]"
   }]
 }], propDecorators: { eclTableCellHeader: [{
-  type: Input97
+  type: Input96
 }, {
   type: HostBinding149,
   args: ["attr.data-ecl-table-header"]
 }], isGroup: [{
-  type: Input97
+  type: Input96
 }, {
   type: HostBinding149,
   args: ["class.ecl-table__cell--group"]
@@ -18392,7 +18391,7 @@ i0214.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
     selector: "[eclTableCellGroup]"
   }]
 }], propDecorators: { eclTableCellGroup: [{
-  type: Input97
+  type: Input96
 }, {
   type: HostBinding149,
   args: ["attr.data-ecl-table-header-group"]
@@ -18497,9 +18496,9 @@ i0216.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }], ctorParameters: () => [{ type: i0216.ElementRef }] });
 
 // lib/components/ecl-tabs/ecl-tab.component.mjs
-import { __decorate as __decorate41 } from "tslib";
-import { Component as Component97, ContentChild as ContentChild28, EventEmitter as EventEmitter45, HostBinding as HostBinding150, Input as Input98, Output as Output45, ViewChild as ViewChild16 } from "@angular/core";
-import { coerceBoolean as coerceBoolean35 } from "@eui/base";
+import { __decorate as __decorate38 } from "tslib";
+import { Component as Component97, ContentChild as ContentChild28, EventEmitter as EventEmitter45, HostBinding as HostBinding150, Input as Input97, Output as Output45, ViewChild as ViewChild16 } from "@angular/core";
+import { coerceBoolean as coerceBoolean33 } from "@eui/base";
 import * as i0217 from "@angular/core";
 var EclTabSelectEvent = class extends EclBaseEvent {
   constructor(tab) {
@@ -18557,24 +18556,24 @@ var EclTabComponent = class _EclTabComponent extends ECLBaseDirective {
     this.ɵcmp = i0217.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclTabComponent, selector: "ecl-tab, li[eclTab]", inputs: { id: "id", isHidden: "isHidden", isActive: "isActive" }, outputs: { selectTab: "selectTab", keydownTab: "keydownTab" }, host: { properties: { "attr.aria-hidden": "this.isHidden", "attr.role": "this.role", "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: i0217, 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", "isHiddenLabel", "isNoVisited", "variant"] }] });
   }
 };
-__decorate41([
-  coerceBoolean35
+__decorate38([
+  coerceBoolean33
 ], EclTabComponent.prototype, "isHidden", void 0);
-__decorate41([
-  coerceBoolean35
+__decorate38([
+  coerceBoolean33
 ], EclTabComponent.prototype, "isActive", void 0);
 i0217.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0217, type: EclTabComponent, decorators: [{
   type: Component97,
   args: [{ selector: "ecl-tab, li[eclTab]", 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' }]
 }], ctorParameters: () => [{ type: i0217.ElementRef }], propDecorators: { id: [{
-  type: Input98
+  type: Input97
 }], isHidden: [{
-  type: Input98
+  type: Input97
 }, {
   type: HostBinding150,
   args: ["attr.aria-hidden"]
 }], isActive: [{
-  type: Input98
+  type: Input97
 }], selectTab: [{
   type: Output45
 }], keydownTab: [{
@@ -18597,9 +18596,9 @@ i0217.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-tabs/ecl-tab-more.component.mjs
-import { __decorate as __decorate42 } from "tslib";
-import { Component as Component98, HostBinding as HostBinding151, Input as Input99 } from "@angular/core";
-import { coerceBoolean as coerceBoolean36 } from "@eui/base";
+import { __decorate as __decorate39 } from "tslib";
+import { Component as Component98, HostBinding as HostBinding151, Input as Input98 } from "@angular/core";
+import { coerceBoolean as coerceBoolean34 } from "@eui/base";
 import * as i0218 from "@angular/core";
 var EclTabMoreComponent = class _EclTabMoreComponent extends ECLBaseDirective {
   constructor() {
@@ -18617,14 +18616,14 @@ var EclTabMoreComponent = class _EclTabMoreComponent extends ECLBaseDirective {
     this.ɵcmp = i0218.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: _EclTabMoreComponent, selector: "ecl-tab-more", inputs: { isHidden: "isHidden" }, host: { properties: { "attr.aria-hidden": "this.isHidden", "attr.role": "this.role", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0218, template: "<ng-content></ng-content>\n", styles: [":host{display:list-item}\n"] });
   }
 };
-__decorate42([
-  coerceBoolean36
+__decorate39([
+  coerceBoolean34
 ], EclTabMoreComponent.prototype, "isHidden", void 0);
 i0218.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0218, type: EclTabMoreComponent, decorators: [{
   type: Component98,
   args: [{ selector: "ecl-tab-more", template: "<ng-content></ng-content>\n", styles: [":host{display:list-item}\n"] }]
 }], propDecorators: { isHidden: [{
-  type: Input99
+  type: Input98
 }, {
   type: HostBinding151,
   args: ["attr.aria-hidden"]
@@ -18637,7 +18636,7 @@ i0218.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-tabs/ecl-tabs.component.mjs
-import { Component as Component99, ContentChildren as ContentChildren26, EventEmitter as EventEmitter46, forwardRef as forwardRef54, HostListener as HostListener23, Input as Input100, Output as Output46, ViewChild as ViewChild17, ViewEncapsulation as ViewEncapsulation15 } from "@angular/core";
+import { Component as Component99, ContentChildren as ContentChildren26, EventEmitter as EventEmitter46, forwardRef as forwardRef54, HostListener as HostListener23, Input as Input99, Output as Output46, ViewChild as ViewChild17, ViewEncapsulation as ViewEncapsulation15 } from "@angular/core";
 import { of as of4, Subject as Subject28 } from "rxjs";
 import { mergeWith as mergeWith3, takeUntil as takeUntil25 } from "rxjs/operators";
 import * as i0219 from "@angular/core";
@@ -19224,9 +19223,9 @@ i0219.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 </ng-container>
 ` }]
 }], ctorParameters: () => [{ type: i0219.IterableDiffers }, { type: i146.BreakpointObserver }, { type: i0219.ChangeDetectorRef }, { type: i0219.ElementRef }, { type: EclRtlService }], propDecorators: { bodyClass: [{
-  type: Input100
+  type: Input99
 }], direction: [{
-  type: Input100
+  type: Input99
 }], tabSelect: [{
   type: Output46
 }], tabs: [{
@@ -19302,7 +19301,7 @@ i0220.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] });
 
 // lib/components/ecl-tag/ecl-tag.component.mjs
-import { Component as Component100, Input as Input101, HostBinding as HostBinding152, Output as Output47, EventEmitter as EventEmitter47 } from "@angular/core";
+import { Component as Component100, Input as Input100, HostBinding as HostBinding152, Output as Output47, EventEmitter as EventEmitter47 } from "@angular/core";
 import * as i0221 from "@angular/core";
 import * as i147 from "@angular/common";
 var EclTagRemoveEvent = class extends EclBaseEvent {
@@ -19340,7 +19339,7 @@ i0221.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
   type: Component100,
   args: [{ selector: "ecl-tag, [eclTag]", template: '<ng-content></ng-content>\n\n<span *ngIf="isRemovable" class="ecl-tag__icon" (click)="onRemoveClick($event)">\n    <ecl-icon icon="close" class="ecl-tag__icon-close"></ecl-icon>\n    <ecl-icon icon="close-filled" class="ecl-tag__icon-close-filled"></ecl-icon>\n</span>\n' }]
 }], propDecorators: { variant: [{
-  type: Input101
+  type: Input100
 }], remove: [{
   type: Output47
 }], isHidden: [{
@@ -19376,9 +19375,9 @@ i0222.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] });
 
 // lib/components/ecl-text-area/ecl-text-area.directive.mjs
-import { __decorate as __decorate43 } from "tslib";
-import { Directive as Directive63, HostBinding as HostBinding153, Input as Input102, Optional as Optional9, Self as Self7 } from "@angular/core";
-import { coerceBoolean as coerceBoolean37 } from "@eui/base";
+import { __decorate as __decorate40 } from "tslib";
+import { Directive as Directive63, HostBinding as HostBinding153, Input as Input101, Optional as Optional9, Self as Self7 } from "@angular/core";
+import { coerceBoolean as coerceBoolean35 } from "@eui/base";
 import * as i0223 from "@angular/core";
 import * as i148 from "@angular/forms";
 var EclTextAreaDirective = class _EclTextAreaDirective extends ECLBaseDirective {
@@ -19405,8 +19404,8 @@ var EclTextAreaDirective = class _EclTextAreaDirective extends ECLBaseDirective
     this.ɵdir = i0223.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", 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: i0223 });
   }
 };
-__decorate43([
-  coerceBoolean37
+__decorate40([
+  coerceBoolean35
 ], EclTextAreaDirective.prototype, "isInvalid", void 0);
 i0223.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0223, type: EclTextAreaDirective, decorators: [{
   type: Directive63,
@@ -19418,9 +19417,9 @@ i0223.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }, {
   type: Self7
 }] }], propDecorators: { eclSize: [{
-  type: Input102
+  type: Input101
 }], isInvalid: [{
-  type: Input102
+  type: Input101
 }], cssClasses: [{
   type: HostBinding153,
   args: ["class"]
@@ -19530,9 +19529,9 @@ i0227.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
 }] } });
 
 // lib/components/ecl-timeline/ecl-timeline-item.component.mjs
-import { __decorate as __decorate44 } from "tslib";
-import { Component as Component102, Input as Input103, HostBinding as HostBinding156, ViewEncapsulation as ViewEncapsulation17, Output as Output49, EventEmitter as EventEmitter49, ContentChild as ContentChild29, forwardRef as forwardRef56 } from "@angular/core";
-import { coerceBoolean as coerceBoolean38 } from "@eui/base";
+import { __decorate as __decorate41 } from "tslib";
+import { Component as Component102, Input as Input102, HostBinding as HostBinding156, ViewEncapsulation as ViewEncapsulation17, Output as Output49, EventEmitter as EventEmitter49, ContentChild as ContentChild29, forwardRef as forwardRef56 } from "@angular/core";
+import { coerceBoolean as coerceBoolean36 } from "@eui/base";
 import { Subject as Subject29 } from "rxjs";
 import { takeUntil as takeUntil26 } from "rxjs/operators";
 import * as i0228 from "@angular/core";
@@ -19632,8 +19631,8 @@ var EclTimelineItemComponent = class _EclTimelineItemComponent extends ECLBaseDi
 </ng-template>`, styles: ["ecl-timeline-item{display:list-item}\n"], dependencies: [{ kind: "directive", type: i149.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i149.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: i56.TranslatePipe, name: "translate" }], encapsulation: i0228.ViewEncapsulation.None });
   }
 };
-__decorate44([
-  coerceBoolean38
+__decorate41([
+  coerceBoolean36
 ], EclTimelineItemComponent.prototype, "isTogglerExpanded", void 0);
 i0228.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0228, type: EclTimelineItemComponent, decorators: [{
   type: Component102,
@@ -19673,17 +19672,17 @@ i0228.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
     <ng-content></ng-content>
 </ng-template>`, styles: ["ecl-timeline-item{display:list-item}\n"] }]
 }], propDecorators: { label: [{
-  type: Input103
+  type: Input102
 }], eclTitle: [{
-  type: Input103
+  type: Input102
 }], toggleButtonLabel: [{
-  type: Input103
+  type: Input102
 }], expandLabel: [{
-  type: Input103
+  type: Input102
 }], collapseLabel: [{
-  type: Input103
+  type: Input102
 }], isTogglerExpanded: [{
-  type: Input103
+  type: Input102
 }], cssClasses: [{
   type: HostBinding156,
   args: ["class"]
@@ -19691,17 +19690,17 @@ i0228.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3
   type: ContentChild29,
   args: [forwardRef56(() => EclTimelineItemTogglerComponent)]
 }], isCollapsed: [{
-  type: Input103
+  type: Input102
 }, {
   type: HostBinding156,
   args: ["class.ecl-timeline__item--collapsed"]
 }], isToggler: [{
-  type: Input103
+  type: Input102
 }, {
   type: HostBinding156,
   args: ["class.ecl-timeline__item--toggle"]
 }], toggleGroup: [{
-  type: Input103
+  type: Input102
 }], toggle: [{
   type: Output49
 }] } });