npm - @eui/components - Versions diffs - 18.0.0-next.13 → 18.0.0-next.14 - Mend

@eui/components 18.0.0-next.13 → 18.0.0-next.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (419) hide show

package/esm2022/layout/eui-app/eui-app-footer/footer.module.mjs CHANGED Viewed

@@ -3,11 +3,11 @@ import { NgModule } from '@angular/core';
 import { EuiAppFooterComponent } from './footer.component';
 import * as i0 from "@angular/core";
 export class EuiAppFooterModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppFooterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppFooterModule, declarations: [EuiAppFooterComponent], imports: [CommonModule], exports: [EuiAppFooterComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppFooterModule, imports: [CommonModule] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppFooterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppFooterModule, declarations: [EuiAppFooterComponent], imports: [CommonModule], exports: [EuiAppFooterComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppFooterModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppFooterModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppFooterModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule],

package/esm2022/layout/eui-app/eui-app-header/header.component.mjs CHANGED Viewed

@@ -59,10 +59,10 @@ export class EuiAppHeaderComponent {
     getCssClasses() {
         return ['eui-app-header', this.isHeaderShrinked ? 'eui-app-header--shrinked' : ''].join(' ');
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppHeaderComponent, deps: [{ token: i1.EuiAppShellService }, { token: i0.NgZone }, { token: i2.ViewportRuler }, { token: i2.ScrollDispatcher }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.2", type: EuiAppHeaderComponent, selector: "eui-app-header", inputs: { isShrinkHeaderActive: "isShrinkHeaderActive" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, ngImport: i0, template: "<eui-sidebar-toggle\n    *ngIf=\"(asService.state$ | async).hasSidebar && (asService.state$ | async).hasHeader && !(asService.state$ | async).hasToolbar\"\n    class=\"eui-app-header__sidebar-toggle\"\n    iconSvgFillColor=\"primary-100\">\n</eui-sidebar-toggle>\n\n<ng-content select=\"eui-header\"></ng-content>\n", styles: [".eui-app-header{align-items:center;background-color:var(--eui-base-color-white);display:flex;flex-direction:row;height:var(--eui-app-header-height);position:fixed;right:0;top:var(--eui-app-top-message-height);width:100%;z-index:var(--eui-base-z-index-header);transition:all .1s ease}.eui-app-header--shrinked{visibility:hidden}.eui-app-header__sidebar-toggle{padding-left:var(--eui-base-spacing-xs);padding-top:var(--eui-base-spacing-m)}@media screen and (max-width: 767px){.eui-app-header{visibility:hidden}}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.EuiSidebarToggleComponent, selector: "eui-sidebar-toggle", inputs: ["e2eAttr", "iconSvgFillColor"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppHeaderComponent, deps: [{ token: i1.EuiAppShellService }, { token: i0.NgZone }, { token: i2.ViewportRuler }, { token: i2.ScrollDispatcher }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: EuiAppHeaderComponent, selector: "eui-app-header", inputs: { isShrinkHeaderActive: "isShrinkHeaderActive" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, ngImport: i0, template: "<eui-sidebar-toggle\n    *ngIf=\"(asService.state$ | async).hasSidebar && (asService.state$ | async).hasHeader && !(asService.state$ | async).hasToolbar\"\n    class=\"eui-app-header__sidebar-toggle\"\n    iconSvgFillColor=\"primary-100\">\n</eui-sidebar-toggle>\n\n<ng-content select=\"eui-header\"></ng-content>\n", styles: [".eui-app-header{align-items:center;background-color:var(--eui-base-color-white);display:flex;flex-direction:row;height:var(--eui-app-header-height);position:fixed;right:0;top:var(--eui-app-top-message-height);width:100%;z-index:var(--eui-base-z-index-header);transition:all .1s ease}.eui-app-header--shrinked{visibility:hidden}.eui-app-header__sidebar-toggle{padding-left:var(--eui-base-spacing-xs);padding-top:var(--eui-base-spacing-m)}@media screen and (max-width: 767px){.eui-app-header{visibility:hidden}}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.EuiSidebarToggleComponent, selector: "eui-sidebar-toggle", inputs: ["e2eAttr", "iconSvgFillColor"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-app-header', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<eui-sidebar-toggle\n    *ngIf=\"(asService.state$ | async).hasSidebar && (asService.state$ | async).hasHeader && !(asService.state$ | async).hasToolbar\"\n    class=\"eui-app-header__sidebar-toggle\"\n    iconSvgFillColor=\"primary-100\">\n</eui-sidebar-toggle>\n\n<ng-content select=\"eui-header\"></ng-content>\n", styles: [".eui-app-header{align-items:center;background-color:var(--eui-base-color-white);display:flex;flex-direction:row;height:var(--eui-app-header-height);position:fixed;right:0;top:var(--eui-app-top-message-height);width:100%;z-index:var(--eui-base-z-index-header);transition:all .1s ease}.eui-app-header--shrinked{visibility:hidden}.eui-app-header__sidebar-toggle{padding-left:var(--eui-base-spacing-xs);padding-top:var(--eui-base-spacing-m)}@media screen and (max-width: 767px){.eui-app-header{visibility:hidden}}\n"] }]
         }], ctorParameters: () => [{ type: i1.EuiAppShellService }, { type: i0.NgZone }, { type: i2.ViewportRuler }, { type: i2.ScrollDispatcher }], propDecorators: { cssClasses: [{

package/esm2022/layout/eui-app/eui-app-header/header.module.mjs CHANGED Viewed

@@ -7,11 +7,11 @@ import { EuiSidebarToggleModule } from '../../eui-sidebar-toggle/sidebar-toggle.
 import { EuiAppHeaderComponent } from './header.component';
 import * as i0 from "@angular/core";
 export class EuiAppHeaderModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppHeaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppHeaderModule, declarations: [EuiAppHeaderComponent], imports: [CommonModule, EuiSidebarToggleModule, EuiUserProfileModule, EuiLanguageSelectorModule, RouterModule], exports: [EuiAppHeaderComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppHeaderModule, imports: [CommonModule, EuiSidebarToggleModule, EuiUserProfileModule, EuiLanguageSelectorModule, RouterModule] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppHeaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppHeaderModule, declarations: [EuiAppHeaderComponent], imports: [CommonModule, EuiSidebarToggleModule, EuiUserProfileModule, EuiLanguageSelectorModule, RouterModule], exports: [EuiAppHeaderComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppHeaderModule, imports: [CommonModule, EuiSidebarToggleModule, EuiUserProfileModule, EuiLanguageSelectorModule, RouterModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppHeaderModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppHeaderModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, EuiSidebarToggleModule, EuiUserProfileModule, EuiLanguageSelectorModule, RouterModule],

package/esm2022/layout/eui-app/eui-app-sidebar/sidebar-body/sidebar-body.component.mjs CHANGED Viewed

@@ -4,10 +4,10 @@ export class EuiAppSidebarBodyComponent {
     constructor() {
         this.class = 'eui-app-sidebar-body';
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.2", type: EuiAppSidebarBodyComponent, selector: "eui-app-sidebar-body", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<ng-content select=\"eui-app-sidebar-menu\"></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: EuiAppSidebarBodyComponent, selector: "eui-app-sidebar-body", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<ng-content select=\"eui-app-sidebar-menu\"></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarBodyComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarBodyComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-app-sidebar-body', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<ng-content select=\"eui-app-sidebar-menu\"></ng-content>\n" }]
         }], propDecorators: { class: [{

package/esm2022/layout/eui-app/eui-app-sidebar/sidebar-drawer/sidebar-drawer.component.mjs CHANGED Viewed

@@ -14,19 +14,22 @@ export class EuiAppSidebarDrawerComponent {
     get cssClasses() {
         return this._getCssClasses();
     }
+    onSidebarDrawerContentClick(event) {
+        event.stopPropagation();
+    }
     _getCssClasses() {
         return ['eui-app-sidebar-drawer', this.isExpanded ? 'eui-app-sidebar-drawer--expanded' : ''].join(' ').trim();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.2", type: EuiAppSidebarDrawerComponent, selector: "eui-app-sidebar-drawer", inputs: { isExpanded: "isExpanded" }, host: { properties: { "class": "this.cssClasses" } }, ngImport: i0, template: "<!-- HIDDEN APP DRAWER : scrolls up and revealing user info details or any other injected content -->\n<div class=\"eui-app-sidebar-drawer-content\">\n    <ng-content></ng-content>\n</div>\n", encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: EuiAppSidebarDrawerComponent, selector: "eui-app-sidebar-drawer", inputs: { isExpanded: "isExpanded" }, host: { properties: { "class": "this.cssClasses" } }, ngImport: i0, template: "<!-- HIDDEN APP DRAWER : scrolls up and revealing user info details or any other injected content -->\n<div class=\"eui-app-sidebar-drawer-content\" (click)=\"onSidebarDrawerContentClick($event)\">\n    <ng-content></ng-content>\n</div>\n", encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarDrawerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarDrawerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'eui-app-sidebar-drawer', encapsulation: ViewEncapsulation.None, template: "<!-- HIDDEN APP DRAWER : scrolls up and revealing user info details or any other injected content -->\n<div class=\"eui-app-sidebar-drawer-content\">\n    <ng-content></ng-content>\n</div>\n" }]
+            args: [{ selector: 'eui-app-sidebar-drawer', encapsulation: ViewEncapsulation.None, template: "<!-- HIDDEN APP DRAWER : scrolls up and revealing user info details or any other injected content -->\n<div class=\"eui-app-sidebar-drawer-content\" (click)=\"onSidebarDrawerContentClick($event)\">\n    <ng-content></ng-content>\n</div>\n" }]
         }], propDecorators: { isExpanded: [{
                 type: Input
             }], cssClasses: [{
                 type: HostBinding,
                 args: ['class']
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZWJhci1kcmF3ZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGF5b3V0L2V1aS1hcHAvZXVpLWFwcC1zaWRlYmFyL3NpZGViYXItZHJhd2VyL3NpZGViYXItZHJhd2VyLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL2xheW91dC9ldWktYXBwL2V1aS1hcHAtc2lkZWJhci9zaWRlYmFyLWRyYXdlci9zaWRlYmFyLWRyYXdlci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUscUJBQXFCLEVBQWdCLE1BQU0sdUJBQXVCLENBQUM7QUFDNUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxXQUFXLEVBQUUsaUJBQWlCLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQU9qRixNQUFNLE9BQU8sNEJBQTRCO0lBTHpDO1FBaUJZLGdCQUFXLEdBQUcsS0FBSyxDQUFDO0tBSy9CO0lBaEJHLElBQ0ksVUFBVTtRQUNWLE9BQU8sSUFBSSxDQUFDLFdBQVcsQ0FBQztJQUM1QixDQUFDO0lBQ0QsSUFBSSxVQUFVLENBQUMsS0FBbUI7UUFDOUIsSUFBSSxDQUFDLFdBQVcsR0FBRyxxQkFBcUIsQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNwRCxDQUFDO0lBQ0QsSUFDVyxVQUFVO1FBQ2pCLE9BQU8sSUFBSSxDQUFDLGNBQWMsRUFBRSxDQUFDO0lBQ2pDLENBQUM7SUFHTyxjQUFjO1FBQ2xCLE9BQU8sQ0FBQyx3QkFBd0IsRUFBRSxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxrQ0FBa0MsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDLElBQUksRUFBRSxDQUFDO0lBQ2xILENBQUM7d0lBaEJRLDRCQUE0Qjs0SEFBNUIsNEJBQTRCLDBKQ1J6QyxnTUFJQTs7a0dESWEsNEJBQTRCO2tCQUx4QyxTQUFTOytCQUNJLHdCQUF3QixpQkFFbkIsaUJBQWlCLENBQUMsSUFBSTs4QkFJakMsVUFBVTtzQkFEYixLQUFLO2dCQVFLLFVBQVU7c0JBRHBCLFdBQVc7dUJBQUMsT0FBTyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNvZXJjZUJvb2xlYW5Qcm9wZXJ0eSwgQm9vbGVhbklucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY2RrL2NvZXJjaW9uJztcbmltcG9ydCB7IENvbXBvbmVudCwgSG9zdEJpbmRpbmcsIFZpZXdFbmNhcHN1bGF0aW9uLCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgICBzZWxlY3RvcjogJ2V1aS1hcHAtc2lkZWJhci1kcmF3ZXInLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9zaWRlYmFyLWRyYXdlci5jb21wb25lbnQuaHRtbCcsXG4gICAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbn0pXG5leHBvcnQgY2xhc3MgRXVpQXBwU2lkZWJhckRyYXdlckNvbXBvbmVudCB7XG4gICAgQElucHV0KClcbiAgICBnZXQgaXNFeHBhbmRlZCgpOiBib29sZWFuIHtcbiAgICAgICAgcmV0dXJuIHRoaXMuX2lzRXhwYW5kZWQ7XG4gICAgfVxuICAgIHNldCBpc0V4cGFuZGVkKHZhbHVlOiBCb29sZWFuSW5wdXQpIHtcbiAgICAgICAgdGhpcy5faXNFeHBhbmRlZCA9IGNvZXJjZUJvb2xlYW5Qcm9wZXJ0eSh2YWx1ZSk7XG4gICAgfVxuICAgIEBIb3N0QmluZGluZygnY2xhc3MnKVxuICAgIHB1YmxpYyBnZXQgY3NzQ2xhc3NlcygpOiBzdHJpbmcge1xuICAgICAgICByZXR1cm4gdGhpcy5fZ2V0Q3NzQ2xhc3NlcygpO1xuICAgIH1cbiAgICBwcml2YXRlIF9pc0V4cGFuZGVkID0gZmFsc2U7XG5cbiAgICBwcml2YXRlIF9nZXRDc3NDbGFzc2VzKCk6IHN0cmluZyB7XG4gICAgICAgIHJldHVybiBbJ2V1aS1hcHAtc2lkZWJhci1kcmF3ZXInLCB0aGlzLmlzRXhwYW5kZWQgPyAnZXVpLWFwcC1zaWRlYmFyLWRyYXdlci0tZXhwYW5kZWQnIDogJyddLmpvaW4oJyAnKS50cmltKCk7XG4gICAgfVxufVxuIiwiPCEtLSBISURERU4gQVBQIERSQVdFUiA6IHNjcm9sbHMgdXAgYW5kIHJldmVhbGluZyB1c2VyIGluZm8gZGV0YWlscyBvciBhbnkgb3RoZXIgaW5qZWN0ZWQgY29udGVudCAtLT5cbjxkaXYgY2xhc3M9XCJldWktYXBwLXNpZGViYXItZHJhd2VyLWNvbnRlbnRcIj5cbiAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG48L2Rpdj5cbiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lkZWJhci1kcmF3ZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGF5b3V0L2V1aS1hcHAvZXVpLWFwcC1zaWRlYmFyL3NpZGViYXItZHJhd2VyL3NpZGViYXItZHJhd2VyLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL2xheW91dC9ldWktYXBwL2V1aS1hcHAtc2lkZWJhci9zaWRlYmFyLWRyYXdlci9zaWRlYmFyLWRyYXdlci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUscUJBQXFCLEVBQWdCLE1BQU0sdUJBQXVCLENBQUM7QUFDNUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxXQUFXLEVBQUUsaUJBQWlCLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQU9qRixNQUFNLE9BQU8sNEJBQTRCO0lBTHpDO1FBaUJZLGdCQUFXLEdBQUcsS0FBSyxDQUFDO0tBUy9CO0lBcEJHLElBQ0ksVUFBVTtRQUNWLE9BQU8sSUFBSSxDQUFDLFdBQVcsQ0FBQztJQUM1QixDQUFDO0lBQ0QsSUFBSSxVQUFVLENBQUMsS0FBbUI7UUFDOUIsSUFBSSxDQUFDLFdBQVcsR0FBRyxxQkFBcUIsQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNwRCxDQUFDO0lBQ0QsSUFDVyxVQUFVO1FBQ2pCLE9BQU8sSUFBSSxDQUFDLGNBQWMsRUFBRSxDQUFDO0lBQ2pDLENBQUM7SUFHTSwyQkFBMkIsQ0FBQyxLQUFZO1FBQzNDLEtBQUssQ0FBQyxlQUFlLEVBQUUsQ0FBQztJQUM1QixDQUFDO0lBRU8sY0FBYztRQUNsQixPQUFPLENBQUMsd0JBQXdCLEVBQUUsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsa0NBQWtDLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUNsSCxDQUFDO3dJQXBCUSw0QkFBNEI7NEhBQTVCLDRCQUE0QiwwSkNSekMsZ1BBSUE7O2tHRElhLDRCQUE0QjtrQkFMeEMsU0FBUzsrQkFDSSx3QkFBd0IsaUJBRW5CLGlCQUFpQixDQUFDLElBQUk7OEJBSWpDLFVBQVU7c0JBRGIsS0FBSztnQkFRSyxVQUFVO3NCQURwQixXQUFXO3VCQUFDLE9BQU8iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjb2VyY2VCb29sZWFuUHJvcGVydHksIEJvb2xlYW5JbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9jb2VyY2lvbic7XG5pbXBvcnQgeyBDb21wb25lbnQsIEhvc3RCaW5kaW5nLCBWaWV3RW5jYXBzdWxhdGlvbiwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdldWktYXBwLXNpZGViYXItZHJhd2VyJyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vc2lkZWJhci1kcmF3ZXIuY29tcG9uZW50Lmh0bWwnLFxuICAgIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG59KVxuZXhwb3J0IGNsYXNzIEV1aUFwcFNpZGViYXJEcmF3ZXJDb21wb25lbnQge1xuICAgIEBJbnB1dCgpXG4gICAgZ2V0IGlzRXhwYW5kZWQoKTogYm9vbGVhbiB7XG4gICAgICAgIHJldHVybiB0aGlzLl9pc0V4cGFuZGVkO1xuICAgIH1cbiAgICBzZXQgaXNFeHBhbmRlZCh2YWx1ZTogQm9vbGVhbklucHV0KSB7XG4gICAgICAgIHRoaXMuX2lzRXhwYW5kZWQgPSBjb2VyY2VCb29sZWFuUHJvcGVydHkodmFsdWUpO1xuICAgIH1cbiAgICBASG9zdEJpbmRpbmcoJ2NsYXNzJylcbiAgICBwdWJsaWMgZ2V0IGNzc0NsYXNzZXMoKTogc3RyaW5nIHtcbiAgICAgICAgcmV0dXJuIHRoaXMuX2dldENzc0NsYXNzZXMoKTtcbiAgICB9XG4gICAgcHJpdmF0ZSBfaXNFeHBhbmRlZCA9IGZhbHNlO1xuXG4gICAgcHVibGljIG9uU2lkZWJhckRyYXdlckNvbnRlbnRDbGljayhldmVudDogRXZlbnQpOiB2b2lkIHtcbiAgICAgICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XG4gICAgfVxuXG4gICAgcHJpdmF0ZSBfZ2V0Q3NzQ2xhc3NlcygpOiBzdHJpbmcge1xuICAgICAgICByZXR1cm4gWydldWktYXBwLXNpZGViYXItZHJhd2VyJywgdGhpcy5pc0V4cGFuZGVkID8gJ2V1aS1hcHAtc2lkZWJhci1kcmF3ZXItLWV4cGFuZGVkJyA6ICcnXS5qb2luKCcgJykudHJpbSgpO1xuICAgIH1cbn1cbiIsIjwhLS0gSElEREVOIEFQUCBEUkFXRVIgOiBzY3JvbGxzIHVwIGFuZCByZXZlYWxpbmcgdXNlciBpbmZvIGRldGFpbHMgb3IgYW55IG90aGVyIGluamVjdGVkIGNvbnRlbnQgLS0+XG48ZGl2IGNsYXNzPVwiZXVpLWFwcC1zaWRlYmFyLWRyYXdlci1jb250ZW50XCIgKGNsaWNrKT1cIm9uU2lkZWJhckRyYXdlckNvbnRlbnRDbGljaygkZXZlbnQpXCI+XG4gICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuPC9kaXY+XG4iXX0=

package/esm2022/layout/eui-app/eui-app-sidebar/sidebar-footer/sidebar-footer.component.mjs CHANGED Viewed

@@ -12,10 +12,10 @@ export class EuiAppSidebarFooterComponent {
     ngOnDestroy() {
         document.documentElement.style.removeProperty('--eui-app-sidebar-footer-height');
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarFooterComponent, deps: [{ token: i1.EuiAppShellService }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.2", type: EuiAppSidebarFooterComponent, selector: "eui-app-sidebar-footer", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<ng-content></ng-content>\n", encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarFooterComponent, deps: [{ token: i1.EuiAppShellService }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: EuiAppSidebarFooterComponent, selector: "eui-app-sidebar-footer", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<ng-content></ng-content>\n", encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarFooterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarFooterComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-app-sidebar-footer', encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n" }]
         }], ctorParameters: () => [{ type: i1.EuiAppShellService }], propDecorators: { class: [{

package/esm2022/layout/eui-app/eui-app-sidebar/sidebar-header/sidebar-header.component.mjs CHANGED Viewed

@@ -12,10 +12,10 @@ export class EuiAppSidebarHeaderComponent {
     ngOnDestroy() {
         document.documentElement.style.removeProperty('--eui-app-sidebar-header-height');
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarHeaderComponent, deps: [{ token: i1.EuiAppShellService }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.2", type: EuiAppSidebarHeaderComponent, selector: "eui-app-sidebar-header", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<ng-content></ng-content>\n", encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarHeaderComponent, deps: [{ token: i1.EuiAppShellService }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: EuiAppSidebarHeaderComponent, selector: "eui-app-sidebar-header", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<ng-content></ng-content>\n", encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-app-sidebar-header', encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n" }]
         }], ctorParameters: () => [{ type: i1.EuiAppShellService }], propDecorators: { class: [{

package/esm2022/layout/eui-app/eui-app-sidebar/sidebar-header-user-profile/sidebar-header-user-profile.component.mjs CHANGED Viewed

@@ -43,10 +43,10 @@ export class EuiAppSidebarHeaderUserProfileComponent {
             this.hasProfileDrawer ? 'eui-app-sidebar-header-user-profile--has-drawer' : '',
         ].join(' ').trim();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarHeaderUserProfileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.2", type: EuiAppSidebarHeaderUserProfileComponent, selector: "eui-app-sidebar-header-user-profile", inputs: { welcomeLabel: "welcomeLabel", impersonateLabel: "impersonateLabel", avatarUrl: "avatarUrl", isShowUserInfos: ["isShowUserInfos", "isShowUserInfos", booleanAttribute], isShowAvatarInitials: ["isShowAvatarInitials", "isShowAvatarInitials", booleanAttribute], isOnline: ["isOnline", "isOnline", booleanAttribute], hasWelcomeLabel: ["hasWelcomeLabel", "hasWelcomeLabel", booleanAttribute], hasTabNavigation: ["hasTabNavigation", "hasTabNavigation", booleanAttribute], hasToggle: ["hasToggle", "hasToggle", booleanAttribute], hasProfileDrawer: ["hasProfileDrawer", "hasProfileDrawer", booleanAttribute] }, outputs: { toggle: "toggle" }, host: { listeners: { "click": "onClick($event)" }, properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "userProfileMenu", predicate: i0.forwardRef(() => EuiUserProfileMenuComponent) }], ngImport: i0, template: "<eui-user-profile\n    [hasWelcomeLabel]=\"hasWelcomeLabel\"\n    [welcomeLabel]=\"welcomeLabel\"\n    [impersonateLabel]=\"impersonateLabel\"\n    [avatarUrl]=\"avatarUrl\"\n    [hasMenu]=\"userProfileMenu.length !== 0\"\n    [isShowUserInfos]=\"isShowUserInfos\"\n    [isShowAvatarInitials]=\"isShowAvatarInitials\"\n    [hasTabNavigation]=\"hasTabNavigation\"\n    isReverse\n    [hasToggle]=\"hasToggle\"\n    #userProfile>\n    <ng-content select=\"eui-user-profile-menu\"></ng-content>\n</eui-user-profile>\n\n<button *ngIf=\"hasProfileDrawer\" euiButton euiRounded euiIconButton euiBasicButton euiSecondary class=\"eui-u-ml-auto\" aria-label=\"Toggle user profile details\">\n    <eui-icon-svg [icon]=\"toggleProfile ? 'eui-chevron-up' : 'eui-chevron-down'\"></eui-icon-svg>\n</button>\n", styles: [".eui-app-sidebar-header-user-profile{border-bottom:1px solid var(--eui-base-color-grey-25);display:flex;height:var(--eui-app-sidebar-header-user-profile);padding:var(--eui-base-spacing-s) var(--eui-base-spacing-m);position:relative;width:100%}.eui-app-sidebar-header-user-profile--has-drawer,.eui-app-sidebar-header-user-profile--has-drawer .eui-user-profile-content--no-menu{cursor:pointer}@media screen and (min-width: 996px){.eui-app-sidebar-header-user-profile{display:none}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "component", type: i3.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading"] }, { kind: "component", type: i4.EuiUserProfileComponent, selector: "eui-user-profile", inputs: ["welcomeLabel", "impersonateLabel", "avatarUrl", "subInfos", "hasMenu", "isShowUserInfos", "hasWelcomeLabel", "isShowAvatarInitials", "hasTabNavigation", "isReverse", "hasToggle", "isHeaderUserProfile"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarHeaderUserProfileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.3", type: EuiAppSidebarHeaderUserProfileComponent, selector: "eui-app-sidebar-header-user-profile", inputs: { welcomeLabel: "welcomeLabel", impersonateLabel: "impersonateLabel", avatarUrl: "avatarUrl", isShowUserInfos: ["isShowUserInfos", "isShowUserInfos", booleanAttribute], isShowAvatarInitials: ["isShowAvatarInitials", "isShowAvatarInitials", booleanAttribute], isOnline: ["isOnline", "isOnline", booleanAttribute], hasWelcomeLabel: ["hasWelcomeLabel", "hasWelcomeLabel", booleanAttribute], hasTabNavigation: ["hasTabNavigation", "hasTabNavigation", booleanAttribute], hasToggle: ["hasToggle", "hasToggle", booleanAttribute], hasProfileDrawer: ["hasProfileDrawer", "hasProfileDrawer", booleanAttribute] }, outputs: { toggle: "toggle" }, host: { listeners: { "click": "onClick($event)" }, properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "userProfileMenu", predicate: i0.forwardRef(() => EuiUserProfileMenuComponent) }], ngImport: i0, template: "<eui-user-profile\n    [hasWelcomeLabel]=\"hasWelcomeLabel\"\n    [welcomeLabel]=\"welcomeLabel\"\n    [impersonateLabel]=\"impersonateLabel\"\n    [avatarUrl]=\"avatarUrl\"\n    [hasMenu]=\"userProfileMenu.length !== 0\"\n    [isShowUserInfos]=\"isShowUserInfos\"\n    [isShowAvatarInitials]=\"isShowAvatarInitials\"\n    [hasTabNavigation]=\"hasTabNavigation\"\n    isReverse\n    [hasToggle]=\"hasToggle\"\n    #userProfile>\n    <ng-content select=\"eui-user-profile-menu\"></ng-content>\n</eui-user-profile>\n\n<button *ngIf=\"hasProfileDrawer\" euiButton euiRounded euiIconButton euiBasicButton euiSecondary class=\"eui-u-ml-auto\" aria-label=\"Toggle user profile details\">\n    <eui-icon-svg [icon]=\"toggleProfile ? 'eui-chevron-up' : 'eui-chevron-down'\"></eui-icon-svg>\n</button>\n", styles: [".eui-app-sidebar-header-user-profile{border-bottom:1px solid var(--eui-base-color-grey-25);display:flex;height:var(--eui-app-sidebar-header-user-profile);padding:var(--eui-base-spacing-s) var(--eui-base-spacing-m);position:relative;width:100%}.eui-app-sidebar-header-user-profile--has-drawer,.eui-app-sidebar-header-user-profile--has-drawer .eui-user-profile-content--no-menu{cursor:pointer}@media screen and (min-width: 996px){.eui-app-sidebar-header-user-profile{display:none}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "component", type: i3.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading"] }, { kind: "component", type: i4.EuiUserProfileComponent, selector: "eui-user-profile", inputs: ["welcomeLabel", "impersonateLabel", "avatarUrl", "subInfos", "hasMenu", "isShowUserInfos", "hasWelcomeLabel", "isShowAvatarInitials", "hasTabNavigation", "isReverse", "hasToggle", "isHeaderUserProfile"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarHeaderUserProfileComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarHeaderUserProfileComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-app-sidebar-header-user-profile', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<eui-user-profile\n    [hasWelcomeLabel]=\"hasWelcomeLabel\"\n    [welcomeLabel]=\"welcomeLabel\"\n    [impersonateLabel]=\"impersonateLabel\"\n    [avatarUrl]=\"avatarUrl\"\n    [hasMenu]=\"userProfileMenu.length !== 0\"\n    [isShowUserInfos]=\"isShowUserInfos\"\n    [isShowAvatarInitials]=\"isShowAvatarInitials\"\n    [hasTabNavigation]=\"hasTabNavigation\"\n    isReverse\n    [hasToggle]=\"hasToggle\"\n    #userProfile>\n    <ng-content select=\"eui-user-profile-menu\"></ng-content>\n</eui-user-profile>\n\n<button *ngIf=\"hasProfileDrawer\" euiButton euiRounded euiIconButton euiBasicButton euiSecondary class=\"eui-u-ml-auto\" aria-label=\"Toggle user profile details\">\n    <eui-icon-svg [icon]=\"toggleProfile ? 'eui-chevron-up' : 'eui-chevron-down'\"></eui-icon-svg>\n</button>\n", styles: [".eui-app-sidebar-header-user-profile{border-bottom:1px solid var(--eui-base-color-grey-25);display:flex;height:var(--eui-app-sidebar-header-user-profile);padding:var(--eui-base-spacing-s) var(--eui-base-spacing-m);position:relative;width:100%}.eui-app-sidebar-header-user-profile--has-drawer,.eui-app-sidebar-header-user-profile--has-drawer .eui-user-profile-content--no-menu{cursor:pointer}@media screen and (min-width: 996px){.eui-app-sidebar-header-user-profile{display:none}}\n"] }]
         }], propDecorators: { cssClasses: [{

package/esm2022/layout/eui-app/eui-app-sidebar/sidebar-menu/sidebar-menu.component.mjs CHANGED Viewed

@@ -47,10 +47,10 @@ export class EuiAppSidebarMenuComponent {
         }
         this.sidebarItemClick.emit(event);
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarMenuComponent, deps: [{ token: i1.EuiAppShellService }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.2", type: EuiAppSidebarMenuComponent, selector: "eui-app-sidebar-menu", inputs: { hasFilter: ["hasFilter", "hasFilter", booleanAttribute], hasIcons: ["hasIcons", "hasIcons", booleanAttribute], hasTooltip: ["hasTooltip", "hasTooltip", booleanAttribute], expandAllItems: ["expandAllItems", "expandAllItems", booleanAttribute], isCollapsed: ["isCollapsed", "isCollapsed", booleanAttribute], hasCollapsedInitials: ["hasCollapsedInitials", "hasCollapsedInitials", booleanAttribute], isFlat: ["isFlat", "isFlat", booleanAttribute], hasScrollToItem: ["hasScrollToItem", "hasScrollToItem", booleanAttribute], hasLowercaseItems: ["hasLowercaseItems", "hasLowercaseItems", booleanAttribute], items: "items" }, outputs: { sidebarItemClick: "sidebarItemClick" }, host: { properties: { "class": "this.class" } }, usesOnChanges: true, ngImport: i0, template: "<eui-menu\n    [items]=\"items\"\n    [hasFilter]=\"hasFilter\"\n    [hasIcons]=\"hasIcons\"\n    [hasTooltip]=\"hasTooltip\"\n    [expandAllItems]=\"expandAllItems\"\n    [isFlat]=\"isFlat\"\n    [hasScrollToItem]=\"hasScrollToItem\"\n    [hasCollapsedInitials]=\"hasCollapsedInitials\"\n    [hasLowercaseItems]=\"hasLowercaseItems\"\n    [isCollapsed]=\"!(asService.state$ | async).isSidebarOpen && !(asService.state$ | async).isSidebarHover\"\n    (itemClick)=\"onMenuItemClicked($event)\">\n</eui-menu>\n", dependencies: [{ kind: "component", type: i2.EuiMenuComponent, selector: "eui-menu", inputs: ["items", "searchFilterLabel", "externalLinkLabel", "fragmentId", "filterValue", "isCollapsed", "hasCollapsedInitials", "hasFilter", "hasIcons", "hasTooltip", "expandAllItems", "isFlat", "hasScrollToItem", "hasLowercaseItems"], outputs: ["isClick", "itemClick"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarMenuComponent, deps: [{ token: i1.EuiAppShellService }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.3", type: EuiAppSidebarMenuComponent, selector: "eui-app-sidebar-menu", inputs: { hasFilter: ["hasFilter", "hasFilter", booleanAttribute], hasIcons: ["hasIcons", "hasIcons", booleanAttribute], hasTooltip: ["hasTooltip", "hasTooltip", booleanAttribute], expandAllItems: ["expandAllItems", "expandAllItems", booleanAttribute], isCollapsed: ["isCollapsed", "isCollapsed", booleanAttribute], hasCollapsedInitials: ["hasCollapsedInitials", "hasCollapsedInitials", booleanAttribute], isFlat: ["isFlat", "isFlat", booleanAttribute], hasScrollToItem: ["hasScrollToItem", "hasScrollToItem", booleanAttribute], hasLowercaseItems: ["hasLowercaseItems", "hasLowercaseItems", booleanAttribute], items: "items" }, outputs: { sidebarItemClick: "sidebarItemClick" }, host: { properties: { "class": "this.class" } }, usesOnChanges: true, ngImport: i0, template: "<eui-menu\n    [items]=\"items\"\n    [hasFilter]=\"hasFilter\"\n    [hasIcons]=\"hasIcons\"\n    [hasTooltip]=\"hasTooltip\"\n    [expandAllItems]=\"expandAllItems\"\n    [isFlat]=\"isFlat\"\n    [hasScrollToItem]=\"hasScrollToItem\"\n    [hasCollapsedInitials]=\"hasCollapsedInitials\"\n    [hasLowercaseItems]=\"hasLowercaseItems\"\n    [isCollapsed]=\"!(asService.state$ | async).isSidebarOpen && !(asService.state$ | async).isSidebarHover\"\n    (itemClick)=\"onMenuItemClicked($event)\">\n</eui-menu>\n", dependencies: [{ kind: "component", type: i2.EuiMenuComponent, selector: "eui-menu", inputs: ["items", "searchFilterLabel", "externalLinkLabel", "fragmentId", "filterValue", "isCollapsed", "hasCollapsedInitials", "hasFilter", "hasIcons", "hasTooltip", "expandAllItems", "isFlat", "hasScrollToItem", "hasLowercaseItems"], outputs: ["isClick", "itemClick"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarMenuComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarMenuComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-app-sidebar-menu', encapsulation: ViewEncapsulation.None, template: "<eui-menu\n    [items]=\"items\"\n    [hasFilter]=\"hasFilter\"\n    [hasIcons]=\"hasIcons\"\n    [hasTooltip]=\"hasTooltip\"\n    [expandAllItems]=\"expandAllItems\"\n    [isFlat]=\"isFlat\"\n    [hasScrollToItem]=\"hasScrollToItem\"\n    [hasCollapsedInitials]=\"hasCollapsedInitials\"\n    [hasLowercaseItems]=\"hasLowercaseItems\"\n    [isCollapsed]=\"!(asService.state$ | async).isSidebarOpen && !(asService.state$ | async).isSidebarHover\"\n    (itemClick)=\"onMenuItemClicked($event)\">\n</eui-menu>\n" }]
         }], ctorParameters: () => [{ type: i1.EuiAppShellService }], propDecorators: { class: [{

package/esm2022/layout/eui-app/eui-app-sidebar/sidebar.component.mjs CHANGED Viewed

@@ -43,12 +43,12 @@ export class EuiAppSidebarComponent {
             this.asService.isSidebarHover = false;
         }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarComponent, deps: [{ token: i1.EuiAppShellService, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.2", type: EuiAppSidebarComponent, selector: "eui-app-sidebar", host: { listeners: { "body:click": "close()" }, properties: { "class": "this.string" } }, ngImport: i0, template: "<div class=\"eui-app-sidebar-content\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\" role=\"complementary\">\n    <ng-content select=\"eui-app-sidebar-header-user-profile\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-header\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-body\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-footer\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-drawer\"></ng-content>\n</div>\n", styles: [".eui-app-sidebar{background-color:var(--eui-base-color-grey-2);height:100%;left:0;position:fixed;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));width:var(--eui-app-sidebar-width);box-shadow:var(--eui-base-shadow-10)}.eui-app.ff.sidebar--close:not(.sidebar--hover) .eui-app-sidebar{width:calc(var(--eui-app-sidebar-width-close-active) + 16px)}.modal-open .eui-app-sidebar{z-index:auto}.eui-app-sidebar-content{border-right:1px solid var(--eui-base-color-grey-5);box-shadow:0 8px 10px #b7c0cebf;display:flex;flex-direction:column;height:100%;max-height:calc(100% - (var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height)));overflow:hidden;position:relative}.eui-app-sidebar-header{align-items:center;background-color:var(--eui-base-color-grey-5);border-bottom:1px solid var(--eui-base-color-grey-10);display:flex;width:100%}.eui-app-sidebar-body{display:flex;height:100%;max-height:calc(100% - (var(--eui-app-sidebar-header-height) + var(--eui-app-sidebar-footer-height)));overflow-x:hidden;overflow-y:scroll}.eui-app-sidebar-body::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-app-sidebar-body::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-app-sidebar-body::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-app-sidebar-body::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar-body{max-height:100%}.eui-app-sidebar-footer{align-items:center;display:flex;flex:0 0 auto;justify-content:center;padding:var(--eui-base-spacing-xs)}.eui-app-sidebar-menu{display:flex;height:100%;width:100%}@media screen and (max-width: 767px){.eui-app-sidebar{z-index:var(--eui-base-z-index-sidebar)}.eui-app-sidebar-body{max-height:100%}.sidebar--close .eui-app-sidebar{box-shadow:none!important;margin-left:calc(var(--eui-app-sidebar-width-active) * -1)}.sidebar--open .eui-app-sidebar{display:initial;margin-left:0;width:75%}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app-sidebar{z-index:var(--eui-base-z-index-sidebar)}.eui-app-sidebar-body{max-height:100%}.sidebar--close .eui-app-sidebar{box-shadow:none!important;margin-left:calc(var(--eui-app-sidebar-width-active) * -1)}.sidebar--open .eui-app-sidebar{display:initial;margin-left:0;width:50%}.sidebar--hidden.sidebar--open .eui-app-sidebar{box-shadow:var(--eui-base-shadow-4);width:var(--eui-app-sidebar-width-active)}}@media screen and (min-width: 996px){.sidebar--hover .eui-app-sidebar{z-index:var(--eui-base-z-index-sidebar)}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar{width:var(--eui-app-sidebar-width-close)}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar-header{display:none}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar-footer{text-indent:-9999px}.sidebar--hidden.sidebar--close .eui-app-sidebar{margin-left:calc(var(--eui-app-sidebar-width-active) * -1)}.sidebar--hidden.sidebar--open .eui-app-sidebar{box-shadow:var(--eui-base-shadow-4);display:initial;margin-left:0;width:var(--eui-app-sidebar-width-active);z-index:var(--eui-base-z-index-sidebar)}}.eui-app-sidebar-drawer{display:none}.eui-app.sidebar--open.md .eui-app-sidebar-drawer,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer{background:var(--eui-base-color-grey-5);border-top:1px solid var(--eui-base-color-grey-15);display:flex;height:100%;position:fixed;top:100vh;transition:top .25s ease-in-out}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content{overflow-y:auto;padding:var(--eui-base-spacing-s);width:100%}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb:hover,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb:hover,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar-track,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar-track,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-app.sidebar--open.md .eui-app-sidebar-drawer--expanded,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer--expanded,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer--expanded{height:calc(100% - var(--eui-app-sidebar-header-user-profile) - var(--eui-app-top-message-height));top:var(--eui-app-sidebar-header-user-profile);position:absolute;width:100%}.eui-app.sidebar--close.md .eui-app-sidebar-drawer,.eui-app.sidebar--close.xs .eui-app-sidebar-drawer{position:fixed;top:100vh}@media screen and (max-width: 767px){.eui-app-sidebar-drawer,.eui-app-sidebar-drawer--expanded{width:75%}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app-sidebar-drawer,.eui-app-sidebar-drawer--expanded{width:50%}}\n"], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarComponent, deps: [{ token: i1.EuiAppShellService, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: EuiAppSidebarComponent, selector: "eui-app-sidebar", host: { listeners: { "body:click": "close()" }, properties: { "class": "this.string" } }, ngImport: i0, template: "<div class=\"eui-app-sidebar-content\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\" role=\"complementary\">\n    <ng-content select=\"eui-app-sidebar-header-user-profile\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-header\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-body\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-footer\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-drawer\"></ng-content>\n</div>\n", styles: [".eui-app-sidebar{background-color:var(--eui-base-color-grey-2);height:100%;left:0;position:fixed;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));width:var(--eui-app-sidebar-width);box-shadow:var(--eui-base-shadow-10)}.eui-app.ff.sidebar--close:not(.sidebar--hover) .eui-app-sidebar{width:calc(var(--eui-app-sidebar-width-close-active) + 16px)}.modal-open .eui-app-sidebar{z-index:auto}.eui-app-sidebar-content{border-right:1px solid var(--eui-base-color-grey-5);box-shadow:0 8px 10px #b7c0cebf;display:flex;flex-direction:column;height:100%;max-height:calc(100% - (var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height)));overflow:hidden;position:relative}.eui-app-sidebar-header{align-items:center;background-color:var(--eui-base-color-grey-5);border-bottom:1px solid var(--eui-base-color-grey-10);display:flex;width:100%}.eui-app-sidebar-body{display:flex;height:100%;max-height:calc(100% - (var(--eui-app-sidebar-header-height) + var(--eui-app-sidebar-footer-height)));overflow-x:hidden;overflow-y:scroll}.eui-app-sidebar-body::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-app-sidebar-body::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-app-sidebar-body::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-app-sidebar-body::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar-body{max-height:100%}.eui-app-sidebar-footer{align-items:center;display:flex;flex:0 0 auto;justify-content:center;padding:var(--eui-base-spacing-xs)}.eui-app-sidebar-menu{display:flex;height:100%;width:100%}@media screen and (max-width: 767px){.eui-app-sidebar{z-index:var(--eui-base-z-index-sidebar)}.eui-app-sidebar-body{max-height:100%}.sidebar--close .eui-app-sidebar{box-shadow:none!important;margin-left:calc(var(--eui-app-sidebar-width-active) * -1)}.sidebar--open .eui-app-sidebar{display:initial;margin-left:0;width:75%}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app-sidebar{z-index:var(--eui-base-z-index-sidebar)}.eui-app-sidebar-body{max-height:100%}.sidebar--close .eui-app-sidebar{box-shadow:none!important;margin-left:calc(var(--eui-app-sidebar-width-active) * -1)}.sidebar--open .eui-app-sidebar{display:initial;margin-left:0;width:50%}.sidebar--hidden.sidebar--open .eui-app-sidebar{box-shadow:var(--eui-base-shadow-4);width:var(--eui-app-sidebar-width-active)}}@media screen and (min-width: 996px){.sidebar--hover .eui-app-sidebar{z-index:var(--eui-base-z-index-sidebar)}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar{width:var(--eui-app-sidebar-width-close)}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar-header{display:none}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar-footer{text-indent:-9999px}.sidebar--hidden.sidebar--close .eui-app-sidebar{margin-left:calc(var(--eui-app-sidebar-width-active) * -1)}.sidebar--hidden.sidebar--open .eui-app-sidebar{box-shadow:var(--eui-base-shadow-4);display:initial;margin-left:0;width:var(--eui-app-sidebar-width-active);z-index:var(--eui-base-z-index-sidebar)}}.eui-app-sidebar-drawer{display:none}.eui-app.sidebar--open.md .eui-app-sidebar-drawer,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer{display:flex;height:100%;position:fixed;top:100vh;transition:top .25s ease-in-out}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content{background:var(--eui-base-color-grey-2);border-top:1px solid var(--eui-base-color-grey-15);height:calc(100% - var(--eui-app-sidebar-header-user-profile));overflow-y:auto;padding:var(--eui-base-spacing-s);width:100%}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb:hover,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb:hover,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar-track,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar-track,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-app.sidebar--open.md .eui-app-sidebar-drawer--expanded,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer--expanded,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer--expanded{top:var(--eui-app-sidebar-header-user-profile);position:absolute;width:100%}.eui-app.sidebar--close.md .eui-app-sidebar-drawer,.eui-app.sidebar--close.xs .eui-app-sidebar-drawer,.eui-app.sidebar--close.sm .eui-app-sidebar-drawer{position:fixed;top:100vh}@media screen and (max-width: 767px){.eui-app-sidebar-drawer,.eui-app-sidebar-drawer--expanded{width:75%}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app-sidebar-drawer,.eui-app-sidebar-drawer--expanded{width:50%}}\n"], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'eui-app-sidebar', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<div class=\"eui-app-sidebar-content\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\" role=\"complementary\">\n    <ng-content select=\"eui-app-sidebar-header-user-profile\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-header\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-body\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-footer\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-drawer\"></ng-content>\n</div>\n", styles: [".eui-app-sidebar{background-color:var(--eui-base-color-grey-2);height:100%;left:0;position:fixed;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));width:var(--eui-app-sidebar-width);box-shadow:var(--eui-base-shadow-10)}.eui-app.ff.sidebar--close:not(.sidebar--hover) .eui-app-sidebar{width:calc(var(--eui-app-sidebar-width-close-active) + 16px)}.modal-open .eui-app-sidebar{z-index:auto}.eui-app-sidebar-content{border-right:1px solid var(--eui-base-color-grey-5);box-shadow:0 8px 10px #b7c0cebf;display:flex;flex-direction:column;height:100%;max-height:calc(100% - (var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height)));overflow:hidden;position:relative}.eui-app-sidebar-header{align-items:center;background-color:var(--eui-base-color-grey-5);border-bottom:1px solid var(--eui-base-color-grey-10);display:flex;width:100%}.eui-app-sidebar-body{display:flex;height:100%;max-height:calc(100% - (var(--eui-app-sidebar-header-height) + var(--eui-app-sidebar-footer-height)));overflow-x:hidden;overflow-y:scroll}.eui-app-sidebar-body::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-app-sidebar-body::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-app-sidebar-body::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-app-sidebar-body::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar-body{max-height:100%}.eui-app-sidebar-footer{align-items:center;display:flex;flex:0 0 auto;justify-content:center;padding:var(--eui-base-spacing-xs)}.eui-app-sidebar-menu{display:flex;height:100%;width:100%}@media screen and (max-width: 767px){.eui-app-sidebar{z-index:var(--eui-base-z-index-sidebar)}.eui-app-sidebar-body{max-height:100%}.sidebar--close .eui-app-sidebar{box-shadow:none!important;margin-left:calc(var(--eui-app-sidebar-width-active) * -1)}.sidebar--open .eui-app-sidebar{display:initial;margin-left:0;width:75%}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app-sidebar{z-index:var(--eui-base-z-index-sidebar)}.eui-app-sidebar-body{max-height:100%}.sidebar--close .eui-app-sidebar{box-shadow:none!important;margin-left:calc(var(--eui-app-sidebar-width-active) * -1)}.sidebar--open .eui-app-sidebar{display:initial;margin-left:0;width:50%}.sidebar--hidden.sidebar--open .eui-app-sidebar{box-shadow:var(--eui-base-shadow-4);width:var(--eui-app-sidebar-width-active)}}@media screen and (min-width: 996px){.sidebar--hover .eui-app-sidebar{z-index:var(--eui-base-z-index-sidebar)}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar{width:var(--eui-app-sidebar-width-close)}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar-header{display:none}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar-footer{text-indent:-9999px}.sidebar--hidden.sidebar--close .eui-app-sidebar{margin-left:calc(var(--eui-app-sidebar-width-active) * -1)}.sidebar--hidden.sidebar--open .eui-app-sidebar{box-shadow:var(--eui-base-shadow-4);display:initial;margin-left:0;width:var(--eui-app-sidebar-width-active);z-index:var(--eui-base-z-index-sidebar)}}.eui-app-sidebar-drawer{display:none}.eui-app.sidebar--open.md .eui-app-sidebar-drawer,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer{background:var(--eui-base-color-grey-5);border-top:1px solid var(--eui-base-color-grey-15);display:flex;height:100%;position:fixed;top:100vh;transition:top .25s ease-in-out}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content{overflow-y:auto;padding:var(--eui-base-spacing-s);width:100%}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb:hover,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb:hover,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar-track,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar-track,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-app.sidebar--open.md .eui-app-sidebar-drawer--expanded,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer--expanded,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer--expanded{height:calc(100% - var(--eui-app-sidebar-header-user-profile) - var(--eui-app-top-message-height));top:var(--eui-app-sidebar-header-user-profile);position:absolute;width:100%}.eui-app.sidebar--close.md .eui-app-sidebar-drawer,.eui-app.sidebar--close.xs .eui-app-sidebar-drawer{position:fixed;top:100vh}@media screen and (max-width: 767px){.eui-app-sidebar-drawer,.eui-app-sidebar-drawer--expanded{width:75%}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app-sidebar-drawer,.eui-app-sidebar-drawer--expanded{width:50%}}\n"] }]
+            args: [{ selector: 'eui-app-sidebar', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<div class=\"eui-app-sidebar-content\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\" role=\"complementary\">\n    <ng-content select=\"eui-app-sidebar-header-user-profile\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-header\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-body\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-footer\"></ng-content>\n    <ng-content select=\"eui-app-sidebar-drawer\"></ng-content>\n</div>\n", styles: [".eui-app-sidebar{background-color:var(--eui-base-color-grey-2);height:100%;left:0;position:fixed;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));width:var(--eui-app-sidebar-width);box-shadow:var(--eui-base-shadow-10)}.eui-app.ff.sidebar--close:not(.sidebar--hover) .eui-app-sidebar{width:calc(var(--eui-app-sidebar-width-close-active) + 16px)}.modal-open .eui-app-sidebar{z-index:auto}.eui-app-sidebar-content{border-right:1px solid var(--eui-base-color-grey-5);box-shadow:0 8px 10px #b7c0cebf;display:flex;flex-direction:column;height:100%;max-height:calc(100% - (var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height)));overflow:hidden;position:relative}.eui-app-sidebar-header{align-items:center;background-color:var(--eui-base-color-grey-5);border-bottom:1px solid var(--eui-base-color-grey-10);display:flex;width:100%}.eui-app-sidebar-body{display:flex;height:100%;max-height:calc(100% - (var(--eui-app-sidebar-header-height) + var(--eui-app-sidebar-footer-height)));overflow-x:hidden;overflow-y:scroll}.eui-app-sidebar-body::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-app-sidebar-body::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-app-sidebar-body::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-app-sidebar-body::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar-body{max-height:100%}.eui-app-sidebar-footer{align-items:center;display:flex;flex:0 0 auto;justify-content:center;padding:var(--eui-base-spacing-xs)}.eui-app-sidebar-menu{display:flex;height:100%;width:100%}@media screen and (max-width: 767px){.eui-app-sidebar{z-index:var(--eui-base-z-index-sidebar)}.eui-app-sidebar-body{max-height:100%}.sidebar--close .eui-app-sidebar{box-shadow:none!important;margin-left:calc(var(--eui-app-sidebar-width-active) * -1)}.sidebar--open .eui-app-sidebar{display:initial;margin-left:0;width:75%}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app-sidebar{z-index:var(--eui-base-z-index-sidebar)}.eui-app-sidebar-body{max-height:100%}.sidebar--close .eui-app-sidebar{box-shadow:none!important;margin-left:calc(var(--eui-app-sidebar-width-active) * -1)}.sidebar--open .eui-app-sidebar{display:initial;margin-left:0;width:50%}.sidebar--hidden.sidebar--open .eui-app-sidebar{box-shadow:var(--eui-base-shadow-4);width:var(--eui-app-sidebar-width-active)}}@media screen and (min-width: 996px){.sidebar--hover .eui-app-sidebar{z-index:var(--eui-base-z-index-sidebar)}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar{width:var(--eui-app-sidebar-width-close)}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar-header{display:none}.sidebar--close:not(.sidebar--hover) .eui-app-sidebar-footer{text-indent:-9999px}.sidebar--hidden.sidebar--close .eui-app-sidebar{margin-left:calc(var(--eui-app-sidebar-width-active) * -1)}.sidebar--hidden.sidebar--open .eui-app-sidebar{box-shadow:var(--eui-base-shadow-4);display:initial;margin-left:0;width:var(--eui-app-sidebar-width-active);z-index:var(--eui-base-z-index-sidebar)}}.eui-app-sidebar-drawer{display:none}.eui-app.sidebar--open.md .eui-app-sidebar-drawer,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer{display:flex;height:100%;position:fixed;top:100vh;transition:top .25s ease-in-out}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content{background:var(--eui-base-color-grey-2);border-top:1px solid var(--eui-base-color-grey-15);height:calc(100% - var(--eui-app-sidebar-header-user-profile));overflow-y:auto;padding:var(--eui-base-spacing-s);width:100%}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar{display:inherit;height:8px;width:8px;background-color:var(--eui-base-color-grey-5)}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb:hover,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb:hover,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-50)}.eui-app.sidebar--open.md .eui-app-sidebar-drawer-content::-webkit-scrollbar-track,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer-content::-webkit-scrollbar-track,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-5);border-radius:0}.eui-app.sidebar--open.md .eui-app-sidebar-drawer--expanded,.eui-app.sidebar--open.xs .eui-app-sidebar-drawer--expanded,.eui-app.sidebar--open.sm .eui-app-sidebar-drawer--expanded{top:var(--eui-app-sidebar-header-user-profile);position:absolute;width:100%}.eui-app.sidebar--close.md .eui-app-sidebar-drawer,.eui-app.sidebar--close.xs .eui-app-sidebar-drawer,.eui-app.sidebar--close.sm .eui-app-sidebar-drawer{position:fixed;top:100vh}@media screen and (max-width: 767px){.eui-app-sidebar-drawer,.eui-app-sidebar-drawer--expanded{width:75%}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app-sidebar-drawer,.eui-app-sidebar-drawer--expanded{width:50%}}\n"] }]
         }], ctorParameters: () => [{ type: i1.EuiAppShellService, decorators: [{
                     type: Optional
                 }] }], propDecorators: { string: [{

package/esm2022/layout/eui-app/eui-app-sidebar/sidebar.module.mjs CHANGED Viewed

@@ -24,8 +24,8 @@ const COMPONENTS = [
     EuiAppSidebarDrawerComponent,
 ];
 export class EuiAppSidebarModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarModule, declarations: [EuiAppSidebarComponent,
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarModule, declarations: [EuiAppSidebarComponent,
             EuiAppSidebarHeaderComponent,
             EuiAppSidebarBodyComponent,
             EuiAppSidebarFooterComponent,
@@ -44,7 +44,7 @@ export class EuiAppSidebarModule {
             EuiAppSidebarMenuComponent,
             EuiAppSidebarHeaderUserProfileComponent,
             EuiAppSidebarDrawerComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarModule, imports: [CommonModule,
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarModule, imports: [CommonModule,
             RouterModule,
             EuiMenuModule,
             EuiButtonModule,
@@ -52,7 +52,7 @@ export class EuiAppSidebarModule {
             EuiCoerceBooleanPipeModule,
             EuiUserProfileModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppSidebarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppSidebarModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/esm2022/layout/eui-app/eui-app-toolbar/toolbar.component.mjs CHANGED Viewed

@@ -29,10 +29,10 @@ export class EuiAppToolbarComponent {
         });
         document.documentElement.style.removeProperty('--eui-app-toolbar-height');
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppToolbarComponent, deps: [{ token: i1.EuiAppShellService }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.2", type: EuiAppToolbarComponent, selector: "eui-app-toolbar", inputs: { hasLanguageSelector: "hasLanguageSelector" }, host: { properties: { "class": "this.string", "attr.role": "this.role" } }, ngImport: i0, template: "<!--Only render the toggle if there is a rendered sidebar in the DOM, otherwise it doesn't make sense. -->\n<eui-sidebar-toggle *ngIf=\"asService.getState('hasSidebar') | async\" class=\"eui-app-toolbar__sidebar-toggle\"> </eui-sidebar-toggle>\n\n<ng-content></ng-content>\n\n<ng-container\n    *ngIf=\"\n        !(asService.getState('hasHeader') | async | coerceBool) ||\n        ((asService.getState('hasHeader') | async) && (asService.breakpoints$ | async).isMobile)\n    \">\n    <ng-container *ngIf=\"hasLanguageSelector\">\n        <eui-language-selector styleClass=\"eui-app-toolbar__language-selector\"> </eui-language-selector>\n    </ng-container>\n</ng-container>\n", styles: [".eui-app-toolbar{align-items:center;background:var(--eui-base-color-primary-100);color:var(--eui-base-color-white);width:100%;height:var(--eui-app-toolbar-height);display:flex;position:fixed;right:0;left:0;top:calc(var(--eui-app-header-height) + var(--eui-app-top-message-height));transition:top .1s ease,left .1s ease-in,width .1s ease-in;z-index:var(--eui-base-z-index-nav)}.eui-app-toolbar__sidebar-toggle{padding-left:var(--eui-base-spacing-s);padding-right:var(--eui-base-spacing-xs)}.eui-app-toolbar__language-selector{margin-left:auto}.eui-app-toolbar__language-selector .eui-language-selector-link__icon{color:var(--eui-base-color-white);font-size:var(--eui-base-icon-size-l)}.eui-app-toolbar__language-selector .eui-language-selector-link__language-code{color:var(--eui-base-color-primary-100)}.modal-open .eui-app-toolbar{z-index:auto}.eui-t-ec .eui-app-toolbar__sidebar-toggle{padding-top:calc(var(--eui-base-spacing-m) + 2px)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.EuiSidebarToggleComponent, selector: "eui-sidebar-toggle", inputs: ["e2eAttr", "iconSvgFillColor"] }, { kind: "component", type: i4.EuiLanguageSelectorComponent, selector: "eui-language-selector", inputs: ["hasLanguageSelection"], outputs: ["languageSelectorClick"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.EuiCoerceBooleanPipe, name: "coerceBool" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppToolbarComponent, deps: [{ token: i1.EuiAppShellService }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.3", type: EuiAppToolbarComponent, selector: "eui-app-toolbar", inputs: { hasLanguageSelector: "hasLanguageSelector" }, host: { properties: { "class": "this.string", "attr.role": "this.role" } }, ngImport: i0, template: "<!--Only render the toggle if there is a rendered sidebar in the DOM, otherwise it doesn't make sense. -->\n<eui-sidebar-toggle *ngIf=\"asService.getState('hasSidebar') | async\" class=\"eui-app-toolbar__sidebar-toggle\"> </eui-sidebar-toggle>\n\n<ng-content></ng-content>\n\n<ng-container\n    *ngIf=\"\n        !(asService.getState('hasHeader') | async | coerceBool) ||\n        ((asService.getState('hasHeader') | async) && (asService.breakpoints$ | async).isMobile)\n    \">\n    <ng-container *ngIf=\"hasLanguageSelector\">\n        <eui-language-selector styleClass=\"eui-app-toolbar__language-selector\"> </eui-language-selector>\n    </ng-container>\n</ng-container>\n", styles: [".eui-app-toolbar{align-items:center;background:var(--eui-base-color-primary-100);color:var(--eui-base-color-white);width:100%;height:var(--eui-app-toolbar-height);display:flex;position:fixed;right:0;left:0;top:calc(var(--eui-app-header-height) + var(--eui-app-top-message-height));transition:top .1s ease,left .1s ease-in,width .1s ease-in;z-index:var(--eui-base-z-index-nav)}.eui-app-toolbar__sidebar-toggle{padding-left:var(--eui-base-spacing-s);padding-right:var(--eui-base-spacing-xs)}.eui-app-toolbar__language-selector{margin-left:auto}.eui-app-toolbar__language-selector .eui-language-selector-link__icon{color:var(--eui-base-color-white);font-size:var(--eui-base-icon-size-l)}.eui-app-toolbar__language-selector .eui-language-selector-link__language-code{color:var(--eui-base-color-primary-100)}.modal-open .eui-app-toolbar{z-index:auto}.eui-t-ec .eui-app-toolbar__sidebar-toggle{padding-top:calc(var(--eui-base-spacing-m) + 2px)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.EuiSidebarToggleComponent, selector: "eui-sidebar-toggle", inputs: ["e2eAttr", "iconSvgFillColor"] }, { kind: "component", type: i4.EuiLanguageSelectorComponent, selector: "eui-language-selector", inputs: ["hasLanguageSelection"], outputs: ["languageSelectorClick"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.EuiCoerceBooleanPipe, name: "coerceBool" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppToolbarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppToolbarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-app-toolbar', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<!--Only render the toggle if there is a rendered sidebar in the DOM, otherwise it doesn't make sense. -->\n<eui-sidebar-toggle *ngIf=\"asService.getState('hasSidebar') | async\" class=\"eui-app-toolbar__sidebar-toggle\"> </eui-sidebar-toggle>\n\n<ng-content></ng-content>\n\n<ng-container\n    *ngIf=\"\n        !(asService.getState('hasHeader') | async | coerceBool) ||\n        ((asService.getState('hasHeader') | async) && (asService.breakpoints$ | async).isMobile)\n    \">\n    <ng-container *ngIf=\"hasLanguageSelector\">\n        <eui-language-selector styleClass=\"eui-app-toolbar__language-selector\"> </eui-language-selector>\n    </ng-container>\n</ng-container>\n", styles: [".eui-app-toolbar{align-items:center;background:var(--eui-base-color-primary-100);color:var(--eui-base-color-white);width:100%;height:var(--eui-app-toolbar-height);display:flex;position:fixed;right:0;left:0;top:calc(var(--eui-app-header-height) + var(--eui-app-top-message-height));transition:top .1s ease,left .1s ease-in,width .1s ease-in;z-index:var(--eui-base-z-index-nav)}.eui-app-toolbar__sidebar-toggle{padding-left:var(--eui-base-spacing-s);padding-right:var(--eui-base-spacing-xs)}.eui-app-toolbar__language-selector{margin-left:auto}.eui-app-toolbar__language-selector .eui-language-selector-link__icon{color:var(--eui-base-color-white);font-size:var(--eui-base-icon-size-l)}.eui-app-toolbar__language-selector .eui-language-selector-link__language-code{color:var(--eui-base-color-primary-100)}.modal-open .eui-app-toolbar{z-index:auto}.eui-t-ec .eui-app-toolbar__sidebar-toggle{padding-top:calc(var(--eui-base-spacing-m) + 2px)}\n"] }]
         }], ctorParameters: () => [{ type: i1.EuiAppShellService }], propDecorators: { string: [{

package/esm2022/layout/eui-app/eui-app-toolbar/toolbar.module.mjs CHANGED Viewed

@@ -8,11 +8,11 @@ import { EuiAppToolbarComponent } from './toolbar.component';
 import * as i0 from "@angular/core";
 const COMPONENTS = [EuiAppToolbarComponent];
 export class EuiAppToolbarModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppToolbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppToolbarModule, declarations: [EuiAppToolbarComponent], imports: [CommonModule, EuiSidebarToggleModule, EuiLanguageSelectorModule, EuiToolbarModule, EuiCoerceBooleanPipeModule], exports: [EuiAppToolbarComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppToolbarModule, imports: [CommonModule, EuiSidebarToggleModule, EuiLanguageSelectorModule, EuiToolbarModule, EuiCoerceBooleanPipeModule] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppToolbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppToolbarModule, declarations: [EuiAppToolbarComponent], imports: [CommonModule, EuiSidebarToggleModule, EuiLanguageSelectorModule, EuiToolbarModule, EuiCoerceBooleanPipeModule], exports: [EuiAppToolbarComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppToolbarModule, imports: [CommonModule, EuiSidebarToggleModule, EuiLanguageSelectorModule, EuiToolbarModule, EuiCoerceBooleanPipeModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppToolbarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppToolbarModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, EuiSidebarToggleModule, EuiLanguageSelectorModule, EuiToolbarModule, EuiCoerceBooleanPipeModule],

package/esm2022/layout/eui-app/eui-app-top-message/top-message.component.mjs CHANGED Viewed

@@ -60,10 +60,10 @@ export class EuiAppTopMessageComponent extends BaseDirective {
         this.cd.reattach();
         this.cd.detectChanges();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppTopMessageComponent, deps: [{ token: i1.EuiAppShellService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i2.ContentObserver }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.2", type: EuiAppTopMessageComponent, selector: "eui-app-top-message", inputs: { isCloseable: ["isCloseable", "isCloseable", booleanAttribute], hasCustomContent: ["hasCustomContent", "hasCustomContent", booleanAttribute], isVisible: "isVisible" }, outputs: { topMessageClose: "topMessageClose" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, viewQueries: [{ propertyName: "appTopMessage", first: true, predicate: ["appTopMessage"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"eui-app-top-message__wrapper\" #appTopMessage>\n    <div class=\"eui-app-top-message__content\">\n        <ng-content></ng-content>\n    </div>\n    <eui-icon-svg-button\n        *ngIf=\"isCloseable\"\n        iconSvgName=\"eui-close\"\n        hasFocusBorder\n        (click)=\"onCloseClick()\"\n        ariaLabel=\"Close top message\"\n        class=\"eui-u-ml-auto\">\n    </eui-icon-svg-button>\n</div>\n", styles: [".eui-app-top-message{padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-s);position:fixed;width:100%;right:0;top:0;z-index:var(--eui-base-z-index-top-message);background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-danger-100-contrast)}.eui-app-top-message .eui-icon-svg svg{color:var(--eui-base-color-danger-100-contrast);fill:var(--eui-base-color-danger-100-contrast)}.eui-app-top-message__wrapper{display:flex;flex-direction:row;align-items:center;width:100%}.eui-app-top-message__content{display:flex;flex-direction:column;width:100%}.eui-app-top-message--primary{background-color:var(--eui-base-color-primary-100);border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100-contrast)}.eui-app-top-message--primary .eui-icon-svg svg{color:var(--eui-base-color-primary-100-contrast);fill:var(--eui-base-color-primary-100-contrast)}.eui-app-top-message--info{background-color:var(--eui-base-color-info-100);border-color:var(--eui-base-color-info-100);color:var(--eui-base-color-info-100-contrast)}.eui-app-top-message--info .eui-icon-svg svg{color:var(--eui-base-color-info-100-contrast);fill:var(--eui-base-color-info-100-contrast)}.eui-app-top-message--success{background-color:var(--eui-base-color-success-100);border-color:var(--eui-base-color-success-100);color:var(--eui-base-color-success-100-contrast)}.eui-app-top-message--success .eui-icon-svg svg{color:var(--eui-base-color-success-100-contrast);fill:var(--eui-base-color-success-100-contrast)}.eui-app-top-message--warning{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-warning-100-contrast)}.eui-app-top-message--warning .eui-icon-svg svg{color:var(--eui-base-color-warning-100-contrast);fill:var(--eui-base-color-warning-100-contrast)}.eui-app-top-message--danger{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-danger-100-contrast)}.eui-app-top-message--danger .eui-icon-svg svg{color:var(--eui-base-color-danger-100-contrast);fill:var(--eui-base-color-danger-100-contrast)}.eui-app-top-message--hidden{display:none}.eui-app-top-message--custom{padding:0}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.EuiIconSvgButtonComponent, selector: "eui-icon-svg-button", inputs: ["iconSvgName", "iconSvgFillColor", "iconSvgSize", "ariaLabel", "hasFocusBorder", "hasNoPadding"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppTopMessageComponent, deps: [{ token: i1.EuiAppShellService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i2.ContentObserver }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.3", type: EuiAppTopMessageComponent, selector: "eui-app-top-message", inputs: { isCloseable: ["isCloseable", "isCloseable", booleanAttribute], hasCustomContent: ["hasCustomContent", "hasCustomContent", booleanAttribute], isVisible: "isVisible" }, outputs: { topMessageClose: "topMessageClose" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role" } }, viewQueries: [{ propertyName: "appTopMessage", first: true, predicate: ["appTopMessage"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"eui-app-top-message__wrapper\" #appTopMessage>\n    <div class=\"eui-app-top-message__content\">\n        <ng-content></ng-content>\n    </div>\n    <eui-icon-svg-button\n        *ngIf=\"isCloseable\"\n        iconSvgName=\"eui-close\"\n        hasFocusBorder\n        (click)=\"onCloseClick()\"\n        ariaLabel=\"Close top message\"\n        class=\"eui-u-ml-auto\">\n    </eui-icon-svg-button>\n</div>\n", styles: [".eui-app-top-message{padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-s);position:fixed;width:100%;right:0;top:0;z-index:var(--eui-base-z-index-top-message);background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-danger-100-contrast)}.eui-app-top-message .eui-icon-svg svg{color:var(--eui-base-color-danger-100-contrast);fill:var(--eui-base-color-danger-100-contrast)}.eui-app-top-message__wrapper{display:flex;flex-direction:row;align-items:center;width:100%}.eui-app-top-message__content{display:flex;flex-direction:column;width:100%}.eui-app-top-message--primary{background-color:var(--eui-base-color-primary-100);border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100-contrast)}.eui-app-top-message--primary .eui-icon-svg svg{color:var(--eui-base-color-primary-100-contrast);fill:var(--eui-base-color-primary-100-contrast)}.eui-app-top-message--info{background-color:var(--eui-base-color-info-100);border-color:var(--eui-base-color-info-100);color:var(--eui-base-color-info-100-contrast)}.eui-app-top-message--info .eui-icon-svg svg{color:var(--eui-base-color-info-100-contrast);fill:var(--eui-base-color-info-100-contrast)}.eui-app-top-message--success{background-color:var(--eui-base-color-success-100);border-color:var(--eui-base-color-success-100);color:var(--eui-base-color-success-100-contrast)}.eui-app-top-message--success .eui-icon-svg svg{color:var(--eui-base-color-success-100-contrast);fill:var(--eui-base-color-success-100-contrast)}.eui-app-top-message--warning{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-warning-100-contrast)}.eui-app-top-message--warning .eui-icon-svg svg{color:var(--eui-base-color-warning-100-contrast);fill:var(--eui-base-color-warning-100-contrast)}.eui-app-top-message--danger{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-danger-100-contrast)}.eui-app-top-message--danger .eui-icon-svg svg{color:var(--eui-base-color-danger-100-contrast);fill:var(--eui-base-color-danger-100-contrast)}.eui-app-top-message--hidden{display:none}.eui-app-top-message--custom{padding:0}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.EuiIconSvgButtonComponent, selector: "eui-icon-svg-button", inputs: ["iconSvgName", "iconSvgFillColor", "iconSvgSize", "ariaLabel", "hasFocusBorder", "hasNoPadding"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppTopMessageComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppTopMessageComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-app-top-message', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<div class=\"eui-app-top-message__wrapper\" #appTopMessage>\n    <div class=\"eui-app-top-message__content\">\n        <ng-content></ng-content>\n    </div>\n    <eui-icon-svg-button\n        *ngIf=\"isCloseable\"\n        iconSvgName=\"eui-close\"\n        hasFocusBorder\n        (click)=\"onCloseClick()\"\n        ariaLabel=\"Close top message\"\n        class=\"eui-u-ml-auto\">\n    </eui-icon-svg-button>\n</div>\n", styles: [".eui-app-top-message{padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-s);position:fixed;width:100%;right:0;top:0;z-index:var(--eui-base-z-index-top-message);background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-danger-100-contrast)}.eui-app-top-message .eui-icon-svg svg{color:var(--eui-base-color-danger-100-contrast);fill:var(--eui-base-color-danger-100-contrast)}.eui-app-top-message__wrapper{display:flex;flex-direction:row;align-items:center;width:100%}.eui-app-top-message__content{display:flex;flex-direction:column;width:100%}.eui-app-top-message--primary{background-color:var(--eui-base-color-primary-100);border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100-contrast)}.eui-app-top-message--primary .eui-icon-svg svg{color:var(--eui-base-color-primary-100-contrast);fill:var(--eui-base-color-primary-100-contrast)}.eui-app-top-message--info{background-color:var(--eui-base-color-info-100);border-color:var(--eui-base-color-info-100);color:var(--eui-base-color-info-100-contrast)}.eui-app-top-message--info .eui-icon-svg svg{color:var(--eui-base-color-info-100-contrast);fill:var(--eui-base-color-info-100-contrast)}.eui-app-top-message--success{background-color:var(--eui-base-color-success-100);border-color:var(--eui-base-color-success-100);color:var(--eui-base-color-success-100-contrast)}.eui-app-top-message--success .eui-icon-svg svg{color:var(--eui-base-color-success-100-contrast);fill:var(--eui-base-color-success-100-contrast)}.eui-app-top-message--warning{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-warning-100-contrast)}.eui-app-top-message--warning .eui-icon-svg svg{color:var(--eui-base-color-warning-100-contrast);fill:var(--eui-base-color-warning-100-contrast)}.eui-app-top-message--danger{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-danger-100-contrast)}.eui-app-top-message--danger .eui-icon-svg svg{color:var(--eui-base-color-danger-100-contrast);fill:var(--eui-base-color-danger-100-contrast)}.eui-app-top-message--hidden{display:none}.eui-app-top-message--custom{padding:0}\n"] }]
         }], ctorParameters: () => [{ type: i1.EuiAppShellService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i2.ContentObserver }], propDecorators: { cssClasses: [{

package/esm2022/layout/eui-app/eui-app-top-message/top-message.module.mjs CHANGED Viewed

@@ -4,11 +4,11 @@ import { EuiAppTopMessageComponent } from './top-message.component';
 import { EuiIconModule } from '@eui/components/eui-icon';
 import * as i0 from "@angular/core";
 export class EuiAppTopMessageModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppTopMessageModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppTopMessageModule, declarations: [EuiAppTopMessageComponent], imports: [CommonModule, EuiIconModule], exports: [EuiAppTopMessageComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppTopMessageModule, imports: [CommonModule, EuiIconModule] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppTopMessageModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppTopMessageModule, declarations: [EuiAppTopMessageComponent], imports: [CommonModule, EuiIconModule], exports: [EuiAppTopMessageComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppTopMessageModule, imports: [CommonModule, EuiIconModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppTopMessageModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppTopMessageModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, EuiIconModule],

package/esm2022/layout/eui-app/eui-app.component.mjs CHANGED Viewed

@@ -103,10 +103,10 @@ export class EuiAppComponent {
         this.destroy$.next(true);
         this.destroy$.unsubscribe();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppComponent, deps: [{ token: i1.EuiAppShellService }, { token: i1.EuiGrowlService }, { token: i2.DeviceDetectorService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.2", type: EuiAppComponent, selector: "eui-app", inputs: { appSubTitle: "appSubTitle", themeClass: "themeClass", isSidebarOpen: ["isSidebarOpen", "isSidebarOpen", booleanAttribute], isSidebarExpandOnHover: ["isSidebarExpandOnHover", "isSidebarExpandOnHover", booleanAttribute], isShrinkHeaderActive: ["isShrinkHeaderActive", "isShrinkHeaderActive", booleanAttribute], isSidebarHidden: ["isSidebarHidden", "isSidebarHidden", booleanAttribute] }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "appSidebar", first: true, predicate: i0.forwardRef(() => EuiAppSidebarComponent), descendants: true }, { propertyName: "customPageWrapper", first: true, predicate: i0.forwardRef(() => EuiAppPageWrapperDirective), descendants: true }, { propertyName: "appToolbar", first: true, predicate: i0.forwardRef(() => EuiAppToolbarComponent), descendants: true }], usesOnChanges: true, ngImport: i0, template: "<eui-dimmer [isDimmerActive]=\"(asService.state$ | async).isDimmerActive\"></eui-dimmer>\n\n<ng-content select=\"eui-app-sidebar\"></ng-content>\n<ng-container *ngIf=\"!appSidebar && (asService.state$ | async).menuLinks.length !== 0 && (asService.state$ | async).hasHeader && (asService.breakpoints$ | async).isMobile\">\n    <eui-app-sidebar>\n        <eui-app-sidebar-body>\n            <eui-app-sidebar-menu [items]=\"(asService.state$ | async).menuLinks\" [hasIcons]=\"true\"></eui-app-sidebar-menu>\n        </eui-app-sidebar-body>\n    </eui-app-sidebar>\n</ng-container>\n\n<div class=\"eui-app-main\">\n    <ng-content select=\"eui-app-top-message\"></ng-content>\n\n    <ng-content select=\"eui-app-header\"></ng-content>\n\n    <ng-container\n        *ngIf=\"!appToolbar && (asService.state$ | async).hasHeader && (asService.breakpoints$ | async).isMobile; else elseBlockToolbar\">\n        <eui-app-toolbar>\n            <eui-toolbar></eui-toolbar>\n        </eui-app-toolbar>\n    </ng-container>\n\n    <ng-template #elseBlockToolbar>\n        <ng-content select=\"eui-app-toolbar\"></ng-content>\n    </ng-template>\n\n    <ng-content select=\"eui-app-breadcrumb\"></ng-content>\n\n    <div class=\"eui-app-main-content\" role=\"main\">\n        <ng-content select=\"eui-app-page-wrapper\"></ng-content>\n        <!-- TODO: consider removing code below in the future by transferring responsibility of providing <router-outlet> to the developer -->\n        <ng-container *ngIf=\"hasNoPageWrapper\">\n            <router-outlet></router-outlet>\n        </ng-container>\n    </div>\n\n    <ng-content select=\"eui-app-footer\"></ng-content>\n</div>\n\n<eui-growl\n    [value]=\"euiGrowlService.growlMessages\"\n    [sticky]=\"euiGrowlService.isGrowlSticky\"\n    [closeAllSticky]=\"euiGrowlService.isCloseAllSticky\"\n    [life]=\"euiGrowlService.growlLife\"\n    [position]=\"euiGrowlService.growlPosition\"\n    (clicked)=\"euiGrowlService.growlCallback ? euiGrowlService.growlCallback(): null\"></eui-growl>\n\n<eui-block-document [isBlocked]=\"(asService.state$ | async).isBlockDocumentActive\"></eui-block-document>\n", styles: [".eui-app{display:flex;overflow:hidden}@media screen and (max-width: 767px){.eui-app.sidebar--open:before{background:#0000004d;bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));transition:all .1s ease;width:100vw;z-index:980}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app.sidebar--open:before{background:#0000004d;bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));transition:all .1s ease;width:100vw;z-index:980}}@media screen and (min-width: 996px){.sidebar--hidden.eui-app.sidebar--open:before{background:#0000004d;bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));transition:all .1s ease;width:100vw;z-index:980}}.eui-app-main{min-height:100vh;background:var(--eui-base-color-grey-2);width:calc(100% - var(--eui-app-sidebar-width));margin-left:var(--eui-app-sidebar-width);display:flex;flex-direction:column}@media screen and (max-width: 767px){.eui-app-main{margin-left:0;width:100%}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app-main{margin-left:0;width:100%}}@media screen and (min-width: 996px){.sidebar--close .eui-app-main{margin-left:var(--eui-app-sidebar-width-close);width:calc(100% - var(--eui-app-sidebar-width-close))}.sidebar--hidden.sidebar--close .eui-app-main,.sidebar--hidden.sidebar--open .eui-app-main{margin-left:0;width:100%}}.eui-app-main-content{flex-grow:1;margin-top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height) - var(--eui-app-breadcrumb-height));position:relative}eui-app-page-wrapper{display:flex;width:100%}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: i5.EuiAppToolbarComponent, selector: "eui-app-toolbar", inputs: ["hasLanguageSelector"] }, { kind: "component", type: i6.EuiToolbarComponent, selector: "eui-toolbar" }, { kind: "component", type: i7.EuiAppSidebarComponent, selector: "eui-app-sidebar" }, { kind: "component", type: i8.EuiAppSidebarBodyComponent, selector: "eui-app-sidebar-body" }, { kind: "component", type: i9.EuiAppSidebarMenuComponent, selector: "eui-app-sidebar-menu", inputs: ["hasFilter", "hasIcons", "hasTooltip", "expandAllItems", "isCollapsed", "hasCollapsedInitials", "isFlat", "hasScrollToItem", "hasLowercaseItems", "items"], outputs: ["sidebarItemClick"] }, { kind: "component", type: i10.EuiBlockDocumentComponent, selector: "eui-block-document", inputs: ["isBlocked", "ariaLabel"] }, { kind: "component", type: i11.EuiGrowlComponent, selector: "eui-growl", inputs: ["sticky", "life", "value", "style", "styleClass", "position", "e2eAttr", "closeAllSticky"], outputs: ["growlClick"] }, { kind: "component", type: i12.EuiDimmerComponent, selector: "eui-dimmer", inputs: ["isDimmerActive", "e2eAttr"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppComponent, deps: [{ token: i1.EuiAppShellService }, { token: i1.EuiGrowlService }, { token: i2.DeviceDetectorService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.3", type: EuiAppComponent, selector: "eui-app", inputs: { appSubTitle: "appSubTitle", themeClass: "themeClass", isSidebarOpen: ["isSidebarOpen", "isSidebarOpen", booleanAttribute], isSidebarExpandOnHover: ["isSidebarExpandOnHover", "isSidebarExpandOnHover", booleanAttribute], isShrinkHeaderActive: ["isShrinkHeaderActive", "isShrinkHeaderActive", booleanAttribute], isSidebarHidden: ["isSidebarHidden", "isSidebarHidden", booleanAttribute] }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "appSidebar", first: true, predicate: i0.forwardRef(() => EuiAppSidebarComponent), descendants: true }, { propertyName: "customPageWrapper", first: true, predicate: i0.forwardRef(() => EuiAppPageWrapperDirective), descendants: true }, { propertyName: "appToolbar", first: true, predicate: i0.forwardRef(() => EuiAppToolbarComponent), descendants: true }], usesOnChanges: true, ngImport: i0, template: "<eui-dimmer [isDimmerActive]=\"(asService.state$ | async).isDimmerActive\"></eui-dimmer>\n\n<ng-content select=\"eui-app-sidebar\"></ng-content>\n<ng-container *ngIf=\"!appSidebar && (asService.state$ | async).menuLinks.length !== 0 && (asService.state$ | async).hasHeader && (asService.breakpoints$ | async).isMobile\">\n    <eui-app-sidebar>\n        <eui-app-sidebar-body>\n            <eui-app-sidebar-menu [items]=\"(asService.state$ | async).menuLinks\" [hasIcons]=\"true\"></eui-app-sidebar-menu>\n        </eui-app-sidebar-body>\n    </eui-app-sidebar>\n</ng-container>\n\n<div class=\"eui-app-main\">\n    <ng-content select=\"eui-app-top-message\"></ng-content>\n\n    <ng-content select=\"eui-app-header\"></ng-content>\n\n    <ng-container\n        *ngIf=\"!appToolbar && (asService.state$ | async).hasHeader && (asService.breakpoints$ | async).isMobile; else elseBlockToolbar\">\n        <eui-app-toolbar>\n            <eui-toolbar></eui-toolbar>\n        </eui-app-toolbar>\n    </ng-container>\n\n    <ng-template #elseBlockToolbar>\n        <ng-content select=\"eui-app-toolbar\"></ng-content>\n    </ng-template>\n\n    <ng-content select=\"eui-app-breadcrumb\"></ng-content>\n\n    <div class=\"eui-app-main-content\" role=\"main\">\n        <ng-content select=\"eui-app-page-wrapper\"></ng-content>\n        <!-- TODO: consider removing code below in the future by transferring responsibility of providing <router-outlet> to the developer -->\n        <ng-container *ngIf=\"hasNoPageWrapper\">\n            <router-outlet></router-outlet>\n        </ng-container>\n    </div>\n\n    <ng-content select=\"eui-app-footer\"></ng-content>\n</div>\n\n<eui-growl\n    [value]=\"euiGrowlService.growlMessages\"\n    [sticky]=\"euiGrowlService.isGrowlSticky\"\n    [closeAllSticky]=\"euiGrowlService.isCloseAllSticky\"\n    [life]=\"euiGrowlService.growlLife\"\n    [position]=\"euiGrowlService.growlPosition\"\n    (clicked)=\"euiGrowlService.growlCallback ? euiGrowlService.growlCallback(): null\"></eui-growl>\n\n<eui-block-document [isBlocked]=\"(asService.state$ | async).isBlockDocumentActive\"></eui-block-document>\n", styles: [".eui-app{display:flex;overflow:hidden}@media screen and (max-width: 767px){.eui-app.sidebar--open:before{background:#0000004d;bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));transition:all .1s ease;width:100vw;z-index:980}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app.sidebar--open:before{background:#0000004d;bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));transition:all .1s ease;width:100vw;z-index:980}}@media screen and (min-width: 996px){.sidebar--hidden.eui-app.sidebar--open:before{background:#0000004d;bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));transition:all .1s ease;width:100vw;z-index:980}}.eui-app-main{min-height:100vh;background:var(--eui-base-color-grey-2);width:calc(100% - var(--eui-app-sidebar-width));margin-left:var(--eui-app-sidebar-width);display:flex;flex-direction:column}@media screen and (max-width: 767px){.eui-app-main{margin-left:0;width:100%}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app-main{margin-left:0;width:100%}}@media screen and (min-width: 996px){.sidebar--close .eui-app-main{margin-left:var(--eui-app-sidebar-width-close);width:calc(100% - var(--eui-app-sidebar-width-close))}.sidebar--hidden.sidebar--close .eui-app-main,.sidebar--hidden.sidebar--open .eui-app-main{margin-left:0;width:100%}}.eui-app-main-content{flex-grow:1;margin-top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height) - var(--eui-app-breadcrumb-height));position:relative}eui-app-page-wrapper{display:flex;width:100%}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: i5.EuiAppToolbarComponent, selector: "eui-app-toolbar", inputs: ["hasLanguageSelector"] }, { kind: "component", type: i6.EuiToolbarComponent, selector: "eui-toolbar" }, { kind: "component", type: i7.EuiAppSidebarComponent, selector: "eui-app-sidebar" }, { kind: "component", type: i8.EuiAppSidebarBodyComponent, selector: "eui-app-sidebar-body" }, { kind: "component", type: i9.EuiAppSidebarMenuComponent, selector: "eui-app-sidebar-menu", inputs: ["hasFilter", "hasIcons", "hasTooltip", "expandAllItems", "isCollapsed", "hasCollapsedInitials", "isFlat", "hasScrollToItem", "hasLowercaseItems", "items"], outputs: ["sidebarItemClick"] }, { kind: "component", type: i10.EuiBlockDocumentComponent, selector: "eui-block-document", inputs: ["isBlocked", "ariaLabel"] }, { kind: "component", type: i11.EuiGrowlComponent, selector: "eui-growl", inputs: ["sticky", "life", "value", "style", "styleClass", "position", "e2eAttr", "closeAllSticky"], outputs: ["growlClick"] }, { kind: "component", type: i12.EuiDimmerComponent, selector: "eui-dimmer", inputs: ["isDimmerActive", "e2eAttr"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-app', encapsulation: ViewEncapsulation.None, template: "<eui-dimmer [isDimmerActive]=\"(asService.state$ | async).isDimmerActive\"></eui-dimmer>\n\n<ng-content select=\"eui-app-sidebar\"></ng-content>\n<ng-container *ngIf=\"!appSidebar && (asService.state$ | async).menuLinks.length !== 0 && (asService.state$ | async).hasHeader && (asService.breakpoints$ | async).isMobile\">\n    <eui-app-sidebar>\n        <eui-app-sidebar-body>\n            <eui-app-sidebar-menu [items]=\"(asService.state$ | async).menuLinks\" [hasIcons]=\"true\"></eui-app-sidebar-menu>\n        </eui-app-sidebar-body>\n    </eui-app-sidebar>\n</ng-container>\n\n<div class=\"eui-app-main\">\n    <ng-content select=\"eui-app-top-message\"></ng-content>\n\n    <ng-content select=\"eui-app-header\"></ng-content>\n\n    <ng-container\n        *ngIf=\"!appToolbar && (asService.state$ | async).hasHeader && (asService.breakpoints$ | async).isMobile; else elseBlockToolbar\">\n        <eui-app-toolbar>\n            <eui-toolbar></eui-toolbar>\n        </eui-app-toolbar>\n    </ng-container>\n\n    <ng-template #elseBlockToolbar>\n        <ng-content select=\"eui-app-toolbar\"></ng-content>\n    </ng-template>\n\n    <ng-content select=\"eui-app-breadcrumb\"></ng-content>\n\n    <div class=\"eui-app-main-content\" role=\"main\">\n        <ng-content select=\"eui-app-page-wrapper\"></ng-content>\n        <!-- TODO: consider removing code below in the future by transferring responsibility of providing <router-outlet> to the developer -->\n        <ng-container *ngIf=\"hasNoPageWrapper\">\n            <router-outlet></router-outlet>\n        </ng-container>\n    </div>\n\n    <ng-content select=\"eui-app-footer\"></ng-content>\n</div>\n\n<eui-growl\n    [value]=\"euiGrowlService.growlMessages\"\n    [sticky]=\"euiGrowlService.isGrowlSticky\"\n    [closeAllSticky]=\"euiGrowlService.isCloseAllSticky\"\n    [life]=\"euiGrowlService.growlLife\"\n    [position]=\"euiGrowlService.growlPosition\"\n    (clicked)=\"euiGrowlService.growlCallback ? euiGrowlService.growlCallback(): null\"></eui-growl>\n\n<eui-block-document [isBlocked]=\"(asService.state$ | async).isBlockDocumentActive\"></eui-block-document>\n", styles: [".eui-app{display:flex;overflow:hidden}@media screen and (max-width: 767px){.eui-app.sidebar--open:before{background:#0000004d;bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));transition:all .1s ease;width:100vw;z-index:980}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app.sidebar--open:before{background:#0000004d;bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));transition:all .1s ease;width:100vw;z-index:980}}@media screen and (min-width: 996px){.sidebar--hidden.eui-app.sidebar--open:before{background:#0000004d;bottom:0;content:\"\";position:fixed;right:0;top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height));transition:all .1s ease;width:100vw;z-index:980}}.eui-app-main{min-height:100vh;background:var(--eui-base-color-grey-2);width:calc(100% - var(--eui-app-sidebar-width));margin-left:var(--eui-app-sidebar-width);display:flex;flex-direction:column}@media screen and (max-width: 767px){.eui-app-main{margin-left:0;width:100%}}@media screen and (min-width: 768px) and (max-width: 995px){.eui-app-main{margin-left:0;width:100%}}@media screen and (min-width: 996px){.sidebar--close .eui-app-main{margin-left:var(--eui-app-sidebar-width-close);width:calc(100% - var(--eui-app-sidebar-width-close))}.sidebar--hidden.sidebar--close .eui-app-main,.sidebar--hidden.sidebar--open .eui-app-main{margin-left:0;width:100%}}.eui-app-main-content{flex-grow:1;margin-top:calc(var(--eui-app-header-height) + var(--eui-app-toolbar-height) + var(--eui-app-top-message-height) - var(--eui-app-breadcrumb-height));position:relative}eui-app-page-wrapper{display:flex;width:100%}\n"] }]
         }], ctorParameters: () => [{ type: i1.EuiAppShellService }, { type: i1.EuiGrowlService }, { type: i2.DeviceDetectorService }, { type: i0.ChangeDetectorRef }], propDecorators: { cssClasses: [{
@@ -140,10 +140,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2",
             }] } });
 /* eslint-disable */
 export class EuiAppPageWrapperDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppPageWrapperDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.2", type: EuiAppPageWrapperDirective, selector: "eui-app-page-wrapper", ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppPageWrapperDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.0-next.3", type: EuiAppPageWrapperDirective, selector: "eui-app-page-wrapper", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppPageWrapperDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppPageWrapperDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'eui-app-page-wrapper' }]
         }] });

package/esm2022/layout/eui-app/eui-app.module.mjs CHANGED Viewed

@@ -36,8 +36,8 @@ const MODULES = [
     EuiAppBreadcrumbModule,
 ];
 export class EuiAppModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppModule, declarations: [EuiAppComponent, EuiAppPageWrapperDirective], imports: [CommonModule, RouterModule, EuiUserProfileModule,
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppModule, declarations: [EuiAppComponent, EuiAppPageWrapperDirective], imports: [CommonModule, RouterModule, EuiUserProfileModule,
             EuiSearchModule,
             EuiBreadcrumbModule,
             EuiLanguageSelectorModule,
@@ -66,7 +66,7 @@ export class EuiAppModule {
             EuiGrowlModule,
             EuiDimmerModule,
             EuiAppBreadcrumbModule] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppModule, imports: [CommonModule, RouterModule, MODULES, EuiUserProfileModule,
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppModule, imports: [CommonModule, RouterModule, MODULES, EuiUserProfileModule,
             EuiSearchModule,
             EuiBreadcrumbModule,
             EuiLanguageSelectorModule,
@@ -82,7 +82,7 @@ export class EuiAppModule {
             EuiDimmerModule,
             EuiAppBreadcrumbModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.2", ngImport: i0, type: EuiAppModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.3", ngImport: i0, type: EuiAppModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, RouterModule, ...MODULES],