npm - @eui/ecl - Versions diffs - 21.0.0-alpha.36 → 21.0.0-alpha.38 - Mend

@eui/ecl 21.0.0-alpha.36 → 21.0.0-alpha.38

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (184) hide show

package/fesm2022/eui-ecl-components-ecl-modal.mjs CHANGED Viewed

@@ -11,6 +11,7 @@ import * as i1 from '@eui/ecl/components/ecl-icon';
 import { EUI_ECL_ICON } from '@eui/ecl/components/ecl-icon';
 import * as i1$1 from '@angular/cdk/a11y';
 import { A11yModule } from '@angular/cdk/a11y';
+import { uniqueId } from '@eui/core';
 import { NgTemplateOutlet } from '@angular/common';
 /**
@@ -115,7 +116,7 @@ class EclModalHeaderComponent extends ECLBaseDirective {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-rc.0", ngImport: i0, type: EclModalHeaderComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-rc.0", type: EclModalHeaderComponent, isStandalone: true, selector: "[eclModalHeader]", inputs: { variant: "variant" }, outputs: { modalClose: "modalClose" }, host: { properties: { "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if(getIcon()) {\n    @if(variant === 'warning') {\n        <span class=\"ecl-modal__icon-background\"></span>\n    }\n    <ecl-icon [icon]=\"getIcon()\" size=\"l\" class=\"ecl-modal__icon\" [title]=\"variant\"></ecl-icon>\n}\n<div class=\"ecl-modal__header-content\">\n    <ng-content></ng-content>\n</div>\n<button #closeButton eclButton variant=\"tertiary\" isIconOnly class=\"ecl-modal__close\" type=\"button\" (click)=\"onCloseClick()\">\n    <span eclButtonLabel>{{ 'ecl.common.CLOSE' | translate }}</span>\n    <ecl-icon icon=\"close\" size=\"m\"></ecl-icon>\n</button>\n", dependencies: [{ kind: "component", type: i1.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: i2.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "containerStyleClass"] }, { kind: "directive", type: i2.EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-rc.0", type: EclModalHeaderComponent, isStandalone: true, selector: "[eclModalHeader]", inputs: { variant: "variant" }, outputs: { modalClose: "modalClose" }, host: { properties: { "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true }], usesInheritance: true, ngImport: i0, template: "@if(getIcon()) {\n    @if(variant === 'warning') {\n        <span class=\"ecl-modal__icon-background\"></span>\n    }\n    <ecl-icon [icon]=\"getIcon()\" size=\"l\" class=\"ecl-modal__icon\" [title]=\"variant\"></ecl-icon>\n}\n<div class=\"ecl-modal__header-content\">\n    <ng-content></ng-content>\n</div>\n<button #closeButton eclButton variant=\"tertiary\" isIconOnly class=\"ecl-modal__close\" type=\"button\" (click)=\"onCloseClick()\">\n    <span eclButtonLabel>{{ 'ecl.common.CLOSE' | translate }}</span>\n    <ecl-icon icon=\"close\" size=\"m\"></ecl-icon>\n</button>\n", dependencies: [{ kind: "component", type: i1.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: i2.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "eclStyle", "size", "containerStyleClass"] }, { kind: "directive", type: i2.EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-rc.0", ngImport: i0, type: EclModalHeaderComponent, decorators: [{
             type: Component,
@@ -151,6 +152,12 @@ class EclModalComponent extends ECLBaseDirective {
          * - 'full' – full width
          */
         this.size = 'l';
+        /**
+         * Unique ID for the modal body.
+         * - Used for accessibility (`aria-describedby` on the modal container).
+         * - Generated dynamically using `uniqueId()` to avoid duplicate IDs on the same page.
+         */
+        this.eclModalBodyId = `ecl-modal-body-${uniqueId()}`;
         /**
          * Emits when the modal is closed.
          *
@@ -189,6 +196,13 @@ class EclModalComponent extends ECLBaseDirective {
     get isModalOpened() {
         return this.isOpen;
     }
+    /**
+     * Binds the `aria-describedby` attribute to the modal element.
+     * Connects the dialog with the modal body via its unique ID for accessibility.
+     */
+    get hostAriaDescribedBy() {
+        return this.eclModalBodyId;
+    }
     /**
      * Applies base and variant CSS classes to the modal element.
      */
@@ -269,7 +283,7 @@ class EclModalComponent extends ECLBaseDirective {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-rc.0", ngImport: i0, type: EclModalComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.0-rc.0", type: EclModalComponent, isStandalone: true, selector: "dialog[eclModal]", inputs: { variant: "variant", size: "size", isOpen: "isOpen" }, outputs: { modalClose: "modalClose", modalOpen: "modalOpen" }, host: { listeners: { "document:keydown.escape": "onEscapeKeydownHandler()" }, properties: { "attr.open": "this.isModalOpened", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclModalHeader", first: true, predicate: i0.forwardRef(() => EclModalHeaderComponent), descendants: true }, { propertyName: "eclModalCloseComponents", predicate: i0.forwardRef(() => EclModalCloseDirective), descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"ecl-modal__container\">\n    <div class=\"ecl-modal__content ecl-container\" cdkTrapFocus cdkTrapFocusAutoCapture>\n        <ng-content></ng-content>\n    </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.0-rc.0", type: EclModalComponent, isStandalone: true, selector: "dialog[eclModal]", inputs: { variant: "variant", size: "size", eclModalBodyId: "eclModalBodyId", isOpen: "isOpen" }, outputs: { modalClose: "modalClose", modalOpen: "modalOpen" }, host: { listeners: { "document:keydown.escape": "onEscapeKeydownHandler()" }, properties: { "attr.open": "this.isModalOpened", "attr.aria-describedby": "this.hostAriaDescribedBy", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclModalHeader", first: true, predicate: i0.forwardRef(() => EclModalHeaderComponent), descendants: true }, { propertyName: "eclModalCloseComponents", predicate: i0.forwardRef(() => EclModalCloseDirective), descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"ecl-modal__container\">\n    <div class=\"ecl-modal__content ecl-container\" cdkTrapFocus cdkTrapFocusAutoCapture>\n        <ng-content></ng-content>\n    </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i1$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-rc.0", ngImport: i0, type: EclModalComponent, decorators: [{
             type: Component,
@@ -278,6 +292,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-rc.0", ng
                 type: Input
             }], size: [{
                 type: Input
+            }], eclModalBodyId: [{
+                type: Input
             }], isOpen: [{
                 type: Input
             }], modalClose: [{
@@ -293,6 +309,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-rc.0", ng
             }], isModalOpened: [{
                 type: HostBinding,
                 args: ['attr.open']
+            }], hostAriaDescribedBy: [{
+                type: HostBinding,
+                args: ['attr.aria-describedby']
             }], cssClasses: [{
                 type: HostBinding,
                 args: ['class']
@@ -364,16 +383,18 @@ class EclModalBodyComponent extends ECLBaseDirective {
         ].join(' ').trim();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-rc.0", ngImport: i0, type: EclModalBodyComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-rc.0", type: EclModalBodyComponent, isStandalone: true, selector: "[eclModalBody]", inputs: { isScrollable: ["isScrollable", "isScrollable", booleanAttribute] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "@if (isScrollable) {\n<div class=\"ecl-modal__body-scroll\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</div>\n<div class=\"ecl-modal__body-overflow\" aria-hidden=\"true\"></div>\n<ng-content select=\"[eclModalBodyFixedContent]\"></ng-content>\n} @else {\n<ng-container *ngTemplateOutlet=\"content\"></ng-container>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0-rc.0", type: EclModalBodyComponent, isStandalone: true, selector: "[eclModalBody]", inputs: { isScrollable: ["isScrollable", "isScrollable", booleanAttribute], eclModalBodyId: "eclModalBodyId" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "@if (isScrollable) {\n<div class=\"ecl-modal__body-scroll\" [id]=\"eclModalBodyId\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</div>\n<div class=\"ecl-modal__body-overflow\" aria-hidden=\"true\"></div>\n<ng-content select=\"[eclModalBodyFixedContent]\"></ng-content>\n} @else {\n<ng-container *ngTemplateOutlet=\"content\"></ng-container>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-rc.0", ngImport: i0, type: EclModalBodyComponent, decorators: [{
             type: Component,
             args: [{ selector: '[eclModalBody]', imports: [
                         NgTemplateOutlet,
-                    ], template: "@if (isScrollable) {\n<div class=\"ecl-modal__body-scroll\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</div>\n<div class=\"ecl-modal__body-overflow\" aria-hidden=\"true\"></div>\n<ng-content select=\"[eclModalBodyFixedContent]\"></ng-content>\n} @else {\n<ng-container *ngTemplateOutlet=\"content\"></ng-container>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>" }]
+                    ], template: "@if (isScrollable) {\n<div class=\"ecl-modal__body-scroll\" [id]=\"eclModalBodyId\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</div>\n<div class=\"ecl-modal__body-overflow\" aria-hidden=\"true\"></div>\n<ng-content select=\"[eclModalBodyFixedContent]\"></ng-content>\n} @else {\n<ng-container *ngTemplateOutlet=\"content\"></ng-container>\n}\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>" }]
         }], propDecorators: { isScrollable: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
+            }], eclModalBodyId: [{
+                type: Input
             }], cssClasses: [{
                 type: HostBinding,
                 args: ['class']

package/fesm2022/eui-ecl-components-ecl-modal.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"eui-ecl-components-ecl-modal.mjs","sources":["../../components/ecl-modal/ecl-modal-close.directive.ts","../../components/ecl-modal/events/ecl-modal-open.event.ts","../../components/ecl-modal/events/ecl-modal-close.event.ts","../../components/ecl-modal/ecl-modal-header.component.ts","../../components/ecl-modal/ecl-modal-header.component.html","../../components/ecl-modal/ecl-modal.component.ts","../../components/ecl-modal/ecl-modal.component.html","../../components/ecl-modal/ecl-modal-footer.component.ts","../../components/ecl-modal/ecl-modal-footer.component.html","../../components/ecl-modal/ecl-modal-body.component.ts","../../components/ecl-modal/ecl-modal-body.component.html","../../components/ecl-modal/ecl-modal-body-fixed.directive.ts","../../components/ecl-modal/ecl-modal-trigger.directive.ts","../../components/ecl-modal/ecl-modal.module.ts","../../components/ecl-modal/index.ts","../../components/ecl-modal/eui-ecl-components-ecl-modal.ts"],"sourcesContent":["import { Directive, EventEmitter, HostListener, Input, Output } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/*\n Directive that allows an element to close the modal on click.\n \n Can emit a result and indicate the role (e.g., confirm, cancel).\n /\n@Directive({\n selector: '[eclModalClose]',\n})\nexport class EclModalCloseDirective<T> extends ECLBaseDirective {\n /\n Optional result value to emit when modal is closed.\n /\n @Input('eclModalClose') eclModalResult: T;\n\n /\n Optional role associated with the modal close action (e.g., confirm, cancel).\n /\n @Input() eclModalRole: 'confirm' \| 'cancel' \| string;\n\n /\n Event emitted when the element is clicked and the modal should be closed.\n /\n @Output() modalClose = new EventEmitter();\n\n /\n Handles click events and emits the `modalClose` event.\n /\n @HostListener('click', ['$event'])\n onClick(evt: MouseEvent): void {\n this.modalClose.next(null);\n }\n}\n","import { EclBaseEvent } from '@eui/ecl/core';\nexport class EclModalOpenEvent extends EclBaseEvent {}","import { EclBaseEvent } from '@eui/ecl/core';\nimport { EclModalResult } from '../models/ecl-modal-result.model';\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport class EclModalCloseEvent<T = any> extends EclBaseEvent {\n\tconstructor(public eclModalResult?: EclModalResult<T>) {\n\t\tsuper();\n\t}\n}","import { Component, EventEmitter, HostBinding, Input, Output, ViewChild, inject } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { EclThemeService } from '@eui/ecl/core';\nimport { EclModalCloseEvent } from './events';\nimport { EclButtonComponent } from '@eui/ecl/components/ecl-button';\nimport { TranslateModule } from '@ngx-translate/core';\nimport { EUI_ECL_BUTTON } from '@eui/ecl/components/ecl-button';\nimport { EUI_ECL_ICON } from '@eui/ecl/components/ecl-icon';\n\n/\n Header component used within the ECL Modal.\n \n Displays an icon depending on the modal variant, user-defined content,\n * and a close button that emits a close event.\n /\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[eclModalHeader]',\n templateUrl: './ecl-modal-header.component.html',\n imports: [\n ...EUI_ECL_ICON,\n TranslateModule,\n ...EUI_ECL_BUTTON,\n ],\n})\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport class EclModalHeaderComponent<T = any> extends ECLBaseDirective {\n eclThemeService = inject(EclThemeService);\n\n /\n Defines the visual variant of the modal.\n \n Determines which icon is shown in the header.\n \n Possible values:\n * - `'information'`\n * - `'success'`\n * - `'warning'`\n * - `'error'`\n * - any other custom string (no icon will be shown)\n /\n @Input() variant: 'information' \| 'success' \| 'warning' \| 'error' \| string;\n\n /\n Event emitted when the close button is clicked.\n \n Emits an `EclModalCloseEvent` object.\n /\n @Output() modalClose = new EventEmitter<EclModalCloseEvent<T>>();\n\n /\n Applies the ECL CSS class for modal header container.\n /\n @ViewChild('closeButton') closeButton: EclButtonComponent;\n \n @HostBinding('class')\n get cssClasses(): string {\n return [super.getCssClasses('ecl-modal__header')].join(' ').trim();\n }\n\n /\n Handles the click event on the close button.\n \n Emits a `modalClose` event with no payload.\n /\n onCloseClick(): void {\n this.modalClose.next(new EclModalCloseEvent());\n }\n\n /\n Returns the name of the icon associated with the current variant.\n \n @returns The icon name, or `null` if no matching variant exists.\n /\n getIcon(): 'information' \| 'check-filled' \| 'warning' \| 'error' \| null {\n if (this.variant === 'information') {\n return 'information';\n } else if (this.variant === 'success') {\n return 'check-filled';\n } else if (this.variant === 'warning') {\n return 'warning';\n } else if (this.variant === 'error') {\n return 'error';\n } else {\n return null;\n }\n }\n}\n","@if(getIcon()) {\n @if(variant === 'warning') {\n <span class=\"ecl-modal__icon-background\"></span>\n }\n <ecl-icon [icon]=\"getIcon()\" size=\"l\" class=\"ecl-modal__icon\" [title]=\"variant\"></ecl-icon>\n}\n<div class=\"ecl-modal__header-content\">\n <ng-content></ng-content>\n</div>\n<button #closeButton eclButton variant=\"tertiary\" isIconOnly class=\"ecl-modal__close\" type=\"button\" (click)=\"onCloseClick()\">\n <span eclButtonLabel>{{ 'ecl.common.CLOSE' \| translate }}</span>\n <ecl-icon icon=\"close\" size=\"m\"></ecl-icon>\n</button>\n","/ eslint-disable @typescript-eslint/no-explicit-any /\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport {\n AfterContentInit,\n Component,\n ContentChild,\n ContentChildren,\n EventEmitter,\n forwardRef,\n HostBinding,\n HostListener,\n Input,\n OnChanges,\n OnDestroy,\n Output,\n QueryList,\n} from '@angular/core';\nimport { Subject, takeUntil } from 'rxjs';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { EclModalCloseDirective } from './ecl-modal-close.directive';\nimport { EclModalHeaderComponent } from './ecl-modal-header.component';\nimport { EclModalResult } from './models/ecl-modal-result.model';\nimport { EclModalCloseEvent } from './events';\nimport { EclModalOpenEvent } from './events';\nimport { A11yModule } from '@angular/cdk/a11y';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'dialog[eclModal]',\n templateUrl: './ecl-modal.component.html',\n imports: [A11yModule],\n})\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport class EclModalComponent<T = any> extends ECLBaseDirective implements OnChanges, AfterContentInit, OnDestroy {\n /\n Defines the visual variant of the modal.\n * \n * Possible values: 'information', 'success', 'warning', 'error', or a custom string.\n /\n @Input() variant: 'information' \| 'success' \| 'warning' \| 'error' \| string;\n\n /\n Defines the size of the modal.\n * \n * Possible values:\n * - 's' – small\n * - 'm' – medium\n * - 'l' – large (default)\n * - 'full' – full width\n /\n @Input() size: 's' \| 'm' \| 'l' \| 'full' \| string = 'l';\n\n /\n Controls whether the modal is open.\n * \n * Can be set to any truthy value to open the modal.\n /\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Input()\n set isOpen(value: boolean \| any) {\n this._isOpen = coerceBooleanProperty(value);\n }\n\n /\n Returns the open state of the modal.\n /\n get isOpen(): boolean \| null {\n return this._isOpen \|\| null;\n }\n\n /\n Emits when the modal is closed.\n * \n * Carries an instance of `EclModalCloseEvent`.\n /\n @Output() modalClose = new EventEmitter<EclModalCloseEvent<T>>();\n\n /\n Emits when the modal is opened.\n * \n * Carries an instance of `EclModalOpenEvent`.\n /\n @Output() modalOpen = new EventEmitter<EclModalOpenEvent>();\n\n /\n Header component projected into the modal.\n /\n @ContentChild(forwardRef(() => EclModalHeaderComponent)) eclModalHeader: EclModalHeaderComponent<T>;\n\n /\n All close directives projected inside the modal.\n /\n @ContentChildren(forwardRef(() => EclModalCloseDirective), { descendants: true })\n eclModalCloseComponents: QueryList<EclModalCloseDirective<T>>;\n\n private _isOpen = false;\n private destroy$: Subject<boolean> = new Subject<boolean>();\n\n /\n Binds the `open` attribute to the modal element.\n * \n * Used by the native `<dialog>` element.\n /\n @HostBinding('attr.open')\n get isModalOpened(): boolean {\n return this.isOpen;\n }\n\n /\n Applies base and variant CSS classes to the modal element.\n /\n @HostBinding('class')\n get cssClasses(): string {\n return [super.getCssClasses('ecl-modal'),\n this.variant ? `ecl-modal--${this.variant}` : '',\n `ecl-modal--${this.size}`,\n ].join(' ').trim();\n }\n\n /\n Handles ESC key press to close the modal with `cancel` role.\n /\n @HostListener('document:keydown.escape')\n onEscapeKeydownHandler(): void {\n this.closeModal({ eclModalRole: 'cancel' });\n }\n\n /\n Reacts to input changes and updates the modal header if available.\n /\n ngOnChanges(): void {\n if (this.eclModalHeader) {\n this.eclModalHeader.variant = this.variant;\n }\n }\n\n /\n Subscribes to close events from header and close directives after content is initialized.\n /\n ngAfterContentInit(): void {\n if (this.eclModalHeader) {\n this.eclModalHeader.variant = this.variant;\n this.eclModalHeader.modalClose.pipe(takeUntil(this.destroy$)).subscribe(() => {\n this.closeModal({ eclModalRole: 'cancel' });\n });\n }\n\n this.eclModalCloseComponents?.forEach((eclModalCloseCmp) => {\n eclModalCloseCmp.modalClose.pipe(takeUntil(this.destroy$)).subscribe(() => {\n this.closeModal({\n eclModalData: eclModalCloseCmp.eclModalResult,\n eclModalRole: eclModalCloseCmp.eclModalRole,\n });\n });\n });\n }\n\n /\n Cleans up subscriptions on component destruction.\n /\n ngOnDestroy(): void {\n this.destroy$.next(true);\n this.destroy$.unsubscribe();\n }\n\n /\n Opens the modal and emits a `modalOpen` event.\n * \n * If the event is not prevented, the modal will be displayed.\n /\n openModal(): void {\n const event = new EclModalOpenEvent();\n this.modalOpen.next(event);\n\n if (!event.defaultPrevented) {\n this.isOpen = true;\n }\n setTimeout(() => this.eclModalHeader.closeButton.el.nativeElement.focus(), 100);\n }\n\n /\n Closes the modal and emits a `modalClose` event with optional result data.\n * \n * If the event is not prevented, the modal will be hidden.\n /\n closeModal(result?: EclModalResult<T>): void {\n if (this.isOpen) {\n const event = new EclModalCloseEvent({\n eclModalData: result?.eclModalData,\n eclModalRole: result?.eclModalRole,\n });\n this.modalClose.next(event);\n\n if (!event.defaultPrevented) {\n this.isOpen = false;\n }\n }\n }\n}\n","<div class=\"ecl-modal__container\">\n <div class=\"ecl-modal__content ecl-container\" cdkTrapFocus cdkTrapFocusAutoCapture>\n <ng-content></ng-content>\n </div>\n</div>\n","import { AfterContentInit, Component, ContentChildren, forwardRef, HostBinding, QueryList } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { EclButtonComponent } from '@eui/ecl/components/ecl-button';\n\n/\n Footer component used within the ECL Modal.\n \n Automatically applies styling to buttons projected into the footer.\n /\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[eclModalFooter]',\n templateUrl: './ecl-modal-footer.component.html',\n})\nexport class EclModalFooterComponent extends ECLBaseDirective implements AfterContentInit {\n /\n Queries all button components projected into the footer.\n /\n @ContentChildren(forwardRef(() => EclButtonComponent), { descendants: true })\n buttonComponents: QueryList<EclButtonComponent>;\n\n /\n Applies the ECL CSS class for modal footer container.\n /\n @HostBinding('class')\n get cssClasses(): string {\n return [super.getCssClasses('ecl-modal__footer')].join(' ').trim();\n }\n\n /\n Lifecycle hook that runs after content projection.\n \n Applies `ecl-modal__button` class to each projected button component.\n /\n ngAfterContentInit(): void {\n if (this.buttonComponents) {\n setTimeout(() => {\n this.buttonComponents.forEach((btn) => {\n btn.class = 'ecl-modal__button';\n });\n });\n }\n }\n}\n","<div class=\"ecl-modal__footer-content\">\n <ng-content></ng-content>\n</div>\n","import { Component, HostBinding, Input, booleanAttribute } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { NgTemplateOutlet } from '@angular/common';\n\n/\n Body component used inside the ECL Modal.\n \n Optionally allows scrollable content inside the modal body.\n /\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[eclModalBody]',\n templateUrl: './ecl-modal-body.component.html',\n imports: [\n NgTemplateOutlet,\n ],\n})\nexport class EclModalBodyComponent extends ECLBaseDirective {\n /\n When true, adds a modifier class to allow scrollable content inside the modal body.\n /\n @Input({ transform: booleanAttribute }) isScrollable = false;\n\n /\n Applies CSS classes for the modal body and scrollable modifier if enabled.\n /\n @HostBinding('class')\n get cssClasses(): string {\n return [\n super.getCssClasses('ecl-modal__body'),\n this.isScrollable ? 'ecl-modal__body--has-scroll' : '',\n ].join(' ').trim();\n }\n}\n","@if (isScrollable) {\n<div class=\"ecl-modal__body-scroll\">\n <ng-container ngTemplateOutlet=\"content\"></ng-container>\n</div>\n<div class=\"ecl-modal__body-overflow\" aria-hidden=\"true\"></div>\n<ng-content select=\"[eclModalBodyFixedContent]\"></ng-content>\n} @else {\n<ng-container ngTemplateOutlet=\"content\"></ng-container>\n}\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>","import { Directive, HostBinding } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/\n Directive for styling fixed content inside the modal body.\n \n Applies the appropriate CSS class to mark the element as fixed inside the modal body.\n /\n@Directive({\n selector: '[eclModalBodyFixedContent]',\n})\nexport class EclModalBodyFixedContentDirective extends ECLBaseDirective {\n /\n Applies the `ecl-modal__body-fixed` class to the host element.\n /\n @HostBinding('class.ecl-modal__body-fixed') className = true;\n}\n","import { Directive, HostListener, Input } from '@angular/core';\nimport { EclModalComponent } from './ecl-modal.component';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/\n Directive used to trigger opening of a target ECL modal on click.\n /\n@Directive({\n selector: '[eclModalTriggerFor]',\n})\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport class EclModalTriggerDirective<T = any> extends ECLBaseDirective {\n /\n Reference to the modal component that should be opened on click.\n /\n @Input() eclModalTriggerFor: EclModalComponent<T>;\n\n /\n Handles click event and opens the target modal.\n /\n @HostListener('click', ['$event'])\n onClick(evt: MouseEvent): void {\n this.eclModalTriggerFor?.openModal();\n }\n}\n","import { NgModule } from '@angular/core';\nimport { EclModalComponent } from './ecl-modal.component';\nimport { EclModalHeaderComponent } from './ecl-modal-header.component';\nimport { EclModalBodyComponent } from './ecl-modal-body.component';\nimport { EclModalFooterComponent } from './ecl-modal-footer.component';\nimport { EclModalCloseDirective } from './ecl-modal-close.directive';\nimport { EclModalTriggerDirective } from './ecl-modal-trigger.directive';\nimport { EclModalBodyFixedContentDirective } from './ecl-modal-body-fixed.directive';\n\nconst COMPONENTS = [\n EclModalComponent,\n EclModalHeaderComponent,\n EclModalBodyComponent,\n EclModalBodyFixedContentDirective,\n EclModalFooterComponent,\n EclModalCloseDirective,\n EclModalTriggerDirective,\n];\n\n/\n @description\n * Module that provides the EclModal component and its dependencies.\n \n @deprecated Use {@link EUI_ECL_MODAL} instead.\n /\n@NgModule({\n imports: [...COMPONENTS],\n exports: [...COMPONENTS],\n})\nexport class EclModalModule {}\n","import { EclModalComponent } from './ecl-modal.component';\nimport { EclModalHeaderComponent } from './ecl-modal-header.component';\nimport { EclModalFooterComponent } from './ecl-modal-footer.component';\nimport { EclModalBodyComponent } from './ecl-modal-body.component';\nimport { EclModalBodyFixedContentDirective } from './ecl-modal-body-fixed.directive';\nimport { EclModalTriggerDirective } from './ecl-modal-trigger.directive';\nimport { EclModalCloseDirective } from './ecl-modal-close.directive';\n\nexport from './ecl-modal.module';\nexport * from './ecl-modal.component';\nexport * from './ecl-modal-header.component';\nexport * from './ecl-modal-footer.component';\nexport * from './ecl-modal-body.component';\nexport * from './ecl-modal-body-fixed.directive';\nexport * from './ecl-modal-trigger.directive';\nexport * from './ecl-modal-close.directive';\nexport * from './events/index';\nexport * from './models/ecl-modal-result.model';\n\nexport const EUI_ECL_MODAL = [\n EclModalComponent,\n EclModalHeaderComponent,\n EclModalFooterComponent,\n EclModalBodyComponent,\n EclModalBodyFixedContentDirective,\n EclModalTriggerDirective,\n EclModalCloseDirective,\n] as const;\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":["i1"],"mappings":"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"}
1	+ {"version":3,"file":"eui-ecl-components-ecl-modal.mjs","sources":["../../components/ecl-modal/ecl-modal-close.directive.ts","../../components/ecl-modal/events/ecl-modal-open.event.ts","../../components/ecl-modal/events/ecl-modal-close.event.ts","../../components/ecl-modal/ecl-modal-header.component.ts","../../components/ecl-modal/ecl-modal-header.component.html","../../components/ecl-modal/ecl-modal.component.ts","../../components/ecl-modal/ecl-modal.component.html","../../components/ecl-modal/ecl-modal-footer.component.ts","../../components/ecl-modal/ecl-modal-footer.component.html","../../components/ecl-modal/ecl-modal-body.component.ts","../../components/ecl-modal/ecl-modal-body.component.html","../../components/ecl-modal/ecl-modal-body-fixed.directive.ts","../../components/ecl-modal/ecl-modal-trigger.directive.ts","../../components/ecl-modal/ecl-modal.module.ts","../../components/ecl-modal/index.ts","../../components/ecl-modal/eui-ecl-components-ecl-modal.ts"],"sourcesContent":["import { Directive, EventEmitter, HostListener, Input, Output } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/*\n Directive that allows an element to close the modal on click.\n \n Can emit a result and indicate the role (e.g., confirm, cancel).\n /\n@Directive({\n selector: '[eclModalClose]',\n})\nexport class EclModalCloseDirective<T> extends ECLBaseDirective {\n /\n Optional result value to emit when modal is closed.\n /\n @Input('eclModalClose') eclModalResult: T;\n\n /\n Optional role associated with the modal close action (e.g., confirm, cancel).\n /\n @Input() eclModalRole: 'confirm' \| 'cancel' \| string;\n\n /\n Event emitted when the element is clicked and the modal should be closed.\n /\n @Output() modalClose = new EventEmitter();\n\n /\n Handles click events and emits the `modalClose` event.\n /\n @HostListener('click', ['$event'])\n onClick(evt: MouseEvent): void {\n this.modalClose.next(null);\n }\n}\n","import { EclBaseEvent } from '@eui/ecl/core';\nexport class EclModalOpenEvent extends EclBaseEvent {}","import { EclBaseEvent } from '@eui/ecl/core';\nimport { EclModalResult } from '../models/ecl-modal-result.model';\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport class EclModalCloseEvent<T = any> extends EclBaseEvent {\n\tconstructor(public eclModalResult?: EclModalResult<T>) {\n\t\tsuper();\n\t}\n}","import { Component, EventEmitter, HostBinding, Input, Output, ViewChild, inject } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { EclThemeService } from '@eui/ecl/core';\nimport { EclModalCloseEvent } from './events';\nimport { EclButtonComponent } from '@eui/ecl/components/ecl-button';\nimport { TranslateModule } from '@ngx-translate/core';\nimport { EUI_ECL_BUTTON } from '@eui/ecl/components/ecl-button';\nimport { EUI_ECL_ICON } from '@eui/ecl/components/ecl-icon';\n\n/\n Header component used within the ECL Modal.\n \n Displays an icon depending on the modal variant, user-defined content,\n * and a close button that emits a close event.\n /\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[eclModalHeader]',\n templateUrl: './ecl-modal-header.component.html',\n imports: [\n ...EUI_ECL_ICON,\n TranslateModule,\n ...EUI_ECL_BUTTON,\n ],\n})\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport class EclModalHeaderComponent<T = any> extends ECLBaseDirective {\n eclThemeService = inject(EclThemeService);\n\n /\n Defines the visual variant of the modal.\n \n Determines which icon is shown in the header.\n \n Possible values:\n * - `'information'`\n * - `'success'`\n * - `'warning'`\n * - `'error'`\n * - any other custom string (no icon will be shown)\n /\n @Input() variant: 'information' \| 'success' \| 'warning' \| 'error' \| string;\n\n /\n Event emitted when the close button is clicked.\n \n Emits an `EclModalCloseEvent` object.\n /\n @Output() modalClose = new EventEmitter<EclModalCloseEvent<T>>();\n\n /\n Applies the ECL CSS class for modal header container.\n /\n @ViewChild('closeButton') closeButton: EclButtonComponent;\n \n @HostBinding('class')\n get cssClasses(): string {\n return [super.getCssClasses('ecl-modal__header')].join(' ').trim();\n }\n\n /\n Handles the click event on the close button.\n \n Emits a `modalClose` event with no payload.\n /\n onCloseClick(): void {\n this.modalClose.next(new EclModalCloseEvent());\n }\n\n /\n Returns the name of the icon associated with the current variant.\n \n @returns The icon name, or `null` if no matching variant exists.\n /\n getIcon(): 'information' \| 'check-filled' \| 'warning' \| 'error' \| null {\n if (this.variant === 'information') {\n return 'information';\n } else if (this.variant === 'success') {\n return 'check-filled';\n } else if (this.variant === 'warning') {\n return 'warning';\n } else if (this.variant === 'error') {\n return 'error';\n } else {\n return null;\n }\n }\n}\n","@if(getIcon()) {\n @if(variant === 'warning') {\n <span class=\"ecl-modal__icon-background\"></span>\n }\n <ecl-icon [icon]=\"getIcon()\" size=\"l\" class=\"ecl-modal__icon\" [title]=\"variant\"></ecl-icon>\n}\n<div class=\"ecl-modal__header-content\">\n <ng-content></ng-content>\n</div>\n<button #closeButton eclButton variant=\"tertiary\" isIconOnly class=\"ecl-modal__close\" type=\"button\" (click)=\"onCloseClick()\">\n <span eclButtonLabel>{{ 'ecl.common.CLOSE' \| translate }}</span>\n <ecl-icon icon=\"close\" size=\"m\"></ecl-icon>\n</button>\n","/ eslint-disable @typescript-eslint/no-explicit-any /\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport {\n AfterContentInit,\n Component,\n ContentChild,\n ContentChildren,\n EventEmitter,\n forwardRef,\n HostBinding,\n HostListener,\n Input,\n OnChanges,\n OnDestroy,\n Output,\n QueryList,\n} from '@angular/core';\nimport { Subject, takeUntil } from 'rxjs';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { EclModalCloseDirective } from './ecl-modal-close.directive';\nimport { EclModalHeaderComponent } from './ecl-modal-header.component';\nimport { EclModalResult } from './models/ecl-modal-result.model';\nimport { EclModalCloseEvent } from './events';\nimport { EclModalOpenEvent } from './events';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { uniqueId } from '@eui/core';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: 'dialog[eclModal]',\n templateUrl: './ecl-modal.component.html',\n imports: [A11yModule],\n})\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport class EclModalComponent<T = any> extends ECLBaseDirective implements OnChanges, AfterContentInit, OnDestroy {\n /\n Defines the visual variant of the modal.\n * \n * Possible values: 'information', 'success', 'warning', 'error', or a custom string.\n /\n @Input() variant: 'information' \| 'success' \| 'warning' \| 'error' \| string;\n\n /\n Defines the size of the modal.\n * \n * Possible values:\n * - 's' – small\n * - 'm' – medium\n * - 'l' – large (default)\n * - 'full' – full width\n /\n @Input() size: 's' \| 'm' \| 'l' \| 'full' \| string = 'l';\n \n /\n Unique ID for the modal body.\n * - Used for accessibility (`aria-describedby` on the modal container).\n * - Generated dynamically using `uniqueId()` to avoid duplicate IDs on the same page.\n /\n @Input() eclModalBodyId: string = `ecl-modal-body-${uniqueId()}`;\n\n /\n Controls whether the modal is open.\n * \n * Can be set to any truthy value to open the modal.\n /\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Input()\n set isOpen(value: boolean \| any) {\n this._isOpen = coerceBooleanProperty(value);\n }\n\n /\n Returns the open state of the modal.\n /\n get isOpen(): boolean \| null {\n return this._isOpen \|\| null;\n }\n\n /\n Emits when the modal is closed.\n * \n * Carries an instance of `EclModalCloseEvent`.\n /\n @Output() modalClose = new EventEmitter<EclModalCloseEvent<T>>();\n\n /\n Emits when the modal is opened.\n * \n * Carries an instance of `EclModalOpenEvent`.\n /\n @Output() modalOpen = new EventEmitter<EclModalOpenEvent>();\n\n /\n Header component projected into the modal.\n /\n @ContentChild(forwardRef(() => EclModalHeaderComponent)) eclModalHeader: EclModalHeaderComponent<T>;\n\n /\n All close directives projected inside the modal.\n /\n @ContentChildren(forwardRef(() => EclModalCloseDirective), { descendants: true })\n eclModalCloseComponents: QueryList<EclModalCloseDirective<T>>;\n\n private _isOpen = false;\n private destroy$: Subject<boolean> = new Subject<boolean>();\n\n /\n Binds the `open` attribute to the modal element.\n * \n * Used by the native `<dialog>` element.\n /\n @HostBinding('attr.open')\n get isModalOpened(): boolean {\n return this.isOpen;\n }\n\n /\n Binds the `aria-describedby` attribute to the modal element.\n * Connects the dialog with the modal body via its unique ID for accessibility.\n /\n @HostBinding('attr.aria-describedby')\n get hostAriaDescribedBy(): string {\n return this.eclModalBodyId;\n }\n\n /\n Applies base and variant CSS classes to the modal element.\n /\n @HostBinding('class')\n get cssClasses(): string {\n return [super.getCssClasses('ecl-modal'),\n this.variant ? `ecl-modal--${this.variant}` : '',\n `ecl-modal--${this.size}`,\n ].join(' ').trim();\n }\n\n /\n Handles ESC key press to close the modal with `cancel` role.\n /\n @HostListener('document:keydown.escape')\n onEscapeKeydownHandler(): void {\n this.closeModal({ eclModalRole: 'cancel' });\n }\n\n /\n Reacts to input changes and updates the modal header if available.\n /\n ngOnChanges(): void {\n if (this.eclModalHeader) {\n this.eclModalHeader.variant = this.variant;\n }\n }\n\n /\n Subscribes to close events from header and close directives after content is initialized.\n /\n ngAfterContentInit(): void {\n if (this.eclModalHeader) {\n this.eclModalHeader.variant = this.variant;\n this.eclModalHeader.modalClose.pipe(takeUntil(this.destroy$)).subscribe(() => {\n this.closeModal({ eclModalRole: 'cancel' });\n });\n }\n\n this.eclModalCloseComponents?.forEach((eclModalCloseCmp) => {\n eclModalCloseCmp.modalClose.pipe(takeUntil(this.destroy$)).subscribe(() => {\n this.closeModal({\n eclModalData: eclModalCloseCmp.eclModalResult,\n eclModalRole: eclModalCloseCmp.eclModalRole,\n });\n });\n });\n }\n\n /\n Cleans up subscriptions on component destruction.\n /\n ngOnDestroy(): void {\n this.destroy$.next(true);\n this.destroy$.unsubscribe();\n }\n\n /\n Opens the modal and emits a `modalOpen` event.\n * \n * If the event is not prevented, the modal will be displayed.\n /\n openModal(): void {\n const event = new EclModalOpenEvent();\n this.modalOpen.next(event);\n\n if (!event.defaultPrevented) {\n this.isOpen = true;\n }\n setTimeout(() => this.eclModalHeader.closeButton.el.nativeElement.focus(), 100);\n }\n\n /\n Closes the modal and emits a `modalClose` event with optional result data.\n * \n * If the event is not prevented, the modal will be hidden.\n /\n closeModal(result?: EclModalResult<T>): void {\n if (this.isOpen) {\n const event = new EclModalCloseEvent({\n eclModalData: result?.eclModalData,\n eclModalRole: result?.eclModalRole,\n });\n this.modalClose.next(event);\n\n if (!event.defaultPrevented) {\n this.isOpen = false;\n }\n }\n }\n}\n","<div class=\"ecl-modal__container\">\n <div class=\"ecl-modal__content ecl-container\" cdkTrapFocus cdkTrapFocusAutoCapture>\n <ng-content></ng-content>\n </div>\n</div>\n","import { AfterContentInit, Component, ContentChildren, forwardRef, HostBinding, QueryList } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { EclButtonComponent } from '@eui/ecl/components/ecl-button';\n\n/\n Footer component used within the ECL Modal.\n \n Automatically applies styling to buttons projected into the footer.\n /\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[eclModalFooter]',\n templateUrl: './ecl-modal-footer.component.html',\n})\nexport class EclModalFooterComponent extends ECLBaseDirective implements AfterContentInit {\n /\n Queries all button components projected into the footer.\n /\n @ContentChildren(forwardRef(() => EclButtonComponent), { descendants: true })\n buttonComponents: QueryList<EclButtonComponent>;\n\n /\n Applies the ECL CSS class for modal footer container.\n /\n @HostBinding('class')\n get cssClasses(): string {\n return [super.getCssClasses('ecl-modal__footer')].join(' ').trim();\n }\n\n /\n Lifecycle hook that runs after content projection.\n \n Applies `ecl-modal__button` class to each projected button component.\n /\n ngAfterContentInit(): void {\n if (this.buttonComponents) {\n setTimeout(() => {\n this.buttonComponents.forEach((btn) => {\n btn.class = 'ecl-modal__button';\n });\n });\n }\n }\n}\n","<div class=\"ecl-modal__footer-content\">\n <ng-content></ng-content>\n</div>\n","import { Component, HostBinding, Input, booleanAttribute } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { NgTemplateOutlet } from '@angular/common';\n\n/\n Body component used inside the ECL Modal.\n \n Optionally allows scrollable content inside the modal body.\n /\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[eclModalBody]',\n templateUrl: './ecl-modal-body.component.html',\n imports: [\n NgTemplateOutlet,\n ],\n})\nexport class EclModalBodyComponent extends ECLBaseDirective {\n /\n When true, adds a modifier class to allow scrollable content inside the modal body.\n /\n @Input({ transform: booleanAttribute }) isScrollable = false;\n \n /\n Unique ID for the modal body, used for accessibility (`aria-describedby`).\n * This ID is passed from the parent `EclModalComponent`.\n /\n @Input() eclModalBodyId!: string;\n\n /\n Applies CSS classes for the modal body and scrollable modifier if enabled.\n /\n @HostBinding('class')\n get cssClasses(): string {\n return [\n super.getCssClasses('ecl-modal__body'),\n this.isScrollable ? 'ecl-modal__body--has-scroll' : '',\n ].join(' ').trim();\n }\n}\n","@if (isScrollable) {\n<div class=\"ecl-modal__body-scroll\" [id]=\"eclModalBodyId\">\n <ng-container ngTemplateOutlet=\"content\"></ng-container>\n</div>\n<div class=\"ecl-modal__body-overflow\" aria-hidden=\"true\"></div>\n<ng-content select=\"[eclModalBodyFixedContent]\"></ng-content>\n} @else {\n<ng-container ngTemplateOutlet=\"content\"></ng-container>\n}\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>","import { Directive, HostBinding } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/\n Directive for styling fixed content inside the modal body.\n \n Applies the appropriate CSS class to mark the element as fixed inside the modal body.\n /\n@Directive({\n selector: '[eclModalBodyFixedContent]',\n})\nexport class EclModalBodyFixedContentDirective extends ECLBaseDirective {\n /\n Applies the `ecl-modal__body-fixed` class to the host element.\n /\n @HostBinding('class.ecl-modal__body-fixed') className = true;\n}\n","import { Directive, HostListener, Input } from '@angular/core';\nimport { EclModalComponent } from './ecl-modal.component';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/\n Directive used to trigger opening of a target ECL modal on click.\n /\n@Directive({\n selector: '[eclModalTriggerFor]',\n})\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport class EclModalTriggerDirective<T = any> extends ECLBaseDirective {\n /\n Reference to the modal component that should be opened on click.\n /\n @Input() eclModalTriggerFor: EclModalComponent<T>;\n\n /\n Handles click event and opens the target modal.\n /\n @HostListener('click', ['$event'])\n onClick(evt: MouseEvent): void {\n this.eclModalTriggerFor?.openModal();\n }\n}\n","import { NgModule } from '@angular/core';\nimport { EclModalComponent } from './ecl-modal.component';\nimport { EclModalHeaderComponent } from './ecl-modal-header.component';\nimport { EclModalBodyComponent } from './ecl-modal-body.component';\nimport { EclModalFooterComponent } from './ecl-modal-footer.component';\nimport { EclModalCloseDirective } from './ecl-modal-close.directive';\nimport { EclModalTriggerDirective } from './ecl-modal-trigger.directive';\nimport { EclModalBodyFixedContentDirective } from './ecl-modal-body-fixed.directive';\n\nconst COMPONENTS = [\n EclModalComponent,\n EclModalHeaderComponent,\n EclModalBodyComponent,\n EclModalBodyFixedContentDirective,\n EclModalFooterComponent,\n EclModalCloseDirective,\n EclModalTriggerDirective,\n];\n\n/\n @description\n * Module that provides the EclModal component and its dependencies.\n \n @deprecated Use {@link EUI_ECL_MODAL} instead.\n /\n@NgModule({\n imports: [...COMPONENTS],\n exports: [...COMPONENTS],\n})\nexport class EclModalModule {}\n","import { EclModalComponent } from './ecl-modal.component';\nimport { EclModalHeaderComponent } from './ecl-modal-header.component';\nimport { EclModalFooterComponent } from './ecl-modal-footer.component';\nimport { EclModalBodyComponent } from './ecl-modal-body.component';\nimport { EclModalBodyFixedContentDirective } from './ecl-modal-body-fixed.directive';\nimport { EclModalTriggerDirective } from './ecl-modal-trigger.directive';\nimport { EclModalCloseDirective } from './ecl-modal-close.directive';\n\nexport from './ecl-modal.module';\nexport * from './ecl-modal.component';\nexport * from './ecl-modal-header.component';\nexport * from './ecl-modal-footer.component';\nexport * from './ecl-modal-body.component';\nexport * from './ecl-modal-body-fixed.directive';\nexport * from './ecl-modal-trigger.directive';\nexport * from './ecl-modal-close.directive';\nexport * from './events/index';\nexport * from './models/ecl-modal-result.model';\n\nexport const EUI_ECL_MODAL = [\n EclModalComponent,\n EclModalHeaderComponent,\n EclModalFooterComponent,\n EclModalBodyComponent,\n EclModalBodyFixedContentDirective,\n EclModalTriggerDirective,\n EclModalCloseDirective,\n] as const;\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":["i1"],"mappings":"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"}

package/fesm2022/eui-ecl-components-ecl-multiselect.mjs CHANGED Viewed

@@ -197,11 +197,11 @@ class EclMultiselectInputComponent extends ECLBaseDirective {
         this.renderer.selectRootElement(this.inputMultiselect.nativeElement, true).focus();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0-rc.0", ngImport: i0, type: EclMultiselectInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.0.0-rc.0", type: EclMultiselectInputComponent, isStandalone: true, selector: "div[eclMultiselectInput]", inputs: { eclSize: "eclSize", toggleId: "toggleId", toggleLabel: "toggleLabel", isDisabled: ["isDisabled", "isDisabled", booleanAttribute], isInvalid: ["isInvalid", "isInvalid", booleanAttribute], inputPlaceholder: "inputPlaceholder", selectedItems: "selectedItems", isDropdownExpanded: "isDropdownExpanded", ariaControls: "ariaControls", ariaDescribedby: "ariaDescribedby", ariaLabeledby: "ariaLabeledby" }, outputs: { mainInputClick: "mainInputClick", mainInputKeydown: "mainInputKeydown" }, host: { properties: { "class.ecl-select__container--disabled": "this.isDisabled", "class.ecl-select__container--invalid": "this.isInvalid", "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "inputMultiselect", first: true, predicate: ["inputMultiselect"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [class.ecl-select-multiple-selections-counter--visible]=\"isShowCounter\" class=\"ecl-select-multiple-selections-counter\">\n    <span>{{ selectedItemsCount }}</span>\n</div>\n<button\n    class=\"ecl-select ecl-select__multiple-toggle\"\n    [class.ecl-select--active]=\"isActive\"\n    #inputMultiselect\n    type=\"button\"\n    [id]=\"toggleId\"\n    [attr.aria-expanded]=\"isDropdownExpanded\"\n    [attr.aria-controls]=\"ariaControls\"\n    [attr.disabled]=\"isDisabled ? true : undefined\"\n    [attr.aria-labelledby]=\"ariaLabeledby\"\n    [attr.aria-describedby]=\"ariaDescribedby\"\n    (keydown)=\"onKeydown($event)\"\n    (click)=\"onClick($event)\"> {{ buttonText }}\n</button>\n<div class=\"ecl-select__icon\">\n    <button eclButton isIconOnly variant=\"ghost\" tabindex=\"-1\">\n    <span eclButtonLabel>\n        {{ toggleLabel || 'ecl.multiselect.TOGGLE.DROPDOWN' | translate }}\n    </span>\n        <ecl-icon icon=\"corner-arrow\" [size]=\"sizeIcon\" transform=\"rotate-180\"></ecl-icon>\n    </button>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "containerStyleClass"] }, { kind: "directive", type: i1.EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: i2.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "21.0.0-rc.0", type: EclMultiselectInputComponent, isStandalone: true, selector: "div[eclMultiselectInput]", inputs: { eclSize: "eclSize", toggleId: "toggleId", toggleLabel: "toggleLabel", isDisabled: ["isDisabled", "isDisabled", booleanAttribute], isInvalid: ["isInvalid", "isInvalid", booleanAttribute], inputPlaceholder: "inputPlaceholder", selectedItems: "selectedItems", isDropdownExpanded: "isDropdownExpanded", ariaControls: "ariaControls", ariaDescribedby: "ariaDescribedby", ariaLabeledby: "ariaLabeledby" }, outputs: { mainInputClick: "mainInputClick", mainInputKeydown: "mainInputKeydown" }, host: { properties: { "class.ecl-select__container--disabled": "this.isDisabled", "class.ecl-select__container--invalid": "this.isInvalid", "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "inputMultiselect", first: true, predicate: ["inputMultiselect"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [class.ecl-select-multiple-selections-counter--visible]=\"isShowCounter\" class=\"ecl-select-multiple-selections-counter\">\n    <span>{{ selectedItemsCount }}</span>\n</div>\n<button\n    class=\"ecl-select ecl-select__multiple-toggle\"\n    [class.ecl-select--active]=\"isActive\"\n    #inputMultiselect\n    type=\"button\"\n    [id]=\"toggleId\"\n    [attr.aria-expanded]=\"isDropdownExpanded\"\n    [attr.aria-controls]=\"ariaControls\"\n    [attr.disabled]=\"isDisabled ? true : undefined\"\n    [attr.aria-labelledby]=\"ariaLabeledby\"\n    [attr.aria-describedby]=\"ariaDescribedby\"\n    (keydown)=\"onKeydown($event)\"\n    (click)=\"onClick($event)\"> {{ buttonText }}\n</button>\n<div class=\"ecl-select__icon\">\n    <button eclButton isIconOnly variant=\"tertiary\" tabindex=\"-1\">\n    <span eclButtonLabel>\n        {{ toggleLabel || 'ecl.multiselect.TOGGLE.DROPDOWN' | translate }}\n    </span>\n        <ecl-icon icon=\"corner-arrow\" [size]=\"sizeIcon\" transform=\"rotate-180\"></ecl-icon>\n    </button>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "eclStyle", "size", "containerStyleClass"] }, { kind: "directive", type: i1.EclButtonLabelDirective, selector: "[eclButtonLabel]" }, { kind: "component", type: i2.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-rc.0", ngImport: i0, type: EclMultiselectInputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'div[eclMultiselectInput]', imports: [TranslateModule, ...EUI_ECL_BUTTON, ...EUI_ECL_ICON], template: "<div [class.ecl-select-multiple-selections-counter--visible]=\"isShowCounter\" class=\"ecl-select-multiple-selections-counter\">\n    <span>{{ selectedItemsCount }}</span>\n</div>\n<button\n    class=\"ecl-select ecl-select__multiple-toggle\"\n    [class.ecl-select--active]=\"isActive\"\n    #inputMultiselect\n    type=\"button\"\n    [id]=\"toggleId\"\n    [attr.aria-expanded]=\"isDropdownExpanded\"\n    [attr.aria-controls]=\"ariaControls\"\n    [attr.disabled]=\"isDisabled ? true : undefined\"\n    [attr.aria-labelledby]=\"ariaLabeledby\"\n    [attr.aria-describedby]=\"ariaDescribedby\"\n    (keydown)=\"onKeydown($event)\"\n    (click)=\"onClick($event)\"> {{ buttonText }}\n</button>\n<div class=\"ecl-select__icon\">\n    <button eclButton isIconOnly variant=\"ghost\" tabindex=\"-1\">\n    <span eclButtonLabel>\n        {{ toggleLabel || 'ecl.multiselect.TOGGLE.DROPDOWN' | translate }}\n    </span>\n        <ecl-icon icon=\"corner-arrow\" [size]=\"sizeIcon\" transform=\"rotate-180\"></ecl-icon>\n    </button>\n</div>\n" }]
+            args: [{ selector: 'div[eclMultiselectInput]', imports: [TranslateModule, ...EUI_ECL_BUTTON, ...EUI_ECL_ICON], template: "<div [class.ecl-select-multiple-selections-counter--visible]=\"isShowCounter\" class=\"ecl-select-multiple-selections-counter\">\n    <span>{{ selectedItemsCount }}</span>\n</div>\n<button\n    class=\"ecl-select ecl-select__multiple-toggle\"\n    [class.ecl-select--active]=\"isActive\"\n    #inputMultiselect\n    type=\"button\"\n    [id]=\"toggleId\"\n    [attr.aria-expanded]=\"isDropdownExpanded\"\n    [attr.aria-controls]=\"ariaControls\"\n    [attr.disabled]=\"isDisabled ? true : undefined\"\n    [attr.aria-labelledby]=\"ariaLabeledby\"\n    [attr.aria-describedby]=\"ariaDescribedby\"\n    (keydown)=\"onKeydown($event)\"\n    (click)=\"onClick($event)\"> {{ buttonText }}\n</button>\n<div class=\"ecl-select__icon\">\n    <button eclButton isIconOnly variant=\"tertiary\" tabindex=\"-1\">\n    <span eclButtonLabel>\n        {{ toggleLabel || 'ecl.multiselect.TOGGLE.DROPDOWN' | translate }}\n    </span>\n        <ecl-icon icon=\"corner-arrow\" [size]=\"sizeIcon\" transform=\"rotate-180\"></ecl-icon>\n    </button>\n</div>\n" }]
         }], propDecorators: { eclSize: [{
                 type: Input
             }], toggleId: [{
@@ -939,7 +939,7 @@ class EclMultiselectDropdownComponent extends ECLBaseDirective {
                 useExisting: forwardRef(() => EclMultiselectDropdownComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "eclMultiselectInput", first: true, predicate: ["eclMultiselectInput"], descendants: true }, { propertyName: "selectAllCheckbox", first: true, predicate: ["selectAllCheckbox"], descendants: true }, { propertyName: "closeBtn", first: true, predicate: ["closeBtn"], descendants: true, read: ElementRef }, { propertyName: "clearAllBtn", first: true, predicate: ["clearAllBtn"], descendants: true, read: ElementRef }, { propertyName: "multiOptionComponents", predicate: EclMultiselectOptionComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div eclMultiselectInput #eclMultiselectInput [inputPlaceholder]=\"mainInputPlaceholder\" [selectedItems]=\"selectedItems\"\n    (mainInputClick)=\"onClickMainInput($event)\" (mainInputKeydown)=\"onKeydownMainInput($event)\" [isDisabled]=\"disabled\"\n    [ariaLabeledby]=\"ariaLabeledby\" [ariaDescribedby]=\"ariaDescribedby\" [toggleLabel]=\"toggleLabel\" [ariaControls]=\"dropdownId\" [isInvalid]=\"isInvalid\"\n    [isDropdownExpanded]=\"isShowMultiselectDropdown\" [eclSize]=\"eclSize\" [toggleId]=\"toggleId\"></div>\n<div\n    [style.display]=\"isShowMultiselectDropdown ? 'block' : 'none'\"\n    class=\"ecl-select__multiple-dropdown ecl-select__container ecl-select__container--{{eclSize}}\"\n    [id]=\"dropdownId\">\n    @if(hasSearchBox) {\n    <input class=\"ecl-text-input\" type=\"search\" #searchInput [placeholder]=\"searchFieldPlaceholder\"\n        (input)=\"onSearch($event.target)\" (keydown.enter)=\"onEnterSearch($event)\"\n        (keydown.arrowup)=\"onArrowUpSearch($event)\" (keydown.arrowdown)=\"onArrowDownSearch($event)\" />\n    }\n    @if(hasSelectAll) {\n    <div eclCheckbox [isDisabled]=\"isSelectAllDisabled\" class=\"ecl-select__multiple-all\">\n        <input eclCheckboxInput #selectAllCheckbox [id]=\"selectAllId\" type=\"checkbox\" [attr.disabled]=\"isSelectAllDisabled\"\n            (click)=\"onSelectAll()\" (keydown.arrowup)=\"onArrowUpSelectAll($event)\"\n            (keydown.arrowdown)=\"onArrowDownSelectAll($event)\" (keydown.enter)=\"onEnterSelectAll($event)\" />\n        <label [for]=\"selectAllId\" eclCheckboxLabel> {{ 'ecl.multiselect.SELECT-ALL' | translate }} ({{ optionsCount }})\n        </label>\n    </div>\n    }\n    <div class=\"ecl-select__multiple-options\" aria-live=\"polite\">\n        @for (item of multiOptionDirectives; track item.label) {\n                @if (item.isOptGroup()) {\n                    <fieldset eclMultiselectOptgroup [label]=\"item.label\">\n                        @for (elem of item.eclOptionItems; track elem.label) {\n                            <div\n                                eclMultiselectOption\n                                [value]=\"elem.value\"\n                                [label]=\"elem.label\"\n                                [disabled]=\"elem.disabled\"\n                                [isChecked]=\"elem.selected\"\n                                [class]=\"elem.class\"\n                                (optionClick)=\"onOptionSelected($event)\"\n                                (optionKeydown)=\"onKeydownOption($event)\"></div>\n                        }\n                    </fieldset>\n                } @else if (!item.isOptGroup()) {\n                    <div\n                        eclMultiselectOption\n                        [value]=\"item.value\"\n                        [label]=\"item.label\"\n                        [disabled]=\"item.disabled\"\n                        [isChecked]=\"item.selected\"\n                        [class]=\"item.class\"\n                        (optionClick)=\"onOptionSelected($event)\"\n                        (optionKeydown)=\"onKeydownOption($event)\"></div>\n                }\n        }\n\n\n        @if (isShowNoResultsFound) {\n            <div class=\"ecl-select__multiple-no-results\">\n                <span>{{ 'ecl.multiselect.NO-RESULTS-FOUND' | translate }}</span>\n            </div>\n        }\n\n    </div>\n    @if (isShowToolbar) {\n        <div class=\"ecl-select-multiple-toolbar\">\n            <button\n                eclButton\n                variant=\"primary\"\n                #closeBtn\n                (keydown.arrowup)=\"onArrowUpClose($event)\"\n                (keydown.arrowDown)=\"onArrowDownClose($event)\"\n                (keydown.tab)=\"onTabClose($event)\"\n                (click)=\"onClickClose($event)\">\n                {{ 'ecl.common.APPLY' | translate }}\n            </button>\n            <button\n                eclButton\n                variant=\"ghost\"\n                #clearAllBtn\n                (keydown.arrowup)=\"onArrowUpClear($event)\"\n                (keydown.arrowDown)=\"onArrowDownClear($event)\"\n                (keydown.tab)=\"onTabClear($event)\"\n                (keydown.enter)=\"onEnterClear($event)\"\n                (click)=\"onClickClearAll($event)\">\n                {{ 'ecl.multiselect.CLEAR-ALL' | translate }}\n            </button>\n        </div>\n    }\n</div>\n", dependencies: [{ kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "containerStyleClass"] }, { kind: "component", type: EclMultiselectOptionComponent, selector: "div[eclMultiselectOption]", inputs: ["value", "label", "disabled", "isChecked"], outputs: ["optionClick", "optionKeydown"] }, { kind: "component", type: EclMultiselectOptgroupComponent, selector: "fieldset[eclMultiselectOptgroup]", inputs: ["label"] }, { kind: "component", type: EclMultiselectInputComponent, selector: "div[eclMultiselectInput]", inputs: ["eclSize", "toggleId", "toggleLabel", "isDisabled", "isInvalid", "inputPlaceholder", "selectedItems", "isDropdownExpanded", "ariaControls", "ariaDescribedby", "ariaLabeledby"], outputs: ["mainInputClick", "mainInputKeydown"] }, { kind: "component", type: i1$1.EclCheckboxLabelComponent, selector: "label[eclCheckboxLabel]", inputs: ["isInvalid", "isDisabled", "isRequired"] }, { kind: "directive", type: i1$1.EclCheckboxInputDirective, selector: "input[eclCheckboxInput]" }, { kind: "directive", type: i1$1.EclCheckboxDirective, selector: "[eclCheckbox]", inputs: ["isDisabled", "isInvalid", "isSingle"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
+        ], viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "eclMultiselectInput", first: true, predicate: ["eclMultiselectInput"], descendants: true }, { propertyName: "selectAllCheckbox", first: true, predicate: ["selectAllCheckbox"], descendants: true }, { propertyName: "closeBtn", first: true, predicate: ["closeBtn"], descendants: true, read: ElementRef }, { propertyName: "clearAllBtn", first: true, predicate: ["clearAllBtn"], descendants: true, read: ElementRef }, { propertyName: "multiOptionComponents", predicate: EclMultiselectOptionComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div eclMultiselectInput #eclMultiselectInput [inputPlaceholder]=\"mainInputPlaceholder\" [selectedItems]=\"selectedItems\"\n    (mainInputClick)=\"onClickMainInput($event)\" (mainInputKeydown)=\"onKeydownMainInput($event)\" [isDisabled]=\"disabled\"\n    [ariaLabeledby]=\"ariaLabeledby\" [ariaDescribedby]=\"ariaDescribedby\" [toggleLabel]=\"toggleLabel\" [ariaControls]=\"dropdownId\" [isInvalid]=\"isInvalid\"\n    [isDropdownExpanded]=\"isShowMultiselectDropdown\" [eclSize]=\"eclSize\" [toggleId]=\"toggleId\"></div>\n<div\n    [style.display]=\"isShowMultiselectDropdown ? 'block' : 'none'\"\n    class=\"ecl-select__multiple-dropdown ecl-select__container ecl-select__container--{{eclSize}}\"\n    [id]=\"dropdownId\">\n    @if(hasSearchBox) {\n    <input class=\"ecl-text-input\" type=\"search\" #searchInput [placeholder]=\"searchFieldPlaceholder\"\n        (input)=\"onSearch($event.target)\" (keydown.enter)=\"onEnterSearch($event)\"\n        (keydown.arrowup)=\"onArrowUpSearch($event)\" (keydown.arrowdown)=\"onArrowDownSearch($event)\" />\n    }\n    @if(hasSelectAll) {\n    <div eclCheckbox [isDisabled]=\"isSelectAllDisabled\" class=\"ecl-select__multiple-all\">\n        <input eclCheckboxInput #selectAllCheckbox [id]=\"selectAllId\" type=\"checkbox\" [attr.disabled]=\"isSelectAllDisabled\"\n            (click)=\"onSelectAll()\" (keydown.arrowup)=\"onArrowUpSelectAll($event)\"\n            (keydown.arrowdown)=\"onArrowDownSelectAll($event)\" (keydown.enter)=\"onEnterSelectAll($event)\" />\n        <label [for]=\"selectAllId\" eclCheckboxLabel> {{ 'ecl.multiselect.SELECT-ALL' | translate }} ({{ optionsCount }})\n        </label>\n    </div>\n    }\n    <div class=\"ecl-select__multiple-options\" aria-live=\"polite\">\n        @for (item of multiOptionDirectives; track item.label) {\n                @if (item.isOptGroup()) {\n                    <fieldset eclMultiselectOptgroup [label]=\"item.label\">\n                        @for (elem of item.eclOptionItems; track elem.label) {\n                            <div\n                                eclMultiselectOption\n                                [value]=\"elem.value\"\n                                [label]=\"elem.label\"\n                                [disabled]=\"elem.disabled\"\n                                [isChecked]=\"elem.selected\"\n                                [class]=\"elem.class\"\n                                (optionClick)=\"onOptionSelected($event)\"\n                                (optionKeydown)=\"onKeydownOption($event)\"></div>\n                        }\n                    </fieldset>\n                } @else if (!item.isOptGroup()) {\n                    <div\n                        eclMultiselectOption\n                        [value]=\"item.value\"\n                        [label]=\"item.label\"\n                        [disabled]=\"item.disabled\"\n                        [isChecked]=\"item.selected\"\n                        [class]=\"item.class\"\n                        (optionClick)=\"onOptionSelected($event)\"\n                        (optionKeydown)=\"onKeydownOption($event)\"></div>\n                }\n        }\n\n\n        @if (isShowNoResultsFound) {\n            <div class=\"ecl-select__multiple-no-results\">\n                <span>{{ 'ecl.multiselect.NO-RESULTS-FOUND' | translate }}</span>\n            </div>\n        }\n\n    </div>\n    @if (isShowToolbar) {\n        <div class=\"ecl-select-multiple-toolbar\">\n            <button\n                eclButton\n                variant=\"primary\"\n                #closeBtn\n                (keydown.arrowup)=\"onArrowUpClose($event)\"\n                (keydown.arrowDown)=\"onArrowDownClose($event)\"\n                (keydown.tab)=\"onTabClose($event)\"\n                (click)=\"onClickClose($event)\">\n                {{ 'ecl.common.APPLY' | translate }}\n            </button>\n            <button\n                eclButton\n                variant=\"tertiary\"\n                #clearAllBtn\n                (keydown.arrowup)=\"onArrowUpClear($event)\"\n                (keydown.arrowDown)=\"onArrowDownClear($event)\"\n                (keydown.tab)=\"onTabClear($event)\"\n                (keydown.enter)=\"onEnterClear($event)\"\n                (click)=\"onClickClearAll($event)\">\n                {{ 'ecl.multiselect.CLEAR-ALL' | translate }}\n            </button>\n        </div>\n    }\n</div>\n", dependencies: [{ kind: "component", type: i1.EclButtonComponent, selector: "button[eclButton], button[ecl-button], a[eclButton]", inputs: ["isIconOnly", "variant", "eclStyle", "size", "containerStyleClass"] }, { kind: "component", type: EclMultiselectOptionComponent, selector: "div[eclMultiselectOption]", inputs: ["value", "label", "disabled", "isChecked"], outputs: ["optionClick", "optionKeydown"] }, { kind: "component", type: EclMultiselectOptgroupComponent, selector: "fieldset[eclMultiselectOptgroup]", inputs: ["label"] }, { kind: "component", type: EclMultiselectInputComponent, selector: "div[eclMultiselectInput]", inputs: ["eclSize", "toggleId", "toggleLabel", "isDisabled", "isInvalid", "inputPlaceholder", "selectedItems", "isDropdownExpanded", "ariaControls", "ariaDescribedby", "ariaLabeledby"], outputs: ["mainInputClick", "mainInputKeydown"] }, { kind: "component", type: i1$1.EclCheckboxLabelComponent, selector: "label[eclCheckboxLabel]", inputs: ["isInvalid", "isDisabled", "isRequired"] }, { kind: "directive", type: i1$1.EclCheckboxInputDirective, selector: "input[eclCheckboxInput]" }, { kind: "directive", type: i1$1.EclCheckboxDirective, selector: "[eclCheckbox]", inputs: ["isDisabled", "isInvalid", "isSingle"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-rc.0", ngImport: i0, type: EclMultiselectDropdownComponent, decorators: [{
             type: Component,
@@ -952,7 +952,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0-rc.0", ng
                             useExisting: forwardRef(() => EclMultiselectDropdownComponent),
                             multi: true,
                         },
-                    ], template: "<div eclMultiselectInput #eclMultiselectInput [inputPlaceholder]=\"mainInputPlaceholder\" [selectedItems]=\"selectedItems\"\n    (mainInputClick)=\"onClickMainInput($event)\" (mainInputKeydown)=\"onKeydownMainInput($event)\" [isDisabled]=\"disabled\"\n    [ariaLabeledby]=\"ariaLabeledby\" [ariaDescribedby]=\"ariaDescribedby\" [toggleLabel]=\"toggleLabel\" [ariaControls]=\"dropdownId\" [isInvalid]=\"isInvalid\"\n    [isDropdownExpanded]=\"isShowMultiselectDropdown\" [eclSize]=\"eclSize\" [toggleId]=\"toggleId\"></div>\n<div\n    [style.display]=\"isShowMultiselectDropdown ? 'block' : 'none'\"\n    class=\"ecl-select__multiple-dropdown ecl-select__container ecl-select__container--{{eclSize}}\"\n    [id]=\"dropdownId\">\n    @if(hasSearchBox) {\n    <input class=\"ecl-text-input\" type=\"search\" #searchInput [placeholder]=\"searchFieldPlaceholder\"\n        (input)=\"onSearch($event.target)\" (keydown.enter)=\"onEnterSearch($event)\"\n        (keydown.arrowup)=\"onArrowUpSearch($event)\" (keydown.arrowdown)=\"onArrowDownSearch($event)\" />\n    }\n    @if(hasSelectAll) {\n    <div eclCheckbox [isDisabled]=\"isSelectAllDisabled\" class=\"ecl-select__multiple-all\">\n        <input eclCheckboxInput #selectAllCheckbox [id]=\"selectAllId\" type=\"checkbox\" [attr.disabled]=\"isSelectAllDisabled\"\n            (click)=\"onSelectAll()\" (keydown.arrowup)=\"onArrowUpSelectAll($event)\"\n            (keydown.arrowdown)=\"onArrowDownSelectAll($event)\" (keydown.enter)=\"onEnterSelectAll($event)\" />\n        <label [for]=\"selectAllId\" eclCheckboxLabel> {{ 'ecl.multiselect.SELECT-ALL' | translate }} ({{ optionsCount }})\n        </label>\n    </div>\n    }\n    <div class=\"ecl-select__multiple-options\" aria-live=\"polite\">\n        @for (item of multiOptionDirectives; track item.label) {\n                @if (item.isOptGroup()) {\n                    <fieldset eclMultiselectOptgroup [label]=\"item.label\">\n                        @for (elem of item.eclOptionItems; track elem.label) {\n                            <div\n                                eclMultiselectOption\n                                [value]=\"elem.value\"\n                                [label]=\"elem.label\"\n                                [disabled]=\"elem.disabled\"\n                                [isChecked]=\"elem.selected\"\n                                [class]=\"elem.class\"\n                                (optionClick)=\"onOptionSelected($event)\"\n                                (optionKeydown)=\"onKeydownOption($event)\"></div>\n                        }\n                    </fieldset>\n                } @else if (!item.isOptGroup()) {\n                    <div\n                        eclMultiselectOption\n                        [value]=\"item.value\"\n                        [label]=\"item.label\"\n                        [disabled]=\"item.disabled\"\n                        [isChecked]=\"item.selected\"\n                        [class]=\"item.class\"\n                        (optionClick)=\"onOptionSelected($event)\"\n                        (optionKeydown)=\"onKeydownOption($event)\"></div>\n                }\n        }\n\n\n        @if (isShowNoResultsFound) {\n            <div class=\"ecl-select__multiple-no-results\">\n                <span>{{ 'ecl.multiselect.NO-RESULTS-FOUND' | translate }}</span>\n            </div>\n        }\n\n    </div>\n    @if (isShowToolbar) {\n        <div class=\"ecl-select-multiple-toolbar\">\n            <button\n                eclButton\n                variant=\"primary\"\n                #closeBtn\n                (keydown.arrowup)=\"onArrowUpClose($event)\"\n                (keydown.arrowDown)=\"onArrowDownClose($event)\"\n                (keydown.tab)=\"onTabClose($event)\"\n                (click)=\"onClickClose($event)\">\n                {{ 'ecl.common.APPLY' | translate }}\n            </button>\n            <button\n                eclButton\n                variant=\"ghost\"\n                #clearAllBtn\n                (keydown.arrowup)=\"onArrowUpClear($event)\"\n                (keydown.arrowDown)=\"onArrowDownClear($event)\"\n                (keydown.tab)=\"onTabClear($event)\"\n                (keydown.enter)=\"onEnterClear($event)\"\n                (click)=\"onClickClearAll($event)\">\n                {{ 'ecl.multiselect.CLEAR-ALL' | translate }}\n            </button>\n        </div>\n    }\n</div>\n" }]
+                    ], template: "<div eclMultiselectInput #eclMultiselectInput [inputPlaceholder]=\"mainInputPlaceholder\" [selectedItems]=\"selectedItems\"\n    (mainInputClick)=\"onClickMainInput($event)\" (mainInputKeydown)=\"onKeydownMainInput($event)\" [isDisabled]=\"disabled\"\n    [ariaLabeledby]=\"ariaLabeledby\" [ariaDescribedby]=\"ariaDescribedby\" [toggleLabel]=\"toggleLabel\" [ariaControls]=\"dropdownId\" [isInvalid]=\"isInvalid\"\n    [isDropdownExpanded]=\"isShowMultiselectDropdown\" [eclSize]=\"eclSize\" [toggleId]=\"toggleId\"></div>\n<div\n    [style.display]=\"isShowMultiselectDropdown ? 'block' : 'none'\"\n    class=\"ecl-select__multiple-dropdown ecl-select__container ecl-select__container--{{eclSize}}\"\n    [id]=\"dropdownId\">\n    @if(hasSearchBox) {\n    <input class=\"ecl-text-input\" type=\"search\" #searchInput [placeholder]=\"searchFieldPlaceholder\"\n        (input)=\"onSearch($event.target)\" (keydown.enter)=\"onEnterSearch($event)\"\n        (keydown.arrowup)=\"onArrowUpSearch($event)\" (keydown.arrowdown)=\"onArrowDownSearch($event)\" />\n    }\n    @if(hasSelectAll) {\n    <div eclCheckbox [isDisabled]=\"isSelectAllDisabled\" class=\"ecl-select__multiple-all\">\n        <input eclCheckboxInput #selectAllCheckbox [id]=\"selectAllId\" type=\"checkbox\" [attr.disabled]=\"isSelectAllDisabled\"\n            (click)=\"onSelectAll()\" (keydown.arrowup)=\"onArrowUpSelectAll($event)\"\n            (keydown.arrowdown)=\"onArrowDownSelectAll($event)\" (keydown.enter)=\"onEnterSelectAll($event)\" />\n        <label [for]=\"selectAllId\" eclCheckboxLabel> {{ 'ecl.multiselect.SELECT-ALL' | translate }} ({{ optionsCount }})\n        </label>\n    </div>\n    }\n    <div class=\"ecl-select__multiple-options\" aria-live=\"polite\">\n        @for (item of multiOptionDirectives; track item.label) {\n                @if (item.isOptGroup()) {\n                    <fieldset eclMultiselectOptgroup [label]=\"item.label\">\n                        @for (elem of item.eclOptionItems; track elem.label) {\n                            <div\n                                eclMultiselectOption\n                                [value]=\"elem.value\"\n                                [label]=\"elem.label\"\n                                [disabled]=\"elem.disabled\"\n                                [isChecked]=\"elem.selected\"\n                                [class]=\"elem.class\"\n                                (optionClick)=\"onOptionSelected($event)\"\n                                (optionKeydown)=\"onKeydownOption($event)\"></div>\n                        }\n                    </fieldset>\n                } @else if (!item.isOptGroup()) {\n                    <div\n                        eclMultiselectOption\n                        [value]=\"item.value\"\n                        [label]=\"item.label\"\n                        [disabled]=\"item.disabled\"\n                        [isChecked]=\"item.selected\"\n                        [class]=\"item.class\"\n                        (optionClick)=\"onOptionSelected($event)\"\n                        (optionKeydown)=\"onKeydownOption($event)\"></div>\n                }\n        }\n\n\n        @if (isShowNoResultsFound) {\n            <div class=\"ecl-select__multiple-no-results\">\n                <span>{{ 'ecl.multiselect.NO-RESULTS-FOUND' | translate }}</span>\n            </div>\n        }\n\n    </div>\n    @if (isShowToolbar) {\n        <div class=\"ecl-select-multiple-toolbar\">\n            <button\n                eclButton\n                variant=\"primary\"\n                #closeBtn\n                (keydown.arrowup)=\"onArrowUpClose($event)\"\n                (keydown.arrowDown)=\"onArrowDownClose($event)\"\n                (keydown.tab)=\"onTabClose($event)\"\n                (click)=\"onClickClose($event)\">\n                {{ 'ecl.common.APPLY' | translate }}\n            </button>\n            <button\n                eclButton\n                variant=\"tertiary\"\n                #clearAllBtn\n                (keydown.arrowup)=\"onArrowUpClear($event)\"\n                (keydown.arrowDown)=\"onArrowDownClear($event)\"\n                (keydown.tab)=\"onTabClear($event)\"\n                (keydown.enter)=\"onEnterClear($event)\"\n                (click)=\"onClickClearAll($event)\">\n                {{ 'ecl.multiselect.CLEAR-ALL' | translate }}\n            </button>\n        </div>\n    }\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { searchInput: [{
                 type: ViewChild,
                 args: ['searchInput']