@eui/mobile-core 17.0.0-next.8 → 17.0.0-next.9

package/fesm2022/eui-mobile-core.mjs

@@ -2,19 +2,19 @@ export * from '@eui/base';
 import * as i0 from '@angular/core';
 import { Injectable, booleanAttribute, Directive, Input, Component, ViewEncapsulation, ChangeDetectionStrategy, HostBinding, NgModule, EventEmitter, Output, ContentChildren, ViewChild, HostListener, ContentChild } from '@angular/core';
 import { BehaviorSubject, Subject } from 'rxjs';
-import * as i2$1 from '@angular/common';
+import * as i2$2 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i1 from '@ionic/angular';
+import * as i2 from '@ionic/angular';
 import { IonicModule } from '@ionic/angular';
-import * as i1$2 from '@angular/router';
-import { RouterModule, NavigationEnd } from '@angular/router';
 import { EclLanguageService, EclDefaultLanguageService } from '@eui/ecl';
-import * as i2 from '@eui/core';
+import * as i2$1 from '@eui/core';
 import { EuiEuLanguages } from '@eui/core';
 import { takeUntil, distinctUntilKeyChanged } from 'rxjs/operators';
-import * as i1$1 from '@ngx-translate/core';
+import * as i1 from '@ngx-translate/core';
 import { TranslateModule } from '@ngx-translate/core';
-import * as i2$2 from 'ng2-pdf-viewer';
+import * as i1$1 from '@angular/router';
+import { NavigationEnd, RouterModule } from '@angular/router';
+import * as i2$3 from 'ng2-pdf-viewer';
 import { PdfViewerModule } from 'ng2-pdf-viewer';
 import * as i3 from '@meddv/ngx-pinch-zoom';
 import { PinchZoomModule } from '@meddv/ngx-pinch-zoom';
@@ -53,67 +53,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
 
 class BaseStatesDirective {
     constructor() {
-        // COLORS
-        /**
-         * @deprecated Will be removed in v17.
-         * Please use {@link color} property instead
-         */
-        this.euimPrimary = false;
-        /**
-         * @deprecated Will be removed in v17.
-         * Please use {@link color} property instead
-         */
-        this.euimSecondary = false;
-        /**
-         * @deprecated Will be removed in v17.
-         * Please use {@link color} property instead
-         */
-        this.euimInfo = false;
-        /**
-         * @deprecated Will be removed in v17.
-         * Please use {@link color} property instead
-         */
-        this.euimSuccess = false;
-        /**
-         * @deprecated Will be removed in v17.
-         * Please use {@link color} property instead
-         */
-        this.euimWarning = false;
-        /**
-         * @deprecated Will be removed in v17.
-         * Please use {@link color} property instead
-         */
-        this.euimDanger = false;
-        /**
-         * @deprecated Will be removed in v17.
-         * Please use {@link color} property instead
-         */
-        this.euimAccent = false;
-        /**
-         * @deprecated Will be removed in v17.
-         * Please use {@link color} property instead
-         */
-        this.euimDefault = false;
-        /**
-         * @deprecated Will be removed in v17.
-         * Please use {@link color} property instead
-         */
-        this.euimDark = false;
-        /**
-         * @deprecated Will be removed in v17.
-         * Please use {@link color} property instead
-         */
-        this.euimWhite = false;
-        /**
-         * @deprecated Will be removed in v17.
-         * Please use {@link color} property instead
-         */
-        this.euimLight = false;
-        /**
-         * @deprecated Will be removed in v17.
-         * Please use {@link color} property instead
-         */
-        this.euimClear = false;
         // STATES
         this.euimDisabled = false;
         // POSITION
@@ -136,70 +75,14 @@ class BaseStatesDirective {
         this.euimSize4XL = false;
         this.euimSize5XL = false;
         this._euimSizeVariant = '';
-        this._euimVariant = '';
-        this._variant = '';
         this._color = '';
     }
-    /**
-     * @deprecated Will be removed in v17.
-     * Please use {@link color} property instead
-     */
-    get euimVariant() {
-        return this._euimVariant;
-    }
-    set euimVariant(value) {
-        this.euimPrimary = value === 'primary';
-        this.euimSecondary = value === 'secondary';
-        this.euimWarning = value === 'warning';
-        this.euimInfo = value === 'info';
-        this.euimSuccess = value === 'success';
-        this.euimDanger = value === 'danger';
-        this.euimAccent = value === 'accent';
-        this.euimDefault = value === 'default';
-        this.euimDark = value === 'dark';
-        this.euimWhite = value === 'white';
-        this._euimVariant = value;
-        this.euimLight = value === 'light';
-        this.euimClear = value === 'clear';
-    }
-    /**
-     * @deprecated will be removed in eUIMobile17. Please use {@link euimVariant} instead
-     */
-    get variant() {
-        return this._variant;
-    }
-    set variant(value) {
-        this.euimPrimary = value === 'primary';
-        this.euimSecondary = value === 'secondary';
-        this.euimWarning = value === 'warning';
-        this.euimInfo = value === 'info';
-        this.euimSuccess = value === 'success';
-        this.euimDanger = value === 'danger';
-        this.euimAccent = value === 'accent';
-        this.euimDefault = value === 'default';
-        this.euimDark = value === 'dark';
-        this.euimWhite = value === 'white';
-        this._variant = value;
-        this.euimLight = value === 'light';
-        this.euimClear = value === 'clear';
-    }
+    // COLORS
     get color() {
         return this._color;
     }
     set color(value) {
-        this.euimPrimary = value === 'primary';
-        this.euimSecondary = value === 'secondary';
-        this.euimWarning = value === 'warning';
-        this.euimInfo = value === 'info';
-        this.euimSuccess = value === 'success';
-        this.euimDanger = value === 'danger';
-        this.euimAccent = value === 'accent';
-        this.euimDefault = value === 'default';
-        this.euimDark = value === 'dark';
-        this.euimWhite = value === 'white';
         this._color = value;
-        this.euimLight = value === 'light';
-        this.euimClear = value === 'clear';
     }
     get euimSizeVariant() {
         return this._euimSizeVariant;
@@ -220,16 +103,7 @@ class BaseStatesDirective {
     getCssClasses(rootClass) {
         return [
             rootClass,
-            this.euimPrimary ? `${rootClass}--primary` : '',
-            this.euimSecondary ? `${rootClass}--secondary` : '',
-            this.euimInfo ? `${rootClass}--info` : '',
-            this.euimSuccess ? `${rootClass}--success` : '',
-            this.euimWarning ? `${rootClass}--warning` : '',
-            this.euimDanger ? `${rootClass}--danger` : '',
-            this.euimAccent ? `${rootClass}--accent` : '',
-            this.euimDefault ? `${rootClass}--default` : '',
-            this.euimDark ? `${rootClass}--dark` : '',
-            this.euimWhite ? `${rootClass}--white` : '',
+            this.color ? `${rootClass}--${this.color}` : '',
             this.euimSize2XS ? `${rootClass}--size-2xs` : '',
             this.euimSizeXS ? `${rootClass}--size-xs` : '',
             this.euimSizeS ? `${rootClass}--size-s` : '',
@@ -252,7 +126,7 @@ class BaseStatesDirective {
             .trim();
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: BaseStatesDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.3.0", type: BaseStatesDirective, isStandalone: true, selector: "[euimBase]", inputs: { euimPrimary: ["euimPrimary", "euimPrimary", booleanAttribute], euimSecondary: ["euimSecondary", "euimSecondary", booleanAttribute], euimInfo: ["euimInfo", "euimInfo", booleanAttribute], euimSuccess: ["euimSuccess", "euimSuccess", booleanAttribute], euimWarning: ["euimWarning", "euimWarning", booleanAttribute], euimDanger: ["euimDanger", "euimDanger", booleanAttribute], euimAccent: ["euimAccent", "euimAccent", booleanAttribute], euimDefault: ["euimDefault", "euimDefault", booleanAttribute], euimDark: ["euimDark", "euimDark", booleanAttribute], euimWhite: ["euimWhite", "euimWhite", booleanAttribute], euimLight: ["euimLight", "euimLight", booleanAttribute], euimClear: ["euimClear", "euimClear", booleanAttribute], euimVariant: "euimVariant", variant: "variant", color: "color", euimDisabled: ["euimDisabled", "euimDisabled", booleanAttribute], euimPositionTopEnd: ["euimPositionTopEnd", "euimPositionTopEnd", booleanAttribute], euimFontBold: ["euimFontBold", "euimFontBold", booleanAttribute], euimFontRegular: ["euimFontRegular", "euimFontRegular", booleanAttribute], euimFontBoldItalic: ["euimFontBoldItalic", "euimFontBoldItalic", booleanAttribute], euimFontItalic: ["euimFontItalic", "euimFontItalic", booleanAttribute], euimFontLight: ["euimFontLight", "euimFontLight", booleanAttribute], euimSize2XS: ["euimSize2XS", "euimSize2XS", booleanAttribute], euimSizeXS: ["euimSizeXS", "euimSizeXS", booleanAttribute], euimSizeS: ["euimSizeS", "euimSizeS", booleanAttribute], euimSizeM: ["euimSizeM", "euimSizeM", booleanAttribute], euimSizeL: ["euimSizeL", "euimSizeL", booleanAttribute], euimSizeXL: ["euimSizeXL", "euimSizeXL", booleanAttribute], euimSize2XL: ["euimSize2XL", "euimSize2XL", booleanAttribute], euimSize3XL: ["euimSize3XL", "euimSize3XL", booleanAttribute], euimSize4XL: ["euimSize4XL", "euimSize4XL", booleanAttribute], euimSize5XL: ["euimSize5XL", "euimSize5XL", booleanAttribute], euimSizeVariant: "euimSizeVariant" }, host: { properties: { "attr.aria-disabled": "this.euimDisabled.toString()" } }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.3.0", type: BaseStatesDirective, isStandalone: true, selector: "[euimBase]", inputs: { color: "color", euimDisabled: ["euimDisabled", "euimDisabled", booleanAttribute], euimPositionTopEnd: ["euimPositionTopEnd", "euimPositionTopEnd", booleanAttribute], euimFontBold: ["euimFontBold", "euimFontBold", booleanAttribute], euimFontRegular: ["euimFontRegular", "euimFontRegular", booleanAttribute], euimFontBoldItalic: ["euimFontBoldItalic", "euimFontBoldItalic", booleanAttribute], euimFontItalic: ["euimFontItalic", "euimFontItalic", booleanAttribute], euimFontLight: ["euimFontLight", "euimFontLight", booleanAttribute], euimSize2XS: ["euimSize2XS", "euimSize2XS", booleanAttribute], euimSizeXS: ["euimSizeXS", "euimSizeXS", booleanAttribute], euimSizeS: ["euimSizeS", "euimSizeS", booleanAttribute], euimSizeM: ["euimSizeM", "euimSizeM", booleanAttribute], euimSizeL: ["euimSizeL", "euimSizeL", booleanAttribute], euimSizeXL: ["euimSizeXL", "euimSizeXL", booleanAttribute], euimSize2XL: ["euimSize2XL", "euimSize2XL", booleanAttribute], euimSize3XL: ["euimSize3XL", "euimSize3XL", booleanAttribute], euimSize4XL: ["euimSize4XL", "euimSize4XL", booleanAttribute], euimSize5XL: ["euimSize5XL", "euimSize5XL", booleanAttribute], euimSizeVariant: "euimSizeVariant" }, host: { properties: { "attr.aria-disabled": "this.euimDisabled.toString()" } }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: BaseStatesDirective, decorators: [{
             type: Directive,
@@ -265,47 +139,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         '[attr.aria-disabled]': 'this.euimDisabled.toString()',
                     },
                 }]
-        }], propDecorators: { euimPrimary: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], euimSecondary: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], euimInfo: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], euimSuccess: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], euimWarning: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], euimDanger: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], euimAccent: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], euimDefault: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], euimDark: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], euimWhite: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], euimLight: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], euimClear: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], euimVariant: [{
-                type: Input
-            }], variant: [{
-                type: Input
-            }], color: [{
+        }], propDecorators: { color: [{
                 type: Input
             }], euimDisabled: [{
                 type: Input,
@@ -384,7 +218,7 @@ class EuimLabelComponent {
         ].join(' ');
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLabelComponent, deps: [{ token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.3.0", type: EuimLabelComponent, selector: "div[euimLabel], p[euimLabel], span[euimLabel], euim-label", inputs: { euimLabelTruncateWithLines: "euimLabelTruncateWithLines", euimLabelTitle: ["euimLabelTitle", "euimLabelTitle", booleanAttribute], euimLabelSubTitle: ["euimLabelSubTitle", "euimLabelSubTitle", booleanAttribute], euimLabelMeta: ["euimLabelMeta", "euimLabelMeta", booleanAttribute], euimLabelTruncate: ["euimLabelTruncate", "euimLabelTruncate", booleanAttribute] }, host: { properties: { "style.--euimLabelTruncateWithLines": "this.euimLabelTruncateWithLines", "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimInfo", "euimInfo", "euimSuccess", "euimSuccess", "euimWarning", "euimWarning", "euimDanger", "euimDanger", "euimPrimary", "euimPrimary", "euimSecondary", "euimSecondary", "euimDefault", "euimDefault", "euimDark", "euimDark", "euimAccent", "euimAccent", "euimSize2XS", "euimSize2XS", "euimSizeXS", "euimSizeXS", "euimSizeS", "euimSizeS", "euimSizeM", "euimSizeM", "euimSizeL", "euimSizeL", "euimSizeXL", "euimSizeXL", "euimSize2XL", "euimSize2XL", "euimSize3XL", "euimSize3XL", "euimSize4XL", "euimSize4XL", "color", "color"] }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".euim-label{display:block;align-items:center;margin:0;padding:0;color:var(--eui-base-color-grey-100)}.euim-label ion-icon{vertical-align:bottom;margin-right:var(--eui-base-spacing-2xs)}.euim-label :not(ion-icon:first-child){margin-left:var(--eui-base-spacing-2xs)}.euim-label__title{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-text)}.euim-label__title ion-icon{font-size:var(--eui-base-font-size-m)}.euim-label__sub-title,.euim-label__meta{font:normal normal 400 .875rem/1rem var(--eui-base-font-family);color:var(--eui-base-color-grey-75)}.euim-label__sub-title ion-icon,.euim-label__meta ion-icon{font-size:var(--eui-base-font-size-m)}.euim-label__title+.euim-label__sub-title,.euim-label__title+.euim-label__meta,.euim-label__sub-title+.euim-label__meta,.euim-label__sub-title+.euim-label__sub-title,.euim-label__meta+.euim-label__sub-title,.euim-label__meta+.euim-label__meta{margin-top:var(--eui-base-spacing-2xs)}.euim-label__euiTextTruncateWithLines{white-space:break-spaces;display:-webkit-box;-webkit-line-clamp:var(--euimLabelTruncateWithLines);-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.euim-label__truncate{white-space:break-spaces}.euim-label--primary{color:var(--eui-base-color-primary-100)}.euim-label--secondary{color:var(--eui-base-color-grey-50)}.euim-label--default{color:var(--eui-base-color-grey-75)}.euim-label--dark{color:var(--eui-base-color-grey-100)}.euim-label--info{color:var(--eui-base-color-info-100)}.euim-label--success{color:var(--eui-base-color-success-100)}.euim-label--warning{color:var(--eui-base-color-warning-130)}.euim-label--danger{color:var(--eui-base-color-danger-100)}.euim-label--accent{color:var(--eui-base-color-accent-100)}.euim-label--size-2xs{font:var(--eui-base-font-size-2xs)}.euim-label--size-xs{font:var(--eui-base-font-size-xs)}.euim-label--size-s{font:var(--eui-base-font-size-s)}.euim-label--size-m{font:var(--eui-base-font-size-m)}.euim-label--size-l{font:var(--eui-base-font-size-l)}.euim-label--size-xl{font:var(--eui-base-font-size-xl)}.euim-label--size-2xl{font:var(--eui-base-font-size-2xl)}.euim-label--size-3xl{font:var(--eui-base-font-size-3xl)}.euim-label--size-4xl{font:var(--eui-base-font-size-4xl)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.3.0", type: EuimLabelComponent, selector: "div[euimLabel], p[euimLabel], span[euimLabel], euim-label", inputs: { euimLabelTruncateWithLines: "euimLabelTruncateWithLines", euimLabelTitle: ["euimLabelTitle", "euimLabelTitle", booleanAttribute], euimLabelSubTitle: ["euimLabelSubTitle", "euimLabelSubTitle", booleanAttribute], euimLabelMeta: ["euimLabelMeta", "euimLabelMeta", booleanAttribute], euimLabelTruncate: ["euimLabelTruncate", "euimLabelTruncate", booleanAttribute] }, host: { properties: { "style.--euimLabelTruncateWithLines": "this.euimLabelTruncateWithLines", "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimSize2XS", "euimSize2XS", "euimSizeXS", "euimSizeXS", "euimSizeS", "euimSizeS", "euimSizeM", "euimSizeM", "euimSizeL", "euimSizeL", "euimSizeXL", "euimSizeXL", "euimSize2XL", "euimSize2XL", "euimSize3XL", "euimSize3XL", "euimSize4XL", "euimSize4XL", "color", "color"] }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".euim-label{display:block;align-items:center;margin:0;padding:0;color:var(--eui-base-color-grey-100)}.euim-label ion-icon{vertical-align:bottom;margin-right:var(--eui-base-spacing-2xs)}.euim-label :not(ion-icon:first-child){margin-left:var(--eui-base-spacing-2xs)}.euim-label__title{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-text)}.euim-label__title ion-icon{font-size:var(--eui-base-font-size-m)}.euim-label__sub-title,.euim-label__meta{font:normal normal 400 .875rem/1rem var(--eui-base-font-family);color:var(--eui-base-color-grey-75)}.euim-label__sub-title ion-icon,.euim-label__meta ion-icon{font-size:var(--eui-base-font-size-m)}.euim-label__title+.euim-label__sub-title,.euim-label__title+.euim-label__meta,.euim-label__sub-title+.euim-label__meta,.euim-label__sub-title+.euim-label__sub-title,.euim-label__meta+.euim-label__sub-title,.euim-label__meta+.euim-label__meta{margin-top:var(--eui-base-spacing-2xs)}.euim-label__euiTextTruncateWithLines{white-space:break-spaces;display:-webkit-box;-webkit-line-clamp:var(--euimLabelTruncateWithLines);-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.euim-label__truncate{white-space:break-spaces}.euim-label--primary{color:var(--eui-base-color-primary-100)}.euim-label--secondary{color:var(--eui-base-color-grey-50)}.euim-label--default{color:var(--eui-base-color-grey-75)}.euim-label--dark{color:var(--eui-base-color-grey-100)}.euim-label--info{color:var(--eui-base-color-info-100)}.euim-label--success{color:var(--eui-base-color-success-100)}.euim-label--warning{color:var(--eui-base-color-warning-130)}.euim-label--danger{color:var(--eui-base-color-danger-100)}.euim-label--accent{color:var(--eui-base-color-accent-100)}.euim-label--size-2xs{font:var(--eui-base-font-size-2xs)}.euim-label--size-xs{font:var(--eui-base-font-size-xs)}.euim-label--size-s{font:var(--eui-base-font-size-s)}.euim-label--size-m{font:var(--eui-base-font-size-m)}.euim-label--size-l{font:var(--eui-base-font-size-l)}.euim-label--size-xl{font:var(--eui-base-font-size-xl)}.euim-label--size-2xl{font:var(--eui-base-font-size-2xl)}.euim-label--size-3xl{font:var(--eui-base-font-size-3xl)}.euim-label--size-4xl{font:var(--eui-base-font-size-4xl)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLabelComponent, decorators: [{
             type: Component,
@@ -392,15 +226,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimInfo',
-                                'euimSuccess',
-                                'euimWarning',
-                                'euimDanger',
-                                'euimPrimary',
-                                'euimSecondary',
-                                'euimDefault',
-                                'euimDark',
-                                'euimAccent',
                                 'euimSize2XS',
                                 'euimSizeXS',
                                 'euimSizeS',
@@ -459,64 +284,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 }]
         }] });
 
-class EuimControlFeedbackComponent {
-    get cssClasses() {
-        return this.getCssClasses();
-    }
-    constructor(baseStatesDirective) {
-        this.baseStatesDirective = baseStatesDirective;
-    }
-    getCssClasses() {
-        return [
-            this.baseStatesDirective.getCssClasses('euim-control-feedback'),
-        ].join(' ');
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimControlFeedbackComponent, deps: [{ token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimControlFeedbackComponent, selector: "euim-control-feedback", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimInfo", "euimInfo", "euimSuccess", "euimSuccess", "euimWarning", "euimWarning", "euimDanger", "euimDanger", "euimVariant", "euimVariant", "color", "color"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".euim-control-feedback{display:block;font-size:var(--eui-base-font-size-xs);padding-left:var(--eui-base-spacing-m)}.euim-control-feedback--info{color:var(--eui-base-color-info-100)}.euim-control-feedback--success{color:var(--eui-base-color-success-100)}.euim-control-feedback--warning{color:var(--eui-base-color-warning-100)}.euim-control-feedback--danger{color:var(--eui-base-color-danger-100)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimControlFeedbackComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'euim-control-feedback', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
-                        {
-                            directive: BaseStatesDirective,
-                            inputs: [
-                                'euimInfo',
-                                'euimSuccess',
-                                'euimWarning',
-                                'euimDanger',
-                                'euimVariant',
-                                'color',
-                            ],
-                        },
-                    ], template: "<ng-content></ng-content>\n", styles: [".euim-control-feedback{display:block;font-size:var(--eui-base-font-size-xs);padding-left:var(--eui-base-spacing-m)}.euim-control-feedback--info{color:var(--eui-base-color-info-100)}.euim-control-feedback--success{color:var(--eui-base-color-success-100)}.euim-control-feedback--warning{color:var(--eui-base-color-warning-100)}.euim-control-feedback--danger{color:var(--eui-base-color-danger-100)}\n"] }]
-        }], ctorParameters: () => [{ type: BaseStatesDirective }], propDecorators: { cssClasses: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-class EuimControlFeedbackModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimControlFeedbackModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimControlFeedbackModule, declarations: [EuimControlFeedbackComponent], imports: [CommonModule,
-            IonicModule], exports: [EuimControlFeedbackComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimControlFeedbackModule, imports: [CommonModule,
-            IonicModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimControlFeedbackModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        IonicModule,
-                    ],
-                    exports: [
-                        EuimControlFeedbackComponent,
-                    ],
-                    declarations: [
-                        EuimControlFeedbackComponent,
-                    ],
-                }]
-        }] });
-
 class EuimNotificationItemComponent {
     get cssClasses() {
         return this.getCssClasses();
@@ -530,7 +297,7 @@ class EuimNotificationItemComponent {
         ].join(' ');
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimNotificationItemComponent, deps: [{ token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimNotificationItemComponent, selector: "euim-notification-item", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimInfo", "euimInfo", "euimSuccess", "euimSuccess", "euimWarning", "euimWarning", "euimDanger", "euimDanger", "euimPrimary", "euimPrimary", "euimSecondary", "euimSecondary", "euimAccent", "euimAccent", "color", "color"] }], ngImport: i0, template: "", styles: [".euim-notification-item{display:block;border-radius:50%;width:var(--eui-base-spacing-xs);height:var(--eui-base-spacing-xs)}.euim-notification-item--primary{background:var(--eui-base-color-primary-100)}.euim-notification-item--secondary{background:var(--eui-base-color-grey-50)}.euim-notification-item--info{background:var(--eui-base-color-info-100)}.euim-notification-item--success{background:var(--eui-base-color-success-100)}.euim-notification-item--warning{background:var(--eui-base-color-warning-100)}.euim-notification-item--danger{background:var(--eui-base-color-danger-100)}.euim-notification-item--accent{background:var(--eui-base-color-accent-100)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimNotificationItemComponent, selector: "euim-notification-item", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["color", "color"] }], ngImport: i0, template: "", styles: [".euim-notification-item{display:block;border-radius:50%;width:var(--eui-base-spacing-xs);height:var(--eui-base-spacing-xs)}.euim-notification-item--primary{background:var(--eui-base-color-primary-100)}.euim-notification-item--secondary{background:var(--eui-base-color-grey-50)}.euim-notification-item--info{background:var(--eui-base-color-info-100)}.euim-notification-item--success{background:var(--eui-base-color-success-100)}.euim-notification-item--warning{background:var(--eui-base-color-warning-100)}.euim-notification-item--danger{background:var(--eui-base-color-danger-100)}.euim-notification-item--accent{background:var(--eui-base-color-accent-100)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimNotificationItemComponent, decorators: [{
             type: Component,
@@ -538,13 +305,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimInfo',
-                                'euimSuccess',
-                                'euimWarning',
-                                'euimDanger',
-                                'euimPrimary',
-                                'euimSecondary',
-                                'euimAccent',
                                 'color',
                             ],
                         },
@@ -583,7 +343,7 @@ class EuimAppComponent {
         this.ionMenuId = 'main';
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppComponent, deps: [{ token: EuimAppService }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimAppComponent, selector: "euim-app", inputs: { ionMenuId: "ionMenuId" }, ngImport: i0, template: "<ion-app>\n    <ng-content></ng-content>\n    <ion-router-outlet id=\"{{ionMenuId}}\"></ion-router-outlet>\n</ion-app>\n", dependencies: [{ kind: "component", type: i1.IonApp, selector: "ion-app" }, { kind: "directive", type: i1.IonRouterOutlet, selector: "ion-router-outlet", inputs: ["animated", "animation", "mode", "swipeGesture", "environmentInjector"], outputs: ["stackEvents", "activate", "deactivate"], exportAs: ["outlet"] }] }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimAppComponent, selector: "euim-app", inputs: { ionMenuId: "ionMenuId" }, ngImport: i0, template: "<ion-app>\n    <ng-content></ng-content>\n    <ion-router-outlet id=\"{{ionMenuId}}\"></ion-router-outlet>\n</ion-app>\n", dependencies: [{ kind: "component", type: i2.IonApp, selector: "ion-app" }, { kind: "directive", type: i2.IonRouterOutlet, selector: "ion-router-outlet", inputs: ["animated", "animation", "mode", "swipeGesture", "environmentInjector"], outputs: ["stackEvents", "activate", "deactivate"], exportAs: ["outlet"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppComponent, decorators: [{
             type: Component,
@@ -634,197 +394,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 args: ['class']
             }] } });
 
-/**
-*  @deprecated It is removed. Use {@link euim-sidebar} instead.
-*/
-class EuimMenuComponent {
-    constructor(navCtrl) {
-        this.navCtrl = navCtrl;
-        this.isChanged = false;
-        this.itemClick = new EventEmitter();
-        this.items = [];
-    }
-    onItemClick(event, idx, item) {
-        if (item && item.url) {
-            if (item.url.indexOf('http') > -1) {
-                window.open(item.url, '_blank');
-            }
-            else {
-                this.navCtrl.navigateRoot(item.url).then();
-            }
-        }
-        this.itemClick.emit(item);
-    }
-    isColorDirectiveShown(item, color) {
-        return item.notification?.color === color;
-    }
-    /** @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 }); }
-    /** @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 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMenuComponent, decorators: [{
-            type: Component,
-            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"] }]
-        }], ctorParameters: () => [{ type: i1.NavController }], propDecorators: { itemClick: [{
-                type: Output
-            }], items: [{
-                type: Input
-            }] } });
-
-class EuimAvatarIconModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAvatarIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimAvatarIconModule, declarations: [EuimAvatarIconComponent], imports: [CommonModule,
-            IonicModule], exports: [EuimAvatarIconComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAvatarIconModule, imports: [CommonModule,
-            IonicModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAvatarIconModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        IonicModule,
-                    ],
-                    exports: [
-                        EuimAvatarIconComponent,
-                    ],
-                    declarations: [
-                        EuimAvatarIconComponent,
-                    ],
-                }]
-        }] });
-
-class EuimMenuModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimMenuModule, declarations: [EuimMenuComponent], imports: [CommonModule,
-            RouterModule,
-            IonicModule,
-            EuimAvatarIconModule,
-            EuimLabelModule,
-            EuimNotificationItemModule], exports: [EuimMenuComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMenuModule, imports: [CommonModule,
-            RouterModule,
-            IonicModule,
-            EuimAvatarIconModule,
-            EuimLabelModule,
-            EuimNotificationItemModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMenuModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        RouterModule,
-                        IonicModule,
-                        EuimAvatarIconModule,
-                        EuimLabelModule,
-                        EuimNotificationItemModule,
-                    ],
-                    declarations: [
-                        EuimMenuComponent,
-                    ],
-                    exports: [
-                        EuimMenuComponent,
-                    ],
-                }]
-        }] });
-
-class EuimAppSidebarComponent {
-    constructor() {
-        this.ionMenuId = 'main';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppSidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimAppSidebarComponent, selector: "euim-app-sidebar", inputs: { ionMenuId: "ionMenuId", sidebarItems: "sidebarItems" }, ngImport: i0, template: "<ion-menu contentId=\"{{ionMenuId}}\" menuId=\"{{ionMenuId}}\" side=\"start\">\n    <ion-toolbar>\n        <ng-content select=\"euim-app-sidebar-header\"></ng-content>\n    </ion-toolbar>\n    <ion-content>\n        <ng-content select=\"euim-app-sidebar-menu\"></ng-content>\n    </ion-content>\n    <ion-footer>\n        <ng-content select=\"euim-app-sidebar-footer\"></ng-content>\n    </ion-footer>\n</ion-menu>\n", dependencies: [{ kind: "component", type: i1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i1.IonFooter, selector: "ion-footer", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i1.IonMenu, selector: "ion-menu", inputs: ["contentId", "disabled", "maxEdgeStart", "menuId", "side", "swipeGesture", "type"] }, { kind: "component", type: i1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppSidebarComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'euim-app-sidebar', template: "<ion-menu contentId=\"{{ionMenuId}}\" menuId=\"{{ionMenuId}}\" side=\"start\">\n    <ion-toolbar>\n        <ng-content select=\"euim-app-sidebar-header\"></ng-content>\n    </ion-toolbar>\n    <ion-content>\n        <ng-content select=\"euim-app-sidebar-menu\"></ng-content>\n    </ion-content>\n    <ion-footer>\n        <ng-content select=\"euim-app-sidebar-footer\"></ng-content>\n    </ion-footer>\n</ion-menu>\n" }]
-        }], propDecorators: { ionMenuId: [{
-                type: Input
-            }], sidebarItems: [{
-                type: Input
-            }] } });
-
-class EuimAppSidebarHeaderComponent {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppSidebarHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimAppSidebarHeaderComponent, selector: "euim-app-sidebar-header", ngImport: i0, template: "<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppSidebarHeaderComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'euim-app-sidebar-header', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n" }]
-        }] });
-
-class EuimAppSidebarMenuComponent {
-    constructor() {
-        this.itemClick = new EventEmitter();
-    }
-    onItemClick(item) {
-        this.itemClick.emit(item);
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppSidebarMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimAppSidebarMenuComponent, selector: "euim-app-sidebar-menu", inputs: { items: "items" }, outputs: { itemClick: "itemClick" }, ngImport: i0, template: "<euim-menu (itemClick)=\"onItemClick($event)\"\n           [items]=\"items\"></euim-menu>\n", dependencies: [{ kind: "component", type: EuimMenuComponent, selector: "euim-menu", inputs: ["items"], outputs: ["itemClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppSidebarMenuComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'euim-app-sidebar-menu', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<euim-menu (itemClick)=\"onItemClick($event)\"\n           [items]=\"items\"></euim-menu>\n" }]
-        }], propDecorators: { items: [{
-                type: Input
-            }], itemClick: [{
-                type: Output
-            }] } });
-
-class EuimAppSidebarFooterComponent {
-    constructor() {
-        this.className = 'euim-app-sidebar-footer';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppSidebarFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimAppSidebarFooterComponent, selector: "euim-app-sidebar-footer", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppSidebarFooterComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'euim-app-sidebar-footer', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n" }]
-        }], propDecorators: { className: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-const COMPONENTS$f = [
-    EuimAppSidebarComponent,
-    EuimAppSidebarHeaderComponent,
-    EuimAppSidebarFooterComponent,
-    EuimAppSidebarMenuComponent,
-];
-class EuimAppSidebarModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppSidebarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimAppSidebarModule, declarations: [EuimAppSidebarComponent,
-            EuimAppSidebarHeaderComponent,
-            EuimAppSidebarFooterComponent,
-            EuimAppSidebarMenuComponent], imports: [CommonModule, RouterModule,
-            EuimMenuModule,
-            IonicModule], exports: [EuimAppSidebarComponent,
-            EuimAppSidebarHeaderComponent,
-            EuimAppSidebarFooterComponent,
-            EuimAppSidebarMenuComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppSidebarModule, imports: [CommonModule, RouterModule,
-            EuimMenuModule,
-            IonicModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppSidebarModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule, RouterModule,
-                        EuimMenuModule,
-                        IonicModule,
-                    ],
-                    declarations: [
-                        ...COMPONENTS$f,
-                    ],
-                    exports: [
-                        ...COMPONENTS$f,
-                    ],
-                }]
-        }] });
-
 class EuimEmptyListPlaceholderComponent {
     get cssClasses() {
         return this.getCssClasses();
@@ -838,7 +407,7 @@ class EuimEmptyListPlaceholderComponent {
         ].join(' ');
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimEmptyListPlaceholderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @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", "euimMarginTopLarge", booleanAttribute], euimMarginTopSmall: ["euimMarginTopSmall", "euimMarginTopSmall", booleanAttribute], euimMarginBottomSmall: ["euimMarginBottomSmall", "euimMarginBottomSmall", booleanAttribute] }, 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 }); }
+    /** @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", "euimMarginTopLarge", booleanAttribute], euimMarginTopSmall: ["euimMarginTopSmall", "euimMarginTopSmall", booleanAttribute], euimMarginBottomSmall: ["euimMarginBottomSmall", "euimMarginBottomSmall", booleanAttribute] }, 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: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimEmptyListPlaceholderComponent, decorators: [{
             type: Component,
@@ -941,13 +510,13 @@ class EuimLanguageListComponent {
             }
         });
     }
-    /** @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 }); }
-    /** @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 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageListComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.TranslateService }, { token: i2$1.EuiAppShellService }, { token: EuimAppService }, { token: i2.ModalController }, { token: i2.Platform }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @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: i2.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: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i2.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i2.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2.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: i2.IonItemDivider, selector: "ion-item-divider", inputs: ["color", "mode", "sticky"] }, { kind: "component", type: i2.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i2.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: i2.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "component", type: i2.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "directive", type: i2.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.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageListComponent, decorators: [{
             type: Component,
             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" }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }, { type: i2.EuiAppShellService }, { type: EuimAppService }, { type: i1.ModalController }, { type: i1.Platform }] });
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.TranslateService }, { type: i2$1.EuiAppShellService }, { type: EuimAppService }, { type: i2.ModalController }, { type: i2.Platform }] });
 
 class EuimLanguageSelectorComponent {
     constructor(cd, translateService, appShellService, appService, modalCtrl, baseStatesDirective) {
@@ -957,7 +526,7 @@ class EuimLanguageSelectorComponent {
         this.appService = appService;
         this.modalCtrl = modalCtrl;
         this.baseStatesDirective = baseStatesDirective;
-        this._euimPrimary = this.baseStatesDirective.euimPrimary;
+        this._euimPrimary = this.baseStatesDirective.color === 'primary';
         this.destroy$ = new Subject();
     }
     get cssClasses() {
@@ -996,8 +565,8 @@ class EuimLanguageSelectorComponent {
         }
         return;
     }
-    /** @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 }); }
-    /** @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 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageSelectorComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.TranslateService }, { token: i2$1.EuiAppShellService }, { token: EuimAppService }, { token: i2.ModalController }, { token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @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: ["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: i2.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: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageSelectorComponent, decorators: [{
             type: Component,
@@ -1005,44 +574,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimPrimary',
                                 'color',
                             ],
                         },
                     ], 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"] }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }, { type: i2.EuiAppShellService }, { type: EuimAppService }, { type: i1.ModalController }, { type: BaseStatesDirective }], propDecorators: { cssClasses: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-/**
-* @deprecated It will be removed on v17 release. Use {@link ion-list-header} instead.
-*/
-class EuimListHeaderDirective {
-    constructor() {
-        this.className = 'euim-list-divider';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimListHeaderDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: EuimListHeaderDirective, selector: "[euimListHeader]", host: { properties: { "class": "this.className" } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimListHeaderDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[euimListHeader]',
-                }]
-        }], propDecorators: { className: [{
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.TranslateService }, { type: i2$1.EuiAppShellService }, { type: EuimAppService }, { type: i2.ModalController }, { type: BaseStatesDirective }], propDecorators: { cssClasses: [{
                 type: HostBinding,
                 args: ['class']
             }] } });
 
-class EuimListHeaderModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimListHeaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimListHeaderModule, declarations: [EuimListHeaderDirective], imports: [CommonModule,
-            IonicModule], exports: [EuimListHeaderDirective] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimListHeaderModule, imports: [CommonModule,
+class EuimAvatarIconModule {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAvatarIconModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimAvatarIconModule, declarations: [EuimAvatarIconComponent], imports: [CommonModule,
+            IonicModule], exports: [EuimAvatarIconComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAvatarIconModule, imports: [CommonModule,
             IonicModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimListHeaderModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAvatarIconModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
@@ -1050,191 +598,58 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         IonicModule,
                     ],
                     exports: [
-                        EuimListHeaderDirective,
+                        EuimAvatarIconComponent,
                     ],
                     declarations: [
-                        EuimListHeaderDirective,
+                        EuimAvatarIconComponent,
                     ],
                 }]
         }] });
 
-/**
-* @deprecated It will be removed on v17 release. Use {@link euimDivider} instead if there is a case with no separator. For all othere cases ion-item-divider will be used.
-*/
-class EuimItemDividerDirective {
-    constructor() {
-        this.className = 'euim-item-divider';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimItemDividerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: EuimItemDividerDirective, selector: "[euimItemDivider]", host: { properties: { "class": "this.className" } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimItemDividerDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[euimItemDivider]',
-                }]
-        }], propDecorators: { className: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-class EuimItemDividerModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimItemDividerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimItemDividerModule, declarations: [EuimItemDividerDirective], imports: [CommonModule,
-            IonicModule], exports: [EuimItemDividerDirective] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimItemDividerModule, imports: [CommonModule,
-            IonicModule] }); }
+class EuimEmptyListPlaceholderModule {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimEmptyListPlaceholderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimEmptyListPlaceholderModule, declarations: [EuimEmptyListPlaceholderComponent], imports: [CommonModule,
+            IonicModule,
+            TranslateModule], exports: [EuimEmptyListPlaceholderComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimEmptyListPlaceholderModule, imports: [CommonModule,
+            IonicModule,
+            TranslateModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimItemDividerModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimEmptyListPlaceholderModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
                         CommonModule,
                         IonicModule,
+                        TranslateModule,
                     ],
                     exports: [
-                        EuimItemDividerDirective,
+                        EuimEmptyListPlaceholderComponent,
                     ],
                     declarations: [
-                        EuimItemDividerDirective,
+                        EuimEmptyListPlaceholderComponent,
                     ],
                 }]
         }] });
 
-class EuimDividerDirective {
-    get cssClasses() {
-        return this.getCssClasses('euim-divider');
-    }
-    getCssClasses(rootClass) {
-        return [
-            rootClass,
-            this.lines ? `${rootClass}--lines-${this.lines}` : '',
-        ].join(' ').trim();
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDividerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: EuimDividerDirective, selector: "[euimDivider]", inputs: { lines: "lines" }, host: { properties: { "class": "this.cssClasses" } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDividerDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[euimDivider]',
-                }]
-        }], propDecorators: { lines: [{
-                type: Input
-            }], cssClasses: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-class EuimDividerModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDividerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimDividerModule, declarations: [EuimDividerDirective], imports: [CommonModule,
-            IonicModule], exports: [EuimDividerDirective] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDividerModule, imports: [CommonModule,
-            IonicModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDividerModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        IonicModule,
-                    ],
-                    exports: [
-                        EuimDividerDirective,
-                    ],
-                    declarations: [
-                        EuimDividerDirective,
-                    ],
-                }]
-        }] });
-
-class EuimSkeletonTextAvatarDirective {
-    constructor() {
-        this.className = 'euim-skeleton-text-avatar';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonTextAvatarDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: EuimSkeletonTextAvatarDirective, selector: "[euimSkeletonTextAvatar]", host: { properties: { "class": "this.className" } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonTextAvatarDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[euimSkeletonTextAvatar]',
-                }]
-        }], propDecorators: { className: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-class EuimSkeletonTextAvatarModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonTextAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonTextAvatarModule, declarations: [EuimSkeletonTextAvatarDirective], imports: [CommonModule,
-            IonicModule], exports: [EuimSkeletonTextAvatarDirective] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonTextAvatarModule, imports: [CommonModule,
-            IonicModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonTextAvatarModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        IonicModule,
-                    ],
-                    exports: [
-                        EuimSkeletonTextAvatarDirective,
-                    ],
-                    declarations: [
-                        EuimSkeletonTextAvatarDirective,
-                    ],
-                }]
-        }] });
-
-class EuimEmptyListPlaceholderModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimEmptyListPlaceholderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimEmptyListPlaceholderModule, declarations: [EuimEmptyListPlaceholderComponent], imports: [CommonModule,
-            IonicModule,
-            TranslateModule], exports: [EuimEmptyListPlaceholderComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimEmptyListPlaceholderModule, imports: [CommonModule,
-            IonicModule,
-            TranslateModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimEmptyListPlaceholderModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        IonicModule,
-                        TranslateModule,
-                    ],
-                    exports: [
-                        EuimEmptyListPlaceholderComponent,
-                    ],
-                    declarations: [
-                        EuimEmptyListPlaceholderComponent,
-                    ],
-                }]
-        }] });
-
-class EuimLanguageSelectorModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageSelectorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageSelectorModule, declarations: [EuimLanguageSelectorComponent,
-            EuimLanguageListComponent], imports: [CommonModule,
-            IonicModule,
-            EuimAvatarIconModule,
-            EuimLabelModule,
-            EuimItemDividerModule,
-            EuimEmptyListPlaceholderModule,
-            TranslateModule], exports: [EuimLanguageSelectorComponent,
-            EuimLanguageListComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageSelectorModule, providers: [
-            { provide: EclLanguageService, useClass: EclDefaultLanguageService },
-        ], imports: [CommonModule,
-            IonicModule,
-            EuimAvatarIconModule,
-            EuimLabelModule,
-            EuimItemDividerModule,
-            EuimEmptyListPlaceholderModule,
-            TranslateModule] }); }
+class EuimLanguageSelectorModule {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageSelectorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageSelectorModule, declarations: [EuimLanguageSelectorComponent,
+            EuimLanguageListComponent], imports: [CommonModule,
+            IonicModule,
+            EuimAvatarIconModule,
+            EuimLabelModule,
+            EuimEmptyListPlaceholderModule,
+            TranslateModule], exports: [EuimLanguageSelectorComponent,
+            EuimLanguageListComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageSelectorModule, providers: [
+            { provide: EclLanguageService, useClass: EclDefaultLanguageService },
+        ], imports: [CommonModule,
+            IonicModule,
+            EuimAvatarIconModule,
+            EuimLabelModule,
+            EuimEmptyListPlaceholderModule,
+            TranslateModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageSelectorModule, decorators: [{
             type: NgModule,
@@ -1244,7 +659,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         IonicModule,
                         EuimAvatarIconModule,
                         EuimLabelModule,
-                        EuimItemDividerModule,
                         EuimEmptyListPlaceholderModule,
                         TranslateModule,
                     ],
@@ -1266,11 +680,9 @@ class EuimAppModule {
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimAppModule, declarations: [EuimAppComponent], imports: [CommonModule,
             IonicModule,
-            EuimAppSidebarModule,
             EuimLanguageSelectorModule], exports: [EuimAppComponent] }); }
     /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppModule, imports: [CommonModule,
             IonicModule,
-            EuimAppSidebarModule,
             EuimLanguageSelectorModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAppModule, decorators: [{
@@ -1279,7 +691,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                     imports: [
                         CommonModule,
                         IonicModule,
-                        EuimAppSidebarModule,
                         EuimLanguageSelectorModule,
                     ],
                     exports: [
@@ -1353,7 +764,7 @@ class EuiMUserProfileActionComponent {
         this.className = 'euim-user-profile-action';
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuiMUserProfileActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuiMUserProfileActionComponent, selector: "euim-user-profile-action", host: { properties: { "className": "this.className" } }, ngImport: i0, template: "<ion-buttons>\n    <ng-content></ng-content>\n</ion-buttons>\n", dependencies: [{ kind: "component", type: i1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuiMUserProfileActionComponent, selector: "euim-user-profile-action", host: { properties: { "className": "this.className" } }, ngImport: i0, template: "<ion-buttons>\n    <ng-content></ng-content>\n</ion-buttons>\n", dependencies: [{ kind: "component", type: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuiMUserProfileActionComponent, decorators: [{
             type: Component,
@@ -1362,7 +773,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 type: HostBinding
             }] } });
 
-const COMPONENTS$e = [
+const COMPONENTS$b = [
     EuimUserProfileComponent,
     EuiMUserProfileAvatarComponent,
     EuiMUserProfileInfosComponent,
@@ -1392,10 +803,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         IonicModule,
                     ],
                     exports: [
-                        ...COMPONENTS$e,
+                        ...COMPONENTS$b,
                     ],
                     declarations: [
-                        ...COMPONENTS$e,
+                        ...COMPONENTS$b,
                     ],
                 }]
         }] });
@@ -1418,7 +829,7 @@ class EuimToolbarComponent {
         this.backButtonClick.emit(event);
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.3.0", type: EuimToolbarComponent, selector: "euim-toolbar", inputs: { hasBackButton: ["hasBackButton", "hasBackButton", booleanAttribute], backButtonDefaultHref: "backButtonDefaultHref", hasSidebarTrigger: ["hasSidebarTrigger", "hasSidebarTrigger", booleanAttribute], hasLanguageSelector: ["hasLanguageSelector", "hasLanguageSelector", booleanAttribute] }, 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 }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.3.0", type: EuimToolbarComponent, selector: "euim-toolbar", inputs: { hasBackButton: ["hasBackButton", "hasBackButton", booleanAttribute], backButtonDefaultHref: "backButtonDefaultHref", hasSidebarTrigger: ["hasSidebarTrigger", "hasSidebarTrigger", booleanAttribute], hasLanguageSelector: ["hasLanguageSelector", "hasLanguageSelector", booleanAttribute] }, 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$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IonBackButton, selector: "ion-back-button", inputs: ["color", "defaultHref", "disabled", "icon", "mode", "routerAnimation", "text", "type"] }, { kind: "component", type: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i2.IonMenuButton, selector: "ion-menu-button", inputs: ["autoHide", "color", "disabled", "menu", "mode", "type"] }, { kind: "component", type: i2.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { kind: "directive", type: i2.IonBackButtonDelegate, selector: "ion-back-button", inputs: ["defaultHref", "routerAnimation"] }, { kind: "component", type: EuimLanguageSelectorComponent, selector: "euim-language-selector" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimToolbarComponent, decorators: [{
             type: Component,
@@ -1545,13 +956,13 @@ class EuimSidebarComponent {
             }
         });
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSidebarComponent, deps: [{ token: i1$2.Router }, { token: i1.MenuController }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimSidebarComponent, selector: "euim-sidebar", inputs: { ionMenuId: "ionMenuId", routerPath: "routerPath" }, host: { properties: { "className": "this.className" } }, ngImport: i0, template: "<ion-menu contentId=\"{{ionMenuId}}\" menuId=\"{{ionMenuId}}\" slot=\"start\">\n    <ng-content></ng-content>\n    <ion-content>\n        <ng-content select=\"euim-sidebar-content\"></ng-content>\n    </ion-content>\n</ion-menu>\n", styles: [".euim-sidebar-content{height:100%}.euim-sidebar-content__list{height:auto;padding:0}.euim-sidebar-content ion-item euim-avatar-icon:first-child{margin-inline-end:var(--eui-base-spacing-m)}.euim-sidebar-content ion-icon[slot=start]{margin-inline-end:var(--eui-base-spacing-m)}\n"], dependencies: [{ kind: "component", type: i1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i1.IonMenu, selector: "ion-menu", inputs: ["contentId", "disabled", "maxEdgeStart", "menuId", "side", "swipeGesture", "type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSidebarComponent, deps: [{ token: i1$1.Router }, { token: i2.MenuController }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimSidebarComponent, selector: "euim-sidebar", inputs: { ionMenuId: "ionMenuId", routerPath: "routerPath" }, host: { properties: { "className": "this.className" } }, ngImport: i0, template: "<ion-menu contentId=\"{{ionMenuId}}\" menuId=\"{{ionMenuId}}\" slot=\"start\">\n    <ng-content></ng-content>\n    <ion-content>\n        <ng-content select=\"euim-sidebar-content\"></ng-content>\n    </ion-content>\n</ion-menu>\n", styles: [".euim-sidebar-content{height:100%}.euim-sidebar-content__list{height:auto;padding:0}.euim-sidebar-content ion-item euim-avatar-icon:first-child{margin-inline-end:var(--eui-base-spacing-m)}.euim-sidebar-content ion-icon[slot=start]{margin-inline-end:var(--eui-base-spacing-m)}\n"], dependencies: [{ kind: "component", type: i2.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i2.IonMenu, selector: "ion-menu", inputs: ["contentId", "disabled", "maxEdgeStart", "menuId", "side", "swipeGesture", "type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSidebarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'euim-sidebar', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ion-menu contentId=\"{{ionMenuId}}\" menuId=\"{{ionMenuId}}\" slot=\"start\">\n    <ng-content></ng-content>\n    <ion-content>\n        <ng-content select=\"euim-sidebar-content\"></ng-content>\n    </ion-content>\n</ion-menu>\n", styles: [".euim-sidebar-content{height:100%}.euim-sidebar-content__list{height:auto;padding:0}.euim-sidebar-content ion-item euim-avatar-icon:first-child{margin-inline-end:var(--eui-base-spacing-m)}.euim-sidebar-content ion-icon[slot=start]{margin-inline-end:var(--eui-base-spacing-m)}\n"] }]
-        }], ctorParameters: () => [{ type: i1$2.Router }, { type: i1.MenuController }], propDecorators: { className: [{
+        }], ctorParameters: () => [{ type: i1$1.Router }, { type: i2.MenuController }], propDecorators: { className: [{
                 type: HostBinding
             }], ionMenuId: [{
                 type: Input
@@ -1565,7 +976,7 @@ class EuimSidebarContentComponent extends EuimSidebarComponent {
         this.className = 'euim-sidebar-content';
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSidebarContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimSidebarContentComponent, selector: "euim-sidebar-content", host: { properties: { "className": "this.className" } }, usesInheritance: true, ngImport: i0, template: "<ion-list class=\"euim-sidebar-content__list\">\n    <ion-menu-toggle auto-hide=\"true\">\n        <ng-content></ng-content>\n    </ion-menu-toggle>\n</ion-list>\n", dependencies: [{ kind: "component", type: i1.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i1.IonMenuToggle, selector: "ion-menu-toggle", inputs: ["autoHide", "menu"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimSidebarContentComponent, selector: "euim-sidebar-content", host: { properties: { "className": "this.className" } }, usesInheritance: true, ngImport: i0, template: "<ion-list class=\"euim-sidebar-content__list\">\n    <ion-menu-toggle auto-hide=\"true\">\n        <ng-content></ng-content>\n    </ion-menu-toggle>\n</ion-list>\n", dependencies: [{ kind: "component", type: i2.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i2.IonMenuToggle, selector: "ion-menu-toggle", inputs: ["autoHide", "menu"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSidebarContentComponent, decorators: [{
             type: Component,
@@ -1626,7 +1037,7 @@ class EuimHeaderDetailsComponent {
         ].join(' ');
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimHeaderDetailsComponent, deps: [{ token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimHeaderDetailsComponent, selector: "euim-header-details", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimPrimary", "euimPrimary", "color", "color"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".euim-header-details{padding:var(--eui-base-spacing-m);display:block;text-align:center;background-color:var(--eui-base-color-grey-5);border-bottom:1px solid var(--eui-base-color-grey-20)}.euim-header-details--primary{background-color:var(--eui-base-color-primary-100);border-bottom:none}.euim-header-details--primary .euim-header-details__title,.euim-header-details--primary .euim-header-details__meta{color:var(--eui-base-color-white)}.euim-header-details__title{font:var(--eui-base-font-m);margin-bottom:var(--eui-base-spacing-2xs);color:var(--eui-base-color-grey-100)}.euim-header-details__meta{color:var(--eui-base-color-grey-75);font:var(--eui-base-font-s)}.euim-header-details__icon{display:inline-block;margin-bottom:var(--eui-base-spacing-xs)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimHeaderDetailsComponent, selector: "euim-header-details", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["color", "color"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".euim-header-details{padding:var(--eui-base-spacing-m);display:block;text-align:center;background-color:var(--eui-base-color-grey-5);border-bottom:1px solid var(--eui-base-color-grey-20)}.euim-header-details--primary{background-color:var(--eui-base-color-primary-100);border-bottom:none}.euim-header-details--primary .euim-header-details__title,.euim-header-details--primary .euim-header-details__meta{color:var(--eui-base-color-white)}.euim-header-details__title{font:var(--eui-base-font-m);margin-bottom:var(--eui-base-spacing-2xs);color:var(--eui-base-color-grey-100)}.euim-header-details__meta{color:var(--eui-base-color-grey-75);font:var(--eui-base-font-s)}.euim-header-details__icon{display:inline-block;margin-bottom:var(--eui-base-spacing-xs)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimHeaderDetailsComponent, decorators: [{
             type: Component,
@@ -1634,7 +1045,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimPrimary',
                                 'color',
                             ],
                         },
@@ -1695,7 +1105,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 args: ['class']
             }] } });
 
-const COMPONENTS$d = [
+const COMPONENTS$a = [
     EuimHeaderDetailsComponent,
     EuimHeaderDetailsTitleDirective,
     EuimHeaderDetailsMetaDirective,
@@ -1722,114 +1132,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         IonicModule,
                     ],
                     exports: [
-                        ...COMPONENTS$d,
-                    ],
-                    declarations: [
-                        ...COMPONENTS$d,
-                    ],
-                }]
-        }] });
-
-/**
-*  @deprecated It was removed in v16. Use {@link euim-slider-info-screen} instead.
-*/
-class EuimInfoScreenComponent {
-    constructor() {
-        this.className = 'euim-info-screen';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @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 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenComponent, decorators: [{
-            type: Component,
-            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"] }]
-        }], propDecorators: { className: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-class EuimInfoScreenContentDirective {
-    constructor() {
-        this.className = 'euim-info-screen__content';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: EuimInfoScreenContentDirective, selector: "[euimInfoScreenContent]", host: { properties: { "class": "this.className" } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenContentDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[euimInfoScreenContent]',
-                }]
-        }], propDecorators: { className: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-class EuimInfoScreenTitleDirective {
-    constructor() {
-        this.className = 'euim-info-screen__title';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: EuimInfoScreenTitleDirective, selector: "[euimInfoScreenTitle]", host: { properties: { "class": "this.className" } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenTitleDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[euimInfoScreenTitle]',
-                }]
-        }], propDecorators: { className: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-class EuimInfoScreenSubTitleDirective {
-    constructor() {
-        this.className = 'euim-info-screen__sub-title';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenSubTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: EuimInfoScreenSubTitleDirective, selector: "[euimInfoScreenSubTitle]", host: { properties: { "class": "this.className" } }, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenSubTitleDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[euimInfoScreenSubTitle]',
-                }]
-        }], propDecorators: { className: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-const COMPONENTS$c = [
-    EuimInfoScreenComponent,
-    EuimInfoScreenTitleDirective,
-    EuimInfoScreenContentDirective,
-    EuimInfoScreenSubTitleDirective,
-];
-class EuimInfoScreenModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenModule, declarations: [EuimInfoScreenComponent,
-            EuimInfoScreenTitleDirective,
-            EuimInfoScreenContentDirective,
-            EuimInfoScreenSubTitleDirective], imports: [CommonModule,
-            IonicModule], exports: [EuimInfoScreenComponent,
-            EuimInfoScreenTitleDirective,
-            EuimInfoScreenContentDirective,
-            EuimInfoScreenSubTitleDirective] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenModule, imports: [CommonModule,
-            IonicModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimInfoScreenModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        IonicModule,
-                    ],
-                    exports: [
-                        ...COMPONENTS$c,
+                        ...COMPONENTS$a,
                     ],
                     declarations: [
-                        ...COMPONENTS$c,
+                        ...COMPONENTS$a,
                     ],
                 }]
         }] });
@@ -1847,7 +1153,7 @@ class EuimBadgeComponent {
         ].join(' ').trim();
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimBadgeComponent, deps: [{ token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimBadgeComponent, selector: "euim-badge", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimDanger", "euimDanger", "euimWarning", "euimWarning", "euimInfo", "euimInfo", "euimSuccess", "euimSuccess", "euimDefault", "euimDefault", "euimPositionTopEnd", "euimPositionTopEnd", "euimSizeM", "euimSizeM", "euimSizeS", "euimSizeS", "euimSizeL", "euimSizeL", "color", "color"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".euim-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:50px;height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs);color:var(--eui-base-color-white);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--eui-base-font-size-s)!important;line-height:var(--eui-base-font-size-m)!important;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;box-sizing:border-box;letter-spacing:normal}.euim-avatar-icon{position:relative;overflow:visible}.euim-avatar-icon .euim-badge--position-top-end{position:absolute;right:-6px;top:-6px}ion-button .euim-badge--position-top-end,ion-tab-button span .euim-badge--position-top-end{position:absolute;transform:translate(var(--eui-base-spacing-s));top:calc(-1 * var(--eui-base-spacing-s))}ion-button .euim-badge--size-l.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-l.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-s));transform:translate(-12px)}ion-button .euim-badge--size-m.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-m.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-xs));transform:translate(-12px)}ion-button .euim-badge--size-s.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-s.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-2xs));transform:translate(-12px)}ion-button::part(native){overflow:visible}ion-tab-button span{position:relative}ion-tab-button span ion-icon{font-size:var(--eui-base-font-size-2xl)}.euim-badge--info{background:var(--eui-base-color-info-100)}.euim-badge--success{background:var(--eui-base-color-success-100)}.euim-badge--warning{background:var(--eui-base-color-warning-100)}.euim-badge--danger{background:var(--eui-base-color-danger-100)}.euim-badge--default{background:var(--eui-base-color-grey-20);color:var(--eui-base-color-grey-100)}.euim-badge--size-s{min-width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m);padding:0 var(--eui-base-spacing-2xs);font-size:var(--eui-base-font-size-xs)!important;line-height:var(--eui-base-font-size-m)!important}.euim-badge--size-m{min-width:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));padding:calc(var(--eui-base-spacing-2xs) / 2) calc(var(--eui-base-spacing-s) / 2);font-size:var(--eui-base-font-size-xs)!important;line-height:var(--eui-base-font-size-m)!important}.euim-badge--size-l{height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs);font-size:var(--eui-base-font-size-s)!important;line-height:var(--eui-base-font-size-m)!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimBadgeComponent, selector: "euim-badge", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimPositionTopEnd", "euimPositionTopEnd", "euimSizeM", "euimSizeM", "euimSizeS", "euimSizeS", "euimSizeL", "euimSizeL", "color", "color"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".euim-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:50px;height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs);color:var(--eui-base-color-white);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--eui-base-font-size-s)!important;line-height:var(--eui-base-font-size-m)!important;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;box-sizing:border-box;letter-spacing:normal}.euim-avatar-icon{position:relative;overflow:visible}.euim-avatar-icon .euim-badge--position-top-end{position:absolute;right:-6px;top:-6px}ion-button .euim-badge--position-top-end,ion-tab-button span .euim-badge--position-top-end{position:absolute;transform:translate(var(--eui-base-spacing-s));top:calc(-1 * var(--eui-base-spacing-s))}ion-button .euim-badge--size-l.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-l.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-s));transform:translate(-12px)}ion-button .euim-badge--size-m.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-m.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-xs));transform:translate(-12px)}ion-button .euim-badge--size-s.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-s.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-2xs));transform:translate(-12px)}ion-button::part(native){overflow:visible}ion-tab-button span{position:relative}ion-tab-button span ion-icon{font-size:var(--eui-base-font-size-2xl)}.euim-badge--info{background:var(--eui-base-color-info-100)}.euim-badge--success{background:var(--eui-base-color-success-100)}.euim-badge--warning{background:var(--eui-base-color-warning-100)}.euim-badge--danger{background:var(--eui-base-color-danger-100)}.euim-badge--default{background:var(--eui-base-color-grey-20);color:var(--eui-base-color-grey-100)}.euim-badge--size-s{min-width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m);padding:0 var(--eui-base-spacing-2xs);font-size:var(--eui-base-font-size-xs)!important;line-height:var(--eui-base-font-size-m)!important}.euim-badge--size-m{min-width:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));padding:calc(var(--eui-base-spacing-2xs) / 2) calc(var(--eui-base-spacing-s) / 2);font-size:var(--eui-base-font-size-xs)!important;line-height:var(--eui-base-font-size-m)!important}.euim-badge--size-l{height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs);font-size:var(--eui-base-font-size-s)!important;line-height:var(--eui-base-font-size-m)!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimBadgeComponent, decorators: [{
             type: Component,
@@ -1855,11 +1161,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimDanger',
-                                'euimWarning',
-                                'euimInfo',
-                                'euimSuccess',
-                                'euimDefault',
                                 'euimPositionTopEnd',
                                 'euimSizeM',
                                 'euimSizeS',
@@ -1898,16 +1199,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
 
 class EuimMessageComponent {
     get icon() {
-        if (this.baseStatesDirective.euimWarning) {
+        if (this.baseStatesDirective.color === 'warning') {
             return 'alert-circle';
         }
-        if (this.baseStatesDirective.euimDanger) {
+        if (this.baseStatesDirective.color === 'danger') {
             return 'close-circle';
         }
-        if (this.baseStatesDirective.euimSuccess) {
+        if (this.baseStatesDirective.color === 'success') {
             return 'checkmark-circle';
         }
-        if (this.baseStatesDirective.euimInfo || !this.baseStatesDirective.euimWarning && !this.baseStatesDirective.euimDanger && !this.baseStatesDirective.euimSuccess && !this.baseStatesDirective.euimInfo) {
+        if (this.baseStatesDirective.color === 'info' || (this.baseStatesDirective.color !== 'warning' && this.baseStatesDirective.color !== 'danger' && this.baseStatesDirective.color !== 'success' && this.baseStatesDirective.color !== 'info')) {
             return 'information-circle';
         }
     }
@@ -1920,14 +1221,14 @@ class EuimMessageComponent {
     getCssClasses() {
         return [
             this.baseStatesDirective.getCssClasses('euim-message'),
-            !this.baseStatesDirective.euimWarning &&
-                !this.baseStatesDirective.euimDanger &&
-                !this.baseStatesDirective.euimSuccess &&
-                !this.baseStatesDirective.euimInfo ? 'euim-message--info' : '',
+            this.baseStatesDirective.color !== 'warning' &&
+                this.baseStatesDirective.color !== 'danger' &&
+                this.baseStatesDirective.color !== 'success' &&
+                this.baseStatesDirective.color !== 'info' ? 'euim-message--info' : '',
         ].join(' ');
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMessageComponent, deps: [{ token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimMessageComponent, selector: "euim-message", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimInfo", "euimInfo", "euimSuccess", "euimSuccess", "euimWarning", "euimWarning", "euimDanger", "euimDanger", "euimVariant", "euimVariant", "color", "color", "variant", "variant"] }], ngImport: i0, template: "<div class=\"euim-message__wrappericon\">\n    <ion-icon [name]=\"icon\" class=\"euim-message__icon\"></ion-icon>\n</div>\n<div class=\"euim-message__wrapper\">\n    <ng-content select=\"euim-message-title\"></ng-content>\n    <ng-content></ng-content>\n</div>\n", styles: [".euim-message{border-width:2px;border-style:solid;display:flex;padding:var(--eui-base-spacing-m)}.euim-message__wrappericon{width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);padding:0;margin:0}.euim-message__icon{padding:0;margin:0;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l)}.euim-message__wrapper{margin-left:var(--eui-base-spacing-xs)}.euim-message--danger{border-color:var(--eui-base-color-danger-100)}.euim-message--danger ion-icon{color:var(--eui-base-color-danger-100)}.euim-message--info{border-color:var(--eui-base-color-info-100)}.euim-message--info ion-icon{color:var(--eui-base-color-info-100)}.euim-message--success{border-color:var(--eui-base-color-success-100)}.euim-message--success ion-icon{color:var(--eui-base-color-success-100)}.euim-message--warning{border-color:var(--eui-base-color-warning-100)}.euim-message--warning ion-icon{color:var(--eui-base-color-warning-100)}.euim-message-title{display:flex;align-items:center;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;padding:0;margin:0 0 var(--eui-base-spacing-xs)}\n"], dependencies: [{ 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 }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimMessageComponent, selector: "euim-message", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["color", "color"] }], ngImport: i0, template: "<div class=\"euim-message__wrappericon\">\n    <ion-icon [name]=\"icon\" class=\"euim-message__icon\"></ion-icon>\n</div>\n<div class=\"euim-message__wrapper\">\n    <ng-content select=\"euim-message-title\"></ng-content>\n    <ng-content></ng-content>\n</div>\n", styles: [".euim-message{border-width:2px;border-style:solid;display:flex;padding:var(--eui-base-spacing-m)}.euim-message__wrappericon{width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);padding:0;margin:0}.euim-message__icon{padding:0;margin:0;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l)}.euim-message__wrapper{margin-left:var(--eui-base-spacing-xs)}.euim-message--danger{border-color:var(--eui-base-color-danger-100)}.euim-message--danger ion-icon{color:var(--eui-base-color-danger-100)}.euim-message--info{border-color:var(--eui-base-color-info-100)}.euim-message--info ion-icon{color:var(--eui-base-color-info-100)}.euim-message--success{border-color:var(--eui-base-color-success-100)}.euim-message--success ion-icon{color:var(--eui-base-color-success-100)}.euim-message--warning{border-color:var(--eui-base-color-warning-100)}.euim-message--warning ion-icon{color:var(--eui-base-color-warning-100)}.euim-message-title{display:flex;align-items:center;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;padding:0;margin:0 0 var(--eui-base-spacing-xs)}\n"], dependencies: [{ kind: "component", type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMessageComponent, decorators: [{
             type: Component,
@@ -1935,13 +1236,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimInfo',
-                                'euimSuccess',
-                                'euimWarning',
-                                'euimDanger',
-                                'euimVariant',
                                 'color',
-                                'variant',
                             ],
                         },
                     ], template: "<div class=\"euim-message__wrappericon\">\n    <ion-icon [name]=\"icon\" class=\"euim-message__icon\"></ion-icon>\n</div>\n<div class=\"euim-message__wrapper\">\n    <ng-content select=\"euim-message-title\"></ng-content>\n    <ng-content></ng-content>\n</div>\n", styles: [".euim-message{border-width:2px;border-style:solid;display:flex;padding:var(--eui-base-spacing-m)}.euim-message__wrappericon{width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l);padding:0;margin:0}.euim-message__icon{padding:0;margin:0;width:var(--eui-base-spacing-l);height:var(--eui-base-spacing-l)}.euim-message__wrapper{margin-left:var(--eui-base-spacing-xs)}.euim-message--danger{border-color:var(--eui-base-color-danger-100)}.euim-message--danger ion-icon{color:var(--eui-base-color-danger-100)}.euim-message--info{border-color:var(--eui-base-color-info-100)}.euim-message--info ion-icon{color:var(--eui-base-color-info-100)}.euim-message--success{border-color:var(--eui-base-color-success-100)}.euim-message--success ion-icon{color:var(--eui-base-color-success-100)}.euim-message--warning{border-color:var(--eui-base-color-warning-100)}.euim-message--warning ion-icon{color:var(--eui-base-color-warning-100)}.euim-message-title{display:flex;align-items:center;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;padding:0;margin:0 0 var(--eui-base-spacing-xs)}\n"] }]
@@ -1964,7 +1259,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 type: HostBinding
             }] } });
 
-const COMPONENTS$b = [
+const COMPONENTS$9 = [
     EuimMessageComponent,
     EuimMessageTitleComponent,
 ];
@@ -1985,167 +1280,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         IonicModule,
                     ],
                     exports: [
-                        ...COMPONENTS$b,
-                    ],
-                    declarations: [
-                        ...COMPONENTS$b,
-                    ],
-                }]
-        }] });
-
-class EuimStepperChangeEvent {
-    constructor(currentStep) {
-        this.currentStep = currentStep;
-    }
-}
-class EuimStepperComponent {
-    constructor() {
-        this.currentStep = 1;
-        this.stepsCount = 5;
-        this.isPreviousDisabled = true;
-        this.isNextDisabled = false;
-        this.previous = new EventEmitter();
-        this.next = new EventEmitter();
-    }
-    onPrevious() {
-        if (this.currentStep > 1) {
-            this.currentStep -= 1;
-        }
-        this.updateActionsState();
-        this.previous.emit(new EuimStepperChangeEvent(this.currentStep));
-    }
-    onNext() {
-        if (this.currentStep < this.stepsCount) {
-            this.currentStep += 1;
-        }
-        this.updateActionsState();
-        this.next.emit(new EuimStepperChangeEvent(this.currentStep));
-    }
-    updateActionsState() {
-        this.isPreviousDisabled = this.currentStep <= 1;
-        this.isNextDisabled = this.currentStep >= this.stepsCount;
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimStepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.3.0", type: EuimStepperComponent, selector: "euim-stepper", inputs: { currentStep: "currentStep", stepsCount: "stepsCount", isPreviousDisabled: ["isPreviousDisabled", "isPreviousDisabled", booleanAttribute], isNextDisabled: ["isNextDisabled", "isNextDisabled", booleanAttribute] }, outputs: { previous: "previous", next: "next" }, ngImport: i0, template: "<ion-footer>\n    <ion-footer fill=\"clear\">\n        <ion-toolbar color=\"light\">\n            <ion-row class=\"ion-align-items-center\">\n                <ion-col class=\"ion-text-start\">\n                    <ion-button\n                        (click)=\"onPrevious()\"\n                        [disabled]=\"isPreviousDisabled\"\n                        fill=\"clear\"\n                        size=\"small\">\n                        <ion-icon name=\"chevron-back-outline\" slot=\"start\"></ion-icon>\n                        <ion-label>{{ 'euim.stepper.previous' | translate }}</ion-label>\n                    </ion-button>\n                </ion-col>\n\n                <ion-col class=\"ion-text-center\">\n                    <ion-label color=\"primary\">\n                        {{ currentStep }} {{ 'euim.stepper.of' | translate }} {{stepsCount }}\n                    </ion-label>\n                </ion-col>\n\n                <ion-col class=\"ion-text-end\">\n                    <ion-button\n                        (click)=\"onNext()\"\n                        [disabled]=\"isNextDisabled\"\n                        fill=\"clear\"\n                        size=\"small\">\n                        <ion-label>{{ 'euim.stepper.next' | translate }}</ion-label>\n                        <ion-icon name=\"chevron-forward-outline\" slot=\"end\"></ion-icon>\n                    </ion-button>\n                </ion-col>\n            </ion-row>\n        </ion-toolbar>\n    </ion-footer>\n</ion-footer>\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.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { 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.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1.IonRow, selector: "ion-row" }, { kind: "component", type: i1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimStepperComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'euim-stepper', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ion-footer>\n    <ion-footer fill=\"clear\">\n        <ion-toolbar color=\"light\">\n            <ion-row class=\"ion-align-items-center\">\n                <ion-col class=\"ion-text-start\">\n                    <ion-button\n                        (click)=\"onPrevious()\"\n                        [disabled]=\"isPreviousDisabled\"\n                        fill=\"clear\"\n                        size=\"small\">\n                        <ion-icon name=\"chevron-back-outline\" slot=\"start\"></ion-icon>\n                        <ion-label>{{ 'euim.stepper.previous' | translate }}</ion-label>\n                    </ion-button>\n                </ion-col>\n\n                <ion-col class=\"ion-text-center\">\n                    <ion-label color=\"primary\">\n                        {{ currentStep }} {{ 'euim.stepper.of' | translate }} {{stepsCount }}\n                    </ion-label>\n                </ion-col>\n\n                <ion-col class=\"ion-text-end\">\n                    <ion-button\n                        (click)=\"onNext()\"\n                        [disabled]=\"isNextDisabled\"\n                        fill=\"clear\"\n                        size=\"small\">\n                        <ion-label>{{ 'euim.stepper.next' | translate }}</ion-label>\n                        <ion-icon name=\"chevron-forward-outline\" slot=\"end\"></ion-icon>\n                    </ion-button>\n                </ion-col>\n            </ion-row>\n        </ion-toolbar>\n    </ion-footer>\n</ion-footer>\n" }]
-        }], propDecorators: { currentStep: [{
-                type: Input
-            }], stepsCount: [{
-                type: Input
-            }], isPreviousDisabled: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], isNextDisabled: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], previous: [{
-                type: Output
-            }], next: [{
-                type: Output
-            }] } });
-
-class EuimStepperComponentModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimStepperComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimStepperComponentModule, declarations: [EuimStepperComponent], imports: [CommonModule,
-            IonicModule,
-            TranslateModule], exports: [EuimStepperComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimStepperComponentModule, imports: [CommonModule,
-            IonicModule,
-            TranslateModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimStepperComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        IonicModule,
-                        TranslateModule,
-                    ],
-                    exports: [
-                        EuimStepperComponent,
-                    ],
-                    declarations: [
-                        EuimStepperComponent,
-                    ],
-                }]
-        }] });
-
-class EuimFieldSetComponent {
-    constructor() {
-        this.className = 'euim-fieldset';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimFieldSetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @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 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimFieldSetComponent, decorators: [{
-            type: Component,
-            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"] }]
-        }], propDecorators: { className: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-class EuimFieldsetLegendComponent {
-    constructor() {
-        this.className = 'euim-fieldset-legend';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimFieldsetLegendComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimFieldsetLegendComponent, selector: "euim-fieldset-legend", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimFieldsetLegendComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'euim-fieldset-legend', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n" }]
-        }], propDecorators: { className: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-class EuimFieldsetActionsComponent {
-    constructor() {
-        this.className = 'euim-fieldset-actions';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimFieldsetActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimFieldsetActionsComponent, selector: "euim-fieldset-actions", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimFieldsetActionsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'euim-fieldset-actions', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n" }]
-        }], propDecorators: { className: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-const COMPONENTS$a = [
-    EuimFieldSetComponent,
-    EuimFieldsetLegendComponent,
-    EuimFieldsetActionsComponent,
-];
-class EuimFieldsetModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimFieldsetModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimFieldsetModule, declarations: [EuimFieldSetComponent,
-            EuimFieldsetLegendComponent,
-            EuimFieldsetActionsComponent], imports: [CommonModule,
-            IonicModule], exports: [EuimFieldSetComponent,
-            EuimFieldsetLegendComponent,
-            EuimFieldsetActionsComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimFieldsetModule, imports: [CommonModule,
-            IonicModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimFieldsetModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        IonicModule,
-                    ],
-                    exports: [
-                        ...COMPONENTS$a,
+                        ...COMPONENTS$9,
                     ],
                     declarations: [
-                        ...COMPONENTS$a,
+                        ...COMPONENTS$9,
                     ],
                 }]
         }] });
@@ -2155,7 +1293,7 @@ class EuimSpinnerComponent {
         this.className = 'euim-spinner';
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @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 }); }
+    /** @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: i2.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSpinnerComponent, decorators: [{
             type: Component,
@@ -2256,7 +1394,7 @@ class EuimMediaHeaderComponent {
         ].join(' ').trim();
     }
     /** @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 }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimMediaHeaderComponent, selector: "euim-media-header", inputs: { euimNoGradient: ["euimNoGradient", "euimNoGradient", booleanAttribute] }, 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 }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimMediaHeaderComponent, selector: "euim-media-header", inputs: { euimNoGradient: ["euimNoGradient", "euimNoGradient", booleanAttribute] }, 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 .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,#fff0,#000);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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMediaHeaderComponent, decorators: [{
             type: Component,
@@ -2269,7 +1407,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                                 'euimSizeL',
                             ],
                         },
-                    ], 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"] }]
+                    ], 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 .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,#fff0,#000);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"] }]
         }], ctorParameters: () => [{ type: BaseStatesDirective }], propDecorators: { euimNoGradient: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
@@ -2329,7 +1467,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 args: ['class']
             }] } });
 
-const COMPONENTS$9 = [
+const COMPONENTS$8 = [
     EuimMediaHeaderComponent,
     EuimMediaHeaderTitleDirective,
     EuimMediaHeaderSubTitleDirective,
@@ -2356,10 +1494,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         IonicModule,
                     ],
                     exports: [
-                        ...COMPONENTS$9,
+                        ...COMPONENTS$8,
                     ],
                     declarations: [
-                        ...COMPONENTS$9,
+                        ...COMPONENTS$8,
                     ],
                 }]
         }] });
@@ -2377,7 +1515,7 @@ class EuimDataSummaryColLabelDirective {
         ].join(' ').trim();
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDataSummaryColLabelDirective, deps: [{ token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: EuimDataSummaryColLabelDirective, selector: "[euimDataSummaryColLabel]", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimPrimary", "euimPrimary"] }], ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: EuimDataSummaryColLabelDirective, selector: "[euimDataSummaryColLabel]", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["color", "color"] }], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDataSummaryColLabelDirective, decorators: [{
             type: Directive,
@@ -2387,7 +1525,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimPrimary',
+                                'color',
                             ],
                         },
                     ],
@@ -2437,18 +1575,18 @@ class EuimDataSummaryComponent {
     ngAfterContentInit() {
         if (this.euimDataSummaryColLabelComponent
             && this.euimDataSummaryColValueComponent) {
-            if (this.baseStatesDirective.euimPrimary) {
+            if (this.baseStatesDirective.color) {
                 this.euimDataSummaryColLabelComponent.forEach(item => {
-                    item.baseStatesDirective.euimPrimary = true;
+                    item.baseStatesDirective.color = 'primary';
                 });
                 this.euimDataSummaryColValueComponent.forEach(item => {
-                    item.baseStatesDirective.euimPrimary = true;
+                    item.baseStatesDirective.color = 'primary';
                 });
             }
         }
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDataSummaryComponent, deps: [{ token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimDataSummaryComponent, selector: "euim-data-summary", host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "euimDataSummaryColLabelComponent", predicate: EuimDataSummaryColLabelDirective, descendants: true }, { propertyName: "euimDataSummaryColValueComponent", predicate: EuimDataSummaryColValueDirective, descendants: true }], hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimPrimary", "euimPrimary", "color", "color"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".euim-data-summary{display:flex;width:100%;padding:var(--eui-base-spacing-s);border-bottom:1px solid var(--eui-base-color-grey-20);border-top:1px solid var(--eui-base-color-grey-20)}.euim-data-summary--primary{background-color:var(--eui-base-color-primary-100);border-bottom:0;border-top:0}.euim-data-summary__col{width:100%;text-align:center}.euim-data-summary__col+.euim-data-summary__col{border-left:1px solid var(--eui-base-color-grey-20)}.euim-data-summary__col-label{color:var(--eui-base-color-grey-100);font:var(--eui-base-font-m);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;margin-bottom:var(--eui-base-spacing-2xs)}.euim-data-summary__col-label--primary{color:var(--eui-base-color-white)}.euim-data-summary__col-value{color:var(--eui-base-color-grey-75);font:var(--eui-base-font-s)}.euim-data-summary__col-value--primary{color:var(--eui-base-color-white)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimDataSummaryComponent, selector: "euim-data-summary", host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "euimDataSummaryColLabelComponent", predicate: EuimDataSummaryColLabelDirective, descendants: true }, { propertyName: "euimDataSummaryColValueComponent", predicate: EuimDataSummaryColValueDirective, descendants: true }], hostDirectives: [{ directive: BaseStatesDirective, inputs: ["color", "color"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".euim-data-summary{display:flex;width:100%;padding:var(--eui-base-spacing-s);border-bottom:1px solid var(--eui-base-color-grey-20);border-top:1px solid var(--eui-base-color-grey-20)}.euim-data-summary--primary{background-color:var(--eui-base-color-primary-100);border-bottom:0;border-top:0}.euim-data-summary__col{width:100%;text-align:center}.euim-data-summary__col+.euim-data-summary__col{border-left:1px solid var(--eui-base-color-grey-20)}.euim-data-summary__col-label{color:var(--eui-base-color-grey-100);font:var(--eui-base-font-m);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;margin-bottom:var(--eui-base-spacing-2xs)}.euim-data-summary__col-label--primary{color:var(--eui-base-color-white)}.euim-data-summary__col-value{color:var(--eui-base-color-grey-75);font:var(--eui-base-font-s)}.euim-data-summary__col-value--primary{color:var(--eui-base-color-white)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDataSummaryComponent, decorators: [{
             type: Component,
@@ -2456,7 +1594,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimPrimary',
                                 'color',
                             ],
                         },
@@ -2490,7 +1627,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 args: ['class']
             }] } });
 
-const COMPONENTS$8 = [
+const COMPONENTS$7 = [
     EuimDataSummaryComponent,
     EuimDataSummaryColComponent,
     EuimDataSummaryColLabelDirective,
@@ -2517,10 +1654,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         IonicModule,
                     ],
                     exports: [
-                        ...COMPONENTS$8,
+                        ...COMPONENTS$7,
                     ],
                     declarations: [
-                        ...COMPONENTS$8,
+                        ...COMPONENTS$7,
                     ],
                 }]
         }] });
@@ -2574,7 +1711,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 args: ['class']
             }] } });
 
-const COMPONENTS$7 = [
+const COMPONENTS$6 = [
     EuimAvatarComponent,
     EuimAvatarSubIconDirective,
     EuimAvatarMainIconDirective,
@@ -2584,374 +1721,135 @@ class EuimAvatarModule {
     /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimAvatarModule, declarations: [EuimAvatarComponent,
             EuimAvatarSubIconDirective,
             EuimAvatarMainIconDirective], imports: [CommonModule,
-            IonicModule], exports: [EuimAvatarComponent,
-            EuimAvatarSubIconDirective,
-            EuimAvatarMainIconDirective] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAvatarModule, imports: [CommonModule,
-            IonicModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAvatarModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        IonicModule,
-                    ],
-                    exports: [
-                        ...COMPONENTS$7,
-                    ],
-                    declarations: [
-                        ...COMPONENTS$7,
-                    ],
-                }]
-        }] });
-
-class EuimAlertMessageComponent {
-    constructor(baseStatesDirective) {
-        this.baseStatesDirective = baseStatesDirective;
-        this._variant = 'default';
-        this.euimClose = new EventEmitter();
-        this.euimLabelTruncate = false;
-        this.hasIcon = false;
-        this.isCloseable = false;
-        this.isVisible = true;
-    }
-    ngOnInit() {
-        if (this.baseStatesDirective) {
-            this.setVariants();
-        }
-    }
-    setVariants() {
-        if (this.baseStatesDirective.euimInfo) {
-            this._variant = 'info';
-        }
-        else if (this.baseStatesDirective.euimSuccess) {
-            this._variant = 'success';
-        }
-        else if (this.baseStatesDirective.euimDanger) {
-            this._variant = 'danger';
-        }
-        else if (this.baseStatesDirective.euimPrimary) {
-            this._variant = 'primary';
-        }
-        else if (this.baseStatesDirective.euimDark) {
-            this._variant = 'dark';
-        }
-        else if (this.baseStatesDirective.euimWarning) {
-            this._variant = 'warning';
-        }
-        else if (this.baseStatesDirective.euimLight) {
-            this._variant = 'light';
-        }
-        else if (this.baseStatesDirective.euimClear) {
-            this._variant = 'clear';
-        }
-    }
-    get icon() {
-        switch (this._variant) {
-            case 'warning':
-                return 'alert-circle-sharp';
-            case 'danger':
-                return 'close-circle-sharp';
-            case 'success':
-                return 'checkmark-circle-sharp';
-            case 'info':
-                return 'information-circle-sharp';
-            case 'primary':
-                return 'search-sharp';
-            case 'dark':
-                return 'search-sharp';
-            case 'light':
-                return 'search-sharp';
-            case 'clear':
-                return 'search-sharp';
-            default:
-                return '';
-        }
-    }
-    get cssClasses() {
-        return this.getCssClasses();
-    }
-    getCssClasses() {
-        return [
-            this.baseStatesDirective.getCssClasses('euim-alert-message'),
-            this._variant ? `euim-alert-message--${this._variant}` : '',
-            !this.isVisible ? 'euim-alert-message--hidden' : '',
-        ].join(' ');
-    }
-    onClose(event) {
-        if (event) {
-            event.preventDefault();
-        }
-        this.isVisible = false;
-        this.euimClose.emit();
-    }
-    /** @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 }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimAlertMessageComponent, selector: "euim-alert-message", inputs: { euimLabelTruncate: ["euimLabelTruncate", "euimLabelTruncate", booleanAttribute], hasIcon: ["hasIcon", "hasIcon", booleanAttribute], isCloseable: ["isCloseable", "isCloseable", booleanAttribute] }, 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 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAlertMessageComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'euim-alert-message', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, hostDirectives: [
-                        {
-                            directive: BaseStatesDirective,
-                            inputs: [
-                                'euimInfo',
-                                'euimSuccess',
-                                'euimWarning',
-                                'euimDanger',
-                                'euimPrimary',
-                                'euimDark',
-                                'euimLight',
-                                'euimClear',
-                                'euimVariant',
-                                'color',
-                            ],
-                        },
-                    ], 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"] }]
-        }], ctorParameters: () => [{ type: BaseStatesDirective }], propDecorators: { euimClose: [{
-                type: Output
-            }], euimLabelTruncate: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], hasIcon: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], isCloseable: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], cssClasses: [{
-                type: HostBinding,
-                args: ['class']
-            }] } });
-
-const COMPONENTS$6 = [
-    EuimAlertMessageComponent,
-];
-class EuimAlertMessageModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAlertMessageModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimAlertMessageModule, declarations: [EuimAlertMessageComponent], imports: [CommonModule,
-            IonicModule,
-            EuimLabelModule], exports: [EuimAlertMessageComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAlertMessageModule, imports: [CommonModule,
-            IonicModule,
-            EuimLabelModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAlertMessageModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        IonicModule,
-                        EuimLabelModule,
-                    ],
-                    exports: [
-                        ...COMPONENTS$6,
-                    ],
-                    declarations: [
-                        ...COMPONENTS$6,
-                    ],
-                }]
-        }] });
-
-/**
-*  @deprecated It was removed in v16. Use {@link euim-slider-info-screen} instead.
-*/
-class EuimSliderComponent {
-    constructor(renderer, gestureCtrl, sliderElement, cdr) {
-        this.renderer = renderer;
-        this.gestureCtrl = gestureCtrl;
-        this.sliderElement = sliderElement;
-        this.cdr = cdr;
-        this.actionClicked = new EventEmitter();
-        this.lastStepActionClicked = new EventEmitter();
-        this.leftBtnActionClicked = new EventEmitter();
-        this.actionBtnNames = {
-            actionBtnName: 'Skip',
-            lastStepActionBtnName: 'Done',
-            leftActionBtnName: 'Previous',
-        };
-        this.isLastItemReached = false;
-        this.isLeftBtnVisible = false;
-        this.isPreviousBtn = false;
-        this.isNextBtn = false;
-        this.isRightBtnVisible = true;
-        this.className = 'euim-slider';
-        this.slidesArray = [];
-        this.currentSlide = 0;
-        this.startX = 0;
-    }
-    onResize(event) {
-        this.setSliderStyles();
-    }
-    ngAfterViewInit() {
-        this.setSliderStyles();
-    }
-    ngOnInit() {
-        const gesture = this.gestureCtrl.create({
-            el: this.sliderElement.nativeElement,
-            gestureName: 'on-gesture-end',
-            onEnd: (event) => {
-                this.handleTouchEnd(event);
-                this.isPreviousButtonVisible();
-                this.isNextButtonVisible();
-            },
-        });
-        gesture.enable();
-        this.isPreviousButtonVisible();
-        this.isNextButtonVisible();
-    }
-    setSliderStyles() {
-        const windowHeight = window.innerHeight;
-        const paginationHeight = 60;
-        const slideHeight = windowHeight - paginationHeight;
-        this.slidesArray = this.slides.nativeElement.children;
-        this.renderer.setStyle(this.slides.nativeElement, 'width', `${this.slidesArray.length * 100}%`);
-        for (const slide of this.slidesArray) {
-            this.renderer.setStyle(slide, 'width', `${100 / this.slidesArray.length}%`);
-            this.renderer.setStyle(slide, 'maxHeight', `${slideHeight}px`);
-            this.renderer.setStyle(slide, 'overflow', 'auto');
-        }
-        // to calculate the case when there is only one slide
-        if (!this.isLastItemReached && this.slidesArray.length < 2) {
-            this.isLastItemReached = true;
-        }
-    }
-    isPreviousButtonVisible() {
-        this.isLeftBtnVisible = this.currentSlide > 0 && this.isPreviousBtn;
-    }
-    isNextButtonVisible() {
-        this.isRightBtnVisible = this.currentSlide !== this.slidesArray.length - 1 && this.isNextBtn;
+            IonicModule], exports: [EuimAvatarComponent,
+            EuimAvatarSubIconDirective,
+            EuimAvatarMainIconDirective] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAvatarModule, imports: [CommonModule,
+            IonicModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAvatarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        IonicModule,
+                    ],
+                    exports: [
+                        ...COMPONENTS$6,
+                    ],
+                    declarations: [
+                        ...COMPONENTS$6,
+                    ],
+                }]
+        }] });
+
+class EuimAlertMessageComponent {
+    constructor(baseStatesDirective) {
+        this.baseStatesDirective = baseStatesDirective;
+        this._variant = 'default';
+        this.euimClose = new EventEmitter();
+        this.euimLabelTruncate = false;
+        this.hasIcon = false;
+        this.isCloseable = false;
+        this.isVisible = true;
     }
-    handleTouchEnd(e) {
-        const difference = -e.deltaX;
-        if (difference > 0 && this.currentSlide < this.slidesArray.length - 1) {
-            this.currentSlide++;
-            this.isLastItemReached = false;
-        }
-        else if (difference < 0 && this.currentSlide > 0) {
-            this.currentSlide--;
-            this.isLastItemReached = false;
+    ngOnInit() {
+        if (this.baseStatesDirective) {
+            this.setVariants();
         }
-        this.isLastItemReached = this.currentSlide === this.slidesArray.length - 1;
-        this.renderer.setStyle(this.slides.nativeElement, 'transform', `translateX(-${this.currentSlide * 100 / this.slidesArray.length}%)`);
-        this.cdr.detectChanges();
-    }
-    goToSlide(index) {
-        this.currentSlide = index;
-        this.renderer.setStyle(this.slides.nativeElement, 'transform', `translateX(-${this.currentSlide * 100 / this.slidesArray.length}%)`);
-        this.isPreviousButtonVisible();
-        this.isNextButtonVisible();
     }
-    goToPreviousSlide() {
-        if (this.currentSlide > 0) {
-            this.currentSlide--;
-            this.renderer.setStyle(this.slides.nativeElement, 'transform', `translateX(-${this.currentSlide * 100 / this.slidesArray.length}%)`);
+    setVariants() {
+        if (this.baseStatesDirective.color) {
+            this._variant = this.baseStatesDirective.color;
         }
-        this.isPreviousButtonVisible();
-        this.isNextButtonVisible();
     }
-    goToNextSlide() {
-        if (this.currentSlide < this.slidesArray.length - 1) {
-            this.currentSlide++;
-            this.renderer.setStyle(this.slides.nativeElement, 'transform', `translateX(-${this.currentSlide * 100 / this.slidesArray.length}%)`);
+    get icon() {
+        switch (this._variant) {
+            case 'warning':
+                return 'alert-circle-sharp';
+            case 'danger':
+                return 'close-circle-sharp';
+            case 'success':
+                return 'checkmark-circle-sharp';
+            case 'info':
+                return 'information-circle-sharp';
+            case 'primary':
+                return 'search-sharp';
+            case 'dark':
+                return 'search-sharp';
+            case 'light':
+                return 'search-sharp';
+            case 'clear':
+                return 'search-sharp';
+            default:
+                return '';
         }
-        this.isPreviousButtonVisible();
-        this.isNextButtonVisible();
     }
-    onAction(event) {
-        if (this.isNextBtn) {
-            this.goToNextSlide();
-            return;
-        }
-        this.actionClicked.emit(event);
+    get cssClasses() {
+        return this.getCssClasses();
     }
-    onLastStepAction(event) {
-        this.lastStepActionClicked.emit(event);
+    getCssClasses() {
+        return [
+            this.baseStatesDirective.getCssClasses('euim-alert-message'),
+            this._variant ? `euim-alert-message--${this._variant}` : '',
+            !this.isVisible ? 'euim-alert-message--hidden' : '',
+        ].join(' ');
     }
-    onLeftBtnAction(event) {
-        if (this.isPreviousBtn) {
-            this.goToPreviousSlide();
-            return;
+    onClose(event) {
+        if (event) {
+            event.preventDefault();
         }
-        this.leftBtnActionClicked.emit(event);
+        this.isVisible = false;
+        this.euimClose.emit();
     }
-    /** @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 }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimSliderComponent, selector: "euim-slider", inputs: { actionBtnNames: "actionBtnNames", isLeftBtnVisible: ["isLeftBtnVisible", "isLeftBtnVisible", booleanAttribute], isPreviousBtn: ["isPreviousBtn", "isPreviousBtn", booleanAttribute], isNextBtn: ["isNextBtn", "isNextBtn", booleanAttribute] }, 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"] }] }); }
+    /** @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 }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimAlertMessageComponent, selector: "euim-alert-message", inputs: { euimLabelTruncate: ["euimLabelTruncate", "euimLabelTruncate", booleanAttribute], hasIcon: ["hasIcon", "hasIcon", booleanAttribute], isCloseable: ["isCloseable", "isCloseable", booleanAttribute] }, outputs: { euimClose: "euimClose" }, host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["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: i2.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 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSliderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAlertMessageComponent, decorators: [{
             type: Component,
-            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"] }]
-        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i1.GestureController }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { slides: [{
-                type: ViewChild,
-                args: ['slides', { static: true }]
-            }], actionClicked: [{
-                type: Output
-            }], lastStepActionClicked: [{
-                type: Output
-            }], leftBtnActionClicked: [{
+            args: [{ selector: 'euim-alert-message', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, hostDirectives: [
+                        {
+                            directive: BaseStatesDirective,
+                            inputs: [
+                                'color',
+                            ],
+                        },
+                    ], 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"] }]
+        }], ctorParameters: () => [{ type: BaseStatesDirective }], propDecorators: { euimClose: [{
                 type: Output
-            }], actionBtnNames: [{
-                type: Input
-            }], isLeftBtnVisible: [{
+            }], euimLabelTruncate: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
-            }], isPreviousBtn: [{
+            }], hasIcon: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
-            }], isNextBtn: [{
+            }], isCloseable: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
-            }], className: [{
-                type: HostBinding,
-                args: ['class']
-            }], onResize: [{
-                type: HostListener,
-                args: ['window:resize', ['$event']]
-            }] } });
-
-class EuimSlideComponent {
-    constructor() {
-        this.className = 'euim-slider__slide';
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSlideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimSlideComponent, selector: "euim-slide", host: { properties: { "class": "this.className" } }, ngImport: i0, template: `
-        <div #slide>
-            <ng-content></ng-content>
-        </div>`, isInline: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSlideComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'euim-slide',
-                    template: `
-        <div #slide>
-            <ng-content></ng-content>
-        </div>`,
-                }]
-        }], propDecorators: { className: [{
+            }], cssClasses: [{
                 type: HostBinding,
                 args: ['class']
             }] } });
 
 const COMPONENTS$5 = [
-    EuimSliderComponent,
-    EuimSlideComponent,
+    EuimAlertMessageComponent,
 ];
-class EuimSliderModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimSliderModule, declarations: [EuimSliderComponent,
-            EuimSlideComponent], imports: [CommonModule,
-            IonicModule], exports: [EuimSliderComponent,
-            EuimSlideComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSliderModule, imports: [CommonModule,
-            IonicModule] }); }
+class EuimAlertMessageModule {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAlertMessageModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimAlertMessageModule, declarations: [EuimAlertMessageComponent], imports: [CommonModule,
+            IonicModule,
+            EuimLabelModule], exports: [EuimAlertMessageComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAlertMessageModule, imports: [CommonModule,
+            IonicModule,
+            EuimLabelModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSliderModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAlertMessageModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
                         CommonModule,
                         IonicModule,
+                        EuimLabelModule,
                     ],
                     exports: [
                         ...COMPONENTS$5,
@@ -3085,13 +1983,13 @@ class EuimSliderInfoScreenComponent {
         }
         this.leftActionClicked.emit(event);
     }
-    /** @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 }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimSliderInfoScreenComponent, selector: "euim-slider-info-screen", inputs: { isCarousel: ["isCarousel", "isCarousel", booleanAttribute], showLeftBtn: ["showLeftBtn", "showLeftBtn", booleanAttribute], showRightBtn: ["showRightBtn", "showRightBtn", booleanAttribute], isPreviousBtn: ["isPreviousBtn", "isPreviousBtn", booleanAttribute], isNextBtn: ["isNextBtn", "isNextBtn", booleanAttribute], 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 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSliderInfoScreenComponent, deps: [{ token: i0.Renderer2 }, { token: i2.GestureController }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimSliderInfoScreenComponent, selector: "euim-slider-info-screen", inputs: { isCarousel: ["isCarousel", "isCarousel", booleanAttribute], showLeftBtn: ["showLeftBtn", "showLeftBtn", booleanAttribute], showRightBtn: ["showRightBtn", "showRightBtn", booleanAttribute], isPreviousBtn: ["isPreviousBtn", "isPreviousBtn", booleanAttribute], isNextBtn: ["isNextBtn", "isNextBtn", booleanAttribute], 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$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2.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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSliderInfoScreenComponent, decorators: [{
             type: Component,
             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"] }]
-        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i1.GestureController }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { slides: [{
+        }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i2.GestureController }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { slides: [{
                 type: ViewChild,
                 args: ['slides', { static: true }]
             }], rightActionClicked: [{
@@ -3305,11 +2203,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
 class EuimChipSelectorComponent {
     constructor() {
         this.backgroundColor = 'primary';
-        /**
-         * @deprecated Will be removed in v17.
-         * Please use {@link color} property instead
-         */
-        this.chipColor = 'white';
         this.color = 'white';
         this.chipSelectedColor = 'white';
         this.chipFill = 'default';
@@ -3380,19 +2273,9 @@ class EuimChipSelectorComponent {
         });
     }
     getCssItemClasses() {
-        let currentColor = 'white';
-        // if color property is different from default one (white) than use chip color
-        // means using the deprecated chipColor property,
-        // needed as in V18 will be removed chipColor
-        if (this.chipColor === 'white' && this.color != 'white') {
-            currentColor = this.color;
-        }
-        else {
-            currentColor = this.chipColor;
-        }
         return [
             this.chipFill ? `euim-chip-selector__item--fill-${this.chipFill}` : '',
-            currentColor ? `euim-chip-selector__item--color-${currentColor}` : '',
+            this.color ? `euim-chip-selector__item--color-${this.color}` : '',
         ].join(' ');
     }
     updateChipsAndFilters() {
@@ -3553,15 +2436,13 @@ class EuimChipSelectorComponent {
         return data.filter(item => multipleFilterConditions.includes(item.filterId));
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimChipSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @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", "isMultiSelectionMode", booleanAttribute], euimKeepSelection: ["euimKeepSelection", "euimKeepSelection", booleanAttribute], hasSearchbar: ["hasSearchbar", "hasSearchbar", booleanAttribute] }, 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 }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimChipSelectorComponent, selector: "euim-chip-selector", inputs: { backgroundColor: "backgroundColor", color: "color", chipSelectedColor: "chipSelectedColor", chipFill: "chipFill", sourceData: "sourceData", selectedChips: "selectedChips", isMultiSelectionMode: ["isMultiSelectionMode", "isMultiSelectionMode", booleanAttribute], euimKeepSelection: ["euimKeepSelection", "euimKeepSelection", booleanAttribute], hasSearchbar: ["hasSearchbar", "hasSearchbar", booleanAttribute] }, 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: i2.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: i2.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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimChipSelectorComponent, decorators: [{
             type: Component,
             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"] }]
         }], propDecorators: { backgroundColor: [{
                 type: Input
-            }], chipColor: [{
-                type: Input
             }], color: [{
                 type: Input
             }], chipSelectedColor: [{
@@ -3647,7 +2528,7 @@ class EuimSkeletonListItemComponent {
             .trim();
     }
     /** @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 }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimSkeletonListItemComponent, selector: "euim-skeleton-list-item", inputs: { hasAvatar: ["hasAvatar", "hasAvatar", booleanAttribute], hasTitle: ["hasTitle", "hasTitle", booleanAttribute], hasSubtitle: ["hasSubtitle", "hasSubtitle", booleanAttribute], hasMetaLine: ["hasMetaLine", "hasMetaLine", booleanAttribute], isAnimated: ["isAnimated", "isAnimated", booleanAttribute], 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 }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimSkeletonListItemComponent, selector: "euim-skeleton-list-item", inputs: { hasAvatar: ["hasAvatar", "hasAvatar", booleanAttribute], hasTitle: ["hasTitle", "hasTitle", booleanAttribute], hasSubtitle: ["hasSubtitle", "hasSubtitle", booleanAttribute], hasMetaLine: ["hasMetaLine", "hasMetaLine", booleanAttribute], isAnimated: ["isAnimated", "isAnimated", booleanAttribute], 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: i2.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: i2.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2.IonSkeletonText, selector: "ion-skeleton-text", inputs: ["animated"] }, { kind: "component", type: i2.IonThumbnail, selector: "ion-thumbnail" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonListItemComponent, decorators: [{
             type: Component,
@@ -3741,7 +2622,7 @@ class EuimSkeletonListComponent {
         return Array.from({ length: this.items });
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @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 }); }
+    /** @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$2.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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonListComponent, decorators: [{
             type: Component,
@@ -3841,7 +2722,7 @@ class EuimMultiselectComponent {
         }
     }
     /** @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 }); }
-    /** @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", "euimKeepSelection", booleanAttribute] }, 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 }); }
+    /** @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", "euimKeepSelection", booleanAttribute] }, 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: i2.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i2.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMultiselectComponent, decorators: [{
             type: Component,
@@ -3907,7 +2788,7 @@ class EuimMultiselectFilterComponent {
         }
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMultiselectFilterComponent, deps: [{ token: EuimMultiselectComponent }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimMultiselectFilterComponent, selector: "euim-multiselect-filter", inputs: { filterByFieldsNames: "filterByFieldsNames" }, host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<ion-searchbar (ionChange)=\"handleChange($event)\"\n               class=\"euim-multiselect-filter__searchbar\"></ion-searchbar>\n", styles: [".euim-multiselect-filter__searchbar input::placeholder{opacity:1!important;color:var(--eui-base-color-grey-75)!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" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimMultiselectFilterComponent, selector: "euim-multiselect-filter", inputs: { filterByFieldsNames: "filterByFieldsNames" }, host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<ion-searchbar (ionChange)=\"handleChange($event)\"\n               class=\"euim-multiselect-filter__searchbar\"></ion-searchbar>\n", styles: [".euim-multiselect-filter__searchbar input::placeholder{opacity:1!important;color:var(--eui-base-color-grey-75)!important}\n"], dependencies: [{ kind: "component", type: i2.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: i2.TextValueAccessor, selector: "ion-input:not([type=number]),ion-textarea,ion-searchbar" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMultiselectFilterComponent, decorators: [{
             type: Component,
@@ -3968,7 +2849,7 @@ class EuimMultiselectListComponent {
         this.className = 'euim-multiselect-list';
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMultiselectListComponent, deps: [{ token: EuimMultiselectComponent }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimMultiselectListComponent, selector: "euim-multiselect-list", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<ion-list>\n    <ng-content></ng-content>\n</ion-list>\n", styles: [""], dependencies: [{ kind: "component", type: i1.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimMultiselectListComponent, selector: "euim-multiselect-list", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<ion-list>\n    <ng-content></ng-content>\n</ion-list>\n", styles: [""], dependencies: [{ kind: "component", type: i2.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMultiselectListComponent, decorators: [{
             type: Component,
@@ -4037,7 +2918,7 @@ class EuimMultiselectInfoComponent {
         this.ref.detectChanges();
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMultiselectInfoComponent, deps: [{ token: EuimMultiselectComponent }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimMultiselectInfoComponent, selector: "euim-multiselect-info", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "{{ \"euim.multiselect-info\" | translate:\n    { number: multiselect.countSelectedItems(),\n    arr: multiselect.currentDataProvider?.length } }}\n\n", styles: [".euim-multiselect-info{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);color:var(--eui-base-color-grey-75)}\n"], dependencies: [{ kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimMultiselectInfoComponent, selector: "euim-multiselect-info", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "{{ \"euim.multiselect-info\" | translate:\n    { number: multiselect.countSelectedItems(),\n    arr: multiselect.currentDataProvider?.length } }}\n\n", styles: [".euim-multiselect-info{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);color:var(--eui-base-color-grey-75)}\n"], dependencies: [{ kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMultiselectInfoComponent, decorators: [{
             type: Component,
@@ -4063,7 +2944,7 @@ class EuimMultiselectToolbarComponent {
         this.cancel.emit(true);
     }
     /** @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 }); }
-    /** @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", "euimCustomRender", booleanAttribute] }, 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 }); }
+    /** @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", "euimCustomRender", booleanAttribute] }, 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: i2.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: i2.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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMultiselectToolbarComponent, decorators: [{
             type: Component,
@@ -4208,13 +3089,13 @@ class EuimPdfWrapperComponent {
             this.page--;
         }
     }
-    /** @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 }); }
-    /** @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 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimPdfWrapperComponent, deps: [{ token: i2.AlertController }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @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: i2.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: i2.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { kind: "component", type: i2.IonFooter, selector: "ion-footer", inputs: ["collapse", "mode", "translucent"] }, { kind: "component", type: i2.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i2.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: i2$3.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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimPdfWrapperComponent, decorators: [{
             type: Component,
             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" }]
-        }], ctorParameters: () => [{ type: i1.AlertController }], propDecorators: { url: [{
+        }], ctorParameters: () => [{ type: i2.AlertController }], propDecorators: { url: [{
                 type: Input
             }], page: [{
                 type: Input
@@ -4255,32 +3136,113 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 }]
         }] });
 
+class EuimDividerDirective {
+    get cssClasses() {
+        return this.getCssClasses('euim-divider');
+    }
+    getCssClasses(rootClass) {
+        return [
+            rootClass,
+            this.lines ? `${rootClass}--lines-${this.lines}` : '',
+        ].join(' ').trim();
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDividerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: EuimDividerDirective, selector: "[euimDivider]", inputs: { lines: "lines" }, host: { properties: { "class": "this.cssClasses" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDividerDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[euimDivider]',
+                }]
+        }], propDecorators: { lines: [{
+                type: Input
+            }], cssClasses: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
+
+class EuimDividerModule {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDividerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimDividerModule, declarations: [EuimDividerDirective], imports: [CommonModule,
+            IonicModule], exports: [EuimDividerDirective] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDividerModule, imports: [CommonModule,
+            IonicModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimDividerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        IonicModule,
+                    ],
+                    exports: [
+                        EuimDividerDirective,
+                    ],
+                    declarations: [
+                        EuimDividerDirective,
+                    ],
+                }]
+        }] });
+
+class EuimSkeletonTextAvatarDirective {
+    constructor() {
+        this.className = 'euim-skeleton-text-avatar';
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonTextAvatarDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.0", type: EuimSkeletonTextAvatarDirective, selector: "[euimSkeletonTextAvatar]", host: { properties: { "class": "this.className" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonTextAvatarDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[euimSkeletonTextAvatar]',
+                }]
+        }], propDecorators: { className: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
+
+class EuimSkeletonTextAvatarModule {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonTextAvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonTextAvatarModule, declarations: [EuimSkeletonTextAvatarDirective], imports: [CommonModule,
+            IonicModule], exports: [EuimSkeletonTextAvatarDirective] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonTextAvatarModule, imports: [CommonModule,
+            IonicModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimSkeletonTextAvatarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        IonicModule,
+                    ],
+                    exports: [
+                        EuimSkeletonTextAvatarDirective,
+                    ],
+                    declarations: [
+                        EuimSkeletonTextAvatarDirective,
+                    ],
+                }]
+        }] });
+
 const MODULES = [
     // Layout
     EuimAppModule,
-    EuimAppSidebarModule,
     // Components
     EuimEmptyListPlaceholderModule,
     EuimLanguageSelectorModule,
-    EuimStepperComponentModule,
     EuimUserProfileModule,
     EuimMessageModule,
     EuimSkeletonListItemModule,
     EuimSkeletonListModule,
     EuimAvatarIconModule,
     EuimLabelModule,
-    EuimMenuModule,
     EuimAlertMessageModule,
-    EuimControlFeedbackModule,
-    EuimFieldsetModule,
     EuimToolbarComponentModule,
     EuimNotificationItemModule,
     EuimMediaHeaderModule,
     EuimDataSummaryModule,
     EuimHeaderDetailsModule,
     EuimAvatarModule,
-    EuimInfoScreenModule,
-    EuimSliderModule,
     EuimSliderInfoScreenModule,
     EuimScrollerXComponentModule,
     EuimChipSelectorComponentModule,
@@ -4288,9 +3250,7 @@ const MODULES = [
     EuimSidebarModule,
     EuimMultiselectModule,
     // Directives
-    EuimListHeaderModule,
     EuimSpinnerComponentModule,
-    EuimItemDividerModule,
     EuimDividerModule,
     EuimSkeletonTextAvatarModule,
 ];
@@ -4299,29 +3259,22 @@ class EuimAllModule {
     /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimAllModule, imports: [
             // Layout
             EuimAppModule,
-            EuimAppSidebarModule,
             // Components
             EuimEmptyListPlaceholderModule,
             EuimLanguageSelectorModule,
-            EuimStepperComponentModule,
             EuimUserProfileModule,
             EuimMessageModule,
             EuimSkeletonListItemModule,
             EuimSkeletonListModule,
             EuimAvatarIconModule,
             EuimLabelModule,
-            EuimMenuModule,
             EuimAlertMessageModule,
-            EuimControlFeedbackModule,
-            EuimFieldsetModule,
             EuimToolbarComponentModule,
             EuimNotificationItemModule,
             EuimMediaHeaderModule,
             EuimDataSummaryModule,
             EuimHeaderDetailsModule,
             EuimAvatarModule,
-            EuimInfoScreenModule,
-            EuimSliderModule,
             EuimSliderInfoScreenModule,
             EuimScrollerXComponentModule,
             EuimChipSelectorComponentModule,
@@ -4329,36 +3282,27 @@ class EuimAllModule {
             EuimSidebarModule,
             EuimMultiselectModule,
             // Directives
-            EuimListHeaderModule,
             EuimSpinnerComponentModule,
-            EuimItemDividerModule,
             EuimDividerModule,
             EuimSkeletonTextAvatarModule], exports: [
             // Layout
             EuimAppModule,
-            EuimAppSidebarModule,
             // Components
             EuimEmptyListPlaceholderModule,
             EuimLanguageSelectorModule,
-            EuimStepperComponentModule,
             EuimUserProfileModule,
             EuimMessageModule,
             EuimSkeletonListItemModule,
             EuimSkeletonListModule,
             EuimAvatarIconModule,
             EuimLabelModule,
-            EuimMenuModule,
             EuimAlertMessageModule,
-            EuimControlFeedbackModule,
-            EuimFieldsetModule,
             EuimToolbarComponentModule,
             EuimNotificationItemModule,
             EuimMediaHeaderModule,
             EuimDataSummaryModule,
             EuimHeaderDetailsModule,
             EuimAvatarModule,
-            EuimInfoScreenModule,
-            EuimSliderModule,
             EuimSliderInfoScreenModule,
             EuimScrollerXComponentModule,
             EuimChipSelectorComponentModule,
@@ -4366,37 +3310,28 @@ class EuimAllModule {
             EuimSidebarModule,
             EuimMultiselectModule,
             // Directives
-            EuimListHeaderModule,
             EuimSpinnerComponentModule,
-            EuimItemDividerModule,
             EuimDividerModule,
             EuimSkeletonTextAvatarModule] }); }
     /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAllModule, imports: [MODULES, 
             // Layout
             EuimAppModule,
-            EuimAppSidebarModule,
             // Components
             EuimEmptyListPlaceholderModule,
             EuimLanguageSelectorModule,
-            EuimStepperComponentModule,
             EuimUserProfileModule,
             EuimMessageModule,
             EuimSkeletonListItemModule,
             EuimSkeletonListModule,
             EuimAvatarIconModule,
             EuimLabelModule,
-            EuimMenuModule,
             EuimAlertMessageModule,
-            EuimControlFeedbackModule,
-            EuimFieldsetModule,
             EuimToolbarComponentModule,
             EuimNotificationItemModule,
             EuimMediaHeaderModule,
             EuimDataSummaryModule,
             EuimHeaderDetailsModule,
             EuimAvatarModule,
-            EuimInfoScreenModule,
-            EuimSliderModule,
             EuimSliderInfoScreenModule,
             EuimScrollerXComponentModule,
             EuimChipSelectorComponentModule,
@@ -4404,9 +3339,7 @@ class EuimAllModule {
             EuimSidebarModule,
             EuimMultiselectModule,
             // Directives
-            EuimListHeaderModule,
             EuimSpinnerComponentModule,
-            EuimItemDividerModule,
             EuimDividerModule,
             EuimSkeletonTextAvatarModule] }); }
 }
@@ -4428,5 +3361,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { BaseStatesDirective, EuiMUserProfileActionComponent, EuiMUserProfileAvatarComponent, EuiMUserProfileInfosComponent, EuiMUserProfileInfosItemComponent, EuimAlertMessageComponent, EuimAlertMessageModule, EuimAllModule, EuimAppComponent, EuimAppModule, EuimAppService, EuimAppSidebarComponent, EuimAppSidebarFooterComponent, EuimAppSidebarHeaderComponent, EuimAppSidebarMenuComponent, EuimAppSidebarModule, EuimAvatarComponent, EuimAvatarIconComponent, EuimAvatarIconModule, EuimAvatarMainIconDirective, EuimAvatarModule, EuimAvatarSubIconDirective, EuimBadgeComponent, EuimBadgeModule, EuimChipSelectorComponent, EuimChipSelectorComponentModule, EuimChipSelectorItemDirective, EuimControlFeedbackComponent, EuimControlFeedbackModule, EuimDataSummaryColComponent, EuimDataSummaryColLabelDirective, EuimDataSummaryColValueDirective, EuimDataSummaryComponent, EuimDataSummaryModule, EuimDividerDirective, EuimDividerModule, EuimEmptyListPlaceholderComponent, EuimEmptyListPlaceholderModule, EuimFieldSetComponent, EuimFieldsetActionsComponent, EuimFieldsetLegendComponent, EuimFieldsetModule, EuimHeaderDetailsComponent, EuimHeaderDetailsIconDirective, EuimHeaderDetailsMetaDirective, EuimHeaderDetailsModule, EuimHeaderDetailsTitleDirective, EuimInfoScreenComponent, EuimInfoScreenContentDirective, EuimInfoScreenModule, EuimInfoScreenSubTitleDirective, EuimInfoScreenTitleDirective, EuimItemDividerDirective, EuimItemDividerModule, EuimLabelComponent, EuimLabelModule, EuimLanguageListComponent, EuimLanguageSelectorComponent, EuimLanguageSelectorModule, EuimListHeaderDirective, EuimListHeaderModule, EuimMediaHeaderComponent, EuimMediaHeaderImageDirective, EuimMediaHeaderModule, EuimMediaHeaderSubTitleDirective, EuimMediaHeaderTitleDirective, EuimMenuComponent, EuimMenuModule, EuimMessageComponent, EuimMessageModule, EuimMessageTitleComponent, EuimMultiselectAllDirective, EuimMultiselectComponent, EuimMultiselectFilterComponent, EuimMultiselectInfoComponent, EuimMultiselectListComponent, EuimMultiselectModule, EuimMultiselectSelectFieldDirective, EuimMultiselectToolbarComponent, EuimNotificationItemComponent, EuimNotificationItemModule, EuimPdfWrapperComponent, EuimPdfWrapperModule, EuimScrollerXComponent, EuimScrollerXComponentModule, EuimSidebarComponent, EuimSidebarContentComponent, EuimSidebarModule, EuimSkeletonListComponent, EuimSkeletonListItemComponent, EuimSkeletonListItemModule, EuimSkeletonListModule, EuimSkeletonTextAvatarDirective, EuimSkeletonTextAvatarModule, EuimSlideComponent, EuimSlideInfoScreenComponent, EuimSliderComponent, EuimSliderInfoScreenComponent, EuimSliderInfoScreenContentDirective, EuimSliderInfoScreenModule, EuimSliderInfoScreenSubTitleDirective, EuimSliderInfoScreenTitleDirective, EuimSliderModule, EuimSpinnerComponent, EuimSpinnerComponentModule, EuimSpinnerDescriptionComponent, EuimSpinnerMessageComponent, EuimStepperChangeEvent, EuimStepperComponent, EuimStepperComponentModule, EuimToolbarActionItemsComponent, EuimToolbarComponent, EuimToolbarComponentModule, EuimToolbarTitleComponent, EuimUserProfileComponent, EuimUserProfileModule };
+export { BaseStatesDirective, EuiMUserProfileActionComponent, EuiMUserProfileAvatarComponent, EuiMUserProfileInfosComponent, EuiMUserProfileInfosItemComponent, EuimAlertMessageComponent, EuimAlertMessageModule, EuimAllModule, EuimAppComponent, EuimAppModule, EuimAppService, EuimAvatarComponent, EuimAvatarIconComponent, EuimAvatarIconModule, EuimAvatarMainIconDirective, EuimAvatarModule, EuimAvatarSubIconDirective, EuimBadgeComponent, EuimBadgeModule, EuimChipSelectorComponent, EuimChipSelectorComponentModule, EuimChipSelectorItemDirective, EuimDataSummaryColComponent, EuimDataSummaryColLabelDirective, EuimDataSummaryColValueDirective, EuimDataSummaryComponent, EuimDataSummaryModule, EuimDividerDirective, EuimDividerModule, EuimEmptyListPlaceholderComponent, EuimEmptyListPlaceholderModule, EuimHeaderDetailsComponent, EuimHeaderDetailsIconDirective, EuimHeaderDetailsMetaDirective, EuimHeaderDetailsModule, EuimHeaderDetailsTitleDirective, EuimLabelComponent, EuimLabelModule, EuimLanguageListComponent, EuimLanguageSelectorComponent, EuimLanguageSelectorModule, EuimMediaHeaderComponent, EuimMediaHeaderImageDirective, EuimMediaHeaderModule, EuimMediaHeaderSubTitleDirective, EuimMediaHeaderTitleDirective, EuimMessageComponent, EuimMessageModule, EuimMessageTitleComponent, EuimMultiselectAllDirective, EuimMultiselectComponent, EuimMultiselectFilterComponent, EuimMultiselectInfoComponent, EuimMultiselectListComponent, EuimMultiselectModule, EuimMultiselectSelectFieldDirective, EuimMultiselectToolbarComponent, EuimNotificationItemComponent, EuimNotificationItemModule, EuimPdfWrapperComponent, EuimPdfWrapperModule, EuimScrollerXComponent, EuimScrollerXComponentModule, EuimSidebarComponent, EuimSidebarContentComponent, EuimSidebarModule, EuimSkeletonListComponent, EuimSkeletonListItemComponent, EuimSkeletonListItemModule, EuimSkeletonListModule, EuimSkeletonTextAvatarDirective, EuimSkeletonTextAvatarModule, EuimSlideInfoScreenComponent, EuimSliderInfoScreenComponent, EuimSliderInfoScreenContentDirective, EuimSliderInfoScreenModule, EuimSliderInfoScreenSubTitleDirective, EuimSliderInfoScreenTitleDirective, EuimSpinnerComponent, EuimSpinnerComponentModule, EuimSpinnerDescriptionComponent, EuimSpinnerMessageComponent, EuimToolbarActionItemsComponent, EuimToolbarComponent, EuimToolbarComponentModule, EuimToolbarTitleComponent, EuimUserProfileComponent, EuimUserProfileModule };
 //# sourceMappingURL=eui-mobile-core.mjs.map