npm - @eui/ecl - Versions diffs - 23.0.0-alpha.11 → 23.0.0-alpha.13 - Mend

@eui/ecl 23.0.0-alpha.11 → 23.0.0-alpha.13

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 (83) hide show

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

@@ -59,10 +59,10 @@ class EclPopoverToggleDirective extends ECLBaseDirective {
     getHostElement() {
         return this.hostElementRef.nativeElement;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclPopoverToggleDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EclPopoverToggleDirective, isStandalone: true, selector: "[eclPopoverToggle]", outputs: { click: "click" }, host: { listeners: { "mouseup": "onClick($event)", "keydown.enter": "onKeyboardActivate($event)", "keydown.space": "onKeyboardActivate($event)" }, properties: { "attr.aria-expanded": "this.isExpanded", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclPopoverToggleDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EclPopoverToggleDirective, isStandalone: true, selector: "[eclPopoverToggle]", outputs: { click: "click" }, host: { listeners: { "mouseup": "onClick($event)", "keydown.enter": "onKeyboardActivate($event)", "keydown.space": "onKeyboardActivate($event)" }, properties: { "attr.aria-expanded": "this.isExpanded", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclPopoverToggleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclPopoverToggleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclPopoverToggle]',
@@ -416,10 +416,10 @@ class EclPopoverComponent extends ECLBaseDirective {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclPopoverComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.5", type: EclPopoverComponent, isStandalone: true, selector: "ecl-popover", outputs: { openEvent: "openEvent", closeEvent: "closeEvent" }, host: { listeners: { "eclClickOutside": "onClickOutsidePopover()", "document:keydown.escape": "onEscapeKeydownHandler()", "document:scroll": "onDocumentScroll()" }, properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "eclPopoverToggle", first: true, predicate: EclPopoverToggleDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "eclPopoverContainerElement", first: true, predicate: ["container"], descendants: true, isSignal: true }, { propertyName: "eclPopoverScrollableElement", first: true, predicate: ["scrollable"], descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.ECLClickOutsideDirective, outputs: ["eclClickOutside", "eclClickOutside"] }], ngImport: i0, template: "<ng-content select=\"[eclPopoverToggle]\"></ng-content>\n\n<div #container class=\"ecl-popover__container\" [hidden]=\"isHidden\"\n    [attr.id]=\"popoverToggleAriaControls\">\n    <div #scrollable class=\"ecl-popover__scrollable\">\n        <button eclButton variant=\"tertiary\" (click)=\"doClose()\" class=\"ecl-popover__close\" isIconOnly type=\"button\">\n            <span eclButtonLabel>Close</span>\n            <ecl-icon icon=\"close\" size=\"m\"></ecl-icon>\n        </button>\n        <ng-content select=\"[eclPopoverContent]\"></ng-content>\n    </div>\n</div>\n", dependencies: [{ 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: "component", type: i3.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclPopoverComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.2", type: EclPopoverComponent, isStandalone: true, selector: "ecl-popover", outputs: { openEvent: "openEvent", closeEvent: "closeEvent" }, host: { listeners: { "eclClickOutside": "onClickOutsidePopover()", "document:keydown.escape": "onEscapeKeydownHandler()", "document:scroll": "onDocumentScroll()" }, properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "eclPopoverToggle", first: true, predicate: EclPopoverToggleDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "eclPopoverContainerElement", first: true, predicate: ["container"], descendants: true, isSignal: true }, { propertyName: "eclPopoverScrollableElement", first: true, predicate: ["scrollable"], descendants: true, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.ECLClickOutsideDirective, outputs: ["eclClickOutside", "eclClickOutside"] }], ngImport: i0, template: "<ng-content select=\"[eclPopoverToggle]\"></ng-content>\n\n<div #container class=\"ecl-popover__container\" [hidden]=\"isHidden\"\n    [attr.id]=\"popoverToggleAriaControls\">\n    <div #scrollable class=\"ecl-popover__scrollable\">\n        <button eclButton variant=\"tertiary\" (click)=\"doClose()\" class=\"ecl-popover__close\" isIconOnly type=\"button\">\n            <span eclButtonLabel>Close</span>\n            <ecl-icon icon=\"close\" size=\"m\"></ecl-icon>\n        </button>\n        <ng-content select=\"[eclPopoverContent]\"></ng-content>\n    </div>\n</div>\n", dependencies: [{ 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: "component", type: i3.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclPopoverComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclPopoverComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-popover', hostDirectives: [
                         {
@@ -456,10 +456,10 @@ class EclPopoverContentDirective extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-popover__content')].join(' ').trim();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclPopoverContentDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EclPopoverContentDirective, isStandalone: true, selector: "[eclPopoverContent]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclPopoverContentDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EclPopoverContentDirective, isStandalone: true, selector: "[eclPopoverContent]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclPopoverContentDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclPopoverContentDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclPopoverContent]',

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

@@ -11,10 +11,10 @@ class EclQuizListDirective {
     constructor() {
         this.hasClass = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclQuizListDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EclQuizListDirective, isStandalone: true, selector: "ol[eclQuizList]", host: { properties: { "class.ecl-quiz__list": "this.hasClass" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclQuizListDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EclQuizListDirective, isStandalone: true, selector: "ol[eclQuizList]", host: { properties: { "class.ecl-quiz__list": "this.hasClass" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclQuizListDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclQuizListDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ol[eclQuizList]',
@@ -256,10 +256,10 @@ class EclQuizCardComponent extends ECLBaseDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclQuizCardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EclQuizCardComponent, isStandalone: true, selector: "li[eclQuizCard]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, question: { classPropertyName: "question", publicName: "question", isSignal: true, isRequired: false, transformFunction: null }, answer: { classPropertyName: "answer", publicName: "answer", isSignal: true, isRequired: false, transformFunction: null }, answerTitle: { classPropertyName: "answerTitle", publicName: "answerTitle", isSignal: true, isRequired: false, transformFunction: null }, category: { classPropertyName: "category", publicName: "category", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cardFlip: "cardFlip" }, host: { listeners: { "click": "onClick()", "keydown": "onKeydown($event)" }, properties: { "attr.id": "id()", "attr.aria-labelledby": "questionId()", "class": "cssClasses", "attr.tabindex": "tabIndex", "style.transform": "styleTransform" } }, viewQueries: [{ propertyName: "frontElementRef", first: true, predicate: ["frontElement"], descendants: true, isSignal: true }, { propertyName: "backElementRef", first: true, predicate: ["backElement"], descendants: true, isSignal: true }, { propertyName: "questionElementRef", first: true, predicate: ["questionElement"], descendants: true, isSignal: true }, { propertyName: "answerElementRef", first: true, predicate: ["answerElement"], descendants: true, isSignal: true }, { propertyName: "contentElementRef", first: true, predicate: ["contentElement"], descendants: true, isSignal: true }, { propertyName: "categorySuccessRef", first: true, predicate: ["categorySuccess"], descendants: true, isSignal: true }, { propertyName: "categoryErrorRef", first: true, predicate: ["categoryError"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<article class=\"ecl-quiz-card__content\" #contentElement>\n    <!-- Front face -->\n    <div class=\"ecl-quiz-card__front\" #frontElement [hidden]=\"isFlipped()\" [inert]=\"isFlipped()\">\n        <div class=\"ecl-quiz-card__header\">\n            <div class=\"ecl-quiz-card__icon\">\n                <ecl-icon [icon]=\"getIconName()\" [size]=\"getIconSize()\" iconSet=\"phosphor\">\n                </ecl-icon>\n            </div>\n            @if (category()) {\n            <span class=\"ecl-quiz-card__category\">{{ category() }}</span>\n            }\n        </div>\n\n        @if (variant === 'reveal') {\n        <div class=\"ecl-quiz-card__question\" [id]=\"questionId()\" #questionElement>{{ question() }}</div>\n        <!-- Reveal variant: flip label -->\n        <div class=\"ecl-quiz-card__flip\">\n            {{ 'ecl.quiz.REVEAL-ANSWER' | translate }}\n            <ecl-icon iconSet=\"phosphor\" icon=\"arrow-clockwise\" size=\"m\"></ecl-icon>\n        </div>\n        } @else {\n        <!-- Poll variant: options -->\n        <fieldset [attr.aria-describedby]=\"isFirstCard() ? id() + '-skip-instructions' : null\">\n            <legend class=\"ecl-quiz-card__question\" [id]=\"questionId()\" #questionElement>{{ question() }}</legend>\n            <ol class=\"ecl-quiz-card__options\" type=\"A\">\n                @for (option of options(); let i = $index; track i) {\n                <li class=\"ecl-quiz-card__option\" [attr.data-match]=\"option.match\" (mouseup)=\"onOptionClick(i)\">\n                    <label class=\"ecl-quiz-card__label\">\n                        <input type=\"radio\" [name]=\"id() + '-options'\" [attr.data-match]=\"option.match\"\n                            [attr.tabindex]=\"isFlipped() ? -1 : null\" (keydown)=\"onOptionKeydown($event, i)\">\n                        {{ option.text }}</label>\n                    @if (i === 0 && isFirstCard()) {\n                    <span class=\"ecl-quiz__skip\" [id]=\"id() + '-skip-instructions'\">{{ 'ecl.quiz.SKIP-INSTRUCTIONS' |\n                        translate }}</span>\n                    }\n                </li>\n                }\n            </ol>\n        </fieldset>\n        }\n    </div>\n\n    <!-- Back face -->\n    <div class=\"ecl-quiz-card__back\" #backElement [hidden]=\"!isFlipped()\" [inert]=\"!isFlipped()\" style\n        [class.ecl-quiz-card--correct]=\"variant === 'poll' && isCorrect() === true\">\n        <div class=\"ecl-quiz-card__header\">\n            @if (variant === 'reveal') {\n            <div class=\"ecl-quiz-card__icon\">\n                <ecl-icon [icon]=\"getIconName()\" [size]=\"getIconSize()\" iconSet=\"phosphor\">\n                </ecl-icon>\n            </div>\n            } @else {\n            <!-- Poll variant: success/error icons and category labels -->\n            <div class=\"ecl-quiz-card__icon\">\n                <ecl-icon icon=\"check-circle\" iconSet=\"phosphor\" size=\"2xl\" class=\"ecl-quiz-card__icon--success\">\n                </ecl-icon>\n                <ecl-icon icon=\"x-circle\" size=\"2xl\" iconSet=\"phosphor\" class=\"ecl-quiz-card__icon--error\">\n                </ecl-icon>\n            </div>\n            <span #categorySuccess class=\"ecl-quiz-card__category ecl-quiz-card__category--success\"\n                [attr.tabindex]=\"(allCardsFlipped() || categoryHasFocus()) && isCorrect() === true ? 0 : -1\"\n                (blur)=\"onCategoryBlur()\">{{\n                'ecl.quiz.CORRECT' | translate }}</span>\n            <span #categoryError class=\"ecl-quiz-card__category ecl-quiz-card__category--error\"\n                [attr.tabindex]=\"(allCardsFlipped() || categoryHasFocus()) && isCorrect() === false ? 0 : -1\"\n                (blur)=\"onCategoryBlur()\">{{\n                'ecl.quiz.INCORRECT' | translate }}</span>\n            <span class=\"ecl-quiz-card__sr-status\" role=\"status\" aria-atomic=\"true\">{{ isFlipped() ? (isCorrect() ===\n                true ? ('ecl.quiz.CORRECT' | translate) : ('ecl.quiz.INCORRECT' | translate)) : '' }}</span>\n            }\n        </div>\n\n        <div class=\"ecl-quiz-card__answer\" [id]=\"answerId()\" #answerElement>\n            @if (answerTitle()) {\n            <div class=\"ecl-quiz-card__answer-title\">{{ answerTitle() }}</div>\n            }\n            {{ answer() }}\n        </div>\n\n        @if (variant === 'reveal') {\n        <!-- Reveal variant: go back label -->\n        <div class=\"ecl-quiz-card__flip\">\n            {{ 'ecl.quiz.FLIP-BACK' | translate }}\n            <ecl-icon icon=\"arrow-clockwise\" size=\"m\" iconSet=\"phosphor\"></ecl-icon>\n        </div>\n        } @else {\n        <!-- Poll variant: options list on back (showing selected state) -->\n        <ol class=\"ecl-quiz-card__options\" type=\"A\">\n            @for (option of options(); let i = $index; track i) {\n            <li class=\"ecl-quiz-card__option\" [class.ecl-quiz-card__option--selected]=\"selectedOptionIndex() === i\"\n                [attr.data-match]=\"option.match\">\n                @if (selectedOptionIndex() === i) {\n                    @if (!option.match) {\n                        <span class=\"ecl-quiz-card__option-assistive-label\">{{ 'ecl.quiz.YOUR-INCORRECT-ANSWER' | translate }}</span>\n                    }\n                    @if (option.match) {\n                        <span class=\"ecl-quiz-card__option-assistive-label\">{{ 'ecl.quiz.YOUR-CORRECT-ANSWER' | translate }}</span>\n                    }\n                } @else if (option.match) {\n                    <span class=\"ecl-quiz-card__option-assistive-label\">{{ 'ecl.quiz.CORRECT-ANSWER' | translate }}</span>\n                }\n                {{ option.text }}\n                @if (selectedOptionIndex() === i && !option.match) {\n                    <span class=\"ecl-quiz-card__option-icon\">\n                        <ecl-icon icon=\"x-circle\" size=\"s\" iconSet=\"phosphor\"\n                            class=\"ecl-quiz-card__option-icon--error\"></ecl-icon>\n                    </span>\n                }\n                @if (option.match) {\n                    <span class=\"ecl-quiz-card__option-icon\">\n                        <ecl-icon icon=\"check-circle\" size=\"s\" iconSet=\"phosphor\"\n                            class=\"ecl-quiz-card__option-icon--success\"></ecl-icon>\n                    </span>\n                }\n            </li>\n            }\n        </ol>\n        }\n    </div>\n</article>", dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclQuizCardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EclQuizCardComponent, isStandalone: true, selector: "li[eclQuizCard]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, question: { classPropertyName: "question", publicName: "question", isSignal: true, isRequired: false, transformFunction: null }, answer: { classPropertyName: "answer", publicName: "answer", isSignal: true, isRequired: false, transformFunction: null }, answerTitle: { classPropertyName: "answerTitle", publicName: "answerTitle", isSignal: true, isRequired: false, transformFunction: null }, category: { classPropertyName: "category", publicName: "category", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconSize: { classPropertyName: "iconSize", publicName: "iconSize", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cardFlip: "cardFlip" }, host: { listeners: { "click": "onClick()", "keydown": "onKeydown($event)" }, properties: { "attr.id": "id()", "attr.aria-labelledby": "questionId()", "class": "cssClasses", "attr.tabindex": "tabIndex", "style.transform": "styleTransform" } }, viewQueries: [{ propertyName: "frontElementRef", first: true, predicate: ["frontElement"], descendants: true, isSignal: true }, { propertyName: "backElementRef", first: true, predicate: ["backElement"], descendants: true, isSignal: true }, { propertyName: "questionElementRef", first: true, predicate: ["questionElement"], descendants: true, isSignal: true }, { propertyName: "answerElementRef", first: true, predicate: ["answerElement"], descendants: true, isSignal: true }, { propertyName: "contentElementRef", first: true, predicate: ["contentElement"], descendants: true, isSignal: true }, { propertyName: "categorySuccessRef", first: true, predicate: ["categorySuccess"], descendants: true, isSignal: true }, { propertyName: "categoryErrorRef", first: true, predicate: ["categoryError"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<article class=\"ecl-quiz-card__content\" #contentElement>\n    <!-- Front face -->\n    <div class=\"ecl-quiz-card__front\" #frontElement [hidden]=\"isFlipped()\" [inert]=\"isFlipped()\">\n        <div class=\"ecl-quiz-card__header\">\n            <div class=\"ecl-quiz-card__icon\">\n                <ecl-icon [icon]=\"getIconName()\" [size]=\"getIconSize()\" iconSet=\"phosphor\">\n                </ecl-icon>\n            </div>\n            @if (category()) {\n            <span class=\"ecl-quiz-card__category\">{{ category() }}</span>\n            }\n        </div>\n\n        @if (variant === 'reveal') {\n        <div class=\"ecl-quiz-card__question\" [id]=\"questionId()\" #questionElement>{{ question() }}</div>\n        <!-- Reveal variant: flip label -->\n        <div class=\"ecl-quiz-card__flip\">\n            {{ 'ecl.quiz.REVEAL-ANSWER' | translate }}\n            <ecl-icon iconSet=\"phosphor\" icon=\"arrow-clockwise\" size=\"m\"></ecl-icon>\n        </div>\n        } @else {\n        <!-- Poll variant: options -->\n        <fieldset [attr.aria-describedby]=\"isFirstCard() ? id() + '-skip-instructions' : null\">\n            <legend class=\"ecl-quiz-card__question\" [id]=\"questionId()\" #questionElement>{{ question() }}</legend>\n            <ol class=\"ecl-quiz-card__options\" type=\"A\">\n                @for (option of options(); let i = $index; track i) {\n                <li class=\"ecl-quiz-card__option\" [attr.data-match]=\"option.match\" (mouseup)=\"onOptionClick(i)\">\n                    <label class=\"ecl-quiz-card__label\">\n                        <input type=\"radio\" [name]=\"id() + '-options'\" [attr.data-match]=\"option.match\"\n                            [attr.tabindex]=\"isFlipped() ? -1 : null\" (keydown)=\"onOptionKeydown($event, i)\">\n                        {{ option.text }}</label>\n                    @if (i === 0 && isFirstCard()) {\n                    <span class=\"ecl-quiz__skip\" [id]=\"id() + '-skip-instructions'\">{{ 'ecl.quiz.SKIP-INSTRUCTIONS' |\n                        translate }}</span>\n                    }\n                </li>\n                }\n            </ol>\n        </fieldset>\n        }\n    </div>\n\n    <!-- Back face -->\n    <div class=\"ecl-quiz-card__back\" #backElement [hidden]=\"!isFlipped()\" [inert]=\"!isFlipped()\" style\n        [class.ecl-quiz-card--correct]=\"variant === 'poll' && isCorrect() === true\">\n        <div class=\"ecl-quiz-card__header\">\n            @if (variant === 'reveal') {\n            <div class=\"ecl-quiz-card__icon\">\n                <ecl-icon [icon]=\"getIconName()\" [size]=\"getIconSize()\" iconSet=\"phosphor\">\n                </ecl-icon>\n            </div>\n            } @else {\n            <!-- Poll variant: success/error icons and category labels -->\n            <div class=\"ecl-quiz-card__icon\">\n                <ecl-icon icon=\"check-circle\" iconSet=\"phosphor\" size=\"2xl\" class=\"ecl-quiz-card__icon--success\">\n                </ecl-icon>\n                <ecl-icon icon=\"x-circle\" size=\"2xl\" iconSet=\"phosphor\" class=\"ecl-quiz-card__icon--error\">\n                </ecl-icon>\n            </div>\n            <span #categorySuccess class=\"ecl-quiz-card__category ecl-quiz-card__category--success\"\n                [attr.tabindex]=\"(allCardsFlipped() || categoryHasFocus()) && isCorrect() === true ? 0 : -1\"\n                (blur)=\"onCategoryBlur()\">{{\n                'ecl.quiz.CORRECT' | translate }}</span>\n            <span #categoryError class=\"ecl-quiz-card__category ecl-quiz-card__category--error\"\n                [attr.tabindex]=\"(allCardsFlipped() || categoryHasFocus()) && isCorrect() === false ? 0 : -1\"\n                (blur)=\"onCategoryBlur()\">{{\n                'ecl.quiz.INCORRECT' | translate }}</span>\n            <span class=\"ecl-quiz-card__sr-status\" role=\"status\" aria-atomic=\"true\">{{ isFlipped() ? (isCorrect() ===\n                true ? ('ecl.quiz.CORRECT' | translate) : ('ecl.quiz.INCORRECT' | translate)) : '' }}</span>\n            }\n        </div>\n\n        <div class=\"ecl-quiz-card__answer\" [id]=\"answerId()\" #answerElement>\n            @if (answerTitle()) {\n            <div class=\"ecl-quiz-card__answer-title\">{{ answerTitle() }}</div>\n            }\n            {{ answer() }}\n        </div>\n\n        @if (variant === 'reveal') {\n        <!-- Reveal variant: go back label -->\n        <div class=\"ecl-quiz-card__flip\">\n            {{ 'ecl.quiz.FLIP-BACK' | translate }}\n            <ecl-icon icon=\"arrow-clockwise\" size=\"m\" iconSet=\"phosphor\"></ecl-icon>\n        </div>\n        } @else {\n        <!-- Poll variant: options list on back (showing selected state) -->\n        <ol class=\"ecl-quiz-card__options\" type=\"A\">\n            @for (option of options(); let i = $index; track i) {\n            <li class=\"ecl-quiz-card__option\" [class.ecl-quiz-card__option--selected]=\"selectedOptionIndex() === i\"\n                [attr.data-match]=\"option.match\">\n                @if (selectedOptionIndex() === i) {\n                    @if (!option.match) {\n                        <span class=\"ecl-quiz-card__option-assistive-label\">{{ 'ecl.quiz.YOUR-INCORRECT-ANSWER' | translate }}</span>\n                    }\n                    @if (option.match) {\n                        <span class=\"ecl-quiz-card__option-assistive-label\">{{ 'ecl.quiz.YOUR-CORRECT-ANSWER' | translate }}</span>\n                    }\n                } @else if (option.match) {\n                    <span class=\"ecl-quiz-card__option-assistive-label\">{{ 'ecl.quiz.CORRECT-ANSWER' | translate }}</span>\n                }\n                {{ option.text }}\n                @if (selectedOptionIndex() === i && !option.match) {\n                    <span class=\"ecl-quiz-card__option-icon\">\n                        <ecl-icon icon=\"x-circle\" size=\"s\" iconSet=\"phosphor\"\n                            class=\"ecl-quiz-card__option-icon--error\"></ecl-icon>\n                    </span>\n                }\n                @if (option.match) {\n                    <span class=\"ecl-quiz-card__option-icon\">\n                        <ecl-icon icon=\"check-circle\" size=\"s\" iconSet=\"phosphor\"\n                            class=\"ecl-quiz-card__option-icon--success\"></ecl-icon>\n                    </span>\n                }\n            </li>\n            }\n        </ol>\n        }\n    </div>\n</article>", dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclQuizCardComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclQuizCardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'li[eclQuizCard]', host: {
                         '[attr.id]': 'id()',
@@ -633,10 +633,10 @@ class EclQuizComponent extends ECLBaseDirective {
             card.isFirstCard.set(index === 0);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclQuizComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EclQuizComponent, isStandalone: true, selector: "section[eclQuiz]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, eclTitle: { classPropertyName: "eclTitle", publicName: "eclTitle", isSignal: true, isRequired: false, transformFunction: null }, eclDescription: { classPropertyName: "eclDescription", publicName: "eclDescription", isSignal: true, isRequired: false, transformFunction: null }, isFullWidth: { classPropertyName: "isFullWidth", publicName: "isFullWidth", isSignal: true, isRequired: false, transformFunction: null }, hasBackground: { classPropertyName: "hasBackground", publicName: "hasBackground", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "keydown": "onKeydown($event)" }, properties: { "class": "cssClasses" } }, queries: [{ propertyName: "cards", predicate: i0.forwardRef(() => EclQuizCardComponent), descendants: true }], viewQueries: [{ propertyName: "emblaRef", first: true, predicate: EmblaCarouselDirective, descendants: true, isSignal: true }, { propertyName: "dotButtons", predicate: ["dotButton"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (eclTitle() || eclDescription()) {\n<div class=\"ecl-quiz__header\">\n    @if (eclTitle()) {\n    <div class=\"ecl-quiz__title\">{{ eclTitle() }}</div>\n    }\n    @if (eclDescription()) {\n    <div class=\"ecl-quiz__description\">{{ eclDescription() }}</div>\n    }\n</div>\n}\n\n<div class=\"ecl-quiz__viewport\" data-ecl-quiz-slider\n    role=\"region\"\n    aria-label=\"Quiz slider\"\n    aria-roledescription=\"carousel\"\n    emblaCarousel\n    [options]=\"emblaOptions\"\n    [subscribeToEvents]=\"subscribeToEvents\"\n    (emblaChange)=\"onEmblaChange($event)\">\n        \n    <ng-content></ng-content>\n</div>\n\n@if (showControls()) {\n<div class=\"ecl-quiz__pager\">\n    <button\n        class=\"ecl-quiz__prev\"\n        [disabled]=\"prevDisabled()\"\n        (click)=\"onPrevClick()\"\n        [attr.aria-label]=\"'ecl.quiz.SHOW-PREV-SLIDE' | translate\">\n        <ecl-icon icon=\"corner-arrow\" size=\"xs\" transform=\"rotate-270\"></ecl-icon>\n        <span class=\"ecl-quiz__prev-label\">\n            {{ 'ecl.quiz.PREVIOUS' | translate }}\n        </span>\n    </button>\n\n    <div class=\"ecl-quiz__dots\">\n        @for (dotIndex of getDotIndices(); track dotIndex) {\n        <button\n            #dotButton\n            class=\"ecl-quiz__dot\"\n            [class.ecl-quiz__dot--active]=\"dotIndex === activeIndex()\"\n            [class.is-prev]=\"dotIndex === activeIndex() - 1\"\n            [attr.aria-label]=\"getDotAriaLabel(dotIndex).key | translate: getDotAriaLabel(dotIndex).params\"\n            (click)=\"goTo(dotIndex)\">\n        </button>\n        }\n    </div>\n\n    <button\n        class=\"ecl-quiz__next\"\n        [disabled]=\"nextDisabled()\"\n        (click)=\"onNextClick()\"\n        [attr.aria-label]=\"'ecl.quiz.SHOW-NEXT-SLIDE' | translate\">\n        <span class=\"ecl-quiz__next-label\">\n            {{ 'ecl.quiz.NEXT' | translate }}\n        </span>\n        <ecl-icon icon=\"corner-arrow\" size=\"xs\" transform=\"rotate-90\"></ecl-icon>\n    </button>\n</div>\n\n<div class=\"ecl-quiz__counter\">{{ counterText() }}</div>\n}\n\n", dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "directive", type: EmblaCarouselDirective, selector: "[emblaCarousel]", inputs: ["options", "plugins", "subscribeToEvents", "eventsThrottleTime"], outputs: ["emblaChange"], exportAs: ["emblaCarousel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclQuizComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EclQuizComponent, isStandalone: true, selector: "section[eclQuiz]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, eclTitle: { classPropertyName: "eclTitle", publicName: "eclTitle", isSignal: true, isRequired: false, transformFunction: null }, eclDescription: { classPropertyName: "eclDescription", publicName: "eclDescription", isSignal: true, isRequired: false, transformFunction: null }, isFullWidth: { classPropertyName: "isFullWidth", publicName: "isFullWidth", isSignal: true, isRequired: false, transformFunction: null }, hasBackground: { classPropertyName: "hasBackground", publicName: "hasBackground", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "keydown": "onKeydown($event)" }, properties: { "class": "cssClasses" } }, queries: [{ propertyName: "cards", predicate: i0.forwardRef(() => EclQuizCardComponent), descendants: true }], viewQueries: [{ propertyName: "emblaRef", first: true, predicate: EmblaCarouselDirective, descendants: true, isSignal: true }, { propertyName: "dotButtons", predicate: ["dotButton"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (eclTitle() || eclDescription()) {\n<div class=\"ecl-quiz__header\">\n    @if (eclTitle()) {\n    <div class=\"ecl-quiz__title\">{{ eclTitle() }}</div>\n    }\n    @if (eclDescription()) {\n    <div class=\"ecl-quiz__description\">{{ eclDescription() }}</div>\n    }\n</div>\n}\n\n<div class=\"ecl-quiz__viewport\" data-ecl-quiz-slider\n    role=\"region\"\n    aria-label=\"Quiz slider\"\n    aria-roledescription=\"carousel\"\n    emblaCarousel\n    [options]=\"emblaOptions\"\n    [subscribeToEvents]=\"subscribeToEvents\"\n    (emblaChange)=\"onEmblaChange($event)\">\n        \n    <ng-content></ng-content>\n</div>\n\n@if (showControls()) {\n<div class=\"ecl-quiz__pager\">\n    <button\n        class=\"ecl-quiz__prev\"\n        [disabled]=\"prevDisabled()\"\n        (click)=\"onPrevClick()\"\n        [attr.aria-label]=\"'ecl.quiz.SHOW-PREV-SLIDE' | translate\">\n        <ecl-icon icon=\"corner-arrow\" size=\"xs\" transform=\"rotate-270\"></ecl-icon>\n        <span class=\"ecl-quiz__prev-label\">\n            {{ 'ecl.quiz.PREVIOUS' | translate }}\n        </span>\n    </button>\n\n    <div class=\"ecl-quiz__dots\">\n        @for (dotIndex of getDotIndices(); track dotIndex) {\n        <button\n            #dotButton\n            class=\"ecl-quiz__dot\"\n            [class.ecl-quiz__dot--active]=\"dotIndex === activeIndex()\"\n            [class.is-prev]=\"dotIndex === activeIndex() - 1\"\n            [attr.aria-label]=\"getDotAriaLabel(dotIndex).key | translate: getDotAriaLabel(dotIndex).params\"\n            (click)=\"goTo(dotIndex)\">\n        </button>\n        }\n    </div>\n\n    <button\n        class=\"ecl-quiz__next\"\n        [disabled]=\"nextDisabled()\"\n        (click)=\"onNextClick()\"\n        [attr.aria-label]=\"'ecl.quiz.SHOW-NEXT-SLIDE' | translate\">\n        <span class=\"ecl-quiz__next-label\">\n            {{ 'ecl.quiz.NEXT' | translate }}\n        </span>\n        <ecl-icon icon=\"corner-arrow\" size=\"xs\" transform=\"rotate-90\"></ecl-icon>\n    </button>\n</div>\n\n<div class=\"ecl-quiz__counter\">{{ counterText() }}</div>\n}\n\n", dependencies: [{ kind: "component", type: EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "directive", type: EmblaCarouselDirective, selector: "[emblaCarousel]", inputs: ["options", "plugins", "subscribeToEvents", "eventsThrottleTime"], outputs: ["emblaChange"], exportAs: ["emblaCarousel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclQuizComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclQuizComponent, decorators: [{
             type: Component,
             args: [{ selector: 'section[eclQuiz]', host: {
                         '[class]': 'cssClasses',

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

@@ -24,10 +24,10 @@ class EclRadioHelpComponent extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-radio__help')].join(' ').trim();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRadioHelpComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.0.5", type: EclRadioHelpComponent, isStandalone: true, selector: "[eclRadioHelp]", inputs: { isDisabled: ["isDisabled", "isDisabled", booleanAttribute] }, host: { properties: { "class.ecl-radio__help--disabled": "this.isDisabled", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRadioHelpComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.2", type: EclRadioHelpComponent, isStandalone: true, selector: "[eclRadioHelp]", inputs: { isDisabled: ["isDisabled", "isDisabled", booleanAttribute] }, host: { properties: { "class.ecl-radio__help--disabled": "this.isDisabled", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRadioHelpComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRadioHelpComponent, decorators: [{
             type: Component,
             args: [{ selector: '[eclRadioHelp]', template: "<ng-content></ng-content>\n" }]
         }], propDecorators: { isDisabled: [{
@@ -66,10 +66,10 @@ class EclRadioLabelComponent extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-radio__label')].join(' ').trim();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRadioLabelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.0.5", type: EclRadioLabelComponent, isStandalone: true, selector: "[eclRadioLabel]", inputs: { isInvalid: ["isInvalid", "isInvalid", booleanAttribute], isDisabled: ["isDisabled", "isDisabled", booleanAttribute] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<span class=\"ecl-radio__box\" [class.ecl-radio__box--disabled]=\"isDisabled\" [class.ecl-radio__box--invalid]=\"isInvalid\">\n    <span class=\"ecl-radio__box-inner\"></span>\n</span>\n\n<ng-content></ng-content>\n", encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRadioLabelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.2", type: EclRadioLabelComponent, isStandalone: true, selector: "[eclRadioLabel]", inputs: { isInvalid: ["isInvalid", "isInvalid", booleanAttribute], isDisabled: ["isDisabled", "isDisabled", booleanAttribute] }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<span class=\"ecl-radio__box\" [class.ecl-radio__box--disabled]=\"isDisabled\" [class.ecl-radio__box--invalid]=\"isInvalid\">\n    <span class=\"ecl-radio__box-inner\"></span>\n</span>\n\n<ng-content></ng-content>\n", encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRadioLabelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRadioLabelComponent, decorators: [{
             type: Component,
             args: [{ selector: '[eclRadioLabel]', encapsulation: ViewEncapsulation.None, template: "<span class=\"ecl-radio__box\" [class.ecl-radio__box--disabled]=\"isDisabled\" [class.ecl-radio__box--invalid]=\"isInvalid\">\n    <span class=\"ecl-radio__box-inner\"></span>\n</span>\n\n<ng-content></ng-content>\n" }]
         }], propDecorators: { isInvalid: [{
@@ -142,10 +142,10 @@ class EclRadioDirective extends ECLBaseDirective {
             eclRadioHelpComponent.isDisabled = this.isDisabled;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRadioDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "22.0.5", type: EclRadioDirective, isStandalone: true, selector: "[eclRadio]", inputs: { isBinary: { classPropertyName: "isBinary", publicName: "isBinary", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, isInvalid: { classPropertyName: "isInvalid", publicName: "isInvalid", isSignal: false, isRequired: false, transformFunction: booleanAttribute } }, host: { properties: { "class.ecl-radio--disabled": "this.isDisabled", "class.ecl-radio--invalid": "this.isInvalid", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclRadioLabelComponent", first: true, predicate: i0.forwardRef(() => EclRadioLabelComponent), descendants: true, isSignal: true }, { propertyName: "eclRadioHelpComponent", first: true, predicate: i0.forwardRef(() => EclRadioHelpComponent), descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRadioDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "22.1.2", type: EclRadioDirective, isStandalone: true, selector: "[eclRadio]", inputs: { isBinary: { classPropertyName: "isBinary", publicName: "isBinary", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, isInvalid: { classPropertyName: "isInvalid", publicName: "isInvalid", isSignal: false, isRequired: false, transformFunction: booleanAttribute } }, host: { properties: { "class.ecl-radio--disabled": "this.isDisabled", "class.ecl-radio--invalid": "this.isInvalid", "class": "this.cssClasses" } }, queries: [{ propertyName: "eclRadioLabelComponent", first: true, predicate: i0.forwardRef(() => EclRadioLabelComponent), descendants: true, isSignal: true }, { propertyName: "eclRadioHelpComponent", first: true, predicate: i0.forwardRef(() => EclRadioHelpComponent), descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRadioDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRadioDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[eclRadio]',
@@ -196,10 +196,10 @@ class EclRadioInputDirective extends ECLBaseDirective {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRadioInputDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.5", type: EclRadioInputDirective, isStandalone: true, selector: "input[eclRadioInput]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRadioInputDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.2", type: EclRadioInputDirective, isStandalone: true, selector: "input[eclRadioInput]", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRadioInputDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRadioInputDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'input[eclRadioInput]',

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

@@ -44,10 +44,10 @@ class EclRangeBubbleComponent extends ECLBaseDirective {
             this.isVisible() ? 'ecl-range__bubble--visible' : '',
         ].join(' ').trim();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRangeBubbleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: EclRangeBubbleComponent, isStandalone: true, selector: "ecl-range-bubble", host: { properties: { "style.left.px": "this.leftBinding", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<span class=\"ecl-range__value-bubble\">{{ value() }}</span>" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRangeBubbleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EclRangeBubbleComponent, isStandalone: true, selector: "ecl-range-bubble", host: { properties: { "style.left.px": "this.leftBinding", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<span class=\"ecl-range__value-bubble\">{{ value() }}</span>" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRangeBubbleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRangeBubbleComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-range-bubble', template: "<span class=\"ecl-range__value-bubble\">{{ value() }}</span>" }]
         }], propDecorators: { leftBinding: [{
@@ -86,10 +86,10 @@ class EclRangeValueComponent extends ECLBaseDirective {
     get cssClasses() {
         return [super.getCssClasses('ecl-range__value')].join(' ').trim();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRangeValueComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: EclRangeValueComponent, isStandalone: true, selector: "ecl-range-value", host: { properties: { "attr.id": "this.idBinding", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "{{ 'ecl.common.VALUE' | translate }}: <span class=\"ecl-range__value-current\"> {{ value() }} </span>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRangeValueComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.2", type: EclRangeValueComponent, isStandalone: true, selector: "ecl-range-value", host: { properties: { "attr.id": "this.idBinding", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "{{ 'ecl.common.VALUE' | translate }}: <span class=\"ecl-range__value-current\"> {{ value() }} </span>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRangeValueComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRangeValueComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-range-value', imports: [TranslatePipe], template: "{{ 'ecl.common.VALUE' | translate }}: <span class=\"ecl-range__value-current\"> {{ value() }} </span>\n", styles: [":host{display:block}\n"] }]
         }], propDecorators: { idBinding: [{
@@ -300,10 +300,10 @@ class EclRangeDirective extends ECLBaseDirective {
             this.rangeBubbleComponent.left.set(leftFromParent + valuePxPosition - halfLabelWidth - offset);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRangeDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.5", type: EclRangeDirective, isStandalone: true, selector: "input[eclRange]", inputs: { eclSize: { classPropertyName: "eclSize", publicName: "eclSize", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, rangeValueId: { classPropertyName: "rangeValueId", publicName: "rangeValueId", isSignal: true, isRequired: false, transformFunction: null }, isInvalid: { classPropertyName: "isInvalid", publicName: "isInvalid", isSignal: true, isRequired: false, transformFunction: null }, hasValueLabel: { classPropertyName: "hasValueLabel", publicName: "hasValueLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rangeChange: "rangeChange" }, host: { listeners: { "input": "onInput($any($event))" }, properties: { "class": "this.cssClasses", "class.ecl-range--invalid": "this.invalidState" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRangeDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.2", type: EclRangeDirective, isStandalone: true, selector: "input[eclRange]", inputs: { eclSize: { classPropertyName: "eclSize", publicName: "eclSize", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, rangeValueId: { classPropertyName: "rangeValueId", publicName: "rangeValueId", isSignal: true, isRequired: false, transformFunction: null }, isInvalid: { classPropertyName: "isInvalid", publicName: "isInvalid", isSignal: true, isRequired: false, transformFunction: null }, hasValueLabel: { classPropertyName: "hasValueLabel", publicName: "hasValueLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rangeChange: "rangeChange" }, host: { listeners: { "input": "onInput($any($event))" }, properties: { "class": "this.cssClasses", "class.ecl-range--invalid": "this.invalidState" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRangeDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRangeDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'input[eclRange]',

package/fesm2022/eui-ecl-components-ecl-rating-field.mjs CHANGED Viewed

@@ -111,10 +111,10 @@ class EclRatingFieldComponent extends ECLBaseDirective {
     registerOnTouched(fn) {
         this.onTouched = fn;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRatingFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EclRatingFieldComponent, isStandalone: true, selector: "ecl-rating-field", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, numberOfStars: { classPropertyName: "numberOfStars", publicName: "numberOfStars", isSignal: true, isRequired: false, transformFunction: null }, rating: { classPropertyName: "rating", publicName: "rating", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange", ratingChange: "ratingChange" }, host: { properties: { "attr.disabled": "disabled()", "class": "this.cssClasses" } }, providers: [ECL_RATINGFIELD_VALUE_ACCESSOR], usesInheritance: true, ngImport: i0, template: "@for(n of numbers;track n) {\n    <input\n        type=\"radio\"\n        id=\"{{ name() }}-{{ n }}\"\n        [name]=\"name()\"\n        class=\"ecl-rating-field__input\"\n        [value]=\"n\"\n        required=\"\"\n        [attr.checked]=\"currentRating() === n ? true : undefined\"\n        [attr.disabled]=\"disabled() ? true : undefined\"\n        (click)=\"onRadioClick(n)\" />\n    <label class=\"ecl-rating-field__label\" for=\"{{ name() }}-{{ n }}\">\n        <span class=\"ecl-rating-field__sr-label\">{{ n }} stars</span>\n        <ecl-icon icon=\"star-filled\" class=\"ecl-rating-field__icon-filled\" size=\"l\"> </ecl-icon>\n        <ecl-icon icon=\"star-outline\" class=\"ecl-rating-field__icon-outline\" size=\"l\"> </ecl-icon>\n    </label>\n}\n", dependencies: [{ kind: "component", type: i1.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRatingFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.2", type: EclRatingFieldComponent, isStandalone: true, selector: "ecl-rating-field", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, numberOfStars: { classPropertyName: "numberOfStars", publicName: "numberOfStars", isSignal: true, isRequired: false, transformFunction: null }, rating: { classPropertyName: "rating", publicName: "rating", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange", ratingChange: "ratingChange" }, host: { properties: { "attr.disabled": "disabled()", "class": "this.cssClasses" } }, providers: [ECL_RATINGFIELD_VALUE_ACCESSOR], usesInheritance: true, ngImport: i0, template: "@for(n of numbers;track n) {\n    <input\n        type=\"radio\"\n        id=\"{{ name() }}-{{ n }}\"\n        [name]=\"name()\"\n        class=\"ecl-rating-field__input\"\n        [value]=\"n\"\n        required=\"\"\n        [attr.checked]=\"currentRating() === n ? true : undefined\"\n        [attr.disabled]=\"disabled() ? true : undefined\"\n        (click)=\"onRadioClick(n)\" />\n    <label class=\"ecl-rating-field__label\" for=\"{{ name() }}-{{ n }}\">\n        <span class=\"ecl-rating-field__sr-label\">{{ n }} stars</span>\n        <ecl-icon icon=\"star-filled\" class=\"ecl-rating-field__icon-filled\" size=\"l\"> </ecl-icon>\n        <ecl-icon icon=\"star-outline\" class=\"ecl-rating-field__icon-outline\" size=\"l\"> </ecl-icon>\n    </label>\n}\n", dependencies: [{ kind: "component", type: i1.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclRatingFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclRatingFieldComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-rating-field', imports: [...EUI_ECL_ICON], providers: [ECL_RATINGFIELD_VALUE_ACCESSOR], host: {
                         '[attr.disabled]': 'disabled()',

package/fesm2022/eui-ecl-components-ecl-search-form.mjs CHANGED Viewed

@@ -100,10 +100,10 @@ class EclSearchFormComponent extends ECLBaseDirective {
     registerOnTouched(fn) {
         this.onTouched = fn;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclSearchFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: EclSearchFormComponent, isStandalone: true, selector: "ecl-search-form", inputs: { searchInputText: { classPropertyName: "searchInputText", publicName: "searchInputText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, searchButtonLabel: { classPropertyName: "searchButtonLabel", publicName: "searchButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, searchButtonIcon: { classPropertyName: "searchButtonIcon", publicName: "searchButtonIcon", isSignal: true, isRequired: false, transformFunction: null }, buttonExtraClassses: { classPropertyName: "buttonExtraClassses", publicName: "buttonExtraClassses", isSignal: true, isRequired: false, transformFunction: null }, inputExtraClassses: { classPropertyName: "inputExtraClassses", publicName: "inputExtraClassses", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { searchInputText: "searchInputTextChange", searchEvent: "searchEvent" }, host: { listeners: { "keydown.enter": "onEnterKeyDown($event)" }, properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, providers: [ECL_SEARCH_FORM_VALUE_ACCESSOR], usesInheritance: true, ngImport: i0, template: "<ecl-form-group>\n    <input\n        eclTextInput\n        [(ngModel)]=\"searchInputText\"\n        (ngModelChange)=\"onModelChange($event)\"\n        type=\"search\"\n        name=\"search-input\"\n        placeholder=\"{{ placeholder() || 'ecl.common.SEARCH' | translate }}\"\n        class=\"ecl-search-form__text-input {{inputExtraClassses()}}\" />\n</ecl-form-group>\n<button eclButton type=\"submit\" [variant]=\"eclThemeService.isECTheme() ? 'tertiary': 'primary'\" (click)=\"onSearchClick($event)\"\n    class=\"ecl-button--neutral ecl-search-form__button {{buttonExtraClassses()}}\" isIconOnly>\n    <ecl-icon [icon]=\"searchButtonIcon()\" size=\"xs\"></ecl-icon>\n    <span eclButtonLabel>\n        {{ searchButtonLabel() || 'ecl.common.SEARCH' | translate }}\n    </span>\n</button>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: "component", type: i3.EclFormGroupComponent, selector: "[eclFormGroup], ecl-form-group" }, { kind: "directive", type: i4.EclTextInputDirective, selector: "input[eclTextInput]", inputs: ["type", "eclSize", "isInvalid"] }, { kind: "component", type: i5.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclSearchFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.2", type: EclSearchFormComponent, isStandalone: true, selector: "ecl-search-form", inputs: { searchInputText: { classPropertyName: "searchInputText", publicName: "searchInputText", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, searchButtonLabel: { classPropertyName: "searchButtonLabel", publicName: "searchButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, searchButtonIcon: { classPropertyName: "searchButtonIcon", publicName: "searchButtonIcon", isSignal: true, isRequired: false, transformFunction: null }, buttonExtraClassses: { classPropertyName: "buttonExtraClassses", publicName: "buttonExtraClassses", isSignal: true, isRequired: false, transformFunction: null }, inputExtraClassses: { classPropertyName: "inputExtraClassses", publicName: "inputExtraClassses", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { searchInputText: "searchInputTextChange", searchEvent: "searchEvent" }, host: { listeners: { "keydown.enter": "onEnterKeyDown($event)" }, properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, providers: [ECL_SEARCH_FORM_VALUE_ACCESSOR], usesInheritance: true, ngImport: i0, template: "<ecl-form-group>\n    <input\n        eclTextInput\n        [(ngModel)]=\"searchInputText\"\n        (ngModelChange)=\"onModelChange($event)\"\n        type=\"search\"\n        name=\"search-input\"\n        placeholder=\"{{ placeholder() || 'ecl.common.SEARCH' | translate }}\"\n        class=\"ecl-search-form__text-input {{inputExtraClassses()}}\" />\n</ecl-form-group>\n<button eclButton type=\"submit\" [variant]=\"eclThemeService.isECTheme() ? 'tertiary': 'primary'\" (click)=\"onSearchClick($event)\"\n    class=\"ecl-button--neutral ecl-search-form__button {{buttonExtraClassses()}}\" isIconOnly>\n    <ecl-icon [icon]=\"searchButtonIcon()\" size=\"xs\"></ecl-icon>\n    <span eclButtonLabel>\n        {{ searchButtonLabel() || 'ecl.common.SEARCH' | translate }}\n    </span>\n</button>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: "component", type: i3.EclFormGroupComponent, selector: "[eclFormGroup], ecl-form-group" }, { kind: "directive", type: i4.EclTextInputDirective, selector: "input[eclTextInput]", inputs: ["type", "eclSize", "isInvalid"] }, { kind: "component", type: i5.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclSearchFormComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclSearchFormComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-search-form', imports: [TranslatePipe, FormsModule, ...EUI_ECL_BUTTON, ...EUI_ECL_FORM_GROUP, ...EUI_ECL_TEXT_INPUT, ...EUI_ECL_ICON], providers: [ECL_SEARCH_FORM_VALUE_ACCESSOR], template: "<ecl-form-group>\n    <input\n        eclTextInput\n        [(ngModel)]=\"searchInputText\"\n        (ngModelChange)=\"onModelChange($event)\"\n        type=\"search\"\n        name=\"search-input\"\n        placeholder=\"{{ placeholder() || 'ecl.common.SEARCH' | translate }}\"\n        class=\"ecl-search-form__text-input {{inputExtraClassses()}}\" />\n</ecl-form-group>\n<button eclButton type=\"submit\" [variant]=\"eclThemeService.isECTheme() ? 'tertiary': 'primary'\" (click)=\"onSearchClick($event)\"\n    class=\"ecl-button--neutral ecl-search-form__button {{buttonExtraClassses()}}\" isIconOnly>\n    <ecl-icon [icon]=\"searchButtonIcon()\" size=\"xs\"></ecl-icon>\n    <span eclButtonLabel>\n        {{ searchButtonLabel() || 'ecl.common.SEARCH' | translate }}\n    </span>\n</button>\n" }]
         }], propDecorators: { searchInputText: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchInputText", required: false }] }, { type: i0.Output, args: ["searchInputTextChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], searchButtonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchButtonLabel", required: false }] }], searchButtonIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchButtonIcon", required: false }] }], buttonExtraClassses: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonExtraClassses", required: false }] }], inputExtraClassses: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputExtraClassses", required: false }] }], cssClasses: [{

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

@@ -59,10 +59,10 @@ class EclSelectContainerComponent extends ECLBaseDirective {
             return this.ICON_SIZE_EU;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclSelectContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: EclSelectContainerComponent, isStandalone: true, selector: "ecl-select-container", inputs: { eclSize: { classPropertyName: "eclSize", publicName: "eclSize", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, isInvalid: { classPropertyName: "isInvalid", publicName: "isInvalid", isSignal: true, isRequired: false, transformFunction: null }, toggleLabel: { classPropertyName: "toggleLabel", publicName: "toggleLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { eclSize: "eclSizeChange", disabled: "disabledChange", isInvalid: "isInvalidChange", toggleLabel: "toggleLabelChange" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-select__icon\">\n    <button eclButton variant=\"tertiary\" tabindex=\"-1\" isIconOnly>\n        <span eclButtonLabel>{{ toggleLabel() || 'ecl.multiselect.TOGGLE.DROPDOWN' | translate }}</span>\n        <ecl-icon icon=\"corner-arrow\" [size]=\"iconSize\" transform=\"rotate-180\"></ecl-icon>\n    </button>\n</div>\n", dependencies: [{ kind: "component", type: i1.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { 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: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclSelectContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.2", type: EclSelectContainerComponent, isStandalone: true, selector: "ecl-select-container", inputs: { eclSize: { classPropertyName: "eclSize", publicName: "eclSize", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, isInvalid: { classPropertyName: "isInvalid", publicName: "isInvalid", isSignal: true, isRequired: false, transformFunction: null }, toggleLabel: { classPropertyName: "toggleLabel", publicName: "toggleLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { eclSize: "eclSizeChange", disabled: "disabledChange", isInvalid: "isInvalidChange", toggleLabel: "toggleLabelChange" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-select__icon\">\n    <button eclButton variant=\"tertiary\" tabindex=\"-1\" isIconOnly>\n        <span eclButtonLabel>{{ toggleLabel() || 'ecl.multiselect.TOGGLE.DROPDOWN' | translate }}</span>\n        <ecl-icon icon=\"corner-arrow\" [size]=\"iconSize\" transform=\"rotate-180\"></ecl-icon>\n    </button>\n</div>\n", dependencies: [{ kind: "component", type: i1.EclIconComponent, selector: "ecl-icon", inputs: ["iconSet", "icon", "size", "color", "transform", "ariaLabelledby", "role", "title", "ariaHidden", "focusable", "isFlipHorizontal"] }, { 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: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclSelectContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclSelectContainerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ecl-select-container', imports: [
                         ...EUI_ECL_ICON,
@@ -203,10 +203,10 @@ class EclSelectDirective extends ECLBaseDirective {
             });
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclSelectDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.5", type: EclSelectDirective, isStandalone: true, selector: "select[eclSelect]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, isInvalid: { classPropertyName: "isInvalid", publicName: "isInvalid", isSignal: true, isRequired: false, transformFunction: null }, toggleLabel: { classPropertyName: "toggleLabel", publicName: "toggleLabel", isSignal: true, isRequired: false, transformFunction: null }, eclSize: { classPropertyName: "eclSize", publicName: "eclSize", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.disabled": "this.isDisabled", "class": "this.cssClasses", "class.ecl-select--invalid": "this.isInvalidState" } }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclSelectDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.2", type: EclSelectDirective, isStandalone: true, selector: "select[eclSelect]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, isInvalid: { classPropertyName: "isInvalid", publicName: "isInvalid", isSignal: true, isRequired: false, transformFunction: null }, toggleLabel: { classPropertyName: "toggleLabel", publicName: "toggleLabel", isSignal: true, isRequired: false, transformFunction: null }, eclSize: { classPropertyName: "eclSize", publicName: "eclSize", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.disabled": "this.isDisabled", "class": "this.cssClasses", "class.ecl-select--invalid": "this.isInvalidState" } }, usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclSelectDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.2", ngImport: i0, type: EclSelectDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'select[eclSelect]' }]
         }], propDecorators: { disabled: [{