@eui/mobile-core 17.0.0-next.8 → 17.0.1-snapshot-1713964827540

package/fesm2022/eui-mobile-core.mjs

@@ -1,3 +1,4 @@
+import { coerceBoolean } from '@eui/base';
 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';
@@ -6,18 +7,21 @@ import * as i2$1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i1 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 { EuiEuLanguages } from '@eui/core';
 import { takeUntil, distinctUntilKeyChanged } from 'rxjs/operators';
 import * as i1$1 from '@ngx-translate/core';
 import { TranslateModule } from '@ngx-translate/core';
+import * as i1$2 from '@angular/router';
+import { NavigationEnd, RouterModule } from '@angular/router';
 import * as i2$2 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';
+import { __decorate } from 'tslib';
+import * as i2$3 from 'angularx-qrcode';
+import { QRCodeModule } from 'angularx-qrcode';
 
 const initialState = {
     isLanguageListVisible: false,
@@ -53,67 +57,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 +79,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 +107,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 +130,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 +143,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 +222,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-140)}.euim-label--warning ion-icon{color:var(--eui-base-color-warning-140)}.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 +230,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',
@@ -413,7 +242,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                                 'color',
                             ],
                         },
-                    ], 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"] }]
+                    ], 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-140)}.euim-label--warning ion-icon{color:var(--eui-base-color-warning-140)}.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"] }]
         }], ctorParameters: () => [{ type: BaseStatesDirective }], propDecorators: { euimLabelTruncateWithLines: [{
                 type: HostBinding,
                 args: ['style.--euimLabelTruncateWithLines']
@@ -459,64 +288,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 +301,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 +309,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimInfo',
-                                'euimSuccess',
-                                'euimWarning',
-                                'euimDanger',
-                                'euimPrimary',
-                                'euimSecondary',
-                                'euimAccent',
                                 'color',
                             ],
                         },
@@ -634,197 +398,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();
@@ -957,7 +530,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() {
@@ -997,7 +570,7 @@ 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.ɵ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: 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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLanguageSelectorComponent, decorators: [{
             type: Component,
@@ -1005,7 +578,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimPrimary',
                                 'color',
                             ],
                         },
@@ -1015,34 +587,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 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: [{
-                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 +602,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 +663,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         IonicModule,
                         EuimAvatarIconModule,
                         EuimLabelModule,
-                        EuimItemDividerModule,
                         EuimEmptyListPlaceholderModule,
                         TranslateModule,
                     ],
@@ -1266,11 +684,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 +695,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                     imports: [
                         CommonModule,
                         IonicModule,
-                        EuimAppSidebarModule,
                         EuimLanguageSelectorModule,
                     ],
                     exports: [
@@ -1362,7 +777,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 type: HostBinding
             }] } });
 
-const COMPONENTS$e = [
+const COMPONENTS$c = [
     EuimUserProfileComponent,
     EuiMUserProfileAvatarComponent,
     EuiMUserProfileInfosComponent,
@@ -1392,10 +807,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         IonicModule,
                     ],
                     exports: [
-                        ...COMPONENTS$e,
+                        ...COMPONENTS$c,
                     ],
                     declarations: [
-                        ...COMPONENTS$e,
+                        ...COMPONENTS$c,
                     ],
                 }]
         }] });
@@ -1626,7 +1041,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 +1049,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimPrimary',
                                 'color',
                             ],
                         },
@@ -1695,7 +1109,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 args: ['class']
             }] } });
 
-const COMPONENTS$d = [
+const COMPONENTS$b = [
     EuimHeaderDetailsComponent,
     EuimHeaderDetailsTitleDirective,
     EuimHeaderDetailsMetaDirective,
@@ -1722,114 +1136,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$b,
                     ],
                     declarations: [
-                        ...COMPONENTS$c,
+                        ...COMPONENTS$b,
                     ],
                 }]
         }] });
@@ -1847,7 +1157,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;top:calc(-1 * var(--eui-base-spacing-s));left: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));left:var(--eui-base-spacing-s)}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));left:var(--eui-base-spacing-s)}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));left:var(--eui-base-spacing-s)}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 +1165,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimDanger',
-                                'euimWarning',
-                                'euimInfo',
-                                'euimSuccess',
-                                'euimDefault',
                                 'euimPositionTopEnd',
                                 'euimSizeM',
                                 'euimSizeS',
@@ -1867,7 +1172,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                                 'color',
                             ],
                         },
-                    ], 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"] }]
+                    ], 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;top:calc(-1 * var(--eui-base-spacing-s));left: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));left:var(--eui-base-spacing-s)}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));left:var(--eui-base-spacing-s)}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));left:var(--eui-base-spacing-s)}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"] }]
         }], ctorParameters: () => [{ type: BaseStatesDirective }], propDecorators: { cssClasses: [{
                 type: HostBinding,
                 args: ['class']
@@ -1898,16 +1203,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 +1225,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: 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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMessageComponent, decorators: [{
             type: Component,
@@ -1935,13 +1240,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 +1263,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 type: HostBinding
             }] } });
 
-const COMPONENTS$b = [
+const COMPONENTS$a = [
     EuimMessageComponent,
     EuimMessageTitleComponent,
 ];
@@ -1978,163 +1277,6 @@ class EuimMessageModule {
             IonicModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimMessageModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        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: [
@@ -2256,7 +1398,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 +1411,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 }]
@@ -2377,7 +1519,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 +1529,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimPrimary',
+                                'color',
                             ],
                         },
                     ],
@@ -2437,18 +1579,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 +1598,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         {
                             directive: BaseStatesDirective,
                             inputs: [
-                                'euimPrimary',
                                 'color',
                             ],
                         },
@@ -2622,29 +1763,8 @@ class EuimAlertMessageComponent {
         }
     }
     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';
+        if (this.baseStatesDirective.color) {
+            this._variant = this.baseStatesDirective.color;
         }
     }
     get icon() {
@@ -2680,284 +1800,66 @@ class EuimAlertMessageComponent {
         ].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;
-    }
-    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;
-        }
-        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}%)`);
-        }
-        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}%)`);
-        }
-        this.isPreviousButtonVisible();
-        this.isNextButtonVisible();
-    }
-    onAction(event) {
-        if (this.isNextBtn) {
-            this.goToNextSlide();
-            return;
-        }
-        this.actionClicked.emit(event);
-    }
-    onLastStepAction(event) {
-        this.lastStepActionClicked.emit(event);
-    }
-    onLeftBtnAction(event) {
-        if (this.isPreviousBtn) {
-            this.goToPreviousSlide();
-            return;
+        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: 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: 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,
+const COMPONENTS$6 = [
+    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,
+                        ...COMPONENTS$6,
                     ],
                     declarations: [
-                        ...COMPONENTS$5,
+                        ...COMPONENTS$6,
                     ],
                 }]
         }] });
@@ -3200,7 +2102,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 args: ['class']
             }] } });
 
-const COMPONENTS$4 = [
+const COMPONENTS$5 = [
     EuimSliderInfoScreenComponent,
     EuimSlideInfoScreenComponent,
     EuimSliderInfoScreenContentDirective,
@@ -3230,10 +2132,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         IonicModule,
                     ],
                     exports: [
-                        ...COMPONENTS$4,
+                        ...COMPONENTS$5,
                     ],
                     declarations: [
-                        ...COMPONENTS$4,
+                        ...COMPONENTS$5,
                     ],
                 }]
         }] });
@@ -3305,11 +2207,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 +2277,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 +2440,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: 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 }); }
 }
 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: [{
@@ -3690,7 +2575,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 type: Input
             }] } });
 
-const COMPONENTS$3 = [
+const COMPONENTS$4 = [
     EuimSkeletonListItemComponent,
 ];
 class EuimSkeletonListItemModule {
@@ -3708,10 +2593,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         IonicModule,
                     ],
                     exports: [
-                        ...COMPONENTS$3,
+                        ...COMPONENTS$4,
                     ],
                     declarations: [
-                        ...COMPONENTS$3,
+                        ...COMPONENTS$4,
                     ],
                 }]
         }] });
@@ -3753,7 +2638,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 args: [EuimSkeletonListItemComponent]
             }] } });
 
-const COMPONENTS$2 = [
+const COMPONENTS$3 = [
     EuimSkeletonListComponent,
 ];
 class EuimSkeletonListModule {
@@ -3774,10 +2659,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         EuimSkeletonListItemModule,
                     ],
                     exports: [
-                        ...COMPONENTS$2,
+                        ...COMPONENTS$3,
                     ],
                     declarations: [
-                        ...COMPONENTS$2,
+                        ...COMPONENTS$3,
                     ],
                 }]
         }] });
@@ -4082,7 +2967,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 type: Output
             }] } });
 
-const COMPONENTS$1 = [
+const COMPONENTS$2 = [
     EuimMultiselectComponent,
     EuimMultiselectFilterComponent,
     EuimMultiselectListComponent,
@@ -4133,10 +3018,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         TranslateModule,
                     ],
                     exports: [
-                        ...COMPONENTS$1,
+                        ...COMPONENTS$2,
                     ],
                     declarations: [
-                        ...COMPONENTS$1,
+                        ...COMPONENTS$2,
                     ],
                 }]
         }] });
@@ -4220,7 +3105,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                 type: Input
             }] } });
 
-const COMPONENTS = [
+const COMPONENTS$1 = [
     EuimPdfWrapperComponent,
 ];
 class EuimPdfWrapperModule {
@@ -4246,6 +3131,168 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImpor
                         PinchZoomModule,
                         EuimSpinnerComponentModule,
                     ],
+                    exports: [
+                        ...COMPONENTS$1,
+                    ],
+                    declarations: [
+                        ...COMPONENTS$1,
+                    ],
+                }]
+        }] });
+
+class EuimChangelogComponent {
+    constructor() {
+        this.changeLogs = [];
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimChangelogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimChangelogComponent, selector: "euim-changelog", inputs: { changeLogs: "changeLogs" }, ngImport: i0, template: "<div class=\"euim-changelog\">\n\n    <ion-header>\n        <ion-toolbar color=\"primary\">\n            <euim-toolbar>\n                <euim-toolbar-title>Change Log</euim-toolbar-title>\n            </euim-toolbar>\n        </ion-toolbar>\n    </ion-header>\n\n    <ion-content [fullscreen]=\"true\" scroll-y=\"false\">\n        <ion-list>\n            <ion-accordion-group [multiple]=\"true\" value=\"about\">\n                @for (logItem of changeLogs; track $index) {\n                        <ion-accordion [value]=\"$index === 0 ? 'about' : null\">\n                        <ion-item slot=\"header\" lines=\"full\" class=\"euim-changelog__expanded-border\">\n                        <ion-icon name=\"build-outline\"></ion-icon>\n                        <div class=\"euim-changelog__euimVersionTitle\" euimLabel euimLabelTitle><strong>{{logItem.version}}</strong></div>\n                    </ion-item>\n                    <ion-list slot=\"content\">\n                        <ion-item-divider>\n                            <ion-label class=\"euim-changelog__itemDivider\">New features</ion-label>\n                        </ion-item-divider>\n                        @for (feature of logItem.features; track feature) {\n                        <ion-item lines=\"none\" class=\"no-min-height\">\n                            <div class=\"euim-changelog__label\" euimLabel>\n                                <span class=\"euim-changelog__bullet-point\"></span>\n                                <div class=\"euim-changelog__content\">{{ feature }}</div>\n                            </div>\n                        </ion-item>\n                        }\n                        <ion-item-divider>\n                            <ion-label>Improvements</ion-label>\n                        </ion-item-divider>\n                        @for (improvement of logItem.improvements; track improvement) {\n                        <ion-item lines=\"none\" class=\"no-min-height\">\n                            <div class=\"euim-changelog__label\" euimLabel>\n                                <span class=\"euim-changelog__bullet-point\"></span>\n                                <div class=\"euim-changelog__content\">{{ improvement }}</div>\n                            </div>\n                        </ion-item>\n\n                        }\n                        <ion-item-divider>\n                            <ion-label>Bugfixes</ion-label>\n                        </ion-item-divider>\n                        @for (bugfix of logItem.bugfixes; track bugfix) {\n                        <ion-item lines=\"none\" class=\"no-min-height\">\n                            <div class=\"euim-changelog__label\" euimLabel>\n                                <span class=\"euim-changelog__bullet-point\"></span>\n                                <div class=\"euim-changelog__content\">{{ bugfix }}</div>\n                            </div>\n                        </ion-item>\n                        }\n                    </ion-list>\n                </ion-accordion>\n                }\n            </ion-accordion-group>\n        </ion-list>\n    </ion-content>\n</div>", styles: [".euim-changelog__euimVersionTitle{font:normal normal 400 .875rem/1rem var(--eui-base-font-family);justify-content:space-between;margin-left:var(--eui-base-spacing-m);color:var(--eui-base-color-grey-100)}.euim-changelog__bullet-point{display:inline-block;background-color:var(--eui-base-color-grey-100);width:var(--eui-base-spacing-2xs);height:var(--eui-base-spacing-2xs);border-radius:50%;margin-right:var(--eui-base-spacing-s)}.euim-changelog__label{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);white-space:wrap;color:var(--eui-base-color-grey-120);display:flex;align-items:center}.euim-changelog__itemDivider{color:var(--eui-base-color-grey-75)}.euim-changelog__content{flex:1}.euim-changelog ion-list[slot=content] .no-min-height{--min-height: 0px !important}\n"], dependencies: [{ kind: "component", type: i1.IonAccordion, selector: "ion-accordion", inputs: ["disabled", "mode", "readonly", "toggleIcon", "toggleIconSlot", "value"] }, { kind: "component", type: i1.IonAccordionGroup, selector: "ion-accordion-group", inputs: ["animated", "disabled", "expand", "mode", "multiple", "readonly", "value"] }, { 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.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { 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: EuimLabelComponent, selector: "div[euimLabel], p[euimLabel], span[euimLabel], euim-label", inputs: ["euimLabelTruncateWithLines", "euimLabelTitle", "euimLabelSubTitle", "euimLabelMeta", "euimLabelTruncate"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimChangelogComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'euim-changelog', encapsulation: ViewEncapsulation.None, template: "<div class=\"euim-changelog\">\n\n    <ion-header>\n        <ion-toolbar color=\"primary\">\n            <euim-toolbar>\n                <euim-toolbar-title>Change Log</euim-toolbar-title>\n            </euim-toolbar>\n        </ion-toolbar>\n    </ion-header>\n\n    <ion-content [fullscreen]=\"true\" scroll-y=\"false\">\n        <ion-list>\n            <ion-accordion-group [multiple]=\"true\" value=\"about\">\n                @for (logItem of changeLogs; track $index) {\n                        <ion-accordion [value]=\"$index === 0 ? 'about' : null\">\n                        <ion-item slot=\"header\" lines=\"full\" class=\"euim-changelog__expanded-border\">\n                        <ion-icon name=\"build-outline\"></ion-icon>\n                        <div class=\"euim-changelog__euimVersionTitle\" euimLabel euimLabelTitle><strong>{{logItem.version}}</strong></div>\n                    </ion-item>\n                    <ion-list slot=\"content\">\n                        <ion-item-divider>\n                            <ion-label class=\"euim-changelog__itemDivider\">New features</ion-label>\n                        </ion-item-divider>\n                        @for (feature of logItem.features; track feature) {\n                        <ion-item lines=\"none\" class=\"no-min-height\">\n                            <div class=\"euim-changelog__label\" euimLabel>\n                                <span class=\"euim-changelog__bullet-point\"></span>\n                                <div class=\"euim-changelog__content\">{{ feature }}</div>\n                            </div>\n                        </ion-item>\n                        }\n                        <ion-item-divider>\n                            <ion-label>Improvements</ion-label>\n                        </ion-item-divider>\n                        @for (improvement of logItem.improvements; track improvement) {\n                        <ion-item lines=\"none\" class=\"no-min-height\">\n                            <div class=\"euim-changelog__label\" euimLabel>\n                                <span class=\"euim-changelog__bullet-point\"></span>\n                                <div class=\"euim-changelog__content\">{{ improvement }}</div>\n                            </div>\n                        </ion-item>\n\n                        }\n                        <ion-item-divider>\n                            <ion-label>Bugfixes</ion-label>\n                        </ion-item-divider>\n                        @for (bugfix of logItem.bugfixes; track bugfix) {\n                        <ion-item lines=\"none\" class=\"no-min-height\">\n                            <div class=\"euim-changelog__label\" euimLabel>\n                                <span class=\"euim-changelog__bullet-point\"></span>\n                                <div class=\"euim-changelog__content\">{{ bugfix }}</div>\n                            </div>\n                        </ion-item>\n                        }\n                    </ion-list>\n                </ion-accordion>\n                }\n            </ion-accordion-group>\n        </ion-list>\n    </ion-content>\n</div>", styles: [".euim-changelog__euimVersionTitle{font:normal normal 400 .875rem/1rem var(--eui-base-font-family);justify-content:space-between;margin-left:var(--eui-base-spacing-m);color:var(--eui-base-color-grey-100)}.euim-changelog__bullet-point{display:inline-block;background-color:var(--eui-base-color-grey-100);width:var(--eui-base-spacing-2xs);height:var(--eui-base-spacing-2xs);border-radius:50%;margin-right:var(--eui-base-spacing-s)}.euim-changelog__label{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);white-space:wrap;color:var(--eui-base-color-grey-120);display:flex;align-items:center}.euim-changelog__itemDivider{color:var(--eui-base-color-grey-75)}.euim-changelog__content{flex:1}.euim-changelog ion-list[slot=content] .no-min-height{--min-height: 0px !important}\n"] }]
+        }], propDecorators: { changeLogs: [{
+                type: Input
+            }] } });
+
+class EuimPrivacyStatementComponent {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimPrivacyStatementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimPrivacyStatementComponent, selector: "euim-privacy-statement", ngImport: i0, template: "<ng-content></ng-content>", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimPrivacyStatementComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'euim-privacy-statement', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>" }]
+        }] });
+
+class EuimContactSupportComponent {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimContactSupportComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimContactSupportComponent, selector: "euim-contact-support", ngImport: i0, template: "<ng-content></ng-content>", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimContactSupportComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'euim-contact-support', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>" }]
+        }] });
+
+class EuimLegalNoticeComponent {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLegalNoticeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimLegalNoticeComponent, selector: "euim-legal-notice", ngImport: i0, template: "<ng-content></ng-content>", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimLegalNoticeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'euim-legal-notice', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>" }]
+        }] });
+
+class EuimOpenSourceLicencesComponent {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimOpenSourceLicencesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.0", type: EuimOpenSourceLicencesComponent, selector: "euim-opensource-licences", ngImport: i0, template: "<ng-content></ng-content>", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimOpenSourceLicencesComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'euim-opensource-licences', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>" }]
+        }] });
+
+class EuimAboutComponent {
+    constructor() {
+        this.showCode = false;
+        this.logoUrl = '';
+        this.changelogExists = false;
+        this.privacyStatementExists = false;
+        this.contactSupportExists = false;
+        this.legalNoticeExists = false;
+        this.openSourceLicencesExists = false;
+    }
+    toggleQRCode() {
+        this.showCode = !this.showCode;
+    }
+    ngAfterContentInit() {
+        this.changelogExists = !!this.changelog;
+        this.privacyStatementExists = !!this.privacyStatement;
+        this.contactSupportExists = !!this.contactSupport;
+        this.legalNoticeExists = !!this.legalNotice;
+        this.openSourceLicencesExists = !!this.openSourceLicences;
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAboutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.0", type: EuimAboutComponent, selector: "euim-about", inputs: { showCode: "showCode", version: "version", releaseDate: "releaseDate", qrCodeUrl: "qrCodeUrl", logoUrl: "logoUrl" }, queries: [{ propertyName: "changelog", first: true, predicate: EuimChangelogComponent, descendants: true }, { propertyName: "privacyStatement", first: true, predicate: EuimPrivacyStatementComponent, descendants: true }, { propertyName: "contactSupport", first: true, predicate: EuimContactSupportComponent, descendants: true }, { propertyName: "legalNotice", first: true, predicate: EuimLegalNoticeComponent, descendants: true }, { propertyName: "openSourceLicences", first: true, predicate: EuimOpenSourceLicencesComponent, descendants: true }], ngImport: i0, template: "<div class=\"euim-about\">\r\n  <ion-header>\r\n    <ion-toolbar color=\"primary\">\r\n      <euim-toolbar>\r\n        <euim-toolbar-title><strong>About</strong></euim-toolbar-title>\r\n        <euim-toolbar-action-items>\r\n          <ion-label (click)=\"toggleQRCode()\" class=\"euim-about__toolbar-action-items\">\r\n            <strong>{{ showCode ? 'HIDE QR CODE' : 'SHOW QR CODE' }}</strong>\r\n          </ion-label>\r\n        </euim-toolbar-action-items>\r\n      </euim-toolbar>\r\n    </ion-toolbar>\r\n\r\n    <euim-header-details color=\"primary\">\r\n      <div euimHeaderDetailsIcon>\r\n        @if (showCode) {\r\n        <qrcode [qrdata]=\"qrCodeUrl\" [allowEmptyString]=\"true\" [cssClass]=\"'center'\"\r\n          [elementType]=\"'svg'\" [errorCorrectionLevel]=\"'M'\" [margin]=\"4\" [scale]=\"1\" [width]=\"160\"></qrcode> }\r\n          @if (!showCode) {\r\n            <img [src]=\"logoUrl\" alt=\"Image\" />  }\r\n      </div>\r\n      <div euimHeaderDetailsTitle><strong>eUI / mobile</strong></div>\r\n      <div euimHeaderDetailsMeta>version {{version}}</div>\r\n      <div euimHeaderDetailsMeta>Built on {{releaseDate}}</div>\r\n    </euim-header-details>\r\n  </ion-header>\r\n\r\n  <ion-list>\r\n    <ion-list-header class=\"euim-about__listHeader\">ABOUT THIS APP</ion-list-header>\r\n    @if (changelogExists) {\r\n    <ion-item class=\"euim-about__item\">\r\n      <ion-icon name=\"build-outline\" slot=\"start\"></ion-icon>\r\n      <div euimLabel class=\"euim-about__label\">Change Log</div>\r\n    </ion-item>\r\n  }\r\n  @if (privacyStatementExists) {\r\n    <ion-item class=\"euim-about__item\">\r\n      <ion-icon name=\"finger-print-sharp\" slot=\"start\"></ion-icon>\r\n      <div euimLabel class=\"euim-about__label\">Privacy Statement</div>\r\n    </ion-item>\r\n  }\r\n    @if (openSourceLicencesExists) {\r\n    <ion-item class=\"euim-about__item\">\r\n      <ion-icon name=\"ribbon-outline\" slot=\"start\"></ion-icon>\r\n      <div euimLabel class=\"euim-about__label\">Open source Licences</div>\r\n    </ion-item> }\r\n    @if (legalNoticeExists) {\r\n    <ion-item class=\"euim-about__item\">\r\n      <ion-icon name=\"library-outline\" slot=\"start\"></ion-icon>\r\n      <div euimLabel class=\"euim-about__label\">Legal Notice</div>\r\n    </ion-item> }\r\n    @if (contactSupportExists) {\r\n    <ion-item class=\"euim-about__item\">\r\n      <ion-icon name=\"mail-outline\" slot=\"start\"></ion-icon>\r\n      <div euimLabel class=\"euim-about__label\">Contact & Support</div>\r\n    </ion-item> }\r\n  </ion-list>\r\n</div>\r\n", styles: [".euim-about{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.euim-about euim-toolbar-title{font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family)}.euim-about euim-toolbar-action-items ion-label{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.euim-about ion-label{padding-inline-end:var(--eui-base-spacing-m);cursor:pointer}.euim-about__label{min-height:var(--eui-base-spacing-2xs);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-about__listHeader{color:var(--eui-base-color-grey-100)}\n"], dependencies: [{ 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.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1.IonList, selector: "ion-list", inputs: ["inset", "lines", "mode"] }, { kind: "component", type: i1.IonListHeader, selector: "ion-list-header", inputs: ["color", "lines", "mode"] }, { kind: "component", type: i1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "component", type: i2$3.QRCodeComponent, selector: "qrcode", inputs: ["allowEmptyString", "colorDark", "colorLight", "cssClass", "elementType", "errorCorrectionLevel", "margin", "qrdata", "scale", "version", "width"] }, { 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" }, { kind: "component", type: EuimHeaderDetailsComponent, selector: "euim-header-details" }, { kind: "directive", type: EuimHeaderDetailsTitleDirective, selector: "[euimHeaderDetailsTitle]" }, { kind: "directive", type: EuimHeaderDetailsMetaDirective, selector: "[euimHeaderDetailsMeta]" }, { kind: "directive", type: EuimHeaderDetailsIconDirective, selector: "[euimHeaderDetailsIcon]" }, { kind: "component", type: EuimLabelComponent, selector: "div[euimLabel], p[euimLabel], span[euimLabel], euim-label", inputs: ["euimLabelTruncateWithLines", "euimLabelTitle", "euimLabelSubTitle", "euimLabelMeta", "euimLabelTruncate"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+__decorate([
+    coerceBoolean
+], EuimAboutComponent.prototype, "showCode", void 0);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAboutComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'euim-about', encapsulation: ViewEncapsulation.None, template: "<div class=\"euim-about\">\r\n  <ion-header>\r\n    <ion-toolbar color=\"primary\">\r\n      <euim-toolbar>\r\n        <euim-toolbar-title><strong>About</strong></euim-toolbar-title>\r\n        <euim-toolbar-action-items>\r\n          <ion-label (click)=\"toggleQRCode()\" class=\"euim-about__toolbar-action-items\">\r\n            <strong>{{ showCode ? 'HIDE QR CODE' : 'SHOW QR CODE' }}</strong>\r\n          </ion-label>\r\n        </euim-toolbar-action-items>\r\n      </euim-toolbar>\r\n    </ion-toolbar>\r\n\r\n    <euim-header-details color=\"primary\">\r\n      <div euimHeaderDetailsIcon>\r\n        @if (showCode) {\r\n        <qrcode [qrdata]=\"qrCodeUrl\" [allowEmptyString]=\"true\" [cssClass]=\"'center'\"\r\n          [elementType]=\"'svg'\" [errorCorrectionLevel]=\"'M'\" [margin]=\"4\" [scale]=\"1\" [width]=\"160\"></qrcode> }\r\n          @if (!showCode) {\r\n            <img [src]=\"logoUrl\" alt=\"Image\" />  }\r\n      </div>\r\n      <div euimHeaderDetailsTitle><strong>eUI / mobile</strong></div>\r\n      <div euimHeaderDetailsMeta>version {{version}}</div>\r\n      <div euimHeaderDetailsMeta>Built on {{releaseDate}}</div>\r\n    </euim-header-details>\r\n  </ion-header>\r\n\r\n  <ion-list>\r\n    <ion-list-header class=\"euim-about__listHeader\">ABOUT THIS APP</ion-list-header>\r\n    @if (changelogExists) {\r\n    <ion-item class=\"euim-about__item\">\r\n      <ion-icon name=\"build-outline\" slot=\"start\"></ion-icon>\r\n      <div euimLabel class=\"euim-about__label\">Change Log</div>\r\n    </ion-item>\r\n  }\r\n  @if (privacyStatementExists) {\r\n    <ion-item class=\"euim-about__item\">\r\n      <ion-icon name=\"finger-print-sharp\" slot=\"start\"></ion-icon>\r\n      <div euimLabel class=\"euim-about__label\">Privacy Statement</div>\r\n    </ion-item>\r\n  }\r\n    @if (openSourceLicencesExists) {\r\n    <ion-item class=\"euim-about__item\">\r\n      <ion-icon name=\"ribbon-outline\" slot=\"start\"></ion-icon>\r\n      <div euimLabel class=\"euim-about__label\">Open source Licences</div>\r\n    </ion-item> }\r\n    @if (legalNoticeExists) {\r\n    <ion-item class=\"euim-about__item\">\r\n      <ion-icon name=\"library-outline\" slot=\"start\"></ion-icon>\r\n      <div euimLabel class=\"euim-about__label\">Legal Notice</div>\r\n    </ion-item> }\r\n    @if (contactSupportExists) {\r\n    <ion-item class=\"euim-about__item\">\r\n      <ion-icon name=\"mail-outline\" slot=\"start\"></ion-icon>\r\n      <div euimLabel class=\"euim-about__label\">Contact & Support</div>\r\n    </ion-item> }\r\n  </ion-list>\r\n</div>\r\n", styles: [".euim-about{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.euim-about euim-toolbar-title{font:normal normal 400 1.25rem/1.5rem var(--eui-base-font-family)}.euim-about euim-toolbar-action-items ion-label{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.euim-about ion-label{padding-inline-end:var(--eui-base-spacing-m);cursor:pointer}.euim-about__label{min-height:var(--eui-base-spacing-2xs);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.euim-about__listHeader{color:var(--eui-base-color-grey-100)}\n"] }]
+        }], propDecorators: { changelog: [{
+                type: ContentChild,
+                args: [EuimChangelogComponent]
+            }], privacyStatement: [{
+                type: ContentChild,
+                args: [EuimPrivacyStatementComponent]
+            }], contactSupport: [{
+                type: ContentChild,
+                args: [EuimContactSupportComponent]
+            }], legalNotice: [{
+                type: ContentChild,
+                args: [EuimLegalNoticeComponent]
+            }], openSourceLicences: [{
+                type: ContentChild,
+                args: [EuimOpenSourceLicencesComponent]
+            }], showCode: [{
+                type: Input
+            }], version: [{
+                type: Input
+            }], releaseDate: [{
+                type: Input
+            }], qrCodeUrl: [{
+                type: Input
+            }], logoUrl: [{
+                type: Input
+            }] } });
+
+const COMPONENTS = [
+    EuimAboutComponent,
+    EuimChangelogComponent,
+    EuimPrivacyStatementComponent,
+    EuimOpenSourceLicencesComponent,
+    EuimLegalNoticeComponent,
+    EuimContactSupportComponent,
+];
+class EuimAboutModule {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAboutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.0", ngImport: i0, type: EuimAboutModule, declarations: [EuimAboutComponent,
+            EuimChangelogComponent,
+            EuimPrivacyStatementComponent,
+            EuimOpenSourceLicencesComponent,
+            EuimLegalNoticeComponent,
+            EuimContactSupportComponent], imports: [CommonModule,
+            IonicModule,
+            QRCodeModule,
+            EuimToolbarComponentModule,
+            EuimHeaderDetailsModule,
+            EuimLabelModule,
+            EuimAvatarIconModule], exports: [EuimAboutComponent,
+            EuimChangelogComponent,
+            EuimPrivacyStatementComponent,
+            EuimOpenSourceLicencesComponent,
+            EuimLegalNoticeComponent,
+            EuimContactSupportComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAboutModule, imports: [CommonModule,
+            IonicModule,
+            QRCodeModule,
+            EuimToolbarComponentModule,
+            EuimHeaderDetailsModule,
+            EuimLabelModule,
+            EuimAvatarIconModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.0", ngImport: i0, type: EuimAboutModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        IonicModule,
+                        QRCodeModule,
+                        EuimToolbarComponentModule,
+                        EuimHeaderDetailsModule,
+                        EuimLabelModule,
+                        EuimAvatarIconModule,
+                    ],
                     exports: [
                         ...COMPONENTS,
                     ],
@@ -4255,32 +3302,114 @@ 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,
+    EuimAboutModule,
     EuimToolbarComponentModule,
     EuimNotificationItemModule,
     EuimMediaHeaderModule,
     EuimDataSummaryModule,
     EuimHeaderDetailsModule,
     EuimAvatarModule,
-    EuimInfoScreenModule,
-    EuimSliderModule,
     EuimSliderInfoScreenModule,
     EuimScrollerXComponentModule,
     EuimChipSelectorComponentModule,
@@ -4288,9 +3417,7 @@ const MODULES = [
     EuimSidebarModule,
     EuimMultiselectModule,
     // Directives
-    EuimListHeaderModule,
     EuimSpinnerComponentModule,
-    EuimItemDividerModule,
     EuimDividerModule,
     EuimSkeletonTextAvatarModule,
 ];
@@ -4299,29 +3426,23 @@ 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,
+            EuimAboutModule,
             EuimToolbarComponentModule,
             EuimNotificationItemModule,
             EuimMediaHeaderModule,
             EuimDataSummaryModule,
             EuimHeaderDetailsModule,
             EuimAvatarModule,
-            EuimInfoScreenModule,
-            EuimSliderModule,
             EuimSliderInfoScreenModule,
             EuimScrollerXComponentModule,
             EuimChipSelectorComponentModule,
@@ -4329,36 +3450,28 @@ 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,
+            EuimAboutModule,
             EuimToolbarComponentModule,
             EuimNotificationItemModule,
             EuimMediaHeaderModule,
             EuimDataSummaryModule,
             EuimHeaderDetailsModule,
             EuimAvatarModule,
-            EuimInfoScreenModule,
-            EuimSliderModule,
             EuimSliderInfoScreenModule,
             EuimScrollerXComponentModule,
             EuimChipSelectorComponentModule,
@@ -4366,37 +3479,29 @@ 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,
+            EuimAboutModule,
             EuimToolbarComponentModule,
             EuimNotificationItemModule,
             EuimMediaHeaderModule,
             EuimDataSummaryModule,
             EuimHeaderDetailsModule,
             EuimAvatarModule,
-            EuimInfoScreenModule,
-            EuimSliderModule,
             EuimSliderInfoScreenModule,
             EuimScrollerXComponentModule,
             EuimChipSelectorComponentModule,
@@ -4404,9 +3509,7 @@ class EuimAllModule {
             EuimSidebarModule,
             EuimMultiselectModule,
             // Directives
-            EuimListHeaderModule,
             EuimSpinnerComponentModule,
-            EuimItemDividerModule,
             EuimDividerModule,
             EuimSkeletonTextAvatarModule] }); }
 }
@@ -4428,5 +3531,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, EuimAboutComponent, EuimAboutModule, EuimAlertMessageComponent, EuimAlertMessageModule, EuimAllModule, EuimAppComponent, EuimAppModule, EuimAppService, EuimAvatarComponent, EuimAvatarIconComponent, EuimAvatarIconModule, EuimAvatarMainIconDirective, EuimAvatarModule, EuimAvatarSubIconDirective, EuimBadgeComponent, EuimBadgeModule, EuimChangelogComponent, EuimChipSelectorComponent, EuimChipSelectorComponentModule, EuimChipSelectorItemDirective, EuimContactSupportComponent, EuimDataSummaryColComponent, EuimDataSummaryColLabelDirective, EuimDataSummaryColValueDirective, EuimDataSummaryComponent, EuimDataSummaryModule, EuimDividerDirective, EuimDividerModule, EuimEmptyListPlaceholderComponent, EuimEmptyListPlaceholderModule, EuimHeaderDetailsComponent, EuimHeaderDetailsIconDirective, EuimHeaderDetailsMetaDirective, EuimHeaderDetailsModule, EuimHeaderDetailsTitleDirective, EuimLabelComponent, EuimLabelModule, EuimLanguageListComponent, EuimLanguageSelectorComponent, EuimLanguageSelectorModule, EuimLegalNoticeComponent, EuimMediaHeaderComponent, EuimMediaHeaderImageDirective, EuimMediaHeaderModule, EuimMediaHeaderSubTitleDirective, EuimMediaHeaderTitleDirective, EuimMessageComponent, EuimMessageModule, EuimMessageTitleComponent, EuimMultiselectAllDirective, EuimMultiselectComponent, EuimMultiselectFilterComponent, EuimMultiselectInfoComponent, EuimMultiselectListComponent, EuimMultiselectModule, EuimMultiselectSelectFieldDirective, EuimMultiselectToolbarComponent, EuimNotificationItemComponent, EuimNotificationItemModule, EuimOpenSourceLicencesComponent, EuimPdfWrapperComponent, EuimPdfWrapperModule, EuimPrivacyStatementComponent, 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