@eui/mobile-core 17.0.0-next.2 → 17.0.0-next.4

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 (40) hide show
  1. package/docs/components/EuimAlertMessageComponent.html +1 -1
  2. package/docs/components/EuimChipSelectorComponent.html +177 -1
  3. package/docs/components/EuimEmptyListPlaceholderComponent.html +1 -1
  4. package/docs/components/EuimLanguageListComponent.html +1 -1
  5. package/docs/components/EuimMediaHeaderComponent.html +1 -1
  6. package/docs/components/EuimMenuComponent.html +1 -1
  7. package/docs/components/EuimMultiselectComponent.html +1 -1
  8. package/docs/components/EuimMultiselectToolbarComponent.html +1 -1
  9. package/docs/components/EuimPdfWrapperComponent.html +1 -1
  10. package/docs/components/EuimSkeletonListComponent.html +1 -1
  11. package/docs/components/EuimSkeletonListItemComponent.html +1 -1
  12. package/docs/components/EuimSliderComponent.html +1 -1
  13. package/docs/components/EuimSliderInfoScreenComponent.html +1 -1
  14. package/docs/dependencies.html +6 -2
  15. package/docs/directives/EuimChipSelectorItemDirective.html +23 -0
  16. package/docs/js/search/search_index.js +2 -2
  17. package/esm2022/lib/components/euim-alert-message/euim-alert-messsage.component.mjs +5 -6
  18. package/esm2022/lib/components/euim-chip-selector/euim-chip-selector-item/euim-chip-selector-item.directive.mjs +2 -1
  19. package/esm2022/lib/components/euim-chip-selector/euim-chip-selector.component.mjs +82 -23
  20. package/esm2022/lib/components/euim-empty-list-placeholder/euim-empty-list-placeholder.component.mjs +5 -6
  21. package/esm2022/lib/components/euim-fieldset/euim-fieldset.component.mjs +2 -2
  22. package/esm2022/lib/components/euim-media-header/euim-media-header.component.mjs +3 -4
  23. package/esm2022/lib/components/euim-menu/euim-menu.component.mjs +6 -7
  24. package/esm2022/lib/components/euim-multiselect/euim-multiselect-toolbar/euim-multiselect-toolbar.component.mjs +7 -8
  25. package/esm2022/lib/components/euim-multiselect/euim-multiselect.component.mjs +4 -5
  26. package/esm2022/lib/components/euim-pdf-wrapper/euim-pdf-wrapper.component.mjs +7 -8
  27. package/esm2022/lib/components/euim-skeleton-list/euim-skeleton-list.component.mjs +3 -3
  28. package/esm2022/lib/components/euim-skeleton-list-item/euim-skeleton-list-item.component.mjs +4 -5
  29. package/esm2022/lib/components/euim-slider/euim-slider.component.mjs +3 -3
  30. package/esm2022/lib/components/euim-slider-info-screen/euim-slider-info-screen.component.mjs +3 -3
  31. package/esm2022/lib/components/euim-spinner/euim-spinner.component.mjs +2 -2
  32. package/esm2022/lib/components/layout/euim-info-screen/euim-info-screen.component.mjs +2 -2
  33. package/esm2022/lib/components/layout/euim-language-selector/euim-language-list.component.mjs +6 -7
  34. package/fesm2022/eui-mobile-core.mjs +119 -58
  35. package/fesm2022/eui-mobile-core.mjs.map +1 -1
  36. package/lib/components/euim-chip-selector/euim-chip-selector-item/euim-chip-selector-item.directive.d.ts +1 -0
  37. package/lib/components/euim-chip-selector/euim-chip-selector-item/euim-chip-selector-item.directive.d.ts.map +1 -1
  38. package/lib/components/euim-chip-selector/euim-chip-selector.component.d.ts +9 -2
  39. package/lib/components/euim-chip-selector/euim-chip-selector.component.d.ts.map +1 -1
  40. package/package.json +1 -1
@@ -4,21 +4,21 @@ import * as i0 from '@angular/core';
4
4
  import { Injectable, Directive, Input, Component, ViewEncapsulation, ChangeDetectionStrategy, HostBinding, NgModule, EventEmitter, Output, ContentChildren, ViewChild, HostListener, ContentChild } from '@angular/core';
5
5
  import { BehaviorSubject, Subject } from 'rxjs';
6
6
  import { __decorate } from 'tslib';
7
- import * as i2 from '@angular/common';
7
+ import * as i2$1 from '@angular/common';
8
8
  import { CommonModule } from '@angular/common';
9
9
  import * as i1 from '@ionic/angular';
10
10
  import { IonicModule } from '@ionic/angular';
11
11
  import * as i1$2 from '@angular/router';
12
12
  import { RouterModule, NavigationEnd } from '@angular/router';
13
13
  import { EclLanguageService, EclDefaultLanguageService } from '@eui/ecl';
14
- import * as i2$1 from '@eui/core';
14
+ import * as i2 from '@eui/core';
15
15
  import { EuiEuLanguages } from '@eui/core';
16
16
  import { takeUntil, distinctUntilKeyChanged } from 'rxjs/operators';
17
17
  import * as i1$1 from '@ngx-translate/core';
18
18
  import { TranslateModule } from '@ngx-translate/core';
19
- import * as i3 from 'ng2-pdf-viewer';
19
+ import * as i2$2 from 'ng2-pdf-viewer';
20
20
  import { PdfViewerModule } from 'ng2-pdf-viewer';
21
- import * as i4 from '@meddv/ngx-pinch-zoom';
21
+ import * as i3 from '@meddv/ngx-pinch-zoom';
22
22
  import { PinchZoomModule } from '@meddv/ngx-pinch-zoom';
23
23
 
24
24
  const initialState = {
@@ -727,14 +727,14 @@ class EuimMenuComponent {
727
727
  return item.notification?.color === color;
728
728
  }
729
729
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMenuComponent, deps: [{ token: i1.NavController }], target: i0.ɵɵFactoryTarget.Component }); }
730
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimMenuComponent, selector: "euim-menu", inputs: { items: "items" }, outputs: { itemClick: "itemClick" }, ngImport: i0, template: "<ion-list>\n <ng-container *ngFor=\"let section of items\">\n <li class=\"euim-menu__section\">\n <ion-item-divider *ngIf=\"section.sectionName\">\n <p euimLabel [euimSizeS]=\"true\" [euimDefault]=\"true\">{{section.sectionName}}</p>\n </ion-item-divider>\n <ion-menu-toggle auto-hide=\"true\" *ngFor=\"let item of section.items; let j = index\">\n <ion-item (click)=\"onItemClick($event, j, item)\" *ngIf=\"item.label\"\n [lines]=\"item.lines ? item.lines : 'none'\" button [detail]=\"item.detailArrow\"\n class=\"euim-menu__section-item\">\n <euim-avatar-icon *ngIf=\"item.avatarColor\" size=\"s\" variant=\"rounded\" [color]=\"item.avatarColor\">\n <ion-icon *ngIf=\"item.icon\"\n [color]=\"item.iconColor\"\n [name]=\"item.icon\"></ion-icon>\n </euim-avatar-icon>\n <ion-icon *ngIf=\"item.icon && !item.avatarColor\"\n [color]=\"item.iconColor\"\n [name]=\"item.icon\"></ion-icon>\n <div>\n <p class=\"euim-menu__section-item-label\" euimLabel [euimSizeM]=\"true\" [euimDark]=\"true\">{{item.label}}</p>\n <p class=\"euim-menu__section-item-sublabel\" euimLabel [euimSizeS]=\"true\" [euimDefault]=\"true\">{{item.sublabel}}</p>\n </div>\n\n <ion-badge *ngIf=\"item.badge\" [color]=\"item.badge.color\" slot=\"end\">\n {{item.badge.value}}</ion-badge>\n <euim-notification-item *ngIf=\"item.notification && !item.notification.count\"\n slot=\"end\"\n [euimSuccess]=\"isColorDirectiveShown(item, 'success')\"\n [euimWarning]=\"isColorDirectiveShown(item, 'warning')\"\n [euimDanger]=\"isColorDirectiveShown(item, 'danger')\"\n [euimInfo]=\"isColorDirectiveShown(item, 'info')\"\n [euimPrimary]=\"isColorDirectiveShown(item, 'primary')\"\n [euimSecondary]=\"isColorDirectiveShown(item, 'secondary')\"\n [euimAccent]=\"isColorDirectiveShown(item, 'accent')\"\n ></euim-notification-item>\n <ion-note class=\"euim-menu__metadata\" slot=\"end\" *ngIf=\"item.metadata\">\n <p euimLabel [euimSizeS]=\"true\" [euimDefault]=\"true\">{{item.metadata}}</p>\n </ion-note>\n </ion-item>\n </ion-menu-toggle>\n </li>\n </ng-container>\n</ion-list>\n", styles: [".euim-menu__section-item{--padding-start: 0px;--inner-padding-start: var(--eui-base-spacing-m)}.euim-menu__section-item::part(detail-icon){color:var(--eui-base-color-grey-50);font-size:var(--eui-base-font-size-2xl);opacity:1;margin-left:var(--eui-base-spacing-xs)}.euim-menu__section-item-label,.euim-menu__section-item-sublabel{margin-left:var(--eui-base-spacing-m)}.euim-menu__metadata{margin:auto 0 auto var(--eui-base-spacing-s);padding:0}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonBadge, selector: "ion-badge", inputs: ["color", "mode"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { kind: "component", type: i1.IonItemDivider, selector: "ion-item-divider", inputs: ["color", "mode", "sticky"] }, { kind: "component", type: i1.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i1.IonMenuToggle, selector: "ion-menu-toggle", inputs: ["autoHide", "menu"] }, { kind: "component", type: i1.IonNote, selector: "ion-note", inputs: ["color", "mode"] }, { kind: "component", type: EuimAvatarIconComponent, selector: "euim-avatar-icon", inputs: ["color", "size", "fill", "variant", "borderColor"] }, { kind: "component", type: EuimLabelComponent, selector: "div[euimLabel], p[euimLabel], span[euimLabel], euim-label", inputs: ["euimLabelTruncateWithLines", "euimLabelTitle", "euimLabelSubTitle", "euimLabelMeta", "euimLabelTruncate"] }, { kind: "component", type: EuimNotificationItemComponent, selector: "euim-notification-item" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
730
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimMenuComponent, selector: "euim-menu", inputs: { items: "items" }, outputs: { itemClick: "itemClick" }, ngImport: i0, template: "<ion-list>\n @for (section of items; track section) {\n <li class=\"euim-menu__section\">\n @if (section.sectionName) {\n <ion-item-divider>\n <p euimLabel [euimSizeS]=\"true\" [euimDefault]=\"true\">{{section.sectionName}}</p>\n </ion-item-divider>\n }\n @for (item of section.items; track item; let j = $index) {\n <ion-menu-toggle auto-hide=\"true\">\n @if (item.label) {\n <ion-item (click)=\"onItemClick($event, j, item)\"\n [lines]=\"item.lines ? item.lines : 'none'\" button [detail]=\"item.detailArrow\"\n class=\"euim-menu__section-item\">\n @if (item.avatarColor) {\n <euim-avatar-icon size=\"s\" variant=\"rounded\" [color]=\"item.avatarColor\">\n @if (item.icon) {\n <ion-icon\n [color]=\"item.iconColor\"\n [name]=\"item.icon\"></ion-icon>\n }\n </euim-avatar-icon>\n }\n @if (item.icon && !item.avatarColor) {\n <ion-icon\n [color]=\"item.iconColor\"\n [name]=\"item.icon\"></ion-icon>\n }\n <div>\n <p class=\"euim-menu__section-item-label\" euimLabel [euimSizeM]=\"true\" [euimDark]=\"true\">{{item.label}}</p>\n <p class=\"euim-menu__section-item-sublabel\" euimLabel [euimSizeS]=\"true\" [euimDefault]=\"true\">{{item.sublabel}}</p>\n </div>\n @if (item.badge) {\n <ion-badge [color]=\"item.badge.color\" slot=\"end\">\n {{item.badge.value}}</ion-badge>\n }\n @if (item.notification && !item.notification.count) {\n <euim-notification-item\n slot=\"end\"\n [euimSuccess]=\"isColorDirectiveShown(item, 'success')\"\n [euimWarning]=\"isColorDirectiveShown(item, 'warning')\"\n [euimDanger]=\"isColorDirectiveShown(item, 'danger')\"\n [euimInfo]=\"isColorDirectiveShown(item, 'info')\"\n [euimPrimary]=\"isColorDirectiveShown(item, 'primary')\"\n [euimSecondary]=\"isColorDirectiveShown(item, 'secondary')\"\n [euimAccent]=\"isColorDirectiveShown(item, 'accent')\"\n ></euim-notification-item>\n }\n @if (item.metadata) {\n <ion-note class=\"euim-menu__metadata\" slot=\"end\">\n <p euimLabel [euimSizeS]=\"true\" [euimDefault]=\"true\">{{item.metadata}}</p>\n </ion-note>\n }\n </ion-item>\n }\n </ion-menu-toggle>\n }\n </li>\n }\n</ion-list>\n", styles: [".euim-menu__section-item{--padding-start: 0px;--inner-padding-start: var(--eui-base-spacing-m)}.euim-menu__section-item::part(detail-icon){color:var(--eui-base-color-grey-50);font-size:var(--eui-base-font-size-2xl);opacity:1;margin-left:var(--eui-base-spacing-xs)}.euim-menu__section-item-label,.euim-menu__section-item-sublabel{margin-left:var(--eui-base-spacing-m)}.euim-menu__metadata{margin:auto 0 auto var(--eui-base-spacing-s);padding:0}\n"], dependencies: [{ kind: "component", type: i1.IonBadge, selector: "ion-badge", inputs: ["color", "mode"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { kind: "component", type: i1.IonItemDivider, selector: "ion-item-divider", inputs: ["color", "mode", "sticky"] }, { kind: "component", type: i1.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i1.IonMenuToggle, selector: "ion-menu-toggle", inputs: ["autoHide", "menu"] }, { kind: "component", type: i1.IonNote, selector: "ion-note", inputs: ["color", "mode"] }, { kind: "component", type: EuimAvatarIconComponent, selector: "euim-avatar-icon", inputs: ["color", "size", "fill", "variant", "borderColor"] }, { kind: "component", type: EuimLabelComponent, selector: "div[euimLabel], p[euimLabel], span[euimLabel], euim-label", inputs: ["euimLabelTruncateWithLines", "euimLabelTitle", "euimLabelSubTitle", "euimLabelMeta", "euimLabelTruncate"] }, { kind: "component", type: EuimNotificationItemComponent, selector: "euim-notification-item" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
731
731
  }
732
732
  __decorate([
733
733
  coerceBoolean
734
734
  ], EuimMenuComponent.prototype, "isChanged", void 0);
735
735
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMenuComponent, decorators: [{
736
736
  type: Component,
737
- args: [{ selector: 'euim-menu', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ion-list>\n <ng-container *ngFor=\"let section of items\">\n <li class=\"euim-menu__section\">\n <ion-item-divider *ngIf=\"section.sectionName\">\n <p euimLabel [euimSizeS]=\"true\" [euimDefault]=\"true\">{{section.sectionName}}</p>\n </ion-item-divider>\n <ion-menu-toggle auto-hide=\"true\" *ngFor=\"let item of section.items; let j = index\">\n <ion-item (click)=\"onItemClick($event, j, item)\" *ngIf=\"item.label\"\n [lines]=\"item.lines ? item.lines : 'none'\" button [detail]=\"item.detailArrow\"\n class=\"euim-menu__section-item\">\n <euim-avatar-icon *ngIf=\"item.avatarColor\" size=\"s\" variant=\"rounded\" [color]=\"item.avatarColor\">\n <ion-icon *ngIf=\"item.icon\"\n [color]=\"item.iconColor\"\n [name]=\"item.icon\"></ion-icon>\n </euim-avatar-icon>\n <ion-icon *ngIf=\"item.icon && !item.avatarColor\"\n [color]=\"item.iconColor\"\n [name]=\"item.icon\"></ion-icon>\n <div>\n <p class=\"euim-menu__section-item-label\" euimLabel [euimSizeM]=\"true\" [euimDark]=\"true\">{{item.label}}</p>\n <p class=\"euim-menu__section-item-sublabel\" euimLabel [euimSizeS]=\"true\" [euimDefault]=\"true\">{{item.sublabel}}</p>\n </div>\n\n <ion-badge *ngIf=\"item.badge\" [color]=\"item.badge.color\" slot=\"end\">\n {{item.badge.value}}</ion-badge>\n <euim-notification-item *ngIf=\"item.notification && !item.notification.count\"\n slot=\"end\"\n [euimSuccess]=\"isColorDirectiveShown(item, 'success')\"\n [euimWarning]=\"isColorDirectiveShown(item, 'warning')\"\n [euimDanger]=\"isColorDirectiveShown(item, 'danger')\"\n [euimInfo]=\"isColorDirectiveShown(item, 'info')\"\n [euimPrimary]=\"isColorDirectiveShown(item, 'primary')\"\n [euimSecondary]=\"isColorDirectiveShown(item, 'secondary')\"\n [euimAccent]=\"isColorDirectiveShown(item, 'accent')\"\n ></euim-notification-item>\n <ion-note class=\"euim-menu__metadata\" slot=\"end\" *ngIf=\"item.metadata\">\n <p euimLabel [euimSizeS]=\"true\" [euimDefault]=\"true\">{{item.metadata}}</p>\n </ion-note>\n </ion-item>\n </ion-menu-toggle>\n </li>\n </ng-container>\n</ion-list>\n", styles: [".euim-menu__section-item{--padding-start: 0px;--inner-padding-start: var(--eui-base-spacing-m)}.euim-menu__section-item::part(detail-icon){color:var(--eui-base-color-grey-50);font-size:var(--eui-base-font-size-2xl);opacity:1;margin-left:var(--eui-base-spacing-xs)}.euim-menu__section-item-label,.euim-menu__section-item-sublabel{margin-left:var(--eui-base-spacing-m)}.euim-menu__metadata{margin:auto 0 auto var(--eui-base-spacing-s);padding:0}\n"] }]
737
+ args: [{ selector: 'euim-menu', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ion-list>\n @for (section of items; track section) {\n <li class=\"euim-menu__section\">\n @if (section.sectionName) {\n <ion-item-divider>\n <p euimLabel [euimSizeS]=\"true\" [euimDefault]=\"true\">{{section.sectionName}}</p>\n </ion-item-divider>\n }\n @for (item of section.items; track item; let j = $index) {\n <ion-menu-toggle auto-hide=\"true\">\n @if (item.label) {\n <ion-item (click)=\"onItemClick($event, j, item)\"\n [lines]=\"item.lines ? item.lines : 'none'\" button [detail]=\"item.detailArrow\"\n class=\"euim-menu__section-item\">\n @if (item.avatarColor) {\n <euim-avatar-icon size=\"s\" variant=\"rounded\" [color]=\"item.avatarColor\">\n @if (item.icon) {\n <ion-icon\n [color]=\"item.iconColor\"\n [name]=\"item.icon\"></ion-icon>\n }\n </euim-avatar-icon>\n }\n @if (item.icon && !item.avatarColor) {\n <ion-icon\n [color]=\"item.iconColor\"\n [name]=\"item.icon\"></ion-icon>\n }\n <div>\n <p class=\"euim-menu__section-item-label\" euimLabel [euimSizeM]=\"true\" [euimDark]=\"true\">{{item.label}}</p>\n <p class=\"euim-menu__section-item-sublabel\" euimLabel [euimSizeS]=\"true\" [euimDefault]=\"true\">{{item.sublabel}}</p>\n </div>\n @if (item.badge) {\n <ion-badge [color]=\"item.badge.color\" slot=\"end\">\n {{item.badge.value}}</ion-badge>\n }\n @if (item.notification && !item.notification.count) {\n <euim-notification-item\n slot=\"end\"\n [euimSuccess]=\"isColorDirectiveShown(item, 'success')\"\n [euimWarning]=\"isColorDirectiveShown(item, 'warning')\"\n [euimDanger]=\"isColorDirectiveShown(item, 'danger')\"\n [euimInfo]=\"isColorDirectiveShown(item, 'info')\"\n [euimPrimary]=\"isColorDirectiveShown(item, 'primary')\"\n [euimSecondary]=\"isColorDirectiveShown(item, 'secondary')\"\n [euimAccent]=\"isColorDirectiveShown(item, 'accent')\"\n ></euim-notification-item>\n }\n @if (item.metadata) {\n <ion-note class=\"euim-menu__metadata\" slot=\"end\">\n <p euimLabel [euimSizeS]=\"true\" [euimDefault]=\"true\">{{item.metadata}}</p>\n </ion-note>\n }\n </ion-item>\n }\n </ion-menu-toggle>\n }\n </li>\n }\n</ion-list>\n", styles: [".euim-menu__section-item{--padding-start: 0px;--inner-padding-start: var(--eui-base-spacing-m)}.euim-menu__section-item::part(detail-icon){color:var(--eui-base-color-grey-50);font-size:var(--eui-base-font-size-2xl);opacity:1;margin-left:var(--eui-base-spacing-xs)}.euim-menu__section-item-label,.euim-menu__section-item-sublabel{margin-left:var(--eui-base-spacing-m)}.euim-menu__metadata{margin:auto 0 auto var(--eui-base-spacing-s);padding:0}\n"] }]
738
738
  }], ctorParameters: () => [{ type: i1.NavController }], propDecorators: { isChanged: [], itemClick: [{
739
739
  type: Output
740
740
  }], items: [{
@@ -909,7 +909,7 @@ class EuimEmptyListPlaceholderComponent {
909
909
  ].join(' ');
910
910
  }
911
911
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimEmptyListPlaceholderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
912
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimEmptyListPlaceholderComponent, selector: "euim-empty-list-placeholder", inputs: { message: "message", icon: "icon", description: "description", button: "button", euimMarginTopLarge: "euimMarginTopLarge", euimMarginTopSmall: "euimMarginTopSmall", euimMarginBottomSmall: "euimMarginBottomSmall" }, host: { properties: { "class": "this.cssClasses" } }, ngImport: i0, template: "<ion-icon *ngIf=\"icon\" [name]=\"icon\" size=\"large\" class=\"euim-empty-list-placeholder__icon\"></ion-icon>\n<ion-icon *ngIf=\"(!icon && !message && !description)\" name=\"search-sharp\" size=\"large\"\n class=\"euim-empty-list-placeholder__icon\"></ion-icon>\n<div class=\"euim-empty-list-placeholder__message\" *ngIf=\"message || (!icon && !message && !description)\">\n {{ message || 'euim.empty-list-placeholder.message' | translate }}\n</div>\n<div class=\"euim-empty-list-placeholder__description\" *ngIf=\"description || (!icon && !message && !description)\">\n {{ description || 'euim.empty-list-placeholder.description' | translate }}\n</div>\n<ng-content></ng-content>", styles: [".euim-empty-list-placeholder{width:100%;display:grid;grid-template-columns:1fr;grid-template-rows:auto;grid-column-gap:0;grid-row-gap:var(--eui-base-spacing-2xs);justify-content:center;justify-items:center;align-items:center;margin:auto}.euim-empty-list-placeholder--margin-top-large{margin-top:calc(9 * var(--eui-base-spacing-m))}.euim-empty-list-placeholder--margin-top-small{margin-top:var(--eui-base-spacing-m)}.euim-empty-list-placeholder--margin-bottom-small{margin-bottom:var(--eui-base-spacing-m)}.euim-empty-list-placeholder__icon{color:var(--eui-base-color-grey-75)}.euim-empty-list-placeholder__message{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-grey-75)}.euim-empty-list-placeholder__description{font:normal normal 400 .875rem/1rem var(--eui-base-font-family);color:var(--eui-base-color-grey-75)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
912
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimEmptyListPlaceholderComponent, selector: "euim-empty-list-placeholder", inputs: { message: "message", icon: "icon", description: "description", button: "button", euimMarginTopLarge: "euimMarginTopLarge", euimMarginTopSmall: "euimMarginTopSmall", euimMarginBottomSmall: "euimMarginBottomSmall" }, host: { properties: { "class": "this.cssClasses" } }, ngImport: i0, template: "@if (icon) {\n <ion-icon [name]=\"icon\" size=\"large\" class=\"euim-empty-list-placeholder__icon\"></ion-icon>\n}\n@if ((!icon && !message && !description)) {\n <ion-icon name=\"search-sharp\" size=\"large\"\n class=\"euim-empty-list-placeholder__icon\"></ion-icon>\n}\n@if (message || (!icon && !message && !description)) {\n <div class=\"euim-empty-list-placeholder__message\">\n {{ message || 'euim.empty-list-placeholder.message' | translate }}\n </div>\n}\n@if (description || (!icon && !message && !description)) {\n <div class=\"euim-empty-list-placeholder__description\">\n {{ description || 'euim.empty-list-placeholder.description' | translate }}\n </div>\n}\n<ng-content></ng-content>", styles: [".euim-empty-list-placeholder{width:100%;display:grid;grid-template-columns:1fr;grid-template-rows:auto;grid-column-gap:0;grid-row-gap:var(--eui-base-spacing-2xs);justify-content:center;justify-items:center;align-items:center;margin:auto}.euim-empty-list-placeholder--margin-top-large{margin-top:calc(9 * var(--eui-base-spacing-m))}.euim-empty-list-placeholder--margin-top-small{margin-top:var(--eui-base-spacing-m)}.euim-empty-list-placeholder--margin-bottom-small{margin-bottom:var(--eui-base-spacing-m)}.euim-empty-list-placeholder__icon{color:var(--eui-base-color-grey-75)}.euim-empty-list-placeholder__message{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-grey-75)}.euim-empty-list-placeholder__description{font:normal normal 400 .875rem/1rem var(--eui-base-font-family);color:var(--eui-base-color-grey-75)}\n"], dependencies: [{ kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
913
913
  }
914
914
  __decorate([
915
915
  coerceBoolean
@@ -922,7 +922,7 @@ __decorate([
922
922
  ], EuimEmptyListPlaceholderComponent.prototype, "euimMarginBottomSmall", void 0);
923
923
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimEmptyListPlaceholderComponent, decorators: [{
924
924
  type: Component,
925
- args: [{ selector: 'euim-empty-list-placeholder', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-icon *ngIf=\"icon\" [name]=\"icon\" size=\"large\" class=\"euim-empty-list-placeholder__icon\"></ion-icon>\n<ion-icon *ngIf=\"(!icon && !message && !description)\" name=\"search-sharp\" size=\"large\"\n class=\"euim-empty-list-placeholder__icon\"></ion-icon>\n<div class=\"euim-empty-list-placeholder__message\" *ngIf=\"message || (!icon && !message && !description)\">\n {{ message || 'euim.empty-list-placeholder.message' | translate }}\n</div>\n<div class=\"euim-empty-list-placeholder__description\" *ngIf=\"description || (!icon && !message && !description)\">\n {{ description || 'euim.empty-list-placeholder.description' | translate }}\n</div>\n<ng-content></ng-content>", styles: [".euim-empty-list-placeholder{width:100%;display:grid;grid-template-columns:1fr;grid-template-rows:auto;grid-column-gap:0;grid-row-gap:var(--eui-base-spacing-2xs);justify-content:center;justify-items:center;align-items:center;margin:auto}.euim-empty-list-placeholder--margin-top-large{margin-top:calc(9 * var(--eui-base-spacing-m))}.euim-empty-list-placeholder--margin-top-small{margin-top:var(--eui-base-spacing-m)}.euim-empty-list-placeholder--margin-bottom-small{margin-bottom:var(--eui-base-spacing-m)}.euim-empty-list-placeholder__icon{color:var(--eui-base-color-grey-75)}.euim-empty-list-placeholder__message{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-grey-75)}.euim-empty-list-placeholder__description{font:normal normal 400 .875rem/1rem var(--eui-base-font-family);color:var(--eui-base-color-grey-75)}\n"] }]
925
+ args: [{ selector: 'euim-empty-list-placeholder', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (icon) {\n <ion-icon [name]=\"icon\" size=\"large\" class=\"euim-empty-list-placeholder__icon\"></ion-icon>\n}\n@if ((!icon && !message && !description)) {\n <ion-icon name=\"search-sharp\" size=\"large\"\n class=\"euim-empty-list-placeholder__icon\"></ion-icon>\n}\n@if (message || (!icon && !message && !description)) {\n <div class=\"euim-empty-list-placeholder__message\">\n {{ message || 'euim.empty-list-placeholder.message' | translate }}\n </div>\n}\n@if (description || (!icon && !message && !description)) {\n <div class=\"euim-empty-list-placeholder__description\">\n {{ description || 'euim.empty-list-placeholder.description' | translate }}\n </div>\n}\n<ng-content></ng-content>", styles: [".euim-empty-list-placeholder{width:100%;display:grid;grid-template-columns:1fr;grid-template-rows:auto;grid-column-gap:0;grid-row-gap:var(--eui-base-spacing-2xs);justify-content:center;justify-items:center;align-items:center;margin:auto}.euim-empty-list-placeholder--margin-top-large{margin-top:calc(9 * var(--eui-base-spacing-m))}.euim-empty-list-placeholder--margin-top-small{margin-top:var(--eui-base-spacing-m)}.euim-empty-list-placeholder--margin-bottom-small{margin-bottom:var(--eui-base-spacing-m)}.euim-empty-list-placeholder__icon{color:var(--eui-base-color-grey-75)}.euim-empty-list-placeholder__message{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-grey-75)}.euim-empty-list-placeholder__description{font:normal normal 400 .875rem/1rem var(--eui-base-font-family);color:var(--eui-base-color-grey-75)}\n"] }]
926
926
  }], propDecorators: { message: [{
927
927
  type: Input
928
928
  }], icon: [{
@@ -1018,13 +1018,13 @@ class EuimLanguageListComponent {
1018
1018
  }
1019
1019
  });
1020
1020
  }
1021
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageListComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.TranslateService }, { token: i2$1.EuiAppShellService }, { token: EuimAppService }, { token: i1.ModalController }, { token: i1.Platform }], target: i0.ɵɵFactoryTarget.Component }); }
1022
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimLanguageListComponent, selector: "euim-language-list", ngImport: i0, template: "<ion-header>\n <ion-toolbar color=\"primary\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"onClose()\">\n <ion-icon name=\"close-sharp\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-title> {{'euim.language-list.SELECT-LANGUAGE' | translate }}</ion-title>\n </ion-toolbar>\n <ion-toolbar color=\"primary\" class=\"euim-language-selector__search\">\n <ion-searchbar (ionChange)=\"handleChange($event)\"></ion-searchbar>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <ion-list *ngIf=\"results.length > 0\">\n <ng-container *ngFor=\"let item of results\">\n <ion-item-divider *ngIf=\"firstElementFromEUList?.code === item.code\n || firstElementFromNonEUList?.code === item.code\">\n {{ (firstElementFromEUList?.code === item.code)\n ? ('euim.language-list.EU-LANGUAGES' | translate)\n : 'euim.language-list.NON-EU-LANGUAGES' | translate }}\n </ion-item-divider>\n <ion-item button (click)=\"onLanguageSelected(item)\" [lines]=\"lastElementFromEUList === item ? 'none' : 'inset'\">\n <euim-avatar-icon fill=\"solid\" slot=\"start\" variant=\"rounded\" class=\"euim-language-selector__avatar\">\n <ion-icon name=\"language-sharp\" class=\"euim-language-selector__internal-icon\"></ion-icon>\n </euim-avatar-icon>\n <ion-label>\n <div euimLabel euimLabelTitle>{{item.label}}</div>\n <div euimLabel euimLabelMeta class=\"eui-u-text-uppercase\">\n {{item.code}}\n </div>\n </ion-label>\n <ion-buttons *ngIf=\"selectedLanguage?.code===item.code\">\n <ion-button fill=\"clear\" >\n <ion-icon name=\"checkmark-sharp\" slot=\"icon-only\" color=\"primary\"></ion-icon>\n </ion-button>\n </ion-buttons>\n </ion-item>\n </ng-container>\n </ion-list>\n <euim-empty-list-placeholder euimMarginTopLarge *ngIf=\"results.length < 1\"\n class=\"euim-language-selector__empty-placeholder\">\n </euim-empty-list-placeholder>\n</ion-content>\n\n", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i1.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { kind: "component", type: i1.IonItemDivider, selector: "ion-item-divider", inputs: ["color", "mode", "sticky"] }, { kind: "component", type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i1.IonSearchbar, selector: "ion-searchbar", inputs: ["animated", "autocomplete", "autocorrect", "cancelButtonIcon", "cancelButtonText", "clearIcon", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "mode", "placeholder", "searchIcon", "showCancelButton", "showClearButton", "spellcheck", "type", "value"] }, { kind: "component", type: i1.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "component", type: i1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "directive", type: i1.TextValueAccessor, selector: "ion-input:not([type=number]),ion-textarea,ion-searchbar" }, { kind: "component", type: EuimAvatarIconComponent, selector: "euim-avatar-icon", inputs: ["color", "size", "fill", "variant", "borderColor"] }, { kind: "component", type: EuimLabelComponent, selector: "div[euimLabel], p[euimLabel], span[euimLabel], euim-label", inputs: ["euimLabelTruncateWithLines", "euimLabelTitle", "euimLabelSubTitle", "euimLabelMeta", "euimLabelTruncate"] }, { kind: "component", type: EuimEmptyListPlaceholderComponent, selector: "euim-empty-list-placeholder", inputs: ["message", "icon", "description", "button", "euimMarginTopLarge", "euimMarginTopSmall", "euimMarginBottomSmall"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1021
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageListComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.TranslateService }, { token: i2.EuiAppShellService }, { token: EuimAppService }, { token: i1.ModalController }, { token: i1.Platform }], target: i0.ɵɵFactoryTarget.Component }); }
1022
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimLanguageListComponent, selector: "euim-language-list", ngImport: i0, template: "<ion-header>\n <ion-toolbar color=\"primary\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"onClose()\">\n <ion-icon name=\"close-sharp\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-title> {{'euim.language-list.SELECT-LANGUAGE' | translate }}</ion-title>\n </ion-toolbar>\n <ion-toolbar color=\"primary\" class=\"euim-language-selector__search\">\n <ion-searchbar (ionChange)=\"handleChange($event)\"></ion-searchbar>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n @if (results.length > 0) {\n <ion-list>\n @for (item of results; track item) {\n @if (firstElementFromEUList?.code === item.code\n || firstElementFromNonEUList?.code === item.code) {\n <ion-item-divider>\n {{ (firstElementFromEUList?.code === item.code)\n ? ('euim.language-list.EU-LANGUAGES' | translate)\n : 'euim.language-list.NON-EU-LANGUAGES' | translate }}\n </ion-item-divider>\n }\n <ion-item button (click)=\"onLanguageSelected(item)\" [lines]=\"lastElementFromEUList === item ? 'none' : 'inset'\">\n <euim-avatar-icon fill=\"solid\" slot=\"start\" variant=\"rounded\" class=\"euim-language-selector__avatar\">\n <ion-icon name=\"language-sharp\" class=\"euim-language-selector__internal-icon\"></ion-icon>\n </euim-avatar-icon>\n <ion-label>\n <div euimLabel euimLabelTitle>{{item.label}}</div>\n <div euimLabel euimLabelMeta class=\"eui-u-text-uppercase\">\n {{item.code}}\n </div>\n </ion-label>\n @if (selectedLanguage?.code===item.code) {\n <ion-buttons>\n <ion-button fill=\"clear\" >\n <ion-icon name=\"checkmark-sharp\" slot=\"icon-only\" color=\"primary\"></ion-icon>\n </ion-button>\n </ion-buttons>\n }\n </ion-item>\n }\n </ion-list>\n }\n @if (results.length < 1) {\n <euim-empty-list-placeholder euimMarginTopLarge\n class=\"euim-language-selector__empty-placeholder\">\n </euim-empty-list-placeholder>\n }\n</ion-content>\n\n", dependencies: [{ kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i1.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { kind: "component", type: i1.IonItemDivider, selector: "ion-item-divider", inputs: ["color", "mode", "sticky"] }, { kind: "component", type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i1.IonSearchbar, selector: "ion-searchbar", inputs: ["animated", "autocomplete", "autocorrect", "cancelButtonIcon", "cancelButtonText", "clearIcon", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "mode", "placeholder", "searchIcon", "showCancelButton", "showClearButton", "spellcheck", "type", "value"] }, { kind: "component", type: i1.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "component", type: i1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "directive", type: i1.TextValueAccessor, selector: "ion-input:not([type=number]),ion-textarea,ion-searchbar" }, { kind: "component", type: EuimAvatarIconComponent, selector: "euim-avatar-icon", inputs: ["color", "size", "fill", "variant", "borderColor"] }, { kind: "component", type: EuimLabelComponent, selector: "div[euimLabel], p[euimLabel], span[euimLabel], euim-label", inputs: ["euimLabelTruncateWithLines", "euimLabelTitle", "euimLabelSubTitle", "euimLabelMeta", "euimLabelTruncate"] }, { kind: "component", type: EuimEmptyListPlaceholderComponent, selector: "euim-empty-list-placeholder", inputs: ["message", "icon", "description", "button", "euimMarginTopLarge", "euimMarginTopSmall", "euimMarginBottomSmall"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1023
1023
  }
1024
1024
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageListComponent, decorators: [{
1025
1025
  type: Component,
1026
- args: [{ selector: 'euim-language-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-header>\n <ion-toolbar color=\"primary\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"onClose()\">\n <ion-icon name=\"close-sharp\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-title> {{'euim.language-list.SELECT-LANGUAGE' | translate }}</ion-title>\n </ion-toolbar>\n <ion-toolbar color=\"primary\" class=\"euim-language-selector__search\">\n <ion-searchbar (ionChange)=\"handleChange($event)\"></ion-searchbar>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n <ion-list *ngIf=\"results.length > 0\">\n <ng-container *ngFor=\"let item of results\">\n <ion-item-divider *ngIf=\"firstElementFromEUList?.code === item.code\n || firstElementFromNonEUList?.code === item.code\">\n {{ (firstElementFromEUList?.code === item.code)\n ? ('euim.language-list.EU-LANGUAGES' | translate)\n : 'euim.language-list.NON-EU-LANGUAGES' | translate }}\n </ion-item-divider>\n <ion-item button (click)=\"onLanguageSelected(item)\" [lines]=\"lastElementFromEUList === item ? 'none' : 'inset'\">\n <euim-avatar-icon fill=\"solid\" slot=\"start\" variant=\"rounded\" class=\"euim-language-selector__avatar\">\n <ion-icon name=\"language-sharp\" class=\"euim-language-selector__internal-icon\"></ion-icon>\n </euim-avatar-icon>\n <ion-label>\n <div euimLabel euimLabelTitle>{{item.label}}</div>\n <div euimLabel euimLabelMeta class=\"eui-u-text-uppercase\">\n {{item.code}}\n </div>\n </ion-label>\n <ion-buttons *ngIf=\"selectedLanguage?.code===item.code\">\n <ion-button fill=\"clear\" >\n <ion-icon name=\"checkmark-sharp\" slot=\"icon-only\" color=\"primary\"></ion-icon>\n </ion-button>\n </ion-buttons>\n </ion-item>\n </ng-container>\n </ion-list>\n <euim-empty-list-placeholder euimMarginTopLarge *ngIf=\"results.length < 1\"\n class=\"euim-language-selector__empty-placeholder\">\n </euim-empty-list-placeholder>\n</ion-content>\n\n" }]
1027
- }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }, { type: i2$1.EuiAppShellService }, { type: EuimAppService }, { type: i1.ModalController }, { type: i1.Platform }] });
1026
+ args: [{ selector: 'euim-language-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-header>\n <ion-toolbar color=\"primary\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"onClose()\">\n <ion-icon name=\"close-sharp\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-title> {{'euim.language-list.SELECT-LANGUAGE' | translate }}</ion-title>\n </ion-toolbar>\n <ion-toolbar color=\"primary\" class=\"euim-language-selector__search\">\n <ion-searchbar (ionChange)=\"handleChange($event)\"></ion-searchbar>\n </ion-toolbar>\n</ion-header>\n<ion-content>\n @if (results.length > 0) {\n <ion-list>\n @for (item of results; track item) {\n @if (firstElementFromEUList?.code === item.code\n || firstElementFromNonEUList?.code === item.code) {\n <ion-item-divider>\n {{ (firstElementFromEUList?.code === item.code)\n ? ('euim.language-list.EU-LANGUAGES' | translate)\n : 'euim.language-list.NON-EU-LANGUAGES' | translate }}\n </ion-item-divider>\n }\n <ion-item button (click)=\"onLanguageSelected(item)\" [lines]=\"lastElementFromEUList === item ? 'none' : 'inset'\">\n <euim-avatar-icon fill=\"solid\" slot=\"start\" variant=\"rounded\" class=\"euim-language-selector__avatar\">\n <ion-icon name=\"language-sharp\" class=\"euim-language-selector__internal-icon\"></ion-icon>\n </euim-avatar-icon>\n <ion-label>\n <div euimLabel euimLabelTitle>{{item.label}}</div>\n <div euimLabel euimLabelMeta class=\"eui-u-text-uppercase\">\n {{item.code}}\n </div>\n </ion-label>\n @if (selectedLanguage?.code===item.code) {\n <ion-buttons>\n <ion-button fill=\"clear\" >\n <ion-icon name=\"checkmark-sharp\" slot=\"icon-only\" color=\"primary\"></ion-icon>\n </ion-button>\n </ion-buttons>\n }\n </ion-item>\n }\n </ion-list>\n }\n @if (results.length < 1) {\n <euim-empty-list-placeholder euimMarginTopLarge\n class=\"euim-language-selector__empty-placeholder\">\n </euim-empty-list-placeholder>\n }\n</ion-content>\n\n" }]
1027
+ }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }, { type: i2.EuiAppShellService }, { type: EuimAppService }, { type: i1.ModalController }, { type: i1.Platform }] });
1028
1028
 
1029
1029
  class EuimLanguageSelectorComponent {
1030
1030
  constructor(cd, translateService, appShellService, appService, modalCtrl, baseStatesDirective) {
@@ -1073,7 +1073,7 @@ class EuimLanguageSelectorComponent {
1073
1073
  }
1074
1074
  return;
1075
1075
  }
1076
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageSelectorComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.TranslateService }, { token: i2$1.EuiAppShellService }, { token: EuimAppService }, { token: i1.ModalController }, { token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
1076
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageSelectorComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.TranslateService }, { token: i2.EuiAppShellService }, { token: EuimAppService }, { token: i1.ModalController }, { token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
1077
1077
  /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimLanguageSelectorComponent, selector: "euim-language-selector", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimPrimary", "euimPrimary", "color", "color"] }], ngImport: i0, template: "<ion-button (click)=\"onShowLanguageList()\">\n <ion-icon class=\"euim-language-selector__icon {{_euimPrimary ? 'euim-language-selector__icon--primary' : ''}}\"\n slot=\"icon-only\"\n src='data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\">\n <path\n d=\"M 21.00,0.00\n C 22.66,-0.00 24.00,1.34 24.00,3.00\n 24.00,3.00 24.00,17.00 24.00,17.00\n 24.00,18.66 22.66,20.00 21.00,20.00\n 21.00,20.00 3.00,20.00 3.00,20.00\n 1.34,20.00 0.00,18.66 0.00,17.00\n 0.00,17.00 0.00,3.00 0.00,3.00\n 0.00,1.34 1.34,0.00 3.00,0.00\n 3.00,0.00 21.00,0.00 21.00,0.00 Z\n M 9.66,12.34\n C 9.66,12.34 15.31,18.00 15.31,18.00\n 15.31,18.00 9.66,23.66 9.66,23.66\n 9.66,23.66 4.00,18.00 4.00,18.00\n 4.00,18.00 9.66,12.34 9.66,12.34 Z\" />\n </svg>'>\n </ion-icon>\n\n <span class=\"euim-language-selector__text {{_euimPrimary ? 'euim-language-selector__text--primary' : ''}}\">\n {{ selectedLanguage?.code?.toUpperCase() }}\n </span>\n</ion-button>\n", styles: [".euim-language-selector__text{font:normal normal 400 .75rem/1rem var(--eui-base-font-family);font-weight:700;margin-bottom:var(--eui-base-spacing-2xs);position:absolute;color:var(--eui-base-color-primary-100)}.euim-language-selector__text--primary,.euim-language-selector__icon{color:#fff}.euim-language-selector__icon--primary{color:var(--eui-base-color-primary-100)}.euim-language-selector__avatar{background-color:var(--eui-base-color-grey-15)}.euim-language-selector__internal-icon{color:var(--eui-base-color-grey-100)}.euim-language-selector__search{display:contents}.euim-language-selector__empty-placeholder{display:block;height:auto;margin-top:calc(9 * var(--eui-base-spacing-m))}\n"], dependencies: [{ kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1078
1078
  }
1079
1079
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageSelectorComponent, decorators: [{
@@ -1087,7 +1087,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
1087
1087
  ],
1088
1088
  },
1089
1089
  ], template: "<ion-button (click)=\"onShowLanguageList()\">\n <ion-icon class=\"euim-language-selector__icon {{_euimPrimary ? 'euim-language-selector__icon--primary' : ''}}\"\n slot=\"icon-only\"\n src='data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\">\n <path\n d=\"M 21.00,0.00\n C 22.66,-0.00 24.00,1.34 24.00,3.00\n 24.00,3.00 24.00,17.00 24.00,17.00\n 24.00,18.66 22.66,20.00 21.00,20.00\n 21.00,20.00 3.00,20.00 3.00,20.00\n 1.34,20.00 0.00,18.66 0.00,17.00\n 0.00,17.00 0.00,3.00 0.00,3.00\n 0.00,1.34 1.34,0.00 3.00,0.00\n 3.00,0.00 21.00,0.00 21.00,0.00 Z\n M 9.66,12.34\n C 9.66,12.34 15.31,18.00 15.31,18.00\n 15.31,18.00 9.66,23.66 9.66,23.66\n 9.66,23.66 4.00,18.00 4.00,18.00\n 4.00,18.00 9.66,12.34 9.66,12.34 Z\" />\n </svg>'>\n </ion-icon>\n\n <span class=\"euim-language-selector__text {{_euimPrimary ? 'euim-language-selector__text--primary' : ''}}\">\n {{ selectedLanguage?.code?.toUpperCase() }}\n </span>\n</ion-button>\n", styles: [".euim-language-selector__text{font:normal normal 400 .75rem/1rem var(--eui-base-font-family);font-weight:700;margin-bottom:var(--eui-base-spacing-2xs);position:absolute;color:var(--eui-base-color-primary-100)}.euim-language-selector__text--primary,.euim-language-selector__icon{color:#fff}.euim-language-selector__icon--primary{color:var(--eui-base-color-primary-100)}.euim-language-selector__avatar{background-color:var(--eui-base-color-grey-15)}.euim-language-selector__internal-icon{color:var(--eui-base-color-grey-100)}.euim-language-selector__search{display:contents}.euim-language-selector__empty-placeholder{display:block;height:auto;margin-top:calc(9 * var(--eui-base-spacing-m))}\n"] }]
1090
- }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }, { type: i2$1.EuiAppShellService }, { type: EuimAppService }, { type: i1.ModalController }, { type: BaseStatesDirective }], propDecorators: { cssClasses: [{
1090
+ }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }, { type: i2.EuiAppShellService }, { type: EuimAppService }, { type: i1.ModalController }, { type: BaseStatesDirective }], propDecorators: { cssClasses: [{
1091
1091
  type: HostBinding,
1092
1092
  args: ['class']
1093
1093
  }] } });
@@ -1495,7 +1495,7 @@ class EuimToolbarComponent {
1495
1495
  this.backButtonClick.emit(event);
1496
1496
  }
1497
1497
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1498
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimToolbarComponent, selector: "euim-toolbar", inputs: { hasBackButton: "hasBackButton", backButtonDefaultHref: "backButtonDefaultHref", hasSidebarTrigger: "hasSidebarTrigger", hasLanguageSelector: "hasLanguageSelector" }, outputs: { backButtonClick: "backButtonClick" }, host: { properties: { "className": "this.className" } }, ngImport: i0, template: "<ion-buttons slot=\"start\">\n <ion-menu-button *ngIf=\"hasSidebarTrigger\"></ion-menu-button>\n <ion-back-button (pointerdown)=\"onBackButtonClick($event)\"\n *ngIf=\"hasBackButton\"\n defaultHref=\"{{backButtonDefaultHref}}\"></ion-back-button>\n <ng-content></ng-content>\n</ion-buttons>\n<ion-title class=\"euim-toolbar__title-container\">\n <ng-content select=\"euim-toolbar-title\"></ng-content>\n</ion-title>\n<ion-buttons slot=\"end\">\n <ng-content select=\"euim-toolbar-action-items\"></ng-content>\n <ng-container *ngIf=\"hasLanguageSelector\">\n <euim-language-selector></euim-language-selector>\n </ng-container>\n</ion-buttons>\n", styles: [".euim-toolbar{display:flex;align-items:center}.euim-toolbar__title-container{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;display:flex;align-items:center}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonBackButton, selector: "ion-back-button", inputs: ["color", "defaultHref", "disabled", "icon", "mode", "routerAnimation", "text", "type"] }, { kind: "component", type: i1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i1.IonMenuButton, selector: "ion-menu-button", inputs: ["autoHide", "color", "disabled", "menu", "mode", "type"] }, { kind: "component", type: i1.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "directive", type: i1.IonBackButtonDelegate, selector: "ion-back-button", inputs: ["defaultHref", "routerAnimation"] }, { kind: "component", type: EuimLanguageSelectorComponent, selector: "euim-language-selector" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1498
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimToolbarComponent, selector: "euim-toolbar", inputs: { hasBackButton: "hasBackButton", backButtonDefaultHref: "backButtonDefaultHref", hasSidebarTrigger: "hasSidebarTrigger", hasLanguageSelector: "hasLanguageSelector" }, outputs: { backButtonClick: "backButtonClick" }, host: { properties: { "className": "this.className" } }, ngImport: i0, template: "<ion-buttons slot=\"start\">\n <ion-menu-button *ngIf=\"hasSidebarTrigger\"></ion-menu-button>\n <ion-back-button (pointerdown)=\"onBackButtonClick($event)\"\n *ngIf=\"hasBackButton\"\n defaultHref=\"{{backButtonDefaultHref}}\"></ion-back-button>\n <ng-content></ng-content>\n</ion-buttons>\n<ion-title class=\"euim-toolbar__title-container\">\n <ng-content select=\"euim-toolbar-title\"></ng-content>\n</ion-title>\n<ion-buttons slot=\"end\">\n <ng-content select=\"euim-toolbar-action-items\"></ng-content>\n <ng-container *ngIf=\"hasLanguageSelector\">\n <euim-language-selector></euim-language-selector>\n </ng-container>\n</ion-buttons>\n", styles: [".euim-toolbar{display:flex;align-items:center}.euim-toolbar__title-container{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;display:flex;align-items:center}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonBackButton, selector: "ion-back-button", inputs: ["color", "defaultHref", "disabled", "icon", "mode", "routerAnimation", "text", "type"] }, { kind: "component", type: i1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i1.IonMenuButton, selector: "ion-menu-button", inputs: ["autoHide", "color", "disabled", "menu", "mode", "type"] }, { kind: "component", type: i1.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "directive", type: i1.IonBackButtonDelegate, selector: "ion-back-button", inputs: ["defaultHref", "routerAnimation"] }, { kind: "component", type: EuimLanguageSelectorComponent, selector: "euim-language-selector" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1499
1499
  }
1500
1500
  __decorate([
1501
1501
  coerceBoolean
@@ -1821,11 +1821,11 @@ class EuimInfoScreenComponent {
1821
1821
  this.className = 'euim-info-screen';
1822
1822
  }
1823
1823
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1824
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimInfoScreenComponent, selector: "euim-info-screen", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".euim-info-screen__title{@eui-font (3xl);font-weight:700;color:var(--eui-base-color-grey-100);margin-top:var(--eui-base-spacing-l);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l)}.euim-info-screen__sub-title{color:var(--eui-base-color-grey-75);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);@eui-font (l);}.euim-info-screen__content{color:var(--eui-base-color-grey-100);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);@eui-font (l);}.euim-info-screen__title+.euim-info-screen__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-info-screen__sub-title+.euim-info-screen__content,title+.euim-info-screen__content{margin-top:var(--eui-base-spacing-m)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1824
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimInfoScreenComponent, selector: "euim-info-screen", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".euim-info-screen__title{font:normal normal 400 1.75rem/2rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-grey-100);margin-top:var(--eui-base-spacing-l);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l)}.euim-info-screen__sub-title{color:var(--eui-base-color-grey-75);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.euim-info-screen__content{color:var(--eui-base-color-grey-100);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.euim-info-screen__title+.euim-info-screen__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-info-screen__sub-title+.euim-info-screen__content,title+.euim-info-screen__content{margin-top:var(--eui-base-spacing-m)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1825
1825
  }
1826
1826
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenComponent, decorators: [{
1827
1827
  type: Component,
1828
- args: [{ selector: 'euim-info-screen', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n", styles: [".euim-info-screen__title{@eui-font (3xl);font-weight:700;color:var(--eui-base-color-grey-100);margin-top:var(--eui-base-spacing-l);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l)}.euim-info-screen__sub-title{color:var(--eui-base-color-grey-75);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);@eui-font (l);}.euim-info-screen__content{color:var(--eui-base-color-grey-100);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);@eui-font (l);}.euim-info-screen__title+.euim-info-screen__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-info-screen__sub-title+.euim-info-screen__content,title+.euim-info-screen__content{margin-top:var(--eui-base-spacing-m)}\n"] }]
1828
+ args: [{ selector: 'euim-info-screen', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n", styles: [".euim-info-screen__title{font:normal normal 400 1.75rem/2rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-grey-100);margin-top:var(--eui-base-spacing-l);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l)}.euim-info-screen__sub-title{color:var(--eui-base-color-grey-75);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.euim-info-screen__content{color:var(--eui-base-color-grey-100);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.euim-info-screen__title+.euim-info-screen__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-info-screen__sub-title+.euim-info-screen__content,title+.euim-info-screen__content{margin-top:var(--eui-base-spacing-m)}\n"] }]
1829
1829
  }], propDecorators: { className: [{
1830
1830
  type: HostBinding,
1831
1831
  args: ['class']
@@ -2162,11 +2162,11 @@ class EuimFieldSetComponent {
2162
2162
  this.className = 'euim-fieldset';
2163
2163
  }
2164
2164
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimFieldSetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2165
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimFieldSetComponent, selector: "euim-fieldset", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<div>\n <div class=\"euim-fieldset__header\">\n <ng-content select=\"euim-fieldset-legend\"></ng-content>\n <ng-content select=\"euim-fieldset-actions\"></ng-content>\n </div>\n <ng-content></ng-content>\n</div>\n", styles: [".euim-fieldset{display:block}.euim-fieldset__header{display:flex;align-items:center;justify-content:space-between;padding-top:var(--eui-base-spacing-m);border-bottom:1px solid var(--eui-base-color-grey-20);width:100%}.euim-fieldset-legend{display:flex;align-items:center;@eui-font (xl);margin-bottom:var(--eui-base-spacing-xs)}.euim-fieldset-legend ion-icon{margin-right:var(--eui-base-spacing-xs)}.euim-fieldset-actions{display:flex;align-items:center}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2165
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimFieldSetComponent, selector: "euim-fieldset", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<div>\n <div class=\"euim-fieldset__header\">\n <ng-content select=\"euim-fieldset-legend\"></ng-content>\n <ng-content select=\"euim-fieldset-actions\"></ng-content>\n </div>\n <ng-content></ng-content>\n</div>\n", styles: [".euim-fieldset{display:block}.euim-fieldset__header{display:flex;align-items:center;justify-content:space-between;padding-top:var(--eui-base-spacing-m);border-bottom:1px solid var(--eui-base-color-grey-20);width:100%}.euim-fieldset-legend{display:flex;align-items:center;font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family);margin-bottom:var(--eui-base-spacing-xs)}.euim-fieldset-legend ion-icon{margin-right:var(--eui-base-spacing-xs)}.euim-fieldset-actions{display:flex;align-items:center}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2166
2166
  }
2167
2167
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimFieldSetComponent, decorators: [{
2168
2168
  type: Component,
2169
- args: [{ selector: 'euim-fieldset', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div>\n <div class=\"euim-fieldset__header\">\n <ng-content select=\"euim-fieldset-legend\"></ng-content>\n <ng-content select=\"euim-fieldset-actions\"></ng-content>\n </div>\n <ng-content></ng-content>\n</div>\n", styles: [".euim-fieldset{display:block}.euim-fieldset__header{display:flex;align-items:center;justify-content:space-between;padding-top:var(--eui-base-spacing-m);border-bottom:1px solid var(--eui-base-color-grey-20);width:100%}.euim-fieldset-legend{display:flex;align-items:center;@eui-font (xl);margin-bottom:var(--eui-base-spacing-xs)}.euim-fieldset-legend ion-icon{margin-right:var(--eui-base-spacing-xs)}.euim-fieldset-actions{display:flex;align-items:center}\n"] }]
2169
+ args: [{ selector: 'euim-fieldset', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div>\n <div class=\"euim-fieldset__header\">\n <ng-content select=\"euim-fieldset-legend\"></ng-content>\n <ng-content select=\"euim-fieldset-actions\"></ng-content>\n </div>\n <ng-content></ng-content>\n</div>\n", styles: [".euim-fieldset{display:block}.euim-fieldset__header{display:flex;align-items:center;justify-content:space-between;padding-top:var(--eui-base-spacing-m);border-bottom:1px solid var(--eui-base-color-grey-20);width:100%}.euim-fieldset-legend{display:flex;align-items:center;font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family);margin-bottom:var(--eui-base-spacing-xs)}.euim-fieldset-legend ion-icon{margin-right:var(--eui-base-spacing-xs)}.euim-fieldset-actions{display:flex;align-items:center}\n"] }]
2170
2170
  }], propDecorators: { className: [{
2171
2171
  type: HostBinding,
2172
2172
  args: ['class']
@@ -2239,11 +2239,11 @@ class EuimSpinnerComponent {
2239
2239
  this.className = 'euim-spinner';
2240
2240
  }
2241
2241
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2242
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimSpinnerComponent, selector: "euim-spinner", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<ion-spinner class=\"euim-spinner__icon\">\n</ion-spinner>\n<ng-content>\n</ng-content>\n\n\n", styles: [".euim-spinner{width:100%;margin:0;padding:0}.euim-spinner__icon{width:100%;height:var(--eui-base-spacing-2xl);color:var(--eui-base-color-primary)}.euim-spinner--size-2xs{font-size:var(--eui-base-font-size-2xs)}.euim-spinner--size-xs{font-size:var(--eui-base-font-size-xs)}.euim-spinner--size-s{font-size:var(--eui-base-font-size-s)}.euim-spinner--size-m{font-size:var(--eui-base-font-size-m)}.euim-spinner--size-l{font-size:var(--eui-base-font-size-l)}.euim-spinner--size-xl{font-size:var(--eui-base-font-size-xl)}.euim-spinner--size-2xl{font-size:var(--eui-base-font-size-2xl)}.euim-spinner--size-3xl{font-size:var(--eui-base-font-size-3xl)}.euim-spinner--size-4xl{font-size:var(--eui-base-font-size-4xl)}.euim-spinner--primary{color:var(--eui-base-color-primary-100)}.euim-spinner--secondary{color:var(--eui-base-color-grey-50)}.euim-spinner--info{color:var(--eui-base-color-info-100)}.euim-spinner--success{color:var(--eui-base-color-success-100)}.euim-spinner--warning{color:var(--eui-base-color-warning-100)}.euim-spinner--danger{color:var(--eui-base-color-danger-100)}.euim-spinner--accent{color:var(--eui-base-color-accent-100)}.euim-spinner-message{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;display:flex;justify-content:center;color:var(--eui-base-color-grey-75)}.euim-spinner-description{font:normal normal 400 .875rem/1rem var(--eui-base-font-family);display:flex;justify-content:center;color:var(--eui-base-color-grey-75);margin-top:var(--eui-base-spacing-2xs)}\n"], dependencies: [{ kind: "component", type: i1.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }], encapsulation: i0.ViewEncapsulation.None }); }
2242
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimSpinnerComponent, selector: "euim-spinner", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<ion-spinner class=\"euim-spinner__icon\">\n</ion-spinner>\n<ng-content>\n</ng-content>\n\n\n", styles: [".euim-spinner{width:100%;margin:0;padding:0}.euim-spinner__icon{width:100%;height:var(--eui-base-spacing-2xl);color:var(--eui-base-color-primary-100)}.euim-spinner--size-2xs{font-size:var(--eui-base-font-size-2xs)}.euim-spinner--size-xs{font-size:var(--eui-base-font-size-xs)}.euim-spinner--size-s{font-size:var(--eui-base-font-size-s)}.euim-spinner--size-m{font-size:var(--eui-base-font-size-m)}.euim-spinner--size-l{font-size:var(--eui-base-font-size-l)}.euim-spinner--size-xl{font-size:var(--eui-base-font-size-xl)}.euim-spinner--size-2xl{font-size:var(--eui-base-font-size-2xl)}.euim-spinner--size-3xl{font-size:var(--eui-base-font-size-3xl)}.euim-spinner--size-4xl{font-size:var(--eui-base-font-size-4xl)}.euim-spinner--primary{color:var(--eui-base-color-primary-100)}.euim-spinner--secondary{color:var(--eui-base-color-grey-50)}.euim-spinner--info{color:var(--eui-base-color-info-100)}.euim-spinner--success{color:var(--eui-base-color-success-100)}.euim-spinner--warning{color:var(--eui-base-color-warning-100)}.euim-spinner--danger{color:var(--eui-base-color-danger-100)}.euim-spinner--accent{color:var(--eui-base-color-accent-100)}.euim-spinner-message{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;display:flex;justify-content:center;color:var(--eui-base-color-grey-75)}.euim-spinner-description{font:normal normal 400 .875rem/1rem var(--eui-base-font-family);display:flex;justify-content:center;color:var(--eui-base-color-grey-75);margin-top:var(--eui-base-spacing-2xs)}\n"], dependencies: [{ kind: "component", type: i1.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }], encapsulation: i0.ViewEncapsulation.None }); }
2243
2243
  }
2244
2244
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSpinnerComponent, decorators: [{
2245
2245
  type: Component,
2246
- args: [{ selector: 'euim-spinner', encapsulation: ViewEncapsulation.None, template: "<ion-spinner class=\"euim-spinner__icon\">\n</ion-spinner>\n<ng-content>\n</ng-content>\n\n\n", styles: [".euim-spinner{width:100%;margin:0;padding:0}.euim-spinner__icon{width:100%;height:var(--eui-base-spacing-2xl);color:var(--eui-base-color-primary)}.euim-spinner--size-2xs{font-size:var(--eui-base-font-size-2xs)}.euim-spinner--size-xs{font-size:var(--eui-base-font-size-xs)}.euim-spinner--size-s{font-size:var(--eui-base-font-size-s)}.euim-spinner--size-m{font-size:var(--eui-base-font-size-m)}.euim-spinner--size-l{font-size:var(--eui-base-font-size-l)}.euim-spinner--size-xl{font-size:var(--eui-base-font-size-xl)}.euim-spinner--size-2xl{font-size:var(--eui-base-font-size-2xl)}.euim-spinner--size-3xl{font-size:var(--eui-base-font-size-3xl)}.euim-spinner--size-4xl{font-size:var(--eui-base-font-size-4xl)}.euim-spinner--primary{color:var(--eui-base-color-primary-100)}.euim-spinner--secondary{color:var(--eui-base-color-grey-50)}.euim-spinner--info{color:var(--eui-base-color-info-100)}.euim-spinner--success{color:var(--eui-base-color-success-100)}.euim-spinner--warning{color:var(--eui-base-color-warning-100)}.euim-spinner--danger{color:var(--eui-base-color-danger-100)}.euim-spinner--accent{color:var(--eui-base-color-accent-100)}.euim-spinner-message{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;display:flex;justify-content:center;color:var(--eui-base-color-grey-75)}.euim-spinner-description{font:normal normal 400 .875rem/1rem var(--eui-base-font-family);display:flex;justify-content:center;color:var(--eui-base-color-grey-75);margin-top:var(--eui-base-spacing-2xs)}\n"] }]
2246
+ args: [{ selector: 'euim-spinner', encapsulation: ViewEncapsulation.None, template: "<ion-spinner class=\"euim-spinner__icon\">\n</ion-spinner>\n<ng-content>\n</ng-content>\n\n\n", styles: [".euim-spinner{width:100%;margin:0;padding:0}.euim-spinner__icon{width:100%;height:var(--eui-base-spacing-2xl);color:var(--eui-base-color-primary-100)}.euim-spinner--size-2xs{font-size:var(--eui-base-font-size-2xs)}.euim-spinner--size-xs{font-size:var(--eui-base-font-size-xs)}.euim-spinner--size-s{font-size:var(--eui-base-font-size-s)}.euim-spinner--size-m{font-size:var(--eui-base-font-size-m)}.euim-spinner--size-l{font-size:var(--eui-base-font-size-l)}.euim-spinner--size-xl{font-size:var(--eui-base-font-size-xl)}.euim-spinner--size-2xl{font-size:var(--eui-base-font-size-2xl)}.euim-spinner--size-3xl{font-size:var(--eui-base-font-size-3xl)}.euim-spinner--size-4xl{font-size:var(--eui-base-font-size-4xl)}.euim-spinner--primary{color:var(--eui-base-color-primary-100)}.euim-spinner--secondary{color:var(--eui-base-color-grey-50)}.euim-spinner--info{color:var(--eui-base-color-info-100)}.euim-spinner--success{color:var(--eui-base-color-success-100)}.euim-spinner--warning{color:var(--eui-base-color-warning-100)}.euim-spinner--danger{color:var(--eui-base-color-danger-100)}.euim-spinner--accent{color:var(--eui-base-color-accent-100)}.euim-spinner-message{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;display:flex;justify-content:center;color:var(--eui-base-color-grey-75)}.euim-spinner-description{font:normal normal 400 .875rem/1rem var(--eui-base-font-family);display:flex;justify-content:center;color:var(--eui-base-color-grey-75);margin-top:var(--eui-base-spacing-2xs)}\n"] }]
2247
2247
  }], propDecorators: { className: [{
2248
2248
  type: HostBinding,
2249
2249
  args: ['class']
@@ -2340,7 +2340,7 @@ class EuimMediaHeaderComponent {
2340
2340
  ].join(' ').trim();
2341
2341
  }
2342
2342
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMediaHeaderComponent, deps: [{ token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
2343
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimMediaHeaderComponent, selector: "euim-media-header", inputs: { euimNoGradient: "euimNoGradient" }, host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimSizeM", "euimSizeM", "euimSizeS", "euimSizeS", "euimSizeL", "euimSizeL"] }], ngImport: i0, template: "<ng-content select=\"[euimMediaHeaderImage]\"></ng-content>\n<div *ngIf=\"!euimNoGradient\" class=\"euim-media-header__gradient\">\n</div>\n<div class=\"euim-media-header__text\">\n <ng-content></ng-content>\n</div>\n", styles: [".euim-media-header{position:relative;display:flex}.euim-media-header__text{position:absolute;bottom:var(--eui-base-spacing-m);color:#fff;padding-left:var(--eui-base-spacing-m);padding-right:var(--eui-base-spacing-m)}.euim-media-header__text h4{margin-bottom:var(--eui-base-spacing-2xs);@eui-font (xl);font-weight:700;margin-top:0}.euim-media-header__text div{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-media-header__text .euim-media-header__title{@eui-font (xl);font-weight:700;color:var(--eui-base-color-white)}.euim-media-header__text .euim-media-header__sub-title{color:var(--eui-base-color-white);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-media-header__gradient{width:100%;height:100%;background:linear-gradient(to bottom,rgba(255,255,255,0),var(--eui-base-color-black) 100%);background-blend-mode:multiply;background-size:100%;position:absolute;inset:0}.euim-media-header__image{width:100%;height:100%;object-fit:cover}.euim-media-header__title{@eui-font (xl);font-weight:700;color:var(--eui-base-color-white)}.euim-media-header__sub-title{color:var(--eui-base-color-white);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-media-header__title+.euim-media-header__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-media-header__size-s{height:calc(var(--eui-base-spacing-m) * 8)}.euim-media-header__size-m{height:calc(var(--eui-base-spacing-m) * 16)}.euim-media-header__size-l{height:calc(var(--eui-base-spacing-m) * 25)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2343
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimMediaHeaderComponent, selector: "euim-media-header", inputs: { euimNoGradient: "euimNoGradient" }, host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimSizeM", "euimSizeM", "euimSizeS", "euimSizeS", "euimSizeL", "euimSizeL"] }], ngImport: i0, template: "<ng-content select=\"[euimMediaHeaderImage]\"></ng-content>\n@if (!euimNoGradient) {\n <div class=\"euim-media-header__gradient\">\n </div>\n}\n<div class=\"euim-media-header__text\">\n <ng-content></ng-content>\n</div>\n", styles: [".euim-media-header{position:relative;display:flex}.euim-media-header__text{position:absolute;bottom:var(--eui-base-spacing-m);color:#fff;padding-left:var(--eui-base-spacing-m);padding-right:var(--eui-base-spacing-m)}.euim-media-header__text h4{margin-bottom:var(--eui-base-spacing-2xs);font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family);font-weight:700;margin-top:0}.euim-media-header__text div{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-media-header__text .euim-media-header__title{font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-white)}.euim-media-header__text .euim-media-header__sub-title{color:var(--eui-base-color-white);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-media-header__gradient{width:100%;height:100%;background:linear-gradient(to bottom,rgba(255,255,255,0),var(--eui-base-color-black) 100%);background-blend-mode:multiply;background-size:100%;position:absolute;inset:0}.euim-media-header__image{width:100%;height:100%;object-fit:cover}.euim-media-header__title{font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-white)}.euim-media-header__sub-title{color:var(--eui-base-color-white);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-media-header__title+.euim-media-header__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-media-header__size-s{height:calc(var(--eui-base-spacing-m) * 8)}.euim-media-header__size-m{height:calc(var(--eui-base-spacing-m) * 16)}.euim-media-header__size-l{height:calc(var(--eui-base-spacing-m) * 25)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2344
2344
  }
2345
2345
  __decorate([
2346
2346
  coerceBoolean
@@ -2356,7 +2356,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
2356
2356
  'euimSizeL',
2357
2357
  ],
2358
2358
  },
2359
- ], template: "<ng-content select=\"[euimMediaHeaderImage]\"></ng-content>\n<div *ngIf=\"!euimNoGradient\" class=\"euim-media-header__gradient\">\n</div>\n<div class=\"euim-media-header__text\">\n <ng-content></ng-content>\n</div>\n", styles: [".euim-media-header{position:relative;display:flex}.euim-media-header__text{position:absolute;bottom:var(--eui-base-spacing-m);color:#fff;padding-left:var(--eui-base-spacing-m);padding-right:var(--eui-base-spacing-m)}.euim-media-header__text h4{margin-bottom:var(--eui-base-spacing-2xs);@eui-font (xl);font-weight:700;margin-top:0}.euim-media-header__text div{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-media-header__text .euim-media-header__title{@eui-font (xl);font-weight:700;color:var(--eui-base-color-white)}.euim-media-header__text .euim-media-header__sub-title{color:var(--eui-base-color-white);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-media-header__gradient{width:100%;height:100%;background:linear-gradient(to bottom,rgba(255,255,255,0),var(--eui-base-color-black) 100%);background-blend-mode:multiply;background-size:100%;position:absolute;inset:0}.euim-media-header__image{width:100%;height:100%;object-fit:cover}.euim-media-header__title{@eui-font (xl);font-weight:700;color:var(--eui-base-color-white)}.euim-media-header__sub-title{color:var(--eui-base-color-white);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-media-header__title+.euim-media-header__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-media-header__size-s{height:calc(var(--eui-base-spacing-m) * 8)}.euim-media-header__size-m{height:calc(var(--eui-base-spacing-m) * 16)}.euim-media-header__size-l{height:calc(var(--eui-base-spacing-m) * 25)}\n"] }]
2359
+ ], template: "<ng-content select=\"[euimMediaHeaderImage]\"></ng-content>\n@if (!euimNoGradient) {\n <div class=\"euim-media-header__gradient\">\n </div>\n}\n<div class=\"euim-media-header__text\">\n <ng-content></ng-content>\n</div>\n", styles: [".euim-media-header{position:relative;display:flex}.euim-media-header__text{position:absolute;bottom:var(--eui-base-spacing-m);color:#fff;padding-left:var(--eui-base-spacing-m);padding-right:var(--eui-base-spacing-m)}.euim-media-header__text h4{margin-bottom:var(--eui-base-spacing-2xs);font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family);font-weight:700;margin-top:0}.euim-media-header__text div{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-media-header__text .euim-media-header__title{font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-white)}.euim-media-header__text .euim-media-header__sub-title{color:var(--eui-base-color-white);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-media-header__gradient{width:100%;height:100%;background:linear-gradient(to bottom,rgba(255,255,255,0),var(--eui-base-color-black) 100%);background-blend-mode:multiply;background-size:100%;position:absolute;inset:0}.euim-media-header__image{width:100%;height:100%;object-fit:cover}.euim-media-header__title{font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-white)}.euim-media-header__sub-title{color:var(--eui-base-color-white);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-media-header__title+.euim-media-header__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-media-header__size-s{height:calc(var(--eui-base-spacing-m) * 8)}.euim-media-header__size-m{height:calc(var(--eui-base-spacing-m) * 16)}.euim-media-header__size-l{height:calc(var(--eui-base-spacing-m) * 25)}\n"] }]
2360
2360
  }], ctorParameters: () => [{ type: BaseStatesDirective }], propDecorators: { euimNoGradient: [{
2361
2361
  type: Input
2362
2362
  }], cssClasses: [{
@@ -2773,7 +2773,7 @@ class EuimAlertMessageComponent {
2773
2773
  this.euimClose.emit();
2774
2774
  }
2775
2775
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAlertMessageComponent, deps: [{ token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
2776
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimAlertMessageComponent, selector: "euim-alert-message", inputs: { euimLabelTruncate: "euimLabelTruncate", hasIcon: "hasIcon", isCloseable: "isCloseable" }, outputs: { euimClose: "euimClose" }, host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimInfo", "euimInfo", "euimSuccess", "euimSuccess", "euimWarning", "euimWarning", "euimDanger", "euimDanger", "euimPrimary", "euimPrimary", "euimDark", "euimDark", "euimLight", "euimLight", "euimClear", "euimClear", "euimVariant", "euimVariant", "color", "color"] }], ngImport: i0, template: "<div class=\"euim-alert-message__wrappericon\" *ngIf=\"hasIcon && isVisible\">\n <ion-icon *ngIf=\"hasIcon\" [name]=\"icon\" class=\"euim-alert-message__icon\"></ion-icon>\n</div>\n<div class=\"euim-alert-message__wrapper\" *ngIf=\"isVisible\">\n <div class=\"slotStart\">\n <ng-content select=\"[slotStart]\"></ng-content>\n </div>\n <div euimLabel [euimLabelTruncate]=\"euimLabelTruncate\">\n <ng-content></ng-content>\n </div>\n <div class=\"slotEnd\">\n <ng-content select=\"[slotEnd]\"></ng-content>\n </div>\n</div>\n\n<a *ngIf=\"isCloseable && isVisible\" role=\"button\" aria-label=\"Close Icon Button\" class=\"euim-alert-message__close\"\n (click)=\"onClose($event)\">\n <ion-icon name=\"close-sharp\" class=\"euim-alert-message__closeIcon\"></ion-icon>\n</a>\n", styles: [".euim-alert-message{width:100%;display:flex;align-items:center;font:normal normal 400 .875rem/1rem var(--eui-base-font-family);padding-left:var(--eui-base-spacing-m);padding-right:var(--eui-base-spacing-xs);padding-top:var(--eui-base-spacing-xs);padding-bottom:var(--eui-base-spacing-xs)}.euim-alert-message__wrapper{padding:0;margin:0;min-width:1px;display:flex;align-items:center;position:relative;flex-grow:1}.euim-alert-message .slotEnd{display:flex;align-items:center;margin-inline-start:auto;padding-left:var(--eui-base-spacing-xs)}.euim-alert-message .slotEnd ion-icon{width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m);display:flex}.euim-alert-message [slotStart]{display:flex;align-items:center;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);margin-inline-end:var(--eui-base-spacing-m)}.euim-alert-message__icon{align-items:center;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);margin-inline-end:var(--eui-base-spacing-m)}.euim-alert-message__closeIcon{align-items:center;width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m)}.euim-alert-message__wrappericon{align-items:center;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);margin-inline-end:var(--eui-base-spacing-m)}.euim-alert-message__close{padding:0;margin:0;width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m)}.euim-alert-message a{cursor:pointer}.euim-alert-message ion-badge[slotEnd]{display:flex}.euim-alert-message--danger{color:var(--eui-base-color-danger-120);background:var(--eui-base-color-danger-25)}.euim-alert-message--danger .euim-label{color:var(--eui-base-color-danger-120)}.euim-alert-message--danger ion-icon{color:var(--eui-base-color-danger-100)}.euim-alert-message--danger ion-badge[slotEnd],.euim-alert-message--danger ion-button[slotEnd],.euim-alert-message--danger ion-chip[slotEnd]{--background: var(--eui-base-color-danger-100);color:var(--eui-base-color-white)}.euim-alert-message--danger ion-badge[slotEnd] ion-icon,.euim-alert-message--danger ion-button[slotEnd] ion-icon,.euim-alert-message--danger ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--danger [slotEnd] ion-icon{color:var(--eui-base-color-danger-100)}.euim-alert-message--info{color:var(--eui-base-color-info-120);background:var(--eui-base-color-info-25)}.euim-alert-message--info .euim-label{color:var(--eui-base-color-info-120)}.euim-alert-message--info ion-icon{color:var(--eui-base-color-info-100)}.euim-alert-message--info ion-badge[slotEnd],.euim-alert-message--info ion-button[slotEnd],.euim-alert-message--info ion-chip[slotEnd]{--background: var(--eui-base-color-info-100);color:var(--eui-base-color-white)}.euim-alert-message--info ion-badge[slotEnd] ion-icon,.euim-alert-message--info ion-button[slotEnd] ion-icon,.euim-alert-message--info ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--info [slotEnd] ion-icon{color:var(--eui-base-color-info-100)}.euim-alert-message--success{color:var(--eui-base-color-success-120);background:var(--eui-base-color-success-25)}.euim-alert-message--success .euim-label{color:var(--eui-base-color-success-120)}.euim-alert-message--success ion-icon{color:var(--eui-base-color-success-100)}.euim-alert-message--success ion-badge[slotEnd],.euim-alert-message--success ion-button[slotEnd],.euim-alert-message--success ion-chip[slotEnd]{--background: var(--eui-base-color-success-100);color:var(--eui-base-color-white)}.euim-alert-message--success ion-badge[slotEnd] ion-icon,.euim-alert-message--success ion-button[slotEnd] ion-icon,.euim-alert-message--success ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--success [slotEnd] ion-icon{color:var(--eui-base-color-success-100)}.euim-alert-message--warning{color:var(--eui-base-color-warning-140);background:var(--eui-base-color-warning-25)}.euim-alert-message--warning .euim-label{color:var(--eui-base-color-warning-140)}.euim-alert-message--warning ion-icon{color:var(--eui-base-color-warning-120)}.euim-alert-message--warning ion-badge[slotEnd],.euim-alert-message--warning ion-button[slotEnd],.euim-alert-message--warning ion-chip[slotEnd]{--background: var(--eui-base-color-warning-120);color:var(--eui-base-color-white)}.euim-alert-message--warning ion-badge[slotEnd] ion-icon,.euim-alert-message--warning ion-button[slotEnd] ion-icon,.euim-alert-message--warning ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--warning [slotEnd] ion-icon{color:var(--eui-base-color-warning-120)}.euim-alert-message--dark{color:var(--eui-base-color-white);background:var(--eui-base-color-grey-100)}.euim-alert-message--dark ion-icon,.euim-alert-message--dark .euim-label{color:var(--eui-base-color-white)}.euim-alert-message--dark [slotEnd]{--background: var(--eui-base-color-grey-100);color:var(--eui-base-color-white)}.euim-alert-message--primary{color:var(--eui-base-color-white);background:var(--eui-base-color-primary-100)}.euim-alert-message--primary ion-icon,.euim-alert-message--primary .euim-label{color:var(--eui-base-color-white)}.euim-alert-message--primary [slotEnd]{--background: none;--border-color: var(--eui-base-color-grey-5);color:var(--eui-base-color-grey-5)}.euim-alert-message--light{color:var(--eui-base-color-grey-100);background:var(--eui-base-color-grey-5)}.euim-alert-message--light ion-icon,.euim-alert-message--light .euim-label{color:var(--eui-base-color-grey-100)}.euim-alert-message--light [slotEnd]{--background: var(--eui-base-color-grey-5);color:var(--eui-base-color-grey-100)}.euim-alert-message--default{color:var(--eui-base-color-black);background:none}.euim-alert-message--default ion-icon,.euim-alert-message--default .euim-label{color:var(--eui-base-color-black)}.euim-alert-message--clear{color:var(--eui-base-color-grey-100);background:none}.euim-alert-message--clear ion-icon,.euim-alert-message--clear .euim-label{color:var(--eui-base-color-grey-100)}.euim-alert-message--hidden{display:none}.euim-alert-message [slotEnd]{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.euim-alert-message ion-badge[slotEnd]{padding-right:var(--eui-base-spacing-xs);padding-left:var(--eui-base-spacing-xs)}.euim-alert-message ion-badge[slotEnd] ion-icon{padding-left:var(--eui-base-spacing-2xs)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: EuimLabelComponent, selector: "div[euimLabel], p[euimLabel], span[euimLabel], euim-label", inputs: ["euimLabelTruncateWithLines", "euimLabelTitle", "euimLabelSubTitle", "euimLabelMeta", "euimLabelTruncate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2776
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimAlertMessageComponent, selector: "euim-alert-message", inputs: { euimLabelTruncate: "euimLabelTruncate", hasIcon: "hasIcon", isCloseable: "isCloseable" }, outputs: { euimClose: "euimClose" }, host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimInfo", "euimInfo", "euimSuccess", "euimSuccess", "euimWarning", "euimWarning", "euimDanger", "euimDanger", "euimPrimary", "euimPrimary", "euimDark", "euimDark", "euimLight", "euimLight", "euimClear", "euimClear", "euimVariant", "euimVariant", "color", "color"] }], ngImport: i0, template: "@if (hasIcon && isVisible) {\n <div class=\"euim-alert-message__wrappericon\">\n @if (hasIcon) {\n <ion-icon [name]=\"icon\" class=\"euim-alert-message__icon\"></ion-icon>\n }\n </div>\n}\n@if (isVisible) {\n <div class=\"euim-alert-message__wrapper\">\n <div class=\"slotStart\">\n <ng-content select=\"[slotStart]\"></ng-content>\n </div>\n <div euimLabel [euimLabelTruncate]=\"euimLabelTruncate\">\n <ng-content></ng-content>\n </div>\n <div class=\"slotEnd\">\n <ng-content select=\"[slotEnd]\"></ng-content>\n </div>\n </div>\n}\n\n@if (isCloseable && isVisible) {\n <a role=\"button\" aria-label=\"Close Icon Button\" class=\"euim-alert-message__close\"\n (click)=\"onClose($event)\">\n <ion-icon name=\"close-sharp\" class=\"euim-alert-message__closeIcon\"></ion-icon>\n </a>\n}\n", styles: [".euim-alert-message{width:100%;display:flex;align-items:center;font:normal normal 400 .875rem/1rem var(--eui-base-font-family);padding-left:var(--eui-base-spacing-m);padding-right:var(--eui-base-spacing-xs);padding-top:var(--eui-base-spacing-xs);padding-bottom:var(--eui-base-spacing-xs)}.euim-alert-message__wrapper{padding:0;margin:0;min-width:1px;display:flex;align-items:center;position:relative;flex-grow:1}.euim-alert-message .slotEnd{display:flex;align-items:center;margin-inline-start:auto;padding-left:var(--eui-base-spacing-xs)}.euim-alert-message .slotEnd ion-icon{width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m);display:flex}.euim-alert-message [slotStart]{display:flex;align-items:center;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);margin-inline-end:var(--eui-base-spacing-m)}.euim-alert-message__icon{align-items:center;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);margin-inline-end:var(--eui-base-spacing-m)}.euim-alert-message__closeIcon{align-items:center;width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m)}.euim-alert-message__wrappericon{align-items:center;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);margin-inline-end:var(--eui-base-spacing-m)}.euim-alert-message__close{padding:0;margin:0;width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m)}.euim-alert-message a{cursor:pointer}.euim-alert-message ion-badge[slotEnd]{display:flex}.euim-alert-message--danger{color:var(--eui-base-color-danger-120);background:var(--eui-base-color-danger-25)}.euim-alert-message--danger .euim-label{color:var(--eui-base-color-danger-120)}.euim-alert-message--danger ion-icon{color:var(--eui-base-color-danger-100)}.euim-alert-message--danger ion-badge[slotEnd],.euim-alert-message--danger ion-button[slotEnd],.euim-alert-message--danger ion-chip[slotEnd]{--background: var(--eui-base-color-danger-100);color:var(--eui-base-color-white)}.euim-alert-message--danger ion-badge[slotEnd] ion-icon,.euim-alert-message--danger ion-button[slotEnd] ion-icon,.euim-alert-message--danger ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--danger [slotEnd] ion-icon{color:var(--eui-base-color-danger-100)}.euim-alert-message--info{color:var(--eui-base-color-info-120);background:var(--eui-base-color-info-25)}.euim-alert-message--info .euim-label{color:var(--eui-base-color-info-120)}.euim-alert-message--info ion-icon{color:var(--eui-base-color-info-100)}.euim-alert-message--info ion-badge[slotEnd],.euim-alert-message--info ion-button[slotEnd],.euim-alert-message--info ion-chip[slotEnd]{--background: var(--eui-base-color-info-100);color:var(--eui-base-color-white)}.euim-alert-message--info ion-badge[slotEnd] ion-icon,.euim-alert-message--info ion-button[slotEnd] ion-icon,.euim-alert-message--info ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--info [slotEnd] ion-icon{color:var(--eui-base-color-info-100)}.euim-alert-message--success{color:var(--eui-base-color-success-120);background:var(--eui-base-color-success-25)}.euim-alert-message--success .euim-label{color:var(--eui-base-color-success-120)}.euim-alert-message--success ion-icon{color:var(--eui-base-color-success-100)}.euim-alert-message--success ion-badge[slotEnd],.euim-alert-message--success ion-button[slotEnd],.euim-alert-message--success ion-chip[slotEnd]{--background: var(--eui-base-color-success-100);color:var(--eui-base-color-white)}.euim-alert-message--success ion-badge[slotEnd] ion-icon,.euim-alert-message--success ion-button[slotEnd] ion-icon,.euim-alert-message--success ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--success [slotEnd] ion-icon{color:var(--eui-base-color-success-100)}.euim-alert-message--warning{color:var(--eui-base-color-warning-140);background:var(--eui-base-color-warning-25)}.euim-alert-message--warning .euim-label{color:var(--eui-base-color-warning-140)}.euim-alert-message--warning ion-icon{color:var(--eui-base-color-warning-120)}.euim-alert-message--warning ion-badge[slotEnd],.euim-alert-message--warning ion-button[slotEnd],.euim-alert-message--warning ion-chip[slotEnd]{--background: var(--eui-base-color-warning-120);color:var(--eui-base-color-white)}.euim-alert-message--warning ion-badge[slotEnd] ion-icon,.euim-alert-message--warning ion-button[slotEnd] ion-icon,.euim-alert-message--warning ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--warning [slotEnd] ion-icon{color:var(--eui-base-color-warning-120)}.euim-alert-message--dark{color:var(--eui-base-color-white);background:var(--eui-base-color-grey-100)}.euim-alert-message--dark ion-icon,.euim-alert-message--dark .euim-label{color:var(--eui-base-color-white)}.euim-alert-message--dark [slotEnd]{--background: var(--eui-base-color-grey-100);color:var(--eui-base-color-white)}.euim-alert-message--primary{color:var(--eui-base-color-white);background:var(--eui-base-color-primary-100)}.euim-alert-message--primary ion-icon,.euim-alert-message--primary .euim-label{color:var(--eui-base-color-white)}.euim-alert-message--primary [slotEnd]{--background: none;--border-color: var(--eui-base-color-grey-5);color:var(--eui-base-color-grey-5)}.euim-alert-message--light{color:var(--eui-base-color-grey-100);background:var(--eui-base-color-grey-5)}.euim-alert-message--light ion-icon,.euim-alert-message--light .euim-label{color:var(--eui-base-color-grey-100)}.euim-alert-message--light [slotEnd]{--background: var(--eui-base-color-grey-5);color:var(--eui-base-color-grey-100)}.euim-alert-message--default{color:var(--eui-base-color-black);background:none}.euim-alert-message--default ion-icon,.euim-alert-message--default .euim-label{color:var(--eui-base-color-black)}.euim-alert-message--clear{color:var(--eui-base-color-grey-100);background:none}.euim-alert-message--clear ion-icon,.euim-alert-message--clear .euim-label{color:var(--eui-base-color-grey-100)}.euim-alert-message--hidden{display:none}.euim-alert-message [slotEnd]{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.euim-alert-message ion-badge[slotEnd]{padding-right:var(--eui-base-spacing-xs);padding-left:var(--eui-base-spacing-xs)}.euim-alert-message ion-badge[slotEnd] ion-icon{padding-left:var(--eui-base-spacing-2xs)}\n"], dependencies: [{ kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: EuimLabelComponent, selector: "div[euimLabel], p[euimLabel], span[euimLabel], euim-label", inputs: ["euimLabelTruncateWithLines", "euimLabelTitle", "euimLabelSubTitle", "euimLabelMeta", "euimLabelTruncate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2777
2777
  }
2778
2778
  __decorate([
2779
2779
  coerceBoolean
@@ -2802,7 +2802,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
2802
2802
  'color',
2803
2803
  ],
2804
2804
  },
2805
- ], template: "<div class=\"euim-alert-message__wrappericon\" *ngIf=\"hasIcon && isVisible\">\n <ion-icon *ngIf=\"hasIcon\" [name]=\"icon\" class=\"euim-alert-message__icon\"></ion-icon>\n</div>\n<div class=\"euim-alert-message__wrapper\" *ngIf=\"isVisible\">\n <div class=\"slotStart\">\n <ng-content select=\"[slotStart]\"></ng-content>\n </div>\n <div euimLabel [euimLabelTruncate]=\"euimLabelTruncate\">\n <ng-content></ng-content>\n </div>\n <div class=\"slotEnd\">\n <ng-content select=\"[slotEnd]\"></ng-content>\n </div>\n</div>\n\n<a *ngIf=\"isCloseable && isVisible\" role=\"button\" aria-label=\"Close Icon Button\" class=\"euim-alert-message__close\"\n (click)=\"onClose($event)\">\n <ion-icon name=\"close-sharp\" class=\"euim-alert-message__closeIcon\"></ion-icon>\n</a>\n", styles: [".euim-alert-message{width:100%;display:flex;align-items:center;font:normal normal 400 .875rem/1rem var(--eui-base-font-family);padding-left:var(--eui-base-spacing-m);padding-right:var(--eui-base-spacing-xs);padding-top:var(--eui-base-spacing-xs);padding-bottom:var(--eui-base-spacing-xs)}.euim-alert-message__wrapper{padding:0;margin:0;min-width:1px;display:flex;align-items:center;position:relative;flex-grow:1}.euim-alert-message .slotEnd{display:flex;align-items:center;margin-inline-start:auto;padding-left:var(--eui-base-spacing-xs)}.euim-alert-message .slotEnd ion-icon{width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m);display:flex}.euim-alert-message [slotStart]{display:flex;align-items:center;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);margin-inline-end:var(--eui-base-spacing-m)}.euim-alert-message__icon{align-items:center;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);margin-inline-end:var(--eui-base-spacing-m)}.euim-alert-message__closeIcon{align-items:center;width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m)}.euim-alert-message__wrappericon{align-items:center;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);margin-inline-end:var(--eui-base-spacing-m)}.euim-alert-message__close{padding:0;margin:0;width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m)}.euim-alert-message a{cursor:pointer}.euim-alert-message ion-badge[slotEnd]{display:flex}.euim-alert-message--danger{color:var(--eui-base-color-danger-120);background:var(--eui-base-color-danger-25)}.euim-alert-message--danger .euim-label{color:var(--eui-base-color-danger-120)}.euim-alert-message--danger ion-icon{color:var(--eui-base-color-danger-100)}.euim-alert-message--danger ion-badge[slotEnd],.euim-alert-message--danger ion-button[slotEnd],.euim-alert-message--danger ion-chip[slotEnd]{--background: var(--eui-base-color-danger-100);color:var(--eui-base-color-white)}.euim-alert-message--danger ion-badge[slotEnd] ion-icon,.euim-alert-message--danger ion-button[slotEnd] ion-icon,.euim-alert-message--danger ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--danger [slotEnd] ion-icon{color:var(--eui-base-color-danger-100)}.euim-alert-message--info{color:var(--eui-base-color-info-120);background:var(--eui-base-color-info-25)}.euim-alert-message--info .euim-label{color:var(--eui-base-color-info-120)}.euim-alert-message--info ion-icon{color:var(--eui-base-color-info-100)}.euim-alert-message--info ion-badge[slotEnd],.euim-alert-message--info ion-button[slotEnd],.euim-alert-message--info ion-chip[slotEnd]{--background: var(--eui-base-color-info-100);color:var(--eui-base-color-white)}.euim-alert-message--info ion-badge[slotEnd] ion-icon,.euim-alert-message--info ion-button[slotEnd] ion-icon,.euim-alert-message--info ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--info [slotEnd] ion-icon{color:var(--eui-base-color-info-100)}.euim-alert-message--success{color:var(--eui-base-color-success-120);background:var(--eui-base-color-success-25)}.euim-alert-message--success .euim-label{color:var(--eui-base-color-success-120)}.euim-alert-message--success ion-icon{color:var(--eui-base-color-success-100)}.euim-alert-message--success ion-badge[slotEnd],.euim-alert-message--success ion-button[slotEnd],.euim-alert-message--success ion-chip[slotEnd]{--background: var(--eui-base-color-success-100);color:var(--eui-base-color-white)}.euim-alert-message--success ion-badge[slotEnd] ion-icon,.euim-alert-message--success ion-button[slotEnd] ion-icon,.euim-alert-message--success ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--success [slotEnd] ion-icon{color:var(--eui-base-color-success-100)}.euim-alert-message--warning{color:var(--eui-base-color-warning-140);background:var(--eui-base-color-warning-25)}.euim-alert-message--warning .euim-label{color:var(--eui-base-color-warning-140)}.euim-alert-message--warning ion-icon{color:var(--eui-base-color-warning-120)}.euim-alert-message--warning ion-badge[slotEnd],.euim-alert-message--warning ion-button[slotEnd],.euim-alert-message--warning ion-chip[slotEnd]{--background: var(--eui-base-color-warning-120);color:var(--eui-base-color-white)}.euim-alert-message--warning ion-badge[slotEnd] ion-icon,.euim-alert-message--warning ion-button[slotEnd] ion-icon,.euim-alert-message--warning ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--warning [slotEnd] ion-icon{color:var(--eui-base-color-warning-120)}.euim-alert-message--dark{color:var(--eui-base-color-white);background:var(--eui-base-color-grey-100)}.euim-alert-message--dark ion-icon,.euim-alert-message--dark .euim-label{color:var(--eui-base-color-white)}.euim-alert-message--dark [slotEnd]{--background: var(--eui-base-color-grey-100);color:var(--eui-base-color-white)}.euim-alert-message--primary{color:var(--eui-base-color-white);background:var(--eui-base-color-primary-100)}.euim-alert-message--primary ion-icon,.euim-alert-message--primary .euim-label{color:var(--eui-base-color-white)}.euim-alert-message--primary [slotEnd]{--background: none;--border-color: var(--eui-base-color-grey-5);color:var(--eui-base-color-grey-5)}.euim-alert-message--light{color:var(--eui-base-color-grey-100);background:var(--eui-base-color-grey-5)}.euim-alert-message--light ion-icon,.euim-alert-message--light .euim-label{color:var(--eui-base-color-grey-100)}.euim-alert-message--light [slotEnd]{--background: var(--eui-base-color-grey-5);color:var(--eui-base-color-grey-100)}.euim-alert-message--default{color:var(--eui-base-color-black);background:none}.euim-alert-message--default ion-icon,.euim-alert-message--default .euim-label{color:var(--eui-base-color-black)}.euim-alert-message--clear{color:var(--eui-base-color-grey-100);background:none}.euim-alert-message--clear ion-icon,.euim-alert-message--clear .euim-label{color:var(--eui-base-color-grey-100)}.euim-alert-message--hidden{display:none}.euim-alert-message [slotEnd]{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.euim-alert-message ion-badge[slotEnd]{padding-right:var(--eui-base-spacing-xs);padding-left:var(--eui-base-spacing-xs)}.euim-alert-message ion-badge[slotEnd] ion-icon{padding-left:var(--eui-base-spacing-2xs)}\n"] }]
2805
+ ], template: "@if (hasIcon && isVisible) {\n <div class=\"euim-alert-message__wrappericon\">\n @if (hasIcon) {\n <ion-icon [name]=\"icon\" class=\"euim-alert-message__icon\"></ion-icon>\n }\n </div>\n}\n@if (isVisible) {\n <div class=\"euim-alert-message__wrapper\">\n <div class=\"slotStart\">\n <ng-content select=\"[slotStart]\"></ng-content>\n </div>\n <div euimLabel [euimLabelTruncate]=\"euimLabelTruncate\">\n <ng-content></ng-content>\n </div>\n <div class=\"slotEnd\">\n <ng-content select=\"[slotEnd]\"></ng-content>\n </div>\n </div>\n}\n\n@if (isCloseable && isVisible) {\n <a role=\"button\" aria-label=\"Close Icon Button\" class=\"euim-alert-message__close\"\n (click)=\"onClose($event)\">\n <ion-icon name=\"close-sharp\" class=\"euim-alert-message__closeIcon\"></ion-icon>\n </a>\n}\n", styles: [".euim-alert-message{width:100%;display:flex;align-items:center;font:normal normal 400 .875rem/1rem var(--eui-base-font-family);padding-left:var(--eui-base-spacing-m);padding-right:var(--eui-base-spacing-xs);padding-top:var(--eui-base-spacing-xs);padding-bottom:var(--eui-base-spacing-xs)}.euim-alert-message__wrapper{padding:0;margin:0;min-width:1px;display:flex;align-items:center;position:relative;flex-grow:1}.euim-alert-message .slotEnd{display:flex;align-items:center;margin-inline-start:auto;padding-left:var(--eui-base-spacing-xs)}.euim-alert-message .slotEnd ion-icon{width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m);display:flex}.euim-alert-message [slotStart]{display:flex;align-items:center;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);margin-inline-end:var(--eui-base-spacing-m)}.euim-alert-message__icon{align-items:center;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);margin-inline-end:var(--eui-base-spacing-m)}.euim-alert-message__closeIcon{align-items:center;width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m)}.euim-alert-message__wrappericon{align-items:center;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);margin-inline-end:var(--eui-base-spacing-m)}.euim-alert-message__close{padding:0;margin:0;width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m)}.euim-alert-message a{cursor:pointer}.euim-alert-message ion-badge[slotEnd]{display:flex}.euim-alert-message--danger{color:var(--eui-base-color-danger-120);background:var(--eui-base-color-danger-25)}.euim-alert-message--danger .euim-label{color:var(--eui-base-color-danger-120)}.euim-alert-message--danger ion-icon{color:var(--eui-base-color-danger-100)}.euim-alert-message--danger ion-badge[slotEnd],.euim-alert-message--danger ion-button[slotEnd],.euim-alert-message--danger ion-chip[slotEnd]{--background: var(--eui-base-color-danger-100);color:var(--eui-base-color-white)}.euim-alert-message--danger ion-badge[slotEnd] ion-icon,.euim-alert-message--danger ion-button[slotEnd] ion-icon,.euim-alert-message--danger ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--danger [slotEnd] ion-icon{color:var(--eui-base-color-danger-100)}.euim-alert-message--info{color:var(--eui-base-color-info-120);background:var(--eui-base-color-info-25)}.euim-alert-message--info .euim-label{color:var(--eui-base-color-info-120)}.euim-alert-message--info ion-icon{color:var(--eui-base-color-info-100)}.euim-alert-message--info ion-badge[slotEnd],.euim-alert-message--info ion-button[slotEnd],.euim-alert-message--info ion-chip[slotEnd]{--background: var(--eui-base-color-info-100);color:var(--eui-base-color-white)}.euim-alert-message--info ion-badge[slotEnd] ion-icon,.euim-alert-message--info ion-button[slotEnd] ion-icon,.euim-alert-message--info ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--info [slotEnd] ion-icon{color:var(--eui-base-color-info-100)}.euim-alert-message--success{color:var(--eui-base-color-success-120);background:var(--eui-base-color-success-25)}.euim-alert-message--success .euim-label{color:var(--eui-base-color-success-120)}.euim-alert-message--success ion-icon{color:var(--eui-base-color-success-100)}.euim-alert-message--success ion-badge[slotEnd],.euim-alert-message--success ion-button[slotEnd],.euim-alert-message--success ion-chip[slotEnd]{--background: var(--eui-base-color-success-100);color:var(--eui-base-color-white)}.euim-alert-message--success ion-badge[slotEnd] ion-icon,.euim-alert-message--success ion-button[slotEnd] ion-icon,.euim-alert-message--success ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--success [slotEnd] ion-icon{color:var(--eui-base-color-success-100)}.euim-alert-message--warning{color:var(--eui-base-color-warning-140);background:var(--eui-base-color-warning-25)}.euim-alert-message--warning .euim-label{color:var(--eui-base-color-warning-140)}.euim-alert-message--warning ion-icon{color:var(--eui-base-color-warning-120)}.euim-alert-message--warning ion-badge[slotEnd],.euim-alert-message--warning ion-button[slotEnd],.euim-alert-message--warning ion-chip[slotEnd]{--background: var(--eui-base-color-warning-120);color:var(--eui-base-color-white)}.euim-alert-message--warning ion-badge[slotEnd] ion-icon,.euim-alert-message--warning ion-button[slotEnd] ion-icon,.euim-alert-message--warning ion-chip[slotEnd] ion-icon{color:var(--eui-base-color-white)}.euim-alert-message--warning [slotEnd] ion-icon{color:var(--eui-base-color-warning-120)}.euim-alert-message--dark{color:var(--eui-base-color-white);background:var(--eui-base-color-grey-100)}.euim-alert-message--dark ion-icon,.euim-alert-message--dark .euim-label{color:var(--eui-base-color-white)}.euim-alert-message--dark [slotEnd]{--background: var(--eui-base-color-grey-100);color:var(--eui-base-color-white)}.euim-alert-message--primary{color:var(--eui-base-color-white);background:var(--eui-base-color-primary-100)}.euim-alert-message--primary ion-icon,.euim-alert-message--primary .euim-label{color:var(--eui-base-color-white)}.euim-alert-message--primary [slotEnd]{--background: none;--border-color: var(--eui-base-color-grey-5);color:var(--eui-base-color-grey-5)}.euim-alert-message--light{color:var(--eui-base-color-grey-100);background:var(--eui-base-color-grey-5)}.euim-alert-message--light ion-icon,.euim-alert-message--light .euim-label{color:var(--eui-base-color-grey-100)}.euim-alert-message--light [slotEnd]{--background: var(--eui-base-color-grey-5);color:var(--eui-base-color-grey-100)}.euim-alert-message--default{color:var(--eui-base-color-black);background:none}.euim-alert-message--default ion-icon,.euim-alert-message--default .euim-label{color:var(--eui-base-color-black)}.euim-alert-message--clear{color:var(--eui-base-color-grey-100);background:none}.euim-alert-message--clear ion-icon,.euim-alert-message--clear .euim-label{color:var(--eui-base-color-grey-100)}.euim-alert-message--hidden{display:none}.euim-alert-message [slotEnd]{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.euim-alert-message ion-badge[slotEnd]{padding-right:var(--eui-base-spacing-xs);padding-left:var(--eui-base-spacing-xs)}.euim-alert-message ion-badge[slotEnd] ion-icon{padding-left:var(--eui-base-spacing-2xs)}\n"] }]
2806
2806
  }], ctorParameters: () => [{ type: BaseStatesDirective }], propDecorators: { euimClose: [{
2807
2807
  type: Output
2808
2808
  }], euimLabelTruncate: [{
@@ -2968,7 +2968,7 @@ class EuimSliderComponent {
2968
2968
  this.leftBtnActionClicked.emit(event);
2969
2969
  }
2970
2970
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSliderComponent, deps: [{ token: i0.Renderer2 }, { token: i1.GestureController }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
2971
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimSliderComponent, selector: "euim-slider", inputs: { actionBtnNames: "actionBtnNames", isLeftBtnVisible: "isLeftBtnVisible", isPreviousBtn: "isPreviousBtn", isNextBtn: "isNextBtn" }, outputs: { actionClicked: "actionClicked", lastStepActionClicked: "lastStepActionClicked", leftBtnActionClicked: "leftBtnActionClicked" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class": "this.className" } }, viewQueries: [{ propertyName: "slides", first: true, predicate: ["slides"], descendants: true, static: true }], ngImport: i0, template: "<div #sliderElement class=\"euim-slider__slider-container\">\n <div #slides class=\"euim-slider__slides\">\n <ng-content></ng-content>\n </div>\n <div class=\"euim-slider__pagination-container\">\n <ion-button (click)=\"onLeftBtnAction($event)\" *ngIf=isLeftBtnVisible class=\"euim-slider__action-button euim-slider__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftActionBtnName}}</ion-button>\n <div class=\"euim-slider__pagination\">\n <span (click)=\"goToSlide(i)\" *ngFor=\"let slide of slidesArray; let i = index\"\n [ngClass]=\"{ 'active': currentSlide === i }\"\n class=\"euim-slider__span\"></span>\n </div>\n <ion-button (click)=\"onAction($event)\" *ngIf=\"!isLastItemReached && !isNextBtn || isNextBtn && isRightBtnVisible\" class=\"euim-slider__action-button euim-slider__action-button--right\"\n fill=\"clear\">{{actionBtnNames.actionBtnName}}</ion-button>\n <ion-button (click)=\"onLastStepAction($event)\" *ngIf=isLastItemReached class=\"euim-slider__action-button euim-slider__action-button--right\"\n fill=\"clear\">{{actionBtnNames.lastStepActionBtnName}}</ion-button>\n </div>\n</div>\n", styles: [".euim-slider__slider-container{overflow:hidden;position:relative;height:100vh}.euim-slider__slides{display:flex;transition:all .5s ease;width:100%}.euim-slider__slide{width:100%}.euim-slider__pagination-container{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;height:60px}.euim-slider__pagination{display:flex}.euim-slider__span{width:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);height:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);border-radius:50%;cursor:pointer;border:1px solid var(--eui-base-color-primary)}.euim-slider__span:not(:last-child){margin-right:var(--eui-base-spacing-xs)}.euim-slider__span.active{background-color:var(--eui-base-color-primary)}.euim-slider__action-button{position:absolute;color:var(--eui-base-color-primary);font-weight:700;top:50%;transform:translateY(-50%)}.euim-slider__action-button::part(native){padding:0 var(--eui-base-spacing-m)}.euim-slider__action-button--right{right:0;margin:0 var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-m)}.euim-slider__action-button--left{margin:0 var(--eui-base-spacing-m) 0 var(--eui-base-spacing-xs);left:0}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }] }); }
2971
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimSliderComponent, selector: "euim-slider", inputs: { actionBtnNames: "actionBtnNames", isLeftBtnVisible: "isLeftBtnVisible", isPreviousBtn: "isPreviousBtn", isNextBtn: "isNextBtn" }, outputs: { actionClicked: "actionClicked", lastStepActionClicked: "lastStepActionClicked", leftBtnActionClicked: "leftBtnActionClicked" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class": "this.className" } }, viewQueries: [{ propertyName: "slides", first: true, predicate: ["slides"], descendants: true, static: true }], ngImport: i0, template: "<div #sliderElement class=\"euim-slider__slider-container\">\n <div #slides class=\"euim-slider__slides\">\n <ng-content></ng-content>\n </div>\n <div class=\"euim-slider__pagination-container\">\n @if (isLeftBtnVisible) {\n <ion-button (click)=\"onLeftBtnAction($event)\"class=\"euim-slider__action-button euim-slider__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftActionBtnName}}</ion-button>\n }\n <div class=\"euim-slider__pagination\">\n @for (slide of slidesArray; track slide; let i = $index) {\n <span (click)=\"goToSlide(i)\"\n [ngClass]=\"{ 'active': currentSlide === i }\"\n class=\"euim-slider__span\"></span>\n }\n </div>\n @if (!isLastItemReached && !isNextBtn || isNextBtn && isRightBtnVisible) {\n <ion-button (click)=\"onAction($event)\" class=\"euim-slider__action-button euim-slider__action-button--right\"\n fill=\"clear\">{{actionBtnNames.actionBtnName}}</ion-button>\n }\n @if (isLastItemReached) {\n <ion-button (click)=\"onLastStepAction($event)\"class=\"euim-slider__action-button euim-slider__action-button--right\"\n fill=\"clear\">{{actionBtnNames.lastStepActionBtnName}}</ion-button>\n }\n </div>\n</div>\n", styles: [".euim-slider__slider-container{overflow:hidden;position:relative;height:100vh}.euim-slider__slides{display:flex;transition:all .5s ease;width:100%}.euim-slider__slide{width:100%}.euim-slider__pagination-container{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;height:60px}.euim-slider__pagination{display:flex}.euim-slider__span{width:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);height:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);border-radius:50%;cursor:pointer;border:1px solid var(--eui-base-color-primary-100)}.euim-slider__span:not(:last-child){margin-right:var(--eui-base-spacing-xs)}.euim-slider__span.active{background-color:var(--eui-base-color-primary-100)}.euim-slider__action-button{position:absolute;color:var(--eui-base-color-primary-100);font-weight:700;top:50%;transform:translateY(-50%)}.euim-slider__action-button::part(native){padding:0 var(--eui-base-spacing-m)}.euim-slider__action-button--right{right:0;margin:0 var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-m)}.euim-slider__action-button--left{margin:0 var(--eui-base-spacing-m) 0 var(--eui-base-spacing-xs);left:0}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }] }); }
2972
2972
  }
2973
2973
  __decorate([
2974
2974
  coerceBoolean
@@ -2987,7 +2987,7 @@ __decorate([
2987
2987
  ], EuimSliderComponent.prototype, "isRightBtnVisible", void 0);
2988
2988
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSliderComponent, decorators: [{
2989
2989
  type: Component,
2990
- args: [{ selector: 'euim-slider', template: "<div #sliderElement class=\"euim-slider__slider-container\">\n <div #slides class=\"euim-slider__slides\">\n <ng-content></ng-content>\n </div>\n <div class=\"euim-slider__pagination-container\">\n <ion-button (click)=\"onLeftBtnAction($event)\" *ngIf=isLeftBtnVisible class=\"euim-slider__action-button euim-slider__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftActionBtnName}}</ion-button>\n <div class=\"euim-slider__pagination\">\n <span (click)=\"goToSlide(i)\" *ngFor=\"let slide of slidesArray; let i = index\"\n [ngClass]=\"{ 'active': currentSlide === i }\"\n class=\"euim-slider__span\"></span>\n </div>\n <ion-button (click)=\"onAction($event)\" *ngIf=\"!isLastItemReached && !isNextBtn || isNextBtn && isRightBtnVisible\" class=\"euim-slider__action-button euim-slider__action-button--right\"\n fill=\"clear\">{{actionBtnNames.actionBtnName}}</ion-button>\n <ion-button (click)=\"onLastStepAction($event)\" *ngIf=isLastItemReached class=\"euim-slider__action-button euim-slider__action-button--right\"\n fill=\"clear\">{{actionBtnNames.lastStepActionBtnName}}</ion-button>\n </div>\n</div>\n", styles: [".euim-slider__slider-container{overflow:hidden;position:relative;height:100vh}.euim-slider__slides{display:flex;transition:all .5s ease;width:100%}.euim-slider__slide{width:100%}.euim-slider__pagination-container{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;height:60px}.euim-slider__pagination{display:flex}.euim-slider__span{width:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);height:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);border-radius:50%;cursor:pointer;border:1px solid var(--eui-base-color-primary)}.euim-slider__span:not(:last-child){margin-right:var(--eui-base-spacing-xs)}.euim-slider__span.active{background-color:var(--eui-base-color-primary)}.euim-slider__action-button{position:absolute;color:var(--eui-base-color-primary);font-weight:700;top:50%;transform:translateY(-50%)}.euim-slider__action-button::part(native){padding:0 var(--eui-base-spacing-m)}.euim-slider__action-button--right{right:0;margin:0 var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-m)}.euim-slider__action-button--left{margin:0 var(--eui-base-spacing-m) 0 var(--eui-base-spacing-xs);left:0}\n"] }]
2990
+ args: [{ selector: 'euim-slider', template: "<div #sliderElement class=\"euim-slider__slider-container\">\n <div #slides class=\"euim-slider__slides\">\n <ng-content></ng-content>\n </div>\n <div class=\"euim-slider__pagination-container\">\n @if (isLeftBtnVisible) {\n <ion-button (click)=\"onLeftBtnAction($event)\"class=\"euim-slider__action-button euim-slider__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftActionBtnName}}</ion-button>\n }\n <div class=\"euim-slider__pagination\">\n @for (slide of slidesArray; track slide; let i = $index) {\n <span (click)=\"goToSlide(i)\"\n [ngClass]=\"{ 'active': currentSlide === i }\"\n class=\"euim-slider__span\"></span>\n }\n </div>\n @if (!isLastItemReached && !isNextBtn || isNextBtn && isRightBtnVisible) {\n <ion-button (click)=\"onAction($event)\" class=\"euim-slider__action-button euim-slider__action-button--right\"\n fill=\"clear\">{{actionBtnNames.actionBtnName}}</ion-button>\n }\n @if (isLastItemReached) {\n <ion-button (click)=\"onLastStepAction($event)\"class=\"euim-slider__action-button euim-slider__action-button--right\"\n fill=\"clear\">{{actionBtnNames.lastStepActionBtnName}}</ion-button>\n }\n </div>\n</div>\n", styles: [".euim-slider__slider-container{overflow:hidden;position:relative;height:100vh}.euim-slider__slides{display:flex;transition:all .5s ease;width:100%}.euim-slider__slide{width:100%}.euim-slider__pagination-container{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;height:60px}.euim-slider__pagination{display:flex}.euim-slider__span{width:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);height:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);border-radius:50%;cursor:pointer;border:1px solid var(--eui-base-color-primary-100)}.euim-slider__span:not(:last-child){margin-right:var(--eui-base-spacing-xs)}.euim-slider__span.active{background-color:var(--eui-base-color-primary-100)}.euim-slider__action-button{position:absolute;color:var(--eui-base-color-primary-100);font-weight:700;top:50%;transform:translateY(-50%)}.euim-slider__action-button::part(native){padding:0 var(--eui-base-spacing-m)}.euim-slider__action-button--right{right:0;margin:0 var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-m)}.euim-slider__action-button--left{margin:0 var(--eui-base-spacing-m) 0 var(--eui-base-spacing-xs);left:0}\n"] }]
2991
2991
  }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i1.GestureController }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { slides: [{
2992
2992
  type: ViewChild,
2993
2993
  args: ['slides', { static: true }]
@@ -3190,7 +3190,7 @@ class EuimSliderInfoScreenComponent {
3190
3190
  this.leftActionClicked.emit(event);
3191
3191
  }
3192
3192
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSliderInfoScreenComponent, deps: [{ token: i0.Renderer2 }, { token: i1.GestureController }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
3193
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimSliderInfoScreenComponent, selector: "euim-slider-info-screen", inputs: { isCarousel: "isCarousel", showLeftBtn: "showLeftBtn", showRightBtn: "showRightBtn", isPreviousBtn: "isPreviousBtn", isNextBtn: "isNextBtn", actionBtnNames: "actionBtnNames" }, outputs: { rightActionClicked: "rightActionClicked", lastStepActionClicked: "lastStepActionClicked", leftActionClicked: "leftActionClicked" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class": "this.className" } }, viewQueries: [{ propertyName: "slides", first: true, predicate: ["slides"], descendants: true, static: true }], ngImport: i0, template: "<div #sliderElement class=\"euim-slider-info-screen__slider-container\">\n <div #slides class=\"euim-slider-info-screen__slides\">\n <ng-content></ng-content>\n </div>\n <div class=\"euim-slider-info-screen__pagination-container\" *ngIf=\"showLeftBtn || showRightBtn || isCarousel || isLastItemReached\" >\n <ion-button (click)=\"onLeftBtnAction($event)\" *ngIf=\"showLeftBtn && !showLeftBtnAsPrevious && !isPreviousBtn\" class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftBtnName}}</ion-button>\n <ion-button (click)=\"onLeftBtnAction($event)\" *ngIf=showLeftBtnAsPrevious class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftBtnName}}</ion-button>\n <div *ngIf=isCarousel class=\"euim-slider-info-screen__pagination\">\n <span (click)=\"goToSlide(i)\" *ngFor=\"let slide of slidesArray; let i = index\"\n [ngClass]=\"{ 'active': currentSlide === i }\"\n class=\"euim-slider-info-screen__span\"></span>\n </div>\n <ion-button (click)=\"onRightBtnAction($event)\" *ngIf=\"!isLastItemReached && !isNextBtn || isNextBtn && showRightBtn\" class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--right\"\n fill=\"clear\">{{actionBtnNames.rightBtnName}}</ion-button>\n <ion-button (click)=\"onLastStepAction($event)\" *ngIf=isLastItemReached class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--right\"\n fill=\"clear\">{{actionBtnNames.lastStepActionBtnName}}</ion-button>\n </div>\n</div>\n", styles: [".euim-slider-info-screen__slider-container{overflow:hidden;position:relative;height:100vh}.euim-slider-info-screen__slides{display:flex;transition:all .5s ease;height:100%;width:100%}.euim-slider-info-screen__slide{width:100%;height:100%}.euim-slider-info-screen__pagination-container{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;height:60px}.euim-slider-info-screen__pagination{display:flex}.euim-slider-info-screen__span{width:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);height:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);border-radius:50%;cursor:pointer;border:1px solid var(--eui-base-color-primary)}.euim-slider-info-screen__span:not(:last-child){margin-right:var(--eui-base-spacing-xs)}.euim-slider-info-screen__span.active{background-color:var(--eui-base-color-primary)}.euim-slider-info-screen__action-button{position:absolute;color:var(--eui-base-color-primary);font-weight:700;top:50%;transform:translateY(-50%)}.euim-slider-info-screen__action-button::part(native){padding:0 var(--eui-base-spacing-m)}.euim-slider-info-screen__action-button--right{right:0;margin:0 var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-m)}.euim-slider-info-screen__action-button--left{margin:0 var(--eui-base-spacing-m) 0 var(--eui-base-spacing-xs);left:0}.euim-slider-info-screen__title{@eui-font (3xl);font-weight:700;color:var(--eui-base-color-grey-100);margin-top:var(--eui-base-spacing-l);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l)}.euim-slider-info-screen__sub-title{color:var(--eui-base-color-grey-75);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);@eui-font (l);}.euim-slider-info-screen__content{color:var(--eui-base-color-grey-100);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);@eui-font (l);}.euim-slider-info-screen__title+.euim-slider-info-screen__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-slider-info-screen__sub-title+.euim-slider-info-screen__content,title+.euim-slider-info-screen__content{margin-top:var(--eui-base-spacing-m)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }], encapsulation: i0.ViewEncapsulation.None }); }
3193
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimSliderInfoScreenComponent, selector: "euim-slider-info-screen", inputs: { isCarousel: "isCarousel", showLeftBtn: "showLeftBtn", showRightBtn: "showRightBtn", isPreviousBtn: "isPreviousBtn", isNextBtn: "isNextBtn", actionBtnNames: "actionBtnNames" }, outputs: { rightActionClicked: "rightActionClicked", lastStepActionClicked: "lastStepActionClicked", leftActionClicked: "leftActionClicked" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class": "this.className" } }, viewQueries: [{ propertyName: "slides", first: true, predicate: ["slides"], descendants: true, static: true }], ngImport: i0, template: "<div #sliderElement class=\"euim-slider-info-screen__slider-container\">\n <div #slides class=\"euim-slider-info-screen__slides\">\n <ng-content></ng-content>\n </div>\n @if (showLeftBtn || showRightBtn || isCarousel || isLastItemReached){\n <div class=\"euim-slider-info-screen__pagination-container\">\n @if (showLeftBtn && !showLeftBtnAsPrevious && !isPreviousBtn) {\n <ion-button (click)=\"onLeftBtnAction($event)\" class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftBtnName}}</ion-button>\n }\n @if (showLeftBtnAsPrevious) {\n <ion-button (click)=\"onLeftBtnAction($event)\" class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftBtnName}}</ion-button>\n }\n @if (isCarousel){\n <div class=\"euim-slider-info-screen__pagination\">\n <span (click)=\"goToSlide(i)\" *ngFor=\"let slide of slidesArray; let i = index\"\n [ngClass]=\"{ 'active': currentSlide === i }\"\n class=\"euim-slider-info-screen__span\"></span>\n </div>\n }\n @if (!isLastItemReached && !isNextBtn || isNextBtn && showRightBtn) {\n <ion-button (click)=\"onRightBtnAction($event)\" class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--right\"\n fill=\"clear\">{{actionBtnNames.rightBtnName}}</ion-button>\n }\n\n @if (isLastItemReached) {\n <ion-button (click)=\"onLastStepAction($event)\" class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--right\"\n fill=\"clear\">{{actionBtnNames.lastStepActionBtnName}}</ion-button>\n }\n </div>\n }\n\n</div>\n", styles: [".euim-slider-info-screen__slider-container{overflow:hidden;position:relative;height:100vh}.euim-slider-info-screen__slides{display:flex;transition:all .5s ease;height:100%;width:100%}.euim-slider-info-screen__slide{width:100%;height:100%}.euim-slider-info-screen__pagination-container{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;height:60px}.euim-slider-info-screen__pagination{display:flex}.euim-slider-info-screen__span{width:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);height:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);border-radius:50%;cursor:pointer;border:1px solid var(--eui-base-color-primary-100)}.euim-slider-info-screen__span:not(:last-child){margin-right:var(--eui-base-spacing-xs)}.euim-slider-info-screen__span.active{background-color:var(--eui-base-color-primary-100)}.euim-slider-info-screen__action-button{position:absolute;color:var(--eui-base-color-primary-100);font-weight:700;top:50%;transform:translateY(-50%)}.euim-slider-info-screen__action-button::part(native){padding:0 var(--eui-base-spacing-m)}.euim-slider-info-screen__action-button--right{right:0;margin:0 var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-m)}.euim-slider-info-screen__action-button--left{margin:0 var(--eui-base-spacing-m) 0 var(--eui-base-spacing-xs);left:0}.euim-slider-info-screen__title{font:normal normal 400 1.75rem/2rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-grey-100);margin-top:var(--eui-base-spacing-l);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l)}.euim-slider-info-screen__sub-title{color:var(--eui-base-color-grey-75);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.euim-slider-info-screen__content{color:var(--eui-base-color-grey-100);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.euim-slider-info-screen__title+.euim-slider-info-screen__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-slider-info-screen__sub-title+.euim-slider-info-screen__content,title+.euim-slider-info-screen__content{margin-top:var(--eui-base-spacing-m)}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }], encapsulation: i0.ViewEncapsulation.None }); }
3194
3194
  }
3195
3195
  __decorate([
3196
3196
  coerceBoolean
@@ -3215,7 +3215,7 @@ __decorate([
3215
3215
  ], EuimSliderInfoScreenComponent.prototype, "showLeftBtnAsPrevious", void 0);
3216
3216
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSliderInfoScreenComponent, decorators: [{
3217
3217
  type: Component,
3218
- args: [{ selector: 'euim-slider-info-screen', encapsulation: ViewEncapsulation.None, template: "<div #sliderElement class=\"euim-slider-info-screen__slider-container\">\n <div #slides class=\"euim-slider-info-screen__slides\">\n <ng-content></ng-content>\n </div>\n <div class=\"euim-slider-info-screen__pagination-container\" *ngIf=\"showLeftBtn || showRightBtn || isCarousel || isLastItemReached\" >\n <ion-button (click)=\"onLeftBtnAction($event)\" *ngIf=\"showLeftBtn && !showLeftBtnAsPrevious && !isPreviousBtn\" class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftBtnName}}</ion-button>\n <ion-button (click)=\"onLeftBtnAction($event)\" *ngIf=showLeftBtnAsPrevious class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftBtnName}}</ion-button>\n <div *ngIf=isCarousel class=\"euim-slider-info-screen__pagination\">\n <span (click)=\"goToSlide(i)\" *ngFor=\"let slide of slidesArray; let i = index\"\n [ngClass]=\"{ 'active': currentSlide === i }\"\n class=\"euim-slider-info-screen__span\"></span>\n </div>\n <ion-button (click)=\"onRightBtnAction($event)\" *ngIf=\"!isLastItemReached && !isNextBtn || isNextBtn && showRightBtn\" class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--right\"\n fill=\"clear\">{{actionBtnNames.rightBtnName}}</ion-button>\n <ion-button (click)=\"onLastStepAction($event)\" *ngIf=isLastItemReached class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--right\"\n fill=\"clear\">{{actionBtnNames.lastStepActionBtnName}}</ion-button>\n </div>\n</div>\n", styles: [".euim-slider-info-screen__slider-container{overflow:hidden;position:relative;height:100vh}.euim-slider-info-screen__slides{display:flex;transition:all .5s ease;height:100%;width:100%}.euim-slider-info-screen__slide{width:100%;height:100%}.euim-slider-info-screen__pagination-container{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;height:60px}.euim-slider-info-screen__pagination{display:flex}.euim-slider-info-screen__span{width:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);height:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);border-radius:50%;cursor:pointer;border:1px solid var(--eui-base-color-primary)}.euim-slider-info-screen__span:not(:last-child){margin-right:var(--eui-base-spacing-xs)}.euim-slider-info-screen__span.active{background-color:var(--eui-base-color-primary)}.euim-slider-info-screen__action-button{position:absolute;color:var(--eui-base-color-primary);font-weight:700;top:50%;transform:translateY(-50%)}.euim-slider-info-screen__action-button::part(native){padding:0 var(--eui-base-spacing-m)}.euim-slider-info-screen__action-button--right{right:0;margin:0 var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-m)}.euim-slider-info-screen__action-button--left{margin:0 var(--eui-base-spacing-m) 0 var(--eui-base-spacing-xs);left:0}.euim-slider-info-screen__title{@eui-font (3xl);font-weight:700;color:var(--eui-base-color-grey-100);margin-top:var(--eui-base-spacing-l);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l)}.euim-slider-info-screen__sub-title{color:var(--eui-base-color-grey-75);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);@eui-font (l);}.euim-slider-info-screen__content{color:var(--eui-base-color-grey-100);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);@eui-font (l);}.euim-slider-info-screen__title+.euim-slider-info-screen__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-slider-info-screen__sub-title+.euim-slider-info-screen__content,title+.euim-slider-info-screen__content{margin-top:var(--eui-base-spacing-m)}\n"] }]
3218
+ args: [{ selector: 'euim-slider-info-screen', encapsulation: ViewEncapsulation.None, template: "<div #sliderElement class=\"euim-slider-info-screen__slider-container\">\n <div #slides class=\"euim-slider-info-screen__slides\">\n <ng-content></ng-content>\n </div>\n @if (showLeftBtn || showRightBtn || isCarousel || isLastItemReached){\n <div class=\"euim-slider-info-screen__pagination-container\">\n @if (showLeftBtn && !showLeftBtnAsPrevious && !isPreviousBtn) {\n <ion-button (click)=\"onLeftBtnAction($event)\" class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftBtnName}}</ion-button>\n }\n @if (showLeftBtnAsPrevious) {\n <ion-button (click)=\"onLeftBtnAction($event)\" class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftBtnName}}</ion-button>\n }\n @if (isCarousel){\n <div class=\"euim-slider-info-screen__pagination\">\n <span (click)=\"goToSlide(i)\" *ngFor=\"let slide of slidesArray; let i = index\"\n [ngClass]=\"{ 'active': currentSlide === i }\"\n class=\"euim-slider-info-screen__span\"></span>\n </div>\n }\n @if (!isLastItemReached && !isNextBtn || isNextBtn && showRightBtn) {\n <ion-button (click)=\"onRightBtnAction($event)\" class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--right\"\n fill=\"clear\">{{actionBtnNames.rightBtnName}}</ion-button>\n }\n\n @if (isLastItemReached) {\n <ion-button (click)=\"onLastStepAction($event)\" class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--right\"\n fill=\"clear\">{{actionBtnNames.lastStepActionBtnName}}</ion-button>\n }\n </div>\n }\n\n</div>\n", styles: [".euim-slider-info-screen__slider-container{overflow:hidden;position:relative;height:100vh}.euim-slider-info-screen__slides{display:flex;transition:all .5s ease;height:100%;width:100%}.euim-slider-info-screen__slide{width:100%;height:100%}.euim-slider-info-screen__pagination-container{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;height:60px}.euim-slider-info-screen__pagination{display:flex}.euim-slider-info-screen__span{width:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);height:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);border-radius:50%;cursor:pointer;border:1px solid var(--eui-base-color-primary-100)}.euim-slider-info-screen__span:not(:last-child){margin-right:var(--eui-base-spacing-xs)}.euim-slider-info-screen__span.active{background-color:var(--eui-base-color-primary-100)}.euim-slider-info-screen__action-button{position:absolute;color:var(--eui-base-color-primary-100);font-weight:700;top:50%;transform:translateY(-50%)}.euim-slider-info-screen__action-button::part(native){padding:0 var(--eui-base-spacing-m)}.euim-slider-info-screen__action-button--right{right:0;margin:0 var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-m)}.euim-slider-info-screen__action-button--left{margin:0 var(--eui-base-spacing-m) 0 var(--eui-base-spacing-xs);left:0}.euim-slider-info-screen__title{font:normal normal 400 1.75rem/2rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-grey-100);margin-top:var(--eui-base-spacing-l);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l)}.euim-slider-info-screen__sub-title{color:var(--eui-base-color-grey-75);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.euim-slider-info-screen__content{color:var(--eui-base-color-grey-100);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.euim-slider-info-screen__title+.euim-slider-info-screen__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-slider-info-screen__sub-title+.euim-slider-info-screen__content,title+.euim-slider-info-screen__content{margin-top:var(--eui-base-spacing-m)}\n"] }]
3219
3219
  }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i1.GestureController }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { slides: [{
3220
3220
  type: ViewChild,
3221
3221
  args: ['slides', { static: true }]
@@ -3400,6 +3400,7 @@ class EuimChipSelectorItemDirective {
3400
3400
  constructor(renderer, el) {
3401
3401
  this.renderer = renderer;
3402
3402
  this.el = el;
3403
+ this.clickEventAdded = false;
3403
3404
  this.euimChipSelectorAll = false;
3404
3405
  this.className = 'euim-chip-selector__item';
3405
3406
  }
@@ -3444,6 +3445,7 @@ class EuimChipSelectorComponent {
3444
3445
  this.filteredData = [...this.sourceData];
3445
3446
  this.filterConditions = [];
3446
3447
  this.searchInput = '';
3448
+ this.clickEventHandled = false;
3447
3449
  }
3448
3450
  get cssClasses() {
3449
3451
  return this.getCssClasses();
@@ -3452,9 +3454,24 @@ class EuimChipSelectorComponent {
3452
3454
  this.setCssItemClasses();
3453
3455
  }
3454
3456
  ngAfterContentInit() {
3457
+ this.subscribeToChanges();
3455
3458
  this.updateChipsAndFilterDataAfterInit();
3456
3459
  this.updateChipsAndFilters();
3457
3460
  }
3461
+ ngOnDestroy() {
3462
+ if (this.euimChipSelectorItemSubscription) {
3463
+ this.euimChipSelectorItemSubscription.unsubscribe();
3464
+ }
3465
+ }
3466
+ subscribeToChanges() {
3467
+ if (this.euimChipSelectorItemSubscription) {
3468
+ this.euimChipSelectorItemSubscription.unsubscribe();
3469
+ }
3470
+ this.euimChipSelectorItemSubscription = this.euimChipSelectorItemComponent.changes.subscribe(() => {
3471
+ this.updateChipsAndFilters();
3472
+ this.setCssItemClasses();
3473
+ });
3474
+ }
3458
3475
  ngOnChanges(changes) {
3459
3476
  if (this.euimChipSelectorItemComponent && this.euimChipSelectorItemComponent.length > 0 &&
3460
3477
  changes.selectedChips.currentValue && changes.selectedChips.currentValue.length === 1 &&
@@ -3494,33 +3511,63 @@ class EuimChipSelectorComponent {
3494
3511
  }
3495
3512
  updateChipsAndFilters() {
3496
3513
  this.euimChipSelectorItemComponent.forEach(chip => {
3497
- chip.el.nativeElement.addEventListener('click', () => {
3498
- this.euimChipSelectorItemComponent.forEach(chip => {
3499
- if (!this.isMultiSelectionMode || this.isMultiSelectionMode && chip.euimChipSelectorAll) {
3500
- this.removeSelectedStyles(chip.el.nativeElement);
3514
+ if (!chip.clickEventAdded) {
3515
+ chip.el.nativeElement.addEventListener('click', () => {
3516
+ if (!this.clickEventHandled) {
3517
+ this.clickEventHandled = true;
3518
+ this.euimChipSelectorItemComponent.forEach(innerChip => {
3519
+ if (!this.isMultiSelectionMode || (this.isMultiSelectionMode && innerChip.euimChipSelectorAll)) {
3520
+ this.removeSelectedStyles(innerChip.el.nativeElement);
3521
+ }
3522
+ });
3523
+ this.addSelectedStyles(chip.el.nativeElement);
3524
+ this.onFilterChange(chip.id?.toString(), chip.euimChipSelectorAll, chip.el.nativeElement);
3525
+ this.filterData.emit(this.filteredData);
3526
+ this.clickItems.emit(this.selectedChips);
3527
+ this.clickEventHandled = false;
3501
3528
  }
3502
3529
  });
3503
- this.addSelectedStyles(chip.el.nativeElement);
3504
- this.onFilterChange(chip.id.toString(), chip.euimChipSelectorAll, chip.el.nativeElement);
3505
- this.filterData.emit(this.filteredData);
3506
- this.clickItems.emit(this.selectedChips);
3507
- });
3530
+ chip.clickEventAdded = true;
3531
+ }
3508
3532
  });
3509
3533
  }
3534
+ clickEventHandler(chip) {
3535
+ if (!this.clickEventHandled) {
3536
+ this.clickEventHandled = true;
3537
+ this.euimChipSelectorItemComponent.forEach(innerChip => {
3538
+ if (!this.isMultiSelectionMode || (this.isMultiSelectionMode && innerChip.euimChipSelectorAll)) {
3539
+ this.removeSelectedStyles(innerChip.el.nativeElement);
3540
+ }
3541
+ });
3542
+ this.addSelectedStyles(chip.el.nativeElement);
3543
+ this.onFilterChange(chip.id?.toString(), chip.euimChipSelectorAll, chip.el.nativeElement);
3544
+ this.filterData.emit(this.filteredData);
3545
+ this.clickItems.emit(this.selectedChips);
3546
+ this.clickEventHandled = false;
3547
+ }
3548
+ }
3510
3549
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
3511
3550
  handleChange(event) {
3512
3551
  this.searchInput = event.detail.value.toLowerCase();
3513
3552
  if (!this.euimKeepSelection)
3514
3553
  return;
3515
3554
  let filteredDataWithSearch = [];
3516
- if (this.searchInput !== '') {
3517
- filteredDataWithSearch = (this.selectedChips[0] !== '0') ? this.filteredData : this.sourceData;
3518
- filteredDataWithSearch = filteredDataWithSearch.filter(obj => obj.title.toLowerCase().includes(this.searchInput));
3555
+ if (this.selectedChips[0] !== '0' && this.isMultiSelectionMode) {
3556
+ filteredDataWithSearch = [...this.sourceData].filter(item => this.selectedChips.includes(item.filterId));
3557
+ this.filteredData = filteredDataWithSearch.filter(obj => obj.title.toLowerCase().includes(this.searchInput));
3558
+ this.filterData.emit(this.filteredData);
3559
+ return;
3560
+ }
3561
+ if (this.selectedChips[0] !== '0') {
3562
+ filteredDataWithSearch = [...this.sourceData].filter(item => {
3563
+ return item.filterId === this.selectedChips[0];
3564
+ });
3565
+ this.filteredData = filteredDataWithSearch.filter(obj => obj.title.toLowerCase().includes(this.searchInput));
3519
3566
  }
3520
3567
  else {
3521
- filteredDataWithSearch = (this.selectedChips[0] !== '0') ? this.filteredData : this.sourceData;
3568
+ this.filteredData = [...this.sourceData].filter(obj => obj.title.toLowerCase().includes(this.searchInput));
3522
3569
  }
3523
- this.filterData.emit(filteredDataWithSearch);
3570
+ this.filterData.emit(this.filteredData);
3524
3571
  }
3525
3572
  clearFiltersAndSelectAll() {
3526
3573
  this.clearAllSelections();
@@ -3540,8 +3587,6 @@ class EuimChipSelectorComponent {
3540
3587
  if (chip.id === undefined && chip.euimChipSelectorAll) {
3541
3588
  chip.id = 0;
3542
3589
  }
3543
- });
3544
- this.euimChipSelectorItemComponent.forEach((chip) => {
3545
3590
  const chipId = chip.id;
3546
3591
  if (chipId && this.selectedChips.includes(chipId)) {
3547
3592
  this.addSelectedStyles(chip.el.nativeElement);
@@ -3552,9 +3597,13 @@ class EuimChipSelectorComponent {
3552
3597
  this.addSelectedStyles(chip.el.nativeElement);
3553
3598
  this.selectedChips = ['0'];
3554
3599
  this.filterData.emit(this.sourceData);
3555
- this.clickItems.emit(this.selectedChips);
3556
3600
  }
3557
3601
  });
3602
+ if (this.selectedChips.length > 0) {
3603
+ this.emitEvents();
3604
+ }
3605
+ }
3606
+ emitEvents() {
3558
3607
  this.clickItems.emit(this.selectedChips);
3559
3608
  }
3560
3609
  onFilterChange(filterCondition, isFilterAll, item) {
@@ -3572,10 +3621,22 @@ class EuimChipSelectorComponent {
3572
3621
  this.filteredData = [...this.sourceData];
3573
3622
  return;
3574
3623
  }
3624
+ if (this.euimKeepSelection && this.searchInput !== '' && !isAllFilter && this.isMultiSelectionMode || multipleFilterConditions.length > 0) {
3625
+ const filteredData = [...this.sourceData].filter(item => multipleFilterConditions.includes(item.filterId));
3626
+ this.filteredData = filteredData.filter(obj => obj.title.toLowerCase().includes(this.searchInput));
3627
+ return;
3628
+ }
3575
3629
  if (this.isMultiSelectionMode || multipleFilterConditions.length > 0) {
3576
3630
  this.filteredData = [...this.sourceData].filter(item => multipleFilterConditions.includes(item.filterId));
3577
3631
  return;
3578
3632
  }
3633
+ if (this.euimKeepSelection && this.searchInput !== '' && !isAllFilter) {
3634
+ const filteredData = [...this.sourceData].filter(item => {
3635
+ return item.filterId === filterCondition;
3636
+ });
3637
+ this.filteredData = filteredData.filter(obj => obj.title.toLowerCase().includes(this.searchInput));
3638
+ return;
3639
+ }
3579
3640
  this.filteredData = [...this.sourceData].filter(item => {
3580
3641
  return item.filterId === filterCondition;
3581
3642
  });
@@ -3622,7 +3683,7 @@ class EuimChipSelectorComponent {
3622
3683
  this.selectedChips = ['0'];
3623
3684
  }
3624
3685
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimChipSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3625
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimChipSelectorComponent, selector: "euim-chip-selector", inputs: { backgroundColor: "backgroundColor", chipColor: "chipColor", color: "color", chipSelectedColor: "chipSelectedColor", chipFill: "chipFill", sourceData: "sourceData", selectedChips: "selectedChips", isMultiSelectionMode: "isMultiSelectionMode", euimKeepSelection: "euimKeepSelection", hasSearchbar: "hasSearchbar" }, outputs: { filterData: "filterData", clickItems: "clickItems" }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "euimChipSelectorItemComponent", predicate: EuimChipSelectorItemDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ion-searchbar *ngIf=\"hasSearchbar\" (ionChange)=\"handleChange($event)\"\n class=\"euim-chip-selector__searchbar\"></ion-searchbar>\n<euim-scroller-x>\n <ng-content></ng-content>\n</euim-scroller-x>\n\n", styles: [".euim-chip-selector{padding:var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs);display:flex;justify-content:center;flex-direction:column}.euim-chip-selector ion-chip{margin:0 var(--eui-base-spacing-xs) 0 0}.euim-chip-selector ion-searchbar{padding-inline-start:0;padding-top:0;padding-bottom:var(--eui-base-spacing-s)}.euim-chip-selector__item--fill-default,.euim-chip-selector--fill-solid{border:none}.euim-chip-selector__item--fill-outline{background-color:transparent!important;border-width:1px;border-style:solid}.euim-chip-selector__item--fill-clear{background-color:transparent!important;border:none}.euim-chip-selector__item--fill-outline-solid{border-width:1px;border-style:solid}.euim-chip-selector--background-color-primary{background-color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-success{background-color:var(--eui-base-color-success-25);border-color:var(--eui-base-color-success-25);color:var(--eui-base-color-success-100)}.euim-chip-selector__item--color-success.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-success-50)}.euim-chip-selector__item--color-warning{background-color:var(--eui-base-color-warning-25);border-color:var(--eui-base-color-warning-25);color:var(--eui-base-color-warning-140)}.euim-chip-selector__item--color-warning.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-warning-50)}.euim-chip-selector__item--color-danger{background-color:var(--eui-base-color-danger-25);border-color:var(--eui-base-color-danger-25);color:var(--eui-base-color-danger-100)}.euim-chip-selector__item--color-danger.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-danger-50)}.euim-chip-selector__item--color-primary{background-color:var(--eui-base-color-primary-25);border-color:var(--eui-base-color-primary-25);color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-primary.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-primary-50)}.euim-chip-selector__item--color-info{background-color:var(--eui-base-color-info-25);border-color:var(--eui-base-color-info-25);color:var(--eui-base-color-info-100)}.euim-chip-selector__item--color-info.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-info-50)}.euim-chip-selector__item--color-dark{background-color:var(--eui-base-color-grey-100);border-color:var(--eui-base-color-grey-100);color:var(--eui-base-color-white)}.euim-chip-selector__item--color-dark.euim-chip-selector__item--fill-outline{color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-white{background-color:var(--eui-base-color-white);border-color:var(--eui-base-color-white);color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-white.euim-chip-selector__item--fill-outline{color:var(--eui-base-color-white)}.euim-chip-selector__item--color-default{background-color:var(--eui-base-grey-15);border-color:var(--eui-base-color-grey-15);color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-default.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-grey-50)}ion-chip.euim-chip-selector__item-selected--color-white{background-color:var(--eui-base-color-white)!important;border-color:var(--eui-base-color-white)!important;color:var(--eui-base-color-grey-100)!important}ion-chip.euim-chip-selector__item-selected--color-dark{background-color:var(--eui-base-color-grey-100)!important;border-color:var(--eui-base-color-grey-100)!important;color:var(--eui-base-color-white)!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonSearchbar, selector: "ion-searchbar", inputs: ["animated", "autocomplete", "autocorrect", "cancelButtonIcon", "cancelButtonText", "clearIcon", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "mode", "placeholder", "searchIcon", "showCancelButton", "showClearButton", "spellcheck", "type", "value"] }, { kind: "directive", type: i1.TextValueAccessor, selector: "ion-input:not([type=number]),ion-textarea,ion-searchbar" }, { kind: "component", type: EuimScrollerXComponent, selector: "euim-scroller-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
3686
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimChipSelectorComponent, selector: "euim-chip-selector", inputs: { backgroundColor: "backgroundColor", chipColor: "chipColor", color: "color", chipSelectedColor: "chipSelectedColor", chipFill: "chipFill", sourceData: "sourceData", selectedChips: "selectedChips", isMultiSelectionMode: "isMultiSelectionMode", euimKeepSelection: "euimKeepSelection", hasSearchbar: "hasSearchbar" }, outputs: { filterData: "filterData", clickItems: "clickItems" }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "euimChipSelectorItemComponent", predicate: EuimChipSelectorItemDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (hasSearchbar) {\n <ion-searchbar (ionChange)=\"handleChange($event)\"\n class=\"euim-chip-selector__searchbar\"></ion-searchbar>\n}\n<euim-scroller-x>\n <ng-content></ng-content>\n</euim-scroller-x>\n\n", styles: [".euim-chip-selector{padding:var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs);display:flex;justify-content:center;flex-direction:column}.euim-chip-selector ion-chip{margin:0 var(--eui-base-spacing-xs) 0 0}.euim-chip-selector ion-searchbar{padding-inline-start:0;padding-top:0;padding-bottom:var(--eui-base-spacing-s)}.euim-chip-selector__item--fill-default,.euim-chip-selector--fill-solid{border:none}.euim-chip-selector__item--fill-outline{background-color:transparent!important;border-width:1px;border-style:solid}.euim-chip-selector__item--fill-clear{background-color:transparent!important;border:none}.euim-chip-selector__item--fill-outline-solid{border-width:1px;border-style:solid}.euim-chip-selector--background-color-primary{background-color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-success{background-color:var(--eui-base-color-success-25);border-color:var(--eui-base-color-success-25);color:var(--eui-base-color-success-100)}.euim-chip-selector__item--color-success.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-success-50)}.euim-chip-selector__item--color-warning{background-color:var(--eui-base-color-warning-25);border-color:var(--eui-base-color-warning-25);color:var(--eui-base-color-warning-140)}.euim-chip-selector__item--color-warning.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-warning-50)}.euim-chip-selector__item--color-danger{background-color:var(--eui-base-color-danger-25);border-color:var(--eui-base-color-danger-25);color:var(--eui-base-color-danger-100)}.euim-chip-selector__item--color-danger.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-danger-50)}.euim-chip-selector__item--color-primary{background-color:var(--eui-base-color-primary-25);border-color:var(--eui-base-color-primary-25);color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-primary.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-primary-50)}.euim-chip-selector__item--color-info{background-color:var(--eui-base-color-info-25);border-color:var(--eui-base-color-info-25);color:var(--eui-base-color-info-100)}.euim-chip-selector__item--color-info.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-info-50)}.euim-chip-selector__item--color-dark{background-color:var(--eui-base-color-grey-100);border-color:var(--eui-base-color-grey-100);color:var(--eui-base-color-white)}.euim-chip-selector__item--color-dark.euim-chip-selector__item--fill-outline{color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-white{background-color:var(--eui-base-color-white);border-color:var(--eui-base-color-white);color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-white.euim-chip-selector__item--fill-outline{color:var(--eui-base-color-white)}.euim-chip-selector__item--color-default{background-color:var(--eui-base-grey-15);border-color:var(--eui-base-color-grey-15);color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-default.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-grey-50)}ion-chip.euim-chip-selector__item-selected--color-white{background-color:var(--eui-base-color-white)!important;border-color:var(--eui-base-color-white)!important;color:var(--eui-base-color-grey-100)!important}ion-chip.euim-chip-selector__item-selected--color-dark{background-color:var(--eui-base-color-grey-100)!important;border-color:var(--eui-base-color-grey-100)!important;color:var(--eui-base-color-white)!important}\n"], dependencies: [{ kind: "component", type: i1.IonSearchbar, selector: "ion-searchbar", inputs: ["animated", "autocomplete", "autocorrect", "cancelButtonIcon", "cancelButtonText", "clearIcon", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "mode", "placeholder", "searchIcon", "showCancelButton", "showClearButton", "spellcheck", "type", "value"] }, { kind: "directive", type: i1.TextValueAccessor, selector: "ion-input:not([type=number]),ion-textarea,ion-searchbar" }, { kind: "component", type: EuimScrollerXComponent, selector: "euim-scroller-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
3626
3687
  }
3627
3688
  __decorate([
3628
3689
  coerceBoolean
@@ -3635,7 +3696,7 @@ __decorate([
3635
3696
  ], EuimChipSelectorComponent.prototype, "hasSearchbar", void 0);
3636
3697
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimChipSelectorComponent, decorators: [{
3637
3698
  type: Component,
3638
- args: [{ selector: 'euim-chip-selector', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-searchbar *ngIf=\"hasSearchbar\" (ionChange)=\"handleChange($event)\"\n class=\"euim-chip-selector__searchbar\"></ion-searchbar>\n<euim-scroller-x>\n <ng-content></ng-content>\n</euim-scroller-x>\n\n", styles: [".euim-chip-selector{padding:var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs);display:flex;justify-content:center;flex-direction:column}.euim-chip-selector ion-chip{margin:0 var(--eui-base-spacing-xs) 0 0}.euim-chip-selector ion-searchbar{padding-inline-start:0;padding-top:0;padding-bottom:var(--eui-base-spacing-s)}.euim-chip-selector__item--fill-default,.euim-chip-selector--fill-solid{border:none}.euim-chip-selector__item--fill-outline{background-color:transparent!important;border-width:1px;border-style:solid}.euim-chip-selector__item--fill-clear{background-color:transparent!important;border:none}.euim-chip-selector__item--fill-outline-solid{border-width:1px;border-style:solid}.euim-chip-selector--background-color-primary{background-color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-success{background-color:var(--eui-base-color-success-25);border-color:var(--eui-base-color-success-25);color:var(--eui-base-color-success-100)}.euim-chip-selector__item--color-success.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-success-50)}.euim-chip-selector__item--color-warning{background-color:var(--eui-base-color-warning-25);border-color:var(--eui-base-color-warning-25);color:var(--eui-base-color-warning-140)}.euim-chip-selector__item--color-warning.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-warning-50)}.euim-chip-selector__item--color-danger{background-color:var(--eui-base-color-danger-25);border-color:var(--eui-base-color-danger-25);color:var(--eui-base-color-danger-100)}.euim-chip-selector__item--color-danger.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-danger-50)}.euim-chip-selector__item--color-primary{background-color:var(--eui-base-color-primary-25);border-color:var(--eui-base-color-primary-25);color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-primary.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-primary-50)}.euim-chip-selector__item--color-info{background-color:var(--eui-base-color-info-25);border-color:var(--eui-base-color-info-25);color:var(--eui-base-color-info-100)}.euim-chip-selector__item--color-info.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-info-50)}.euim-chip-selector__item--color-dark{background-color:var(--eui-base-color-grey-100);border-color:var(--eui-base-color-grey-100);color:var(--eui-base-color-white)}.euim-chip-selector__item--color-dark.euim-chip-selector__item--fill-outline{color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-white{background-color:var(--eui-base-color-white);border-color:var(--eui-base-color-white);color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-white.euim-chip-selector__item--fill-outline{color:var(--eui-base-color-white)}.euim-chip-selector__item--color-default{background-color:var(--eui-base-grey-15);border-color:var(--eui-base-color-grey-15);color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-default.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-grey-50)}ion-chip.euim-chip-selector__item-selected--color-white{background-color:var(--eui-base-color-white)!important;border-color:var(--eui-base-color-white)!important;color:var(--eui-base-color-grey-100)!important}ion-chip.euim-chip-selector__item-selected--color-dark{background-color:var(--eui-base-color-grey-100)!important;border-color:var(--eui-base-color-grey-100)!important;color:var(--eui-base-color-white)!important}\n"] }]
3699
+ args: [{ selector: 'euim-chip-selector', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (hasSearchbar) {\n <ion-searchbar (ionChange)=\"handleChange($event)\"\n class=\"euim-chip-selector__searchbar\"></ion-searchbar>\n}\n<euim-scroller-x>\n <ng-content></ng-content>\n</euim-scroller-x>\n\n", styles: [".euim-chip-selector{padding:var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs);display:flex;justify-content:center;flex-direction:column}.euim-chip-selector ion-chip{margin:0 var(--eui-base-spacing-xs) 0 0}.euim-chip-selector ion-searchbar{padding-inline-start:0;padding-top:0;padding-bottom:var(--eui-base-spacing-s)}.euim-chip-selector__item--fill-default,.euim-chip-selector--fill-solid{border:none}.euim-chip-selector__item--fill-outline{background-color:transparent!important;border-width:1px;border-style:solid}.euim-chip-selector__item--fill-clear{background-color:transparent!important;border:none}.euim-chip-selector__item--fill-outline-solid{border-width:1px;border-style:solid}.euim-chip-selector--background-color-primary{background-color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-success{background-color:var(--eui-base-color-success-25);border-color:var(--eui-base-color-success-25);color:var(--eui-base-color-success-100)}.euim-chip-selector__item--color-success.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-success-50)}.euim-chip-selector__item--color-warning{background-color:var(--eui-base-color-warning-25);border-color:var(--eui-base-color-warning-25);color:var(--eui-base-color-warning-140)}.euim-chip-selector__item--color-warning.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-warning-50)}.euim-chip-selector__item--color-danger{background-color:var(--eui-base-color-danger-25);border-color:var(--eui-base-color-danger-25);color:var(--eui-base-color-danger-100)}.euim-chip-selector__item--color-danger.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-danger-50)}.euim-chip-selector__item--color-primary{background-color:var(--eui-base-color-primary-25);border-color:var(--eui-base-color-primary-25);color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-primary.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-primary-50)}.euim-chip-selector__item--color-info{background-color:var(--eui-base-color-info-25);border-color:var(--eui-base-color-info-25);color:var(--eui-base-color-info-100)}.euim-chip-selector__item--color-info.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-info-50)}.euim-chip-selector__item--color-dark{background-color:var(--eui-base-color-grey-100);border-color:var(--eui-base-color-grey-100);color:var(--eui-base-color-white)}.euim-chip-selector__item--color-dark.euim-chip-selector__item--fill-outline{color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-white{background-color:var(--eui-base-color-white);border-color:var(--eui-base-color-white);color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-white.euim-chip-selector__item--fill-outline{color:var(--eui-base-color-white)}.euim-chip-selector__item--color-default{background-color:var(--eui-base-grey-15);border-color:var(--eui-base-color-grey-15);color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-default.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-grey-50)}ion-chip.euim-chip-selector__item-selected--color-white{background-color:var(--eui-base-color-white)!important;border-color:var(--eui-base-color-white)!important;color:var(--eui-base-color-grey-100)!important}ion-chip.euim-chip-selector__item-selected--color-dark{background-color:var(--eui-base-color-grey-100)!important;border-color:var(--eui-base-color-grey-100)!important;color:var(--eui-base-color-white)!important}\n"] }]
3639
3700
  }], propDecorators: { backgroundColor: [{
3640
3701
  type: Input
3641
3702
  }], chipColor: [{
@@ -3722,7 +3783,7 @@ class EuimSkeletonListItemComponent {
3722
3783
  .trim();
3723
3784
  }
3724
3785
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonListItemComponent, deps: [{ token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
3725
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimSkeletonListItemComponent, selector: "euim-skeleton-list-item", inputs: { hasAvatar: "hasAvatar", hasTitle: "hasTitle", hasSubtitle: "hasSubtitle", hasMetaLine: "hasMetaLine", isAnimated: "isAnimated", avatarType: "avatarType", separator: "separator", titleWidth: "titleWidth", subTitleWidth: "subTitleWidth", metaLineWidth: "metaLineWidth" }, host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimSize2XL", "euimSize2XL", "euimSizeL", "euimSizeL"] }], ngImport: i0, template: "<ion-item button [lines]=\"separator\">\n <ion-thumbnail *ngIf=\"hasAvatar\" slot=\"start\">\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n </ion-thumbnail>\n <ion-label>\n <ion-skeleton-text *ngIf=\"hasTitle\" [animated]=\"isAnimated\"\n [style.width]=\"titleWidth || '80%'\"></ion-skeleton-text>\n <ion-skeleton-text *ngIf=\"hasSubtitle\" [animated]=\"isAnimated\"\n [style.width]=\"subTitleWidth || '60%'\"></ion-skeleton-text>\n <ion-skeleton-text *ngIf=\"hasMetaLine\" [animated]=\"isAnimated\"\n [style.width]=\"metaLineWidth || '40%'\"></ion-skeleton-text>\n </ion-label>\n</ion-item>\n", styles: [".euim-skeleton-list-item ion-label ion-skeleton-text{margin-bottom:var(--eui-base-spacing-xs)}.euim-skeleton-list-item ion-thumbnail{width:var(--eui-base-spacing-2xl);height:var(--eui-base-spacing-2xl)}.euim-skeleton-list-item--size-l ion-thumbnail{width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l)}.euim-skeleton-list-item--size-2xl ion-thumbnail{width:var(--eui-base-spacing-2xl);height:var(--eui-base-spacing-2xl)}.euim-skeleton-list-item ion-thumbnail{--border-radius: 50%}.euim-skeleton-list-item--square ion-thumbnail{--border-radius: 0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { kind: "component", type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1.IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: i1.IonThumbnail, selector: "ion-thumbnail" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
3786
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimSkeletonListItemComponent, selector: "euim-skeleton-list-item", inputs: { hasAvatar: "hasAvatar", hasTitle: "hasTitle", hasSubtitle: "hasSubtitle", hasMetaLine: "hasMetaLine", isAnimated: "isAnimated", avatarType: "avatarType", separator: "separator", titleWidth: "titleWidth", subTitleWidth: "subTitleWidth", metaLineWidth: "metaLineWidth" }, host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimSize2XL", "euimSize2XL", "euimSizeL", "euimSizeL"] }], ngImport: i0, template: "<ion-item button [lines]=\"separator\">\n @if (hasAvatar) {\n <ion-thumbnail slot=\"start\">\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n </ion-thumbnail>\n }\n <ion-label>\n @if (hasTitle) {\n <ion-skeleton-text [animated]=\"isAnimated\"\n [style.width]=\"titleWidth || '80%'\"></ion-skeleton-text>\n }\n @if (hasSubtitle) {\n <ion-skeleton-text [animated]=\"isAnimated\"\n [style.width]=\"subTitleWidth || '60%'\"></ion-skeleton-text>\n }\n @if (hasMetaLine) {\n <ion-skeleton-text [animated]=\"isAnimated\"\n [style.width]=\"metaLineWidth || '40%'\"></ion-skeleton-text>\n }\n </ion-label>\n</ion-item>\n", styles: [".euim-skeleton-list-item ion-label ion-skeleton-text{margin-bottom:var(--eui-base-spacing-xs)}.euim-skeleton-list-item ion-thumbnail{width:var(--eui-base-spacing-2xl);height:var(--eui-base-spacing-2xl)}.euim-skeleton-list-item--size-l ion-thumbnail{width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l)}.euim-skeleton-list-item--size-2xl ion-thumbnail{width:var(--eui-base-spacing-2xl);height:var(--eui-base-spacing-2xl)}.euim-skeleton-list-item ion-thumbnail{--border-radius: 50%}.euim-skeleton-list-item--square ion-thumbnail{--border-radius: 0}\n"], dependencies: [{ kind: "component", type: i1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { kind: "component", type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1.IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: i1.IonThumbnail, selector: "ion-thumbnail" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
3726
3787
  }
3727
3788
  __decorate([
3728
3789
  coerceBoolean
@@ -3749,7 +3810,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
3749
3810
  'euimSizeL',
3750
3811
  ],
3751
3812
  },
3752
- ], template: "<ion-item button [lines]=\"separator\">\n <ion-thumbnail *ngIf=\"hasAvatar\" slot=\"start\">\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n </ion-thumbnail>\n <ion-label>\n <ion-skeleton-text *ngIf=\"hasTitle\" [animated]=\"isAnimated\"\n [style.width]=\"titleWidth || '80%'\"></ion-skeleton-text>\n <ion-skeleton-text *ngIf=\"hasSubtitle\" [animated]=\"isAnimated\"\n [style.width]=\"subTitleWidth || '60%'\"></ion-skeleton-text>\n <ion-skeleton-text *ngIf=\"hasMetaLine\" [animated]=\"isAnimated\"\n [style.width]=\"metaLineWidth || '40%'\"></ion-skeleton-text>\n </ion-label>\n</ion-item>\n", styles: [".euim-skeleton-list-item ion-label ion-skeleton-text{margin-bottom:var(--eui-base-spacing-xs)}.euim-skeleton-list-item ion-thumbnail{width:var(--eui-base-spacing-2xl);height:var(--eui-base-spacing-2xl)}.euim-skeleton-list-item--size-l ion-thumbnail{width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l)}.euim-skeleton-list-item--size-2xl ion-thumbnail{width:var(--eui-base-spacing-2xl);height:var(--eui-base-spacing-2xl)}.euim-skeleton-list-item ion-thumbnail{--border-radius: 50%}.euim-skeleton-list-item--square ion-thumbnail{--border-radius: 0}\n"] }]
3813
+ ], template: "<ion-item button [lines]=\"separator\">\n @if (hasAvatar) {\n <ion-thumbnail slot=\"start\">\n <ion-skeleton-text [animated]=\"true\"></ion-skeleton-text>\n </ion-thumbnail>\n }\n <ion-label>\n @if (hasTitle) {\n <ion-skeleton-text [animated]=\"isAnimated\"\n [style.width]=\"titleWidth || '80%'\"></ion-skeleton-text>\n }\n @if (hasSubtitle) {\n <ion-skeleton-text [animated]=\"isAnimated\"\n [style.width]=\"subTitleWidth || '60%'\"></ion-skeleton-text>\n }\n @if (hasMetaLine) {\n <ion-skeleton-text [animated]=\"isAnimated\"\n [style.width]=\"metaLineWidth || '40%'\"></ion-skeleton-text>\n }\n </ion-label>\n</ion-item>\n", styles: [".euim-skeleton-list-item ion-label ion-skeleton-text{margin-bottom:var(--eui-base-spacing-xs)}.euim-skeleton-list-item ion-thumbnail{width:var(--eui-base-spacing-2xl);height:var(--eui-base-spacing-2xl)}.euim-skeleton-list-item--size-l ion-thumbnail{width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l)}.euim-skeleton-list-item--size-2xl ion-thumbnail{width:var(--eui-base-spacing-2xl);height:var(--eui-base-spacing-2xl)}.euim-skeleton-list-item ion-thumbnail{--border-radius: 50%}.euim-skeleton-list-item--square ion-thumbnail{--border-radius: 0}\n"] }]
3753
3814
  }], ctorParameters: () => [{ type: BaseStatesDirective }], propDecorators: { cssClasses: [{
3754
3815
  type: HostBinding,
3755
3816
  args: ['class']
@@ -3826,11 +3887,11 @@ class EuimSkeletonListComponent {
3826
3887
  return Array.from({ length: this.items });
3827
3888
  }
3828
3889
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3829
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimSkeletonListComponent, selector: "euim-skeleton-list", inputs: { items: "items" }, queries: [{ propertyName: "skeletonListItem", first: true, predicate: EuimSkeletonListItemComponent, descendants: true }], ngImport: i0, template: "<ng-container *ngFor=\"let item of itemsArray\">\n <euim-skeleton-list-item *ngIf=\"!skeletonListItem\"></euim-skeleton-list-item>\n <ng-container *ngIf=\"skeletonListItem\">\n <ng-container *ngComponentOutlet=\"skeletonItem; inputs: skeletonItemInputs\"></ng-container>\n </ng-container>\n</ng-container>\n\n", dependencies: [{ kind: "directive", type: i2.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EuimSkeletonListItemComponent, selector: "euim-skeleton-list-item", inputs: ["hasAvatar", "hasTitle", "hasSubtitle", "hasMetaLine", "isAnimated", "avatarType", "separator", "titleWidth", "subTitleWidth", "metaLineWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
3890
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimSkeletonListComponent, selector: "euim-skeleton-list", inputs: { items: "items" }, queries: [{ propertyName: "skeletonListItem", first: true, predicate: EuimSkeletonListItemComponent, descendants: true }], ngImport: i0, template: "@for (item of itemsArray; track item) {\n @if (!skeletonListItem) {\n <euim-skeleton-list-item></euim-skeleton-list-item>\n }\n @if (skeletonListItem) {\n <ng-container *ngComponentOutlet=\"skeletonItem; inputs: skeletonItemInputs\"></ng-container>\n }\n}\n\n", dependencies: [{ kind: "directive", type: i2$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "component", type: EuimSkeletonListItemComponent, selector: "euim-skeleton-list-item", inputs: ["hasAvatar", "hasTitle", "hasSubtitle", "hasMetaLine", "isAnimated", "avatarType", "separator", "titleWidth", "subTitleWidth", "metaLineWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
3830
3891
  }
3831
3892
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonListComponent, decorators: [{
3832
3893
  type: Component,
3833
- args: [{ selector: 'euim-skeleton-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let item of itemsArray\">\n <euim-skeleton-list-item *ngIf=\"!skeletonListItem\"></euim-skeleton-list-item>\n <ng-container *ngIf=\"skeletonListItem\">\n <ng-container *ngComponentOutlet=\"skeletonItem; inputs: skeletonItemInputs\"></ng-container>\n </ng-container>\n</ng-container>\n\n" }]
3894
+ args: [{ selector: 'euim-skeleton-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (item of itemsArray; track item) {\n @if (!skeletonListItem) {\n <euim-skeleton-list-item></euim-skeleton-list-item>\n }\n @if (skeletonListItem) {\n <ng-container *ngComponentOutlet=\"skeletonItem; inputs: skeletonItemInputs\"></ng-container>\n }\n}\n\n" }]
3834
3895
  }], propDecorators: { items: [{
3835
3896
  type: Input
3836
3897
  }], skeletonListItem: [{
@@ -3926,14 +3987,14 @@ class EuimMultiselectComponent {
3926
3987
  }
3927
3988
  }
3928
3989
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMultiselectComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
3929
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimMultiselectComponent, selector: "euim-multiselect", inputs: { currentDataProvider: "currentDataProvider", toolbarTitle: "toolbarTitle", euimKeepSelection: "euimKeepSelection" }, host: { properties: { "class": "this.className" } }, usesOnChanges: true, ngImport: i0, template: "<ion-header>\n <ion-toolbar color=\"light\" class=\"euim-multiselect__toolbar\">\n <ng-content select=\"euim-multiselect-toolbar\"></ng-content>\n <ion-toolbar color=\"light\">\n <ng-content select=\"euim-multiselect-filter\"></ng-content>\n </ion-toolbar>\n </ion-toolbar>\n</ion-header>\n\n<ng-container *ngIf=\"currentDataProvider?.length > 0\">\n <ng-content select=\"euim-multiselect-list\">\n\n </ng-content>\n</ng-container>\n\n<ng-container *ngIf=\"currentDataProvider?.length === 0\">\n <ng-content select=\"euim-empty-list-placeholder\">\n </ng-content>\n</ng-container>\n\n\n\n", styles: [".euim-multiselect__toolbar{color:var(--eui-base-color-grey-100)}.euim-multiselect__toolbar--title{font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family);font-weight:700}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
3990
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimMultiselectComponent, selector: "euim-multiselect", inputs: { currentDataProvider: "currentDataProvider", toolbarTitle: "toolbarTitle", euimKeepSelection: "euimKeepSelection" }, host: { properties: { "class": "this.className" } }, usesOnChanges: true, ngImport: i0, template: "<ion-header>\n <ion-toolbar color=\"light\" class=\"euim-multiselect__toolbar\">\n <ng-content select=\"euim-multiselect-toolbar\"></ng-content>\n <ion-toolbar color=\"light\">\n <ng-content select=\"euim-multiselect-filter\"></ng-content>\n </ion-toolbar>\n </ion-toolbar>\n</ion-header>\n\n@if (currentDataProvider?.length > 0) {\n <ng-content select=\"euim-multiselect-list\">\n </ng-content>\n}\n\n@if (currentDataProvider?.length === 0) {\n <ng-content select=\"euim-empty-list-placeholder\">\n </ng-content>\n}\n\n\n\n", styles: [".euim-multiselect__toolbar{color:var(--eui-base-color-grey-100)}.euim-multiselect__toolbar--title{font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family);font-weight:700}\n"], dependencies: [{ kind: "component", type: i1.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
3930
3991
  }
3931
3992
  __decorate([
3932
3993
  coerceBoolean
3933
3994
  ], EuimMultiselectComponent.prototype, "euimKeepSelection", void 0);
3934
3995
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMultiselectComponent, decorators: [{
3935
3996
  type: Component,
3936
- args: [{ selector: 'euim-multiselect', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ion-header>\n <ion-toolbar color=\"light\" class=\"euim-multiselect__toolbar\">\n <ng-content select=\"euim-multiselect-toolbar\"></ng-content>\n <ion-toolbar color=\"light\">\n <ng-content select=\"euim-multiselect-filter\"></ng-content>\n </ion-toolbar>\n </ion-toolbar>\n</ion-header>\n\n<ng-container *ngIf=\"currentDataProvider?.length > 0\">\n <ng-content select=\"euim-multiselect-list\">\n\n </ng-content>\n</ng-container>\n\n<ng-container *ngIf=\"currentDataProvider?.length === 0\">\n <ng-content select=\"euim-empty-list-placeholder\">\n </ng-content>\n</ng-container>\n\n\n\n", styles: [".euim-multiselect__toolbar{color:var(--eui-base-color-grey-100)}.euim-multiselect__toolbar--title{font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family);font-weight:700}\n"] }]
3997
+ args: [{ selector: 'euim-multiselect', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ion-header>\n <ion-toolbar color=\"light\" class=\"euim-multiselect__toolbar\">\n <ng-content select=\"euim-multiselect-toolbar\"></ng-content>\n <ion-toolbar color=\"light\">\n <ng-content select=\"euim-multiselect-filter\"></ng-content>\n </ion-toolbar>\n </ion-toolbar>\n</ion-header>\n\n@if (currentDataProvider?.length > 0) {\n <ng-content select=\"euim-multiselect-list\">\n </ng-content>\n}\n\n@if (currentDataProvider?.length === 0) {\n <ng-content select=\"euim-empty-list-placeholder\">\n </ng-content>\n}\n\n\n\n", styles: [".euim-multiselect__toolbar{color:var(--eui-base-color-grey-100)}.euim-multiselect__toolbar--title{font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family);font-weight:700}\n"] }]
3937
3998
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { className: [{
3938
3999
  type: HostBinding,
3939
4000
  args: ['class']
@@ -4150,14 +4211,14 @@ class EuimMultiselectToolbarComponent {
4150
4211
  this.cancel.emit(true);
4151
4212
  }
4152
4213
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMultiselectToolbarComponent, deps: [{ token: EuimMultiselectComponent }], target: i0.ɵɵFactoryTarget.Component }); }
4153
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimMultiselectToolbarComponent, selector: "euim-multiselect-toolbar", inputs: { toolbarTitle: "toolbarTitle", euimCustomRender: "euimCustomRender" }, outputs: { cancel: "cancel", confirm: "confirm" }, host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<euim-toolbar\n *ngIf=\"!euimCustomRender\"\n [hasBackButton]=\"false\" [hasSidebarTrigger]=\"false\" >\n <ion-button (click)=\"onCancelClick()\">\n <ion-icon name=\"close-sharp\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n <ng-content select=\"ion-button\"></ng-content>\n <euim-toolbar-title class=\"euim-multiselect__toolbar--title\">\n {{toolbarTitle}}\n </euim-toolbar-title>\n <euim-toolbar-action-items>\n <ion-button (click)=\"onConfirm()\">\n <ion-icon name=\"checkmark-sharp\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </euim-toolbar-action-items>\n</euim-toolbar>\n<ng-content *ngIf=\"euimCustomRender\"></ng-content>\n\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: EuimToolbarComponent, selector: "euim-toolbar", inputs: ["hasBackButton", "backButtonDefaultHref", "hasSidebarTrigger", "hasLanguageSelector"], outputs: ["backButtonClick"] }, { kind: "component", type: EuimToolbarTitleComponent, selector: "euim-toolbar-title" }, { kind: "component", type: EuimToolbarActionItemsComponent, selector: "euim-toolbar-action-items" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
4214
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimMultiselectToolbarComponent, selector: "euim-multiselect-toolbar", inputs: { toolbarTitle: "toolbarTitle", euimCustomRender: "euimCustomRender" }, outputs: { cancel: "cancel", confirm: "confirm" }, host: { properties: { "class": "this.className" } }, ngImport: i0, template: "@if (!euimCustomRender) {\n <euim-toolbar\n [hasBackButton]=\"false\" [hasSidebarTrigger]=\"false\" >\n <ion-button (click)=\"onCancelClick()\">\n <ion-icon name=\"close-sharp\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n <ng-content select=\"ion-button\"></ng-content>\n <euim-toolbar-title class=\"euim-multiselect__toolbar--title\">\n {{toolbarTitle}}\n </euim-toolbar-title>\n <euim-toolbar-action-items>\n <ion-button (click)=\"onConfirm()\">\n <ion-icon name=\"checkmark-sharp\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </euim-toolbar-action-items>\n </euim-toolbar>\n}\n@if (euimCustomRender) {\n <ng-content></ng-content>\n}\n\n", dependencies: [{ kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: EuimToolbarComponent, selector: "euim-toolbar", inputs: ["hasBackButton", "backButtonDefaultHref", "hasSidebarTrigger", "hasLanguageSelector"], outputs: ["backButtonClick"] }, { kind: "component", type: EuimToolbarTitleComponent, selector: "euim-toolbar-title" }, { kind: "component", type: EuimToolbarActionItemsComponent, selector: "euim-toolbar-action-items" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
4154
4215
  }
4155
4216
  __decorate([
4156
4217
  coerceBoolean
4157
4218
  ], EuimMultiselectToolbarComponent.prototype, "euimCustomRender", void 0);
4158
4219
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMultiselectToolbarComponent, decorators: [{
4159
4220
  type: Component,
4160
- args: [{ selector: 'euim-multiselect-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<euim-toolbar\n *ngIf=\"!euimCustomRender\"\n [hasBackButton]=\"false\" [hasSidebarTrigger]=\"false\" >\n <ion-button (click)=\"onCancelClick()\">\n <ion-icon name=\"close-sharp\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n <ng-content select=\"ion-button\"></ng-content>\n <euim-toolbar-title class=\"euim-multiselect__toolbar--title\">\n {{toolbarTitle}}\n </euim-toolbar-title>\n <euim-toolbar-action-items>\n <ion-button (click)=\"onConfirm()\">\n <ion-icon name=\"checkmark-sharp\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </euim-toolbar-action-items>\n</euim-toolbar>\n<ng-content *ngIf=\"euimCustomRender\"></ng-content>\n\n" }]
4221
+ args: [{ selector: 'euim-multiselect-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "@if (!euimCustomRender) {\n <euim-toolbar\n [hasBackButton]=\"false\" [hasSidebarTrigger]=\"false\" >\n <ion-button (click)=\"onCancelClick()\">\n <ion-icon name=\"close-sharp\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n <ng-content select=\"ion-button\"></ng-content>\n <euim-toolbar-title class=\"euim-multiselect__toolbar--title\">\n {{toolbarTitle}}\n </euim-toolbar-title>\n <euim-toolbar-action-items>\n <ion-button (click)=\"onConfirm()\">\n <ion-icon name=\"checkmark-sharp\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </euim-toolbar-action-items>\n </euim-toolbar>\n}\n@if (euimCustomRender) {\n <ng-content></ng-content>\n}\n\n" }]
4161
4222
  }], ctorParameters: () => [{ type: EuimMultiselectComponent }], propDecorators: { className: [{
4162
4223
  type: HostBinding,
4163
4224
  args: ['class']
@@ -4298,11 +4359,11 @@ class EuimPdfWrapperComponent {
4298
4359
  }
4299
4360
  }
4300
4361
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimPdfWrapperComponent, deps: [{ token: i1.AlertController }], target: i0.ɵɵFactoryTarget.Component }); }
4301
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimPdfWrapperComponent, selector: "euim-pdf-wrapper", inputs: { url: "url", page: "page" }, ngImport: i0, template: "<div>\n <euim-spinner *ngIf=\"loading\">\n <div euimSpinnerMessage>Loading PDF...</div>\n </euim-spinner>\n <div *ngIf=\"errorMessage\">{{errorMessage}}</div>\n</div>\n\n\n<pinch-zoom>\n <div style=\"display: block;width: 500px; height: 500px\">\n <pdf-viewer [src]=\"url\"\n [zoom]=\"zoom\"\n [original-size]=\"true\"\n [autoresize]=\"false\"\n (after-load-complete)=\"onLoaded($event)\"\n (error)=\"onError()\"\n [page]=\"page\"\n style=\"width: 100%; height: 100%\"></pdf-viewer>\n </div>\n</pinch-zoom>\n\n<ion-footer>\n <ion-toolbar color=\"primary\" class=\"pdf-preview-modal__footer\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"onDownload()\" [disabled]=\"!pdf\">\n <ion-icon name=\"download-outline\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-buttons class=\"pdf-preview-modal__footer-zoom-container\">\n <ion-button (click)=\"onZoomOut()\" [disabled]=\"zoom === 1\">\n <ion-icon name=\"remove-circle-outline\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n <ion-button (click)=\"onResetZoom()\">\n ZOOM\n </ion-button>\n <ion-button (click)=\"onZoomIn()\">\n <ion-icon name=\"add-circle-outline\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n\n\n <ion-button (click)=\"prevPage()\">\n Prev\n </ion-button>\n {{page}}\n <ion-button (click)=\"nextPage()\">\n Next\n </ion-button>\n\n </ion-buttons>\n </ion-toolbar>\n</ion-footer>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i1.IonFooter, selector: "ion-footer", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: i3.PdfViewerComponent, selector: "pdf-viewer", inputs: ["src", "c-maps-url", "page", "render-text", "render-text-mode", "original-size", "show-all", "stick-to-page", "zoom", "zoom-scale", "rotation", "external-link-target", "autoresize", "fit-to-page", "show-borders"], outputs: ["after-load-complete", "page-rendered", "pages-initialized", "text-layer-rendered", "error", "on-progress", "pageChange"] }, { kind: "component", type: i4.PinchZoomComponent, selector: "pinch-zoom, [pinch-zoom]", inputs: ["properties", "transition-duration", "transitionDuration", "double-tap", "doubleTap", "double-tap-scale", "doubleTapScale", "auto-zoom-out", "autoZoomOut", "limit-zoom", "limitZoom", "disabled", "disablePan", "overflow", "zoomControlScale", "disableZoomControl", "backgroundColor", "limitPan", "minPanScale", "minScale", "listeners", "wheel", "autoHeight", "wheelZoomFactor", "draggableImage"], exportAs: ["pinchZoom"] }, { kind: "component", type: EuimSpinnerComponent, selector: "euim-spinner" }, { kind: "component", type: EuimSpinnerMessageComponent, selector: "[euimSpinnerMessage]" }], encapsulation: i0.ViewEncapsulation.None }); }
4362
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimPdfWrapperComponent, selector: "euim-pdf-wrapper", inputs: { url: "url", page: "page" }, ngImport: i0, template: "<div>\n @if (loading) {\n <euim-spinner>\n <div euimSpinnerMessage>Loading PDF...</div>\n </euim-spinner>\n }\n @if (errorMessage) {\n <div>{{errorMessage}}</div>\n }\n</div>\n\n\n<pinch-zoom>\n <div style=\"display: block;width: 500px; height: 500px\">\n <pdf-viewer [src]=\"url\"\n [zoom]=\"zoom\"\n [original-size]=\"true\"\n [autoresize]=\"false\"\n (after-load-complete)=\"onLoaded($event)\"\n (error)=\"onError()\"\n [page]=\"page\"\n style=\"width: 100%; height: 100%\"></pdf-viewer>\n </div>\n</pinch-zoom>\n\n<ion-footer>\n <ion-toolbar color=\"primary\" class=\"pdf-preview-modal__footer\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"onDownload()\" [disabled]=\"!pdf\">\n <ion-icon name=\"download-outline\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-buttons class=\"pdf-preview-modal__footer-zoom-container\">\n <ion-button (click)=\"onZoomOut()\" [disabled]=\"zoom === 1\">\n <ion-icon name=\"remove-circle-outline\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n <ion-button (click)=\"onResetZoom()\">\n ZOOM\n </ion-button>\n <ion-button (click)=\"onZoomIn()\">\n <ion-icon name=\"add-circle-outline\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n\n\n <ion-button (click)=\"prevPage()\">\n Prev\n </ion-button>\n {{page}}\n <ion-button (click)=\"nextPage()\">\n Next\n </ion-button>\n\n </ion-buttons>\n </ion-toolbar>\n</ion-footer>\n", styles: [""], dependencies: [{ kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i1.IonFooter, selector: "ion-footer", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: i2$2.PdfViewerComponent, selector: "pdf-viewer", inputs: ["src", "c-maps-url", "page", "render-text", "render-text-mode", "original-size", "show-all", "stick-to-page", "zoom", "zoom-scale", "rotation", "external-link-target", "autoresize", "fit-to-page", "show-borders"], outputs: ["after-load-complete", "page-rendered", "pages-initialized", "text-layer-rendered", "error", "on-progress", "pageChange"] }, { kind: "component", type: i3.PinchZoomComponent, selector: "pinch-zoom, [pinch-zoom]", inputs: ["properties", "transition-duration", "transitionDuration", "double-tap", "doubleTap", "double-tap-scale", "doubleTapScale", "auto-zoom-out", "autoZoomOut", "limit-zoom", "limitZoom", "disabled", "disablePan", "overflow", "zoomControlScale", "disableZoomControl", "backgroundColor", "limitPan", "minPanScale", "minScale", "listeners", "wheel", "autoHeight", "wheelZoomFactor", "draggableImage"], exportAs: ["pinchZoom"] }, { kind: "component", type: EuimSpinnerComponent, selector: "euim-spinner" }, { kind: "component", type: EuimSpinnerMessageComponent, selector: "[euimSpinnerMessage]" }], encapsulation: i0.ViewEncapsulation.None }); }
4302
4363
  }
4303
4364
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimPdfWrapperComponent, decorators: [{
4304
4365
  type: Component,
4305
- args: [{ selector: 'euim-pdf-wrapper', encapsulation: ViewEncapsulation.None, template: "<div>\n <euim-spinner *ngIf=\"loading\">\n <div euimSpinnerMessage>Loading PDF...</div>\n </euim-spinner>\n <div *ngIf=\"errorMessage\">{{errorMessage}}</div>\n</div>\n\n\n<pinch-zoom>\n <div style=\"display: block;width: 500px; height: 500px\">\n <pdf-viewer [src]=\"url\"\n [zoom]=\"zoom\"\n [original-size]=\"true\"\n [autoresize]=\"false\"\n (after-load-complete)=\"onLoaded($event)\"\n (error)=\"onError()\"\n [page]=\"page\"\n style=\"width: 100%; height: 100%\"></pdf-viewer>\n </div>\n</pinch-zoom>\n\n<ion-footer>\n <ion-toolbar color=\"primary\" class=\"pdf-preview-modal__footer\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"onDownload()\" [disabled]=\"!pdf\">\n <ion-icon name=\"download-outline\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-buttons class=\"pdf-preview-modal__footer-zoom-container\">\n <ion-button (click)=\"onZoomOut()\" [disabled]=\"zoom === 1\">\n <ion-icon name=\"remove-circle-outline\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n <ion-button (click)=\"onResetZoom()\">\n ZOOM\n </ion-button>\n <ion-button (click)=\"onZoomIn()\">\n <ion-icon name=\"add-circle-outline\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n\n\n <ion-button (click)=\"prevPage()\">\n Prev\n </ion-button>\n {{page}}\n <ion-button (click)=\"nextPage()\">\n Next\n </ion-button>\n\n </ion-buttons>\n </ion-toolbar>\n</ion-footer>\n" }]
4366
+ args: [{ selector: 'euim-pdf-wrapper', encapsulation: ViewEncapsulation.None, template: "<div>\n @if (loading) {\n <euim-spinner>\n <div euimSpinnerMessage>Loading PDF...</div>\n </euim-spinner>\n }\n @if (errorMessage) {\n <div>{{errorMessage}}</div>\n }\n</div>\n\n\n<pinch-zoom>\n <div style=\"display: block;width: 500px; height: 500px\">\n <pdf-viewer [src]=\"url\"\n [zoom]=\"zoom\"\n [original-size]=\"true\"\n [autoresize]=\"false\"\n (after-load-complete)=\"onLoaded($event)\"\n (error)=\"onError()\"\n [page]=\"page\"\n style=\"width: 100%; height: 100%\"></pdf-viewer>\n </div>\n</pinch-zoom>\n\n<ion-footer>\n <ion-toolbar color=\"primary\" class=\"pdf-preview-modal__footer\">\n <ion-buttons slot=\"start\">\n <ion-button (click)=\"onDownload()\" [disabled]=\"!pdf\">\n <ion-icon name=\"download-outline\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n </ion-buttons>\n <ion-buttons class=\"pdf-preview-modal__footer-zoom-container\">\n <ion-button (click)=\"onZoomOut()\" [disabled]=\"zoom === 1\">\n <ion-icon name=\"remove-circle-outline\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n <ion-button (click)=\"onResetZoom()\">\n ZOOM\n </ion-button>\n <ion-button (click)=\"onZoomIn()\">\n <ion-icon name=\"add-circle-outline\" slot=\"icon-only\"></ion-icon>\n </ion-button>\n\n\n <ion-button (click)=\"prevPage()\">\n Prev\n </ion-button>\n {{page}}\n <ion-button (click)=\"nextPage()\">\n Next\n </ion-button>\n\n </ion-buttons>\n </ion-toolbar>\n</ion-footer>\n" }]
4306
4367
  }], ctorParameters: () => [{ type: i1.AlertController }], propDecorators: { url: [{
4307
4368
  type: Input
4308
4369
  }], page: [{