@eui/components 17.0.3-snapshot-1704421850692 → 17.1.0-snapshot-1704853368511

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

@@ -43,10 +43,10 @@ export class EuiAppSidebarComponent {
             this.asService.isSidebarHover = false;
         }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", 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: "17.0.6", 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));transition:top .1s ease,width .1s ease-in,margin-left .1s ease-in-out;width:var(--eui-app-sidebar-width);box-shadow:var(--eui-base-shadow-10);z-index:var(--eui-base-z-index-sidebar)}.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)));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{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{height:calc(100% - 8rem);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{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{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{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{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{top:8rem}.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: "17.0.8", 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: "17.0.8", 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));transition:top .1s ease,width .1s ease-in,margin-left .1s ease-in-out;width:var(--eui-app-sidebar-width);box-shadow:var(--eui-base-shadow-10);z-index:var(--eui-base-z-index-sidebar)}.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)));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{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{height:calc(100% - 8rem);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{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{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{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{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{top:8rem}.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 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiAppSidebarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", 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));transition:top .1s ease,width .1s ease-in,margin-left .1s ease-in-out;width:var(--eui-app-sidebar-width);box-shadow:var(--eui-base-shadow-10);z-index:var(--eui-base-z-index-sidebar)}.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)));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{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{height:calc(100% - 8rem);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{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{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{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{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{top:8rem}.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"] }]
         }], ctorParameters: () => [{ type: i1.EuiAppShellService, decorators: [{

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

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

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

@@ -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: "17.0.6", ngImport: i0, type: EuiAppToolbarComponent, deps: [{ token: i1.EuiAppShellService }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.6", 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: "17.0.8", ngImport: i0, type: EuiAppToolbarComponent, deps: [{ token: i1.EuiAppShellService }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", 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: "17.0.6", ngImport: i0, type: EuiAppToolbarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", 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

@@ -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: "17.0.6", ngImport: i0, type: EuiAppToolbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.6", 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: "17.0.6", ngImport: i0, type: EuiAppToolbarModule, imports: [CommonModule, EuiSidebarToggleModule, EuiLanguageSelectorModule, EuiToolbarModule, EuiCoerceBooleanPipeModule] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiAppToolbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", 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: "17.0.8", ngImport: i0, type: EuiAppToolbarModule, imports: [CommonModule, EuiSidebarToggleModule, EuiLanguageSelectorModule, EuiToolbarModule, EuiCoerceBooleanPipeModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiAppToolbarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", 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

@@ -57,13 +57,13 @@ export class EuiAppTopMessageComponent extends BaseDirective {
         this.cd.reattach();
         this.cd.detectChanges();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", 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: "14.0.0", version: "17.0.6", type: EuiAppTopMessageComponent, selector: "eui-app-top-message", inputs: { isCloseable: "isCloseable", 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--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__wrapper{display:flex;flex-direction:row;align-items:center;width:100%}.eui-app-top-message__content{display:flex;flex-direction:column}\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: "17.0.8", 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: "14.0.0", version: "17.0.8", type: EuiAppTopMessageComponent, selector: "eui-app-top-message", inputs: { isCloseable: "isCloseable", 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--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__wrapper{display:flex;flex-direction:row;align-items:center;width:100%}.eui-app-top-message__content{display:flex;flex-direction:column}\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 }); }
 }
 __decorate([
     coerceBoolean
 ], EuiAppTopMessageComponent.prototype, "isCloseable", void 0);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiAppTopMessageComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", 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--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__wrapper{display:flex;flex-direction:row;align-items:center;width:100%}.eui-app-top-message__content{display:flex;flex-direction:column}\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

@@ -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: "17.0.6", ngImport: i0, type: EuiAppTopMessageModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.6", ngImport: i0, type: EuiAppTopMessageModule, declarations: [EuiAppTopMessageComponent], imports: [CommonModule, EuiIconModule], exports: [EuiAppTopMessageComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiAppTopMessageModule, imports: [CommonModule, EuiIconModule] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiAppTopMessageModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: EuiAppTopMessageModule, declarations: [EuiAppTopMessageComponent], imports: [CommonModule, EuiIconModule], exports: [EuiAppTopMessageComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiAppTopMessageModule, imports: [CommonModule, EuiIconModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiAppTopMessageModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiAppTopMessageModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, EuiIconModule],

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

@@ -102,10 +102,10 @@ export class EuiAppComponent {
         this.destroy$.next(true);
         this.destroy$.unsubscribe();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", 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: "17.0.6", 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: "17.0.8", 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: "17.0.8", 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: "17.0.6", ngImport: i0, type: EuiAppComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", 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: [{
@@ -139,10 +139,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImpor
             }] } });
 /* eslint-disable */
 export class EuiAppPageWrapperDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiAppPageWrapperDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.6", type: EuiAppPageWrapperDirective, selector: "eui-app-page-wrapper", ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiAppPageWrapperDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: EuiAppPageWrapperDirective, selector: "eui-app-page-wrapper", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiAppPageWrapperDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiAppPageWrapperDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'eui-app-page-wrapper' }]
         }] });

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

@@ -36,8 +36,8 @@ const MODULES = [
     EuiAppBreadcrumbModule,
 ];
 export class EuiAppModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiAppModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.6", ngImport: i0, type: EuiAppModule, declarations: [EuiAppComponent, EuiAppPageWrapperDirective], imports: [CommonModule, RouterModule, EuiUserProfileModule,
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiAppModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", 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: "17.0.6", ngImport: i0, type: EuiAppModule, imports: [CommonModule, RouterModule, MODULES, EuiUserProfileModule,
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", 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: "17.0.6", ngImport: i0, type: EuiAppModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiAppModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, RouterModule, ...MODULES],

package/esm2022/layout/eui-breadcrumb/breadcrumb.component.mjs

@@ -194,10 +194,10 @@ export class EuiBreadcrumbComponent {
             this.collapsedViewIcon = icon;
         }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiBreadcrumbComponent, deps: [{ token: i1.EuiAppShellService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i2.ViewportRuler }, { token: i0.Renderer2 }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.6", type: EuiBreadcrumbComponent, selector: "eui-breadcrumb", host: { properties: { "class": "this.string" } }, queries: [{ propertyName: "breadcrumbItems", predicate: i0.forwardRef(() => EuiBreadcrumbItemComponent) }], viewQueries: [{ propertyName: "vcr", first: true, predicate: ["vcr"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div class=\"eui-breadcrumb__items\">\n    <ng-container #vcr>\n        <ng-content></ng-content>\n    </ng-container>\n</div>\n", styles: [".eui-breadcrumb{align-items:center;display:flex;width:100%;position:relative}.eui-breadcrumb__items{align-items:center;box-sizing:border-box;display:flex;flex-wrap:nowrap;list-style:none;margin:0;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-breadcrumb+.eui-breadcrumb-item:before{color:var(--eui-base-color-grey-25);height:1rem;width:1rem;content:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Ctitle%3EChevron Forward%3C/title%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M184 112l144 144-144 144'/%3E%3C/svg%3E\");display:inline-block;padding-left:var(--eui-base-spacing-xs);padding-right:var(--eui-base-spacing-xs)}.cdk-overlay-container .eui-breadcrumb-separator{margin:0 var(--eui-base-spacing-xs) 0 0}@media screen and (max-width: 767px){eui-breadcrumb,.eui-breadcrumb{display:none}}.eui-breadcrumb-item{align-items:center;display:flex;font-size:var(--eui-base-font-size-s);font-weight:700;z-index:9}.eui-breadcrumb-item__separator{align-items:center;display:flex;padding:0 var(--eui-base-spacing-2xs)}.eui-breadcrumb-item .eui-button{background-color:transparent;border:1px solid transparent;font-size:var(--eui-base-font-size-s);font-weight:700;padding:0 var(--eui-base-spacing-2xs) 0 0}.eui-breadcrumb-item .eui-button:hover{background-color:transparent!important}.eui-breadcrumb-item .eui-label{white-space:nowrap;text-decoration:none!important}.eui-breadcrumb-item .eui-label--secondary{color:var(--eui-base-color-grey-75);cursor:none;pointer-events:none}\n"], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiBreadcrumbComponent, deps: [{ token: i1.EuiAppShellService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i2.ViewportRuler }, { token: i0.Renderer2 }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: EuiBreadcrumbComponent, selector: "eui-breadcrumb", host: { properties: { "class": "this.string" } }, queries: [{ propertyName: "breadcrumbItems", predicate: i0.forwardRef(() => EuiBreadcrumbItemComponent) }], viewQueries: [{ propertyName: "vcr", first: true, predicate: ["vcr"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div class=\"eui-breadcrumb__items\">\n    <ng-container #vcr>\n        <ng-content></ng-content>\n    </ng-container>\n</div>\n", styles: [".eui-breadcrumb{align-items:center;display:flex;width:100%;position:relative}.eui-breadcrumb__items{align-items:center;box-sizing:border-box;display:flex;flex-wrap:nowrap;list-style:none;margin:0;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-breadcrumb+.eui-breadcrumb-item:before{color:var(--eui-base-color-grey-25);height:1rem;width:1rem;content:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Ctitle%3EChevron Forward%3C/title%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M184 112l144 144-144 144'/%3E%3C/svg%3E\");display:inline-block;padding-left:var(--eui-base-spacing-xs);padding-right:var(--eui-base-spacing-xs)}.cdk-overlay-container .eui-breadcrumb-separator{margin:0 var(--eui-base-spacing-xs) 0 0}@media screen and (max-width: 767px){eui-breadcrumb,.eui-breadcrumb{display:none}}.eui-breadcrumb-item{align-items:center;display:flex;font-size:var(--eui-base-font-size-s);font-weight:700;z-index:9}.eui-breadcrumb-item__separator{align-items:center;display:flex;padding:0 var(--eui-base-spacing-2xs)}.eui-breadcrumb-item .eui-button{background-color:transparent;border:1px solid transparent;font-size:var(--eui-base-font-size-s);font-weight:700;padding:0 var(--eui-base-spacing-2xs) 0 0}.eui-breadcrumb-item .eui-button:hover{background-color:transparent!important}.eui-breadcrumb-item .eui-label{white-space:nowrap;text-decoration:none!important}.eui-breadcrumb-item .eui-label--secondary{color:var(--eui-base-color-grey-75);cursor:none;pointer-events:none}\n"], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiBreadcrumbComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiBreadcrumbComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-breadcrumb', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<div class=\"eui-breadcrumb__items\">\n    <ng-container #vcr>\n        <ng-content></ng-content>\n    </ng-container>\n</div>\n", styles: [".eui-breadcrumb{align-items:center;display:flex;width:100%;position:relative}.eui-breadcrumb__items{align-items:center;box-sizing:border-box;display:flex;flex-wrap:nowrap;list-style:none;margin:0;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-breadcrumb+.eui-breadcrumb-item:before{color:var(--eui-base-color-grey-25);height:1rem;width:1rem;content:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Ctitle%3EChevron Forward%3C/title%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M184 112l144 144-144 144'/%3E%3C/svg%3E\");display:inline-block;padding-left:var(--eui-base-spacing-xs);padding-right:var(--eui-base-spacing-xs)}.cdk-overlay-container .eui-breadcrumb-separator{margin:0 var(--eui-base-spacing-xs) 0 0}@media screen and (max-width: 767px){eui-breadcrumb,.eui-breadcrumb{display:none}}.eui-breadcrumb-item{align-items:center;display:flex;font-size:var(--eui-base-font-size-s);font-weight:700;z-index:9}.eui-breadcrumb-item__separator{align-items:center;display:flex;padding:0 var(--eui-base-spacing-2xs)}.eui-breadcrumb-item .eui-button{background-color:transparent;border:1px solid transparent;font-size:var(--eui-base-font-size-s);font-weight:700;padding:0 var(--eui-base-spacing-2xs) 0 0}.eui-breadcrumb-item .eui-button:hover{background-color:transparent!important}.eui-breadcrumb-item .eui-label{white-space:nowrap;text-decoration:none!important}.eui-breadcrumb-item .eui-label--secondary{color:var(--eui-base-color-grey-75);cursor:none;pointer-events:none}\n"] }]
         }], ctorParameters: () => [{ type: i1.EuiAppShellService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i2.ViewportRuler }, { type: i0.Renderer2 }, { type: i0.ViewContainerRef }], propDecorators: { string: [{

package/esm2022/layout/eui-breadcrumb/breadcrumb.module.mjs

@@ -13,15 +13,15 @@ import { EuiBreadcrumbService } from './breadcrumb.service';
 import { CollapsedBreadcrumbComponent, CollapsedButtonDirective } from './collapsed-breadcrumb/collapsed-breadcrumb.component';
 import * as i0 from "@angular/core";
 export class EuiBreadcrumbModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiBreadcrumbModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.6", ngImport: i0, type: EuiBreadcrumbModule, declarations: [CollapsedButtonDirective, EuiBreadcrumbComponent, EuiBreadcrumbItemComponent, CollapsedBreadcrumbComponent], imports: [CommonModule, RouterModule, PortalModule, EuiButtonModule, EuiIconModule, EuiDropdownModule, EuiListModule, EuiLabelModule], exports: [
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiBreadcrumbModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: EuiBreadcrumbModule, declarations: [CollapsedButtonDirective, EuiBreadcrumbComponent, EuiBreadcrumbItemComponent, CollapsedBreadcrumbComponent], imports: [CommonModule, RouterModule, PortalModule, EuiButtonModule, EuiIconModule, EuiDropdownModule, EuiListModule, EuiLabelModule], exports: [
             // CollapsedBreadcrumbComponent,
             // CollapsedButtonDirective,
             EuiBreadcrumbComponent,
             EuiBreadcrumbItemComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiBreadcrumbModule, providers: [EuiBreadcrumbService], imports: [CommonModule, RouterModule, PortalModule, EuiButtonModule, EuiIconModule, EuiDropdownModule, EuiListModule, EuiLabelModule] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiBreadcrumbModule, providers: [EuiBreadcrumbService], imports: [CommonModule, RouterModule, PortalModule, EuiButtonModule, EuiIconModule, EuiDropdownModule, EuiListModule, EuiLabelModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiBreadcrumbModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiBreadcrumbModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, RouterModule, PortalModule, EuiButtonModule, EuiIconModule, EuiDropdownModule, EuiListModule, EuiLabelModule],

package/esm2022/layout/eui-breadcrumb/breadcrumb.service.mjs

@@ -80,10 +80,10 @@ export class EuiBreadcrumbService {
         // Notify observers
         this.breadcrumbsSource$.next(this.breadcrumb);
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiBreadcrumbService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiBreadcrumbService, providedIn: 'root' }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiBreadcrumbService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiBreadcrumbService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiBreadcrumbService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiBreadcrumbService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',

package/esm2022/layout/eui-breadcrumb/collapsed-breadcrumb/collapsed-breadcrumb.component.mjs

@@ -66,10 +66,10 @@ export class CollapsedBreadcrumbComponent {
     hasCustomButton() {
         return !!this.customButton;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: CollapsedBreadcrumbComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.6", type: CollapsedBreadcrumbComponent, selector: "eui-collapsed-breadcrumb", queries: [{ propertyName: "customButton", first: true, predicate: i0.forwardRef(() => CollapsedButtonDirective), descendants: true, static: true }, { propertyName: "listItemComponents", predicate: i0.forwardRef(() => EuiListItemComponent) }], viewQueries: [{ propertyName: "list", first: true, predicate: EuiListComponent, descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<eui-dropdown>\n    <!-- render default collapsed button if no custom is provided -->\n    <ng-container *ngIf=\"!hasCustomButton()\">\n        <button type=\"button\" euiButton euiRounded euiSizeS euiIconButton euiOutline euiAccent>\n            <eui-icon-svg icon=\"eui-ellipsis-horizontal\"></eui-icon-svg>\n        </button>\n    </ng-container>\n    <!-- provide customizations for the collapsed button -->\n    <ng-content select=\"collapsed-button\"></ng-content>\n    <eui-dropdown-content>\n        <ul euiList>\n            <ng-content></ng-content>\n        </ul>\n    </eui-dropdown-content>\n</eui-dropdown>\n\n<!-- SAMPLE aligned with Design System\n<eui-dropdown>\n    <button type=\"button\" euiButton euiRounded euiIconButton euiBasicButton euiPrimary euiSizeS euiTooltip=\"Other links menu\" [attr.aria-label]=\"'Other links menu'\">\n        <eui-icon-svg icon=\"ellipsis-horizontal\" fillColor=\"grey-100\"></eui-icon-svg>\n    </button>\n    <eui-dropdown-content>\n        <ul euiList>\n            <li euiListItem>\n                <eui-icon-svg icon=\"chevron-forward\" size=\"xs\" fillColor=\"grey-75\"></eui-icon-svg>\n                <button type=\"button\" euiSizeXS euiListItem>Item 1</button>\n            </li>\n            <li euiListItem>\n                <eui-icon-svg icon=\"chevron-forward\" size=\"xs\" fillColor=\"grey-75\"></eui-icon-svg>\n                <button type=\"button\" euiSizeXS euiListItem>Item 2</button>\n            </li>\n        </ul>\n    </eui-dropdown-content>\n</eui-dropdown>\n-->\n", styles: [".eui-breadcrumb-item{align-items:center;display:flex;font-size:v(eui-base-font-size-s);font-weight:700;z-index:9}.eui-breadcrumb-item__separator{align-items:center;display:flex;padding:0 v(eui-base-spacing-2xs)}.eui-breadcrumb-item .eui-button{background-color:transparent;border:1px solid transparent;font-size:v(eui-base-font-size-s);font-weight:700;padding:0 v(eui-base-spacing-2xs) 0 0}.eui-breadcrumb-item .eui-button:hover{background-color:transparent!important}.eui-breadcrumb-item .eui-label{white-space:nowrap;text-decoration:none!important}.eui-breadcrumb-item .eui-label--secondary{color:v(eui-base-color-grey-75);cursor:none;pointer-events: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.EuiDropdownComponent, selector: "eui-dropdown", inputs: ["e2eAttr", "tabIndex", "width", "position", "isDropDownRightAligned", "isClosedOnClickInside", "isLabelUpdatedFromSelectedItem", "isExpandOnHover", "hasTabNavigation"] }, { kind: "directive", type: i4.EuiDropdownContentDirective, selector: "eui-dropdown-content" }, { kind: "component", type: i5.EuiListComponent, selector: "[euiList], eui-list", inputs: ["isCollapsible"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CollapsedBreadcrumbComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: CollapsedBreadcrumbComponent, selector: "eui-collapsed-breadcrumb", queries: [{ propertyName: "customButton", first: true, predicate: i0.forwardRef(() => CollapsedButtonDirective), descendants: true, static: true }, { propertyName: "listItemComponents", predicate: i0.forwardRef(() => EuiListItemComponent) }], viewQueries: [{ propertyName: "list", first: true, predicate: EuiListComponent, descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<eui-dropdown>\n    <!-- render default collapsed button if no custom is provided -->\n    <ng-container *ngIf=\"!hasCustomButton()\">\n        <button type=\"button\" euiButton euiRounded euiSizeS euiIconButton euiOutline euiAccent>\n            <eui-icon-svg icon=\"eui-ellipsis-horizontal\"></eui-icon-svg>\n        </button>\n    </ng-container>\n    <!-- provide customizations for the collapsed button -->\n    <ng-content select=\"collapsed-button\"></ng-content>\n    <eui-dropdown-content>\n        <ul euiList>\n            <ng-content></ng-content>\n        </ul>\n    </eui-dropdown-content>\n</eui-dropdown>\n\n<!-- SAMPLE aligned with Design System\n<eui-dropdown>\n    <button type=\"button\" euiButton euiRounded euiIconButton euiBasicButton euiPrimary euiSizeS euiTooltip=\"Other links menu\" [attr.aria-label]=\"'Other links menu'\">\n        <eui-icon-svg icon=\"ellipsis-horizontal\" fillColor=\"grey-100\"></eui-icon-svg>\n    </button>\n    <eui-dropdown-content>\n        <ul euiList>\n            <li euiListItem>\n                <eui-icon-svg icon=\"chevron-forward\" size=\"xs\" fillColor=\"grey-75\"></eui-icon-svg>\n                <button type=\"button\" euiSizeXS euiListItem>Item 1</button>\n            </li>\n            <li euiListItem>\n                <eui-icon-svg icon=\"chevron-forward\" size=\"xs\" fillColor=\"grey-75\"></eui-icon-svg>\n                <button type=\"button\" euiSizeXS euiListItem>Item 2</button>\n            </li>\n        </ul>\n    </eui-dropdown-content>\n</eui-dropdown>\n-->\n", styles: [".eui-breadcrumb-item{align-items:center;display:flex;font-size:v(eui-base-font-size-s);font-weight:700;z-index:9}.eui-breadcrumb-item__separator{align-items:center;display:flex;padding:0 v(eui-base-spacing-2xs)}.eui-breadcrumb-item .eui-button{background-color:transparent;border:1px solid transparent;font-size:v(eui-base-font-size-s);font-weight:700;padding:0 v(eui-base-spacing-2xs) 0 0}.eui-breadcrumb-item .eui-button:hover{background-color:transparent!important}.eui-breadcrumb-item .eui-label{white-space:nowrap;text-decoration:none!important}.eui-breadcrumb-item .eui-label--secondary{color:v(eui-base-color-grey-75);cursor:none;pointer-events: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.EuiDropdownComponent, selector: "eui-dropdown", inputs: ["e2eAttr", "tabIndex", "width", "position", "isDropDownRightAligned", "isClosedOnClickInside", "isLabelUpdatedFromSelectedItem", "isExpandOnHover", "hasTabNavigation"] }, { kind: "directive", type: i4.EuiDropdownContentDirective, selector: "eui-dropdown-content" }, { kind: "component", type: i5.EuiListComponent, selector: "[euiList], eui-list", inputs: ["isCollapsible"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: CollapsedBreadcrumbComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CollapsedBreadcrumbComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-collapsed-breadcrumb', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<eui-dropdown>\n    <!-- render default collapsed button if no custom is provided -->\n    <ng-container *ngIf=\"!hasCustomButton()\">\n        <button type=\"button\" euiButton euiRounded euiSizeS euiIconButton euiOutline euiAccent>\n            <eui-icon-svg icon=\"eui-ellipsis-horizontal\"></eui-icon-svg>\n        </button>\n    </ng-container>\n    <!-- provide customizations for the collapsed button -->\n    <ng-content select=\"collapsed-button\"></ng-content>\n    <eui-dropdown-content>\n        <ul euiList>\n            <ng-content></ng-content>\n        </ul>\n    </eui-dropdown-content>\n</eui-dropdown>\n\n<!-- SAMPLE aligned with Design System\n<eui-dropdown>\n    <button type=\"button\" euiButton euiRounded euiIconButton euiBasicButton euiPrimary euiSizeS euiTooltip=\"Other links menu\" [attr.aria-label]=\"'Other links menu'\">\n        <eui-icon-svg icon=\"ellipsis-horizontal\" fillColor=\"grey-100\"></eui-icon-svg>\n    </button>\n    <eui-dropdown-content>\n        <ul euiList>\n            <li euiListItem>\n                <eui-icon-svg icon=\"chevron-forward\" size=\"xs\" fillColor=\"grey-75\"></eui-icon-svg>\n                <button type=\"button\" euiSizeXS euiListItem>Item 1</button>\n            </li>\n            <li euiListItem>\n                <eui-icon-svg icon=\"chevron-forward\" size=\"xs\" fillColor=\"grey-75\"></eui-icon-svg>\n                <button type=\"button\" euiSizeXS euiListItem>Item 2</button>\n            </li>\n        </ul>\n    </eui-dropdown-content>\n</eui-dropdown>\n-->\n", styles: [".eui-breadcrumb-item{align-items:center;display:flex;font-size:v(eui-base-font-size-s);font-weight:700;z-index:9}.eui-breadcrumb-item__separator{align-items:center;display:flex;padding:0 v(eui-base-spacing-2xs)}.eui-breadcrumb-item .eui-button{background-color:transparent;border:1px solid transparent;font-size:v(eui-base-font-size-s);font-weight:700;padding:0 v(eui-base-spacing-2xs) 0 0}.eui-breadcrumb-item .eui-button:hover{background-color:transparent!important}.eui-breadcrumb-item .eui-label{white-space:nowrap;text-decoration:none!important}.eui-breadcrumb-item .eui-label--secondary{color:v(eui-base-color-grey-75);cursor:none;pointer-events:none}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ViewContainerRef }], propDecorators: { customButton: [{
@@ -84,10 +84,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImpor
             }] } });
 // eslint-disable-next-line @angular-eslint/directive-selector
 export class CollapsedButtonDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: CollapsedButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.6", type: CollapsedButtonDirective, selector: "collapsed-button", ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CollapsedButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: CollapsedButtonDirective, selector: "collapsed-button", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: CollapsedButtonDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CollapsedButtonDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'collapsed-button' }]
         }] });

package/esm2022/layout/eui-breadcrumb/item/breadcrumb-item.component.mjs

@@ -97,10 +97,10 @@ export class EuiBreadcrumbItemComponent {
     isLast() {
         return !this.nextCrumb;
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiBreadcrumbItemComponent, deps: [{ token: i0.ElementRef }, { token: i1.Router }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i2.LogService, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.6", type: EuiBreadcrumbItemComponent, selector: "eui-breadcrumb-item", inputs: { id: "id", label: "label", link: "link", navigationExtras: "navigationExtras" }, host: { properties: { "class": "this.string" } }, ngImport: i0, template: "<!-- render the separator if should have one -->\n<div *ngIf=\"hasPrevious\" class=\"eui-breadcrumb-item__separator\">\n    <eui-icon-svg icon=\"eui-chevron-forward\" size=\"xs\" fillColor=\"grey-100\"></eui-icon-svg>\n</div>\n<button type=\"button\" *ngIf=\"link\" euiButton euiBasicButton euiSizeS [euiSecondary]=\"!hasNext\" [euiPrimary]=\"hasNext\" (click)=\"onClick()\">\n    {{ label }}\n</button>\n<span *ngIf=\"!link\" euiLabel euiSizeS [euiSecondary]=\"!hasNext\" [euiPrimary]=\"hasNext\">{{ label }}</span>\n", styles: [".eui-breadcrumb{align-items:center;display:flex;width:100%;position:relative}.eui-breadcrumb__items{align-items:center;box-sizing:border-box;display:flex;flex-wrap:nowrap;list-style:none;margin:0;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-breadcrumb+.eui-breadcrumb-item:before{color:var(--eui-base-color-grey-25);height:1rem;width:1rem;content:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Ctitle%3EChevron Forward%3C/title%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M184 112l144 144-144 144'/%3E%3C/svg%3E\");display:inline-block;padding-left:var(--eui-base-spacing-xs);padding-right:var(--eui-base-spacing-xs)}.cdk-overlay-container .eui-breadcrumb-separator{margin:0 var(--eui-base-spacing-xs) 0 0}@media screen and (max-width: 767px){eui-breadcrumb,.eui-breadcrumb{display:none}}.eui-breadcrumb-item{align-items:center;display:flex;font-size:var(--eui-base-font-size-s);font-weight:700;z-index:9}.eui-breadcrumb-item__separator{align-items:center;display:flex;padding:0 var(--eui-base-spacing-2xs)}.eui-breadcrumb-item .eui-button{background-color:transparent;border:1px solid transparent;font-size:var(--eui-base-font-size-s);font-weight:700;padding:0 var(--eui-base-spacing-2xs) 0 0}.eui-breadcrumb-item .eui-button:hover{background-color:transparent!important}.eui-breadcrumb-item .eui-label{white-space:nowrap;text-decoration:none!important}.eui-breadcrumb-item .eui-label--secondary{color:var(--eui-base-color-grey-75);cursor:none;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "component", type: i5.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: i6.EuiLabelComponent, selector: "label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label,               label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel", inputs: ["euiRequired", "euiReadonly", "euiSublabel"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiBreadcrumbItemComponent, deps: [{ token: i0.ElementRef }, { token: i1.Router }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i2.LogService, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: EuiBreadcrumbItemComponent, selector: "eui-breadcrumb-item", inputs: { id: "id", label: "label", link: "link", navigationExtras: "navigationExtras" }, host: { properties: { "class": "this.string" } }, ngImport: i0, template: "<!-- render the separator if should have one -->\n<div *ngIf=\"hasPrevious\" class=\"eui-breadcrumb-item__separator\">\n    <eui-icon-svg icon=\"eui-chevron-forward\" size=\"xs\" fillColor=\"grey-100\"></eui-icon-svg>\n</div>\n<button type=\"button\" *ngIf=\"link\" euiButton euiBasicButton euiSizeS [euiSecondary]=\"!hasNext\" [euiPrimary]=\"hasNext\" (click)=\"onClick()\">\n    {{ label }}\n</button>\n<span *ngIf=\"!link\" euiLabel euiSizeS [euiSecondary]=\"!hasNext\" [euiPrimary]=\"hasNext\">{{ label }}</span>\n", styles: [".eui-breadcrumb{align-items:center;display:flex;width:100%;position:relative}.eui-breadcrumb__items{align-items:center;box-sizing:border-box;display:flex;flex-wrap:nowrap;list-style:none;margin:0;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-breadcrumb+.eui-breadcrumb-item:before{color:var(--eui-base-color-grey-25);height:1rem;width:1rem;content:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Ctitle%3EChevron Forward%3C/title%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M184 112l144 144-144 144'/%3E%3C/svg%3E\");display:inline-block;padding-left:var(--eui-base-spacing-xs);padding-right:var(--eui-base-spacing-xs)}.cdk-overlay-container .eui-breadcrumb-separator{margin:0 var(--eui-base-spacing-xs) 0 0}@media screen and (max-width: 767px){eui-breadcrumb,.eui-breadcrumb{display:none}}.eui-breadcrumb-item{align-items:center;display:flex;font-size:var(--eui-base-font-size-s);font-weight:700;z-index:9}.eui-breadcrumb-item__separator{align-items:center;display:flex;padding:0 var(--eui-base-spacing-2xs)}.eui-breadcrumb-item .eui-button{background-color:transparent;border:1px solid transparent;font-size:var(--eui-base-font-size-s);font-weight:700;padding:0 var(--eui-base-spacing-2xs) 0 0}.eui-breadcrumb-item .eui-button:hover{background-color:transparent!important}.eui-breadcrumb-item .eui-label{white-space:nowrap;text-decoration:none!important}.eui-breadcrumb-item .eui-label--secondary{color:var(--eui-base-color-grey-75);cursor:none;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "component", type: i5.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: i6.EuiLabelComponent, selector: "label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label,               label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel", inputs: ["euiRequired", "euiReadonly", "euiSublabel"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiBreadcrumbItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiBreadcrumbItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-breadcrumb-item', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<!-- render the separator if should have one -->\n<div *ngIf=\"hasPrevious\" class=\"eui-breadcrumb-item__separator\">\n    <eui-icon-svg icon=\"eui-chevron-forward\" size=\"xs\" fillColor=\"grey-100\"></eui-icon-svg>\n</div>\n<button type=\"button\" *ngIf=\"link\" euiButton euiBasicButton euiSizeS [euiSecondary]=\"!hasNext\" [euiPrimary]=\"hasNext\" (click)=\"onClick()\">\n    {{ label }}\n</button>\n<span *ngIf=\"!link\" euiLabel euiSizeS [euiSecondary]=\"!hasNext\" [euiPrimary]=\"hasNext\">{{ label }}</span>\n", styles: [".eui-breadcrumb{align-items:center;display:flex;width:100%;position:relative}.eui-breadcrumb__items{align-items:center;box-sizing:border-box;display:flex;flex-wrap:nowrap;list-style:none;margin:0;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-breadcrumb+.eui-breadcrumb-item:before{color:var(--eui-base-color-grey-25);height:1rem;width:1rem;content:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Ctitle%3EChevron Forward%3C/title%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M184 112l144 144-144 144'/%3E%3C/svg%3E\");display:inline-block;padding-left:var(--eui-base-spacing-xs);padding-right:var(--eui-base-spacing-xs)}.cdk-overlay-container .eui-breadcrumb-separator{margin:0 var(--eui-base-spacing-xs) 0 0}@media screen and (max-width: 767px){eui-breadcrumb,.eui-breadcrumb{display:none}}.eui-breadcrumb-item{align-items:center;display:flex;font-size:var(--eui-base-font-size-s);font-weight:700;z-index:9}.eui-breadcrumb-item__separator{align-items:center;display:flex;padding:0 var(--eui-base-spacing-2xs)}.eui-breadcrumb-item .eui-button{background-color:transparent;border:1px solid transparent;font-size:var(--eui-base-font-size-s);font-weight:700;padding:0 var(--eui-base-spacing-2xs) 0 0}.eui-breadcrumb-item .eui-button:hover{background-color:transparent!important}.eui-breadcrumb-item .eui-label{white-space:nowrap;text-decoration:none!important}.eui-breadcrumb-item .eui-label--secondary{color:var(--eui-base-color-grey-75);cursor:none;pointer-events:none}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.Router }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i2.LogService, decorators: [{

package/esm2022/layout/eui-footer/footer.component.mjs

@@ -9,10 +9,10 @@ export class EuiFooterComponent extends BaseDirective {
     constructor() {
         super();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.6", type: EuiFooterComponent, selector: "eui-footer", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".eui-footer{background:var(--eui-base-color-grey-2);display:flex;padding:1rem;width:100%}.eui-footer--primary{background:var(--eui-base-color-primary-100);color:var(--eui-base-color-white)}.eui-footer--primary a{color:var(--eui-base-color-white)!important;text-decoration:underline}\n"], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: EuiFooterComponent, selector: "eui-footer", host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".eui-footer{background:var(--eui-base-color-grey-2);display:flex;padding:1rem;width:100%}.eui-footer--primary{background:var(--eui-base-color-primary-100);color:var(--eui-base-color-white)}.eui-footer--primary a{color:var(--eui-base-color-white)!important;text-decoration:underline}\n"], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiFooterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiFooterComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-footer', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n", styles: [".eui-footer{background:var(--eui-base-color-grey-2);display:flex;padding:1rem;width:100%}.eui-footer--primary{background:var(--eui-base-color-primary-100);color:var(--eui-base-color-white)}.eui-footer--primary a{color:var(--eui-base-color-white)!important;text-decoration:underline}\n"] }]
         }], ctorParameters: () => [], propDecorators: { cssClasses: [{

package/esm2022/layout/eui-footer/footer.module.mjs

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

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

@@ -44,10 +44,10 @@ export class EuiHeaderAppComponent {
             });
         }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiHeaderAppComponent, deps: [{ token: i1.EuiAppShellService, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.6", type: EuiHeaderAppComponent, selector: "eui-header-app", inputs: { appName: "appName", appShortName: "appShortName", appSubTitle: "appSubTitle" }, host: { properties: { "class": "this.class" } }, queries: [{ propertyName: "customAppName", first: true, predicate: i0.forwardRef(() => EuiHeaderAppNameDirective), descendants: true }, { propertyName: "customAppSubtitle", first: true, predicate: i0.forwardRef(() => EuiHeaderAppSubtitleDirective), descendants: true }, { propertyName: "customAppNameLogo", first: true, predicate: i0.forwardRef(() => EuiHeaderAppNameLogoDirective), descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"customAppName\">\n    <div class=\"eui-header-app__title full\">\n        <ng-content select=\"eui-header-app-name\"></ng-content>\n    </div>\n</ng-container>\n<ng-container *ngIf=\"!customAppName\">\n    <div *ngIf=\"appName\" class=\"eui-header-app__title full\">\n        {{ appName }}\n    </div>\n</ng-container>\n\n<div class=\"eui-header-app__title short\">\n    {{ appShortName }}\n</div>\n\n<ng-container *ngIf=\"customAppSubtitle\">\n    <div class=\"eui-header-app__sub-title\">\n        <ng-content select=\"eui-header-app-subtitle\"></ng-content>\n    </div>\n</ng-container>\n<ng-container *ngIf=\"!customAppSubtitle\">\n    <div *ngIf=\"appSubTitle\" class=\"eui-header-app__sub-title\">{{ appSubTitle }}</div>\n</ng-container>\n\n<ng-container *ngIf=\"customAppNameLogo\">\n    <div class=\"eui-header-app-__title-logo\">\n        <ng-content select=\"eui-header-app-name-logo\"></ng-content>\n    </div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiHeaderAppComponent, deps: [{ token: i1.EuiAppShellService, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: EuiHeaderAppComponent, selector: "eui-header-app", inputs: { appName: "appName", appShortName: "appShortName", appSubTitle: "appSubTitle" }, host: { properties: { "class": "this.class" } }, queries: [{ propertyName: "customAppName", first: true, predicate: i0.forwardRef(() => EuiHeaderAppNameDirective), descendants: true }, { propertyName: "customAppSubtitle", first: true, predicate: i0.forwardRef(() => EuiHeaderAppSubtitleDirective), descendants: true }, { propertyName: "customAppNameLogo", first: true, predicate: i0.forwardRef(() => EuiHeaderAppNameLogoDirective), descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"customAppName\">\n    <div class=\"eui-header-app__title full\">\n        <ng-content select=\"eui-header-app-name\"></ng-content>\n    </div>\n</ng-container>\n<ng-container *ngIf=\"!customAppName\">\n    <div *ngIf=\"appName\" class=\"eui-header-app__title full\">\n        {{ appName }}\n    </div>\n</ng-container>\n\n<div class=\"eui-header-app__title short\">\n    {{ appShortName }}\n</div>\n\n<ng-container *ngIf=\"customAppSubtitle\">\n    <div class=\"eui-header-app__sub-title\">\n        <ng-content select=\"eui-header-app-subtitle\"></ng-content>\n    </div>\n</ng-container>\n<ng-container *ngIf=\"!customAppSubtitle\">\n    <div *ngIf=\"appSubTitle\" class=\"eui-header-app__sub-title\">{{ appSubTitle }}</div>\n</ng-container>\n\n<ng-container *ngIf=\"customAppNameLogo\">\n    <div class=\"eui-header-app-__title-logo\">\n        <ng-content select=\"eui-header-app-name-logo\"></ng-content>\n    </div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiHeaderAppComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiHeaderAppComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eui-header-app', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"customAppName\">\n    <div class=\"eui-header-app__title full\">\n        <ng-content select=\"eui-header-app-name\"></ng-content>\n    </div>\n</ng-container>\n<ng-container *ngIf=\"!customAppName\">\n    <div *ngIf=\"appName\" class=\"eui-header-app__title full\">\n        {{ appName }}\n    </div>\n</ng-container>\n\n<div class=\"eui-header-app__title short\">\n    {{ appShortName }}\n</div>\n\n<ng-container *ngIf=\"customAppSubtitle\">\n    <div class=\"eui-header-app__sub-title\">\n        <ng-content select=\"eui-header-app-subtitle\"></ng-content>\n    </div>\n</ng-container>\n<ng-container *ngIf=\"!customAppSubtitle\">\n    <div *ngIf=\"appSubTitle\" class=\"eui-header-app__sub-title\">{{ appSubTitle }}</div>\n</ng-container>\n\n<ng-container *ngIf=\"customAppNameLogo\">\n    <div class=\"eui-header-app-__title-logo\">\n        <ng-content select=\"eui-header-app-name-logo\"></ng-content>\n    </div>\n</ng-container>\n" }]
         }], ctorParameters: () => [{ type: i1.EuiAppShellService, decorators: [{
@@ -73,26 +73,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImpor
             }] } });
 /* eslint-disable */
 export class EuiHeaderAppNameDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiHeaderAppNameDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.6", type: EuiHeaderAppNameDirective, selector: "eui-header-app-name", ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiHeaderAppNameDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: EuiHeaderAppNameDirective, selector: "eui-header-app-name", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiHeaderAppNameDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiHeaderAppNameDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'eui-header-app-name' }]
         }] });
 export class EuiHeaderAppSubtitleDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiHeaderAppSubtitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.6", type: EuiHeaderAppSubtitleDirective, selector: "eui-header-app-subtitle", ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiHeaderAppSubtitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: EuiHeaderAppSubtitleDirective, selector: "eui-header-app-subtitle", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiHeaderAppSubtitleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiHeaderAppSubtitleDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'eui-header-app-subtitle' }]
         }] });
 export class EuiHeaderAppNameLogoDirective {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiHeaderAppNameLogoDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.6", type: EuiHeaderAppNameLogoDirective, selector: "eui-header-app-name-logo", ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiHeaderAppNameLogoDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: EuiHeaderAppNameLogoDirective, selector: "eui-header-app-name-logo", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiHeaderAppNameLogoDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: EuiHeaderAppNameLogoDirective, decorators: [{
             type: Directive,
             args: [{ selector: 'eui-header-app-name-logo' }]
         }] });