@eui/ecl 15.0.0-rc.2 → 15.0.0-rc.4

package/fesm2015/eui-ecl.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Directive, Input, HostBinding, Component, ViewChild, EventEmitter, ChangeDetectionStrategy, Output, NgModule, ContentChildren, forwardRef, HostListener, Injectable, Optional, Inject, Self, ContentChild, ViewEncapsulation, ElementRef } from '@angular/core';
+import { Directive, Input, HostBinding, Component, ViewChild, EventEmitter, ChangeDetectionStrategy, Output, NgModule, ContentChildren, forwardRef, HostListener, Injectable, Optional, Inject, Self, ContentChild, ViewEncapsulation, ElementRef, ViewChildren } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule, formatDate } from '@angular/common';
 import * as i2 from '@ngx-translate/core';
@@ -937,7 +937,7 @@ class EclLanguageListComponent extends ECLBaseDirective {
     }
 }
 /** @nocollapse */ EclLanguageListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclLanguageListComponent, deps: [{ token: EclLanguageService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ EclLanguageListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclLanguageListComponent, selector: "ecl-language-list", inputs: { isOverlay: "isOverlay", selectedLanguageCode: "selectedLanguageCode", isHidden: "isHidden" }, outputs: { languageSelected: "languageSelected", close: "close" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" }, properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "eclLanguageListItems", predicate: EclLanguageListItemComponent }], viewQueries: [{ propertyName: "euLeftContainer", first: true, predicate: ["euLeftContainer"], descendants: true }, { propertyName: "euRightContainer", first: true, predicate: ["euRightContainer"], descendants: true }, { propertyName: "nonEuLeftContainer", first: true, predicate: ["nonEuLeftContainer"], descendants: true }, { propertyName: "nonEuRightContainer", first: true, predicate: ["nonEuRightContainer"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<header *ngIf=\"isSplash\" class=\"ecl-language-list__header\">\n    <img class=\"ecl-language-list__logo\" src=\"./assets/images/ecl/ec/logo/logo-ec--mute.svg\" alt=\"European Commission logo\" />\n</header>\n<div class=\"ecl-language-list__container ecl-container\">\n    <div *ngIf=\"isOverlay\" class=\"ecl-row\">\n        <div class=\"ecl-language-list__close ecl-col-12 ecl-col-l-8 ecl-offset-l-2\">\n            <button eclButton type=\"ghost\" (click)=\"onCloseClick($event)\" styleClass=\"ecl-language-list__close-button\">\n                <span eclButtonLabel>\n                    {{ 'ecl.common.CLOSE' | translate }}\n                </span>\n                <ecl-icon icon=\"close\" size=\"s\" class=\"ecl-icon--fluid\"></ecl-icon>\n            </button>\n        </div>\n        <div class=\"ecl-language-list__title ecl-col-12 ecl-col-l-8 ecl-offset-l-2\">\n            <ecl-icon size=\"m\" class=\"ecl-language-list__title-icon\" icon=\"generic-lang\"></ecl-icon>\n            {{ 'ecl.language-list.SELECT-LANGUAGE' | translate }}\n        </div>\n    </div>\n    <div [eclHidden]=\"!hasEuLanguageListItems\" class=\"ecl-row ecl-language-list__eu\">\n        <div class=\"ecl-language-list__category ecl-col-12 ecl-col-l-8 ecl-offset-l-2\">\n            {{ 'ecl.language-list.EU-LANGUAGES' | translate }}\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4 ecl-offset-l-2\">\n            <ul #euLeftContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4\">\n            <ul #euRightContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n    </div>\n    <div [eclHidden]=\"!hasNonEuLanguageListItems\" class=\"ecl-row ecl-language-list__non-eu\">\n        <div class=\"ecl-language-list__category ecl-col-12 ecl-col-l-8 ecl-offset-l-2\">\n            {{ 'ecl.language-list.NON-EU-LANGUAGES' | translate }}\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4 ecl-offset-l-2\">\n            <ul #nonEuLeftContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4\">\n            <ul #nonEuRightContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["variant", "containerStyleClass"] }, { kind: "directive", type: EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "isInverted", "ariaHidden", "focusable"] }, { kind: "directive", type: EclHiddenDirective, selector: "[eclHidden]", inputs: ["eclHidden"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
+/** @nocollapse */ EclLanguageListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclLanguageListComponent, selector: "ecl-language-list", inputs: { isOverlay: "isOverlay", selectedLanguageCode: "selectedLanguageCode", isHidden: "isHidden" }, outputs: { languageSelected: "languageSelected", close: "close" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" }, properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "eclLanguageListItems", predicate: EclLanguageListItemComponent }], viewQueries: [{ propertyName: "euLeftContainer", first: true, predicate: ["euLeftContainer"], descendants: true }, { propertyName: "euRightContainer", first: true, predicate: ["euRightContainer"], descendants: true }, { propertyName: "nonEuLeftContainer", first: true, predicate: ["nonEuLeftContainer"], descendants: true }, { propertyName: "nonEuRightContainer", first: true, predicate: ["nonEuRightContainer"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<header *ngIf=\"isSplash\" class=\"ecl-language-list__header\">\n    <img class=\"ecl-language-list__logo\" src=\"./assets/images/ecl/ec/logo/logo-ec--mute.svg\" alt=\"European Commission logo\" />\n</header>\n<div class=\"ecl-language-list__container ecl-container\">\n    <div *ngIf=\"isOverlay\" class=\"ecl-language-list--overlay__header\">\n        <div class=\"ecl-language-list__close ecl-col-12 ecl-col-l-8 ecl-col-m-11 ecl-offset-l-2\">\n            <button eclButton type=\"ghost\" (click)=\"onCloseClick($event)\" styleClass=\"ecl-language-list__close-button\">\n                <span eclButtonLabel>\n                    {{ 'ecl.common.CLOSE' | translate }}\n                </span>\n                <ecl-icon icon=\"close\" size=\"s\" class=\"ecl-icon--fluid\"></ecl-icon>\n            </button>\n        </div>\n        <div class=\"ecl-language-list__title ecl-col-12 ecl-col-l-8 ecl-offset-l-2 ecl-col-m-11 ecl-offset-m-1\">\n            <ecl-icon size=\"m\" class=\"ecl-language-list__title-icon\" icon=\"generic-lang\"></ecl-icon>\n            {{ 'ecl.language-list.SELECT-LANGUAGE' | translate }}\n        </div>\n    </div>\n    <div [eclHidden]=\"!hasEuLanguageListItems\" class=\"ecl-row ecl-language-list__eu\">\n        <div class=\"ecl-language-list__category ecl-col-12 ecl-col-l-8 ecl-offset-l-2 ecl-col-m-11 ecl-offset-m-1\">\n            {{ 'ecl.language-list.EU-LANGUAGES' | translate }}\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4 ecl-offset-l-2 ecl-col-m-5 ecl-offset-m-1\">\n            <ul #euLeftContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4 ecl-col-m-5\">\n            <ul #euRightContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n    </div>\n    <div [eclHidden]=\"!hasNonEuLanguageListItems\" class=\"ecl-row ecl-language-list__non-eu\">\n        <div class=\"ecl-language-list__category ecl-col-12 ecl-col-l-8 ecl-offset-l-2 ecl-col-m-11 ecl-offset-m-1\">\n            {{ 'ecl.language-list.NON-EU-LANGUAGES' | translate }}\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4 ecl-offset-l-2 ecl-col-m-5 ecl-offset-m-1\">\n            <ul #nonEuLeftContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4 ecl-col-m-5\">\n            <ul #nonEuRightContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["variant", "containerStyleClass"] }, { kind: "directive", type: EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "isInverted", "ariaHidden", "focusable"] }, { kind: "directive", type: EclHiddenDirective, selector: "[eclHidden]", inputs: ["eclHidden"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
 __decorate([
     coerceBoolean
 ], EclLanguageListComponent.prototype, "isOverlay", void 0);
@@ -946,7 +946,7 @@ __decorate([
 ], EclLanguageListComponent.prototype, "isHidden", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclLanguageListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ecl-language-list', template: "<header *ngIf=\"isSplash\" class=\"ecl-language-list__header\">\n    <img class=\"ecl-language-list__logo\" src=\"./assets/images/ecl/ec/logo/logo-ec--mute.svg\" alt=\"European Commission logo\" />\n</header>\n<div class=\"ecl-language-list__container ecl-container\">\n    <div *ngIf=\"isOverlay\" class=\"ecl-row\">\n        <div class=\"ecl-language-list__close ecl-col-12 ecl-col-l-8 ecl-offset-l-2\">\n            <button eclButton type=\"ghost\" (click)=\"onCloseClick($event)\" styleClass=\"ecl-language-list__close-button\">\n                <span eclButtonLabel>\n                    {{ 'ecl.common.CLOSE' | translate }}\n                </span>\n                <ecl-icon icon=\"close\" size=\"s\" class=\"ecl-icon--fluid\"></ecl-icon>\n            </button>\n        </div>\n        <div class=\"ecl-language-list__title ecl-col-12 ecl-col-l-8 ecl-offset-l-2\">\n            <ecl-icon size=\"m\" class=\"ecl-language-list__title-icon\" icon=\"generic-lang\"></ecl-icon>\n            {{ 'ecl.language-list.SELECT-LANGUAGE' | translate }}\n        </div>\n    </div>\n    <div [eclHidden]=\"!hasEuLanguageListItems\" class=\"ecl-row ecl-language-list__eu\">\n        <div class=\"ecl-language-list__category ecl-col-12 ecl-col-l-8 ecl-offset-l-2\">\n            {{ 'ecl.language-list.EU-LANGUAGES' | translate }}\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4 ecl-offset-l-2\">\n            <ul #euLeftContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4\">\n            <ul #euRightContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n    </div>\n    <div [eclHidden]=\"!hasNonEuLanguageListItems\" class=\"ecl-row ecl-language-list__non-eu\">\n        <div class=\"ecl-language-list__category ecl-col-12 ecl-col-l-8 ecl-offset-l-2\">\n            {{ 'ecl.language-list.NON-EU-LANGUAGES' | translate }}\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4 ecl-offset-l-2\">\n            <ul #nonEuLeftContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4\">\n            <ul #nonEuRightContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n    </div>\n</div>\n" }]
+            args: [{ selector: 'ecl-language-list', template: "<header *ngIf=\"isSplash\" class=\"ecl-language-list__header\">\n    <img class=\"ecl-language-list__logo\" src=\"./assets/images/ecl/ec/logo/logo-ec--mute.svg\" alt=\"European Commission logo\" />\n</header>\n<div class=\"ecl-language-list__container ecl-container\">\n    <div *ngIf=\"isOverlay\" class=\"ecl-language-list--overlay__header\">\n        <div class=\"ecl-language-list__close ecl-col-12 ecl-col-l-8 ecl-col-m-11 ecl-offset-l-2\">\n            <button eclButton type=\"ghost\" (click)=\"onCloseClick($event)\" styleClass=\"ecl-language-list__close-button\">\n                <span eclButtonLabel>\n                    {{ 'ecl.common.CLOSE' | translate }}\n                </span>\n                <ecl-icon icon=\"close\" size=\"s\" class=\"ecl-icon--fluid\"></ecl-icon>\n            </button>\n        </div>\n        <div class=\"ecl-language-list__title ecl-col-12 ecl-col-l-8 ecl-offset-l-2 ecl-col-m-11 ecl-offset-m-1\">\n            <ecl-icon size=\"m\" class=\"ecl-language-list__title-icon\" icon=\"generic-lang\"></ecl-icon>\n            {{ 'ecl.language-list.SELECT-LANGUAGE' | translate }}\n        </div>\n    </div>\n    <div [eclHidden]=\"!hasEuLanguageListItems\" class=\"ecl-row ecl-language-list__eu\">\n        <div class=\"ecl-language-list__category ecl-col-12 ecl-col-l-8 ecl-offset-l-2 ecl-col-m-11 ecl-offset-m-1\">\n            {{ 'ecl.language-list.EU-LANGUAGES' | translate }}\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4 ecl-offset-l-2 ecl-col-m-5 ecl-offset-m-1\">\n            <ul #euLeftContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4 ecl-col-m-5\">\n            <ul #euRightContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n    </div>\n    <div [eclHidden]=\"!hasNonEuLanguageListItems\" class=\"ecl-row ecl-language-list__non-eu\">\n        <div class=\"ecl-language-list__category ecl-col-12 ecl-col-l-8 ecl-offset-l-2 ecl-col-m-11 ecl-offset-m-1\">\n            {{ 'ecl.language-list.NON-EU-LANGUAGES' | translate }}\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4 ecl-offset-l-2 ecl-col-m-5 ecl-offset-m-1\">\n            <ul #nonEuLeftContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n        <div class=\"ecl-language-list__column ecl-col-12 ecl-col-l-4 ecl-col-m-5\">\n            <ul #nonEuRightContainer class=\"ecl-language-list__list\"></ul>\n        </div>\n    </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: EclLanguageService }]; }, propDecorators: { isOverlay: [{
                 type: Input
             }], selectedLanguageCode: [{
@@ -1254,7 +1254,7 @@ const ECL_SEARCH_FORM_VALUE_ACCESSOR = {
     useExisting: forwardRef(() => EclSearchFormComponent),
     multi: true,
 };
-const noop$1 = () => { };
+const noop$2 = () => { };
 class EclSearchFormComponent extends ECLBaseDirective {
     constructor(fb) {
         super();
@@ -1262,8 +1262,8 @@ class EclSearchFormComponent extends ECLBaseDirective {
         this.searchButtonIcon = 'search';
         this.role = 'search';
         this.search = new EventEmitter();
-        this.onChange = noop$1;
-        this.onTouched = noop$1;
+        this.onChange = noop$2;
+        this.onTouched = noop$2;
     }
     get cssClasses() {
         return [
@@ -1362,10 +1362,10 @@ class EclSiteHeaderSearchComponent extends ECLBaseDirective {
     }
 }
 /** @nocollapse */ EclSiteHeaderSearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclSiteHeaderSearchComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ EclSiteHeaderSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclSiteHeaderSearchComponent, selector: "ecl-site-header-search", inputs: { searchInputText: "searchInputText", searchInputPlaceholder: "searchInputPlaceholder", searchButtonLabel: "searchButtonLabel" }, outputs: { search: "search", searchToggle: "searchToggle" }, host: { properties: { "class": "this.class" } }, usesInheritance: true, ngImport: i0, template: "<a href=\"#\"\n   class=\"ecl-button ecl-button--ghost ecl-site-header__search-toggle\"\n   data-ecl-search-toggle=\"true\"\n   aria-controls=\"search-form-id\"\n   [attr.aria-expanded]=\"isSearchBoxActive\"\n   (click)=\"onSearchBoxToggle($event)\">\n    <ecl-icon icon=\"search\"\n              size=\"s\"></ecl-icon>\n    {{ 'ecl.common.SEARCH' | translate }}\n</a>\n\n<ecl-search-form (search)=\"onSearch($event)\"\n                 [placeholder]=\"searchInputPlaceholder\"\n                 [searchInputText]=\"searchInputText\"\n                 [searchButtonLabel]=\"searchButtonLabel\"\n                 [class]=\"getSearchBoxCssClasses()\">\n</ecl-search-form>", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "isInverted", "ariaHidden", "focusable"] }, { kind: "component", type: EclSearchFormComponent, selector: "ecl-search-form", inputs: ["formControlName", "searchInputText", "placeholder", "searchButtonLabel", "searchButtonIcon"], outputs: ["search"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
+/** @nocollapse */ EclSiteHeaderSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclSiteHeaderSearchComponent, selector: "ecl-site-header-search", inputs: { searchInputText: "searchInputText", searchInputPlaceholder: "searchInputPlaceholder", searchButtonLabel: "searchButtonLabel" }, outputs: { search: "search", searchToggle: "searchToggle" }, host: { properties: { "class": "this.class" } }, usesInheritance: true, ngImport: i0, template: "<a href=\"#\"\n   class=\"ecl-button ecl-button--ghost ecl-site-header__search-toggle\"\n   data-ecl-search-toggle=\"true\"\n   aria-controls=\"search-form-id\"\n   [attr.aria-expanded]=\"isSearchBoxActive\"\n   (click)=\"onSearchBoxToggle($event)\">\n    <ecl-icon icon=\"search\"\n              size=\"s\"\n              class=\"ecl-site-header__icon\"></ecl-icon>\n    {{ 'ecl.common.SEARCH' | translate }}\n</a>\n\n<ecl-search-form (search)=\"onSearch($event)\"\n                 [placeholder]=\"searchInputPlaceholder\"\n                 [searchInputText]=\"searchInputText\"\n                 [searchButtonLabel]=\"searchButtonLabel\"\n                 [class]=\"getSearchBoxCssClasses()\">\n</ecl-search-form>", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "isInverted", "ariaHidden", "focusable"] }, { kind: "component", type: EclSearchFormComponent, selector: "ecl-search-form", inputs: ["formControlName", "searchInputText", "placeholder", "searchButtonLabel", "searchButtonIcon"], outputs: ["search"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclSiteHeaderSearchComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ecl-site-header-search', template: "<a href=\"#\"\n   class=\"ecl-button ecl-button--ghost ecl-site-header__search-toggle\"\n   data-ecl-search-toggle=\"true\"\n   aria-controls=\"search-form-id\"\n   [attr.aria-expanded]=\"isSearchBoxActive\"\n   (click)=\"onSearchBoxToggle($event)\">\n    <ecl-icon icon=\"search\"\n              size=\"s\"></ecl-icon>\n    {{ 'ecl.common.SEARCH' | translate }}\n</a>\n\n<ecl-search-form (search)=\"onSearch($event)\"\n                 [placeholder]=\"searchInputPlaceholder\"\n                 [searchInputText]=\"searchInputText\"\n                 [searchButtonLabel]=\"searchButtonLabel\"\n                 [class]=\"getSearchBoxCssClasses()\">\n</ecl-search-form>", styles: [":host{display:block}\n"] }]
+            args: [{ selector: 'ecl-site-header-search', template: "<a href=\"#\"\n   class=\"ecl-button ecl-button--ghost ecl-site-header__search-toggle\"\n   data-ecl-search-toggle=\"true\"\n   aria-controls=\"search-form-id\"\n   [attr.aria-expanded]=\"isSearchBoxActive\"\n   (click)=\"onSearchBoxToggle($event)\">\n    <ecl-icon icon=\"search\"\n              size=\"s\"\n              class=\"ecl-site-header__icon\"></ecl-icon>\n    {{ 'ecl.common.SEARCH' | translate }}\n</a>\n\n<ecl-search-form (search)=\"onSearch($event)\"\n                 [placeholder]=\"searchInputPlaceholder\"\n                 [searchInputText]=\"searchInputText\"\n                 [searchButtonLabel]=\"searchButtonLabel\"\n                 [class]=\"getSearchBoxCssClasses()\">\n</ecl-search-form>", styles: [":host{display:block}\n"] }]
         }], propDecorators: { class: [{
                 type: HostBinding,
                 args: ['class']
@@ -1395,10 +1395,10 @@ class EclSiteHeaderLanguageComponent extends ECLBaseDirective {
     }
 }
 /** @nocollapse */ EclSiteHeaderLanguageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclSiteHeaderLanguageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ EclSiteHeaderLanguageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclSiteHeaderLanguageComponent, selector: "ecl-site-header-language", inputs: { languageLabel: "languageLabel", languageCode: "languageCode" }, outputs: { languageClick: "languageClick" }, usesInheritance: true, ngImport: i0, template: "<a href=\"#\"\n   class=\"ecl-button ecl-button--ghost ecl-site-header__language-selector\"\n   aria-controls=\"language-list-overlay\"\n   (click)=\"onLanguageClick($event)\">\n    <span class=\"ecl-site-header__language-icon\">\n        <ecl-icon icon=\"language\"\n                  size=\"s\"\n                  class=\"ecl-site-header__icon\"></ecl-icon>\n        <span class=\"ecl-site-header__language-code\">{{ languageCode }}</span>\n    </span>\n    {{ languageLabel || 'ecl.language-list.ENGLISH' | translate }}\n</a>", styles: [":host{display:flex}\n"], dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "isInverted", "ariaHidden", "focusable"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
+/** @nocollapse */ EclSiteHeaderLanguageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclSiteHeaderLanguageComponent, selector: "ecl-site-header-language", inputs: { languageLabel: "languageLabel", languageCode: "languageCode" }, outputs: { languageClick: "languageClick" }, usesInheritance: true, ngImport: i0, template: "<a href=\"#\"\n   class=\"ecl-button ecl-button--ghost ecl-site-header__language-selector\"\n   aria-controls=\"language-list-overlay\"\n   [attr.aria-label]=\"'ecl.language-list.SELECT-LANGUAGE' | translate\"\n   (click)=\"onLanguageClick($event)\">\n    <span class=\"ecl-site-header__language-icon\">\n        <ecl-icon icon=\"language\"\n                  size=\"s\"\n                  class=\"ecl-site-header__icon\"></ecl-icon>\n        <span class=\"ecl-site-header__language-code\">{{ languageCode }}</span>\n    </span>\n    {{ languageLabel || 'ecl.language-list.ENGLISH' | translate }}\n</a>", styles: [":host{display:flex}\n"], dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "isInverted", "ariaHidden", "focusable"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclSiteHeaderLanguageComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ecl-site-header-language', template: "<a href=\"#\"\n   class=\"ecl-button ecl-button--ghost ecl-site-header__language-selector\"\n   aria-controls=\"language-list-overlay\"\n   (click)=\"onLanguageClick($event)\">\n    <span class=\"ecl-site-header__language-icon\">\n        <ecl-icon icon=\"language\"\n                  size=\"s\"\n                  class=\"ecl-site-header__icon\"></ecl-icon>\n        <span class=\"ecl-site-header__language-code\">{{ languageCode }}</span>\n    </span>\n    {{ languageLabel || 'ecl.language-list.ENGLISH' | translate }}\n</a>", styles: [":host{display:flex}\n"] }]
+            args: [{ selector: 'ecl-site-header-language', template: "<a href=\"#\"\n   class=\"ecl-button ecl-button--ghost ecl-site-header__language-selector\"\n   aria-controls=\"language-list-overlay\"\n   [attr.aria-label]=\"'ecl.language-list.SELECT-LANGUAGE' | translate\"\n   (click)=\"onLanguageClick($event)\">\n    <span class=\"ecl-site-header__language-icon\">\n        <ecl-icon icon=\"language\"\n                  size=\"s\"\n                  class=\"ecl-site-header__icon\"></ecl-icon>\n        <span class=\"ecl-site-header__language-code\">{{ languageCode }}</span>\n    </span>\n    {{ languageLabel || 'ecl.language-list.ENGLISH' | translate }}\n</a>", styles: [":host{display:flex}\n"] }]
         }], propDecorators: { languageLabel: [{
                 type: Input
             }], languageCode: [{
@@ -2622,7 +2622,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 args: ['class']
             }] } });
 
-const COMPONENTS$a = [
+const COMPONENTS$c = [
     EclSiteHeaderComponent,
     EclSiteHeaderActionComponent,
     EclSiteHeaderLoginComponent,
@@ -2679,10 +2679,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                         EclSearchFormComponentModule
                     ],
                     exports: [
-                        ...COMPONENTS$a
+                        ...COMPONENTS$c
                     ],
                     declarations: [
-                        ...COMPONENTS$a
+                        ...COMPONENTS$c
                     ]
                 }]
         }] });
@@ -3738,7 +3738,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 args: ['class']
             }] } });
 
-const COMPONENTS$9 = [
+const COMPONENTS$b = [
     EclBreadcrumbComponent,
     EclBreadcrumbSegmentComponent
 ];
@@ -3767,8 +3767,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                         EclLinkDirectiveModule,
                         EclIconComponentModule
                     ],
-                    exports: [...COMPONENTS$9],
-                    declarations: [...COMPONENTS$9],
+                    exports: [...COMPONENTS$b],
+                    declarations: [...COMPONENTS$b],
                     entryComponents: [EclBreadcrumbSegmentComponent]
                 }]
         }] });
@@ -3894,7 +3894,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 args: ['class']
             }] } });
 
-const COMPONENTS$8 = [
+const COMPONENTS$a = [
     EclCardComponent,
     EclCardBodyComponent,
     EclCardImageDirective,
@@ -3924,50 +3924,129 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                         EclLabelDirectiveModule,
                     ],
                     exports: [
-                        ...COMPONENTS$8
+                        ...COMPONENTS$a
                     ],
                     declarations: [
-                        ...COMPONENTS$8
+                        ...COMPONENTS$a
                     ],
                 }]
         }] });
 
+class EclCarouselItemComponent extends ECLBaseDirective {
+    constructor() {
+        super(...arguments);
+        this.role = 'group';
+    }
+    get cssClasses() {
+        return [
+            super.getCssClasses('ecl-carousel__slide'),
+        ].join(' ').trim();
+    }
+}
+/** @nocollapse */ EclCarouselItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclCarouselItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ EclCarouselItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclCarouselItemComponent, selector: "ecl-carousel-item", host: { properties: { "attr.role": "this.role", "attr.aria-label": "this.ariaLabel", "style.width.%": "this.width", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclCarouselItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ecl-carousel-item', template: "<ng-content></ng-content>" }]
+        }], propDecorators: { role: [{
+                type: HostBinding,
+                args: ['attr.role']
+            }], ariaLabel: [{
+                type: HostBinding,
+                args: ['attr.aria-label']
+            }], width: [{
+                type: HostBinding,
+                args: ['style.width.%']
+            }], cssClasses: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
+
 class EclCarouselComponent extends ECLBaseDirective {
+    constructor(cd) {
+        super();
+        this.cd = cd;
+        this.isPadded = true;
+    }
     get cssClasses() {
         return [
-            super.getCssClasses('ecl-carousel'),
+            super.getCssClasses('ecl-carousel')
         ].join(' ').trim();
     }
+    ngAfterContentInit() {
+        const slideWidth = 100 / this.slides.length;
+        this.slides.forEach(slide => {
+            slide.width = slideWidth;
+        });
+    }
+    ngAfterViewInit() {
+        setTimeout(() => {
+            const containerWidth = this.carouselContainerEl.offsetWidth * this.slides.length;
+            this.slidesWidth = containerWidth;
+        }, 50);
+    }
+    onResize(event) {
+        setTimeout(() => {
+            const containerWidth = this.carouselContainerEl.offsetWidth * this.slides.length;
+            this.slidesWidth = containerWidth;
+        });
+    }
 }
-/** @nocollapse */ EclCarouselComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclCarouselComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ EclCarouselComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclCarouselComponent, selector: "ecl-carousel", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "" });
+/** @nocollapse */ EclCarouselComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclCarouselComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ EclCarouselComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclCarouselComponent, selector: "ecl-carousel", inputs: { isPadded: "isPadded" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "slides", predicate: i0.forwardRef(function () { return EclCarouselItemComponent; }) }], viewQueries: [{ propertyName: "carouselContainerEl", first: true, predicate: ["container"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div #container class=\"ecl-carousel__container\" [class.ecl-carousel-container--padded]=\"isPadded\">\n    <div #slider class=\"ecl-carousel__slides\" [style.width.px]=\"slidesWidth\">\n        <ng-content></ng-content>\n    </div>\n</div>\n\n<div class=\"ecl-carousel__controls\">\n    <button class=\"ecl-carousel__prev\" aria-hidden=\"true\">\n        <ecl-icon \n            icon=\"corner-arrow\" \n            size=\"m\" \n            transform=\"rotate-270\" \n            inverted \n            class=\"ecl-u-d-block\">\n        </ecl-icon>\n        <div class=\"ecl-u-sr-only\">{{ 'ecl.carousel.PREV_SLIDES' | translate }}</div>\n    </button>\n\n    <button class=\"ecl-carousel__next\" aria-hidden=\"true\">\n        <ecl-icon \n            icon=\"corner-arrow\" \n            size=\"m\" \n            transform=\"rotate-90\" \n            inverted \n            class=\"ecl-u-d-block\">\n        </ecl-icon>\n        <div class=\"ecl-u-sr-only\">{{ 'ecl.carousel.NEXT_SLIDES' | translate }}</div>\n    </button>\n\n    <div class=\"ecl-container\">\n        <button class=\"ecl-carousel__toggle\" aria-hidden=\"true\">\n            <ecl-icon \n                icon=\"play\" \n                size=\"l\" \n                inverted>\n            </ecl-icon>\n            <div class=\"ecl-u-sr-only\">{{ 'ecl.carousel.AUTOPLAY' | translate }}</div>\n        </button>\n\n        <div class=\"ecl-carousel__pagination\">\n            <span class=\"ecl-carousel__current\">1</span>\n            &nbsp;of 3\n        </div>\n\n        <div class=\"ecl-carousel__navigation\">\n            <button class=\"ecl-carousel__navigation-item\" aria-current=\"true\">\n                <span class=\"ecl-u-sr-only\">Go to slide 1</span>\n            </button>\n            <button class=\"ecl-carousel__navigation-item\">\n                <span class=\"ecl-u-sr-only\">Go to slide 2</span>\n            </button>\n            <button class=\"ecl-carousel__navigation-item\">\n                <span class=\"ecl-u-sr-only\">Go to slide 3</span>\n            </button>\n        </div>\n    </div>\n</div>", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "isInverted", "ariaHidden", "focusable"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
+__decorate([
+    coerceBoolean
+], EclCarouselComponent.prototype, "isPadded", void 0);
+__decorate([
+    coerceElement
+], EclCarouselComponent.prototype, "carouselContainerEl", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclCarouselComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ecl-carousel', template: "" }]
-        }], propDecorators: { cssClasses: [{
+            args: [{ selector: 'ecl-carousel', template: "<div #container class=\"ecl-carousel__container\" [class.ecl-carousel-container--padded]=\"isPadded\">\n    <div #slider class=\"ecl-carousel__slides\" [style.width.px]=\"slidesWidth\">\n        <ng-content></ng-content>\n    </div>\n</div>\n\n<div class=\"ecl-carousel__controls\">\n    <button class=\"ecl-carousel__prev\" aria-hidden=\"true\">\n        <ecl-icon \n            icon=\"corner-arrow\" \n            size=\"m\" \n            transform=\"rotate-270\" \n            inverted \n            class=\"ecl-u-d-block\">\n        </ecl-icon>\n        <div class=\"ecl-u-sr-only\">{{ 'ecl.carousel.PREV_SLIDES' | translate }}</div>\n    </button>\n\n    <button class=\"ecl-carousel__next\" aria-hidden=\"true\">\n        <ecl-icon \n            icon=\"corner-arrow\" \n            size=\"m\" \n            transform=\"rotate-90\" \n            inverted \n            class=\"ecl-u-d-block\">\n        </ecl-icon>\n        <div class=\"ecl-u-sr-only\">{{ 'ecl.carousel.NEXT_SLIDES' | translate }}</div>\n    </button>\n\n    <div class=\"ecl-container\">\n        <button class=\"ecl-carousel__toggle\" aria-hidden=\"true\">\n            <ecl-icon \n                icon=\"play\" \n                size=\"l\" \n                inverted>\n            </ecl-icon>\n            <div class=\"ecl-u-sr-only\">{{ 'ecl.carousel.AUTOPLAY' | translate }}</div>\n        </button>\n\n        <div class=\"ecl-carousel__pagination\">\n            <span class=\"ecl-carousel__current\">1</span>\n            &nbsp;of 3\n        </div>\n\n        <div class=\"ecl-carousel__navigation\">\n            <button class=\"ecl-carousel__navigation-item\" aria-current=\"true\">\n                <span class=\"ecl-u-sr-only\">Go to slide 1</span>\n            </button>\n            <button class=\"ecl-carousel__navigation-item\">\n                <span class=\"ecl-u-sr-only\">Go to slide 2</span>\n            </button>\n            <button class=\"ecl-carousel__navigation-item\">\n                <span class=\"ecl-u-sr-only\">Go to slide 3</span>\n            </button>\n        </div>\n    </div>\n</div>", styles: [":host{display:block}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { isPadded: [{
+                type: Input
+            }], carouselContainerEl: [{
+                type: ViewChild,
+                args: ['container']
+            }], slides: [{
+                type: ContentChildren,
+                args: [forwardRef(() => EclCarouselItemComponent)]
+            }], cssClasses: [{
                 type: HostBinding,
                 args: ['class']
+            }], onResize: [{
+                type: HostListener,
+                args: ['window:resize', ['$event']]
             }] } });
 
+const COMPONENTS$9 = [
+    EclCarouselComponent,
+    EclCarouselItemComponent
+];
 class EclCarouselComponentModule {
 }
 /** @nocollapse */ EclCarouselComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclCarouselComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-/** @nocollapse */ EclCarouselComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclCarouselComponentModule, declarations: [EclCarouselComponent], imports: [CommonModule,
-        EclIconComponentModule], exports: [EclCarouselComponent] });
+/** @nocollapse */ EclCarouselComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclCarouselComponentModule, declarations: [EclCarouselComponent,
+        EclCarouselItemComponent], imports: [CommonModule,
+        EclIconComponentModule,
+        TranslateModule], exports: [EclCarouselComponent,
+        EclCarouselItemComponent] });
 /** @nocollapse */ EclCarouselComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclCarouselComponentModule, imports: [CommonModule,
-        EclIconComponentModule] });
+        EclIconComponentModule,
+        TranslateModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclCarouselComponentModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
                         CommonModule,
-                        EclIconComponentModule
+                        EclIconComponentModule,
+                        TranslateModule
                     ],
                     exports: [
-                        EclCarouselComponent,
+                        ...COMPONENTS$9
                     ],
                     declarations: [
-                        EclCarouselComponent,
+                        ...COMPONENTS$9
                     ]
                 }]
         }] });
@@ -4778,7 +4857,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 args: ['class']
             }] } });
 
-const COMPONENTS$7 = [
+const COMPONENTS$8 = [
     EclContentBlockComponent,
     EclContentBlockTitleDirective,
     EclContentBlockDescriptionDirective,
@@ -4844,10 +4923,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                         CommonModule,
                     ],
                     exports: [
-                        ...COMPONENTS$7
+                        ...COMPONENTS$8
                     ],
                     declarations: [
-                        ...COMPONENTS$7
+                        ...COMPONENTS$8
                     ]
                 }]
         }] });
@@ -4999,7 +5078,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 args: ['class']
             }] } });
 
-const COMPONENTS$6 = [
+const COMPONENTS$7 = [
     EclContentItemComponent,
     EclContentItemImageDirective,
     EclContentItemPictureDirective
@@ -5023,10 +5102,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                         RouterModule,
                     ],
                     exports: [
-                        ...COMPONENTS$6
+                        ...COMPONENTS$7
                     ],
                     declarations: [
-                        ...COMPONENTS$6
+                        ...COMPONENTS$7
                     ],
                 }]
         }] });
@@ -5063,7 +5142,7 @@ const ECL_DATE_PICKER_VALUE_ACCESSOR = {
     useExisting: forwardRef(() => EclDatePickerDirective),
     multi: true,
 };
-const noop = () => { };
+const noop$1 = () => { };
 class EclDatePickerDirective extends ECLBaseDirective {
     constructor(el, viewContainerRef, translateService, eclLanguageService) {
         super();
@@ -5077,8 +5156,8 @@ class EclDatePickerDirective extends ECLBaseDirective {
         this.datePicked = new EventEmitter();
         this.destroy$ = new Subject();
         this.isDisabled = null;
-        this.onChange = noop;
-        this.onTouched = noop;
+        this.onChange = noop$1;
+        this.onTouched = noop$1;
         this.handlei18nEvents();
     }
     get cssClasses() {
@@ -5607,8 +5686,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
 class EclFeaturedComponent extends ECLBaseDirective {
     constructor() {
         super(...arguments);
-        this.heading = '';
+        this.position = 'left';
         this.isExtended = false;
+        this.role = 'article';
     }
     get cssClasses() {
         return [
@@ -5618,17 +5698,20 @@ class EclFeaturedComponent extends ECLBaseDirective {
     }
 }
 /** @nocollapse */ EclFeaturedComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclFeaturedComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ EclFeaturedComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclFeaturedComponent, selector: "ecl-featured", inputs: { heading: "heading", isExtended: "isExtended" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-featured-item__heading\">{{ heading }}</div>\n<article class=\"ecl-featured-item__container\">\n    <ng-content></ng-content>\n</article>\n" });
+/** @nocollapse */ EclFeaturedComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclFeaturedComponent, selector: "ecl-featured", inputs: { position: "position", isExtended: "isExtended" }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-featured-item__container ecl-featured-item__container--{{ position }}\">\n    <ng-content></ng-content>\n</div>\n" });
 __decorate([
     coerceBoolean
 ], EclFeaturedComponent.prototype, "isExtended", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclFeaturedComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ecl-featured', template: "<div class=\"ecl-featured-item__heading\">{{ heading }}</div>\n<article class=\"ecl-featured-item__container\">\n    <ng-content></ng-content>\n</article>\n" }]
-        }], propDecorators: { heading: [{
+            args: [{ selector: 'ecl-featured', template: "<div class=\"ecl-featured-item__container ecl-featured-item__container--{{ position }}\">\n    <ng-content></ng-content>\n</div>\n" }]
+        }], propDecorators: { position: [{
                 type: Input
             }], isExtended: [{
                 type: Input
+            }], role: [{
+                type: HostBinding,
+                args: ['attr.role']
             }], cssClasses: [{
                 type: HostBinding,
                 args: ['class']
@@ -6787,7 +6870,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 args: ['class']
             }] } });
 
-const COMPONENTS$5 = [
+const COMPONENTS$6 = [
     EclHeroBannerComponent,
     EclHeroBannerTitleDirective,
     EclHeroBannerDescriptionDirective,
@@ -6820,10 +6903,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                         EclLinkDirectiveModule,
                     ],
                     exports: [
-                        ...COMPONENTS$5
+                        ...COMPONENTS$6
                     ],
                     declarations: [
-                        ...COMPONENTS$5
+                        ...COMPONENTS$6
                     ],
                 }]
         }] });
@@ -7018,10 +7101,10 @@ class EclInpageNavigationComponent extends ECLBaseDirective {
     }
 }
 /** @nocollapse */ EclInpageNavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclInpageNavigationComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ EclInpageNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclInpageNavigationComponent, selector: "ecl-inpage-navigation", inputs: { eclTitle: "eclTitle", marginTop: "marginTop", marginBottom: "marginBottom" }, outputs: { sectionEnter: "sectionEnter" }, queries: [{ propertyName: "eclNavigationLinkItems", predicate: EclInpageNavigationItemComponent }], usesInheritance: true, ngImport: i0, template: "<ecl-sticky-container [marginTop]=\"marginTop\" [marginBottom]=\"marginBottom\">\n    <nav class=\"ecl-inpage-navigation\"\n        [class.ecl-inpage-navigation--visible]=\"currentSectionElement\">\n        <div class=\"ecl-inpage-navigation__title\">\n            {{ eclTitle || 'ecl.inpage-navigation.PAGE-CONTENTS' | translate }}\n        </div>\n        <div class=\"ecl-inpage-navigation__body\">\n            <button\n                type=\"button\"\n                class=\"ecl-inpage-navigation__trigger\"\n                aria-controls=\"ecl-inpage-navigation-list\"\n                [attr.aria-expanded]=\"isButtonExpanded\"\n                (click)=\"onExpandButtonClick($event)\">\n                <span class=\"ecl-inpage-navigation__trigger-current\">\n                    {{ currentNavigationLinkItem?.label }}\n                </span>\n                <ecl-icon \n                    icon=\"corner-arrow\" \n                    size=\"s\" \n                    transform=\"rotate-180\" \n                    class=\"ecl-inpage-navigation__trigger-icon\">\n                </ecl-icon>\n            </button>\n            <ul class=\"ecl-inpage-navigation__list\"\n                [class.ecl-inpage-navigation__list--visible]=\"isButtonExpanded\"\n                [attr.aria-expanded]=\"isButtonExpanded\"\n                aria-labelledby=\"ecl-inpage-navigation-trigger\">\n                <ng-content></ng-content>\n            </ul>\n        </div>\n    </nav>\n</ecl-sticky-container>\n", styles: ["@media (min-width: 996px){.ecl-inpage-navigation__list{display:block!important}}\n"], dependencies: [{ kind: "component", type: EclStickyContainerComponent, selector: "ecl-sticky-container", inputs: ["isEnabled", "marginTop", "marginBottom"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "isInverted", "ariaHidden", "focusable"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
+/** @nocollapse */ EclInpageNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclInpageNavigationComponent, selector: "ecl-inpage-navigation", inputs: { eclTitle: "eclTitle", marginTop: "marginTop", marginBottom: "marginBottom" }, outputs: { sectionEnter: "sectionEnter" }, queries: [{ propertyName: "eclNavigationLinkItems", predicate: EclInpageNavigationItemComponent }], usesInheritance: true, ngImport: i0, template: "<ecl-sticky-container [marginTop]=\"marginTop\" [marginBottom]=\"marginBottom\">\n    <nav aria-labelledby=\"ecl-inpage-navigation-default\"\n        class=\"ecl-inpage-navigation\"\n        [class.ecl-inpage-navigation--visible]=\"currentSectionElement\">\n        <div id=\"ecl-inpage-navigation-default\"\n            class=\"ecl-inpage-navigation__title\">\n            {{ eclTitle || 'ecl.inpage-navigation.PAGE-CONTENTS' | translate }}\n        </div>\n        <div class=\"ecl-inpage-navigation__body\">\n            <button\n                id=\"ecl-inpage-navigation-default-trigger\"\n                type=\"button\"\n                class=\"ecl-inpage-navigation__trigger\"\n                aria-controls=\"ecl-inpage-navigation-list\"\n                [attr.aria-expanded]=\"isButtonExpanded\"\n                (click)=\"onExpandButtonClick($event)\">\n                <span class=\"ecl-inpage-navigation__trigger-current\">\n                    {{ currentNavigationLinkItem?.label }}\n                </span>\n                <ecl-icon \n                    icon=\"corner-arrow\" \n                    size=\"s\" \n                    transform=\"rotate-180\" \n                    class=\"ecl-inpage-navigation__trigger-icon\">\n                </ecl-icon>\n            </button>\n            <ul id=\"ecl-inpage-navigation-default-list\"\n                class=\"ecl-inpage-navigation__list\"\n                [class.ecl-inpage-navigation__list--visible]=\"isButtonExpanded\"\n                [attr.aria-expanded]=\"isButtonExpanded\"\n                aria-labelledby=\"ecl-inpage-navigation-trigger\">\n                <ng-content></ng-content>\n            </ul>\n        </div>\n    </nav>\n</ecl-sticky-container>\n", styles: ["@media (min-width: 996px){.ecl-inpage-navigation__list{display:block!important}}\n"], dependencies: [{ kind: "component", type: EclStickyContainerComponent, selector: "ecl-sticky-container", inputs: ["isEnabled", "marginTop", "marginBottom"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "isInverted", "ariaHidden", "focusable"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclInpageNavigationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ecl-inpage-navigation', template: "<ecl-sticky-container [marginTop]=\"marginTop\" [marginBottom]=\"marginBottom\">\n    <nav class=\"ecl-inpage-navigation\"\n        [class.ecl-inpage-navigation--visible]=\"currentSectionElement\">\n        <div class=\"ecl-inpage-navigation__title\">\n            {{ eclTitle || 'ecl.inpage-navigation.PAGE-CONTENTS' | translate }}\n        </div>\n        <div class=\"ecl-inpage-navigation__body\">\n            <button\n                type=\"button\"\n                class=\"ecl-inpage-navigation__trigger\"\n                aria-controls=\"ecl-inpage-navigation-list\"\n                [attr.aria-expanded]=\"isButtonExpanded\"\n                (click)=\"onExpandButtonClick($event)\">\n                <span class=\"ecl-inpage-navigation__trigger-current\">\n                    {{ currentNavigationLinkItem?.label }}\n                </span>\n                <ecl-icon \n                    icon=\"corner-arrow\" \n                    size=\"s\" \n                    transform=\"rotate-180\" \n                    class=\"ecl-inpage-navigation__trigger-icon\">\n                </ecl-icon>\n            </button>\n            <ul class=\"ecl-inpage-navigation__list\"\n                [class.ecl-inpage-navigation__list--visible]=\"isButtonExpanded\"\n                [attr.aria-expanded]=\"isButtonExpanded\"\n                aria-labelledby=\"ecl-inpage-navigation-trigger\">\n                <ng-content></ng-content>\n            </ul>\n        </div>\n    </nav>\n</ecl-sticky-container>\n", styles: ["@media (min-width: 996px){.ecl-inpage-navigation__list{display:block!important}}\n"] }]
+            args: [{ selector: 'ecl-inpage-navigation', template: "<ecl-sticky-container [marginTop]=\"marginTop\" [marginBottom]=\"marginBottom\">\n    <nav aria-labelledby=\"ecl-inpage-navigation-default\"\n        class=\"ecl-inpage-navigation\"\n        [class.ecl-inpage-navigation--visible]=\"currentSectionElement\">\n        <div id=\"ecl-inpage-navigation-default\"\n            class=\"ecl-inpage-navigation__title\">\n            {{ eclTitle || 'ecl.inpage-navigation.PAGE-CONTENTS' | translate }}\n        </div>\n        <div class=\"ecl-inpage-navigation__body\">\n            <button\n                id=\"ecl-inpage-navigation-default-trigger\"\n                type=\"button\"\n                class=\"ecl-inpage-navigation__trigger\"\n                aria-controls=\"ecl-inpage-navigation-list\"\n                [attr.aria-expanded]=\"isButtonExpanded\"\n                (click)=\"onExpandButtonClick($event)\">\n                <span class=\"ecl-inpage-navigation__trigger-current\">\n                    {{ currentNavigationLinkItem?.label }}\n                </span>\n                <ecl-icon \n                    icon=\"corner-arrow\" \n                    size=\"s\" \n                    transform=\"rotate-180\" \n                    class=\"ecl-inpage-navigation__trigger-icon\">\n                </ecl-icon>\n            </button>\n            <ul id=\"ecl-inpage-navigation-default-list\"\n                class=\"ecl-inpage-navigation__list\"\n                [class.ecl-inpage-navigation__list--visible]=\"isButtonExpanded\"\n                [attr.aria-expanded]=\"isButtonExpanded\"\n                aria-labelledby=\"ecl-inpage-navigation-trigger\">\n                <ng-content></ng-content>\n            </ul>\n        </div>\n    </nav>\n</ecl-sticky-container>\n", styles: ["@media (min-width: 996px){.ecl-inpage-navigation__list{display:block!important}}\n"] }]
         }], propDecorators: { eclTitle: [{
                 type: Input
             }], marginTop: [{
@@ -7397,7 +7480,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 args: ['class.ecl-description-list__definition-item']
             }] } });
 
-const COMPONENTS$4 = [
+const COMPONENTS$5 = [
     EclOrderedListDirective,
     EclOrderedListItemDirective,
     EclUnorderedListDirective,
@@ -7433,10 +7516,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                         CommonModule,
                     ],
                     exports: [
-                        ...COMPONENTS$4
+                        ...COMPONENTS$5
                     ],
                     declarations: [
-                        ...COMPONENTS$4
+                        ...COMPONENTS$5
                     ]
                 }]
         }] });
@@ -8298,6 +8381,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 args: ['class']
             }] } });
 
+var KEY_CODE;
+(function (KEY_CODE) {
+    KEY_CODE[KEY_CODE["RIGHT_ARROW"] = 39] = "RIGHT_ARROW";
+    KEY_CODE[KEY_CODE["LEFT_ARROW"] = 37] = "LEFT_ARROW";
+})(KEY_CODE || (KEY_CODE = {}));
 class EclMultiselectComponent extends ECLBaseDirective {
     constructor(ngControl, el, viewContainerRef, differs, translate) {
         super();
@@ -8397,6 +8485,22 @@ class EclMultiselectComponent extends ECLBaseDirective {
     registerOnTouched(fn) {
         this.propagateTouched = fn;
     }
+    onEscapeKey(event) {
+        this.multiDropdown.style.display = 'none';
+    }
+    // @HostListener('keyup.ArrowDown', ['$event']) onArrowDownKey(event: KeyboardEvent) {
+    //     this.multiDropdown.style.display = 'block';
+    // }
+    // @HostListener('window:keyup', ['$event'])
+    // keyEvent(event: KeyboardEvent) {
+    //     console.log(event);
+    //     if (event.key === KEY_CODE.RIGHT_ARROW) {
+    //     this.increment();
+    //     }
+    //     if (event.keyCode === KEY_CODE.LEFT_ARROW) {
+    //     this.decrement();
+    //     }
+    // }
     onKeyUp(ev) {
         const isClickInside = this.multiDropdown.contains(ev.target) || this.multiSelectInput.contains(ev.target);
         if (!isClickInside) {
@@ -8659,7 +8763,7 @@ class EclMultiselectComponent extends ECLBaseDirective {
     }
 }
 /** @nocollapse */ EclMultiselectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclMultiselectComponent, deps: [{ token: i1$1.NgControl, optional: true, self: true }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i0.IterableDiffers }, { token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ EclMultiselectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclMultiselectComponent, selector: "select[eclMultiselect]", inputs: { isInvalid: "isInvalid", eclPlaceholder: "eclPlaceholder", disabled: "disabled", eclSize: "eclSize" }, outputs: { eclChange: "eclChange" }, host: { listeners: { "document:click": "onKeyUp($event)" }, properties: { "attr.disabled": "this.disabled", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclOptionItems", predicate: EclMultiselectOptionDirective }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>" });
+/** @nocollapse */ EclMultiselectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclMultiselectComponent, selector: "select[eclMultiselect]", inputs: { isInvalid: "isInvalid", eclPlaceholder: "eclPlaceholder", disabled: "disabled", eclSize: "eclSize" }, outputs: { eclChange: "eclChange" }, host: { listeners: { "document:keyup.escape": "onEscapeKey($event)", "document:click": "onKeyUp($event)" }, properties: { "attr.disabled": "this.disabled", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclOptionItems", predicate: EclMultiselectOptionDirective }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>" });
 __decorate([
     coerceBoolean
 ], EclMultiselectComponent.prototype, "isInvalid", void 0);
@@ -8691,6 +8795,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 args: ['class']
             }], eclChange: [{
                 type: Output
+            }], onEscapeKey: [{
+                type: HostListener,
+                args: ['document:keyup.escape', ['$event']]
             }], onKeyUp: [{
                 type: HostListener,
                 args: ['document:click', ['$event']]
@@ -8814,7 +8921,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 args: ['class']
             }] } });
 
-const COMPONENTS$3 = [
+const COMPONENTS$4 = [
     EclNavigationListComponent,
     EclNavigationListItemComponent,
     EclNavigationListImageDirective
@@ -8835,10 +8942,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                         CommonModule,
                     ],
                     exports: [
-                        ...COMPONENTS$3
+                        ...COMPONENTS$4
                     ],
                     declarations: [
-                        ...COMPONENTS$3
+                        ...COMPONENTS$4
                     ]
                 }]
         }] });
@@ -9230,7 +9337,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 args: ['class']
             }] } });
 
-const COMPONENTS$2 = [
+const COMPONENTS$3 = [
     EclPageBannerComponent,
     EclPageBannerTitleDirective,
     EclPageBannerDescriptionDirective,
@@ -9263,10 +9370,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                         EclLinkDirectiveModule,
                     ],
                     exports: [
-                        ...COMPONENTS$2
+                        ...COMPONENTS$3
                     ],
                     declarations: [
-                        ...COMPONENTS$2
+                        ...COMPONENTS$3
                     ]
                 }]
         }] });
@@ -10042,7 +10149,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 args: ['class']
             }] } });
 
-const COMPONENTS$1 = [
+const COMPONENTS$2 = [
     EclPageHeaderComponent,
     EclPageHeaderMetaDirective,
     EclPageHeaderMetaItemDirective,
@@ -10072,8 +10179,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
             type: NgModule,
             args: [{
                     imports: [CommonModule],
-                    exports: [...COMPONENTS$1],
-                    declarations: [...COMPONENTS$1]
+                    exports: [...COMPONENTS$2],
+                    declarations: [...COMPONENTS$2]
                 }]
         }] });
 
@@ -10473,6 +10580,106 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 }]
         }] });
 
+class EclRatingChangeEvent extends EclBaseEvent {
+    constructor(value) {
+        super();
+        this.value = value;
+    }
+}
+const ECL_RATINGFIELD_VALUE_ACCESSOR = {
+    provide: NG_VALUE_ACCESSOR,
+    useExisting: forwardRef(() => EclRatingFieldComponent),
+    multi: true,
+};
+const noop = () => { };
+class EclRatingFieldComponent extends ECLBaseDirective {
+    constructor() {
+        super();
+        this.name = 'rating';
+        this.numberOfStars = 5;
+        this.onChange = noop;
+        this.onTouched = noop;
+        this.ratingChange = new EventEmitter();
+    }
+    get numbers() {
+        return Array(this.numberOfStars)
+            .fill(0)
+            .map((_, i) => this.numberOfStars - i);
+    }
+    get cssClasses() {
+        return [
+            super.getCssClasses('ecl-rating-field'),
+        ].join(' ').trim();
+    }
+    onRadioClick(rating) {
+        this.rating = rating;
+        this.onTouched();
+        this.onChange(this.rating);
+        const evt = new EclRatingChangeEvent(rating);
+        this.ratingChange.next(evt);
+    }
+    writeValue(value) {
+        this.rating = value;
+    }
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled || null;
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+}
+/** @nocollapse */ EclRatingFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclRatingFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ EclRatingFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", 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: i0, template: "<ng-container *ngFor=\"let n of numbers\">\n    <input 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\"\n           for=\"{{ name }}-{{ n }}\">\n        <span class=\"ecl-u-sr-only\">{{ n }} stars</span>\n        <ecl-icon icon=\"star-filled\"\n                  class=\"ecl-rating-field__icon-filled\"\n                  size=\"m\">\n        </ecl-icon>\n        <ecl-icon icon=\"star-outline\"\n                  class=\"ecl-rating-field__icon-outline\"\n                  size=\"m\">\n        </ecl-icon>\n    </label>\n</ng-container>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "isInverted", "ariaHidden", "focusable"] }] });
+__decorate([
+    coerceNumber
+], EclRatingFieldComponent.prototype, "numberOfStars", void 0);
+__decorate([
+    coerceNumber
+], EclRatingFieldComponent.prototype, "rating", void 0);
+__decorate([
+    coerceBoolean
+], EclRatingFieldComponent.prototype, "disabled", void 0);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclRatingFieldComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ecl-rating-field', providers: [ECL_RATINGFIELD_VALUE_ACCESSOR], template: "<ng-container *ngFor=\"let n of numbers\">\n    <input 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\"\n           for=\"{{ name }}-{{ n }}\">\n        <span class=\"ecl-u-sr-only\">{{ n }} stars</span>\n        <ecl-icon icon=\"star-filled\"\n                  class=\"ecl-rating-field__icon-filled\"\n                  size=\"m\">\n        </ecl-icon>\n        <ecl-icon icon=\"star-outline\"\n                  class=\"ecl-rating-field__icon-outline\"\n                  size=\"m\">\n        </ecl-icon>\n    </label>\n</ng-container>" }]
+        }], ctorParameters: function () { return []; }, propDecorators: { name: [{
+                type: Input
+            }], numberOfStars: [{
+                type: Input
+            }], rating: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }, {
+                type: HostBinding,
+                args: ['attr.disabled']
+            }], ratingChange: [{
+                type: Output
+            }], cssClasses: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
+
+const COMPONENTS$1 = [
+    EclRatingFieldComponent
+];
+class EclRatingFieldComponentModule {
+}
+/** @nocollapse */ EclRatingFieldComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclRatingFieldComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+/** @nocollapse */ EclRatingFieldComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclRatingFieldComponentModule, declarations: [EclRatingFieldComponent], imports: [CommonModule, EclIconComponentModule], exports: [EclRatingFieldComponent] });
+/** @nocollapse */ EclRatingFieldComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclRatingFieldComponentModule, imports: [CommonModule, EclIconComponentModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclRatingFieldComponentModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, EclIconComponentModule],
+                    exports: [...COMPONENTS$1],
+                    declarations: [...COMPONENTS$1]
+                }]
+        }] });
+
 class EclSelectDirective extends ECLBaseDirective {
     constructor(ngControl, el, viewContainerRef) {
         super();
@@ -12100,13 +12307,13 @@ class EclSiteFooterComponent extends ECLBaseDirective {
     }
 }
 /** @nocollapse */ EclSiteFooterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclSiteFooterComponent, deps: [{ token: i2.TranslateService }, { token: EclLanguageService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ EclSiteFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclSiteFooterComponent, selector: "ecl-site-footer", inputs: { isCore: "isCore" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-container ecl-site-footer__container\">\n    <ng-container *ngIf=\"!isCore\">\n        <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n\n        <div eclSiteFooterRow>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection>\n                    <a eclLink\n                        href=\"https://ec.europa.eu/info/index_{{ languageCode }}\"\n                        eclSiteFooterLogoLink\n                        variant=\"standalone\"\n                        [attr.aria-label]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\">\n                        <img alt=\"European Commission logo\"\n                            [attr.title]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\"\n                            eclSiteFooterLogoImageDesktop\n                            src=\"assets/images/ecl/ec/logo/negative/logo-ec--{{ecLogoLanguageCode}}.svg\" />\n                    </a>\n                    <h2 eclSiteFooterTitle>\n                        <a eclLink\n                            variant=\"standalone\"\n                            href=\"https://ec.europa.eu/info/index_{{ languageCode }}\"\n                            eclSiteFooterTitleLink>\n                            {{ 'ecl.footer.EUROPEAN-COMMISSION' | translate }}\n                        </a>\n                    </h2>\n                </div>\n            </div>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection\n                    [isSplitList]=\"true\">\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.CONTACT-EC' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commission/contact_{{ languageCode }}\">\n                                {{ 'ecl.footer.CONTACT-EC' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://europa.eu/european-union/contact/social-networks_{{ languageCode }}\">\n                                {{ 'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.RESOURCES-FOR-PARTNERS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/resources-partners_{{ languageCode }}\">\n                                {{ 'ecl.footer.RESOURCES-FOR-PARTNERS' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection\n                    [isSplitList]=\"true\">\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LANGUAGE-POLICY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/language-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.LANGUAGE-POLICY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.COOKIES' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/cookies_{{ languageCode }}\">\n                                {{ 'ecl.footer.COOKIES' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.PRIVACY-POLICY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/privacy-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.PRIVACY-POLICY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LEGAL-NOTICE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/legal-notice_{{ languageCode }}\">\n                                {{ 'ecl.footer.LEGAL-NOTICE' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"isCore\">\n        <div eclSiteFooterRow>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection>\n                    <a eclLink\n                        routerLink=\"/\"\n                        variant=\"standalone\"\n                        class=\"ecl-site-footer__logo-link\"\n                        [attr.aria-label]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\">\n                        <img alt=\"European Commission logo\"\n                            [attr.title]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\"\n                            class=\"ecl-site-footer__logo-image-desktop\"\n                            src=\"assets/images/ecl/ec/logo/negative/logo-ec--{{ecLogoLanguageCode}}.svg\" /></a>\n                    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n                </div>\n            </div>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection\n                    [hasSeparator]=\"true\">\n                    <ul eclSiteFooterList\n                        [isColumns]=\"true\">\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.STRATEGY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/strategy_{{ languageCode }}\">\n                                {{ 'ecl.footer.STRATEGY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.ABOUT-EUROPEAN-COMMISSION' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commission_{{ languageCode }}\">\n                                {{ 'ecl.footer.ABOUT-EUROPEAN-COMMISSION' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.BUSINESS-ECONOMY-EURO' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/business-economy-euro_{{ languageCode }}\">\n                                {{ 'ecl.footer.BUSINESS-ECONOMY-EURO' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LIVE-WORK-TRAVEL' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/live-work-travel-eu_{{ languageCode }}\">\n                                {{ 'ecl.footer.LIVE-WORK-TRAVEL' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LAW' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/law_{{ languageCode }}\">\n                                {{ 'ecl.footer.LAW' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FUNDING-TENDERS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/funding-tenders_{{ languageCode }}\">\n                                {{ 'ecl.footer.FUNDING-TENDERS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.RESEARCH-INNOVATION' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/research-and-innovation_{{ languageCode }}\">\n                                {{ 'ecl.footer.RESEARCH-INNOVATION' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.ENERGY-CLIMATE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/energy-climate-change-environment_{{ languageCode }}\">\n                                {{ 'ecl.footer.ENERGY-CLIMATE' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.EDUCATION' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/education_{{ languageCode }}\">\n                                {{ 'ecl.footer.EDUCATION' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.AID-DEVELOPMENT' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/aid-development-cooperation-fundamental-rights_{{ languageCode }}\">\n                                {{ 'ecl.footer.AID-DEVELOPMENT' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FOOD' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/food-farming-fisheries_{{ languageCode }}\">\n                                {{ 'ecl.footer.FOOD' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.EU-REGIONAL' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/eu-regional-and-urban-development_{{ languageCode }}\">\n                                {{ 'ecl.footer.EU-REGIONAL' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.JOBS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/jobs-european-commission_{{ languageCode }}\">\n                                {{ 'ecl.footer.JOBS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.STATS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/statistics_{{ languageCode }}\">\n                                {{ 'ecl.footer.STATS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.NEWS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/commission/presscorner/home/{{ languageCode }}\">\n                                {{ 'ecl.footer.NEWS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.EVENTS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/events_{{ languageCode }}\">\n                                {{ 'ecl.footer.EVENTS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.PUBLICATIONS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/publications_{{ languageCode }}\">\n                                {{ 'ecl.footer.PUBLICATIONS' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div eclSiteFooterSection>\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.CONTACT-EC' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commission/contact_{{ languageCode }}\">\n                                {{ 'ecl.footer.CONTACT-EC' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.ACCESSIBILITY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://european-union.europa.eu/web-accessibility-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.ACCESSIBILITY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://europa.eu/european-union/contact/social-networks_{{ languageCode }}#n:+i:4+e:1+t:+s\">\n                                {{ 'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.RESOURCES-FOR-PARTNERS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/resources-partners_{{ languageCode }}\">\n                                {{ 'ecl.footer.RESOURCES-FOR-PARTNERS' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div eclSiteFooterSection>\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LANGUAGES-OUR-WEBSITES' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/languages-our-websites_{{ languageCode }}\">\n                                {{ 'ecl.footer.LANGUAGES-OUR-WEBSITES' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.COOKIES' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/cookies_{{ languageCode }}\">\n                                {{ 'ecl.footer.COOKIES' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.PRIVACY-POLICY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/privacy-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.PRIVACY-POLICY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LEGAL-NOTICE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/legal-notice_{{ languageCode }}\">\n                                {{ 'ecl.footer.LEGAL-NOTICE' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n    \n        </div>\n    </ng-container>\n\n    <ng-template #content>\n        <ng-content></ng-content>\n    </ng-template>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["variant", "isNegative", "isNoVisited"] }, { kind: "directive", type: EclSiteFooterSectionDirective, selector: "[eclSiteFooterSection]", inputs: ["isCondensed", "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: EclSiteFooterLogoImageDesktopDirective, selector: "[eclSiteFooterLogoImageDesktop]" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
+/** @nocollapse */ EclSiteFooterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclSiteFooterComponent, selector: "ecl-site-footer", inputs: { isCore: "isCore" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-container ecl-site-footer__container\">\n    <ng-container *ngIf=\"!isCore\">\n        <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n\n        <div eclSiteFooterRow>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection>\n                    <a eclLink\n                        href=\"https://ec.europa.eu/info/index_{{ languageCode }}\"\n                        eclSiteFooterLogoLink\n                        variant=\"standalone\"\n                        [attr.aria-label]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\">\n                        <img alt=\"European Commission logo\"\n                            [attr.title]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\"\n                            eclSiteFooterLogoImageDesktop\n                            src=\"assets/images/ecl/ec/logo/negative/logo-ec--{{ecLogoLanguageCode}}.svg\" />\n                    </a>\n                    <h2 eclSiteFooterTitle>\n                        <a eclLink\n                            variant=\"standalone\"\n                            href=\"https://ec.europa.eu/info/index_{{ languageCode }}\"\n                            eclSiteFooterTitleLink>\n                            {{ 'ecl.footer.EUROPEAN-COMMISSION' | translate }}\n                        </a>\n                    </h2>\n                </div>\n            </div>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection\n                    [isSplitList]=\"true\">\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.CONTACT-EC' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commission/contact_{{ languageCode }}\">\n                                {{ 'ecl.footer.CONTACT-EC' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://europa.eu/european-union/contact/social-networks_{{ languageCode }}\">\n                                {{ 'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate }}\n                                <ecl-icon icon=\"external\" size=\"2xs\"></ecl-icon>\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.RESOURCES-FOR-PARTNERS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/resources-partners_{{ languageCode }}\">\n                                {{ 'ecl.footer.RESOURCES-FOR-PARTNERS' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection\n                    [isSplitList]=\"true\">\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LANGUAGE-POLICY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/language-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.LANGUAGE-POLICY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.COOKIES' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/cookies_{{ languageCode }}\">\n                                {{ 'ecl.footer.COOKIES' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.PRIVACY-POLICY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/privacy-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.PRIVACY-POLICY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LEGAL-NOTICE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/legal-notice_{{ languageCode }}\">\n                                {{ 'ecl.footer.LEGAL-NOTICE' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"isCore\">\n        <div eclSiteFooterRow>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection>\n                    <a eclLink\n                        routerLink=\"/\"\n                        variant=\"standalone\"\n                        class=\"ecl-site-footer__logo-link\"\n                        [attr.aria-label]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\">\n                        <img alt=\"European Commission logo\"\n                            [attr.title]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\"\n                            class=\"ecl-site-footer__logo-image-desktop\"\n                            src=\"assets/images/ecl/ec/logo/negative/logo-ec--{{ecLogoLanguageCode}}.svg\" /></a>\n                    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n                </div>\n            </div>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection\n                    [hasSeparator]=\"true\">\n                    <ul eclSiteFooterList\n                        [isColumns]=\"true\">\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.STRATEGY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/strategy_{{ languageCode }}\">\n                                {{ 'ecl.footer.STRATEGY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.ABOUT-EUROPEAN-COMMISSION' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commission_{{ languageCode }}\">\n                                {{ 'ecl.footer.ABOUT-EUROPEAN-COMMISSION' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.BUSINESS-ECONOMY-EURO' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/business-economy-euro_{{ languageCode }}\">\n                                {{ 'ecl.footer.BUSINESS-ECONOMY-EURO' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LIVE-WORK-TRAVEL' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/live-work-travel-eu_{{ languageCode }}\">\n                                {{ 'ecl.footer.LIVE-WORK-TRAVEL' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LAW' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/law_{{ languageCode }}\">\n                                {{ 'ecl.footer.LAW' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FUNDING-TENDERS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/funding-tenders_{{ languageCode }}\">\n                                {{ 'ecl.footer.FUNDING-TENDERS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.RESEARCH-INNOVATION' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/research-and-innovation_{{ languageCode }}\">\n                                {{ 'ecl.footer.RESEARCH-INNOVATION' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.ENERGY-CLIMATE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/energy-climate-change-environment_{{ languageCode }}\">\n                                {{ 'ecl.footer.ENERGY-CLIMATE' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.EDUCATION' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/education_{{ languageCode }}\">\n                                {{ 'ecl.footer.EDUCATION' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.AID-DEVELOPMENT' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/aid-development-cooperation-fundamental-rights_{{ languageCode }}\">\n                                {{ 'ecl.footer.AID-DEVELOPMENT' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FOOD' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/food-farming-fisheries_{{ languageCode }}\">\n                                {{ 'ecl.footer.FOOD' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.EU-REGIONAL' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/eu-regional-and-urban-development_{{ languageCode }}\">\n                                {{ 'ecl.footer.EU-REGIONAL' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.JOBS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/jobs-european-commission_{{ languageCode }}\">\n                                {{ 'ecl.footer.JOBS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.STATS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/statistics_{{ languageCode }}\">\n                                {{ 'ecl.footer.STATS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.NEWS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/commission/presscorner/home/{{ languageCode }}\">\n                                {{ 'ecl.footer.NEWS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.EVENTS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/events_{{ languageCode }}\">\n                                {{ 'ecl.footer.EVENTS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.PUBLICATIONS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/publications_{{ languageCode }}\">\n                                {{ 'ecl.footer.PUBLICATIONS' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div eclSiteFooterSection>\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.ABOUT-COMMISSION-WEB-PRESENCE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commissions-web-presence_{{ languageCode }}\">\n                                {{ 'ecl.footer.ABOUT-COMMISSION-WEB-PRESENCE' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.CONTACT-EC' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commission/contact_{{ languageCode }}\">\n                                {{ 'ecl.footer.CONTACT-EC' | translate }}\n                            </a>\n                        </li>\n                        \n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://europa.eu/european-union/contact/social-networks_{{ languageCode }}#n:+i:4+e:1+t:+s\">\n                                {{ 'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate }}\n                                <ecl-icon icon=\"external\" size=\"2xs\"></ecl-icon>\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.RESOURCES-FOR-PARTNERS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/resources-partners_{{ languageCode }}\">\n                                {{ 'ecl.footer.RESOURCES-FOR-PARTNERS' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div eclSiteFooterSection>\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LANGUAGES-OUR-WEBSITES' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/languages-our-websites_{{ languageCode }}\">\n                                {{ 'ecl.footer.LANGUAGES-OUR-WEBSITES' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.COOKIES' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/cookies_{{ languageCode }}\">\n                                {{ 'ecl.footer.COOKIES' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.PRIVACY-POLICY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/privacy-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.PRIVACY-POLICY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LEGAL-NOTICE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/legal-notice_{{ languageCode }}\">\n                                {{ 'ecl.footer.LEGAL-NOTICE' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n    \n        </div>\n    </ng-container>\n\n    <ng-template #content>\n        <ng-content></ng-content>\n    </ng-template>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["variant", "isNegative", "isNoVisited"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "isInverted", "ariaHidden", "focusable"] }, { kind: "directive", type: EclSiteFooterSectionDirective, selector: "[eclSiteFooterSection]", inputs: ["isCondensed", "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: EclSiteFooterLogoImageDesktopDirective, selector: "[eclSiteFooterLogoImageDesktop]" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
 __decorate([
     coerceBoolean
 ], EclSiteFooterComponent.prototype, "isCore", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclSiteFooterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ecl-site-footer', template: "<div class=\"ecl-container ecl-site-footer__container\">\n    <ng-container *ngIf=\"!isCore\">\n        <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n\n        <div eclSiteFooterRow>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection>\n                    <a eclLink\n                        href=\"https://ec.europa.eu/info/index_{{ languageCode }}\"\n                        eclSiteFooterLogoLink\n                        variant=\"standalone\"\n                        [attr.aria-label]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\">\n                        <img alt=\"European Commission logo\"\n                            [attr.title]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\"\n                            eclSiteFooterLogoImageDesktop\n                            src=\"assets/images/ecl/ec/logo/negative/logo-ec--{{ecLogoLanguageCode}}.svg\" />\n                    </a>\n                    <h2 eclSiteFooterTitle>\n                        <a eclLink\n                            variant=\"standalone\"\n                            href=\"https://ec.europa.eu/info/index_{{ languageCode }}\"\n                            eclSiteFooterTitleLink>\n                            {{ 'ecl.footer.EUROPEAN-COMMISSION' | translate }}\n                        </a>\n                    </h2>\n                </div>\n            </div>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection\n                    [isSplitList]=\"true\">\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.CONTACT-EC' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commission/contact_{{ languageCode }}\">\n                                {{ 'ecl.footer.CONTACT-EC' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://europa.eu/european-union/contact/social-networks_{{ languageCode }}\">\n                                {{ 'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.RESOURCES-FOR-PARTNERS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/resources-partners_{{ languageCode }}\">\n                                {{ 'ecl.footer.RESOURCES-FOR-PARTNERS' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection\n                    [isSplitList]=\"true\">\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LANGUAGE-POLICY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/language-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.LANGUAGE-POLICY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.COOKIES' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/cookies_{{ languageCode }}\">\n                                {{ 'ecl.footer.COOKIES' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.PRIVACY-POLICY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/privacy-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.PRIVACY-POLICY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LEGAL-NOTICE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/legal-notice_{{ languageCode }}\">\n                                {{ 'ecl.footer.LEGAL-NOTICE' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"isCore\">\n        <div eclSiteFooterRow>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection>\n                    <a eclLink\n                        routerLink=\"/\"\n                        variant=\"standalone\"\n                        class=\"ecl-site-footer__logo-link\"\n                        [attr.aria-label]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\">\n                        <img alt=\"European Commission logo\"\n                            [attr.title]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\"\n                            class=\"ecl-site-footer__logo-image-desktop\"\n                            src=\"assets/images/ecl/ec/logo/negative/logo-ec--{{ecLogoLanguageCode}}.svg\" /></a>\n                    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n                </div>\n            </div>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection\n                    [hasSeparator]=\"true\">\n                    <ul eclSiteFooterList\n                        [isColumns]=\"true\">\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.STRATEGY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/strategy_{{ languageCode }}\">\n                                {{ 'ecl.footer.STRATEGY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.ABOUT-EUROPEAN-COMMISSION' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commission_{{ languageCode }}\">\n                                {{ 'ecl.footer.ABOUT-EUROPEAN-COMMISSION' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.BUSINESS-ECONOMY-EURO' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/business-economy-euro_{{ languageCode }}\">\n                                {{ 'ecl.footer.BUSINESS-ECONOMY-EURO' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LIVE-WORK-TRAVEL' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/live-work-travel-eu_{{ languageCode }}\">\n                                {{ 'ecl.footer.LIVE-WORK-TRAVEL' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LAW' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/law_{{ languageCode }}\">\n                                {{ 'ecl.footer.LAW' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FUNDING-TENDERS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/funding-tenders_{{ languageCode }}\">\n                                {{ 'ecl.footer.FUNDING-TENDERS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.RESEARCH-INNOVATION' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/research-and-innovation_{{ languageCode }}\">\n                                {{ 'ecl.footer.RESEARCH-INNOVATION' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.ENERGY-CLIMATE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/energy-climate-change-environment_{{ languageCode }}\">\n                                {{ 'ecl.footer.ENERGY-CLIMATE' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.EDUCATION' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/education_{{ languageCode }}\">\n                                {{ 'ecl.footer.EDUCATION' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.AID-DEVELOPMENT' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/aid-development-cooperation-fundamental-rights_{{ languageCode }}\">\n                                {{ 'ecl.footer.AID-DEVELOPMENT' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FOOD' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/food-farming-fisheries_{{ languageCode }}\">\n                                {{ 'ecl.footer.FOOD' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.EU-REGIONAL' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/eu-regional-and-urban-development_{{ languageCode }}\">\n                                {{ 'ecl.footer.EU-REGIONAL' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.JOBS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/jobs-european-commission_{{ languageCode }}\">\n                                {{ 'ecl.footer.JOBS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.STATS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/statistics_{{ languageCode }}\">\n                                {{ 'ecl.footer.STATS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.NEWS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/commission/presscorner/home/{{ languageCode }}\">\n                                {{ 'ecl.footer.NEWS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.EVENTS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/events_{{ languageCode }}\">\n                                {{ 'ecl.footer.EVENTS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.PUBLICATIONS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/publications_{{ languageCode }}\">\n                                {{ 'ecl.footer.PUBLICATIONS' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div eclSiteFooterSection>\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.CONTACT-EC' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commission/contact_{{ languageCode }}\">\n                                {{ 'ecl.footer.CONTACT-EC' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.ACCESSIBILITY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://european-union.europa.eu/web-accessibility-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.ACCESSIBILITY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://europa.eu/european-union/contact/social-networks_{{ languageCode }}#n:+i:4+e:1+t:+s\">\n                                {{ 'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.RESOURCES-FOR-PARTNERS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/resources-partners_{{ languageCode }}\">\n                                {{ 'ecl.footer.RESOURCES-FOR-PARTNERS' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div eclSiteFooterSection>\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LANGUAGES-OUR-WEBSITES' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/languages-our-websites_{{ languageCode }}\">\n                                {{ 'ecl.footer.LANGUAGES-OUR-WEBSITES' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.COOKIES' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/cookies_{{ languageCode }}\">\n                                {{ 'ecl.footer.COOKIES' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.PRIVACY-POLICY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/privacy-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.PRIVACY-POLICY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LEGAL-NOTICE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/legal-notice_{{ languageCode }}\">\n                                {{ 'ecl.footer.LEGAL-NOTICE' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n    \n        </div>\n    </ng-container>\n\n    <ng-template #content>\n        <ng-content></ng-content>\n    </ng-template>\n</div>\n" }]
+            args: [{ selector: 'ecl-site-footer', template: "<div class=\"ecl-container ecl-site-footer__container\">\n    <ng-container *ngIf=\"!isCore\">\n        <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n\n        <div eclSiteFooterRow>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection>\n                    <a eclLink\n                        href=\"https://ec.europa.eu/info/index_{{ languageCode }}\"\n                        eclSiteFooterLogoLink\n                        variant=\"standalone\"\n                        [attr.aria-label]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\">\n                        <img alt=\"European Commission logo\"\n                            [attr.title]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\"\n                            eclSiteFooterLogoImageDesktop\n                            src=\"assets/images/ecl/ec/logo/negative/logo-ec--{{ecLogoLanguageCode}}.svg\" />\n                    </a>\n                    <h2 eclSiteFooterTitle>\n                        <a eclLink\n                            variant=\"standalone\"\n                            href=\"https://ec.europa.eu/info/index_{{ languageCode }}\"\n                            eclSiteFooterTitleLink>\n                            {{ 'ecl.footer.EUROPEAN-COMMISSION' | translate }}\n                        </a>\n                    </h2>\n                </div>\n            </div>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection\n                    [isSplitList]=\"true\">\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.CONTACT-EC' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commission/contact_{{ languageCode }}\">\n                                {{ 'ecl.footer.CONTACT-EC' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://europa.eu/european-union/contact/social-networks_{{ languageCode }}\">\n                                {{ 'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate }}\n                                <ecl-icon icon=\"external\" size=\"2xs\"></ecl-icon>\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.RESOURCES-FOR-PARTNERS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/resources-partners_{{ languageCode }}\">\n                                {{ 'ecl.footer.RESOURCES-FOR-PARTNERS' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection\n                    [isSplitList]=\"true\">\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LANGUAGE-POLICY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/language-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.LANGUAGE-POLICY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.COOKIES' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/cookies_{{ languageCode }}\">\n                                {{ 'ecl.footer.COOKIES' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.PRIVACY-POLICY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/privacy-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.PRIVACY-POLICY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LEGAL-NOTICE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/legal-notice_{{ languageCode }}\">\n                                {{ 'ecl.footer.LEGAL-NOTICE' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </div>\n    </ng-container>\n\n    <ng-container *ngIf=\"isCore\">\n        <div eclSiteFooterRow>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection>\n                    <a eclLink\n                        routerLink=\"/\"\n                        variant=\"standalone\"\n                        class=\"ecl-site-footer__logo-link\"\n                        [attr.aria-label]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\">\n                        <img alt=\"European Commission logo\"\n                            [attr.title]=\"'ecl.footer.EUROPEAN-COMMISSION' | translate\"\n                            class=\"ecl-site-footer__logo-image-desktop\"\n                            src=\"assets/images/ecl/ec/logo/negative/logo-ec--{{ecLogoLanguageCode}}.svg\" /></a>\n                    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n                </div>\n            </div>\n            <div eclSiteFooterColumn>\n                <div eclSiteFooterSection\n                    [hasSeparator]=\"true\">\n                    <ul eclSiteFooterList\n                        [isColumns]=\"true\">\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.STRATEGY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/strategy_{{ languageCode }}\">\n                                {{ 'ecl.footer.STRATEGY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.ABOUT-EUROPEAN-COMMISSION' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commission_{{ languageCode }}\">\n                                {{ 'ecl.footer.ABOUT-EUROPEAN-COMMISSION' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.BUSINESS-ECONOMY-EURO' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/business-economy-euro_{{ languageCode }}\">\n                                {{ 'ecl.footer.BUSINESS-ECONOMY-EURO' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LIVE-WORK-TRAVEL' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/live-work-travel-eu_{{ languageCode }}\">\n                                {{ 'ecl.footer.LIVE-WORK-TRAVEL' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LAW' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/law_{{ languageCode }}\">\n                                {{ 'ecl.footer.LAW' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FUNDING-TENDERS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/funding-tenders_{{ languageCode }}\">\n                                {{ 'ecl.footer.FUNDING-TENDERS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.RESEARCH-INNOVATION' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/research-and-innovation_{{ languageCode }}\">\n                                {{ 'ecl.footer.RESEARCH-INNOVATION' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.ENERGY-CLIMATE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/energy-climate-change-environment_{{ languageCode }}\">\n                                {{ 'ecl.footer.ENERGY-CLIMATE' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.EDUCATION' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/education_{{ languageCode }}\">\n                                {{ 'ecl.footer.EDUCATION' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.AID-DEVELOPMENT' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/aid-development-cooperation-fundamental-rights_{{ languageCode }}\">\n                                {{ 'ecl.footer.AID-DEVELOPMENT' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FOOD' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/food-farming-fisheries_{{ languageCode }}\">\n                                {{ 'ecl.footer.FOOD' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.EU-REGIONAL' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/eu-regional-and-urban-development_{{ languageCode }}\">\n                                {{ 'ecl.footer.EU-REGIONAL' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.JOBS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/jobs-european-commission_{{ languageCode }}\">\n                                {{ 'ecl.footer.JOBS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.STATS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/statistics_{{ languageCode }}\">\n                                {{ 'ecl.footer.STATS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.NEWS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/commission/presscorner/home/{{ languageCode }}\">\n                                {{ 'ecl.footer.NEWS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.EVENTS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/events_{{ languageCode }}\">\n                                {{ 'ecl.footer.EVENTS' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.PUBLICATIONS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/publications_{{ languageCode }}\">\n                                {{ 'ecl.footer.PUBLICATIONS' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div eclSiteFooterSection>\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.ABOUT-COMMISSION-WEB-PRESENCE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commissions-web-presence_{{ languageCode }}\">\n                                {{ 'ecl.footer.ABOUT-COMMISSION-WEB-PRESENCE' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.CONTACT-EC' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/about-european-commission/contact_{{ languageCode }}\">\n                                {{ 'ecl.footer.CONTACT-EC' | translate }}\n                            </a>\n                        </li>\n                        \n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://europa.eu/european-union/contact/social-networks_{{ languageCode }}#n:+i:4+e:1+t:+s\">\n                                {{ 'ecl.footer.FOLLOW-EUROPEAN-COMMISSION-SOCIAL-MEDIA' | translate }}\n                                <ecl-icon icon=\"external\" size=\"2xs\"></ecl-icon>\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.RESOURCES-FOR-PARTNERS' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/resources-partners_{{ languageCode }}\">\n                                {{ 'ecl.footer.RESOURCES-FOR-PARTNERS' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n\n                <div eclSiteFooterSection>\n                    <ul eclSiteFooterList>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LANGUAGES-OUR-WEBSITES' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/languages-our-websites_{{ languageCode }}\">\n                                {{ 'ecl.footer.LANGUAGES-OUR-WEBSITES' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.COOKIES' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/cookies_{{ languageCode }}\">\n                                {{ 'ecl.footer.COOKIES' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.PRIVACY-POLICY' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/privacy-policy_{{ languageCode }}\">\n                                {{ 'ecl.footer.PRIVACY-POLICY' | translate }}\n                            </a>\n                        </li>\n                        <li eclSiteFooterListItem>\n                            <a eclLink\n                                eclSiteFooterLink\n                                [attr.aria-label]=\"'ecl.footer.LEGAL-NOTICE' | translate\"\n                                variant=\"standalone\"\n                                href=\"https://ec.europa.eu/info/legal-notice_{{ languageCode }}\">\n                                {{ 'ecl.footer.LEGAL-NOTICE' | translate }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n    \n        </div>\n    </ng-container>\n\n    <ng-template #content>\n        <ng-content></ng-content>\n    </ng-template>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i2.TranslateService }, { type: EclLanguageService }]; }, propDecorators: { isCore: [{
                 type: Input
             }], cssClasses: [{
@@ -12777,19 +12984,19 @@ class EclTabSelectEvent extends EclBaseEvent {
     }
 }
 class EclTabComponent extends ECLBaseDirective {
-    constructor(el) {
+    constructor(el, _sanitizer) {
         super();
         this.el = el;
+        this._sanitizer = _sanitizer;
         this.isHidden = false;
         this.isActive = false;
-        this.isMore = false;
         this.select = new EventEmitter();
         this.role = 'listitem';
+        this.contentChange$ = new Subject();
     }
     get cssClasses() {
         return [
-            super.getCssClasses('ecl-tabs__item'),
-            this.isMore ? 'ecl-tabs__item--more' : '',
+            super.getCssClasses('ecl-tabs__item')
         ].join(' ').trim();
     }
     onTabClick(evt) {
@@ -12798,9 +13005,12 @@ class EclTabComponent extends ECLBaseDirective {
     get hostElement() {
         return this.el.nativeElement;
     }
+    get linkContents() {
+        return this.linkContentElement ? this._sanitizer.bypassSecurityTrustHtml(this.linkContentElement.innerHTML) : '';
+    }
 }
-/** @nocollapse */ EclTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclTabComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ EclTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclTabComponent, selector: "ecl-tab", inputs: { id: "id", isHidden: "isHidden", isActive: "isActive", isMore: "isMore" }, outputs: { select: "select" }, host: { properties: { "attr.aria-hidden": "this.isHidden", "attr.role": "this.role", "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "tabContentTemplate", first: true, predicate: ["content"], descendants: true }], usesInheritance: true, ngImport: i0, template: "    <a eclLink \n        (click)=\"onTabClick($event)\"\n        class=\"ecl-tabs__link\" \n        [class.ecl-tabs__link--active]=\"isActive\">\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: ["variant", "isNegative", "isNoVisited"] }] });
+/** @nocollapse */ EclTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclTabComponent, deps: [{ token: i0.ElementRef }, { token: i1$2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ EclTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclTabComponent, selector: "ecl-tab", inputs: { id: "id", isHidden: "isHidden", isActive: "isActive" }, outputs: { select: "select" }, host: { properties: { "attr.aria-hidden": "this.isHidden", "attr.role": "this.role", "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "tabContentTemplate", first: true, predicate: ["content"], descendants: true }, { propertyName: "linkContentElement", first: true, predicate: ["linkContent"], descendants: true }], usesInheritance: true, ngImport: i0, template: "    <a eclLink \n        #linkContent\n        (click)=\"onTabClick($event)\"\n        class=\"ecl-tabs__link\" \n        [class.ecl-tabs__link--active]=\"isActive\">\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", styles: [":host{display:list-item}\n"], dependencies: [{ kind: "directive", type: EclLinkDirective, selector: "[eclLink]", inputs: ["variant", "isNegative", "isNoVisited"] }] });
 __decorate([
     coerceBoolean
 ], EclTabComponent.prototype, "isHidden", void 0);
@@ -12808,12 +13018,12 @@ __decorate([
     coerceBoolean
 ], EclTabComponent.prototype, "isActive", void 0);
 __decorate([
-    coerceBoolean
-], EclTabComponent.prototype, "isMore", void 0);
+    coerceElement
+], EclTabComponent.prototype, "linkContentElement", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclTabComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ecl-tab', template: "    <a eclLink \n        (click)=\"onTabClick($event)\"\n        class=\"ecl-tabs__link\" \n        [class.ecl-tabs__link--active]=\"isActive\">\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: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { id: [{
+            args: [{ selector: 'ecl-tab', template: "    <a eclLink \n        #linkContent\n        (click)=\"onTabClick($event)\"\n        class=\"ecl-tabs__link\" \n        [class.ecl-tabs__link--active]=\"isActive\">\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", styles: [":host{display:list-item}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$2.DomSanitizer }]; }, propDecorators: { id: [{
                 type: Input
             }], isHidden: [{
                 type: Input
@@ -12822,13 +13032,51 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                 args: ['attr.aria-hidden']
             }], isActive: [{
                 type: Input
-            }], isMore: [{
-                type: Input
             }], select: [{
                 type: Output
             }], tabContentTemplate: [{
                 type: ViewChild,
                 args: ['content']
+            }], linkContentElement: [{
+                type: ViewChild,
+                args: ['linkContent']
+            }], role: [{
+                type: HostBinding,
+                args: ['attr.role']
+            }], cssClasses: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
+
+class EclTabMoreComponent extends ECLBaseDirective {
+    constructor(el) {
+        super();
+        this.el = el;
+        this.isHidden = false;
+        this.role = 'listitem';
+    }
+    get cssClasses() {
+        return [
+            super.getCssClasses('ecl-tabs__item ecl-tabs__item--more'),
+        ].join(' ').trim();
+    }
+    get hostElement() {
+        return this.el.nativeElement;
+    }
+}
+/** @nocollapse */ EclTabMoreComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclTabMoreComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+/** @nocollapse */ EclTabMoreComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", 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: i0, template: "<ng-content></ng-content>", styles: [":host{display:list-item}\n"] });
+__decorate([
+    coerceBoolean
+], EclTabMoreComponent.prototype, "isHidden", void 0);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclTabMoreComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ecl-tab-more', template: "<ng-content></ng-content>", styles: [":host{display:list-item}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { isHidden: [{
+                type: Input
+            }, {
+                type: HostBinding,
+                args: ['attr.aria-hidden']
             }], role: [{
                 type: HostBinding,
                 args: ['attr.role']
@@ -12842,27 +13090,28 @@ class EclTabsComponent extends ECLBaseDirective {
         super();
         this.differs = differs;
         this.cd = cd;
-        this.activeTabIndex = 0;
-        this.bodyClass = '';
+        this.bodyClass = 'ecl-u-mt-s';
         this.tabSelect = new EventEmitter();
-        this.cmpClass = true;
-        this.role = 'navigation';
+        this.isMoreDropdownExpanded = false;
+        this.isMoreButtonActive = false;
         this.destroy$ = new Subject();
         this.differ = this.differs.find([]).create();
     }
-    get isMoreHidden() {
-        return true;
+    get isMoreDropdownHidden() {
+        return false;
     }
     ngAfterViewInit() {
         this.cd.detectChanges();
+        this.dropdownTabs.forEach((tab, idx) => {
+            tab.select
+                .pipe(takeUntil$1(this.destroy$))
+                .subscribe(() => {
+                this.onTabSelect(this.tabs.get(idx));
+            });
+        });
     }
     ngAfterContentInit() {
         this.observeTabsChanges();
-        // this.tabs.forEach((tab, index) => {
-        //     if(index == this.activeTabIndex) {
-        //         tab.isActive = true;
-        //     }
-        // });
     }
     ngOnDestroy() {
         this.destroy$.next(true);
@@ -12878,17 +13127,26 @@ class EclTabsComponent extends ECLBaseDirective {
     onScrollNext() {
         console.log('scroll next');
     }
-    onMoreToggle() {
-        console.log('more toggle');
+    onMoreDropdownToggle() {
+        this.toggleMoreDropdown();
+    }
+    onMoreDropdownClickOutside() {
+        this.closeMoreDropdown();
+    }
+    closeMoreDropdown() {
+        this.isMoreDropdownExpanded = false;
+    }
+    toggleMoreDropdown() {
+        this.isMoreDropdownExpanded = !this.isMoreDropdownExpanded;
     }
     observeTabsChanges() {
         this.diff = this.differ.diff(this.tabs);
-        this.createTabsChangesObservable()
+        this.createTabsChangesObservable(this.tabs)
             .pipe(takeUntil$1(this.destroy$))
             .subscribe(this.onTabsChanges.bind(this));
     }
-    createTabsChangesObservable() {
-        return of(this.tabs).pipe(mergeWith(this.tabs.changes), takeUntil$1(this.destroy$));
+    createTabsChangesObservable(tabs) {
+        return of(tabs).pipe(mergeWith(tabs.changes), takeUntil$1(this.destroy$));
     }
     onTabsChanges() {
         this.diff = this.differ.diff(this.tabs);
@@ -12901,17 +13159,28 @@ class EclTabsComponent extends ECLBaseDirective {
             this.diff.forEachAddedItem(change => {
                 this.connectTabEvents(change.item);
             });
+            this.diff.forEachRemovedItem(change => {
+                this.disconnectTabEvents(change.item);
+            });
         }
     }
     connectTabEvents(tab) {
         tab.select
             .pipe(takeUntil$1(this.destroy$))
             .subscribe(() => {
-            this.deactivateAllTabs(this.tabs.toArray());
-            this.activateTab(tab);
-            this.sendTabSelectEvent(tab);
+            this.onTabSelect(tab);
         });
     }
+    onTabSelect(tab) {
+        this.deactivateAllTabs(this.tabs.toArray());
+        this.activateTab(tab);
+        this.sendTabSelectEvent(tab);
+    }
+    disconnectTabEvents(tab) {
+        if (tab && tab.select) {
+            tab.select.unsubscribe();
+        }
+    }
     deactivateAllTabs(tabs) {
         tabs.forEach(it => {
             it.isActive = false;
@@ -12925,7 +13194,10 @@ class EclTabsComponent extends ECLBaseDirective {
     }
 }
 /** @nocollapse */ EclTabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclTabsComponent, deps: [{ token: i0.IterableDiffers }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ EclTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclTabsComponent, selector: "ecl-tabs", inputs: { activeTabIndex: "activeTabIndex", bodyClass: "bodyClass" }, outputs: { tabSelect: "tabSelect" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class.ecl-tabs": "this.cmpClass", "attr.role": "this.role" } }, queries: [{ propertyName: "tabs", predicate: i0.forwardRef(function () { return EclTabComponent; }) }], viewQueries: [{ propertyName: "moreButtonElement", first: true, predicate: ["moreButton"], descendants: true, read: ElementRef }, { propertyName: "tabsListElement", first: true, predicate: ["tabsList"], descendants: true }, { propertyName: "dropdownListElement", first: true, predicate: ["dropdownList"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-tabs__container\">\n    <ul #tabsList class=\"ecl-tabs__list\">\n        <ng-content select=\"ecl-tab\"></ng-content>\n\n        <ecl-tab [isMore]=\"true\" [isHidden]=\"false\">\n            <ecl-tab-label>\n                <button \n                    #moreButton\n                    eclButton \n                    (click)=\"onMoreToggle()\"\n                    variant=\"secondary\" \n                    [attr.aria-expanded]=\"false\"\n                    class=\"ecl-tabs__toggle\">\n                    {{ 'ecl.common.MORE' | translate }}\n                </button>\n                <ul #dropdownList class=\"ecl-tabs__dropdown\">\n\n                </ul>\n            </ecl-tab-label>\n        </ecl-tab>\n    </ul>\n</div>\n<div class=\"ecl-tabs__controls\">\n    <button eclButton (click)=\"onScrollPrev()\" class=\"ecl-tabs__prev\">\n        <ecl-icon \n            icon=\"corner-arrow\" \n            color=\"inverted\" \n            transform=\"rotate-270\" \n            size=\"m\"\n            class=\"ecl-u-d-block\">\n        </ecl-icon>\n    </button>\n    <button eclButton (click)=\"onScrollNext()\" class=\"ecl-tabs__next\">\n        <ecl-icon \n            icon=\"corner-arrow\" \n            color=\"inverted\" \n            transform=\"rotate-90\" \n            size=\"m\"\n            class=\"ecl-u-d-block\">\n        </ecl-icon>\n    </button>\n</div>\n\n<ng-container *ngFor=\"let c of tabs.toArray()\">\n    <div class=\"{{ bodyClass }}\" *ngIf=\"c.isActive\">\n        <ng-container *ngTemplateOutlet=\"c.tabContentTemplate\"></ng-container>\n    </div>\n</ng-container>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["variant", "containerStyleClass"] }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "isInverted", "ariaHidden", "focusable"] }, { kind: "component", type: EclTabComponent, selector: "ecl-tab", inputs: ["id", "isHidden", "isActive", "isMore"], outputs: ["select"] }, { kind: "component", type: EclTabLabelComponent, selector: "ecl-tab-label" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
+/** @nocollapse */ EclTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.0-next.4", type: EclTabsComponent, selector: "ecl-tabs", inputs: { bodyClass: "bodyClass" }, outputs: { tabSelect: "tabSelect" }, host: { listeners: { "window:resize": "onResize($event)" } }, queries: [{ propertyName: "tabs", predicate: i0.forwardRef(function () { return EclTabComponent; }) }], viewQueries: [{ propertyName: "moreTabComponent", first: true, predicate: ["moreTab"], descendants: true }, { propertyName: "moreButtonElement", first: true, predicate: ["moreButton"], descendants: true, read: ElementRef }, { propertyName: "tabsListElement", first: true, predicate: ["tabsList"], descendants: true }, { propertyName: "dropdownListElement", first: true, predicate: ["dropdownList"], descendants: true }, { propertyName: "dropdownTabs", predicate: i0.forwardRef(function () { return EclTabComponent; }), descendants: true }], usesInheritance: true, ngImport: i0, template: "<nav class=\"ecl-tabs\">\n    <div class=\"ecl-tabs__container\">\n        <ul #tabsList class=\"ecl-tabs__list\">\n            <ng-content select=\"ecl-tab\"></ng-content>\n\n            <ecl-tab-more [isHidden]=\"isMoreDropdownHidden\" (eclClickOutside)=\"onMoreDropdownClickOutside()\">\n                <button \n                    #moreButton\n                    eclButton \n                    (click)=\"onMoreDropdownToggle()\"\n                    variant=\"secondary\" \n                    [attr.aria-expanded]=\"isMoreDropdownExpanded\"\n                    class=\"ecl-tabs__toggle\"\n                    [class.ecl-tabs__toggle--active]=\"isMoreButtonActive\">\n                    <span eclButtonLabel>{{ 'ecl.common.MORE' | translate }}</span>\n                    <ecl-icon icon=\"corner-arrow\" transform=\"rotate-180\" size=\"fluid\"></ecl-icon>\n                </button>\n\n                <ul #dropdownList class=\"ecl-tabs__dropdown\" [class.ecl-tabs__dropdown--show]=\"isMoreDropdownExpanded\">\n                    <ng-container *ngFor=\"let tab of tabs.toArray()\">\n                        <ecl-tab [isActive]=\"tab.isActive\">\n                            <ecl-tab-label [innerHTML]=\"tab.linkContents\"></ecl-tab-label>\n                        </ecl-tab>\n                    </ng-container>\n                </ul>\n            </ecl-tab-more>\n        </ul>\n    </div>\n    <div class=\"ecl-tabs__controls\">\n        <button eclButton (click)=\"onScrollPrev()\" class=\"ecl-tabs__prev\">\n            <ecl-icon \n                icon=\"corner-arrow\" \n                color=\"inverted\" \n                transform=\"rotate-270\" \n                size=\"m\"\n                class=\"ecl-u-d-block\">\n            </ecl-icon>\n        </button>\n        <button eclButton (click)=\"onScrollNext()\" class=\"ecl-tabs__next\">\n            <ecl-icon \n                icon=\"corner-arrow\" \n                color=\"inverted\" \n                transform=\"rotate-90\" \n                size=\"m\"\n                class=\"ecl-u-d-block\">\n            </ecl-icon>\n        </button>\n    </div>\n</nav>\n\n<ng-container *ngFor=\"let tab of tabs.toArray()\">\n    <div class=\"{{ bodyClass }}\" *ngIf=\"tab.isActive\">\n        <ng-container *ngTemplateOutlet=\"tab.tabContentTemplate\"></ng-container>\n    </div>\n</ng-container>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ECLClickOutsideDirective, selector: "[eclClickOutside]", outputs: ["eclClickOutside"] }, { kind: "component", type: EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["variant", "containerStyleClass"] }, { kind: "directive", type: EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "isInverted", "ariaHidden", "focusable"] }, { kind: "component", type: EclTabComponent, selector: "ecl-tab", inputs: ["id", "isHidden", "isActive"], outputs: ["select"] }, { kind: "component", type: EclTabMoreComponent, selector: "ecl-tab-more", inputs: ["isHidden"] }, { kind: "component", type: EclTabLabelComponent, selector: "ecl-tab-label" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
+__decorate([
+    coerceElement
+], EclTabsComponent.prototype, "moreTabComponent", void 0);
 __decorate([
     coerceElement
 ], EclTabsComponent.prototype, "moreButtonElement", void 0);
@@ -12937,22 +13209,20 @@ __decorate([
 ], EclTabsComponent.prototype, "dropdownListElement", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclTabsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ecl-tabs', template: "<div class=\"ecl-tabs__container\">\n    <ul #tabsList class=\"ecl-tabs__list\">\n        <ng-content select=\"ecl-tab\"></ng-content>\n\n        <ecl-tab [isMore]=\"true\" [isHidden]=\"false\">\n            <ecl-tab-label>\n                <button \n                    #moreButton\n                    eclButton \n                    (click)=\"onMoreToggle()\"\n                    variant=\"secondary\" \n                    [attr.aria-expanded]=\"false\"\n                    class=\"ecl-tabs__toggle\">\n                    {{ 'ecl.common.MORE' | translate }}\n                </button>\n                <ul #dropdownList class=\"ecl-tabs__dropdown\">\n\n                </ul>\n            </ecl-tab-label>\n        </ecl-tab>\n    </ul>\n</div>\n<div class=\"ecl-tabs__controls\">\n    <button eclButton (click)=\"onScrollPrev()\" class=\"ecl-tabs__prev\">\n        <ecl-icon \n            icon=\"corner-arrow\" \n            color=\"inverted\" \n            transform=\"rotate-270\" \n            size=\"m\"\n            class=\"ecl-u-d-block\">\n        </ecl-icon>\n    </button>\n    <button eclButton (click)=\"onScrollNext()\" class=\"ecl-tabs__next\">\n        <ecl-icon \n            icon=\"corner-arrow\" \n            color=\"inverted\" \n            transform=\"rotate-90\" \n            size=\"m\"\n            class=\"ecl-u-d-block\">\n        </ecl-icon>\n    </button>\n</div>\n\n<ng-container *ngFor=\"let c of tabs.toArray()\">\n    <div class=\"{{ bodyClass }}\" *ngIf=\"c.isActive\">\n        <ng-container *ngTemplateOutlet=\"c.tabContentTemplate\"></ng-container>\n    </div>\n</ng-container>" }]
-        }], ctorParameters: function () { return [{ type: i0.IterableDiffers }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { activeTabIndex: [{
-                type: Input
-            }], bodyClass: [{
+            args: [{ selector: 'ecl-tabs', template: "<nav class=\"ecl-tabs\">\n    <div class=\"ecl-tabs__container\">\n        <ul #tabsList class=\"ecl-tabs__list\">\n            <ng-content select=\"ecl-tab\"></ng-content>\n\n            <ecl-tab-more [isHidden]=\"isMoreDropdownHidden\" (eclClickOutside)=\"onMoreDropdownClickOutside()\">\n                <button \n                    #moreButton\n                    eclButton \n                    (click)=\"onMoreDropdownToggle()\"\n                    variant=\"secondary\" \n                    [attr.aria-expanded]=\"isMoreDropdownExpanded\"\n                    class=\"ecl-tabs__toggle\"\n                    [class.ecl-tabs__toggle--active]=\"isMoreButtonActive\">\n                    <span eclButtonLabel>{{ 'ecl.common.MORE' | translate }}</span>\n                    <ecl-icon icon=\"corner-arrow\" transform=\"rotate-180\" size=\"fluid\"></ecl-icon>\n                </button>\n\n                <ul #dropdownList class=\"ecl-tabs__dropdown\" [class.ecl-tabs__dropdown--show]=\"isMoreDropdownExpanded\">\n                    <ng-container *ngFor=\"let tab of tabs.toArray()\">\n                        <ecl-tab [isActive]=\"tab.isActive\">\n                            <ecl-tab-label [innerHTML]=\"tab.linkContents\"></ecl-tab-label>\n                        </ecl-tab>\n                    </ng-container>\n                </ul>\n            </ecl-tab-more>\n        </ul>\n    </div>\n    <div class=\"ecl-tabs__controls\">\n        <button eclButton (click)=\"onScrollPrev()\" class=\"ecl-tabs__prev\">\n            <ecl-icon \n                icon=\"corner-arrow\" \n                color=\"inverted\" \n                transform=\"rotate-270\" \n                size=\"m\"\n                class=\"ecl-u-d-block\">\n            </ecl-icon>\n        </button>\n        <button eclButton (click)=\"onScrollNext()\" class=\"ecl-tabs__next\">\n            <ecl-icon \n                icon=\"corner-arrow\" \n                color=\"inverted\" \n                transform=\"rotate-90\" \n                size=\"m\"\n                class=\"ecl-u-d-block\">\n            </ecl-icon>\n        </button>\n    </div>\n</nav>\n\n<ng-container *ngFor=\"let tab of tabs.toArray()\">\n    <div class=\"{{ bodyClass }}\" *ngIf=\"tab.isActive\">\n        <ng-container *ngTemplateOutlet=\"tab.tabContentTemplate\"></ng-container>\n    </div>\n</ng-container>" }]
+        }], ctorParameters: function () { return [{ type: i0.IterableDiffers }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { bodyClass: [{
                 type: Input
             }], tabSelect: [{
                 type: Output
-            }], cmpClass: [{
-                type: HostBinding,
-                args: ['class.ecl-tabs']
-            }], role: [{
-                type: HostBinding,
-                args: ['attr.role']
             }], tabs: [{
                 type: ContentChildren,
                 args: [forwardRef(() => EclTabComponent)]
+            }], dropdownTabs: [{
+                type: ViewChildren,
+                args: [forwardRef(() => EclTabComponent)]
+            }], moreTabComponent: [{
+                type: ViewChild,
+                args: ['moreTab']
             }], moreButtonElement: [{
                 type: ViewChild,
                 args: ['moreButton', { read: ElementRef }]
@@ -12972,14 +13242,18 @@ class EclTabsComponentModule {
 /** @nocollapse */ EclTabsComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclTabsComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
 /** @nocollapse */ EclTabsComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclTabsComponentModule, declarations: [EclTabsComponent,
         EclTabComponent,
+        EclTabMoreComponent,
         EclTabLabelComponent], imports: [CommonModule,
+        EclClickOutsideModule,
         EclLinkDirectiveModule,
         EclButtonComponentModule,
         EclIconComponentModule,
         TranslateModule], exports: [EclTabsComponent,
         EclTabComponent,
+        EclTabMoreComponent,
         EclTabLabelComponent] });
 /** @nocollapse */ EclTabsComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.0-next.4", ngImport: i0, type: EclTabsComponentModule, imports: [CommonModule,
+        EclClickOutsideModule,
         EclLinkDirectiveModule,
         EclButtonComponentModule,
         EclIconComponentModule,
@@ -12989,6 +13263,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
             args: [{
                     imports: [
                         CommonModule,
+                        EclClickOutsideModule,
                         EclLinkDirectiveModule,
                         EclButtonComponentModule,
                         EclIconComponentModule,
@@ -12997,11 +13272,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
                     exports: [
                         EclTabsComponent,
                         EclTabComponent,
+                        EclTabMoreComponent,
                         EclTabLabelComponent,
                     ],
                     declarations: [
                         EclTabsComponent,
                         EclTabComponent,
+                        EclTabMoreComponent,
                         EclTabLabelComponent,
                     ]
                 }]
@@ -13414,6 +13691,7 @@ const MODULES = [
     EclPageHeaderComponentModule,
     EclPaginationComponentModule,
     EclRadioDirectiveModule,
+    EclRatingFieldComponentModule,
     EclSearchFormComponentModule,
     EclSelectDirectiveModule,
     EclSiteFooterComponentModule,
@@ -13490,6 +13768,7 @@ class EclAllModule {
         EclPageHeaderComponentModule,
         EclPaginationComponentModule,
         EclRadioDirectiveModule,
+        EclRatingFieldComponentModule,
         EclSearchFormComponentModule,
         EclSelectDirectiveModule,
         EclSiteFooterComponentModule,
@@ -13561,6 +13840,7 @@ class EclAllModule {
         EclPageHeaderComponentModule,
         EclPaginationComponentModule,
         EclRadioDirectiveModule,
+        EclRatingFieldComponentModule,
         EclSearchFormComponentModule,
         EclSelectDirectiveModule,
         EclSiteFooterComponentModule,
@@ -13635,6 +13915,7 @@ class EclAllModule {
         EclPageHeaderComponentModule,
         EclPaginationComponentModule,
         EclRadioDirectiveModule,
+        EclRatingFieldComponentModule,
         EclSearchFormComponentModule,
         EclSelectDirectiveModule,
         EclSiteFooterComponentModule,
@@ -13684,5 +13965,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.0-next.4",
  * Generated bundle index. Do not edit.
  */
 
-export { ECLClickOutsideDirective, ECL_DATE_PICKER_VALUE_ACCESSOR, ECL_SEARCH_FORM_VALUE_ACCESSOR, EclAccordionComponent, EclAccordionComponentModule, EclAccordionItemComponent, EclAccordionToggleEvent, EclAllModule, EclAppComponent, EclAppComponentBase, EclAppComponentModule, EclAppCoreComponent, EclAppCoreComponentModule, EclAppHarmonisedComponent, EclAppHarmonisedComponentModule, EclAppLanguageDismissEvent, EclAppStandardisedComponent, EclAppStandardisedComponentModule, EclBaseEvent, EclBlockquoteComponent, EclBlockquoteComponentModule, EclBlockquoteImageDirective, EclBreadcrumbComponent, EclBreadcrumbComponentBase, EclBreadcrumbComponentModule, EclBreadcrumbCoreComponent, EclBreadcrumbCoreComponentModule, EclBreadcrumbCoreSegmentComponent, EclBreadcrumbHarmonisedComponent, EclBreadcrumbHarmonisedComponentModule, EclBreadcrumbHarmonisedSegmentComponent, EclBreadcrumbSegmentClickEvent, EclBreadcrumbSegmentComponent, EclBreadcrumbSegmentComponentBase, EclBreadcrumbStandardisedComponent, EclBreadcrumbStandardisedComponentModule, EclBreadcrumbStandardisedSegmentComponent, EclButtonComponent, EclButtonComponentModule, EclButtonLabelDirective, EclCardBodyComponent, EclCardComponent, EclCardComponentModule, EclCardImageDirective, EclCarouselComponent, EclCarouselComponentModule, EclCategoryFilterComponent, EclCategoryFilterItemComponent, EclCategoryFilterItemSelectEvent, EclCategoryFilterListComponent, EclCategoryFilterModule, EclCheckboxDirective, EclCheckboxHelpComponent, EclCheckboxInputDirective, EclCheckboxLabelComponent, EclCheckboxModule, EclClickOutsideModule, EclContentBlockComponent, EclContentBlockComponentModule, EclContentBlockDescriptionDirective, EclContentBlockLabelDirective, EclContentBlockLabelsDirective, EclContentBlockLinkDirective, EclContentBlockLinksContainerDirective, EclContentBlockLinksDirective, EclContentBlockListContainerDirective, EclContentBlockListDirective, EclContentBlockPrimaryMetaDirective, EclContentBlockPrimaryMetasDirective, EclContentBlockSecondaryMetaDirective, EclContentBlockSecondaryMetaIconDirective, EclContentBlockSecondaryMetaLabelDirective, EclContentBlockSecondaryMetasDirective, EclContentBlockTagDirective, EclContentBlockTagsDirective, EclContentBlockTitleDirective, EclContentItemComponent, EclContentItemComponentModule, EclContentItemImageDirective, EclContentItemPictureDirective, EclDateBlockComponent, EclDateBlockComponentModule, EclDatePickerDatePickedEvent, EclDatePickerDirective, EclDatePickerDirectiveModule, EclDefaultLanguageService, EclDescriptionListDefinitionDirective, EclDescriptionListDefinitionItemDirective, EclDescriptionListDirective, EclDescriptionListTermDirective, EclDomEvent, EclExpandableComponent, EclExpandableComponentModule, EclExpandableToggleEvent, EclFactFiguresComponent, EclFactFiguresComponentModule, EclFactFiguresDescriptionComponent, EclFactFiguresItemComponent, EclFactFiguresTitleComponent, EclFactFiguresValueComponent, EclFactFiguresViewAllComponent, EclFeaturedComponent, EclFeaturedItemComponent, EclFeaturedItemDescriptionComponent, EclFeaturedItemLinkDirective, EclFeaturedModule, EclFeedbackMessageDirective, EclFeedbackMessageDirectiveModule, EclFileComponent, EclFileComponentModule, EclFileDownloadEvent, EclFileItemComponent, EclFileItemsComponent, EclFileItemsToggleEvent, EclFileTaxonomyComponent, EclFileUploadDirective, EclFileUploadDirectiveModule, EclFileUploadFileSelectedEvent, EclFooterComponentBase, EclFooterCoreColumntDirective, EclFooterCoreComponent, EclFooterCoreComponentModule, EclFooterCoreDescriptionDirective, EclFooterCoreLinkDirective, EclFooterCoreListDirective, EclFooterCoreListItemDirective, EclFooterCoreSectionDirective, EclFooterCoreTitleDirective, EclFooterCoreTitleLinkDirective, EclFooterHarmonisedColumnDirective, EclFooterHarmonisedComponent, EclFooterHarmonisedComponentModule, EclFooterHarmonisedContentDirective, EclFooterHarmonisedDescriptionDirective, EclFooterHarmonisedLinkDirective, EclFooterHarmonisedListDirective, EclFooterHarmonisedListItemDirective, EclFooterHarmonisedLogoDirective, EclFooterHarmonisedLogoImageDesktopDirective, EclFooterHarmonisedLogoItemDirective, EclFooterHarmonisedLogoLinkDirective, EclFooterHarmonisedLogoListDirective, EclFooterHarmonisedRowDirective, EclFooterHarmonisedSectionDirective, EclFooterHarmonisedTitleDirective, EclFooterHarmonisedTitleLinkDirective, EclFooterStandardisedColumnDirective, EclFooterStandardisedComponent, EclFooterStandardisedComponentModule, EclFooterStandardisedContentDirective, EclFooterStandardisedDescriptionDirective, EclFooterStandardisedLinkDirective, EclFooterStandardisedListDirective, EclFooterStandardisedListItemDirective, EclFooterStandardisedLogoImageDesktopDirective, EclFooterStandardisedLogoLinkDirective, EclFooterStandardisedRowDirective, EclFooterStandardisedSectionDirective, EclFooterStandardisedTitleDirective, EclFooterStandardisedTitleLinkDirective, EclFormGroupComponent, EclFormGroupComponentModule, EclFormLabelComponent, EclFormLabelComponentModule, EclGalleryComponent, EclGalleryComponentModule, EclGalleryDownloadEvent, EclGalleryFooterComponent, EclGalleryHideEvent, EclGalleryItemClickEvent, EclGalleryItemComponent, EclGalleryItemEvent, EclGalleryMediaDirective, EclGalleryMediaSource, EclGalleryMediaTrack, EclGalleryShareEvent, EclGalleryShowEvent, EclHelpBlockDirective, EclHelpBlockDirectiveModule, EclHeroBannerComponent, EclHeroBannerComponentModule, EclHeroBannerCreditDirective, EclHeroBannerCtaLinkDirective, EclHeroBannerDescriptionDirective, EclHeroBannerTitleDirective, EclHiddenDirective, EclHiddenModule, EclIconComponent, EclIconComponentModule, EclInpageNavigationComponent, EclInpageNavigationComponentModule, EclInpageNavigationItemClickEvent, EclInpageNavigationItemComponent, EclInpageNavigationSectionEnterEvent, EclLabelDirective, EclLabelDirectiveModule, EclLanguageListCloseEvent, EclLanguageListComponent, EclLanguageListComponentModule, EclLanguageListItemClickEvent, EclLanguageListItemComponent, EclLanguageListLanguageSelectedEvent, EclLanguageService, EclLinkDirective, EclLinkDirectiveModule, EclLinkLabelDirective, EclListDirectiveModule, EclListIllustrationComponent, EclListIllustrationComponentModule, EclListIllustrationIconDirective, EclListIllustrationImageDirective, EclListIllustrationItemComponent, EclMediaContainerComponent, EclMediaContainerComponentModule, EclMediaContainerItemDirective, EclMenuComponent, EclMenuComponentModule, EclMenuItemComponent, EclMenuItemFocusEvent, EclMenuItemHoverEvent, EclMenuItemHoverOutEvent, EclMenuItemSelectEvent, EclMenuMegaComponent, EclMenuMegaItemComponent, EclMessageCloseEvent, EclMessageComponent, EclMessageComponentModule, EclMessageTitleDirective, EclMultiselectComponent, EclMultiselectComponentModule, EclMultiselectOptionDirective, EclNavigationListComponent, EclNavigationListComponentModule, EclNavigationListImageDirective, EclNavigationListItemComponent, EclNewsTickerComponent, EclNewsTickerComponentModule, EclNewsTickerItemComponent, EclNewsTickerItemEvent, EclOrderedListDirective, EclOrderedListItemDirective, EclPageBannerComponent, EclPageBannerComponentModule, EclPageBannerCreditDirective, EclPageBannerCtaLinkDirective, EclPageBannerDescriptionDirective, EclPageBannerTitleDirective, EclPageHeaderComponent, EclPageHeaderComponentBase, EclPageHeaderComponentModule, EclPageHeaderCoreComponent, EclPageHeaderCoreComponentModule, EclPageHeaderCoreDescriptionContainerDirective, EclPageHeaderCoreDescriptionDirective, EclPageHeaderCoreDescriptionThumbnailDirective, EclPageHeaderCoreMetaDirective, EclPageHeaderCoreMetaItemDirective, EclPageHeaderCoreTitleDirective, EclPageHeaderDescriptionContainerDirective, EclPageHeaderDescriptionDirective, EclPageHeaderDescriptionThumbnailDirective, EclPageHeaderHarmonisedComponent, EclPageHeaderHarmonisedComponentModule, EclPageHeaderHarmonisedDescriptionContainerDirective, EclPageHeaderHarmonisedDescriptionDirective, EclPageHeaderHarmonisedDescriptionThumbnailDirective, EclPageHeaderHarmonisedMetaDirective, EclPageHeaderHarmonisedMetaItemDirective, EclPageHeaderHarmonisedTitleDirective, EclPageHeaderMetaDirective, EclPageHeaderMetaItemDirective, EclPageHeaderStandardisedComponent, EclPageHeaderStandardisedComponentModule, EclPageHeaderStandardisedDescriptionContainerDirective, EclPageHeaderStandardisedDescriptionDirective, EclPageHeaderStandardisedDescriptionThumbnailDirective, EclPageHeaderStandardisedMetaDirective, EclPageHeaderStandardisedMetaItemDirective, EclPageHeaderStandardisedTitleDirective, EclPageHeaderTitleDirective, EclPaginationComponent, EclPaginationComponentModule, EclPaginationEvent, EclPaginationItemClickEvent, EclPaginationItemComponent, EclRadioDirective, EclRadioDirectiveModule, EclRadioHelpComponent, EclRadioInputDirective, EclRadioLabelComponent, EclSearchFormComponent, EclSearchFormComponentModule, EclSearchFormEvent, EclSelectDirective, EclSelectDirectiveModule, EclSiteFooterColumnDirective, EclSiteFooterComponent, EclSiteFooterComponentModule, EclSiteFooterContentDirective, EclSiteFooterDescriptionDirective, EclSiteFooterLinkDirective, EclSiteFooterListDirective, EclSiteFooterListItemDirective, EclSiteFooterLogoDirective, EclSiteFooterLogoImageDesktopDirective, EclSiteFooterLogoItemDirective, EclSiteFooterLogoLinkDirective, EclSiteFooterLogoListDirective, EclSiteFooterRowDirective, EclSiteFooterSectionDirective, EclSiteFooterTitleDirective, EclSiteFooterTitleLinkDirective, EclSiteHeaderActionComponent, EclSiteHeaderActionComponentBase, EclSiteHeaderBannerTopComponent, EclSiteHeaderBannerTopComponentBase, EclSiteHeaderComponent, EclSiteHeaderComponentBase, EclSiteHeaderComponentModule, EclSiteHeaderCoreActionComponent, EclSiteHeaderCoreComponent, EclSiteHeaderCoreComponentModule, EclSiteHeaderCoreLanguageComponent, EclSiteHeaderCoreLoginComponent, EclSiteHeaderCoreLoginDescriptionDirective, EclSiteHeaderCoreLoginSeparatorDirective, EclSiteHeaderCoreSearchComponent, EclSiteHeaderEnvironmentComponent, EclSiteHeaderHarmonisedActionComponent, EclSiteHeaderHarmonisedBannerTopComponent, EclSiteHeaderHarmonisedComponent, EclSiteHeaderHarmonisedComponentModule, EclSiteHeaderHarmonisedLanguageComponent, EclSiteHeaderHarmonisedLoginComponent, EclSiteHeaderHarmonisedLoginDescriptionDirective, EclSiteHeaderHarmonisedLoginSeparatorDirective, EclSiteHeaderHarmonisedSearchComponent, EclSiteHeaderLanguageClickEvent, EclSiteHeaderLanguageComponent, EclSiteHeaderLanguageComponentBase, EclSiteHeaderLoginBoxToggleEvent, EclSiteHeaderLoginComponent, EclSiteHeaderLoginComponentBase, EclSiteHeaderLoginDescriptionDirective, EclSiteHeaderLoginEvent, EclSiteHeaderLoginSeparatorDirective, EclSiteHeaderLogoClickEvent, EclSiteHeaderSearchComponent, EclSiteHeaderSearchComponentBase, EclSiteHeaderSearchEvent, EclSiteHeaderSearchToggleEvent, EclSiteHeaderStandardisedActionComponent, EclSiteHeaderStandardisedBannerTopComponent, EclSiteHeaderStandardisedComponent, EclSiteHeaderStandardisedComponentModule, EclSiteHeaderStandardisedCtaDirective, EclSiteHeaderStandardisedLanguageComponent, EclSiteHeaderStandardisedLoginComponent, EclSiteHeaderStandardisedLoginDescriptionDirective, EclSiteHeaderStandardisedLoginSeparatorDirective, EclSiteHeaderStandardisedSearchComponent, EclSocialMediaFollowComponent, EclSocialMediaFollowComponentModule, EclSocialMediaFollowItemClickEvent, EclSocialMediaFollowItemComponent, EclSocialMediaShareComponent, EclSocialMediaShareComponentModule, EclSocialMediaShareItemClickEvent, EclSocialMediaShareItemComponent, EclSortTableEvent, EclSpinnerComponent, EclSpinnerComponentModule, EclSpinnerLabelDirective, EclStickyContainerComponent, EclStickyContainerComponentModule, EclTabComponent, EclTabLabelComponent, EclTabSelectEvent, EclTableBodyDirective, EclTableCellDirective, EclTableCellGroupDirective, EclTableDirective, EclTableDirectiveModule, EclTableHeadDirective, EclTableHeaderDirective, EclTableRowDirective, EclTabsComponent, EclTabsComponentModule, EclTagComponent, EclTagComponentModule, EclTagRemoveEvent, EclTextAreaDirective, EclTextAreaDirectiveModule, EclTextInputDirective, EclTextInputDirectiveModule, EclTimelineComponent, EclTimelineComponentModule, EclTimelineItemComponent, EclTimelineItemLabelDirective, EclTimelineItemTitleDirective, EclTimelineItemToggleEvent, EclTimelineItemTogglerComponent, EclUnorderedListDirective, EclUnorderedListItemDirective, SortOrder, hasNextSiblingWithAttribute, hasPreviousSiblingWithAttribute };
+export { ECLClickOutsideDirective, ECL_DATE_PICKER_VALUE_ACCESSOR, ECL_RATINGFIELD_VALUE_ACCESSOR, ECL_SEARCH_FORM_VALUE_ACCESSOR, EclAccordionComponent, EclAccordionComponentModule, EclAccordionItemComponent, EclAccordionToggleEvent, EclAllModule, EclAppComponent, EclAppComponentBase, EclAppComponentModule, EclAppCoreComponent, EclAppCoreComponentModule, EclAppHarmonisedComponent, EclAppHarmonisedComponentModule, EclAppLanguageDismissEvent, EclAppStandardisedComponent, EclAppStandardisedComponentModule, EclBaseEvent, EclBlockquoteComponent, EclBlockquoteComponentModule, EclBlockquoteImageDirective, EclBreadcrumbComponent, EclBreadcrumbComponentBase, EclBreadcrumbComponentModule, EclBreadcrumbCoreComponent, EclBreadcrumbCoreComponentModule, EclBreadcrumbCoreSegmentComponent, EclBreadcrumbHarmonisedComponent, EclBreadcrumbHarmonisedComponentModule, EclBreadcrumbHarmonisedSegmentComponent, EclBreadcrumbSegmentClickEvent, EclBreadcrumbSegmentComponent, EclBreadcrumbSegmentComponentBase, EclBreadcrumbStandardisedComponent, EclBreadcrumbStandardisedComponentModule, EclBreadcrumbStandardisedSegmentComponent, EclButtonComponent, EclButtonComponentModule, EclButtonLabelDirective, EclCardBodyComponent, EclCardComponent, EclCardComponentModule, EclCardImageDirective, EclCarouselComponent, EclCarouselComponentModule, EclCarouselItemComponent, EclCategoryFilterComponent, EclCategoryFilterItemComponent, EclCategoryFilterItemSelectEvent, EclCategoryFilterListComponent, EclCategoryFilterModule, EclCheckboxDirective, EclCheckboxHelpComponent, EclCheckboxInputDirective, EclCheckboxLabelComponent, EclCheckboxModule, EclClickOutsideModule, EclContentBlockComponent, EclContentBlockComponentModule, EclContentBlockDescriptionDirective, EclContentBlockLabelDirective, EclContentBlockLabelsDirective, EclContentBlockLinkDirective, EclContentBlockLinksContainerDirective, EclContentBlockLinksDirective, EclContentBlockListContainerDirective, EclContentBlockListDirective, EclContentBlockPrimaryMetaDirective, EclContentBlockPrimaryMetasDirective, EclContentBlockSecondaryMetaDirective, EclContentBlockSecondaryMetaIconDirective, EclContentBlockSecondaryMetaLabelDirective, EclContentBlockSecondaryMetasDirective, EclContentBlockTagDirective, EclContentBlockTagsDirective, EclContentBlockTitleDirective, EclContentItemComponent, EclContentItemComponentModule, EclContentItemImageDirective, EclContentItemPictureDirective, EclDateBlockComponent, EclDateBlockComponentModule, EclDatePickerDatePickedEvent, EclDatePickerDirective, EclDatePickerDirectiveModule, EclDefaultLanguageService, EclDescriptionListDefinitionDirective, EclDescriptionListDefinitionItemDirective, EclDescriptionListDirective, EclDescriptionListTermDirective, EclDomEvent, EclExpandableComponent, EclExpandableComponentModule, EclExpandableToggleEvent, EclFactFiguresComponent, EclFactFiguresComponentModule, EclFactFiguresDescriptionComponent, EclFactFiguresItemComponent, EclFactFiguresTitleComponent, EclFactFiguresValueComponent, EclFactFiguresViewAllComponent, EclFeaturedComponent, EclFeaturedItemComponent, EclFeaturedItemDescriptionComponent, EclFeaturedItemLinkDirective, EclFeaturedModule, EclFeedbackMessageDirective, EclFeedbackMessageDirectiveModule, EclFileComponent, EclFileComponentModule, EclFileDownloadEvent, EclFileItemComponent, EclFileItemsComponent, EclFileItemsToggleEvent, EclFileTaxonomyComponent, EclFileUploadDirective, EclFileUploadDirectiveModule, EclFileUploadFileSelectedEvent, EclFooterComponentBase, EclFooterCoreColumntDirective, EclFooterCoreComponent, EclFooterCoreComponentModule, EclFooterCoreDescriptionDirective, EclFooterCoreLinkDirective, EclFooterCoreListDirective, EclFooterCoreListItemDirective, EclFooterCoreSectionDirective, EclFooterCoreTitleDirective, EclFooterCoreTitleLinkDirective, EclFooterHarmonisedColumnDirective, EclFooterHarmonisedComponent, EclFooterHarmonisedComponentModule, EclFooterHarmonisedContentDirective, EclFooterHarmonisedDescriptionDirective, EclFooterHarmonisedLinkDirective, EclFooterHarmonisedListDirective, EclFooterHarmonisedListItemDirective, EclFooterHarmonisedLogoDirective, EclFooterHarmonisedLogoImageDesktopDirective, EclFooterHarmonisedLogoItemDirective, EclFooterHarmonisedLogoLinkDirective, EclFooterHarmonisedLogoListDirective, EclFooterHarmonisedRowDirective, EclFooterHarmonisedSectionDirective, EclFooterHarmonisedTitleDirective, EclFooterHarmonisedTitleLinkDirective, EclFooterStandardisedColumnDirective, EclFooterStandardisedComponent, EclFooterStandardisedComponentModule, EclFooterStandardisedContentDirective, EclFooterStandardisedDescriptionDirective, EclFooterStandardisedLinkDirective, EclFooterStandardisedListDirective, EclFooterStandardisedListItemDirective, EclFooterStandardisedLogoImageDesktopDirective, EclFooterStandardisedLogoLinkDirective, EclFooterStandardisedRowDirective, EclFooterStandardisedSectionDirective, EclFooterStandardisedTitleDirective, EclFooterStandardisedTitleLinkDirective, EclFormGroupComponent, EclFormGroupComponentModule, EclFormLabelComponent, EclFormLabelComponentModule, EclGalleryComponent, EclGalleryComponentModule, EclGalleryDownloadEvent, EclGalleryFooterComponent, EclGalleryHideEvent, EclGalleryItemClickEvent, EclGalleryItemComponent, EclGalleryItemEvent, EclGalleryMediaDirective, EclGalleryMediaSource, EclGalleryMediaTrack, EclGalleryShareEvent, EclGalleryShowEvent, EclHelpBlockDirective, EclHelpBlockDirectiveModule, EclHeroBannerComponent, EclHeroBannerComponentModule, EclHeroBannerCreditDirective, EclHeroBannerCtaLinkDirective, EclHeroBannerDescriptionDirective, EclHeroBannerTitleDirective, EclHiddenDirective, EclHiddenModule, EclIconComponent, EclIconComponentModule, EclInpageNavigationComponent, EclInpageNavigationComponentModule, EclInpageNavigationItemClickEvent, EclInpageNavigationItemComponent, EclInpageNavigationSectionEnterEvent, EclLabelDirective, EclLabelDirectiveModule, EclLanguageListCloseEvent, EclLanguageListComponent, EclLanguageListComponentModule, EclLanguageListItemClickEvent, EclLanguageListItemComponent, EclLanguageListLanguageSelectedEvent, EclLanguageService, EclLinkDirective, EclLinkDirectiveModule, EclLinkLabelDirective, EclListDirectiveModule, EclListIllustrationComponent, EclListIllustrationComponentModule, EclListIllustrationIconDirective, EclListIllustrationImageDirective, EclListIllustrationItemComponent, EclMediaContainerComponent, EclMediaContainerComponentModule, EclMediaContainerItemDirective, EclMenuComponent, EclMenuComponentModule, EclMenuItemComponent, EclMenuItemFocusEvent, EclMenuItemHoverEvent, EclMenuItemHoverOutEvent, EclMenuItemSelectEvent, EclMenuMegaComponent, EclMenuMegaItemComponent, EclMessageCloseEvent, EclMessageComponent, EclMessageComponentModule, EclMessageTitleDirective, EclMultiselectComponent, EclMultiselectComponentModule, EclMultiselectOptionDirective, EclNavigationListComponent, EclNavigationListComponentModule, EclNavigationListImageDirective, EclNavigationListItemComponent, EclNewsTickerComponent, EclNewsTickerComponentModule, EclNewsTickerItemComponent, EclNewsTickerItemEvent, EclOrderedListDirective, EclOrderedListItemDirective, EclPageBannerComponent, EclPageBannerComponentModule, EclPageBannerCreditDirective, EclPageBannerCtaLinkDirective, EclPageBannerDescriptionDirective, EclPageBannerTitleDirective, EclPageHeaderComponent, EclPageHeaderComponentBase, EclPageHeaderComponentModule, EclPageHeaderCoreComponent, EclPageHeaderCoreComponentModule, EclPageHeaderCoreDescriptionContainerDirective, EclPageHeaderCoreDescriptionDirective, EclPageHeaderCoreDescriptionThumbnailDirective, EclPageHeaderCoreMetaDirective, EclPageHeaderCoreMetaItemDirective, EclPageHeaderCoreTitleDirective, EclPageHeaderDescriptionContainerDirective, EclPageHeaderDescriptionDirective, EclPageHeaderDescriptionThumbnailDirective, EclPageHeaderHarmonisedComponent, EclPageHeaderHarmonisedComponentModule, EclPageHeaderHarmonisedDescriptionContainerDirective, EclPageHeaderHarmonisedDescriptionDirective, EclPageHeaderHarmonisedDescriptionThumbnailDirective, EclPageHeaderHarmonisedMetaDirective, EclPageHeaderHarmonisedMetaItemDirective, EclPageHeaderHarmonisedTitleDirective, EclPageHeaderMetaDirective, EclPageHeaderMetaItemDirective, EclPageHeaderStandardisedComponent, EclPageHeaderStandardisedComponentModule, EclPageHeaderStandardisedDescriptionContainerDirective, EclPageHeaderStandardisedDescriptionDirective, EclPageHeaderStandardisedDescriptionThumbnailDirective, EclPageHeaderStandardisedMetaDirective, EclPageHeaderStandardisedMetaItemDirective, EclPageHeaderStandardisedTitleDirective, EclPageHeaderTitleDirective, EclPaginationComponent, EclPaginationComponentModule, EclPaginationEvent, EclPaginationItemClickEvent, EclPaginationItemComponent, EclRadioDirective, EclRadioDirectiveModule, EclRadioHelpComponent, EclRadioInputDirective, EclRadioLabelComponent, EclRatingChangeEvent, EclRatingFieldComponent, EclRatingFieldComponentModule, EclSearchFormComponent, EclSearchFormComponentModule, EclSearchFormEvent, EclSelectDirective, EclSelectDirectiveModule, EclSiteFooterColumnDirective, EclSiteFooterComponent, EclSiteFooterComponentModule, EclSiteFooterContentDirective, EclSiteFooterDescriptionDirective, EclSiteFooterLinkDirective, EclSiteFooterListDirective, EclSiteFooterListItemDirective, EclSiteFooterLogoDirective, EclSiteFooterLogoImageDesktopDirective, EclSiteFooterLogoItemDirective, EclSiteFooterLogoLinkDirective, EclSiteFooterLogoListDirective, EclSiteFooterRowDirective, EclSiteFooterSectionDirective, EclSiteFooterTitleDirective, EclSiteFooterTitleLinkDirective, EclSiteHeaderActionComponent, EclSiteHeaderActionComponentBase, EclSiteHeaderBannerTopComponent, EclSiteHeaderBannerTopComponentBase, EclSiteHeaderComponent, EclSiteHeaderComponentBase, EclSiteHeaderComponentModule, EclSiteHeaderCoreActionComponent, EclSiteHeaderCoreComponent, EclSiteHeaderCoreComponentModule, EclSiteHeaderCoreLanguageComponent, EclSiteHeaderCoreLoginComponent, EclSiteHeaderCoreLoginDescriptionDirective, EclSiteHeaderCoreLoginSeparatorDirective, EclSiteHeaderCoreSearchComponent, EclSiteHeaderEnvironmentComponent, EclSiteHeaderHarmonisedActionComponent, EclSiteHeaderHarmonisedBannerTopComponent, EclSiteHeaderHarmonisedComponent, EclSiteHeaderHarmonisedComponentModule, EclSiteHeaderHarmonisedLanguageComponent, EclSiteHeaderHarmonisedLoginComponent, EclSiteHeaderHarmonisedLoginDescriptionDirective, EclSiteHeaderHarmonisedLoginSeparatorDirective, EclSiteHeaderHarmonisedSearchComponent, EclSiteHeaderLanguageClickEvent, EclSiteHeaderLanguageComponent, EclSiteHeaderLanguageComponentBase, EclSiteHeaderLoginBoxToggleEvent, EclSiteHeaderLoginComponent, EclSiteHeaderLoginComponentBase, EclSiteHeaderLoginDescriptionDirective, EclSiteHeaderLoginEvent, EclSiteHeaderLoginSeparatorDirective, EclSiteHeaderLogoClickEvent, EclSiteHeaderSearchComponent, EclSiteHeaderSearchComponentBase, EclSiteHeaderSearchEvent, EclSiteHeaderSearchToggleEvent, EclSiteHeaderStandardisedActionComponent, EclSiteHeaderStandardisedBannerTopComponent, EclSiteHeaderStandardisedComponent, EclSiteHeaderStandardisedComponentModule, EclSiteHeaderStandardisedCtaDirective, EclSiteHeaderStandardisedLanguageComponent, EclSiteHeaderStandardisedLoginComponent, EclSiteHeaderStandardisedLoginDescriptionDirective, EclSiteHeaderStandardisedLoginSeparatorDirective, EclSiteHeaderStandardisedSearchComponent, EclSocialMediaFollowComponent, EclSocialMediaFollowComponentModule, EclSocialMediaFollowItemClickEvent, EclSocialMediaFollowItemComponent, EclSocialMediaShareComponent, EclSocialMediaShareComponentModule, EclSocialMediaShareItemClickEvent, EclSocialMediaShareItemComponent, EclSortTableEvent, EclSpinnerComponent, EclSpinnerComponentModule, EclSpinnerLabelDirective, EclStickyContainerComponent, EclStickyContainerComponentModule, EclTabComponent, EclTabLabelComponent, EclTabMoreComponent, EclTabSelectEvent, EclTableBodyDirective, EclTableCellDirective, EclTableCellGroupDirective, EclTableDirective, EclTableDirectiveModule, EclTableHeadDirective, EclTableHeaderDirective, EclTableRowDirective, EclTabsComponent, EclTabsComponentModule, EclTagComponent, EclTagComponentModule, EclTagRemoveEvent, EclTextAreaDirective, EclTextAreaDirectiveModule, EclTextInputDirective, EclTextInputDirectiveModule, EclTimelineComponent, EclTimelineComponentModule, EclTimelineItemComponent, EclTimelineItemLabelDirective, EclTimelineItemTitleDirective, EclTimelineItemToggleEvent, EclTimelineItemTogglerComponent, EclUnorderedListDirective, EclUnorderedListItemDirective, SortOrder, hasNextSiblingWithAttribute, hasPreviousSiblingWithAttribute };
 //# sourceMappingURL=eui-ecl.mjs.map