@eui/ecl 19.3.3-snapshot-1754912586607 → 21.0.0-alpha.2

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

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, afterNextRender, booleanAttribute, HostBinding, Output, Input, Component, Directive, NgModule } from '@angular/core';
+import { EventEmitter, inject, ElementRef, afterNextRender, booleanAttribute, HostBinding, Output, Input, Component, Directive, NgModule } from '@angular/core';
 import { TitleCasePipe } from '@angular/common';
 import { EclBaseEvent, ECLBaseDirective, KeyCode } from '@eui/ecl/core';
 import { Subject, fromEvent, takeUntil } from 'rxjs';
@@ -22,9 +22,8 @@ class EclTagComponent extends ECLBaseDirective {
             this.isWrapped ? '' : 'ecl-tag--nowrap',
         ].join(' ').trim();
     }
-    constructor(el) {
+    constructor() {
         super();
-        this.el = el;
         /**
          * Whether the tag content should be allowed to wrap onto multiple lines.
          * Set to false to force single-line display (adds `ecl-tag--nowrap` class).
@@ -38,6 +37,7 @@ class EclTagComponent extends ECLBaseDirective {
         this.remove = new EventEmitter();
         this.isVisible = true;
         this.title = 'dismiss';
+        this.el = inject(ElementRef);
         this.destroy$ = new Subject();
         afterNextRender(() => {
             this.connectEvents();
@@ -76,13 +76,13 @@ class EclTagComponent extends ECLBaseDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTagComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: EclTagComponent, isStandalone: true, selector: "ecl-tag, [eclTag]", inputs: { variant: "variant", isWrapped: ["isWrapped", "isWrapped", booleanAttribute] }, outputs: { remove: "remove" }, host: { properties: { "style.display": "this.isHidden", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n@if(isRemovable) {\n    <span class=\"ecl-tag__icon\" (click)=\"onRemoveClick()\">\n    <ecl-icon icon=\"close-outline\" class=\"ecl-tag__icon-close\" [title]=\"title | titlecase\"></ecl-icon>\n</span>\n}\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"] }, { kind: "pipe", type: TitleCasePipe, name: "titlecase" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: EclTagComponent, isStandalone: true, selector: "ecl-tag, [eclTag]", inputs: { variant: "variant", isWrapped: ["isWrapped", "isWrapped", booleanAttribute] }, outputs: { remove: "remove" }, host: { properties: { "style.display": "this.isHidden", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n@if(isRemovable) {\n    <span class=\"ecl-tag__icon\" (click)=\"onRemoveClick()\">\n    <ecl-icon icon=\"close-outline\" class=\"ecl-tag__icon-close\" [title]=\"title | titlecase\"></ecl-icon>\n</span>\n}\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"] }, { kind: "pipe", type: TitleCasePipe, name: "titlecase" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTagComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTagComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-tag, [eclTag]', imports: [EclIconModule, TitleCasePipe], template: "<ng-content></ng-content>\n@if(isRemovable) {\n    <span class=\"ecl-tag__icon\" (click)=\"onRemoveClick()\">\n    <ecl-icon icon=\"close-outline\" class=\"ecl-tag__icon-close\" [title]=\"title | titlecase\"></ecl-icon>\n</span>\n}\n" }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { variant: [{
+        }], ctorParameters: () => [], propDecorators: { variant: [{
                 type: Input
             }], isWrapped: [{
                 type: Input,
@@ -109,10 +109,10 @@ class EclTagSetDirective extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-tag-set')].join(' ').trim();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTagSetDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: EclTagSetDirective, isStandalone: true, selector: "[eclTagSet]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTagSetDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.6", type: EclTagSetDirective, isStandalone: true, selector: "[eclTagSet]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTagSetDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTagSetDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclTagSet]',
@@ -133,10 +133,10 @@ class EclTagSetItemDirective extends ECLBaseDirective {
          */
         this.hasClass = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTagSetItemDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: EclTagSetItemDirective, isStandalone: true, selector: "[eclTagSetItem]", host: { properties: { "class.ecl-tag-set__item": "this.hasClass" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTagSetItemDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.6", type: EclTagSetItemDirective, isStandalone: true, selector: "[eclTagSetItem]", host: { properties: { "class.ecl-tag-set__item": "this.hasClass" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTagSetItemDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTagSetItemDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclTagSetItem]',
@@ -158,10 +158,10 @@ class EclTagIconExternalDirective extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-tag__icon ecl-tag__icon--external')].join(' ').trim();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTagIconExternalDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: EclTagIconExternalDirective, isStandalone: true, selector: "[eclTagIconExternal]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTagIconExternalDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.6", type: EclTagIconExternalDirective, isStandalone: true, selector: "[eclTagIconExternal]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTagIconExternalDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTagIconExternalDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclTagIconExternal]',
@@ -178,11 +178,11 @@ const COMPONENTS = [EclTagComponent, EclTagSetDirective, EclTagSetItemDirective,
  * @deprecated Use {@link EUI_ECL_TAG} instead.
  */
 class EclTagModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTagModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: EclTagModule, imports: [EclTagComponent, EclTagSetDirective, EclTagSetItemDirective, EclTagIconExternalDirective], exports: [EclTagComponent, EclTagSetDirective, EclTagSetItemDirective, EclTagIconExternalDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTagModule, imports: [EclTagComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTagModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.6", ngImport: i0, type: EclTagModule, imports: [EclTagComponent, EclTagSetDirective, EclTagSetItemDirective, EclTagIconExternalDirective], exports: [EclTagComponent, EclTagSetDirective, EclTagSetItemDirective, EclTagIconExternalDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTagModule, imports: [EclTagComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTagModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTagModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...COMPONENTS],

package/fesm2022/eui-ecl-components-ecl-tag.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"eui-ecl-components-ecl-tag.mjs","sources":["../../components/ecl-tag/events/ecl-tag-remove.event.ts","../../components/ecl-tag/ecl-tag.component.ts","../../components/ecl-tag/ecl-tag.component.html","../../components/ecl-tag/ecl-tag-set.directive.ts","../../components/ecl-tag/ecl-tag-icon.directive.ts","../../components/ecl-tag/ecl-tag.module.ts","../../components/ecl-tag/index.ts","../../components/ecl-tag/eui-ecl-components-ecl-tag.ts"],"sourcesContent":["import { EclBaseEvent } from '@eui/ecl/core';\n\n/**\n * Event emitted when a tag is removed.\n */\nexport class EclTagRemoveEvent extends EclBaseEvent {}\n","import {\n    Component,\n    Input,\n    HostBinding,\n    Output,\n    EventEmitter,\n    booleanAttribute,\n    ElementRef,\n    afterNextRender,\n    OnDestroy,\n} from '@angular/core';\nimport { TitleCasePipe } from '@angular/common';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { Subject, fromEvent, takeUntil } from 'rxjs';\nimport { KeyCode } from '@eui/ecl/core';\nimport { EclTagRemoveEvent } from './events/ecl-tag-remove.event';\nimport { EclIconModule } from '@eui/ecl/components/ecl-icon';\n\n@Component({\n    selector: 'ecl-tag, [eclTag]',\n    templateUrl: './ecl-tag.component.html',\n    imports: [EclIconModule, TitleCasePipe],\n})\nexport class EclTagComponent extends ECLBaseDirective implements OnDestroy {\n    /**\n     * Defines the variant of the tag.\n     * Currently only 'removable' is supported.\n     */\n    @Input() variant: 'removable';\n\n    /**\n     * Whether the tag content should be allowed to wrap onto multiple lines.\n     * Set to false to force single-line display (adds `ecl-tag--nowrap` class).\n     * Defaults to true.\n     */\n    @Input({ transform: booleanAttribute }) isWrapped = true;\n\n    /**\n     * Event emitted when the tag is removed.\n     * Can be prevented by calling `preventDefault()` on the emitted event.\n     */\n    @Output() remove = new EventEmitter<EclTagRemoveEvent>();\n\n    @HostBinding('style.display')\n    get isHidden(): string | null {\n        return this.isVisible ? null : 'none';\n    }\n\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-tag'),\n            this.variant ? `ecl-tag--${this.variant}` : '',\n            this.isWrapped ? '' : 'ecl-tag--nowrap',\n        ].join(' ').trim();\n    }\n\n    isVisible = true;\n    title = 'dismiss';\n    private destroy$: Subject<boolean> = new Subject<boolean>();\n\n    constructor(private el: ElementRef) {\n        super();\n        afterNextRender(() => {\n            this.connectEvents();\n        });\n    }\n\n    /**\n     * Whether the tag is removable (based on the `variant` input).\n     */\n    get isRemovable(): boolean {\n        return this.variant == 'removable';\n    }\n\n    /**\n     * Lifecycle hook that cleans up subscriptions when the component is destroyed.\n     */\n    ngOnDestroy(): void {\n        this.destroy$.next(null);\n        this.destroy$.unsubscribe();\n    }\n\n    /**\n     * Called when the tag’s remove button is clicked (or enter key pressed).\n     * Emits the `remove` event. If not prevented, the tag is hidden.\n     */\n    onRemoveClick(): void {\n        const event = new EclTagRemoveEvent();\n        this.remove.next(event);\n\n        if (!event.defaultPrevented) {\n            this.isVisible = false;\n        }\n    }\n\n    private connectEvents(): void {\n        fromEvent(this.el.nativeElement, 'keydown')\n            .pipe(takeUntil(this.destroy$))\n            .subscribe((e: KeyboardEvent) => {\n                if (this.isRemovable && e.key === KeyCode.ENTER) {\n                    this.onRemoveClick();\n                }\n            });\n    }\n}\n","<ng-content></ng-content>\n@if(isRemovable) {\n    <span class=\"ecl-tag__icon\" (click)=\"onRemoveClick()\">\n    <ecl-icon icon=\"close-outline\" class=\"ecl-tag__icon-close\" [title]=\"title | titlecase\"></ecl-icon>\n</span>\n}\n","import { Directive, HostBinding } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive to style a container as a set of tags.\n * Adds the `ecl-tag-set` class to the host element.\n */\n@Directive({\n    selector: '[eclTagSet]',\n})\nexport class EclTagSetDirective extends ECLBaseDirective {\n    /**\n     * CSS classes applied to the host element.\n     * Adds `ecl-tag-set` to define the layout for a group of tags.\n     */\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-tag-set')].join(' ').trim();\n    }\n}\n\n/**\n * Directive to mark an element as an individual item in a tag set.\n * Adds the `ecl-tag-set__item` class to the host element.\n */\n@Directive({\n    selector: '[eclTagSetItem]',\n})\nexport class EclTagSetItemDirective extends ECLBaseDirective {\n    /**\n     * Adds the `ecl-tag-set__item` CSS class to the host element.\n     */\n    @HostBinding('class.ecl-tag-set__item') hasClass = true;\n}\n","import { Directive, HostBinding } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive to apply external icon styling inside an ECL tag.\n * Adds specific CSS classes to render an \"external\" icon next to the tag content.\n */\n@Directive({\n    selector: '[eclTagIconExternal]',\n})\nexport class EclTagIconExternalDirective extends ECLBaseDirective {\n    /**\n     * CSS classes applied to the host element.\n     * Adds `ecl-tag__icon ecl-tag__icon--external` to display the icon correctly.\n     */\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-tag__icon ecl-tag__icon--external')].join(' ').trim();\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { EclTagComponent } from './ecl-tag.component';\nimport { EclTagSetDirective, EclTagSetItemDirective } from './ecl-tag-set.directive';\nimport { EclTagIconExternalDirective } from './ecl-tag-icon.directive';\n\nconst COMPONENTS = [EclTagComponent, EclTagSetDirective, EclTagSetItemDirective, EclTagIconExternalDirective];\n/**\n * Module that provides the EclTag component and its dependencies.\n *\n * @deprecated Use {@link EUI_ECL_TAG} instead.\n */\n@NgModule({\n    imports: [...COMPONENTS],\n    exports: [...COMPONENTS],\n})\nexport class EclTagModule {}\n","import { EclTagComponent } from './ecl-tag.component';\nimport { EclTagSetDirective, EclTagSetItemDirective } from './ecl-tag-set.directive';\nimport { EclTagIconExternalDirective } from './ecl-tag-icon.directive';\n\nexport * from './ecl-tag.module';\nexport * from './ecl-tag.component';\nexport * from './ecl-tag-set.directive';\nexport * from './ecl-tag-icon.directive';\nexport * from './events/ecl-tag-remove.event';\n\nexport const EUI_ECL_TAG = [\n    EclTagComponent, EclTagSetDirective, EclTagSetItemDirective, EclTagIconExternalDirective,\n] as const;","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"eui-ecl-components-ecl-tag.mjs","sources":["../../components/ecl-tag/events/ecl-tag-remove.event.ts","../../components/ecl-tag/ecl-tag.component.ts","../../components/ecl-tag/ecl-tag.component.html","../../components/ecl-tag/ecl-tag-set.directive.ts","../../components/ecl-tag/ecl-tag-icon.directive.ts","../../components/ecl-tag/ecl-tag.module.ts","../../components/ecl-tag/index.ts","../../components/ecl-tag/eui-ecl-components-ecl-tag.ts"],"sourcesContent":["import { EclBaseEvent } from '@eui/ecl/core';\n\n/**\n * Event emitted when a tag is removed.\n */\nexport class EclTagRemoveEvent extends EclBaseEvent {}\n","import {\n    Component,\n    Input,\n    HostBinding,\n    Output,\n    EventEmitter,\n    booleanAttribute,\n    ElementRef,\n    afterNextRender,\n    OnDestroy,\n    inject,\n} from '@angular/core';\nimport { TitleCasePipe } from '@angular/common';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { Subject, fromEvent, takeUntil } from 'rxjs';\nimport { KeyCode } from '@eui/ecl/core';\nimport { EclTagRemoveEvent } from './events/ecl-tag-remove.event';\nimport { EclIconModule } from '@eui/ecl/components/ecl-icon';\n\n@Component({\n    selector: 'ecl-tag, [eclTag]',\n    templateUrl: './ecl-tag.component.html',\n    imports: [EclIconModule, TitleCasePipe],\n})\nexport class EclTagComponent extends ECLBaseDirective implements OnDestroy {\n    /**\n     * Defines the variant of the tag.\n     * Currently only 'removable' is supported.\n     */\n    @Input() variant: 'removable';\n\n    /**\n     * Whether the tag content should be allowed to wrap onto multiple lines.\n     * Set to false to force single-line display (adds `ecl-tag--nowrap` class).\n     * Defaults to true.\n     */\n    @Input({ transform: booleanAttribute }) isWrapped = true;\n\n    /**\n     * Event emitted when the tag is removed.\n     * Can be prevented by calling `preventDefault()` on the emitted event.\n     */\n    @Output() remove = new EventEmitter<EclTagRemoveEvent>();\n\n    @HostBinding('style.display')\n    get isHidden(): string | null {\n        return this.isVisible ? null : 'none';\n    }\n\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-tag'),\n            this.variant ? `ecl-tag--${this.variant}` : '',\n            this.isWrapped ? '' : 'ecl-tag--nowrap',\n        ].join(' ').trim();\n    }\n\n    isVisible = true;\n    title = 'dismiss';\n    private el = inject(ElementRef);\n    private destroy$: Subject<boolean> = new Subject<boolean>();\n\n    constructor() {\n        super();\n        afterNextRender(() => {\n            this.connectEvents();\n        });\n    }\n\n    /**\n     * Whether the tag is removable (based on the `variant` input).\n     */\n    get isRemovable(): boolean {\n        return this.variant == 'removable';\n    }\n\n    /**\n     * Lifecycle hook that cleans up subscriptions when the component is destroyed.\n     */\n    ngOnDestroy(): void {\n        this.destroy$.next(null);\n        this.destroy$.unsubscribe();\n    }\n\n    /**\n     * Called when the tag’s remove button is clicked (or enter key pressed).\n     * Emits the `remove` event. If not prevented, the tag is hidden.\n     */\n    onRemoveClick(): void {\n        const event = new EclTagRemoveEvent();\n        this.remove.next(event);\n\n        if (!event.defaultPrevented) {\n            this.isVisible = false;\n        }\n    }\n\n    private connectEvents(): void {\n        fromEvent(this.el.nativeElement, 'keydown')\n            .pipe(takeUntil(this.destroy$))\n            .subscribe((e: KeyboardEvent) => {\n                if (this.isRemovable && e.key === KeyCode.ENTER) {\n                    this.onRemoveClick();\n                }\n            });\n    }\n}\n","<ng-content></ng-content>\n@if(isRemovable) {\n    <span class=\"ecl-tag__icon\" (click)=\"onRemoveClick()\">\n    <ecl-icon icon=\"close-outline\" class=\"ecl-tag__icon-close\" [title]=\"title | titlecase\"></ecl-icon>\n</span>\n}\n","import { Directive, HostBinding } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive to style a container as a set of tags.\n * Adds the `ecl-tag-set` class to the host element.\n */\n@Directive({\n    selector: '[eclTagSet]',\n})\nexport class EclTagSetDirective extends ECLBaseDirective {\n    /**\n     * CSS classes applied to the host element.\n     * Adds `ecl-tag-set` to define the layout for a group of tags.\n     */\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-tag-set')].join(' ').trim();\n    }\n}\n\n/**\n * Directive to mark an element as an individual item in a tag set.\n * Adds the `ecl-tag-set__item` class to the host element.\n */\n@Directive({\n    selector: '[eclTagSetItem]',\n})\nexport class EclTagSetItemDirective extends ECLBaseDirective {\n    /**\n     * Adds the `ecl-tag-set__item` CSS class to the host element.\n     */\n    @HostBinding('class.ecl-tag-set__item') hasClass = true;\n}\n","import { Directive, HostBinding } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive to apply external icon styling inside an ECL tag.\n * Adds specific CSS classes to render an \"external\" icon next to the tag content.\n */\n@Directive({\n    selector: '[eclTagIconExternal]',\n})\nexport class EclTagIconExternalDirective extends ECLBaseDirective {\n    /**\n     * CSS classes applied to the host element.\n     * Adds `ecl-tag__icon ecl-tag__icon--external` to display the icon correctly.\n     */\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-tag__icon ecl-tag__icon--external')].join(' ').trim();\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { EclTagComponent } from './ecl-tag.component';\nimport { EclTagSetDirective, EclTagSetItemDirective } from './ecl-tag-set.directive';\nimport { EclTagIconExternalDirective } from './ecl-tag-icon.directive';\n\nconst COMPONENTS = [EclTagComponent, EclTagSetDirective, EclTagSetItemDirective, EclTagIconExternalDirective];\n/**\n * Module that provides the EclTag component and its dependencies.\n *\n * @deprecated Use {@link EUI_ECL_TAG} instead.\n */\n@NgModule({\n    imports: [...COMPONENTS],\n    exports: [...COMPONENTS],\n})\nexport class EclTagModule {}\n","import { EclTagComponent } from './ecl-tag.component';\nimport { EclTagSetDirective, EclTagSetItemDirective } from './ecl-tag-set.directive';\nimport { EclTagIconExternalDirective } from './ecl-tag-icon.directive';\n\nexport * from './ecl-tag.module';\nexport * from './ecl-tag.component';\nexport * from './ecl-tag-set.directive';\nexport * from './ecl-tag-icon.directive';\nexport * from './events/ecl-tag-remove.event';\n\nexport const EUI_ECL_TAG = [\n    EclTagComponent, EclTagSetDirective, EclTagSetItemDirective, EclTagIconExternalDirective,\n] as const;","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;AAEA;;AAEG;AACG,MAAO,iBAAkB,SAAQ,YAAY,CAAA;AAAG;;ACmBhD,MAAO,eAAgB,SAAQ,gBAAgB,CAAA;AAoBjD,IAAA,IACI,QAAQ,GAAA;QACR,OAAO,IAAI,CAAC,SAAS,GAAG,IAAI,GAAG,MAAM;IACzC;AAEA,IAAA,IACI,UAAU,GAAA;AACV,QAAA,OAAO,CAAC,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC;AAClC,YAAA,IAAI,CAAC,OAAO,GAAG,CAAA,SAAA,EAAY,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,EAAE;YAC9C,IAAI,CAAC,SAAS,GAAG,EAAE,GAAG,iBAAiB;AAC1C,SAAA,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE;IACtB;AAOA,IAAA,WAAA,GAAA;AACI,QAAA,KAAK,EAAE;AAhCX;;;;AAIG;QACqC,IAAA,CAAA,SAAS,GAAG,IAAI;AAExD;;;AAGG;AACO,QAAA,IAAA,CAAA,MAAM,GAAG,IAAI,YAAY,EAAqB;QAexD,IAAA,CAAA,SAAS,GAAG,IAAI;QAChB,IAAA,CAAA,KAAK,GAAG,SAAS;AACT,QAAA,IAAA,CAAA,EAAE,GAAG,MAAM,CAAC,UAAU,CAAC;AACvB,QAAA,IAAA,CAAA,QAAQ,GAAqB,IAAI,OAAO,EAAW;QAIvD,eAAe,CAAC,MAAK;YACjB,IAAI,CAAC,aAAa,EAAE;AACxB,QAAA,CAAC,CAAC;IACN;AAEA;;AAEG;AACH,IAAA,IAAI,WAAW,GAAA;AACX,QAAA,OAAO,IAAI,CAAC,OAAO,IAAI,WAAW;IACtC;AAEA;;AAEG;IACH,WAAW,GAAA;AACP,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;AACxB,QAAA,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE;IAC/B;AAEA;;;AAGG;IACH,aAAa,GAAA;AACT,QAAA,MAAM,KAAK,GAAG,IAAI,iBAAiB,EAAE;AACrC,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC;AAEvB,QAAA,IAAI,CAAC,KAAK,CAAC,gBAAgB,EAAE;AACzB,YAAA,IAAI,CAAC,SAAS,GAAG,KAAK;QAC1B;IACJ;IAEQ,aAAa,GAAA;QACjB,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,aAAa,EAAE,SAAS;AACrC,aAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;AAC7B,aAAA,SAAS,CAAC,CAAC,CAAgB,KAAI;AAC5B,YAAA,IAAI,IAAI,CAAC,WAAW,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,CAAC,KAAK,EAAE;gBAC7C,IAAI,CAAC,aAAa,EAAE;YACxB;AACJ,QAAA,CAAC,CAAC;IACV;8GAjFS,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAf,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAe,yHAYJ,gBAAgB,CAAA,EAAA,EAAA,OAAA,EAAA,EAAA,MAAA,EAAA,QAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,eAAA,EAAA,eAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECpCxC,2OAMA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDgBc,aAAa,+OAAE,aAAa,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;2FAE7B,eAAe,EAAA,UAAA,EAAA,CAAA;kBAL3B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,mBAAmB,EAAA,OAAA,EAEpB,CAAC,aAAa,EAAE,aAAa,CAAC,EAAA,QAAA,EAAA,2OAAA,EAAA;wDAO9B,OAAO,EAAA,CAAA;sBAAf;gBAOuC,SAAS,EAAA,CAAA;sBAAhD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAM5B,MAAM,EAAA,CAAA;sBAAf;gBAGG,QAAQ,EAAA,CAAA;sBADX,WAAW;uBAAC,eAAe;gBAMxB,UAAU,EAAA,CAAA;sBADb,WAAW;uBAAC,OAAO;;;AE9CxB;;;AAGG;AAIG,MAAO,kBAAmB,SAAQ,gBAAgB,CAAA;AACpD;;;AAGG;AACH,IAAA,IACI,UAAU,GAAA;AACV,QAAA,OAAO,CAAC,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE;IAChE;8GARS,kBAAkB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAlB,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,aAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAlB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAH9B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,aAAa;AAC1B,iBAAA;8BAOO,UAAU,EAAA,CAAA;sBADb,WAAW;uBAAC,OAAO;;AAMxB;;;AAGG;AAIG,MAAO,sBAAuB,SAAQ,gBAAgB,CAAA;AAH5D,IAAA,WAAA,GAAA;;AAII;;AAEG;QACqC,IAAA,CAAA,QAAQ,GAAG,IAAI;AAC1D,IAAA;8GALY,sBAAsB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAAtB,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,yBAAA,EAAA,eAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAAtB,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAHlC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,iBAAiB;AAC9B,iBAAA;8BAK2C,QAAQ,EAAA,CAAA;sBAA/C,WAAW;uBAAC,yBAAyB;;;AC7B1C;;;AAGG;AAIG,MAAO,2BAA4B,SAAQ,gBAAgB,CAAA;AAC7D;;;AAGG;AACH,IAAA,IACI,UAAU,GAAA;AACV,QAAA,OAAO,CAAC,KAAK,CAAC,aAAa,CAAC,uCAAuC,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE;IAC1F;8GARS,2BAA2B,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAA3B,2BAA2B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAA3B,2BAA2B,EAAA,UAAA,EAAA,CAAA;kBAHvC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,sBAAsB;AACnC,iBAAA;8BAOO,UAAU,EAAA,CAAA;sBADb,WAAW;uBAAC,OAAO;;;ACVxB,MAAM,UAAU,GAAG,CAAC,eAAe,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,2BAA2B,CAAC;AAC7G;;;;AAIG;MAKU,YAAY,CAAA;8GAAZ,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAAZ,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,YAAY,EAAA,OAAA,EAAA,CAVL,eAAe,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,2BAA2B,CAAA,EAAA,OAAA,EAAA,CAAxF,eAAe,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,2BAA2B,CAAA,EAAA,CAAA,CAAA;AAU/F,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,YAAY,YAVL,eAAe,CAAA,EAAA,CAAA,CAAA;;2FAUtB,YAAY,EAAA,UAAA,EAAA,CAAA;kBAJxB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE,CAAC,GAAG,UAAU,CAAC;AACxB,oBAAA,OAAO,EAAE,CAAC,GAAG,UAAU,CAAC;AAC3B,iBAAA;;;ACJM,MAAM,WAAW,GAAG;AACvB,IAAA,eAAe,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,2BAA2B;;;ACX5F;;AAEG;;;;"}

package/fesm2022/eui-ecl-components-ecl-text-area.mjs

@@ -1,12 +1,21 @@
 import * as i0 from '@angular/core';
-import { booleanAttribute, HostBinding, Input, Optional, Self, Directive, NgModule } from '@angular/core';
+import { inject, booleanAttribute, HostBinding, Input, Directive, NgModule } from '@angular/core';
+import { NgControl } from '@angular/forms';
 import { ECLBaseDirective } from '@eui/ecl/core';
-import * as i1 from '@angular/forms';
 
 /**
  * Directive to be used with <textarea> HTML component. Applies custom styles and formatting, that comply with the ECL standards.
  */
 class EclTextAreaDirective extends ECLBaseDirective {
+    constructor() {
+        super(...arguments);
+        /**
+         * Width of the component, can be 's', 'm' or 'l'. Default value is 'm'.
+         */
+        this.eclSize = 'm';
+        this.isInvalid = false;
+        this.ngControl = inject(NgControl, { optional: true, self: true });
+    }
     /**
      * Adds specific classes for the component.
      */
@@ -24,28 +33,15 @@ class EclTextAreaDirective extends ECLBaseDirective {
             return this.isInvalid;
         }
     }
-    constructor(ngControl) {
-        super();
-        this.ngControl = ngControl;
-        /**
-         * Width of the component, can be 's', 'm' or 'l'. Default value is 'm'.
-         */
-        this.eclSize = 'm';
-        this.isInvalid = false;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTextAreaDirective, deps: [{ token: i1.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "19.2.14", type: EclTextAreaDirective, isStandalone: true, selector: "textarea[eclTextArea]", inputs: { eclSize: "eclSize", isInvalid: ["isInvalid", "isInvalid", booleanAttribute] }, host: { properties: { "class": "this.cssClasses", "class.ecl-text-area--invalid": "this.invalidState" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTextAreaDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.1.6", type: EclTextAreaDirective, isStandalone: true, selector: "textarea[eclTextArea]", inputs: { eclSize: "eclSize", isInvalid: ["isInvalid", "isInvalid", booleanAttribute] }, host: { properties: { "class": "this.cssClasses", "class.ecl-text-area--invalid": "this.invalidState" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTextAreaDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTextAreaDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'textarea[eclTextArea]',
                 }]
-        }], ctorParameters: () => [{ type: i1.NgControl, decorators: [{
-                    type: Optional
-                }, {
-                    type: Self
-                }] }], propDecorators: { eclSize: [{
+        }], propDecorators: { eclSize: [{
                 type: Input
             }], isInvalid: [{
                 type: Input,
@@ -65,11 +61,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
  * @deprecated Use {@link EUI_ECL_TEXT_AREA} instead.
  */
 class EclTextAreaModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTextAreaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: EclTextAreaModule, imports: [EclTextAreaDirective], exports: [EclTextAreaDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTextAreaModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTextAreaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.6", ngImport: i0, type: EclTextAreaModule, imports: [EclTextAreaDirective], exports: [EclTextAreaDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTextAreaModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTextAreaModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTextAreaModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [EclTextAreaDirective],

package/fesm2022/eui-ecl-components-ecl-text-area.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"eui-ecl-components-ecl-text-area.mjs","sources":["../../components/ecl-text-area/ecl-text-area.directive.ts","../../components/ecl-text-area/ecl-text-area.module.ts","../../components/ecl-text-area/index.ts","../../components/ecl-text-area/eui-ecl-components-ecl-text-area.ts"],"sourcesContent":["import { Directive, HostBinding, Input, Optional, Self, booleanAttribute } from '@angular/core';\nimport { NgControl } from '@angular/forms';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive to be used with <textarea> HTML component. Applies custom styles and formatting, that comply with the ECL standards.\n */\n@Directive({\n    selector: 'textarea[eclTextArea]',\n})\nexport class EclTextAreaDirective extends ECLBaseDirective {\n    /**\n     * Width of the component, can be 's', 'm' or 'l'. Default value is 'm'.\n     */\n    @Input() eclSize = 'm';\n    @Input({ transform: booleanAttribute }) isInvalid = false;\n\n    /**\n     * Adds specific classes for the component.\n     */\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-text-area'), this.eclSize ? `ecl-text-area--${this.eclSize}` : ''].join(' ').trim();\n    }\n\n    /**\n     * Adds 'ecl-text-area--invalid' class, depending on the invalid status of the component.\n     */\n    @HostBinding('class.ecl-text-area--invalid')\n    get invalidState(): boolean {\n        if (this.ngControl) {\n            return this.ngControl.status === 'INVALID' && this.ngControl.touched;\n        } else {\n            return this.isInvalid;\n        }\n    }\n\n    constructor(@Optional() @Self() private ngControl: NgControl) {\n        super();\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { EclTextAreaDirective } from './ecl-text-area.directive';\n\n/**\n * @description\n * Module that provides the EclTextArea directive and its dependencies.\n *\n * @deprecated Use {@link EUI_ECL_TEXT_AREA} instead.\n */\n@NgModule({\n  imports: [EclTextAreaDirective],\n  exports: [EclTextAreaDirective],\n})\nexport class EclTextAreaModule {}\n","import { EclTextAreaDirective } from './ecl-text-area.directive';\n\nexport * from './ecl-text-area.module';\nexport * from './ecl-text-area.directive';\n\nexport const EUI_ECL_TEXT_AREA = [\n  EclTextAreaDirective,\n] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAIA;;AAEG;AAIG,MAAO,oBAAqB,SAAQ,gBAAgB,CAAA;AAOtD;;AAEG;AACH,IAAA,IACI,UAAU,GAAA;AACV,QAAA,OAAO,CAAC,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,EAAE,IAAI,CAAC,OAAO,GAAG,CAAA,eAAA,EAAkB,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE;IACxH;AAEA;;AAEG;AACH,IAAA,IACI,YAAY,GAAA;AACZ,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAChB,YAAA,OAAO,IAAI,CAAC,SAAS,CAAC,MAAM,KAAK,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,OAAO;QACxE;aAAO;YACH,OAAO,IAAI,CAAC,SAAS;QACzB;IACJ;AAEA,IAAA,WAAA,CAAwC,SAAoB,EAAA;AACxD,QAAA,KAAK,EAAE;QAD6B,IAAA,CAAA,SAAS,GAAT,SAAS;AA1BjD;;AAEG;QACM,IAAA,CAAA,OAAO,GAAG,GAAG;QACkB,IAAA,CAAA,SAAS,GAAG,KAAK;IAwBzD;+GA7BS,oBAAoB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,IAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,oBAAoB,6HAKT,gBAAgB,CAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,8BAAA,EAAA,mBAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAL3B,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAHhC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,uBAAuB;AACpC,iBAAA;;0BA4BgB;;0BAAY;yCAvBhB,OAAO,EAAA,CAAA;sBAAf;gBACuC,SAAS,EAAA,CAAA;sBAAhD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAMlC,UAAU,EAAA,CAAA;sBADb,WAAW;uBAAC,OAAO;gBAShB,YAAY,EAAA,CAAA;sBADf,WAAW;uBAAC,8BAA8B;;;ACzB/C;;;;;AAKG;MAKU,iBAAiB,CAAA;+GAAjB,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;gHAAjB,iBAAiB,EAAA,OAAA,EAAA,CAHlB,oBAAoB,CAAA,EAAA,OAAA,EAAA,CACpB,oBAAoB,CAAA,EAAA,CAAA,CAAA;gHAEnB,iBAAiB,EAAA,CAAA,CAAA;;4FAAjB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAJ7B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,oBAAoB,CAAC;oBAC/B,OAAO,EAAE,CAAC,oBAAoB,CAAC;AAChC,iBAAA;;;ACPM,MAAM,iBAAiB,GAAG;IAC/B,oBAAoB;;;ACNtB;;AAEG;;;;"}
+{"version":3,"file":"eui-ecl-components-ecl-text-area.mjs","sources":["../../components/ecl-text-area/ecl-text-area.directive.ts","../../components/ecl-text-area/ecl-text-area.module.ts","../../components/ecl-text-area/index.ts","../../components/ecl-text-area/eui-ecl-components-ecl-text-area.ts"],"sourcesContent":["import { Directive, HostBinding, Input, booleanAttribute, inject } from '@angular/core';\nimport { NgControl } from '@angular/forms';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive to be used with <textarea> HTML component. Applies custom styles and formatting, that comply with the ECL standards.\n */\n@Directive({\n    selector: 'textarea[eclTextArea]',\n})\nexport class EclTextAreaDirective extends ECLBaseDirective {\n    /**\n     * Width of the component, can be 's', 'm' or 'l'. Default value is 'm'.\n     */\n    @Input() eclSize = 'm';\n    @Input({ transform: booleanAttribute }) isInvalid = false;\n\n    /**\n     * Adds specific classes for the component.\n     */\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-text-area'), this.eclSize ? `ecl-text-area--${this.eclSize}` : ''].join(' ').trim();\n    }\n\n    /**\n     * Adds 'ecl-text-area--invalid' class, depending on the invalid status of the component.\n     */\n    @HostBinding('class.ecl-text-area--invalid')\n    get invalidState(): boolean {\n        if (this.ngControl) {\n            return this.ngControl.status === 'INVALID' && this.ngControl.touched;\n        } else {\n            return this.isInvalid;\n        }\n    }\n    private ngControl = inject(NgControl, { optional: true, self: true });\n}\n","import { NgModule } from '@angular/core';\nimport { EclTextAreaDirective } from './ecl-text-area.directive';\n\n/**\n * @description\n * Module that provides the EclTextArea directive and its dependencies.\n *\n * @deprecated Use {@link EUI_ECL_TEXT_AREA} instead.\n */\n@NgModule({\n  imports: [EclTextAreaDirective],\n  exports: [EclTextAreaDirective],\n})\nexport class EclTextAreaModule {}\n","import { EclTextAreaDirective } from './ecl-text-area.directive';\n\nexport * from './ecl-text-area.module';\nexport * from './ecl-text-area.directive';\n\nexport const EUI_ECL_TEXT_AREA = [\n  EclTextAreaDirective,\n] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAIA;;AAEG;AAIG,MAAO,oBAAqB,SAAQ,gBAAgB,CAAA;AAH1D,IAAA,WAAA,GAAA;;AAII;;AAEG;QACM,IAAA,CAAA,OAAO,GAAG,GAAG;QACkB,IAAA,CAAA,SAAS,GAAG,KAAK;AAqBjD,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAAC,SAAS,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;AACxE,IAAA;AApBG;;AAEG;AACH,IAAA,IACI,UAAU,GAAA;AACV,QAAA,OAAO,CAAC,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,EAAE,IAAI,CAAC,OAAO,GAAG,CAAA,eAAA,EAAkB,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE;IACxH;AAEA;;AAEG;AACH,IAAA,IACI,YAAY,GAAA;AACZ,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAChB,YAAA,OAAO,IAAI,CAAC,SAAS,CAAC,MAAM,KAAK,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,OAAO;QACxE;aAAO;YACH,OAAO,IAAI,CAAC,SAAS;QACzB;IACJ;8GAzBS,oBAAoB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,6HAKT,gBAAgB,CAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,8BAAA,EAAA,mBAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAL3B,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAHhC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,uBAAuB;AACpC,iBAAA;8BAKY,OAAO,EAAA,CAAA;sBAAf;gBACuC,SAAS,EAAA,CAAA;sBAAhD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAMlC,UAAU,EAAA,CAAA;sBADb,WAAW;uBAAC,OAAO;gBAShB,YAAY,EAAA,CAAA;sBADf,WAAW;uBAAC,8BAA8B;;;ACzB/C;;;;;AAKG;MAKU,iBAAiB,CAAA;8GAAjB,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;+GAAjB,iBAAiB,EAAA,OAAA,EAAA,CAHlB,oBAAoB,CAAA,EAAA,OAAA,EAAA,CACpB,oBAAoB,CAAA,EAAA,CAAA,CAAA;+GAEnB,iBAAiB,EAAA,CAAA,CAAA;;2FAAjB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAJ7B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,oBAAoB,CAAC;oBAC/B,OAAO,EAAE,CAAC,oBAAoB,CAAC;AAChC,iBAAA;;;ACPM,MAAM,iBAAiB,GAAG;IAC/B,oBAAoB;;;ACNtB;;AAEG;;;;"}

package/fesm2022/eui-ecl-components-ecl-text-input.mjs

@@ -1,21 +1,15 @@
 import * as i0 from '@angular/core';
-import { booleanAttribute, HostBinding, Input, Optional, Self, Directive, NgModule } from '@angular/core';
+import { inject, booleanAttribute, HostBinding, Input, Directive, NgModule } from '@angular/core';
+import { NgControl } from '@angular/forms';
 import { ECLBaseDirective } from '@eui/ecl/core';
-import * as i1 from '@angular/forms';
 
 /**
  * Directive, to be used with the HTMl element text <input>. Adds ECL compliant styling.
  */
 class EclTextInputDirective extends ECLBaseDirective {
-    /**
-     * Adds ECL classes for the component.
-     */
-    get cssClasses() {
-        return [super.getCssClasses('ecl-text-input'), this.eclSize ? `ecl-text-input--${this.eclSize}` : ''].join(' ').trim();
-    }
-    constructor(ngControl) {
-        super();
-        this.ngControl = ngControl;
+    constructor() {
+        super(...arguments);
+        this.ngControl = inject(NgControl, { optional: true, self: true });
         /**
          * This directive should be used with the input type 'text'.
          */
@@ -26,6 +20,12 @@ class EclTextInputDirective extends ECLBaseDirective {
         this.eclSize = 'm';
         this.isInvalid = false;
     }
+    /**
+     * Adds ECL classes for the component.
+     */
+    get cssClasses() {
+        return [super.getCssClasses('ecl-text-input'), this.eclSize ? `ecl-text-input--${this.eclSize}` : ''].join(' ').trim();
+    }
     /**
      * Adds 'ecl-text-input--invalid' class, depending on the invalid status of the component.
      */
@@ -37,19 +37,15 @@ class EclTextInputDirective extends ECLBaseDirective {
             return this.isInvalid;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTextInputDirective, deps: [{ token: i1.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "19.2.14", type: EclTextInputDirective, isStandalone: true, selector: "input[eclTextInput]", inputs: { type: "type", eclSize: "eclSize", isInvalid: ["isInvalid", "isInvalid", booleanAttribute] }, host: { properties: { "attr.type": "this.type", "class": "this.cssClasses", "class.ecl-text-input--invalid": "this.invalidState" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTextInputDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.1.6", type: EclTextInputDirective, isStandalone: true, selector: "input[eclTextInput]", inputs: { type: "type", eclSize: "eclSize", isInvalid: ["isInvalid", "isInvalid", booleanAttribute] }, host: { properties: { "attr.type": "this.type", "class": "this.cssClasses", "class.ecl-text-input--invalid": "this.invalidState" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTextInputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTextInputDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'input[eclTextInput]',
                 }]
-        }], ctorParameters: () => [{ type: i1.NgControl, decorators: [{
-                    type: Optional
-                }, {
-                    type: Self
-                }] }], propDecorators: { type: [{
+        }], propDecorators: { type: [{
                 type: Input
             }, {
                 type: HostBinding,
@@ -74,11 +70,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
  * @deprecated Use {@link EUI_ECL_TEXT_INPUT} instead.
  */
 class EclTextInputModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTextInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: EclTextInputModule, imports: [EclTextInputDirective], exports: [EclTextInputDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTextInputModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTextInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.6", ngImport: i0, type: EclTextInputModule, imports: [EclTextInputDirective], exports: [EclTextInputDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTextInputModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTextInputModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTextInputModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [EclTextInputDirective],

package/fesm2022/eui-ecl-components-ecl-text-input.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"eui-ecl-components-ecl-text-input.mjs","sources":["../../components/ecl-text-input/ecl-text-input.directive.ts","../../components/ecl-text-input/ecl-text-input.module.ts","../../components/ecl-text-input/index.ts","../../components/ecl-text-input/eui-ecl-components-ecl-text-input.ts"],"sourcesContent":["import { Directive, HostBinding, Input, Optional, Self, booleanAttribute } from '@angular/core';\nimport { NgControl } from '@angular/forms';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive, to be used with the HTMl element text <input>. Adds ECL compliant styling.\n */\n@Directive({\n    selector: 'input[eclTextInput]',\n})\nexport class EclTextInputDirective extends ECLBaseDirective {\n    /**\n     * This directive should be used with the input type 'text'.\n     */\n    @Input()\n    @HostBinding('attr.type') type = 'text';\n\n    /**\n     * The size of the input width. Can be 's', 'm' or 'l'. Default value is 'm'.\n     */\n    @Input() eclSize = 'm';\n    @Input({ transform: booleanAttribute }) isInvalid = false;\n\n    /**\n     * Adds ECL classes for the component.\n     */\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-text-input'), this.eclSize ? `ecl-text-input--${this.eclSize}` : ''].join(' ').trim();\n    }\n\n    constructor(@Optional() @Self() protected ngControl: NgControl) {\n        super();\n    }\n\n    /**\n     * Adds 'ecl-text-input--invalid' class, depending on the invalid status of the component.\n     */\n    @HostBinding('class.ecl-text-input--invalid')\n    get invalidState(): boolean {\n        if (this.ngControl) {\n            return this.ngControl.status === 'INVALID' && this.ngControl.touched;\n        } else {\n            return this.isInvalid;\n        }\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { EclTextInputDirective } from './ecl-text-input.directive';\n\n/**\n * @description\n * Module that provides the EclTextInput directive and its dependencies.\n *\n * @deprecated Use {@link EUI_ECL_TEXT_INPUT} instead.\n */\n@NgModule({\n    imports: [EclTextInputDirective],\n    exports: [EclTextInputDirective],\n})\nexport class EclTextInputModule {}\n","import { EclTextInputDirective } from './ecl-text-input.directive';\n\nexport * from './ecl-text-input.module';\nexport * from './ecl-text-input.directive';\n\nexport const EUI_ECL_TEXT_INPUT = [\n  EclTextInputDirective,\n] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAIA;;AAEG;AAIG,MAAO,qBAAsB,SAAQ,gBAAgB,CAAA;AAavD;;AAEG;AACH,IAAA,IACI,UAAU,GAAA;AACV,QAAA,OAAO,CAAC,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,EAAE,IAAI,CAAC,OAAO,GAAG,CAAA,gBAAA,EAAmB,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE;IAC1H;AAEA,IAAA,WAAA,CAA0C,SAAoB,EAAA;AAC1D,QAAA,KAAK,EAAE;QAD+B,IAAA,CAAA,SAAS,GAAT,SAAS;AApBnD;;AAEG;QAEuB,IAAA,CAAA,IAAI,GAAG,MAAM;AAEvC;;AAEG;QACM,IAAA,CAAA,OAAO,GAAG,GAAG;QACkB,IAAA,CAAA,SAAS,GAAG,KAAK;IAYzD;AAEA;;AAEG;AACH,IAAA,IACI,YAAY,GAAA;AACZ,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAChB,YAAA,OAAO,IAAI,CAAC,SAAS,CAAC,MAAM,KAAK,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,OAAO;QACxE;aAAO;YACH,OAAO,IAAI,CAAC,SAAS;QACzB;IACJ;+GAnCS,qBAAqB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,IAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,qBAAqB,yIAWV,gBAAgB,CAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,WAAA,EAAA,WAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,+BAAA,EAAA,mBAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAX3B,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAHjC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,qBAAqB;AAClC,iBAAA;;0BAsBgB;;0BAAY;yCAhBC,IAAI,EAAA,CAAA;sBAD7B;;sBACA,WAAW;uBAAC,WAAW;gBAKf,OAAO,EAAA,CAAA;sBAAf;gBACuC,SAAS,EAAA,CAAA;sBAAhD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAMlC,UAAU,EAAA,CAAA;sBADb,WAAW;uBAAC,OAAO;gBAahB,YAAY,EAAA,CAAA;sBADf,WAAW;uBAAC,+BAA+B;;;ACnChD;;;;;AAKG;MAKU,kBAAkB,CAAA;+GAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;gHAAlB,kBAAkB,EAAA,OAAA,EAAA,CAHjB,qBAAqB,CAAA,EAAA,OAAA,EAAA,CACrB,qBAAqB,CAAA,EAAA,CAAA,CAAA;gHAEtB,kBAAkB,EAAA,CAAA,CAAA;;4FAAlB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAJ9B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACN,OAAO,EAAE,CAAC,qBAAqB,CAAC;oBAChC,OAAO,EAAE,CAAC,qBAAqB,CAAC;AACnC,iBAAA;;;ACPM,MAAM,kBAAkB,GAAG;IAChC,qBAAqB;;;ACNvB;;AAEG;;;;"}
+{"version":3,"file":"eui-ecl-components-ecl-text-input.mjs","sources":["../../components/ecl-text-input/ecl-text-input.directive.ts","../../components/ecl-text-input/ecl-text-input.module.ts","../../components/ecl-text-input/index.ts","../../components/ecl-text-input/eui-ecl-components-ecl-text-input.ts"],"sourcesContent":["import { Directive, HostBinding, Input, booleanAttribute, inject } from '@angular/core';\nimport { NgControl } from '@angular/forms';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive, to be used with the HTMl element text <input>. Adds ECL compliant styling.\n */\n@Directive({\n    selector: 'input[eclTextInput]',\n})\nexport class EclTextInputDirective extends ECLBaseDirective {\n    protected ngControl = inject(NgControl, { optional: true, self: true });\n\n    /**\n     * This directive should be used with the input type 'text'.\n     */\n    @Input()\n    @HostBinding('attr.type') type = 'text';\n\n    /**\n     * The size of the input width. Can be 's', 'm' or 'l'. Default value is 'm'.\n     */\n    @Input() eclSize = 'm';\n    @Input({ transform: booleanAttribute }) isInvalid = false;\n\n    /**\n     * Adds ECL classes for the component.\n     */\n    @HostBinding('class')\n    get cssClasses(): string {\n        return [super.getCssClasses('ecl-text-input'), this.eclSize ? `ecl-text-input--${this.eclSize}` : ''].join(' ').trim();\n    }\n\n    /**\n     * Adds 'ecl-text-input--invalid' class, depending on the invalid status of the component.\n     */\n    @HostBinding('class.ecl-text-input--invalid')\n    get invalidState(): boolean {\n        if (this.ngControl) {\n            return this.ngControl.status === 'INVALID' && this.ngControl.touched;\n        } else {\n            return this.isInvalid;\n        }\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { EclTextInputDirective } from './ecl-text-input.directive';\n\n/**\n * @description\n * Module that provides the EclTextInput directive and its dependencies.\n *\n * @deprecated Use {@link EUI_ECL_TEXT_INPUT} instead.\n */\n@NgModule({\n    imports: [EclTextInputDirective],\n    exports: [EclTextInputDirective],\n})\nexport class EclTextInputModule {}\n","import { EclTextInputDirective } from './ecl-text-input.directive';\n\nexport * from './ecl-text-input.module';\nexport * from './ecl-text-input.directive';\n\nexport const EUI_ECL_TEXT_INPUT = [\n  EclTextInputDirective,\n] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAIA;;AAEG;AAIG,MAAO,qBAAsB,SAAQ,gBAAgB,CAAA;AAH3D,IAAA,WAAA,GAAA;;AAIc,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAAC,SAAS,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;AAEvE;;AAEG;QAEuB,IAAA,CAAA,IAAI,GAAG,MAAM;AAEvC;;AAEG;QACM,IAAA,CAAA,OAAO,GAAG,GAAG;QACkB,IAAA,CAAA,SAAS,GAAG,KAAK;AAqB5D,IAAA;AAnBG;;AAEG;AACH,IAAA,IACI,UAAU,GAAA;AACV,QAAA,OAAO,CAAC,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,EAAE,IAAI,CAAC,OAAO,GAAG,CAAA,gBAAA,EAAmB,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE;IAC1H;AAEA;;AAEG;AACH,IAAA,IACI,YAAY,GAAA;AACZ,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAChB,YAAA,OAAO,IAAI,CAAC,SAAS,CAAC,MAAM,KAAK,SAAS,IAAI,IAAI,CAAC,SAAS,CAAC,OAAO;QACxE;aAAO;YACH,OAAO,IAAI,CAAC,SAAS;QACzB;IACJ;8GAjCS,qBAAqB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,qBAAqB,yIAaV,gBAAgB,CAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,WAAA,EAAA,WAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,+BAAA,EAAA,mBAAA,EAAA,EAAA,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;2FAb3B,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAHjC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,qBAAqB;AAClC,iBAAA;8BAQ6B,IAAI,EAAA,CAAA;sBAD7B;;sBACA,WAAW;uBAAC,WAAW;gBAKf,OAAO,EAAA,CAAA;sBAAf;gBACuC,SAAS,EAAA,CAAA;sBAAhD,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;gBAMlC,UAAU,EAAA,CAAA;sBADb,WAAW;uBAAC,OAAO;gBAShB,YAAY,EAAA,CAAA;sBADf,WAAW;uBAAC,+BAA+B;;;ACjChD;;;;;AAKG;MAKU,kBAAkB,CAAA;8GAAlB,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;+GAAlB,kBAAkB,EAAA,OAAA,EAAA,CAHjB,qBAAqB,CAAA,EAAA,OAAA,EAAA,CACrB,qBAAqB,CAAA,EAAA,CAAA,CAAA;+GAEtB,kBAAkB,EAAA,CAAA,CAAA;;2FAAlB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAJ9B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACN,OAAO,EAAE,CAAC,qBAAqB,CAAC;oBAChC,OAAO,EAAE,CAAC,qBAAqB,CAAC;AACnC,iBAAA;;;ACPM,MAAM,kBAAkB,GAAG;IAChC,qBAAqB;;;ACNvB;;AAEG;;;;"}

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

@@ -22,10 +22,10 @@ class EclTimelineItemLabelDirective extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-timeline__label')].join(' ').trim();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineItemLabelDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: EclTimelineItemLabelDirective, isStandalone: true, selector: "[eclTimelineItemLabel]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTimelineItemLabelDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.6", type: EclTimelineItemLabelDirective, isStandalone: true, selector: "[eclTimelineItemLabel]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineItemLabelDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTimelineItemLabelDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclTimelineItemLabel]',
@@ -47,10 +47,10 @@ class EclTimelineItemTitleDirective extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-timeline__title')].join(' ').trim();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineItemTitleDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: EclTimelineItemTitleDirective, isStandalone: true, selector: "[eclTimelineItemTitle]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTimelineItemTitleDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.6", type: EclTimelineItemTitleDirective, isStandalone: true, selector: "[eclTimelineItemTitle]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineItemTitleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTimelineItemTitleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclTimelineItemTitle]',
@@ -80,10 +80,10 @@ class EclTimelineItemTogglerComponent extends ECLBaseDirective {
     onTogglerClick() {
         this.toggle.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineItemTogglerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: EclTimelineItemTogglerComponent, isStandalone: true, selector: "ecl-timeline-item-toggler", outputs: { toggle: "toggle" }, host: { listeners: { "click": "onTogglerClick()" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTimelineItemTogglerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: EclTimelineItemTogglerComponent, isStandalone: true, selector: "ecl-timeline-item-toggler", outputs: { toggle: "toggle" }, host: { listeners: { "click": "onTogglerClick()" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineItemTogglerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTimelineItemTogglerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-timeline-item-toggler', template: "<ng-content></ng-content>\n" }]
         }], propDecorators: { toggle: [{
@@ -206,10 +206,10 @@ class EclTimelineItemComponent extends ECLBaseDirective {
             this.isTogglerExpanded = nextExpandedState;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: EclTimelineItemComponent, isStandalone: true, selector: "ecl-timeline-item", inputs: { expandLabel: "expandLabel", collapseLabel: "collapseLabel", isTogglerExpanded: ["isTogglerExpanded", "isTogglerExpanded", booleanAttribute], isCollapsed: ["isCollapsed", "isCollapsed", booleanAttribute], isToggler: ["isToggler", "isToggler", booleanAttribute], toggleGroup: "toggleGroup" }, outputs: { toggle: "toggle" }, host: { properties: { "class": "this.cssClasses", "class.ecl-timeline__item--collapsed": "this.isCollapsed", "class.ecl-timeline__item--toggle": "this.isToggler" } }, queries: [{ propertyName: "timelineItemToggler", first: true, predicate: i0.forwardRef(() => EclTimelineItemTogglerComponent), descendants: true }, { propertyName: "eclLink", first: true, predicate: i0.forwardRef(() => EclLinkDirective), descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (isToggler) {\n    <div class=\"ecl-timeline__content\">\n        @if (hasDefaultToggler()) {\n            <button eclButton (click)=\"onTogglerClick($event)\" variant=\"secondary\">\n             @if (isShowExpandLabel) {\n                 <span eclButtonLabel> {{ expandLabel }} </span>\n             }\n             @if (isShowCollapseLabel) {\n                 <span eclButtonLabel> {{ collapseLabel }} </span>\n             }\n             <ecl-icon icon=\"corner-arrow\" size=\"fluid\" [transform]=\"!isTogglerExpanded ? 'rotate-180' : ''\"></ecl-icon>\n            </button>\n        }\n\n\n        <ng-content select=\"ecl-timeline-item-toggler\"></ng-content>\n\n        <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n    </div>\n}\n@else {\n    <div class=\"ecl-timeline__tooltip\">\n        <div class=\"ecl-timeline__tooltip-arrow\"></div>\n        <ng-content select=\"[eclTimelineItemLabel]\"></ng-content>\n\n        <ng-content select=\"[eclTimelineItemTitle]\"></ng-content>\n\n        <div class=\"ecl-timeline__content\">\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        </div>\n    </div>\n}\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: ["ecl-timeline-item{display:list-item}\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"] }, { kind: "ngmodule", type: EclButtonModule }, { 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: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTimelineItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: EclTimelineItemComponent, isStandalone: true, selector: "ecl-timeline-item", inputs: { expandLabel: "expandLabel", collapseLabel: "collapseLabel", isTogglerExpanded: ["isTogglerExpanded", "isTogglerExpanded", booleanAttribute], isCollapsed: ["isCollapsed", "isCollapsed", booleanAttribute], isToggler: ["isToggler", "isToggler", booleanAttribute], toggleGroup: "toggleGroup" }, outputs: { toggle: "toggle" }, host: { properties: { "class": "this.cssClasses", "class.ecl-timeline__item--collapsed": "this.isCollapsed", "class.ecl-timeline__item--toggle": "this.isToggler" } }, queries: [{ propertyName: "timelineItemToggler", first: true, predicate: i0.forwardRef(() => EclTimelineItemTogglerComponent), descendants: true }, { propertyName: "eclLink", first: true, predicate: i0.forwardRef(() => EclLinkDirective), descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (isToggler) {\n    <div class=\"ecl-timeline__content\">\n        @if (hasDefaultToggler()) {\n            <button eclButton (click)=\"onTogglerClick($event)\" variant=\"secondary\">\n             @if (isShowExpandLabel) {\n                 <span eclButtonLabel> {{ expandLabel }} </span>\n             }\n             @if (isShowCollapseLabel) {\n                 <span eclButtonLabel> {{ collapseLabel }} </span>\n             }\n             <ecl-icon icon=\"corner-arrow\" size=\"fluid\" [transform]=\"!isTogglerExpanded ? 'rotate-180' : ''\"></ecl-icon>\n            </button>\n        }\n\n\n        <ng-content select=\"ecl-timeline-item-toggler\"></ng-content>\n\n        <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n    </div>\n}\n@else {\n    <div class=\"ecl-timeline__tooltip\">\n        <div class=\"ecl-timeline__tooltip-arrow\"></div>\n        <ng-content select=\"[eclTimelineItemLabel]\"></ng-content>\n\n        <ng-content select=\"[eclTimelineItemTitle]\"></ng-content>\n\n        <div class=\"ecl-timeline__content\">\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        </div>\n    </div>\n}\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: ["ecl-timeline-item{display:list-item}\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"] }, { kind: "ngmodule", type: EclButtonModule }, { 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: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTimelineItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-timeline-item', imports: [EclIconModule, EclButtonModule, NgTemplateOutlet], encapsulation: ViewEncapsulation.None, template: "@if (isToggler) {\n    <div class=\"ecl-timeline__content\">\n        @if (hasDefaultToggler()) {\n            <button eclButton (click)=\"onTogglerClick($event)\" variant=\"secondary\">\n             @if (isShowExpandLabel) {\n                 <span eclButtonLabel> {{ expandLabel }} </span>\n             }\n             @if (isShowCollapseLabel) {\n                 <span eclButtonLabel> {{ collapseLabel }} </span>\n             }\n             <ecl-icon icon=\"corner-arrow\" size=\"fluid\" [transform]=\"!isTogglerExpanded ? 'rotate-180' : ''\"></ecl-icon>\n            </button>\n        }\n\n\n        <ng-content select=\"ecl-timeline-item-toggler\"></ng-content>\n\n        <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n    </div>\n}\n@else {\n    <div class=\"ecl-timeline__tooltip\">\n        <div class=\"ecl-timeline__tooltip-arrow\"></div>\n        <ng-content select=\"[eclTimelineItemLabel]\"></ng-content>\n\n        <ng-content select=\"[eclTimelineItemTitle]\"></ng-content>\n\n        <div class=\"ecl-timeline__content\">\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        </div>\n    </div>\n}\n\n<ng-template #content>\n    <ng-content></ng-content>\n</ng-template>\n", styles: ["ecl-timeline-item{display:list-item}\n"] }]
         }], propDecorators: { expandLabel: [{
@@ -312,10 +312,10 @@ class EclTimelineComponent extends ECLBaseDirective {
             this.isFirstExpandedLinkFocused = false;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: EclTimelineComponent, isStandalone: true, selector: "ecl-timeline", host: { properties: { "attr.role": "this.attrRole", "class": "this.cssClasses" } }, queries: [{ propertyName: "timelineItems", predicate: i0.forwardRef(() => EclTimelineItemComponent) }], 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.6", ngImport: i0, type: EclTimelineComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: EclTimelineComponent, isStandalone: true, selector: "ecl-timeline", host: { properties: { "attr.role": "this.attrRole", "class": "this.cssClasses" } }, queries: [{ propertyName: "timelineItems", predicate: i0.forwardRef(() => EclTimelineItemComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTimelineComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-timeline', template: "<ng-content></ng-content>\n", styles: [":host{display:block}\n"] }]
         }], propDecorators: { attrRole: [{
@@ -335,8 +335,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
  * @deprecated Use {@link EUI_ECL_TIMELINE} instead.
  */
 class EclTimelineModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineModule, imports: [EclTimelineComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTimelineModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.6", ngImport: i0, type: EclTimelineModule, imports: [EclTimelineComponent,
             EclTimelineItemComponent,
             EclTimelineItemTogglerComponent,
             EclTimelineItemLabelDirective,
@@ -345,9 +345,9 @@ class EclTimelineModule {
             EclTimelineItemTogglerComponent,
             EclTimelineItemLabelDirective,
             EclTimelineItemTitleDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineModule, imports: [EclTimelineItemComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTimelineModule, imports: [EclTimelineItemComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EclTimelineModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: EclTimelineModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [