@eui/ecl 21.0.0-alpha.7 → 21.0.0-alpha.8

package/fesm2022/eui-ecl-components-ecl-card.mjs

@@ -21,10 +21,10 @@ class EclCardPictureDirective extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-picture ecl-card__picture')].join(' ').trim();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCardPictureDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.1.6", type: EclCardPictureDirective, isStandalone: true, selector: "picture[eclCardPicture]", inputs: { hasZoom: ["hasZoom", "hasZoom", booleanAttribute] }, host: { properties: { "class": "this.cssClasses", "class.ecl-picture--zoom": "this.hasZoom" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCardPictureDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.1.7", type: EclCardPictureDirective, isStandalone: true, selector: "picture[eclCardPicture]", inputs: { hasZoom: ["hasZoom", "hasZoom", booleanAttribute] }, host: { properties: { "class": "this.cssClasses", "class.ecl-picture--zoom": "this.hasZoom" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCardPictureDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCardPictureDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'picture[eclCardPicture]',
@@ -54,10 +54,10 @@ class EclCardImageDirective extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-card__image')].join(' ').trim();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCardImageDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.6", type: EclCardImageDirective, isStandalone: true, selector: "img[eclCardImage]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCardImageDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.7", type: EclCardImageDirective, isStandalone: true, selector: "img[eclCardImage]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCardImageDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCardImageDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'img[eclCardImage]',
@@ -110,10 +110,10 @@ class EclCardComponent extends ECLBaseDirective {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: EclCardComponent, isStandalone: true, selector: "ecl-card", host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclContentBlock", first: true, predicate: i0.forwardRef(() => EclContentBlockComponent), descendants: true }, { propertyName: "eclContentBlockTitle", first: true, predicate: i0.forwardRef(() => EclContentBlockTitleDirective), descendants: true }, { propertyName: "eclCardImage", first: true, predicate: i0.forwardRef(() => EclCardImageDirective), descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: EclCardComponent, isStandalone: true, selector: "ecl-card", host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclContentBlock", first: true, predicate: i0.forwardRef(() => EclContentBlockComponent), descendants: true }, { propertyName: "eclContentBlockTitle", first: true, predicate: i0.forwardRef(() => EclContentBlockTitleDirective), descendants: true }, { propertyName: "eclCardImage", first: true, predicate: i0.forwardRef(() => EclCardImageDirective), descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCardComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-card', template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] }]
         }], propDecorators: { role: [{
@@ -144,10 +144,10 @@ class EclCardBodyComponent extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-card__body')].join(' ').trim();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCardBodyComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: EclCardBodyComponent, isStandalone: true, selector: "ecl-card-body", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCardBodyComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: EclCardBodyComponent, isStandalone: true, selector: "ecl-card-body", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCardBodyComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCardBodyComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-card-body', template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] }]
         }], propDecorators: { cssClasses: [{
@@ -168,17 +168,17 @@ const COMPONENTS = [
  * @deprecated Use {@link EUI_ECL_CARD} instead.
  */
 class EclCardModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.6", ngImport: i0, type: EclCardModule, imports: [EclCardComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.7", ngImport: i0, type: EclCardModule, imports: [EclCardComponent,
             EclCardBodyComponent,
             EclCardPictureDirective,
             EclCardImageDirective], exports: [EclCardComponent,
             EclCardBodyComponent,
             EclCardPictureDirective,
             EclCardImageDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCardModule }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCardModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCardModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCardModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...COMPONENTS],

package/fesm2022/eui-ecl-components-ecl-carousel.mjs

@@ -60,10 +60,10 @@ class EclCarouselItemComponent extends ECLBaseDirective {
     onSlideClick() {
         this.slideClick.next(new EclSlideEvent(this));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCarouselItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.1.6", type: EclCarouselItemComponent, isStandalone: true, selector: "ecl-carousel-item", inputs: { id: "id", isCurrent: ["isCurrent", "isCurrent", booleanAttribute] }, outputs: { slideClick: "slideClick" }, host: { listeners: { "click": "onSlideClick()" }, properties: { "attr.aria-label": "this.ariaLabel", "attr.role": "this.role", "attr.aria-roledescription": "this.roleDescription", "style.width.%": "this.width", "class": "this.cssClasses", "attr.inert": "this.isInert" } }, queries: [{ propertyName: "banner", first: true, predicate: i0.forwardRef(() => EclBannerComponent), descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host:before{left:0!important;display:none}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCarouselItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.1.7", type: EclCarouselItemComponent, isStandalone: true, selector: "ecl-carousel-item", inputs: { id: "id", isCurrent: ["isCurrent", "isCurrent", booleanAttribute] }, outputs: { slideClick: "slideClick" }, host: { listeners: { "click": "onSlideClick()" }, properties: { "attr.aria-label": "this.ariaLabel", "attr.role": "this.role", "attr.aria-roledescription": "this.roleDescription", "style.width.%": "this.width", "class": "this.cssClasses", "attr.inert": "this.isInert" } }, queries: [{ propertyName: "banner", first: true, predicate: i0.forwardRef(() => EclBannerComponent), descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host:before{left:0!important;display:none}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCarouselItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCarouselItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-carousel-item', template: "<ng-content></ng-content>\n", styles: [":host:before{left:0!important;display:none}\n"] }]
         }], propDecorators: { ariaLabel: [{
@@ -723,10 +723,10 @@ class EclCarouselComponent extends ECLBaseDirective {
             this.lastHiddenItem.el.nativeElement.innerHTML = this.getFirstContentChild();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: EclCarouselComponent, isStandalone: true, selector: "ecl-carousel", inputs: { ariaLabel: ["aria-label", "ariaLabel"], isAutoplay: ["isAutoplay", "isAutoplay", booleanAttribute], playInterval: ["playInterval", "playInterval", numberAttribute] }, outputs: { slide: "slide" }, host: { properties: { "attr.aria-label": "this.ariaLabel", "attr.aria-roledescription": "this.ariaRoleDescription", "class": "this.cssClasses" } }, queries: [{ propertyName: "slides", predicate: i0.forwardRef(() => EclCarouselItemComponent) }], viewQueries: [{ propertyName: "carouselContainerElement", first: true, predicate: ["carouselContainer"], descendants: true }, { propertyName: "playButton", first: true, predicate: ["playButton"], descendants: true }, { propertyName: "pauseButton", first: true, predicate: ["pauseButton"], descendants: true }, { propertyName: "firstHiddenItem", first: true, predicate: ["firstHiddenItem"], descendants: true }, { propertyName: "lastHiddenItem", first: true, predicate: ["lastHiddenItem"], descendants: true }, { propertyName: "slidesContainer", first: true, predicate: ["slidesContainer"], descendants: true }, { propertyName: "navigationButtons", predicate: ["currButton"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if(hasControls()){\n<div class=\"ecl-carousel__controls\">\n    <div class=\"ecl-container\">\n        <div class=\"ecl-carousel__autoplay\">\n            <button #playButton class=\"ecl-button ecl-button--tertiary ecl-carousel__play ecl-button--icon-only\"\n                type=\"button\" [style.display]=\"isPlaying ? 'none' : 'flex'\" (keydown)=\"onPlayKeyboardPress($event)\"\n                (click)=\"onPlayClick()\">\n                <span class=\"ecl-button__container\">\n                    <span class=\"ecl-button__label\">\n                        {{ 'ecl.carousel.PLAY' | translate }}\n                    </span>\n                    <ecl-icon icon=\"play-outline\" size=\"m\" class=\"ecl-button__icon ecl-carousel__icon-default\">\n                    </ecl-icon>\n                </span>\n            </button>\n\n            <button #pauseButton class=\"ecl-button ecl-button--tertiary ecl-carousel__pause ecl-button--icon-only\"\n                type=\"button\" [style.display]=\"isPlaying ? 'flex' : 'none'\" (keydown)=\"onPlayKeyboardPress($event)\"\n                (click)=\"onPauseClick()\">\n                <span class=\"ecl-button__container\">\n                    <span class=\"ecl-button__label\">\n                        {{ 'ecl.carousel.PAUSE' | translate }}\n                    </span>\n                    <ecl-icon icon=\"pause-outline\" size=\"m\" class=\"ecl-button__icon ecl-carousel__icon-default\"> </ecl-icon>\n                </span>\n\n            </button>\n        </div>\n\n        <div class=\"ecl-carousel__navigation\" role=\"tablist\" >\n            @for (slide of slides; let i = $index; track slide) {\n            <button #currButton [attr.aria-current]=\"i === getCurrentSlideIndex()\" [attr.tabindex]=\"i === getCurrentSlideIndex() ? null: -1\"\n                class=\"ecl-button ecl-button--tertiary ecl-carousel__navigation-item\" role=\"tab\" (click)=\"onSlideControlClick(slide)\"\n                (keydown)=\"onNavBtnKeyboardPress($event, i)\">\n                {{ i + 1 }}\n            </button>\n            }\n        </div>\n    </div>\n</div>\n}\n<div #carouselContainer class=\"ecl-carousel__container\" [class.ecl-carousel-container--padded]=\"isPadded()\">\n    <div #slidesContainer (keyup)=\"onFirstCarouselElementPress($event)\" class=\"ecl-carousel__slides\"\n        [style.width.px]=\"getCarouselSlidesWidth()\" [style.left.px]=\"!isRtl ? getCarouselSlidesOffsetLeft() : null\"\n        [style.right.px]=\"isRtl ? getCarouselSlidesOffsetRight() : null\"\n        [style.transition-duration.s]=\"transitionDuration\" (mouseover)=\"onSlideHover()\" (mouseout)=\"onSlideHoverout()\">\n\n        @if(hasControls()){\n        <ecl-carousel-item #firstHiddenItem [style.width.%]=\"slideWidth\"></ecl-carousel-item>\n        }\n        <ng-content></ng-content>\n\n        @if(hasControls()){\n        <ecl-carousel-item #lastHiddenItem [style.width.%]=\"slideWidth\"></ecl-carousel-item>\n        }\n    </div>\n</div>", styles: [".ecl-carousel__slides{transition-duration:.4s}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "component", type: EclCarouselItemComponent, selector: "ecl-carousel-item", inputs: ["id", "isCurrent"], outputs: ["slideClick"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: EclCarouselComponent, isStandalone: true, selector: "ecl-carousel", inputs: { ariaLabel: ["aria-label", "ariaLabel"], isAutoplay: ["isAutoplay", "isAutoplay", booleanAttribute], playInterval: ["playInterval", "playInterval", numberAttribute] }, outputs: { slide: "slide" }, host: { properties: { "attr.aria-label": "this.ariaLabel", "attr.aria-roledescription": "this.ariaRoleDescription", "class": "this.cssClasses" } }, queries: [{ propertyName: "slides", predicate: i0.forwardRef(() => EclCarouselItemComponent) }], viewQueries: [{ propertyName: "carouselContainerElement", first: true, predicate: ["carouselContainer"], descendants: true }, { propertyName: "playButton", first: true, predicate: ["playButton"], descendants: true }, { propertyName: "pauseButton", first: true, predicate: ["pauseButton"], descendants: true }, { propertyName: "firstHiddenItem", first: true, predicate: ["firstHiddenItem"], descendants: true }, { propertyName: "lastHiddenItem", first: true, predicate: ["lastHiddenItem"], descendants: true }, { propertyName: "slidesContainer", first: true, predicate: ["slidesContainer"], descendants: true }, { propertyName: "navigationButtons", predicate: ["currButton"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if(hasControls()){\n<div class=\"ecl-carousel__controls\">\n    <div class=\"ecl-container\">\n        <div class=\"ecl-carousel__autoplay\">\n            <button #playButton class=\"ecl-button ecl-button--tertiary ecl-carousel__play ecl-button--icon-only\"\n                type=\"button\" [style.display]=\"isPlaying ? 'none' : 'flex'\" (keydown)=\"onPlayKeyboardPress($event)\"\n                (click)=\"onPlayClick()\">\n                <span class=\"ecl-button__container\">\n                    <span class=\"ecl-button__label\">\n                        {{ 'ecl.carousel.PLAY' | translate }}\n                    </span>\n                    <ecl-icon icon=\"play-outline\" size=\"m\" class=\"ecl-button__icon ecl-carousel__icon-default\">\n                    </ecl-icon>\n                </span>\n            </button>\n\n            <button #pauseButton class=\"ecl-button ecl-button--tertiary ecl-carousel__pause ecl-button--icon-only\"\n                type=\"button\" [style.display]=\"isPlaying ? 'flex' : 'none'\" (keydown)=\"onPlayKeyboardPress($event)\"\n                (click)=\"onPauseClick()\">\n                <span class=\"ecl-button__container\">\n                    <span class=\"ecl-button__label\">\n                        {{ 'ecl.carousel.PAUSE' | translate }}\n                    </span>\n                    <ecl-icon icon=\"pause-outline\" size=\"m\" class=\"ecl-button__icon ecl-carousel__icon-default\"> </ecl-icon>\n                </span>\n\n            </button>\n        </div>\n\n        <div class=\"ecl-carousel__navigation\" role=\"tablist\" >\n            @for (slide of slides; let i = $index; track slide) {\n            <button #currButton [attr.aria-current]=\"i === getCurrentSlideIndex()\" [attr.tabindex]=\"i === getCurrentSlideIndex() ? null: -1\"\n                class=\"ecl-button ecl-button--tertiary ecl-carousel__navigation-item\" role=\"tab\" (click)=\"onSlideControlClick(slide)\"\n                (keydown)=\"onNavBtnKeyboardPress($event, i)\">\n                {{ i + 1 }}\n            </button>\n            }\n        </div>\n    </div>\n</div>\n}\n<div #carouselContainer class=\"ecl-carousel__container\" [class.ecl-carousel-container--padded]=\"isPadded()\">\n    <div #slidesContainer (keyup)=\"onFirstCarouselElementPress($event)\" class=\"ecl-carousel__slides\"\n        [style.width.px]=\"getCarouselSlidesWidth()\" [style.left.px]=\"!isRtl ? getCarouselSlidesOffsetLeft() : null\"\n        [style.right.px]=\"isRtl ? getCarouselSlidesOffsetRight() : null\"\n        [style.transition-duration.s]=\"transitionDuration\" (mouseover)=\"onSlideHover()\" (mouseout)=\"onSlideHoverout()\">\n\n        @if(hasControls()){\n        <ecl-carousel-item #firstHiddenItem [style.width.%]=\"slideWidth\"></ecl-carousel-item>\n        }\n        <ng-content></ng-content>\n\n        @if(hasControls()){\n        <ecl-carousel-item #lastHiddenItem [style.width.%]=\"slideWidth\"></ecl-carousel-item>\n        }\n    </div>\n</div>", styles: [".ecl-carousel__slides{transition-duration:.4s}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "component", type: EclCarouselItemComponent, selector: "ecl-carousel-item", inputs: ["id", "isCurrent"], outputs: ["slideClick"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCarouselComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCarouselComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-carousel', imports: [
                         TranslateModule,
@@ -786,11 +786,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImpor
  * @deprecated Use {@link EUI_ECL_CAROUSEL} instead.
  */
 class EclCarouselModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCarouselModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.6", ngImport: i0, type: EclCarouselModule, imports: [EclCarouselComponent, EclCarouselItemComponent], exports: [EclCarouselComponent, EclCarouselItemComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCarouselModule, imports: [EclCarouselComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCarouselModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.7", ngImport: i0, type: EclCarouselModule, imports: [EclCarouselComponent, EclCarouselItemComponent], exports: [EclCarouselComponent, EclCarouselItemComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCarouselModule, imports: [EclCarouselComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCarouselModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCarouselModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [EclCarouselComponent, EclCarouselItemComponent],

package/fesm2022/eui-ecl-components-ecl-category-filter.mjs

@@ -120,10 +120,10 @@ class EclCategoryFilterItemComponent extends ECLBaseDirective {
             this.eclCategoryList.level = value;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCategoryFilterItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: EclCategoryFilterItemComponent, isStandalone: true, selector: "ecl-category-filter-item", inputs: { href: "href", id: "id" }, outputs: { itemSelect: "itemSelect" }, host: { properties: { "class.ecl-category-filter__list-item": "this.className", "attr.role": "this.role", "class.ecl-category-filter__list-item--open": "this.isAriaExpanded" } }, queries: [{ propertyName: "eclCategoryList", first: true, predicate: i0.forwardRef(() => EclCategoryFilterListComponent), descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (hasChildren) {\n    <button\n        class=\"ecl-category-filter__item {{ levelClass }}\"\n        [class.ecl-category-filter__item--has-children]=\"hasChildren\"\n        [class.ecl-category-filter__item--current]=\"isCurrent\"\n        [attr.aria-current]=\"isCurrent ? true : null\"\n        [attr.aria-expanded] = \"isExpanded\"\n        [attr.aria-controls]=\"id\"\n        (click)=\"onItemClick($event)\">\n        @if(isChildItemWithChildren) {\n            <ecl-icon icon=\"solid-arrow\" size=\"xs\" transform=\"rotate-90\" class=\"ecl-category-filter__item-icon\"> </ecl-icon>\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        }\n        @if(isRootItemWithChildren) {\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n            <ecl-icon icon=\"corner-arrow\" size=\"xs\" transform=\"rotate-180\" class=\"ecl-category-filter__item-icon\"> </ecl-icon>\n        }\n    </button>\n} @else {\n    <a\n        [href]=\"href\"\n        class=\"ecl-category-filter__item {{ levelClass }}\"\n        [class.ecl-category-filter__item--has-children]=\"hasChildren\"\n        [attr.aria-current]=\"isCurrent ? true : null\"\n        (click)=\"onItemClick($event)\">\n        @if(isChildItemWithChildren) {\n            <ecl-icon icon=\"solid-arrow\" size=\"xs\" transform=\"rotate-90\" class=\"ecl-category-filter__item-icon\"> </ecl-icon>\n        }\n        <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        @if(isRootItemWithChildren) {\n            <ecl-icon icon=\"corner-arrow\" size=\"xs\" transform=\"rotate-180\" class=\"ecl-category-filter__item-icon\"> </ecl-icon>\n        }\n    </a>\n}\n<ng-content select=\"ecl-category-filter-list\"></ng-content>\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: EclIconModule }, { kind: "component", type: i1.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCategoryFilterItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: EclCategoryFilterItemComponent, isStandalone: true, selector: "ecl-category-filter-item", inputs: { href: "href", id: "id" }, outputs: { itemSelect: "itemSelect" }, host: { properties: { "class.ecl-category-filter__list-item": "this.className", "attr.role": "this.role", "class.ecl-category-filter__list-item--open": "this.isAriaExpanded" } }, queries: [{ propertyName: "eclCategoryList", first: true, predicate: i0.forwardRef(() => EclCategoryFilterListComponent), descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (hasChildren) {\n    <button\n        class=\"ecl-category-filter__item {{ levelClass }}\"\n        [class.ecl-category-filter__item--has-children]=\"hasChildren\"\n        [class.ecl-category-filter__item--current]=\"isCurrent\"\n        [attr.aria-current]=\"isCurrent ? true : null\"\n        [attr.aria-expanded] = \"isExpanded\"\n        [attr.aria-controls]=\"id\"\n        (click)=\"onItemClick($event)\">\n        @if(isChildItemWithChildren) {\n            <ecl-icon icon=\"solid-arrow\" size=\"xs\" transform=\"rotate-90\" class=\"ecl-category-filter__item-icon\"> </ecl-icon>\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        }\n        @if(isRootItemWithChildren) {\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n            <ecl-icon icon=\"corner-arrow\" size=\"xs\" transform=\"rotate-180\" class=\"ecl-category-filter__item-icon\"> </ecl-icon>\n        }\n    </button>\n} @else {\n    <a\n        [href]=\"href\"\n        class=\"ecl-category-filter__item {{ levelClass }}\"\n        [class.ecl-category-filter__item--has-children]=\"hasChildren\"\n        [attr.aria-current]=\"isCurrent ? true : null\"\n        (click)=\"onItemClick($event)\">\n        @if(isChildItemWithChildren) {\n            <ecl-icon icon=\"solid-arrow\" size=\"xs\" transform=\"rotate-90\" class=\"ecl-category-filter__item-icon\"> </ecl-icon>\n        }\n        <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        @if(isRootItemWithChildren) {\n            <ecl-icon icon=\"corner-arrow\" size=\"xs\" transform=\"rotate-180\" class=\"ecl-category-filter__item-icon\"> </ecl-icon>\n        }\n    </a>\n}\n<ng-content select=\"ecl-category-filter-list\"></ng-content>\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: EclIconModule }, { kind: "component", type: i1.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCategoryFilterItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCategoryFilterItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-category-filter-item', imports: [
                         NgTemplateOutlet,
@@ -195,10 +195,10 @@ class EclCategoryFilterListComponent extends ECLBaseDirective {
             this.eclCategoryFilterItems.forEach((item) => (item.level = value));
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCategoryFilterListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: EclCategoryFilterListComponent, isStandalone: true, selector: "ecl-category-filter-list", host: { properties: { "class.ecl-category-filter__list": "this.className", "attr.role": "this.role", "attr.aria-controls": "this.controls" } }, queries: [{ propertyName: "eclCategoryFilterItems", predicate: i0.forwardRef(() => EclCategoryFilterItemComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCategoryFilterListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: EclCategoryFilterListComponent, isStandalone: true, selector: "ecl-category-filter-list", host: { properties: { "class.ecl-category-filter__list": "this.className", "attr.role": "this.role", "attr.aria-controls": "this.controls" } }, queries: [{ propertyName: "eclCategoryFilterItems", predicate: i0.forwardRef(() => EclCategoryFilterItemComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCategoryFilterListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCategoryFilterListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-category-filter-list', template: "<ng-content></ng-content>\n" }]
         }], propDecorators: { className: [{
@@ -313,10 +313,10 @@ class EclCategoryFilterComponent extends ECLBaseDirective {
             it.isCurrent = false;
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCategoryFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: EclCategoryFilterComponent, isStandalone: true, selector: "ecl-category-filter", inputs: { currentItemId: "currentItemId", ariaLabel: ["aria-label", "ariaLabel"] }, host: { properties: { "class.ecl-category-filter": "this.className", "attr.role": "this.role", "attr.aria-label": "this.ariaLabel" } }, queries: [{ propertyName: "eclCategoryList", first: true, predicate: i0.forwardRef(() => EclCategoryFilterListComponent), descendants: true }, { propertyName: "eclCategoryFilterItemsAll", predicate: i0.forwardRef(() => EclCategoryFilterItemComponent), descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCategoryFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: EclCategoryFilterComponent, isStandalone: true, selector: "ecl-category-filter", inputs: { currentItemId: "currentItemId", ariaLabel: ["aria-label", "ariaLabel"] }, host: { properties: { "class.ecl-category-filter": "this.className", "attr.role": "this.role", "attr.aria-label": "this.ariaLabel" } }, queries: [{ propertyName: "eclCategoryList", first: true, predicate: i0.forwardRef(() => EclCategoryFilterListComponent), descendants: true }, { propertyName: "eclCategoryFilterItemsAll", predicate: i0.forwardRef(() => EclCategoryFilterItemComponent), descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCategoryFilterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCategoryFilterComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-category-filter', template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] }]
         }], ctorParameters: () => [], propDecorators: { currentItemId: [{
@@ -348,11 +348,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImpor
  * @deprecated Use {@link EUI_ECL_CATEGORY_FILTER} instead.
  */
 class EclCategoryFilterModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCategoryFilterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.6", ngImport: i0, type: EclCategoryFilterModule, imports: [EclCategoryFilterComponent, EclCategoryFilterListComponent, EclCategoryFilterItemComponent], exports: [EclCategoryFilterComponent, EclCategoryFilterListComponent, EclCategoryFilterItemComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCategoryFilterModule, imports: [EclCategoryFilterItemComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCategoryFilterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.7", ngImport: i0, type: EclCategoryFilterModule, imports: [EclCategoryFilterComponent, EclCategoryFilterListComponent, EclCategoryFilterItemComponent], exports: [EclCategoryFilterComponent, EclCategoryFilterListComponent, EclCategoryFilterItemComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCategoryFilterModule, imports: [EclCategoryFilterItemComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCategoryFilterModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCategoryFilterModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [EclCategoryFilterComponent, EclCategoryFilterListComponent, EclCategoryFilterItemComponent],

package/fesm2022/eui-ecl-components-ecl-checkbox.mjs

@@ -24,10 +24,10 @@ class EclCheckboxHelpComponent extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-checkbox__help')].join(' ');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCheckboxHelpComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.1.6", type: EclCheckboxHelpComponent, isStandalone: true, selector: "[eclCheckboxHelp]", inputs: { isDisabled: ["isDisabled", "isDisabled", booleanAttribute] }, host: { properties: { "class.ecl-checkbox__help--disabled": "this.isDisabled", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCheckboxHelpComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.1.7", type: EclCheckboxHelpComponent, isStandalone: true, selector: "[eclCheckboxHelp]", inputs: { isDisabled: ["isDisabled", "isDisabled", booleanAttribute] }, host: { properties: { "class.ecl-checkbox__help--disabled": "this.isDisabled", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCheckboxHelpComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCheckboxHelpComponent, decorators: [{
             type: Component,
             args: [{ selector: '[eclCheckboxHelp]', template: "<ng-content></ng-content>\n" }]
         }], propDecorators: { isDisabled: [{
@@ -66,10 +66,10 @@ class EclCheckboxLabelComponent extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-checkbox__label')].join(' ');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCheckboxLabelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: EclCheckboxLabelComponent, isStandalone: true, selector: "label[eclCheckboxLabel]", inputs: { isInvalid: ["isInvalid", "isInvalid", booleanAttribute], isDisabled: ["isDisabled", "isDisabled", booleanAttribute], isRequired: ["isRequired", "isRequired", booleanAttribute] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<span class=\"ecl-checkbox__box\" [class.ecl-checkbox__box--disabled]=\"isDisabled\" [class.ecl-checkbox__box--invalid]=\"isInvalid\">\n    <ecl-icon size=\"xs\" icon=\"check\" class=\"ecl-checkbox__icon\"></ecl-icon>\n</span>\n\n<span class=\"ecl-checkbox__text\">\n    <ng-content></ng-content>\n</span>\n@if(isRequired) {\n<span class=\"ecl-form-label__required\" role=\"note\" aria-label=\"required\">*</span>\n}", dependencies: [{ kind: "ngmodule", type: EclIconModule }, { kind: "component", type: i1.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCheckboxLabelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: EclCheckboxLabelComponent, isStandalone: true, selector: "label[eclCheckboxLabel]", inputs: { isInvalid: ["isInvalid", "isInvalid", booleanAttribute], isDisabled: ["isDisabled", "isDisabled", booleanAttribute], isRequired: ["isRequired", "isRequired", booleanAttribute] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<span class=\"ecl-checkbox__box\" [class.ecl-checkbox__box--disabled]=\"isDisabled\" [class.ecl-checkbox__box--invalid]=\"isInvalid\">\n    <ecl-icon size=\"xs\" icon=\"check\" class=\"ecl-checkbox__icon\"></ecl-icon>\n</span>\n\n<span class=\"ecl-checkbox__text\">\n    <ng-content></ng-content>\n</span>\n@if(isRequired) {\n<span class=\"ecl-form-label__required\" role=\"note\" aria-label=\"required\">*</span>\n}", dependencies: [{ kind: "ngmodule", type: EclIconModule }, { kind: "component", type: i1.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCheckboxLabelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCheckboxLabelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'label[eclCheckboxLabel]', imports: [EclIconModule], encapsulation: ViewEncapsulation.None, template: "<span class=\"ecl-checkbox__box\" [class.ecl-checkbox__box--disabled]=\"isDisabled\" [class.ecl-checkbox__box--invalid]=\"isInvalid\">\n    <ecl-icon size=\"xs\" icon=\"check\" class=\"ecl-checkbox__icon\"></ecl-icon>\n</span>\n\n<span class=\"ecl-checkbox__text\">\n    <ng-content></ng-content>\n</span>\n@if(isRequired) {\n<span class=\"ecl-form-label__required\" role=\"note\" aria-label=\"required\">*</span>\n}" }]
         }], propDecorators: { isInvalid: [{
@@ -126,10 +126,10 @@ class EclCheckboxDirective extends ECLBaseDirective {
             this.eclCheckboxHelpComponent.isDisabled = this.isDisabled;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCheckboxDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.1.6", type: EclCheckboxDirective, isStandalone: true, selector: "[eclCheckbox]", inputs: { isDisabled: ["isDisabled", "isDisabled", booleanAttribute], isInvalid: ["isInvalid", "isInvalid", booleanAttribute], isSingle: ["isSingle", "isSingle", booleanAttribute] }, host: { properties: { "class.ecl-checkbox--disabled": "this.isDisabled", "class.ecl-checkbox--invalid": "this.isInvalid", "class.ecl-checkbox--single": "this.isSingle", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclCheckboxLabelComponent", first: true, predicate: i0.forwardRef(() => EclCheckboxLabelComponent), descendants: true }, { propertyName: "eclCheckboxHelpComponent", first: true, predicate: i0.forwardRef(() => EclCheckboxHelpComponent), descendants: true }, { propertyName: "eclFormLabelDirective", first: true, predicate: i0.forwardRef(() => EclFormLabelComponent), descendants: true }, { propertyName: "eclHelpBlockDirective", first: true, predicate: i0.forwardRef(() => EclHelpBlockDirective), descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCheckboxDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.1.7", type: EclCheckboxDirective, isStandalone: true, selector: "[eclCheckbox]", inputs: { isDisabled: ["isDisabled", "isDisabled", booleanAttribute], isInvalid: ["isInvalid", "isInvalid", booleanAttribute], isSingle: ["isSingle", "isSingle", booleanAttribute] }, host: { properties: { "class.ecl-checkbox--disabled": "this.isDisabled", "class.ecl-checkbox--invalid": "this.isInvalid", "class.ecl-checkbox--single": "this.isSingle", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclCheckboxLabelComponent", first: true, predicate: i0.forwardRef(() => EclCheckboxLabelComponent), descendants: true }, { propertyName: "eclCheckboxHelpComponent", first: true, predicate: i0.forwardRef(() => EclCheckboxHelpComponent), descendants: true }, { propertyName: "eclFormLabelDirective", first: true, predicate: i0.forwardRef(() => EclFormLabelComponent), descendants: true }, { propertyName: "eclHelpBlockDirective", first: true, predicate: i0.forwardRef(() => EclHelpBlockDirective), descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCheckboxDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCheckboxDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclCheckbox]',
@@ -192,10 +192,10 @@ class EclCheckboxInputDirective extends ECLBaseDirective {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCheckboxInputDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.6", type: EclCheckboxInputDirective, isStandalone: true, selector: "input[eclCheckboxInput]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCheckboxInputDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.7", type: EclCheckboxInputDirective, isStandalone: true, selector: "input[eclCheckboxInput]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCheckboxInputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCheckboxInputDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'input[eclCheckboxInput]',
@@ -212,11 +212,11 @@ const COMPONENTS = [EclCheckboxLabelComponent, EclCheckboxHelpComponent, EclChec
  * @deprecated Use {@link EUI_ECL_CHECKBOX} instead.
  */
 class EclCheckboxModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.6", ngImport: i0, type: EclCheckboxModule, imports: [EclCheckboxLabelComponent, EclCheckboxHelpComponent, EclCheckboxInputDirective, EclCheckboxDirective], exports: [EclCheckboxLabelComponent, EclCheckboxHelpComponent, EclCheckboxInputDirective, EclCheckboxDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCheckboxModule, imports: [EclCheckboxLabelComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCheckboxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.7", ngImport: i0, type: EclCheckboxModule, imports: [EclCheckboxLabelComponent, EclCheckboxHelpComponent, EclCheckboxInputDirective, EclCheckboxDirective], exports: [EclCheckboxLabelComponent, EclCheckboxHelpComponent, EclCheckboxInputDirective, EclCheckboxDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCheckboxModule, imports: [EclCheckboxLabelComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclCheckboxModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EclCheckboxModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...COMPONENTS],