@eui/components 17.0.0-next.14 → 17.0.0-next.16

package/docs/modules/EuiTreeListModule.html

@@ -79,19 +79,19 @@
                             <a href="../components/EuiTreeListItemComponent.html">EuiTreeListItemComponent</a>
                         </li>
                         <li class="list-group-item">
-                            <a href="../directives/EuiTreeListItemCustomContentTagDirective.html">EuiTreeListItemCustomContentTagDirective</a>
+                            <a href="../components/EuiTreeListItemContentComponent.html">EuiTreeListItemContentComponent</a>
                         </li>
                         <li class="list-group-item">
                             <a href="../directives/EuiTreeListItemDetailsContentTagDirective.html">EuiTreeListItemDetailsContentTagDirective</a>
                         </li>
                         <li class="list-group-item">
-                            <a href="../directives/EuiTreeListItemRightContentTagDirective.html">EuiTreeListItemRightContentTagDirective</a>
+                            <a href="../directives/EuiTreeListItemLabelTagDirective.html">EuiTreeListItemLabelTagDirective</a>
                         </li>
                         <li class="list-group-item">
                             <a href="../directives/EuiTreeListItemSubContainerContentTagDirective.html">EuiTreeListItemSubContainerContentTagDirective</a>
                         </li>
                         <li class="list-group-item">
-                            <a href="../directives/EuiTreeListItemSubLabelTagDirective.html">EuiTreeListItemSubLabelTagDirective</a>
+                            <a href="../components/EuiTreeListToolbarComponent.html">EuiTreeListToolbarComponent</a>
                         </li>
                     </ul>
                 </div>
@@ -106,6 +106,12 @@
                         <li class="list-group-item">
                             <a href="../modules/EuiIconModule.html">EuiIconModule</a>
                         </li>
+                        <li class="list-group-item">
+                            <a href="../modules/EuiInputGroupModule.html">EuiInputGroupModule</a>
+                        </li>
+                        <li class="list-group-item">
+                            <a href="../modules/EuiInputTextModule.html">EuiInputTextModule</a>
+                        </li>
                         <li class="list-group-item">
                             <a href="../modules/EuiLabelModule.html">EuiLabelModule</a>
                         </li>
@@ -126,19 +132,19 @@
                             <a href="../components/EuiTreeListItemComponent.html">EuiTreeListItemComponent</a>
                         </li>
                         <li class="list-group-item">
-                            <a href="../directives/EuiTreeListItemCustomContentTagDirective.html">EuiTreeListItemCustomContentTagDirective</a>
+                            <a href="../components/EuiTreeListItemContentComponent.html">EuiTreeListItemContentComponent</a>
                         </li>
                         <li class="list-group-item">
                             <a href="../directives/EuiTreeListItemDetailsContentTagDirective.html">EuiTreeListItemDetailsContentTagDirective</a>
                         </li>
                         <li class="list-group-item">
-                            <a href="../directives/EuiTreeListItemRightContentTagDirective.html">EuiTreeListItemRightContentTagDirective</a>
+                            <a href="../directives/EuiTreeListItemLabelTagDirective.html">EuiTreeListItemLabelTagDirective</a>
                         </li>
                         <li class="list-group-item">
                             <a href="../directives/EuiTreeListItemSubContainerContentTagDirective.html">EuiTreeListItemSubContainerContentTagDirective</a>
                         </li>
                         <li class="list-group-item">
-                            <a href="../directives/EuiTreeListItemSubLabelTagDirective.html">EuiTreeListItemSubLabelTagDirective</a>
+                            <a href="../components/EuiTreeListToolbarComponent.html">EuiTreeListToolbarComponent</a>
                         </li>
                     </ul>
                 </div>

package/esm2022/eui-button/eui-button.component.mjs

@@ -80,11 +80,11 @@ export class EuiButtonComponent extends BaseDirective {
         this.buttonClick.emit(this);
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.0-rc.1", ngImport: i0, type: EuiButtonComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.0-rc.1", type: EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: { e2eAttr: "e2eAttr", id: "id", euiBasicButton: "euiBasicButton", euiButtonCall: "euiButtonCall", euiBlockButton: "euiBlockButton", isLoading: "isLoading", euiIconButton: "euiIconButton", euiLineWrap: "euiLineWrap" }, outputs: { buttonClick: "buttonClick" }, host: { listeners: { "click": "onClick()" }, properties: { "class": "this.cssClasses", "attr.data-e2e": "this.e2eAttr" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<span class=\"eui-button__container\">\n    <span *ngIf=\"isLoading\" class=\"eui-button__loading-icon\">\n        <eui-icon [isLoading]=\"true\"></eui-icon>\n    </span>\n    <ng-content></ng-content>\n</span>\n", styles: ["button,html [type=button],[type=reset],[type=submit]{-webkit-appearance:none;appearance:none}.eui-button{align-items:center;background-color:var(--eui-base-color-white);background-image:none;border:none;border-radius:var(--eui-base-border-radius);box-shadow:var(--eui-app-box-shadow);box-sizing:border-box;cursor:pointer;display:inline-flex;flex-shrink:0;justify-content:center;min-height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs));min-width:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs));outline:none;padding:calc(var(--eui-base-spacing-s) - 1px) var(--eui-base-spacing-m);text-transform:none;transition:none;vertical-align:middle;white-space:nowrap;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-button:active:not([readonly]),.eui-button:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-1px;transition:none}.eui-button [tabindex=\"0\"]:active:not([readonly]),.eui-button [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-1px;transition:none}.eui-button .eui-button__container{align-items:center;display:inline-flex;position:relative}.eui-button .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button .eui-button__container .eui-icon:first-child:not(.eui-icon--loading),.eui-button .eui-button__container>.eui-icon:not(.eui-icon--loading){margin-right:var(--eui-base-spacing-xs)}.eui-button .eui-button__container .eui-icon:first-child:not(.eui-icon--loading):not(.eui-button--icon-only),.eui-button .eui-button__container>.eui-icon:not(.eui-icon--loading):not(.eui-button--icon-only){margin-left:0}.eui-button .eui-button__container .eui-icon:last-child:not(.eui-icon--loading){margin-left:var(--eui-base-spacing-xs)}.eui-button .eui-button__container .eui-icon:last-child:not(.eui-icon--loading):not(.eui-button--icon-only){margin-right:0}.eui-button .eui-button__container .eui-label+.eui-badge{margin-left:var(--eui-base-spacing-s);max-height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-button .eui-button__container .eui-label+.eui-icon{margin-left:var(--eui-base-spacing-s)}.eui-button--icon-only{padding:calc(var(--eui-base-spacing-xs) - 1px)}.eui-button .eui-button__loading-icon{align-items:center;display:inline-flex}.eui-button .eui-button__loading-icon .eui-icon.eui-icon--loading{margin-right:var(--eui-base-spacing-xl)}.eui-button-fixed{bottom:var(--eui-base-spacing-3xl);position:fixed;right:var(--eui-base-spacing-xl);z-index:calc(var(--eui-base-z-index-btn-floating) + 1)}.eui-button-fixed:active:not([readonly]),.eui-button-fixed:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button-fixed [tabindex=\"0\"]:active:not([readonly]),.eui-button-fixed [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button-floating{align-items:center;border-radius:100%;display:inline-flex;height:var(--eui-base-spacing-3xl);overflow:hidden;padding:0;position:relative;transform:translateY(35%);transition:.3s;vertical-align:middle;width:var(--eui-base-spacing-3xl);z-index:1;box-shadow:var(--eui-base-shadow-2)}.eui-button-floating:hover{cursor:pointer;box-shadow:var(--eui-base-shadow-3)}.eui-button-floating .eui-icon{display:inline-block;font-size:var(--eui-base-font-size-3xl);text-align:center;width:inherit}.eui-button-floating:before{border-radius:0}a.eui-button{text-decoration:none}a.eui-button:active:not([readonly]),a.eui-button:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}a.eui-button [tabindex=\"0\"]:active:not([readonly]),a.eui-button [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}a.eui-button:hover,a.eui-button:focus,a.eui-button:active{text-decoration:none}a.eui-button.eui-button--primary:hover,a.eui-button.eui-button--info:hover,a.eui-button.eui-button--success:hover,a.eui-button.eui-button--danger:hover{color:var(--eui-base-color-white)}a.eui-button.eui-button--accent:hover,a.eui-button.eui-button--secondary:hover,a.eui-button.eui-button--warning:hover{color:var(--eui-base-color-text)}.eui-button__expand-trigger{border-top:1px solid var(--eui-base-color-grey-15);cursor:pointer;display:flex;justify-content:center;width:100%;z-index:1;margin-bottom:var(--eui-base-spacing-l)}.eui-button__expand-trigger:hover .eui-button--expand-toggle{box-shadow:var(--eui-base-shadow-3)}.eui-button__expand-trigger--collapsed{margin-top:var(--eui-base-spacing-s)}.eui-button__expand-trigger .eui-label+.eui-icon,.eui-button__expand-trigger .eui-icon+.eui-label{margin-left:var(--eui-base-spacing-s)}.eui-split-button{align-items:center;display:inline-flex;position:relative}.eui-split-button--disabled,.eui-split-button:disabled{pointer-events:none}.eui-split-button button{border-radius:var(--eui-base-border-radius) 0 0 var(--eui-base-border-radius);cursor:pointer}.eui-split-button .eui-dropdown button{border-radius:0 var(--eui-base-border-radius) var(--eui-base-border-radius) 0;margin-left:-1px}.eui-dropdown-button{align-items:center;display:inline-flex;flex-shrink:0;justify-content:center;position:relative}.eui-dropdown-button--disabled,.eui-dropdown-button:disabled{pointer-events:none}.eui-button--size-xs{height:calc(1.7505 * var(--eui-base-spacing-m));min-height:calc(1.7505 * var(--eui-base-spacing-m));min-width:calc(1.7505 * var(--eui-base-spacing-m));padding:0 var(--eui-base-spacing-s)}.eui-button--size-xs .eui-button__container{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-button--size-xs .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button--size-xs.eui-button--icon-only{padding:0}.eui-button--size-s{height:calc(2 * var(--eui-base-spacing-m));min-height:calc(2 * var(--eui-base-spacing-m));min-width:calc(2 * var(--eui-base-spacing-m));padding:0 var(--eui-base-spacing-s)}.eui-button--size-s .eui-button__container{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-button--size-s .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button--size-s.eui-button--icon-only{padding:0}.eui-button--size-m .eui-button__container{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-button--size-m .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button--size-l{height:calc(3.25 * var(--eui-base-spacing-m));min-height:calc(3.25 * var(--eui-base-spacing-m));min-width:calc(3.25 * var(--eui-base-spacing-m))}.eui-button--size-l .eui-button__container{font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.eui-button--size-l .eui-button__container .eui-label+.eui-badge{max-height:inherit}.eui-button--size-l .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-2xl)}.eui-button .eui-icon-svg--size-l{height:1.5rem;width:1.5rem}.eui-button .eui-icon-svg--size-m{height:1.25rem;width:1.25rem}.eui-button .eui-icon-svg--size-s{height:1rem;width:1rem}.eui-button{border:1px solid var(--eui-base-color-grey-100);color:var(--eui-base-color-grey-100)}.eui-button:hover{background-color:var(--eui-base-color-grey-5)}.eui-button--primary{background-color:var(--eui-base-color-primary-100);border-color:var(--eui-base-color-primary-120);color:var(--eui-base-color-white)}.eui-button--primary .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--primary:hover{background-color:var(--eui-base-color-primary-110)}.eui-button--primary--darker{background-color:var(--eui-base-color-primary-120);border-color:var(--eui-base-color-primary-120);color:var(--eui-base-color-white)}.eui-button--primary--darker:hover{background-color:var(--eui-base-color-primary-130)}.eui-button--secondary{background-color:var(--eui-base-color-grey-15);border-color:var(--eui-base-color-grey-50);color:var(--eui-base-color-grey-100)}.eui-button--secondary .eui-icon-svg>svg{color:var(--eui-base-grey-75);fill:var(--eui-base-grey-75)}.eui-button--secondary:hover{background-color:var(--eui-base-color-grey-25)}.eui-button--secondary--darker{background-color:var(--eui-base-color-grey-25);border-color:var(--eui-base-color-grey-50);color:var(--eui-base-color-grey-100)}.eui-button--secondary--darker:hover{background-color:var(--eui-base-color-grey-50)}.eui-button--info{background-color:var(--eui-base-color-info-100);border-color:var(--eui-base-color-info-120);color:var(--eui-base-color-white)}.eui-button--info .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--info:hover{background-color:var(--eui-base-color-info-110)}.eui-button--info--darker{background-color:var(--eui-base-color-info-120);border-color:var(--eui-base-color-info-120);color:var(--eui-base-color-white)}.eui-button--info--darker:hover{background-color:var(--eui-base-color-info-130)}.eui-button--success{background-color:var(--eui-base-color-success-100);border-color:var(--eui-base-color-success-120);color:var(--eui-base-color-white)}.eui-button--success .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--success:hover{background-color:var(--eui-base-color-success-110)}.eui-button--success--darker{background-color:var(--eui-base-color-success-120);border-color:var(--eui-base-color-success-120);color:var(--eui-base-color-white)}.eui-button--success--darker:hover{background-color:var(--eui-base-color-success-130)}.eui-button--warning{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-120);color:var(--eui-base-color-black)}.eui-button--warning .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--warning:hover{background-color:var(--eui-base-color-warning-110)}.eui-button--warning--darker{background-color:var(--eui-base-color-warning-120);border-color:var(--eui-base-color-warning-120);color:var(--eui-base-color-black)}.eui-button--warning--darker:hover{background-color:var(--eui-base-color-warning-130)}.eui-button--danger{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-120);color:var(--eui-base-color-white)}.eui-button--danger .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--danger:hover{background-color:var(--eui-base-color-danger-110)}.eui-button--danger--darker{background-color:var(--eui-base-color-danger-120);border-color:var(--eui-base-color-danger-120);color:var(--eui-base-color-white)}.eui-button--danger--darker:hover{background-color:var(--eui-base-color-danger-130)}.eui-button--accent .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--accent:active,.eui-button--accent:focus,.eui-button--accent:hover{background-color:var(--eui-base-color-accent-110);border-color:var(--eui-base-color-grey-100);color:var(--eui-base-color-black);outline-color:var(--eui-base-color-grey-100)}.eui-button--basic{background-color:transparent;border:1px solid transparent}.eui-button--basic:active,.eui-button--basic:focus,.eui-button--basic:hover{background-color:var(--eui-base-color-grey-5)}.eui-button--basic.eui-button--primary{color:var(--eui-base-color-primary-100)}.eui-button--basic.eui-button--primary .eui-icon-svg>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100)}.eui-button--basic.eui-button--primary:active,.eui-button--basic.eui-button--primary:focus,.eui-button--basic.eui-button--primary:hover{background-color:var(--eui-base-color-primary-10)}.eui-button--basic.eui-button--secondary{color:var(--eui-base-color-grey-75)}.eui-button--basic.eui-button--secondary .eui-icon-svg>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75)}.eui-button--basic.eui-button--secondary:active,.eui-button--basic.eui-button--secondary:focus,.eui-button--basic.eui-button--secondary:hover{background-color:var(--eui-base-color-grey-10)}.eui-button--basic.eui-button--info{color:var(--eui-base-color-info-100)}.eui-button--basic.eui-button--info .eui-icon-svg>svg{color:var(--eui-base-color-info-100);fill:var(--eui-base-color-info-100)}.eui-button--basic.eui-button--info:active,.eui-button--basic.eui-button--info:focus,.eui-button--basic.eui-button--info:hover{background-color:var(--eui-base-color-info-10)}.eui-button--basic.eui-button--success{color:var(--eui-base-color-success-100)}.eui-button--basic.eui-button--success .eui-icon-svg>svg{color:var(--eui-base-color-success-100);fill:var(--eui-base-color-success-100)}.eui-button--basic.eui-button--success:active,.eui-button--basic.eui-button--success:focus,.eui-button--basic.eui-button--success:hover{background-color:var(--eui-base-color-success-10)}.eui-button--basic.eui-button--warning{color:var(--eui-base-color-warning-140)}.eui-button--basic.eui-button--warning .eui-icon-svg>svg{color:var(--eui-base-color-warning-140);fill:var(--eui-base-color-warning-140)}.eui-button--basic.eui-button--warning:active,.eui-button--basic.eui-button--warning:focus,.eui-button--basic.eui-button--warning:hover{background-color:var(--eui-base-color-warning-10)}.eui-button--basic.eui-button--danger{color:var(--eui-base-color-danger-100)}.eui-button--basic.eui-button--danger .eui-icon-svg>svg{color:var(--eui-base-color-danger-100);fill:var(--eui-base-color-danger-100)}.eui-button--basic.eui-button--danger:active,.eui-button--basic.eui-button--danger:focus,.eui-button--basic.eui-button--danger:hover{background-color:var(--eui-base-color-danger-10)}.eui-button--outline{background-color:var(--eui-base-color-white)}.eui-button--outline:active,.eui-button--outline:focus,.eui-button--outline:hover{background-color:var(--eui-base-color-grey-5)}.eui-button--outline.eui-button--primary{border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-button--outline.eui-button--primary .eui-icon-svg>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100)}.eui-button--outline.eui-button--primary:active,.eui-button--outline.eui-button--primary:focus,.eui-button--outline.eui-button--primary:hover{background-color:var(--eui-base-color-primary-100);border-color:var(--eui-base-color-primary-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--primary:active .eui-icon-svg>svg,.eui-button--outline.eui-button--primary:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--primary:hover .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--secondary{border-color:var(--eui-base-color-grey-50);color:var(--eui-base-color-grey-75)}.eui-button--outline.eui-button--secondary .eui-icon-svg>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75)}.eui-button--outline.eui-button--secondary:active,.eui-button--outline.eui-button--secondary:focus,.eui-button--outline.eui-button--secondary:hover{background-color:var(--eui-base-color-grey-25)}.eui-button--outline.eui-button--info{border-color:var(--eui-base-color-info-100);color:var(--eui-base-color-info-100)}.eui-button--outline.eui-button--info .eui-icon-svg>svg{color:var(--eui-base-color-info-100);fill:var(--eui-base-color-info-100)}.eui-button--outline.eui-button--info:active,.eui-button--outline.eui-button--info:focus,.eui-button--outline.eui-button--info:hover{background-color:var(--eui-base-color-info-100);border-color:var(--eui-base-color-info-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--info:active .eui-icon-svg>svg,.eui-button--outline.eui-button--info:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--info:hover .eui-icon-svg>svg{fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--success{border-color:var(--eui-base-color-success-100);color:var(--eui-base-color-success-100)}.eui-button--outline.eui-button--success .eui-icon-svg>svg{color:var(--eui-base-color-success-100);fill:var(--eui-base-color-success-100)}.eui-button--outline.eui-button--success:active,.eui-button--outline.eui-button--success:focus,.eui-button--outline.eui-button--success:hover{background-color:var(--eui-base-color-success-100);border-color:var(--eui-base-color-success-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--success:active .eui-icon-svg>svg,.eui-button--outline.eui-button--success:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--success:hover .eui-icon-svg>svg{fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--warning{border-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-warning-140)}.eui-button--outline.eui-button--warning .eui-icon-svg>svg{color:var(--eui-base-color-warning-140);fill:var(--eui-base-color-warning-140)}.eui-button--outline.eui-button--warning:active,.eui-button--outline.eui-button--warning:focus,.eui-button--outline.eui-button--warning:hover{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-120);color:var(--eui-base-color-black)}.eui-button--outline.eui-button--warning:active .eui-icon-svg>svg,.eui-button--outline.eui-button--warning:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--warning:hover .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--outline.eui-button--danger{border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-danger-100)}.eui-button--outline.eui-button--danger .eui-icon-svg>svg{color:var(--eui-base-color-danger-100);fill:var(--eui-base-color-danger-100)}.eui-button--outline.eui-button--danger:active,.eui-button--outline.eui-button--danger:focus,.eui-button--outline.eui-button--danger:hover{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--danger:active .eui-icon-svg>svg,.eui-button--outline.eui-button--danger:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--danger:hover .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--accent{border-color:var(--eui-base-color-accent-120);color:var(--eui-base-color-black)}.eui-button--outline.eui-button--accent .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--outline.eui-button--accent:active,.eui-button--outline.eui-button--accent:focus,.eui-button--outline.eui-button--accent:hover{background-color:var(--eui-base-color-accent-110);border-color:var(--eui-base-color-accent-120);color:var(--eui-base-color-black);outline-color:var(--eui-base-color-grey-100)}.eui-button--outline.eui-button--accent:active .eui-icon-svg>svg,.eui-button--outline.eui-button--accent:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--accent:hover .eui-icon-svg>svg{fill:var(--eui-base-color-black)}.eui-button--accent{background-color:var(--eui-base-color-accent-100);border-color:var(--eui-base-color-accent-120);color:var(--eui-base-color-black)}.eui-button--accent:hover{background-color:var(--eui-base-color-accent-110)}.eui-button--rounded{border-radius:50%}.eui-button--rounded:active,.eui-button--rounded:focus{border-radius:50%}.eui-button--rounded:active:active:not([readonly]),.eui-button--rounded:active:focus:not([readonly]),.eui-button--rounded:focus:active:not([readonly]),.eui-button--rounded:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button--rounded:active [tabindex=\"0\"]:active:not([readonly]),.eui-button--rounded:active [tabindex=\"0\"]:focus:not([readonly]),.eui-button--rounded:focus [tabindex=\"0\"]:active:not([readonly]),.eui-button--rounded:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button--responsive{display:grid;position:relative;width:100%}.eui-button--responsive .eui-button__container{overflow:hidden}.eui-button--responsive .eui-button__container>label,.eui-button--responsive .eui-button__container>.eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-button--responsive .eui-button__container .eui-icon{overflow:visible}.eui-button--block{display:block;width:100%}.eui-button--line-wrap{line-height:var(--eui-base-line-height);padding:var(--eui-base-spacing-s);white-space:normal}.eui-button--expand-toggle{background:var(--eui-base-color-white);border-color:transparent;border-radius:0 0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs);min-height:var(--eui-base-spacing-m);padding:0 var(--eui-base-spacing-xl);box-shadow:var(--eui-base-shadow-1)}.eui-button--expand-toggle:hover,.eui-button--expand-toggle:focus{box-shadow:var(--eui-base-shadow-3)}.eui-button--expand-toggle .eui-icon{color:var(--eui-base-color-grey-80);font-size:var(--eui-base-font-size-l)}.eui-button.disabled,.eui-button:disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed;opacity:var(--eui-base-disabled-opacity)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.EuiIconComponent, selector: "div[euiIcon], span[euiIcon], i[euiIcon], eui-icon", inputs: ["aria-label", "iconClass", "isLoading"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.0-rc.1", type: EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: { e2eAttr: "e2eAttr", id: "id", euiBasicButton: "euiBasicButton", euiButtonCall: "euiButtonCall", euiBlockButton: "euiBlockButton", isLoading: "isLoading", euiIconButton: "euiIconButton", euiLineWrap: "euiLineWrap" }, outputs: { buttonClick: "buttonClick" }, host: { listeners: { "click": "onClick()" }, properties: { "class": "this.cssClasses", "attr.data-e2e": "this.e2eAttr" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<span class=\"eui-button__container\">\n    <span *ngIf=\"isLoading\" class=\"eui-button__loading-icon\">\n        <eui-icon [isLoading]=\"true\"></eui-icon>\n    </span>\n    <ng-content></ng-content>\n</span>\n", styles: ["button,html [type=button],[type=reset],[type=submit]{-webkit-appearance:none;appearance:none}.eui-button{align-items:center;background-color:var(--eui-base-color-white);background-image:none;border:none;border-radius:var(--eui-base-border-radius);box-shadow:var(--eui-app-box-shadow);box-sizing:border-box;cursor:pointer;display:inline-flex;flex-shrink:0;justify-content:center;min-height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs));min-width:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs));outline:none;padding:calc(var(--eui-base-spacing-s) - 1px) var(--eui-base-spacing-m);text-transform:none;transition:none;vertical-align:middle;white-space:nowrap;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-button:active:not([readonly]),.eui-button:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-1px;transition:none}.eui-button [tabindex=\"0\"]:active:not([readonly]),.eui-button [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-1px;transition:none}.eui-button .eui-button__container{align-items:center;display:inline-flex;position:relative}.eui-button .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button .eui-button__container .eui-icon:first-child:not(.eui-icon--loading),.eui-button .eui-button__container>.eui-icon:not(.eui-icon--loading){margin-right:var(--eui-base-spacing-xs)}.eui-button .eui-button__container .eui-icon:first-child:not(.eui-icon--loading):not(.eui-button--icon-only),.eui-button .eui-button__container>.eui-icon:not(.eui-icon--loading):not(.eui-button--icon-only){margin-left:0}.eui-button .eui-button__container .eui-icon:last-child:not(.eui-icon--loading){margin-left:var(--eui-base-spacing-xs)}.eui-button .eui-button__container .eui-icon:last-child:not(.eui-icon--loading):not(.eui-button--icon-only){margin-right:0}.eui-button .eui-button__container .eui-label+.eui-badge{margin-left:var(--eui-base-spacing-s);max-height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-button .eui-button__container .eui-label+.eui-icon{margin-left:var(--eui-base-spacing-s)}.eui-button--icon-only{padding:calc(var(--eui-base-spacing-xs) - 1px)}.eui-button .eui-button__loading-icon{align-items:center;display:inline-flex}.eui-button .eui-button__loading-icon .eui-icon.eui-icon--loading{margin-right:var(--eui-base-spacing-xl)}.eui-button-fixed{bottom:var(--eui-base-spacing-3xl);position:fixed;right:var(--eui-base-spacing-xl);z-index:calc(var(--eui-base-z-index-btn-floating) + 1)}.eui-button-fixed:active:not([readonly]),.eui-button-fixed:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button-fixed [tabindex=\"0\"]:active:not([readonly]),.eui-button-fixed [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button-floating{align-items:center;border-radius:100%;display:inline-flex;height:var(--eui-base-spacing-3xl);overflow:hidden;padding:0;position:relative;transform:translateY(35%);transition:.3s;vertical-align:middle;width:var(--eui-base-spacing-3xl);z-index:1;box-shadow:var(--eui-base-shadow-2)}.eui-button-floating:hover{cursor:pointer;box-shadow:var(--eui-base-shadow-3)}.eui-button-floating .eui-icon{display:inline-block;font-size:var(--eui-base-font-size-3xl);text-align:center;width:inherit}.eui-button-floating:before{border-radius:0}a.eui-button{text-decoration:none}a.eui-button:active:not([readonly]),a.eui-button:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}a.eui-button [tabindex=\"0\"]:active:not([readonly]),a.eui-button [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}a.eui-button:hover,a.eui-button:focus,a.eui-button:active{text-decoration:none}a.eui-button.eui-button--primary:hover,a.eui-button.eui-button--info:hover,a.eui-button.eui-button--success:hover,a.eui-button.eui-button--danger:hover{color:var(--eui-base-color-white)}a.eui-button.eui-button--accent:hover,a.eui-button.eui-button--secondary:hover,a.eui-button.eui-button--warning:hover{color:var(--eui-base-color-text)}.eui-button__expand-trigger{border-top:1px solid var(--eui-base-color-grey-15);cursor:pointer;display:flex;justify-content:center;width:100%;z-index:1;margin-bottom:var(--eui-base-spacing-l)}.eui-button__expand-trigger:hover .eui-button--expand-toggle{box-shadow:var(--eui-base-shadow-3)}.eui-button__expand-trigger--collapsed{margin-top:var(--eui-base-spacing-s)}.eui-button__expand-trigger .eui-label+.eui-icon,.eui-button__expand-trigger .eui-icon+.eui-label{margin-left:var(--eui-base-spacing-s)}.eui-split-button{align-items:center;display:inline-flex;position:relative}.eui-split-button--disabled,.eui-split-button:disabled{pointer-events:none}.eui-split-button button{border-radius:var(--eui-base-border-radius) 0 0 var(--eui-base-border-radius);cursor:pointer}.eui-split-button .eui-dropdown button{border-radius:0 var(--eui-base-border-radius) var(--eui-base-border-radius) 0;margin-left:-1px}.eui-dropdown-button{align-items:center;display:inline-flex;flex-shrink:0;justify-content:center;position:relative}.eui-dropdown-button--disabled,.eui-dropdown-button:disabled{pointer-events:none}.eui-button--size-xs{height:calc(1.7505 * var(--eui-base-spacing-m));min-height:calc(1.7505 * var(--eui-base-spacing-m));min-width:calc(1.7505 * var(--eui-base-spacing-m));padding:0 var(--eui-base-spacing-s)}.eui-button--size-xs .eui-button__container{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-button--size-xs .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button--size-xs.eui-button--icon-only{padding:0}.eui-button--size-s{height:calc(2 * var(--eui-base-spacing-m));min-height:calc(2 * var(--eui-base-spacing-m));min-width:calc(2 * var(--eui-base-spacing-m));padding:0 var(--eui-base-spacing-s)}.eui-button--size-s .eui-button__container{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-button--size-s .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button--size-s.eui-button--icon-only{padding:0}.eui-button--size-m .eui-button__container{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-button--size-m .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button--size-l{height:calc(3.25 * var(--eui-base-spacing-m));min-height:calc(3.25 * var(--eui-base-spacing-m));min-width:calc(3.25 * var(--eui-base-spacing-m))}.eui-button--size-l .eui-button__container{font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.eui-button--size-l .eui-button__container .eui-label+.eui-badge{max-height:inherit}.eui-button--size-l .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-2xl)}.eui-button .eui-icon-svg--size-l{height:1.5rem;width:1.5rem}.eui-button .eui-icon-svg--size-m{height:1.25rem;width:1.25rem}.eui-button .eui-icon-svg--size-s{height:1rem;width:1rem}.eui-button{border:1px solid var(--eui-base-color-grey-100);color:var(--eui-base-color-grey-100)}.eui-button:hover{background-color:var(--eui-base-color-grey-5)}.eui-button--primary{background-color:var(--eui-base-color-primary-100);border-color:var(--eui-base-color-primary-120);color:var(--eui-base-color-white)}.eui-button--primary .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--primary:hover{background-color:var(--eui-base-color-primary-110)}.eui-button--primary--darker{background-color:var(--eui-base-color-primary-120);border-color:var(--eui-base-color-primary-120);color:var(--eui-base-color-white)}.eui-button--primary--darker:hover{background-color:var(--eui-base-color-primary-130)}.eui-button--secondary{background-color:var(--eui-base-color-grey-15);border-color:var(--eui-base-color-grey-50);color:var(--eui-base-color-grey-100)}.eui-button--secondary .eui-icon-svg>svg{color:var(--eui-base-grey-75);fill:var(--eui-base-grey-75)}.eui-button--secondary:hover{background-color:var(--eui-base-color-grey-25)}.eui-button--secondary--darker{background-color:var(--eui-base-color-grey-25);border-color:var(--eui-base-color-grey-50);color:var(--eui-base-color-grey-100)}.eui-button--secondary--darker:hover{background-color:var(--eui-base-color-grey-50)}.eui-button--info{background-color:var(--eui-base-color-info-100);border-color:var(--eui-base-color-info-120);color:var(--eui-base-color-white)}.eui-button--info .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--info:hover{background-color:var(--eui-base-color-info-110)}.eui-button--info--darker{background-color:var(--eui-base-color-info-120);border-color:var(--eui-base-color-info-120);color:var(--eui-base-color-white)}.eui-button--info--darker:hover{background-color:var(--eui-base-color-info-130)}.eui-button--success{background-color:var(--eui-base-color-success-100);border-color:var(--eui-base-color-success-120);color:var(--eui-base-color-white)}.eui-button--success .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--success:hover{background-color:var(--eui-base-color-success-110)}.eui-button--success--darker{background-color:var(--eui-base-color-success-120);border-color:var(--eui-base-color-success-120);color:var(--eui-base-color-white)}.eui-button--success--darker:hover{background-color:var(--eui-base-color-success-130)}.eui-button--warning{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-120);color:var(--eui-base-color-black)}.eui-button--warning .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--warning:hover{background-color:var(--eui-base-color-warning-110)}.eui-button--warning--darker{background-color:var(--eui-base-color-warning-120);border-color:var(--eui-base-color-warning-120);color:var(--eui-base-color-white)}.eui-button--warning--darker:hover{background-color:var(--eui-base-color-warning-130)}.eui-button--danger{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-120);color:var(--eui-base-color-white)}.eui-button--danger .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--danger:hover{background-color:var(--eui-base-color-danger-110)}.eui-button--danger--darker{background-color:var(--eui-base-color-danger-120);border-color:var(--eui-base-color-danger-120);color:var(--eui-base-color-white)}.eui-button--danger--darker:hover{background-color:var(--eui-base-color-danger-130)}.eui-button--accent .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--accent:active,.eui-button--accent:focus,.eui-button--accent:hover{background-color:var(--eui-base-color-accent-110);border-color:var(--eui-base-color-grey-100);color:var(--eui-base-color-black);outline-color:var(--eui-base-color-grey-100)}.eui-button--basic{background-color:transparent;border:1px solid transparent}.eui-button--basic:active,.eui-button--basic:focus,.eui-button--basic:hover{background-color:var(--eui-base-color-grey-5)}.eui-button--basic.eui-button--primary{color:var(--eui-base-color-primary-100)}.eui-button--basic.eui-button--primary .eui-icon-svg>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100)}.eui-button--basic.eui-button--primary:active,.eui-button--basic.eui-button--primary:focus,.eui-button--basic.eui-button--primary:hover{background-color:var(--eui-base-color-primary-10)}.eui-button--basic.eui-button--secondary{color:var(--eui-base-color-grey-75)}.eui-button--basic.eui-button--secondary .eui-icon-svg>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75)}.eui-button--basic.eui-button--secondary:active,.eui-button--basic.eui-button--secondary:focus,.eui-button--basic.eui-button--secondary:hover{background-color:var(--eui-base-color-grey-10)}.eui-button--basic.eui-button--info{color:var(--eui-base-color-info-100)}.eui-button--basic.eui-button--info .eui-icon-svg>svg{color:var(--eui-base-color-info-100);fill:var(--eui-base-color-info-100)}.eui-button--basic.eui-button--info:active,.eui-button--basic.eui-button--info:focus,.eui-button--basic.eui-button--info:hover{background-color:var(--eui-base-color-info-10)}.eui-button--basic.eui-button--success{color:var(--eui-base-color-success-100)}.eui-button--basic.eui-button--success .eui-icon-svg>svg{color:var(--eui-base-color-success-100);fill:var(--eui-base-color-success-100)}.eui-button--basic.eui-button--success:active,.eui-button--basic.eui-button--success:focus,.eui-button--basic.eui-button--success:hover{background-color:var(--eui-base-color-success-10)}.eui-button--basic.eui-button--warning{color:var(--eui-base-color-warning-140)}.eui-button--basic.eui-button--warning .eui-icon-svg>svg{color:var(--eui-base-color-warning-140);fill:var(--eui-base-color-warning-140)}.eui-button--basic.eui-button--warning:active,.eui-button--basic.eui-button--warning:focus,.eui-button--basic.eui-button--warning:hover{background-color:var(--eui-base-color-warning-10)}.eui-button--basic.eui-button--danger{color:var(--eui-base-color-danger-100)}.eui-button--basic.eui-button--danger .eui-icon-svg>svg{color:var(--eui-base-color-danger-100);fill:var(--eui-base-color-danger-100)}.eui-button--basic.eui-button--danger:active,.eui-button--basic.eui-button--danger:focus,.eui-button--basic.eui-button--danger:hover{background-color:var(--eui-base-color-danger-10)}.eui-button--outline{background-color:var(--eui-base-color-white)}.eui-button--outline:active,.eui-button--outline:focus,.eui-button--outline:hover{background-color:var(--eui-base-color-grey-5)}.eui-button--outline.eui-button--primary{border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-button--outline.eui-button--primary .eui-icon-svg>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100)}.eui-button--outline.eui-button--primary:active,.eui-button--outline.eui-button--primary:focus,.eui-button--outline.eui-button--primary:hover{background-color:var(--eui-base-color-primary-100);border-color:var(--eui-base-color-primary-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--primary:active .eui-icon-svg>svg,.eui-button--outline.eui-button--primary:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--primary:hover .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--secondary{border-color:var(--eui-base-color-grey-50);color:var(--eui-base-color-grey-75)}.eui-button--outline.eui-button--secondary .eui-icon-svg>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75)}.eui-button--outline.eui-button--secondary:active,.eui-button--outline.eui-button--secondary:focus,.eui-button--outline.eui-button--secondary:hover{background-color:var(--eui-base-color-grey-25)}.eui-button--outline.eui-button--info{border-color:var(--eui-base-color-info-100);color:var(--eui-base-color-info-100)}.eui-button--outline.eui-button--info .eui-icon-svg>svg{color:var(--eui-base-color-info-100);fill:var(--eui-base-color-info-100)}.eui-button--outline.eui-button--info:active,.eui-button--outline.eui-button--info:focus,.eui-button--outline.eui-button--info:hover{background-color:var(--eui-base-color-info-100);border-color:var(--eui-base-color-info-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--info:active .eui-icon-svg>svg,.eui-button--outline.eui-button--info:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--info:hover .eui-icon-svg>svg{fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--success{border-color:var(--eui-base-color-success-100);color:var(--eui-base-color-success-100)}.eui-button--outline.eui-button--success .eui-icon-svg>svg{color:var(--eui-base-color-success-100);fill:var(--eui-base-color-success-100)}.eui-button--outline.eui-button--success:active,.eui-button--outline.eui-button--success:focus,.eui-button--outline.eui-button--success:hover{background-color:var(--eui-base-color-success-100);border-color:var(--eui-base-color-success-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--success:active .eui-icon-svg>svg,.eui-button--outline.eui-button--success:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--success:hover .eui-icon-svg>svg{fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--warning{border-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-warning-140)}.eui-button--outline.eui-button--warning .eui-icon-svg>svg{color:var(--eui-base-color-warning-140);fill:var(--eui-base-color-warning-140)}.eui-button--outline.eui-button--warning:active,.eui-button--outline.eui-button--warning:focus,.eui-button--outline.eui-button--warning:hover{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-120);color:var(--eui-base-color-black)}.eui-button--outline.eui-button--warning:active .eui-icon-svg>svg,.eui-button--outline.eui-button--warning:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--warning:hover .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--outline.eui-button--danger{border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-danger-100)}.eui-button--outline.eui-button--danger .eui-icon-svg>svg{color:var(--eui-base-color-danger-100);fill:var(--eui-base-color-danger-100)}.eui-button--outline.eui-button--danger:active,.eui-button--outline.eui-button--danger:focus,.eui-button--outline.eui-button--danger:hover{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--danger:active .eui-icon-svg>svg,.eui-button--outline.eui-button--danger:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--danger:hover .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--accent{border-color:var(--eui-base-color-accent-120);color:var(--eui-base-color-black)}.eui-button--outline.eui-button--accent .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--outline.eui-button--accent:active,.eui-button--outline.eui-button--accent:focus,.eui-button--outline.eui-button--accent:hover{background-color:var(--eui-base-color-accent-110);border-color:var(--eui-base-color-accent-120);color:var(--eui-base-color-black);outline-color:var(--eui-base-color-grey-100)}.eui-button--outline.eui-button--accent:active .eui-icon-svg>svg,.eui-button--outline.eui-button--accent:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--accent:hover .eui-icon-svg>svg{fill:var(--eui-base-color-black)}.eui-button--accent{background-color:var(--eui-base-color-accent-100);border-color:var(--eui-base-color-accent-120);color:var(--eui-base-color-black)}.eui-button--accent:hover{background-color:var(--eui-base-color-accent-110)}.eui-button--rounded{border-radius:50%}.eui-button--rounded:active,.eui-button--rounded:focus{border-radius:50%}.eui-button--rounded:active:active:not([readonly]),.eui-button--rounded:active:focus:not([readonly]),.eui-button--rounded:focus:active:not([readonly]),.eui-button--rounded:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button--rounded:active [tabindex=\"0\"]:active:not([readonly]),.eui-button--rounded:active [tabindex=\"0\"]:focus:not([readonly]),.eui-button--rounded:focus [tabindex=\"0\"]:active:not([readonly]),.eui-button--rounded:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button--responsive{display:grid;position:relative;width:100%}.eui-button--responsive .eui-button__container{overflow:hidden}.eui-button--responsive .eui-button__container>label,.eui-button--responsive .eui-button__container>.eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-button--responsive .eui-button__container .eui-icon{overflow:visible}.eui-button--block{display:block;width:100%}.eui-button--line-wrap{line-height:var(--eui-base-line-height);padding:var(--eui-base-spacing-s);white-space:normal}.eui-button--expand-toggle{background:var(--eui-base-color-white);border-color:transparent;border-radius:0 0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs);min-height:var(--eui-base-spacing-m);padding:0 var(--eui-base-spacing-xl);box-shadow:var(--eui-base-shadow-1)}.eui-button--expand-toggle:hover,.eui-button--expand-toggle:focus{box-shadow:var(--eui-base-shadow-3)}.eui-button--expand-toggle .eui-icon{color:var(--eui-base-color-grey-80);font-size:var(--eui-base-font-size-l)}.eui-button.disabled,.eui-button:disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-base-disabled-opacity)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.EuiIconComponent, selector: "div[euiIcon], span[euiIcon], i[euiIcon], eui-icon", inputs: ["aria-label", "iconClass", "isLoading"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0-rc.1", ngImport: i0, type: EuiButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'button[euiButton], a[euiButton]', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<span class=\"eui-button__container\">\n    <span *ngIf=\"isLoading\" class=\"eui-button__loading-icon\">\n        <eui-icon [isLoading]=\"true\"></eui-icon>\n    </span>\n    <ng-content></ng-content>\n</span>\n", styles: ["button,html [type=button],[type=reset],[type=submit]{-webkit-appearance:none;appearance:none}.eui-button{align-items:center;background-color:var(--eui-base-color-white);background-image:none;border:none;border-radius:var(--eui-base-border-radius);box-shadow:var(--eui-app-box-shadow);box-sizing:border-box;cursor:pointer;display:inline-flex;flex-shrink:0;justify-content:center;min-height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs));min-width:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs));outline:none;padding:calc(var(--eui-base-spacing-s) - 1px) var(--eui-base-spacing-m);text-transform:none;transition:none;vertical-align:middle;white-space:nowrap;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-button:active:not([readonly]),.eui-button:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-1px;transition:none}.eui-button [tabindex=\"0\"]:active:not([readonly]),.eui-button [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-1px;transition:none}.eui-button .eui-button__container{align-items:center;display:inline-flex;position:relative}.eui-button .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button .eui-button__container .eui-icon:first-child:not(.eui-icon--loading),.eui-button .eui-button__container>.eui-icon:not(.eui-icon--loading){margin-right:var(--eui-base-spacing-xs)}.eui-button .eui-button__container .eui-icon:first-child:not(.eui-icon--loading):not(.eui-button--icon-only),.eui-button .eui-button__container>.eui-icon:not(.eui-icon--loading):not(.eui-button--icon-only){margin-left:0}.eui-button .eui-button__container .eui-icon:last-child:not(.eui-icon--loading){margin-left:var(--eui-base-spacing-xs)}.eui-button .eui-button__container .eui-icon:last-child:not(.eui-icon--loading):not(.eui-button--icon-only){margin-right:0}.eui-button .eui-button__container .eui-label+.eui-badge{margin-left:var(--eui-base-spacing-s);max-height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-button .eui-button__container .eui-label+.eui-icon{margin-left:var(--eui-base-spacing-s)}.eui-button--icon-only{padding:calc(var(--eui-base-spacing-xs) - 1px)}.eui-button .eui-button__loading-icon{align-items:center;display:inline-flex}.eui-button .eui-button__loading-icon .eui-icon.eui-icon--loading{margin-right:var(--eui-base-spacing-xl)}.eui-button-fixed{bottom:var(--eui-base-spacing-3xl);position:fixed;right:var(--eui-base-spacing-xl);z-index:calc(var(--eui-base-z-index-btn-floating) + 1)}.eui-button-fixed:active:not([readonly]),.eui-button-fixed:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button-fixed [tabindex=\"0\"]:active:not([readonly]),.eui-button-fixed [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button-floating{align-items:center;border-radius:100%;display:inline-flex;height:var(--eui-base-spacing-3xl);overflow:hidden;padding:0;position:relative;transform:translateY(35%);transition:.3s;vertical-align:middle;width:var(--eui-base-spacing-3xl);z-index:1;box-shadow:var(--eui-base-shadow-2)}.eui-button-floating:hover{cursor:pointer;box-shadow:var(--eui-base-shadow-3)}.eui-button-floating .eui-icon{display:inline-block;font-size:var(--eui-base-font-size-3xl);text-align:center;width:inherit}.eui-button-floating:before{border-radius:0}a.eui-button{text-decoration:none}a.eui-button:active:not([readonly]),a.eui-button:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}a.eui-button [tabindex=\"0\"]:active:not([readonly]),a.eui-button [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}a.eui-button:hover,a.eui-button:focus,a.eui-button:active{text-decoration:none}a.eui-button.eui-button--primary:hover,a.eui-button.eui-button--info:hover,a.eui-button.eui-button--success:hover,a.eui-button.eui-button--danger:hover{color:var(--eui-base-color-white)}a.eui-button.eui-button--accent:hover,a.eui-button.eui-button--secondary:hover,a.eui-button.eui-button--warning:hover{color:var(--eui-base-color-text)}.eui-button__expand-trigger{border-top:1px solid var(--eui-base-color-grey-15);cursor:pointer;display:flex;justify-content:center;width:100%;z-index:1;margin-bottom:var(--eui-base-spacing-l)}.eui-button__expand-trigger:hover .eui-button--expand-toggle{box-shadow:var(--eui-base-shadow-3)}.eui-button__expand-trigger--collapsed{margin-top:var(--eui-base-spacing-s)}.eui-button__expand-trigger .eui-label+.eui-icon,.eui-button__expand-trigger .eui-icon+.eui-label{margin-left:var(--eui-base-spacing-s)}.eui-split-button{align-items:center;display:inline-flex;position:relative}.eui-split-button--disabled,.eui-split-button:disabled{pointer-events:none}.eui-split-button button{border-radius:var(--eui-base-border-radius) 0 0 var(--eui-base-border-radius);cursor:pointer}.eui-split-button .eui-dropdown button{border-radius:0 var(--eui-base-border-radius) var(--eui-base-border-radius) 0;margin-left:-1px}.eui-dropdown-button{align-items:center;display:inline-flex;flex-shrink:0;justify-content:center;position:relative}.eui-dropdown-button--disabled,.eui-dropdown-button:disabled{pointer-events:none}.eui-button--size-xs{height:calc(1.7505 * var(--eui-base-spacing-m));min-height:calc(1.7505 * var(--eui-base-spacing-m));min-width:calc(1.7505 * var(--eui-base-spacing-m));padding:0 var(--eui-base-spacing-s)}.eui-button--size-xs .eui-button__container{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-button--size-xs .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button--size-xs.eui-button--icon-only{padding:0}.eui-button--size-s{height:calc(2 * var(--eui-base-spacing-m));min-height:calc(2 * var(--eui-base-spacing-m));min-width:calc(2 * var(--eui-base-spacing-m));padding:0 var(--eui-base-spacing-s)}.eui-button--size-s .eui-button__container{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-button--size-s .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button--size-s.eui-button--icon-only{padding:0}.eui-button--size-m .eui-button__container{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-button--size-m .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button--size-l{height:calc(3.25 * var(--eui-base-spacing-m));min-height:calc(3.25 * var(--eui-base-spacing-m));min-width:calc(3.25 * var(--eui-base-spacing-m))}.eui-button--size-l .eui-button__container{font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.eui-button--size-l .eui-button__container .eui-label+.eui-badge{max-height:inherit}.eui-button--size-l .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-2xl)}.eui-button .eui-icon-svg--size-l{height:1.5rem;width:1.5rem}.eui-button .eui-icon-svg--size-m{height:1.25rem;width:1.25rem}.eui-button .eui-icon-svg--size-s{height:1rem;width:1rem}.eui-button{border:1px solid var(--eui-base-color-grey-100);color:var(--eui-base-color-grey-100)}.eui-button:hover{background-color:var(--eui-base-color-grey-5)}.eui-button--primary{background-color:var(--eui-base-color-primary-100);border-color:var(--eui-base-color-primary-120);color:var(--eui-base-color-white)}.eui-button--primary .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--primary:hover{background-color:var(--eui-base-color-primary-110)}.eui-button--primary--darker{background-color:var(--eui-base-color-primary-120);border-color:var(--eui-base-color-primary-120);color:var(--eui-base-color-white)}.eui-button--primary--darker:hover{background-color:var(--eui-base-color-primary-130)}.eui-button--secondary{background-color:var(--eui-base-color-grey-15);border-color:var(--eui-base-color-grey-50);color:var(--eui-base-color-grey-100)}.eui-button--secondary .eui-icon-svg>svg{color:var(--eui-base-grey-75);fill:var(--eui-base-grey-75)}.eui-button--secondary:hover{background-color:var(--eui-base-color-grey-25)}.eui-button--secondary--darker{background-color:var(--eui-base-color-grey-25);border-color:var(--eui-base-color-grey-50);color:var(--eui-base-color-grey-100)}.eui-button--secondary--darker:hover{background-color:var(--eui-base-color-grey-50)}.eui-button--info{background-color:var(--eui-base-color-info-100);border-color:var(--eui-base-color-info-120);color:var(--eui-base-color-white)}.eui-button--info .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--info:hover{background-color:var(--eui-base-color-info-110)}.eui-button--info--darker{background-color:var(--eui-base-color-info-120);border-color:var(--eui-base-color-info-120);color:var(--eui-base-color-white)}.eui-button--info--darker:hover{background-color:var(--eui-base-color-info-130)}.eui-button--success{background-color:var(--eui-base-color-success-100);border-color:var(--eui-base-color-success-120);color:var(--eui-base-color-white)}.eui-button--success .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--success:hover{background-color:var(--eui-base-color-success-110)}.eui-button--success--darker{background-color:var(--eui-base-color-success-120);border-color:var(--eui-base-color-success-120);color:var(--eui-base-color-white)}.eui-button--success--darker:hover{background-color:var(--eui-base-color-success-130)}.eui-button--warning{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-120);color:var(--eui-base-color-black)}.eui-button--warning .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--warning:hover{background-color:var(--eui-base-color-warning-110)}.eui-button--warning--darker{background-color:var(--eui-base-color-warning-120);border-color:var(--eui-base-color-warning-120);color:var(--eui-base-color-black)}.eui-button--warning--darker:hover{background-color:var(--eui-base-color-warning-130)}.eui-button--danger{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-120);color:var(--eui-base-color-white)}.eui-button--danger .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--danger:hover{background-color:var(--eui-base-color-danger-110)}.eui-button--danger--darker{background-color:var(--eui-base-color-danger-120);border-color:var(--eui-base-color-danger-120);color:var(--eui-base-color-white)}.eui-button--danger--darker:hover{background-color:var(--eui-base-color-danger-130)}.eui-button--accent .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--accent:active,.eui-button--accent:focus,.eui-button--accent:hover{background-color:var(--eui-base-color-accent-110);border-color:var(--eui-base-color-grey-100);color:var(--eui-base-color-black);outline-color:var(--eui-base-color-grey-100)}.eui-button--basic{background-color:transparent;border:1px solid transparent}.eui-button--basic:active,.eui-button--basic:focus,.eui-button--basic:hover{background-color:var(--eui-base-color-grey-5)}.eui-button--basic.eui-button--primary{color:var(--eui-base-color-primary-100)}.eui-button--basic.eui-button--primary .eui-icon-svg>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100)}.eui-button--basic.eui-button--primary:active,.eui-button--basic.eui-button--primary:focus,.eui-button--basic.eui-button--primary:hover{background-color:var(--eui-base-color-primary-10)}.eui-button--basic.eui-button--secondary{color:var(--eui-base-color-grey-75)}.eui-button--basic.eui-button--secondary .eui-icon-svg>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75)}.eui-button--basic.eui-button--secondary:active,.eui-button--basic.eui-button--secondary:focus,.eui-button--basic.eui-button--secondary:hover{background-color:var(--eui-base-color-grey-10)}.eui-button--basic.eui-button--info{color:var(--eui-base-color-info-100)}.eui-button--basic.eui-button--info .eui-icon-svg>svg{color:var(--eui-base-color-info-100);fill:var(--eui-base-color-info-100)}.eui-button--basic.eui-button--info:active,.eui-button--basic.eui-button--info:focus,.eui-button--basic.eui-button--info:hover{background-color:var(--eui-base-color-info-10)}.eui-button--basic.eui-button--success{color:var(--eui-base-color-success-100)}.eui-button--basic.eui-button--success .eui-icon-svg>svg{color:var(--eui-base-color-success-100);fill:var(--eui-base-color-success-100)}.eui-button--basic.eui-button--success:active,.eui-button--basic.eui-button--success:focus,.eui-button--basic.eui-button--success:hover{background-color:var(--eui-base-color-success-10)}.eui-button--basic.eui-button--warning{color:var(--eui-base-color-warning-140)}.eui-button--basic.eui-button--warning .eui-icon-svg>svg{color:var(--eui-base-color-warning-140);fill:var(--eui-base-color-warning-140)}.eui-button--basic.eui-button--warning:active,.eui-button--basic.eui-button--warning:focus,.eui-button--basic.eui-button--warning:hover{background-color:var(--eui-base-color-warning-10)}.eui-button--basic.eui-button--danger{color:var(--eui-base-color-danger-100)}.eui-button--basic.eui-button--danger .eui-icon-svg>svg{color:var(--eui-base-color-danger-100);fill:var(--eui-base-color-danger-100)}.eui-button--basic.eui-button--danger:active,.eui-button--basic.eui-button--danger:focus,.eui-button--basic.eui-button--danger:hover{background-color:var(--eui-base-color-danger-10)}.eui-button--outline{background-color:var(--eui-base-color-white)}.eui-button--outline:active,.eui-button--outline:focus,.eui-button--outline:hover{background-color:var(--eui-base-color-grey-5)}.eui-button--outline.eui-button--primary{border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-button--outline.eui-button--primary .eui-icon-svg>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100)}.eui-button--outline.eui-button--primary:active,.eui-button--outline.eui-button--primary:focus,.eui-button--outline.eui-button--primary:hover{background-color:var(--eui-base-color-primary-100);border-color:var(--eui-base-color-primary-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--primary:active .eui-icon-svg>svg,.eui-button--outline.eui-button--primary:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--primary:hover .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--secondary{border-color:var(--eui-base-color-grey-50);color:var(--eui-base-color-grey-75)}.eui-button--outline.eui-button--secondary .eui-icon-svg>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75)}.eui-button--outline.eui-button--secondary:active,.eui-button--outline.eui-button--secondary:focus,.eui-button--outline.eui-button--secondary:hover{background-color:var(--eui-base-color-grey-25)}.eui-button--outline.eui-button--info{border-color:var(--eui-base-color-info-100);color:var(--eui-base-color-info-100)}.eui-button--outline.eui-button--info .eui-icon-svg>svg{color:var(--eui-base-color-info-100);fill:var(--eui-base-color-info-100)}.eui-button--outline.eui-button--info:active,.eui-button--outline.eui-button--info:focus,.eui-button--outline.eui-button--info:hover{background-color:var(--eui-base-color-info-100);border-color:var(--eui-base-color-info-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--info:active .eui-icon-svg>svg,.eui-button--outline.eui-button--info:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--info:hover .eui-icon-svg>svg{fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--success{border-color:var(--eui-base-color-success-100);color:var(--eui-base-color-success-100)}.eui-button--outline.eui-button--success .eui-icon-svg>svg{color:var(--eui-base-color-success-100);fill:var(--eui-base-color-success-100)}.eui-button--outline.eui-button--success:active,.eui-button--outline.eui-button--success:focus,.eui-button--outline.eui-button--success:hover{background-color:var(--eui-base-color-success-100);border-color:var(--eui-base-color-success-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--success:active .eui-icon-svg>svg,.eui-button--outline.eui-button--success:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--success:hover .eui-icon-svg>svg{fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--warning{border-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-warning-140)}.eui-button--outline.eui-button--warning .eui-icon-svg>svg{color:var(--eui-base-color-warning-140);fill:var(--eui-base-color-warning-140)}.eui-button--outline.eui-button--warning:active,.eui-button--outline.eui-button--warning:focus,.eui-button--outline.eui-button--warning:hover{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-120);color:var(--eui-base-color-black)}.eui-button--outline.eui-button--warning:active .eui-icon-svg>svg,.eui-button--outline.eui-button--warning:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--warning:hover .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--outline.eui-button--danger{border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-danger-100)}.eui-button--outline.eui-button--danger .eui-icon-svg>svg{color:var(--eui-base-color-danger-100);fill:var(--eui-base-color-danger-100)}.eui-button--outline.eui-button--danger:active,.eui-button--outline.eui-button--danger:focus,.eui-button--outline.eui-button--danger:hover{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--danger:active .eui-icon-svg>svg,.eui-button--outline.eui-button--danger:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--danger:hover .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--accent{border-color:var(--eui-base-color-accent-120);color:var(--eui-base-color-black)}.eui-button--outline.eui-button--accent .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--outline.eui-button--accent:active,.eui-button--outline.eui-button--accent:focus,.eui-button--outline.eui-button--accent:hover{background-color:var(--eui-base-color-accent-110);border-color:var(--eui-base-color-accent-120);color:var(--eui-base-color-black);outline-color:var(--eui-base-color-grey-100)}.eui-button--outline.eui-button--accent:active .eui-icon-svg>svg,.eui-button--outline.eui-button--accent:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--accent:hover .eui-icon-svg>svg{fill:var(--eui-base-color-black)}.eui-button--accent{background-color:var(--eui-base-color-accent-100);border-color:var(--eui-base-color-accent-120);color:var(--eui-base-color-black)}.eui-button--accent:hover{background-color:var(--eui-base-color-accent-110)}.eui-button--rounded{border-radius:50%}.eui-button--rounded:active,.eui-button--rounded:focus{border-radius:50%}.eui-button--rounded:active:active:not([readonly]),.eui-button--rounded:active:focus:not([readonly]),.eui-button--rounded:focus:active:not([readonly]),.eui-button--rounded:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button--rounded:active [tabindex=\"0\"]:active:not([readonly]),.eui-button--rounded:active [tabindex=\"0\"]:focus:not([readonly]),.eui-button--rounded:focus [tabindex=\"0\"]:active:not([readonly]),.eui-button--rounded:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button--responsive{display:grid;position:relative;width:100%}.eui-button--responsive .eui-button__container{overflow:hidden}.eui-button--responsive .eui-button__container>label,.eui-button--responsive .eui-button__container>.eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-button--responsive .eui-button__container .eui-icon{overflow:visible}.eui-button--block{display:block;width:100%}.eui-button--line-wrap{line-height:var(--eui-base-line-height);padding:var(--eui-base-spacing-s);white-space:normal}.eui-button--expand-toggle{background:var(--eui-base-color-white);border-color:transparent;border-radius:0 0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs);min-height:var(--eui-base-spacing-m);padding:0 var(--eui-base-spacing-xl);box-shadow:var(--eui-base-shadow-1)}.eui-button--expand-toggle:hover,.eui-button--expand-toggle:focus{box-shadow:var(--eui-base-shadow-3)}.eui-button--expand-toggle .eui-icon{color:var(--eui-base-color-grey-80);font-size:var(--eui-base-font-size-l)}.eui-button.disabled,.eui-button:disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed;opacity:var(--eui-base-disabled-opacity)}\n"] }]
+            args: [{ selector: 'button[euiButton], a[euiButton]', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<span class=\"eui-button__container\">\n    <span *ngIf=\"isLoading\" class=\"eui-button__loading-icon\">\n        <eui-icon [isLoading]=\"true\"></eui-icon>\n    </span>\n    <ng-content></ng-content>\n</span>\n", styles: ["button,html [type=button],[type=reset],[type=submit]{-webkit-appearance:none;appearance:none}.eui-button{align-items:center;background-color:var(--eui-base-color-white);background-image:none;border:none;border-radius:var(--eui-base-border-radius);box-shadow:var(--eui-app-box-shadow);box-sizing:border-box;cursor:pointer;display:inline-flex;flex-shrink:0;justify-content:center;min-height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs));min-width:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs));outline:none;padding:calc(var(--eui-base-spacing-s) - 1px) var(--eui-base-spacing-m);text-transform:none;transition:none;vertical-align:middle;white-space:nowrap;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-button:active:not([readonly]),.eui-button:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-1px;transition:none}.eui-button [tabindex=\"0\"]:active:not([readonly]),.eui-button [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-1px;transition:none}.eui-button .eui-button__container{align-items:center;display:inline-flex;position:relative}.eui-button .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button .eui-button__container .eui-icon:first-child:not(.eui-icon--loading),.eui-button .eui-button__container>.eui-icon:not(.eui-icon--loading){margin-right:var(--eui-base-spacing-xs)}.eui-button .eui-button__container .eui-icon:first-child:not(.eui-icon--loading):not(.eui-button--icon-only),.eui-button .eui-button__container>.eui-icon:not(.eui-icon--loading):not(.eui-button--icon-only){margin-left:0}.eui-button .eui-button__container .eui-icon:last-child:not(.eui-icon--loading){margin-left:var(--eui-base-spacing-xs)}.eui-button .eui-button__container .eui-icon:last-child:not(.eui-icon--loading):not(.eui-button--icon-only){margin-right:0}.eui-button .eui-button__container .eui-label+.eui-badge{margin-left:var(--eui-base-spacing-s);max-height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-button .eui-button__container .eui-label+.eui-icon{margin-left:var(--eui-base-spacing-s)}.eui-button--icon-only{padding:calc(var(--eui-base-spacing-xs) - 1px)}.eui-button .eui-button__loading-icon{align-items:center;display:inline-flex}.eui-button .eui-button__loading-icon .eui-icon.eui-icon--loading{margin-right:var(--eui-base-spacing-xl)}.eui-button-fixed{bottom:var(--eui-base-spacing-3xl);position:fixed;right:var(--eui-base-spacing-xl);z-index:calc(var(--eui-base-z-index-btn-floating) + 1)}.eui-button-fixed:active:not([readonly]),.eui-button-fixed:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button-fixed [tabindex=\"0\"]:active:not([readonly]),.eui-button-fixed [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button-floating{align-items:center;border-radius:100%;display:inline-flex;height:var(--eui-base-spacing-3xl);overflow:hidden;padding:0;position:relative;transform:translateY(35%);transition:.3s;vertical-align:middle;width:var(--eui-base-spacing-3xl);z-index:1;box-shadow:var(--eui-base-shadow-2)}.eui-button-floating:hover{cursor:pointer;box-shadow:var(--eui-base-shadow-3)}.eui-button-floating .eui-icon{display:inline-block;font-size:var(--eui-base-font-size-3xl);text-align:center;width:inherit}.eui-button-floating:before{border-radius:0}a.eui-button{text-decoration:none}a.eui-button:active:not([readonly]),a.eui-button:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}a.eui-button [tabindex=\"0\"]:active:not([readonly]),a.eui-button [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}a.eui-button:hover,a.eui-button:focus,a.eui-button:active{text-decoration:none}a.eui-button.eui-button--primary:hover,a.eui-button.eui-button--info:hover,a.eui-button.eui-button--success:hover,a.eui-button.eui-button--danger:hover{color:var(--eui-base-color-white)}a.eui-button.eui-button--accent:hover,a.eui-button.eui-button--secondary:hover,a.eui-button.eui-button--warning:hover{color:var(--eui-base-color-text)}.eui-button__expand-trigger{border-top:1px solid var(--eui-base-color-grey-15);cursor:pointer;display:flex;justify-content:center;width:100%;z-index:1;margin-bottom:var(--eui-base-spacing-l)}.eui-button__expand-trigger:hover .eui-button--expand-toggle{box-shadow:var(--eui-base-shadow-3)}.eui-button__expand-trigger--collapsed{margin-top:var(--eui-base-spacing-s)}.eui-button__expand-trigger .eui-label+.eui-icon,.eui-button__expand-trigger .eui-icon+.eui-label{margin-left:var(--eui-base-spacing-s)}.eui-split-button{align-items:center;display:inline-flex;position:relative}.eui-split-button--disabled,.eui-split-button:disabled{pointer-events:none}.eui-split-button button{border-radius:var(--eui-base-border-radius) 0 0 var(--eui-base-border-radius);cursor:pointer}.eui-split-button .eui-dropdown button{border-radius:0 var(--eui-base-border-radius) var(--eui-base-border-radius) 0;margin-left:-1px}.eui-dropdown-button{align-items:center;display:inline-flex;flex-shrink:0;justify-content:center;position:relative}.eui-dropdown-button--disabled,.eui-dropdown-button:disabled{pointer-events:none}.eui-button--size-xs{height:calc(1.7505 * var(--eui-base-spacing-m));min-height:calc(1.7505 * var(--eui-base-spacing-m));min-width:calc(1.7505 * var(--eui-base-spacing-m));padding:0 var(--eui-base-spacing-s)}.eui-button--size-xs .eui-button__container{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-button--size-xs .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button--size-xs.eui-button--icon-only{padding:0}.eui-button--size-s{height:calc(2 * var(--eui-base-spacing-m));min-height:calc(2 * var(--eui-base-spacing-m));min-width:calc(2 * var(--eui-base-spacing-m));padding:0 var(--eui-base-spacing-s)}.eui-button--size-s .eui-button__container{font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-button--size-s .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button--size-s.eui-button--icon-only{padding:0}.eui-button--size-m .eui-button__container{font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-button--size-m .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-xl)}.eui-button--size-l{height:calc(3.25 * var(--eui-base-spacing-m));min-height:calc(3.25 * var(--eui-base-spacing-m));min-width:calc(3.25 * var(--eui-base-spacing-m))}.eui-button--size-l .eui-button__container{font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.eui-button--size-l .eui-button__container .eui-label+.eui-badge{max-height:inherit}.eui-button--size-l .eui-button__container .eui-icon{font-size:var(--eui-base-font-size-2xl)}.eui-button .eui-icon-svg--size-l{height:1.5rem;width:1.5rem}.eui-button .eui-icon-svg--size-m{height:1.25rem;width:1.25rem}.eui-button .eui-icon-svg--size-s{height:1rem;width:1rem}.eui-button{border:1px solid var(--eui-base-color-grey-100);color:var(--eui-base-color-grey-100)}.eui-button:hover{background-color:var(--eui-base-color-grey-5)}.eui-button--primary{background-color:var(--eui-base-color-primary-100);border-color:var(--eui-base-color-primary-120);color:var(--eui-base-color-white)}.eui-button--primary .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--primary:hover{background-color:var(--eui-base-color-primary-110)}.eui-button--primary--darker{background-color:var(--eui-base-color-primary-120);border-color:var(--eui-base-color-primary-120);color:var(--eui-base-color-white)}.eui-button--primary--darker:hover{background-color:var(--eui-base-color-primary-130)}.eui-button--secondary{background-color:var(--eui-base-color-grey-15);border-color:var(--eui-base-color-grey-50);color:var(--eui-base-color-grey-100)}.eui-button--secondary .eui-icon-svg>svg{color:var(--eui-base-grey-75);fill:var(--eui-base-grey-75)}.eui-button--secondary:hover{background-color:var(--eui-base-color-grey-25)}.eui-button--secondary--darker{background-color:var(--eui-base-color-grey-25);border-color:var(--eui-base-color-grey-50);color:var(--eui-base-color-grey-100)}.eui-button--secondary--darker:hover{background-color:var(--eui-base-color-grey-50)}.eui-button--info{background-color:var(--eui-base-color-info-100);border-color:var(--eui-base-color-info-120);color:var(--eui-base-color-white)}.eui-button--info .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--info:hover{background-color:var(--eui-base-color-info-110)}.eui-button--info--darker{background-color:var(--eui-base-color-info-120);border-color:var(--eui-base-color-info-120);color:var(--eui-base-color-white)}.eui-button--info--darker:hover{background-color:var(--eui-base-color-info-130)}.eui-button--success{background-color:var(--eui-base-color-success-100);border-color:var(--eui-base-color-success-120);color:var(--eui-base-color-white)}.eui-button--success .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--success:hover{background-color:var(--eui-base-color-success-110)}.eui-button--success--darker{background-color:var(--eui-base-color-success-120);border-color:var(--eui-base-color-success-120);color:var(--eui-base-color-white)}.eui-button--success--darker:hover{background-color:var(--eui-base-color-success-130)}.eui-button--warning{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-120);color:var(--eui-base-color-black)}.eui-button--warning .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--warning:hover{background-color:var(--eui-base-color-warning-110)}.eui-button--warning--darker{background-color:var(--eui-base-color-warning-120);border-color:var(--eui-base-color-warning-120);color:var(--eui-base-color-white)}.eui-button--warning--darker:hover{background-color:var(--eui-base-color-warning-130)}.eui-button--danger{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-120);color:var(--eui-base-color-white)}.eui-button--danger .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--danger:hover{background-color:var(--eui-base-color-danger-110)}.eui-button--danger--darker{background-color:var(--eui-base-color-danger-120);border-color:var(--eui-base-color-danger-120);color:var(--eui-base-color-white)}.eui-button--danger--darker:hover{background-color:var(--eui-base-color-danger-130)}.eui-button--accent .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--accent:active,.eui-button--accent:focus,.eui-button--accent:hover{background-color:var(--eui-base-color-accent-110);border-color:var(--eui-base-color-grey-100);color:var(--eui-base-color-black);outline-color:var(--eui-base-color-grey-100)}.eui-button--basic{background-color:transparent;border:1px solid transparent}.eui-button--basic:active,.eui-button--basic:focus,.eui-button--basic:hover{background-color:var(--eui-base-color-grey-5)}.eui-button--basic.eui-button--primary{color:var(--eui-base-color-primary-100)}.eui-button--basic.eui-button--primary .eui-icon-svg>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100)}.eui-button--basic.eui-button--primary:active,.eui-button--basic.eui-button--primary:focus,.eui-button--basic.eui-button--primary:hover{background-color:var(--eui-base-color-primary-10)}.eui-button--basic.eui-button--secondary{color:var(--eui-base-color-grey-75)}.eui-button--basic.eui-button--secondary .eui-icon-svg>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75)}.eui-button--basic.eui-button--secondary:active,.eui-button--basic.eui-button--secondary:focus,.eui-button--basic.eui-button--secondary:hover{background-color:var(--eui-base-color-grey-10)}.eui-button--basic.eui-button--info{color:var(--eui-base-color-info-100)}.eui-button--basic.eui-button--info .eui-icon-svg>svg{color:var(--eui-base-color-info-100);fill:var(--eui-base-color-info-100)}.eui-button--basic.eui-button--info:active,.eui-button--basic.eui-button--info:focus,.eui-button--basic.eui-button--info:hover{background-color:var(--eui-base-color-info-10)}.eui-button--basic.eui-button--success{color:var(--eui-base-color-success-100)}.eui-button--basic.eui-button--success .eui-icon-svg>svg{color:var(--eui-base-color-success-100);fill:var(--eui-base-color-success-100)}.eui-button--basic.eui-button--success:active,.eui-button--basic.eui-button--success:focus,.eui-button--basic.eui-button--success:hover{background-color:var(--eui-base-color-success-10)}.eui-button--basic.eui-button--warning{color:var(--eui-base-color-warning-140)}.eui-button--basic.eui-button--warning .eui-icon-svg>svg{color:var(--eui-base-color-warning-140);fill:var(--eui-base-color-warning-140)}.eui-button--basic.eui-button--warning:active,.eui-button--basic.eui-button--warning:focus,.eui-button--basic.eui-button--warning:hover{background-color:var(--eui-base-color-warning-10)}.eui-button--basic.eui-button--danger{color:var(--eui-base-color-danger-100)}.eui-button--basic.eui-button--danger .eui-icon-svg>svg{color:var(--eui-base-color-danger-100);fill:var(--eui-base-color-danger-100)}.eui-button--basic.eui-button--danger:active,.eui-button--basic.eui-button--danger:focus,.eui-button--basic.eui-button--danger:hover{background-color:var(--eui-base-color-danger-10)}.eui-button--outline{background-color:var(--eui-base-color-white)}.eui-button--outline:active,.eui-button--outline:focus,.eui-button--outline:hover{background-color:var(--eui-base-color-grey-5)}.eui-button--outline.eui-button--primary{border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-button--outline.eui-button--primary .eui-icon-svg>svg{color:var(--eui-base-color-primary-100);fill:var(--eui-base-color-primary-100)}.eui-button--outline.eui-button--primary:active,.eui-button--outline.eui-button--primary:focus,.eui-button--outline.eui-button--primary:hover{background-color:var(--eui-base-color-primary-100);border-color:var(--eui-base-color-primary-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--primary:active .eui-icon-svg>svg,.eui-button--outline.eui-button--primary:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--primary:hover .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--secondary{border-color:var(--eui-base-color-grey-50);color:var(--eui-base-color-grey-75)}.eui-button--outline.eui-button--secondary .eui-icon-svg>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75)}.eui-button--outline.eui-button--secondary:active,.eui-button--outline.eui-button--secondary:focus,.eui-button--outline.eui-button--secondary:hover{background-color:var(--eui-base-color-grey-25)}.eui-button--outline.eui-button--info{border-color:var(--eui-base-color-info-100);color:var(--eui-base-color-info-100)}.eui-button--outline.eui-button--info .eui-icon-svg>svg{color:var(--eui-base-color-info-100);fill:var(--eui-base-color-info-100)}.eui-button--outline.eui-button--info:active,.eui-button--outline.eui-button--info:focus,.eui-button--outline.eui-button--info:hover{background-color:var(--eui-base-color-info-100);border-color:var(--eui-base-color-info-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--info:active .eui-icon-svg>svg,.eui-button--outline.eui-button--info:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--info:hover .eui-icon-svg>svg{fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--success{border-color:var(--eui-base-color-success-100);color:var(--eui-base-color-success-100)}.eui-button--outline.eui-button--success .eui-icon-svg>svg{color:var(--eui-base-color-success-100);fill:var(--eui-base-color-success-100)}.eui-button--outline.eui-button--success:active,.eui-button--outline.eui-button--success:focus,.eui-button--outline.eui-button--success:hover{background-color:var(--eui-base-color-success-100);border-color:var(--eui-base-color-success-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--success:active .eui-icon-svg>svg,.eui-button--outline.eui-button--success:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--success:hover .eui-icon-svg>svg{fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--warning{border-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-warning-140)}.eui-button--outline.eui-button--warning .eui-icon-svg>svg{color:var(--eui-base-color-warning-140);fill:var(--eui-base-color-warning-140)}.eui-button--outline.eui-button--warning:active,.eui-button--outline.eui-button--warning:focus,.eui-button--outline.eui-button--warning:hover{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-120);color:var(--eui-base-color-black)}.eui-button--outline.eui-button--warning:active .eui-icon-svg>svg,.eui-button--outline.eui-button--warning:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--warning:hover .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--outline.eui-button--danger{border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-danger-100)}.eui-button--outline.eui-button--danger .eui-icon-svg>svg{color:var(--eui-base-color-danger-100);fill:var(--eui-base-color-danger-100)}.eui-button--outline.eui-button--danger:active,.eui-button--outline.eui-button--danger:focus,.eui-button--outline.eui-button--danger:hover{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-120);color:var(--eui-base-color-white)}.eui-button--outline.eui-button--danger:active .eui-icon-svg>svg,.eui-button--outline.eui-button--danger:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--danger:hover .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-button--outline.eui-button--accent{border-color:var(--eui-base-color-accent-120);color:var(--eui-base-color-black)}.eui-button--outline.eui-button--accent .eui-icon-svg>svg{color:var(--eui-base-color-black);fill:var(--eui-base-color-black)}.eui-button--outline.eui-button--accent:active,.eui-button--outline.eui-button--accent:focus,.eui-button--outline.eui-button--accent:hover{background-color:var(--eui-base-color-accent-110);border-color:var(--eui-base-color-accent-120);color:var(--eui-base-color-black);outline-color:var(--eui-base-color-grey-100)}.eui-button--outline.eui-button--accent:active .eui-icon-svg>svg,.eui-button--outline.eui-button--accent:focus .eui-icon-svg>svg,.eui-button--outline.eui-button--accent:hover .eui-icon-svg>svg{fill:var(--eui-base-color-black)}.eui-button--accent{background-color:var(--eui-base-color-accent-100);border-color:var(--eui-base-color-accent-120);color:var(--eui-base-color-black)}.eui-button--accent:hover{background-color:var(--eui-base-color-accent-110)}.eui-button--rounded{border-radius:50%}.eui-button--rounded:active,.eui-button--rounded:focus{border-radius:50%}.eui-button--rounded:active:active:not([readonly]),.eui-button--rounded:active:focus:not([readonly]),.eui-button--rounded:focus:active:not([readonly]),.eui-button--rounded:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button--rounded:active [tabindex=\"0\"]:active:not([readonly]),.eui-button--rounded:active [tabindex=\"0\"]:focus:not([readonly]),.eui-button--rounded:focus [tabindex=\"0\"]:active:not([readonly]),.eui-button--rounded:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-button--responsive{display:grid;position:relative;width:100%}.eui-button--responsive .eui-button__container{overflow:hidden}.eui-button--responsive .eui-button__container>label,.eui-button--responsive .eui-button__container>.eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-button--responsive .eui-button__container .eui-icon{overflow:visible}.eui-button--block{display:block;width:100%}.eui-button--line-wrap{line-height:var(--eui-base-line-height);padding:var(--eui-base-spacing-s);white-space:normal}.eui-button--expand-toggle{background:var(--eui-base-color-white);border-color:transparent;border-radius:0 0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs);min-height:var(--eui-base-spacing-m);padding:0 var(--eui-base-spacing-xl);box-shadow:var(--eui-base-shadow-1)}.eui-button--expand-toggle:hover,.eui-button--expand-toggle:focus{box-shadow:var(--eui-base-shadow-3)}.eui-button--expand-toggle .eui-icon{color:var(--eui-base-color-grey-80);font-size:var(--eui-base-font-size-l)}.eui-button.disabled,.eui-button:disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-base-disabled-opacity)}\n"] }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { cssClasses: [{
                 type: HostBinding,
                 args: ['class']

package/esm2022/eui-date-range-selector/eui-date-range-selector.component.mjs

@@ -194,11 +194,11 @@ export class EuiDateRangeSelectorComponent {
         this.propagateTouched = fn;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.0-rc.1", ngImport: i0, type: EuiDateRangeSelectorComponent, deps: [{ token: i1.TranslateService }, { token: i2.LocaleService, optional: true }, { token: i3.DateAdapter }, { token: i4.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.0-rc.1", type: EuiDateRangeSelectorComponent, selector: "eui-date-range-selector", inputs: { styleClass: "styleClass", e2eAttr: "e2eAttr", minDate: "minDate", maxDate: "maxDate", togglerIcon: "togglerIcon", togglerIconSvg: "togglerIconSvg", togglerLabel: "togglerLabel", firstInputPlaceholder: "firstInputPlaceholder", secondInputPlaceholder: "secondInputPlaceholder", firstInputAriaLabel: "firstInputAriaLabel", secondInputAriaLabel: "secondInputAriaLabel", startDateDefaultValue: "startDateDefaultValue", endDateDefaultValue: "endDateDefaultValue", comparisonStart: "comparisonStart", comparisonEnd: "comparisonEnd", startView: "startView", islongDateFormat: "islongDateFormat", isClearable: "isClearable", isReadOnly: "isReadOnly", isDisabled: "isDisabled", isResponsive: "isResponsive" }, outputs: { firstSelectedDate: "firstSelectedDate", secondSelectedDate: "secondSelectedDate" }, usesOnChanges: true, ngImport: i0, template: "<div\n    class=\"eui-date-range-selector {{ styleClass }}\"\n    attr.data-e2e=\"{{ e2eAttr }}\"\n    [class.eui-date-range-selector--responsive]=\"isResponsive\">\n    <mat-date-range-input\n        [class.mat-date-range-input--read-only]=\"isReadOnly\"\n        [class.mat-date-range-input--disabled]=\"isDisabled\"\n        [class.mat-date-range-input--invalid]=\"isInvalid && isTouched\"\n        [rangePicker]=\"picker\"\n        [min]=\"minDate\"\n        [max]=\"maxDate\"\n        [comparisonStart]=\"comparisonStart\"\n        [comparisonEnd]=\"comparisonEnd\">\n        <input\n            class=\"eui-date-range-selector__start-date\"\n            euiInputText\n            [readonly]=\"isReadOnly\"\n            matStartDate\n            placeholder=\"{{ firstInputPlaceholder }}\"\n            attr.aria-label=\"{{ firstInputAriaLabel }}\"\n            [formControl]=\"startRangeFormControl\"\n            (dateInput)=\"onFirstDateChange($event)\"\n            [euiClearable]=\"isClearable\" />\n        <input\n            class=\"eui-date-range-selector__end-date\"\n            euiInputText\n            [readonly]=\"isReadOnly\"\n            matEndDate\n            placeholder=\"{{ secondInputPlaceholder }}\"\n            attr.aria-label=\"{{ secondInputAriaLabel }}\"\n            [formControl]=\"endRangeFormControl\"\n            (dateInput)=\"onSecondDateChange($event)\"\n            [euiClearable]=\"isClearable\" />\n    </mat-date-range-input>\n    <mat-date-range-picker #picker [startView]=\"startView\"> </mat-date-range-picker>\n    <button\n        *ngIf=\"!isReadOnly\"\n        class=\"eui-date-range-selector__toggler eui-date-range-selector__toggler-{{ !togglerLabel ? 'icon' : 'label' }}\"\n        (click)=\"picker.open()\"\n        euiButton\n        euiSecondary\n        euiIconButton\n        type=\"button\"\n        [euiDisabled]=\"isDisabled\"\n        aria-haspopup=\"dialog\">\n        <span *ngIf=\"!togglerLabel && togglerIcon\" euiIcon aria-label=\"Open Calendar\" iconClass=\"{{ togglerIcon }}\"></span>\n        <ng-container *ngIf=\"!togglerLabel && !togglerIcon\">\n            <eui-icon-svg icon=\"{{ togglerIconSvg }}\" aria-label=\"Open Calendar\"></eui-icon-svg>\n        </ng-container>\n        <span *ngIf=\"togglerLabel\">{{ togglerLabel }}</span>\n    </button>\n</div>\n", styles: ["eui-date-range-selector{display:flex;width:100%}.eui-date-range-selector{display:inline-flex;height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs))}.eui-date-range-selector--responsive{display:flex;min-width:calc(15 * var(--eui-base-spacing-m));width:100%}.eui-date-range-selector--responsive.eui-date-range-selector--clearable{min-width:calc(18 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input{align-items:center;display:flex;height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs))}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container{align-items:center;display:flex;height:100%}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container .mat-date-range-input-wrapper{height:100%;width:calc(6.9 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container .mat-date-range-input-wrapper .eui-input-text{min-height:calc(var(--eui-base-spacing-2xl) + 2px)}.eui-date-range-selector.eui-date-range-selector--clearable .mat-date-range-input-wrapper{width:calc(8.5 * var(--eui-base-spacing-m))!important}.eui-date-range-selector.eui-date-range-selector--clearable .mat-date-range-input-wrapper .mat-date-range-input-inner{position:relative}.eui-date-range-selector--long-date-format .mat-date-range-input-wrapper{width:calc(12.5 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input-separator.mat-date-range-input-separator-hidden{opacity:1}.eui-date-range-selector__toggler{border-bottom-left-radius:0;border-top-left-radius:0;border-left:none}.eui-date-range-selector__toggler-label{width:auto}.eui-date-range-selector .mat-date-range-input{align-items:center;display:flex;box-sizing:border-box;background:var(--eui-base-color-white);border:1px solid var(--eui-base-color-grey-50);border-radius:var(--eui-base-border-radius);border-bottom-right-radius:0;border-top-right-radius:0;text-align:center}.eui-date-range-selector .mat-date-range-input--read-only{background-color:transparent;border-color:transparent!important;box-shadow:none;height:inherit;padding:var(--eui-base-spacing-2xs) 0;pointer-events:none}.eui-date-range-selector .mat-date-range-input--read-only .mat-date-range-input-separator.mat-date-range-input-separator-hidden{opacity:0}.eui-date-range-selector .mat-date-range-input--disabled{background-image:none;box-shadow:none;cursor:not-allowed;opacity:var(--eui-base-disabled-opacity);background-color:var(--eui-base-color-grey-5);border:1px solid var(--eui-base-color-grey-25)}.eui-date-range-selector .mat-date-range-input--disabled input.eui-date-range-selector__start-date{border-right:none!important}.eui-date-range-selector .mat-date-range-input--disabled input.eui-date-range-selector__end-date{border-left:none!important}.eui-date-range-selector .mat-date-range-input--invalid{border:1px solid var(--eui-base-color-danger-100)}.eui-date-range-selector input.mat-date-range-input-inner{align-items:center;font: 400 1rem/1.25rem arial,sans-serif;-webkit-appearance:none;appearance:none;background-color:inherit;border:hidden;color:var(--eui-base-color-grey-100);display:flex;padding:var(--eui-base-spacing-s);text-align:left;width:100%}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i6.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i6.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i6.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i6.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: i7.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "component", type: i8.EuiIconComponent, selector: "div[euiIcon], span[euiIcon], i[euiIcon], eui-icon", inputs: ["aria-label", "iconClass", "isLoading"] }, { kind: "component", type: i8.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: i9.EuiInputTextComponent, selector: "input[euiInputText]", inputs: ["class", "isInvalid"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.0-rc.1", type: EuiDateRangeSelectorComponent, selector: "eui-date-range-selector", inputs: { styleClass: "styleClass", e2eAttr: "e2eAttr", minDate: "minDate", maxDate: "maxDate", togglerIcon: "togglerIcon", togglerIconSvg: "togglerIconSvg", togglerLabel: "togglerLabel", firstInputPlaceholder: "firstInputPlaceholder", secondInputPlaceholder: "secondInputPlaceholder", firstInputAriaLabel: "firstInputAriaLabel", secondInputAriaLabel: "secondInputAriaLabel", startDateDefaultValue: "startDateDefaultValue", endDateDefaultValue: "endDateDefaultValue", comparisonStart: "comparisonStart", comparisonEnd: "comparisonEnd", startView: "startView", islongDateFormat: "islongDateFormat", isClearable: "isClearable", isReadOnly: "isReadOnly", isDisabled: "isDisabled", isResponsive: "isResponsive" }, outputs: { firstSelectedDate: "firstSelectedDate", secondSelectedDate: "secondSelectedDate" }, usesOnChanges: true, ngImport: i0, template: "<div\n    class=\"eui-date-range-selector {{ styleClass }}\"\n    attr.data-e2e=\"{{ e2eAttr }}\"\n    [class.eui-date-range-selector--responsive]=\"isResponsive\">\n    <mat-date-range-input\n        [class.mat-date-range-input--read-only]=\"isReadOnly\"\n        [class.mat-date-range-input--disabled]=\"isDisabled\"\n        [class.mat-date-range-input--invalid]=\"isInvalid && isTouched\"\n        [rangePicker]=\"picker\"\n        [min]=\"minDate\"\n        [max]=\"maxDate\"\n        [comparisonStart]=\"comparisonStart\"\n        [comparisonEnd]=\"comparisonEnd\">\n        <input\n            class=\"eui-date-range-selector__start-date\"\n            euiInputText\n            [readonly]=\"isReadOnly\"\n            matStartDate\n            placeholder=\"{{ firstInputPlaceholder }}\"\n            attr.aria-label=\"{{ firstInputAriaLabel }}\"\n            [formControl]=\"startRangeFormControl\"\n            (dateInput)=\"onFirstDateChange($event)\"\n            [euiClearable]=\"isClearable\" />\n        <input\n            class=\"eui-date-range-selector__end-date\"\n            euiInputText\n            [readonly]=\"isReadOnly\"\n            matEndDate\n            placeholder=\"{{ secondInputPlaceholder }}\"\n            attr.aria-label=\"{{ secondInputAriaLabel }}\"\n            [formControl]=\"endRangeFormControl\"\n            (dateInput)=\"onSecondDateChange($event)\"\n            [euiClearable]=\"isClearable\" />\n    </mat-date-range-input>\n    <mat-date-range-picker #picker [startView]=\"startView\"> </mat-date-range-picker>\n    <button\n        *ngIf=\"!isReadOnly\"\n        class=\"eui-date-range-selector__toggler eui-date-range-selector__toggler-{{ !togglerLabel ? 'icon' : 'label' }}\"\n        (click)=\"picker.open()\"\n        euiButton\n        euiSecondary\n        euiIconButton\n        type=\"button\"\n        [euiDisabled]=\"isDisabled\"\n        aria-haspopup=\"dialog\">\n        <span *ngIf=\"!togglerLabel && togglerIcon\" euiIcon aria-label=\"Open Calendar\" iconClass=\"{{ togglerIcon }}\"></span>\n        <ng-container *ngIf=\"!togglerLabel && !togglerIcon\">\n            <eui-icon-svg icon=\"{{ togglerIconSvg }}\" aria-label=\"Open Calendar\"></eui-icon-svg>\n        </ng-container>\n        <span *ngIf=\"togglerLabel\">{{ togglerLabel }}</span>\n    </button>\n</div>\n", styles: ["eui-date-range-selector{display:flex;width:100%}.eui-date-range-selector{display:inline-flex;height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs))}.eui-date-range-selector--responsive{display:flex;min-width:calc(15 * var(--eui-base-spacing-m));width:100%}.eui-date-range-selector--responsive.eui-date-range-selector--clearable{min-width:calc(18 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input{align-items:center;display:flex;height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs))}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container{align-items:center;display:flex;height:100%}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container .mat-date-range-input-wrapper{height:100%;width:calc(6.9 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container .mat-date-range-input-wrapper .eui-input-text{min-height:calc(var(--eui-base-spacing-2xl) + 2px)}.eui-date-range-selector.eui-date-range-selector--clearable .mat-date-range-input-wrapper{width:calc(8.5 * var(--eui-base-spacing-m))!important}.eui-date-range-selector.eui-date-range-selector--clearable .mat-date-range-input-wrapper .mat-date-range-input-inner{position:relative}.eui-date-range-selector--long-date-format .mat-date-range-input-wrapper{width:calc(12.5 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input-separator.mat-date-range-input-separator-hidden{opacity:1}.eui-date-range-selector__toggler{border-bottom-left-radius:0;border-top-left-radius:0;border-left:none}.eui-date-range-selector__toggler-label{width:auto}.eui-date-range-selector .mat-date-range-input{align-items:center;display:flex;box-sizing:border-box;background:var(--eui-base-color-white);border:1px solid var(--eui-base-color-grey-50);border-radius:var(--eui-base-border-radius);border-bottom-right-radius:0;border-top-right-radius:0;text-align:center}.eui-date-range-selector .mat-date-range-input--read-only{background-color:transparent;border-color:transparent!important;box-shadow:none;height:inherit;padding:var(--eui-base-spacing-2xs) 0;pointer-events:none}.eui-date-range-selector .mat-date-range-input--read-only .mat-date-range-input-separator.mat-date-range-input-separator-hidden{opacity:0}.eui-date-range-selector .mat-date-range-input--disabled{background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-base-disabled-opacity);background-color:var(--eui-base-color-grey-5);border:1px solid var(--eui-base-color-grey-25)}.eui-date-range-selector .mat-date-range-input--disabled input.eui-date-range-selector__start-date{border-right:none!important}.eui-date-range-selector .mat-date-range-input--disabled input.eui-date-range-selector__end-date{border-left:none!important}.eui-date-range-selector .mat-date-range-input--invalid{border:1px solid var(--eui-base-color-danger-100)}.eui-date-range-selector input.mat-date-range-input-inner{align-items:center;font: 400 1rem/1.25rem arial,sans-serif;-webkit-appearance:none;appearance:none;background-color:inherit;border:hidden;color:var(--eui-base-color-grey-100);display:flex;padding:var(--eui-base-spacing-s);text-align:left;width:100%}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i6.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i6.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i6.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i6.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: i7.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "component", type: i8.EuiIconComponent, selector: "div[euiIcon], span[euiIcon], i[euiIcon], eui-icon", inputs: ["aria-label", "iconClass", "isLoading"] }, { kind: "component", type: i8.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: i9.EuiInputTextComponent, selector: "input[euiInputText]", inputs: ["class", "isInvalid"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0-rc.1", ngImport: i0, type: EuiDateRangeSelectorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'eui-date-range-selector', encapsulation: ViewEncapsulation.None, template: "<div\n    class=\"eui-date-range-selector {{ styleClass }}\"\n    attr.data-e2e=\"{{ e2eAttr }}\"\n    [class.eui-date-range-selector--responsive]=\"isResponsive\">\n    <mat-date-range-input\n        [class.mat-date-range-input--read-only]=\"isReadOnly\"\n        [class.mat-date-range-input--disabled]=\"isDisabled\"\n        [class.mat-date-range-input--invalid]=\"isInvalid && isTouched\"\n        [rangePicker]=\"picker\"\n        [min]=\"minDate\"\n        [max]=\"maxDate\"\n        [comparisonStart]=\"comparisonStart\"\n        [comparisonEnd]=\"comparisonEnd\">\n        <input\n            class=\"eui-date-range-selector__start-date\"\n            euiInputText\n            [readonly]=\"isReadOnly\"\n            matStartDate\n            placeholder=\"{{ firstInputPlaceholder }}\"\n            attr.aria-label=\"{{ firstInputAriaLabel }}\"\n            [formControl]=\"startRangeFormControl\"\n            (dateInput)=\"onFirstDateChange($event)\"\n            [euiClearable]=\"isClearable\" />\n        <input\n            class=\"eui-date-range-selector__end-date\"\n            euiInputText\n            [readonly]=\"isReadOnly\"\n            matEndDate\n            placeholder=\"{{ secondInputPlaceholder }}\"\n            attr.aria-label=\"{{ secondInputAriaLabel }}\"\n            [formControl]=\"endRangeFormControl\"\n            (dateInput)=\"onSecondDateChange($event)\"\n            [euiClearable]=\"isClearable\" />\n    </mat-date-range-input>\n    <mat-date-range-picker #picker [startView]=\"startView\"> </mat-date-range-picker>\n    <button\n        *ngIf=\"!isReadOnly\"\n        class=\"eui-date-range-selector__toggler eui-date-range-selector__toggler-{{ !togglerLabel ? 'icon' : 'label' }}\"\n        (click)=\"picker.open()\"\n        euiButton\n        euiSecondary\n        euiIconButton\n        type=\"button\"\n        [euiDisabled]=\"isDisabled\"\n        aria-haspopup=\"dialog\">\n        <span *ngIf=\"!togglerLabel && togglerIcon\" euiIcon aria-label=\"Open Calendar\" iconClass=\"{{ togglerIcon }}\"></span>\n        <ng-container *ngIf=\"!togglerLabel && !togglerIcon\">\n            <eui-icon-svg icon=\"{{ togglerIconSvg }}\" aria-label=\"Open Calendar\"></eui-icon-svg>\n        </ng-container>\n        <span *ngIf=\"togglerLabel\">{{ togglerLabel }}</span>\n    </button>\n</div>\n", styles: ["eui-date-range-selector{display:flex;width:100%}.eui-date-range-selector{display:inline-flex;height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs))}.eui-date-range-selector--responsive{display:flex;min-width:calc(15 * var(--eui-base-spacing-m));width:100%}.eui-date-range-selector--responsive.eui-date-range-selector--clearable{min-width:calc(18 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input{align-items:center;display:flex;height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs))}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container{align-items:center;display:flex;height:100%}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container .mat-date-range-input-wrapper{height:100%;width:calc(6.9 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container .mat-date-range-input-wrapper .eui-input-text{min-height:calc(var(--eui-base-spacing-2xl) + 2px)}.eui-date-range-selector.eui-date-range-selector--clearable .mat-date-range-input-wrapper{width:calc(8.5 * var(--eui-base-spacing-m))!important}.eui-date-range-selector.eui-date-range-selector--clearable .mat-date-range-input-wrapper .mat-date-range-input-inner{position:relative}.eui-date-range-selector--long-date-format .mat-date-range-input-wrapper{width:calc(12.5 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input-separator.mat-date-range-input-separator-hidden{opacity:1}.eui-date-range-selector__toggler{border-bottom-left-radius:0;border-top-left-radius:0;border-left:none}.eui-date-range-selector__toggler-label{width:auto}.eui-date-range-selector .mat-date-range-input{align-items:center;display:flex;box-sizing:border-box;background:var(--eui-base-color-white);border:1px solid var(--eui-base-color-grey-50);border-radius:var(--eui-base-border-radius);border-bottom-right-radius:0;border-top-right-radius:0;text-align:center}.eui-date-range-selector .mat-date-range-input--read-only{background-color:transparent;border-color:transparent!important;box-shadow:none;height:inherit;padding:var(--eui-base-spacing-2xs) 0;pointer-events:none}.eui-date-range-selector .mat-date-range-input--read-only .mat-date-range-input-separator.mat-date-range-input-separator-hidden{opacity:0}.eui-date-range-selector .mat-date-range-input--disabled{background-image:none;box-shadow:none;cursor:not-allowed;opacity:var(--eui-base-disabled-opacity);background-color:var(--eui-base-color-grey-5);border:1px solid var(--eui-base-color-grey-25)}.eui-date-range-selector .mat-date-range-input--disabled input.eui-date-range-selector__start-date{border-right:none!important}.eui-date-range-selector .mat-date-range-input--disabled input.eui-date-range-selector__end-date{border-left:none!important}.eui-date-range-selector .mat-date-range-input--invalid{border:1px solid var(--eui-base-color-danger-100)}.eui-date-range-selector input.mat-date-range-input-inner{align-items:center;font: 400 1rem/1.25rem arial,sans-serif;-webkit-appearance:none;appearance:none;background-color:inherit;border:hidden;color:var(--eui-base-color-grey-100);display:flex;padding:var(--eui-base-spacing-s);text-align:left;width:100%}\n"] }]
+            args: [{ selector: 'eui-date-range-selector', encapsulation: ViewEncapsulation.None, template: "<div\n    class=\"eui-date-range-selector {{ styleClass }}\"\n    attr.data-e2e=\"{{ e2eAttr }}\"\n    [class.eui-date-range-selector--responsive]=\"isResponsive\">\n    <mat-date-range-input\n        [class.mat-date-range-input--read-only]=\"isReadOnly\"\n        [class.mat-date-range-input--disabled]=\"isDisabled\"\n        [class.mat-date-range-input--invalid]=\"isInvalid && isTouched\"\n        [rangePicker]=\"picker\"\n        [min]=\"minDate\"\n        [max]=\"maxDate\"\n        [comparisonStart]=\"comparisonStart\"\n        [comparisonEnd]=\"comparisonEnd\">\n        <input\n            class=\"eui-date-range-selector__start-date\"\n            euiInputText\n            [readonly]=\"isReadOnly\"\n            matStartDate\n            placeholder=\"{{ firstInputPlaceholder }}\"\n            attr.aria-label=\"{{ firstInputAriaLabel }}\"\n            [formControl]=\"startRangeFormControl\"\n            (dateInput)=\"onFirstDateChange($event)\"\n            [euiClearable]=\"isClearable\" />\n        <input\n            class=\"eui-date-range-selector__end-date\"\n            euiInputText\n            [readonly]=\"isReadOnly\"\n            matEndDate\n            placeholder=\"{{ secondInputPlaceholder }}\"\n            attr.aria-label=\"{{ secondInputAriaLabel }}\"\n            [formControl]=\"endRangeFormControl\"\n            (dateInput)=\"onSecondDateChange($event)\"\n            [euiClearable]=\"isClearable\" />\n    </mat-date-range-input>\n    <mat-date-range-picker #picker [startView]=\"startView\"> </mat-date-range-picker>\n    <button\n        *ngIf=\"!isReadOnly\"\n        class=\"eui-date-range-selector__toggler eui-date-range-selector__toggler-{{ !togglerLabel ? 'icon' : 'label' }}\"\n        (click)=\"picker.open()\"\n        euiButton\n        euiSecondary\n        euiIconButton\n        type=\"button\"\n        [euiDisabled]=\"isDisabled\"\n        aria-haspopup=\"dialog\">\n        <span *ngIf=\"!togglerLabel && togglerIcon\" euiIcon aria-label=\"Open Calendar\" iconClass=\"{{ togglerIcon }}\"></span>\n        <ng-container *ngIf=\"!togglerLabel && !togglerIcon\">\n            <eui-icon-svg icon=\"{{ togglerIconSvg }}\" aria-label=\"Open Calendar\"></eui-icon-svg>\n        </ng-container>\n        <span *ngIf=\"togglerLabel\">{{ togglerLabel }}</span>\n    </button>\n</div>\n", styles: ["eui-date-range-selector{display:flex;width:100%}.eui-date-range-selector{display:inline-flex;height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs))}.eui-date-range-selector--responsive{display:flex;min-width:calc(15 * var(--eui-base-spacing-m));width:100%}.eui-date-range-selector--responsive.eui-date-range-selector--clearable{min-width:calc(18 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input{align-items:center;display:flex;height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs))}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container{align-items:center;display:flex;height:100%}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container .mat-date-range-input-wrapper{height:100%;width:calc(6.9 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input .mat-date-range-input-container .mat-date-range-input-wrapper .eui-input-text{min-height:calc(var(--eui-base-spacing-2xl) + 2px)}.eui-date-range-selector.eui-date-range-selector--clearable .mat-date-range-input-wrapper{width:calc(8.5 * var(--eui-base-spacing-m))!important}.eui-date-range-selector.eui-date-range-selector--clearable .mat-date-range-input-wrapper .mat-date-range-input-inner{position:relative}.eui-date-range-selector--long-date-format .mat-date-range-input-wrapper{width:calc(12.5 * var(--eui-base-spacing-m))}.eui-date-range-selector .mat-date-range-input-separator.mat-date-range-input-separator-hidden{opacity:1}.eui-date-range-selector__toggler{border-bottom-left-radius:0;border-top-left-radius:0;border-left:none}.eui-date-range-selector__toggler-label{width:auto}.eui-date-range-selector .mat-date-range-input{align-items:center;display:flex;box-sizing:border-box;background:var(--eui-base-color-white);border:1px solid var(--eui-base-color-grey-50);border-radius:var(--eui-base-border-radius);border-bottom-right-radius:0;border-top-right-radius:0;text-align:center}.eui-date-range-selector .mat-date-range-input--read-only{background-color:transparent;border-color:transparent!important;box-shadow:none;height:inherit;padding:var(--eui-base-spacing-2xs) 0;pointer-events:none}.eui-date-range-selector .mat-date-range-input--read-only .mat-date-range-input-separator.mat-date-range-input-separator-hidden{opacity:0}.eui-date-range-selector .mat-date-range-input--disabled{background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-base-disabled-opacity);background-color:var(--eui-base-color-grey-5);border:1px solid var(--eui-base-color-grey-25)}.eui-date-range-selector .mat-date-range-input--disabled input.eui-date-range-selector__start-date{border-right:none!important}.eui-date-range-selector .mat-date-range-input--disabled input.eui-date-range-selector__end-date{border-left:none!important}.eui-date-range-selector .mat-date-range-input--invalid{border:1px solid var(--eui-base-color-danger-100)}.eui-date-range-selector input.mat-date-range-input-inner{align-items:center;font: 400 1rem/1.25rem arial,sans-serif;-webkit-appearance:none;appearance:none;background-color:inherit;border:hidden;color:var(--eui-base-color-grey-100);display:flex;padding:var(--eui-base-spacing-s);text-align:left;width:100%}\n"] }]
         }], ctorParameters: () => [{ type: i1.TranslateService }, { type: i2.LocaleService, decorators: [{
                     type: Optional
                 }] }, { type: i3.DateAdapter }, { type: i4.NgControl, decorators: [{

package/esm2022/eui-file-upload/eui-file-upload.component.mjs

@@ -192,7 +192,7 @@ export class EuiFileUploadComponent {
                 useExisting: EuiFileUploadComponent,
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "fileInputs", predicate: ["input"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"file-upload\">\n    <div\n        class=\"file-drop-area\"\n        [class.file-drop-area--active]=\"dragEntered\"\n        [class.file-drop-area--disabled]=\"isDropAreaDisabled\"\n        *ngIf=\"hasDragArea\">\n        <span class=\"fake-btn\">{{ 'eui.euifileupload.CHOOSE-FILE' | translate }}</span>\n        <span class=\"file-msg\">{{ 'eui.euifileupload.DRAG-AND-DROP-FILE-HERE' | translate }}</span>\n        <input\n            #input\n            class=\"file-input\"\n            attr.aria-label=\"{{ 'eui.euifileupload.CHOOSE-FILE' | translate }} 'or' {{\n                'eui.euifileupload.DRAG-AND-DROP-FILE-HERE' | translate\n            }}\"\n            type=\"file\"\n            accept=\"{{ accept }}\"\n            [attr.disabled]=\"isDropAreaDisabled ? 'disabled' : null\"\n            [multiple]=\"isMultiple\"\n            (dragenter)=\"onDragEnter()\"\n            (dragleave)=\"onDragLeave()\" />\n    </div>\n    <div class=\"simple-input-file eui-u-mb-xs\" *ngIf=\"!hasDragArea\">\n        <label for=\"file-{{ randomNumberId }}\">\n            <button euiButton type=\"button\" (click)=\"openBrowseWindow()\">{{ 'eui.euifileupload.CHOOSE-FILE' | translate }}</button>\n        </label>\n\n        <input\n            #input\n            *ngIf=\"isMultiple\"\n            aria-label=\"Choose Multiple Files\"\n            class=\"file-input\"\n            id=\"file-{{ randomNumberId }}\"\n            type=\"file\"\n            accept=\"{{ accept }}\"\n            multiple />\n        <input\n            #input\n            *ngIf=\"!isMultiple\"\n            aria-label=\"Choose a single file\"\n            class=\"file-input\"\n            id=\"file-{{ randomNumberId }}\"\n            type=\"file\"\n            accept=\"{{ accept }}\" />\n    </div>\n    <eui-file-upload-progress *ngIf=\"hasProgressBar\" [progress]=\"progress\"></eui-file-upload-progress>\n\n    <div *ngFor=\"let uploadedFile of uploadedFiles; let i = index\">\n        <eui-file-preview\n            [isItemsClickable]=\"isItemsClickable\"\n            [index]=\"i\"\n            [file]=\"uploadedFile\"\n            [hasPreview]=\"hasPreview\"\n            [hasPreviewAsImage]=\"hasPreviewAsImage\"\n            [hasPreviewAsIcon]=\"hasPreviewAsIcon\"\n            (itemClick)=\"onItemClick($event)\"\n            (removeFromList)=\"removeFromUploadedList($event)\">\n        </eui-file-preview>\n    </div>\n\n    <div *ngFor=\"let file of files; let i = index\">\n        <eui-file-preview\n            [isItemsClickable]=\"isItemsClickable\"\n            [index]=\"i\"\n            [file]=\"file\"\n            [hasPreview]=\"hasPreview\"\n            [hasPreviewAsImage]=\"hasPreviewAsImage\"\n            [hasPreviewAsIcon]=\"hasPreviewAsIcon\"\n            (itemClick)=\"onItemClick($event)\"\n            (removeFromList)=\"removeFromList($event)\">\n        </eui-file-preview>\n    </div>\n\n    <div class=\"file-upload__total-size\" *ngIf=\"filesTotalSize && hasTotalSizeDisplayed\">\n        {{ filesTotalSize | filesize }} {{ 'eui.euifileupload.TOTAL-SIZE' | translate }}\n    </div>\n</div>\n<ng-content></ng-content>\n<button euiButton class=\"file-upload__reset-button\" type=\"button\" (click)=\"resetList()\" *ngIf=\"showResetBtn\">\n    {{ 'eui.euifileupload.RESET-LIST' | translate }}\n</button>\n", styles: [".file-upload .file-upload__total-size{margin-bottom:1rem;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.file-upload .file-drop-area{outline:1px dashed var(--eui-base-color-primary-75);border-radius:3px;margin:0 0 10px;padding:30px;position:relative;transition:.2s}.file-upload .file-drop-area--active{background-color:var(--eui-base-color-primary-5);outline:3px dashed var(--eui-base-color-primary-75);border-radius:3px;margin:0 0 10px;padding:30px;position:relative;transition:.2s}.file-upload .file-drop-area--disabled{opacity:.5}.file-upload .file-drop-area--disabled .file-input{cursor:default}.file-upload .fake-btn{background-color:#fff;border:1px solid #9e9ec4;border-radius:3px;margin-right:8px;padding:8px 15px}.file-upload .file-input{cursor:pointer;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%}.file-upload .simple-input-file .file-input{display:none}.file-upload .file-upload__preview{align-items:center;display:flex;justify-content:space-between;margin:5px 0}.file-upload .file-upload__preview .file-upload__preview-left{align-items:center;display:flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__image{margin-right:var(--eui-base-spacing-m)}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__image img{width:180px}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__image .loading-container{text-align:center;width:180px}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__filename{display:block}.file-upload .file-upload__preview .file-upload__preview-right{align-items:center;display:flex;margin-left:auto}.file-upload .progress-bar__container{margin-bottom:var(--eui-base-spacing-2xs)}.file-upload .progress-bar__container .progress-bar{background-color:var(--eui-base-color-primary-100);height:var(--eui-base-spacing-2xs)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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.EuiFileUploadProgressComponent, selector: "eui-file-upload-progress", inputs: ["progress"] }, { kind: "component", type: i4.EuiFilePreviewComponent, selector: "eui-file-preview", inputs: ["file", "index", "previewAsIconConfig", "hasPreview", "isFilenameDisplayed", "isFilesizeDisplayed", "isFiletypeDisplayed", "hasPreviewAsImage", "hasPreviewAsIcon", "isItemsClickable"], outputs: ["removeFromList", "itemClick"] }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i6.EuiFileSizePipe, name: "filesize" }], encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "fileInputs", predicate: ["input"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"file-upload\">\n    <div\n        class=\"file-drop-area\"\n        [class.file-drop-area--active]=\"dragEntered\"\n        [class.file-drop-area--disabled]=\"isDropAreaDisabled\"\n        *ngIf=\"hasDragArea\">\n        <span class=\"fake-btn\">{{ 'eui.euifileupload.CHOOSE-FILE' | translate }}</span>\n        <span class=\"file-msg\">{{ 'eui.euifileupload.DRAG-AND-DROP-FILE-HERE' | translate }}</span>\n        <input\n            #input\n            class=\"file-input\"\n            attr.aria-label=\"{{ 'eui.euifileupload.CHOOSE-FILE' | translate }} 'or' {{\n                'eui.euifileupload.DRAG-AND-DROP-FILE-HERE' | translate\n            }}\"\n            type=\"file\"\n            accept=\"{{ accept }}\"\n            [attr.disabled]=\"isDropAreaDisabled ? 'disabled' : null\"\n            [multiple]=\"isMultiple\"\n            (dragenter)=\"onDragEnter()\"\n            (dragleave)=\"onDragLeave()\" />\n    </div>\n    <div class=\"simple-input-file eui-u-mb-xs\" *ngIf=\"!hasDragArea\">\n        <label for=\"file-{{ randomNumberId }}\">\n            <button euiButton type=\"button\" (click)=\"openBrowseWindow()\">{{ 'eui.euifileupload.CHOOSE-FILE' | translate }}</button>\n        </label>\n\n        <input\n            #input\n            *ngIf=\"isMultiple\"\n            aria-label=\"Choose Multiple Files\"\n            class=\"file-input\"\n            id=\"file-{{ randomNumberId }}\"\n            type=\"file\"\n            accept=\"{{ accept }}\"\n            multiple />\n        <input\n            #input\n            *ngIf=\"!isMultiple\"\n            aria-label=\"Choose a single file\"\n            class=\"file-input\"\n            id=\"file-{{ randomNumberId }}\"\n            type=\"file\"\n            accept=\"{{ accept }}\" />\n    </div>\n    <eui-file-upload-progress *ngIf=\"hasProgressBar\" [progress]=\"progress\"></eui-file-upload-progress>\n\n    <div *ngFor=\"let uploadedFile of uploadedFiles; let i = index\">\n        <eui-file-preview\n            [isItemsClickable]=\"isItemsClickable\"\n            [index]=\"i\"\n            [file]=\"uploadedFile\"\n            [hasPreview]=\"hasPreview\"\n            [hasPreviewAsImage]=\"hasPreviewAsImage\"\n            [hasPreviewAsIcon]=\"hasPreviewAsIcon\"\n            (itemClick)=\"onItemClick($event)\"\n            (removeFromList)=\"removeFromUploadedList($event)\">\n        </eui-file-preview>\n    </div>\n\n    <div *ngFor=\"let file of files; let i = index\">\n        <eui-file-preview\n            [isItemsClickable]=\"isItemsClickable\"\n            [index]=\"i\"\n            [file]=\"file\"\n            [hasPreview]=\"hasPreview\"\n            [hasPreviewAsImage]=\"hasPreviewAsImage\"\n            [hasPreviewAsIcon]=\"hasPreviewAsIcon\"\n            (itemClick)=\"onItemClick($event)\"\n            (removeFromList)=\"removeFromList($event)\">\n        </eui-file-preview>\n    </div>\n\n    <div class=\"file-upload__total-size\" *ngIf=\"filesTotalSize && hasTotalSizeDisplayed\">\n        {{ filesTotalSize | filesize }} {{ 'eui.euifileupload.TOTAL-SIZE' | translate }}\n    </div>\n</div>\n<ng-content></ng-content>\n<button euiButton class=\"file-upload__reset-button\" type=\"button\" (click)=\"resetList()\" *ngIf=\"showResetBtn\">\n    {{ 'eui.euifileupload.RESET-LIST' | translate }}\n</button>\n", styles: [".file-upload .file-upload__total-size{margin-bottom:1rem;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.file-upload .file-drop-area{outline:1px dashed var(--eui-base-color-primary-75);border-radius:3px;margin:0 0 10px;padding:30px;position:relative;transition:.2s}.file-upload .file-drop-area--active{background-color:var(--eui-base-color-primary-5);outline:3px dashed var(--eui-base-color-primary-75);border-radius:3px;margin:0 0 10px;padding:30px;position:relative;transition:.2s}.file-upload .file-drop-area--disabled{opacity:.75;cursor:not-allowed}.file-upload .file-drop-area--disabled .file-input{cursor:default}.file-upload .fake-btn{background-color:#fff;border:1px solid #9e9ec4;border-radius:3px;margin-right:8px;padding:8px 15px}.file-upload .file-input{cursor:pointer;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%}.file-upload .simple-input-file .file-input{display:none}.file-upload .file-upload__preview{align-items:center;display:flex;justify-content:space-between;margin:5px 0}.file-upload .file-upload__preview .file-upload__preview-left{align-items:center;display:flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__image{margin-right:var(--eui-base-spacing-m)}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__image img{width:180px}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__image .loading-container{text-align:center;width:180px}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__filename{display:block}.file-upload .file-upload__preview .file-upload__preview-right{align-items:center;display:flex;margin-left:auto}.file-upload .progress-bar__container{margin-bottom:var(--eui-base-spacing-2xs)}.file-upload .progress-bar__container .progress-bar{background-color:var(--eui-base-color-primary-100);height:var(--eui-base-spacing-2xs)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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.EuiFileUploadProgressComponent, selector: "eui-file-upload-progress", inputs: ["progress"] }, { kind: "component", type: i4.EuiFilePreviewComponent, selector: "eui-file-preview", inputs: ["file", "index", "previewAsIconConfig", "hasPreview", "isFilenameDisplayed", "isFilesizeDisplayed", "isFiletypeDisplayed", "hasPreviewAsImage", "hasPreviewAsIcon", "isItemsClickable"], outputs: ["removeFromList", "itemClick"] }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i6.EuiFileSizePipe, name: "filesize" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0-rc.1", ngImport: i0, type: EuiFileUploadComponent, decorators: [{
             type: Component,
@@ -202,7 +202,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0-rc.1", ng
                             useExisting: EuiFileUploadComponent,
                             multi: true,
                         },
-                    ], encapsulation: ViewEncapsulation.None, template: "<div class=\"file-upload\">\n    <div\n        class=\"file-drop-area\"\n        [class.file-drop-area--active]=\"dragEntered\"\n        [class.file-drop-area--disabled]=\"isDropAreaDisabled\"\n        *ngIf=\"hasDragArea\">\n        <span class=\"fake-btn\">{{ 'eui.euifileupload.CHOOSE-FILE' | translate }}</span>\n        <span class=\"file-msg\">{{ 'eui.euifileupload.DRAG-AND-DROP-FILE-HERE' | translate }}</span>\n        <input\n            #input\n            class=\"file-input\"\n            attr.aria-label=\"{{ 'eui.euifileupload.CHOOSE-FILE' | translate }} 'or' {{\n                'eui.euifileupload.DRAG-AND-DROP-FILE-HERE' | translate\n            }}\"\n            type=\"file\"\n            accept=\"{{ accept }}\"\n            [attr.disabled]=\"isDropAreaDisabled ? 'disabled' : null\"\n            [multiple]=\"isMultiple\"\n            (dragenter)=\"onDragEnter()\"\n            (dragleave)=\"onDragLeave()\" />\n    </div>\n    <div class=\"simple-input-file eui-u-mb-xs\" *ngIf=\"!hasDragArea\">\n        <label for=\"file-{{ randomNumberId }}\">\n            <button euiButton type=\"button\" (click)=\"openBrowseWindow()\">{{ 'eui.euifileupload.CHOOSE-FILE' | translate }}</button>\n        </label>\n\n        <input\n            #input\n            *ngIf=\"isMultiple\"\n            aria-label=\"Choose Multiple Files\"\n            class=\"file-input\"\n            id=\"file-{{ randomNumberId }}\"\n            type=\"file\"\n            accept=\"{{ accept }}\"\n            multiple />\n        <input\n            #input\n            *ngIf=\"!isMultiple\"\n            aria-label=\"Choose a single file\"\n            class=\"file-input\"\n            id=\"file-{{ randomNumberId }}\"\n            type=\"file\"\n            accept=\"{{ accept }}\" />\n    </div>\n    <eui-file-upload-progress *ngIf=\"hasProgressBar\" [progress]=\"progress\"></eui-file-upload-progress>\n\n    <div *ngFor=\"let uploadedFile of uploadedFiles; let i = index\">\n        <eui-file-preview\n            [isItemsClickable]=\"isItemsClickable\"\n            [index]=\"i\"\n            [file]=\"uploadedFile\"\n            [hasPreview]=\"hasPreview\"\n            [hasPreviewAsImage]=\"hasPreviewAsImage\"\n            [hasPreviewAsIcon]=\"hasPreviewAsIcon\"\n            (itemClick)=\"onItemClick($event)\"\n            (removeFromList)=\"removeFromUploadedList($event)\">\n        </eui-file-preview>\n    </div>\n\n    <div *ngFor=\"let file of files; let i = index\">\n        <eui-file-preview\n            [isItemsClickable]=\"isItemsClickable\"\n            [index]=\"i\"\n            [file]=\"file\"\n            [hasPreview]=\"hasPreview\"\n            [hasPreviewAsImage]=\"hasPreviewAsImage\"\n            [hasPreviewAsIcon]=\"hasPreviewAsIcon\"\n            (itemClick)=\"onItemClick($event)\"\n            (removeFromList)=\"removeFromList($event)\">\n        </eui-file-preview>\n    </div>\n\n    <div class=\"file-upload__total-size\" *ngIf=\"filesTotalSize && hasTotalSizeDisplayed\">\n        {{ filesTotalSize | filesize }} {{ 'eui.euifileupload.TOTAL-SIZE' | translate }}\n    </div>\n</div>\n<ng-content></ng-content>\n<button euiButton class=\"file-upload__reset-button\" type=\"button\" (click)=\"resetList()\" *ngIf=\"showResetBtn\">\n    {{ 'eui.euifileupload.RESET-LIST' | translate }}\n</button>\n", styles: [".file-upload .file-upload__total-size{margin-bottom:1rem;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.file-upload .file-drop-area{outline:1px dashed var(--eui-base-color-primary-75);border-radius:3px;margin:0 0 10px;padding:30px;position:relative;transition:.2s}.file-upload .file-drop-area--active{background-color:var(--eui-base-color-primary-5);outline:3px dashed var(--eui-base-color-primary-75);border-radius:3px;margin:0 0 10px;padding:30px;position:relative;transition:.2s}.file-upload .file-drop-area--disabled{opacity:.5}.file-upload .file-drop-area--disabled .file-input{cursor:default}.file-upload .fake-btn{background-color:#fff;border:1px solid #9e9ec4;border-radius:3px;margin-right:8px;padding:8px 15px}.file-upload .file-input{cursor:pointer;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%}.file-upload .simple-input-file .file-input{display:none}.file-upload .file-upload__preview{align-items:center;display:flex;justify-content:space-between;margin:5px 0}.file-upload .file-upload__preview .file-upload__preview-left{align-items:center;display:flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__image{margin-right:var(--eui-base-spacing-m)}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__image img{width:180px}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__image .loading-container{text-align:center;width:180px}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__filename{display:block}.file-upload .file-upload__preview .file-upload__preview-right{align-items:center;display:flex;margin-left:auto}.file-upload .progress-bar__container{margin-bottom:var(--eui-base-spacing-2xs)}.file-upload .progress-bar__container .progress-bar{background-color:var(--eui-base-color-primary-100);height:var(--eui-base-spacing-2xs)}\n"] }]
+                    ], encapsulation: ViewEncapsulation.None, template: "<div class=\"file-upload\">\n    <div\n        class=\"file-drop-area\"\n        [class.file-drop-area--active]=\"dragEntered\"\n        [class.file-drop-area--disabled]=\"isDropAreaDisabled\"\n        *ngIf=\"hasDragArea\">\n        <span class=\"fake-btn\">{{ 'eui.euifileupload.CHOOSE-FILE' | translate }}</span>\n        <span class=\"file-msg\">{{ 'eui.euifileupload.DRAG-AND-DROP-FILE-HERE' | translate }}</span>\n        <input\n            #input\n            class=\"file-input\"\n            attr.aria-label=\"{{ 'eui.euifileupload.CHOOSE-FILE' | translate }} 'or' {{\n                'eui.euifileupload.DRAG-AND-DROP-FILE-HERE' | translate\n            }}\"\n            type=\"file\"\n            accept=\"{{ accept }}\"\n            [attr.disabled]=\"isDropAreaDisabled ? 'disabled' : null\"\n            [multiple]=\"isMultiple\"\n            (dragenter)=\"onDragEnter()\"\n            (dragleave)=\"onDragLeave()\" />\n    </div>\n    <div class=\"simple-input-file eui-u-mb-xs\" *ngIf=\"!hasDragArea\">\n        <label for=\"file-{{ randomNumberId }}\">\n            <button euiButton type=\"button\" (click)=\"openBrowseWindow()\">{{ 'eui.euifileupload.CHOOSE-FILE' | translate }}</button>\n        </label>\n\n        <input\n            #input\n            *ngIf=\"isMultiple\"\n            aria-label=\"Choose Multiple Files\"\n            class=\"file-input\"\n            id=\"file-{{ randomNumberId }}\"\n            type=\"file\"\n            accept=\"{{ accept }}\"\n            multiple />\n        <input\n            #input\n            *ngIf=\"!isMultiple\"\n            aria-label=\"Choose a single file\"\n            class=\"file-input\"\n            id=\"file-{{ randomNumberId }}\"\n            type=\"file\"\n            accept=\"{{ accept }}\" />\n    </div>\n    <eui-file-upload-progress *ngIf=\"hasProgressBar\" [progress]=\"progress\"></eui-file-upload-progress>\n\n    <div *ngFor=\"let uploadedFile of uploadedFiles; let i = index\">\n        <eui-file-preview\n            [isItemsClickable]=\"isItemsClickable\"\n            [index]=\"i\"\n            [file]=\"uploadedFile\"\n            [hasPreview]=\"hasPreview\"\n            [hasPreviewAsImage]=\"hasPreviewAsImage\"\n            [hasPreviewAsIcon]=\"hasPreviewAsIcon\"\n            (itemClick)=\"onItemClick($event)\"\n            (removeFromList)=\"removeFromUploadedList($event)\">\n        </eui-file-preview>\n    </div>\n\n    <div *ngFor=\"let file of files; let i = index\">\n        <eui-file-preview\n            [isItemsClickable]=\"isItemsClickable\"\n            [index]=\"i\"\n            [file]=\"file\"\n            [hasPreview]=\"hasPreview\"\n            [hasPreviewAsImage]=\"hasPreviewAsImage\"\n            [hasPreviewAsIcon]=\"hasPreviewAsIcon\"\n            (itemClick)=\"onItemClick($event)\"\n            (removeFromList)=\"removeFromList($event)\">\n        </eui-file-preview>\n    </div>\n\n    <div class=\"file-upload__total-size\" *ngIf=\"filesTotalSize && hasTotalSizeDisplayed\">\n        {{ filesTotalSize | filesize }} {{ 'eui.euifileupload.TOTAL-SIZE' | translate }}\n    </div>\n</div>\n<ng-content></ng-content>\n<button euiButton class=\"file-upload__reset-button\" type=\"button\" (click)=\"resetList()\" *ngIf=\"showResetBtn\">\n    {{ 'eui.euifileupload.RESET-LIST' | translate }}\n</button>\n", styles: [".file-upload .file-upload__total-size{margin-bottom:1rem;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.file-upload .file-drop-area{outline:1px dashed var(--eui-base-color-primary-75);border-radius:3px;margin:0 0 10px;padding:30px;position:relative;transition:.2s}.file-upload .file-drop-area--active{background-color:var(--eui-base-color-primary-5);outline:3px dashed var(--eui-base-color-primary-75);border-radius:3px;margin:0 0 10px;padding:30px;position:relative;transition:.2s}.file-upload .file-drop-area--disabled{opacity:.75;cursor:not-allowed}.file-upload .file-drop-area--disabled .file-input{cursor:default}.file-upload .fake-btn{background-color:#fff;border:1px solid #9e9ec4;border-radius:3px;margin-right:8px;padding:8px 15px}.file-upload .file-input{cursor:pointer;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%}.file-upload .simple-input-file .file-input{display:none}.file-upload .file-upload__preview{align-items:center;display:flex;justify-content:space-between;margin:5px 0}.file-upload .file-upload__preview .file-upload__preview-left{align-items:center;display:flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__image{margin-right:var(--eui-base-spacing-m)}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__image img{width:180px}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__image .loading-container{text-align:center;width:180px}.file-upload .file-upload__preview .file-upload__preview-left .file-upload__preview__filename{display:block}.file-upload .file-upload__preview .file-upload__preview-right{align-items:center;display:flex;margin-left:auto}.file-upload .progress-bar__container{margin-bottom:var(--eui-base-spacing-2xs)}.file-upload .progress-bar__container .progress-bar{background-color:var(--eui-base-color-primary-100);height:var(--eui-base-spacing-2xs)}\n"] }]
         }], propDecorators: { e2eAttr: [{
                 type: Input
             }], progress: [{

package/esm2022/eui-list/eui-list-item/eui-list-item.component.mjs

@@ -70,11 +70,11 @@ export class EuiListItemComponent extends BaseDirective {
         this.isActive = false;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.0-rc.1", ngImport: i0, type: EuiListItemComponent, deps: [{ token: i1.EuiListService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.0-rc.1", type: EuiListItemComponent, selector: "[euiListItem], eui-list-item", inputs: { disabled: "disabled", isCollapsible: "isCollapsible", isCollapsed: "isCollapsed", isActive: "isActive" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.tabindex": "this.tabindex" } }, queries: [{ propertyName: "euiListComponent", predicate: i0.forwardRef(() => EuiListComponent) }, { propertyName: "euiIconComponent", predicate: i0.forwardRef(() => EuiIconComponent) }, { propertyName: "euiIconSvgComponent", predicate: i0.forwardRef(() => EuiIconSvgComponent) }, { propertyName: "euiLabelComponent", predicate: i0.forwardRef(() => EuiLabelComponent) }], usesInheritance: true, ngImport: i0, template: "<div class=\"eui-list-item__container\" [class.eui-list-item--has-submenu]=\"euiListComponent.length > 0\">\n    <div class=\"eui-list-item__content\">\n        <div class=\"eui-list-item__content-left\">\n            <div *ngIf=\"euiIconComponent.length > 0\" class=\"eui-list-item__content-icon\">\n                <ng-content select=\"[eui-icon], [euiIcon]\"></ng-content>\n            </div>\n            <div *ngIf=\"euiIconSvgComponent.length > 0\" class=\"eui-list-item__content-icon-svg\">\n                <ng-content select=\"eui-icon-svg\"></ng-content>\n            </div>\n            <div *ngIf=\"euiLabelComponent.length > 0\" class=\"eui-list-item__content-text\">\n                <ng-content select=\"[eui-label], [euiLabel]\"></ng-content>\n            </div>\n        </div>\n        <div class=\"eui-list-item__content-right\">\n            <button\n                *ngIf=\"euiListComponent.length > 0 && isCollapsible\"\n                tabindex=\"-1\"\n                euiButton\n                euiBasicButton\n                euiPrimary\n                euiRounded\n                euiIconButton\n                euiSizeS\n                type=\"button\"\n                class=\"eui-list-item__content-toggle\"\n                [class.eui-list-item__content-toggle--expanded]=\"!isCollapsed\"\n                (click)=\"toggleCollapse($event)\">\n                <eui-icon-svg icon=\"eui-chevron-down\" aria-label=\"{{ isCollapsed ? 'Expand' : 'Collapse' }}\"></eui-icon-svg>\n            </button>\n        </div>\n    </div>\n    <div\n        class=\"eui-list-item__sub-list\"\n        *ngIf=\"(euiListComponent.length > 0 && !isCollapsed) || (euiListComponent.length > 0 && !isCollapsible)\">\n        <ng-content select=\"[eui-list], [euiList]\"></ng-content>\n    </div>\n    <ng-content></ng-content>\n</div>\n", styles: [".eui-list{display:block;height:auto;position:relative;margin:0;padding:0}.eui-list:focus:active:not([readonly]),.eui-list:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list:focus [tabindex=\"0\"]:active:not([readonly]),.eui-list:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list .eui-list-item{background:none;border:none;box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item:hover{background-color:var(--eui-base-color-grey-10)}.eui-list .eui-list-item:focus{outline:2px solid var(--eui-base-color-accessible-focus)!important;outline-offset:-2px;-moz-outline-radius:var(--eui-base-border-radius)!important;transition:outline .15s ease-in-out,border .15s ease-in-out}.eui-list .eui-list-item--active{background-color:var(--eui-base-color-primary-10)}.eui-list .eui-list-item--active:active:not([readonly]),.eui-list .eui-list-item--active:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list .eui-list-item--active [tabindex=\"0\"]:active:not([readonly]),.eui-list .eui-list-item--active [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list .eui-list-item .eui-list-item__container{display:inline-flex;width:100%}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content{align-items:center;display:inline-flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left{align-items:center;display:flex;width:100%}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon{align-items:center;display:flex}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon .eui-icon{margin-right:var(--eui-base-spacing-xs)}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon-svg{align-items:center;display:flex}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon-svg .eui-icon-svg{margin-right:var(--eui-base-spacing-xs)}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-text{display:flex;flex-direction:column;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-text .eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-right{align-items:center;display:flex;margin-left:auto}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-right .eui-list-item__content-toggle{align-items:center;display:inline-flex;font-size:var(--eui-base-font-size-m);margin-left:var(--eui-base-spacing-s);transition:all .3s linear}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu{display:block;width:100%}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__content{align-items:center;display:flex;width:100%}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list{margin-left:var(--eui-base-spacing-m)}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list .eui-list-item{padding-right:0}.eui-list .eui-list-item .eui-list-item__container .eui-icon{margin-right:var(--eui-base-spacing-s)}.eui-list .eui-list-item .eui-list-item__container .eui-button{margin-left:var(--eui-base-spacing-s)}.eui-list button.eui-list-item{padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs)}navigation-list nav{height:auto}.eui-list-item--primary{color:var(--eui-base-color-primary-100)}.eui-list-item--secondary{color:var(--eui-base-color-grey-90)}.eui-list-item--info{color:var(--eui-base-color-info-100)}.eui-list-item--success{color:var(--eui-base-color-success-100)}.eui-list-item--warning{color:var(--eui-base-color-warning-140)}.eui-list-item--danger{color:var(--eui-base-color-danger-100)}.eui-list-item__content-toggle--expanded{transform:rotate(-180deg)}.eui-list-item--disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed;opacity:var(--eui-base-disabled-opacity)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.0-rc.1", type: EuiListItemComponent, selector: "[euiListItem], eui-list-item", inputs: { disabled: "disabled", isCollapsible: "isCollapsible", isCollapsed: "isCollapsed", isActive: "isActive" }, host: { properties: { "class": "this.cssClasses", "attr.role": "this.role", "attr.tabindex": "this.tabindex" } }, queries: [{ propertyName: "euiListComponent", predicate: i0.forwardRef(() => EuiListComponent) }, { propertyName: "euiIconComponent", predicate: i0.forwardRef(() => EuiIconComponent) }, { propertyName: "euiIconSvgComponent", predicate: i0.forwardRef(() => EuiIconSvgComponent) }, { propertyName: "euiLabelComponent", predicate: i0.forwardRef(() => EuiLabelComponent) }], usesInheritance: true, ngImport: i0, template: "<div class=\"eui-list-item__container\" [class.eui-list-item--has-submenu]=\"euiListComponent.length > 0\">\n    <div class=\"eui-list-item__content\">\n        <div class=\"eui-list-item__content-left\">\n            <div *ngIf=\"euiIconComponent.length > 0\" class=\"eui-list-item__content-icon\">\n                <ng-content select=\"[eui-icon], [euiIcon]\"></ng-content>\n            </div>\n            <div *ngIf=\"euiIconSvgComponent.length > 0\" class=\"eui-list-item__content-icon-svg\">\n                <ng-content select=\"eui-icon-svg\"></ng-content>\n            </div>\n            <div *ngIf=\"euiLabelComponent.length > 0\" class=\"eui-list-item__content-text\">\n                <ng-content select=\"[eui-label], [euiLabel]\"></ng-content>\n            </div>\n        </div>\n        <div class=\"eui-list-item__content-right\">\n            <button\n                *ngIf=\"euiListComponent.length > 0 && isCollapsible\"\n                tabindex=\"-1\"\n                euiButton\n                euiBasicButton\n                euiPrimary\n                euiRounded\n                euiIconButton\n                euiSizeS\n                type=\"button\"\n                class=\"eui-list-item__content-toggle\"\n                [class.eui-list-item__content-toggle--expanded]=\"!isCollapsed\"\n                (click)=\"toggleCollapse($event)\">\n                <eui-icon-svg icon=\"eui-chevron-down\" aria-label=\"{{ isCollapsed ? 'Expand' : 'Collapse' }}\"></eui-icon-svg>\n            </button>\n        </div>\n    </div>\n    <div\n        class=\"eui-list-item__sub-list\"\n        *ngIf=\"(euiListComponent.length > 0 && !isCollapsed) || (euiListComponent.length > 0 && !isCollapsible)\">\n        <ng-content select=\"[eui-list], [euiList]\"></ng-content>\n    </div>\n    <ng-content></ng-content>\n</div>\n", styles: [".eui-list{display:block;height:auto;position:relative;margin:0;padding:0}.eui-list:focus:active:not([readonly]),.eui-list:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list:focus [tabindex=\"0\"]:active:not([readonly]),.eui-list:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list .eui-list-item{background:none;border:none;box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item:hover{background-color:var(--eui-base-color-grey-10)}.eui-list .eui-list-item:focus{outline:2px solid var(--eui-base-color-accessible-focus)!important;outline-offset:-2px;-moz-outline-radius:var(--eui-base-border-radius)!important;transition:outline .15s ease-in-out,border .15s ease-in-out}.eui-list .eui-list-item--active{background-color:var(--eui-base-color-primary-10)}.eui-list .eui-list-item--active:active:not([readonly]),.eui-list .eui-list-item--active:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list .eui-list-item--active [tabindex=\"0\"]:active:not([readonly]),.eui-list .eui-list-item--active [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list .eui-list-item .eui-list-item__container{display:inline-flex;width:100%}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content{align-items:center;display:inline-flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left{align-items:center;display:flex;width:100%}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon{align-items:center;display:flex}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon .eui-icon{margin-right:var(--eui-base-spacing-xs)}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon-svg{align-items:center;display:flex}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon-svg .eui-icon-svg{margin-right:var(--eui-base-spacing-xs)}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-text{display:flex;flex-direction:column;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-text .eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-right{align-items:center;display:flex;margin-left:auto}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-right .eui-list-item__content-toggle{align-items:center;display:inline-flex;font-size:var(--eui-base-font-size-m);margin-left:var(--eui-base-spacing-s);transition:all .3s linear}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu{display:block;width:100%}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__content{align-items:center;display:flex;width:100%}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list{margin-left:var(--eui-base-spacing-m)}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list .eui-list-item{padding-right:0}.eui-list .eui-list-item .eui-list-item__container .eui-icon{margin-right:var(--eui-base-spacing-s)}.eui-list .eui-list-item .eui-list-item__container .eui-button{margin-left:var(--eui-base-spacing-s)}.eui-list button.eui-list-item{padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs)}navigation-list nav{height:auto}.eui-list-item--primary{color:var(--eui-base-color-primary-100)}.eui-list-item--secondary{color:var(--eui-base-color-grey-90)}.eui-list-item--info{color:var(--eui-base-color-info-100)}.eui-list-item--success{color:var(--eui-base-color-success-100)}.eui-list-item--warning{color:var(--eui-base-color-warning-140)}.eui-list-item--danger{color:var(--eui-base-color-danger-100)}.eui-list-item__content-toggle--expanded{transform:rotate(-180deg)}.eui-list-item--disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-base-disabled-opacity)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.0-rc.1", ngImport: i0, type: EuiListItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: '[euiListItem], eui-list-item', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<div class=\"eui-list-item__container\" [class.eui-list-item--has-submenu]=\"euiListComponent.length > 0\">\n    <div class=\"eui-list-item__content\">\n        <div class=\"eui-list-item__content-left\">\n            <div *ngIf=\"euiIconComponent.length > 0\" class=\"eui-list-item__content-icon\">\n                <ng-content select=\"[eui-icon], [euiIcon]\"></ng-content>\n            </div>\n            <div *ngIf=\"euiIconSvgComponent.length > 0\" class=\"eui-list-item__content-icon-svg\">\n                <ng-content select=\"eui-icon-svg\"></ng-content>\n            </div>\n            <div *ngIf=\"euiLabelComponent.length > 0\" class=\"eui-list-item__content-text\">\n                <ng-content select=\"[eui-label], [euiLabel]\"></ng-content>\n            </div>\n        </div>\n        <div class=\"eui-list-item__content-right\">\n            <button\n                *ngIf=\"euiListComponent.length > 0 && isCollapsible\"\n                tabindex=\"-1\"\n                euiButton\n                euiBasicButton\n                euiPrimary\n                euiRounded\n                euiIconButton\n                euiSizeS\n                type=\"button\"\n                class=\"eui-list-item__content-toggle\"\n                [class.eui-list-item__content-toggle--expanded]=\"!isCollapsed\"\n                (click)=\"toggleCollapse($event)\">\n                <eui-icon-svg icon=\"eui-chevron-down\" aria-label=\"{{ isCollapsed ? 'Expand' : 'Collapse' }}\"></eui-icon-svg>\n            </button>\n        </div>\n    </div>\n    <div\n        class=\"eui-list-item__sub-list\"\n        *ngIf=\"(euiListComponent.length > 0 && !isCollapsed) || (euiListComponent.length > 0 && !isCollapsible)\">\n        <ng-content select=\"[eui-list], [euiList]\"></ng-content>\n    </div>\n    <ng-content></ng-content>\n</div>\n", styles: [".eui-list{display:block;height:auto;position:relative;margin:0;padding:0}.eui-list:focus:active:not([readonly]),.eui-list:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list:focus [tabindex=\"0\"]:active:not([readonly]),.eui-list:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list .eui-list-item{background:none;border:none;box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item:hover{background-color:var(--eui-base-color-grey-10)}.eui-list .eui-list-item:focus{outline:2px solid var(--eui-base-color-accessible-focus)!important;outline-offset:-2px;-moz-outline-radius:var(--eui-base-border-radius)!important;transition:outline .15s ease-in-out,border .15s ease-in-out}.eui-list .eui-list-item--active{background-color:var(--eui-base-color-primary-10)}.eui-list .eui-list-item--active:active:not([readonly]),.eui-list .eui-list-item--active:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list .eui-list-item--active [tabindex=\"0\"]:active:not([readonly]),.eui-list .eui-list-item--active [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list .eui-list-item .eui-list-item__container{display:inline-flex;width:100%}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content{align-items:center;display:inline-flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left{align-items:center;display:flex;width:100%}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon{align-items:center;display:flex}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon .eui-icon{margin-right:var(--eui-base-spacing-xs)}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon-svg{align-items:center;display:flex}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon-svg .eui-icon-svg{margin-right:var(--eui-base-spacing-xs)}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-text{display:flex;flex-direction:column;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-text .eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-right{align-items:center;display:flex;margin-left:auto}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-right .eui-list-item__content-toggle{align-items:center;display:inline-flex;font-size:var(--eui-base-font-size-m);margin-left:var(--eui-base-spacing-s);transition:all .3s linear}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu{display:block;width:100%}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__content{align-items:center;display:flex;width:100%}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list{margin-left:var(--eui-base-spacing-m)}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list .eui-list-item{padding-right:0}.eui-list .eui-list-item .eui-list-item__container .eui-icon{margin-right:var(--eui-base-spacing-s)}.eui-list .eui-list-item .eui-list-item__container .eui-button{margin-left:var(--eui-base-spacing-s)}.eui-list button.eui-list-item{padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs)}navigation-list nav{height:auto}.eui-list-item--primary{color:var(--eui-base-color-primary-100)}.eui-list-item--secondary{color:var(--eui-base-color-grey-90)}.eui-list-item--info{color:var(--eui-base-color-info-100)}.eui-list-item--success{color:var(--eui-base-color-success-100)}.eui-list-item--warning{color:var(--eui-base-color-warning-140)}.eui-list-item--danger{color:var(--eui-base-color-danger-100)}.eui-list-item__content-toggle--expanded{transform:rotate(-180deg)}.eui-list-item--disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed;opacity:var(--eui-base-disabled-opacity)}\n"] }]
+            args: [{ selector: '[euiListItem], eui-list-item', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<div class=\"eui-list-item__container\" [class.eui-list-item--has-submenu]=\"euiListComponent.length > 0\">\n    <div class=\"eui-list-item__content\">\n        <div class=\"eui-list-item__content-left\">\n            <div *ngIf=\"euiIconComponent.length > 0\" class=\"eui-list-item__content-icon\">\n                <ng-content select=\"[eui-icon], [euiIcon]\"></ng-content>\n            </div>\n            <div *ngIf=\"euiIconSvgComponent.length > 0\" class=\"eui-list-item__content-icon-svg\">\n                <ng-content select=\"eui-icon-svg\"></ng-content>\n            </div>\n            <div *ngIf=\"euiLabelComponent.length > 0\" class=\"eui-list-item__content-text\">\n                <ng-content select=\"[eui-label], [euiLabel]\"></ng-content>\n            </div>\n        </div>\n        <div class=\"eui-list-item__content-right\">\n            <button\n                *ngIf=\"euiListComponent.length > 0 && isCollapsible\"\n                tabindex=\"-1\"\n                euiButton\n                euiBasicButton\n                euiPrimary\n                euiRounded\n                euiIconButton\n                euiSizeS\n                type=\"button\"\n                class=\"eui-list-item__content-toggle\"\n                [class.eui-list-item__content-toggle--expanded]=\"!isCollapsed\"\n                (click)=\"toggleCollapse($event)\">\n                <eui-icon-svg icon=\"eui-chevron-down\" aria-label=\"{{ isCollapsed ? 'Expand' : 'Collapse' }}\"></eui-icon-svg>\n            </button>\n        </div>\n    </div>\n    <div\n        class=\"eui-list-item__sub-list\"\n        *ngIf=\"(euiListComponent.length > 0 && !isCollapsed) || (euiListComponent.length > 0 && !isCollapsible)\">\n        <ng-content select=\"[eui-list], [euiList]\"></ng-content>\n    </div>\n    <ng-content></ng-content>\n</div>\n", styles: [".eui-list{display:block;height:auto;position:relative;margin:0;padding:0}.eui-list:focus:active:not([readonly]),.eui-list:focus:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list:focus [tabindex=\"0\"]:active:not([readonly]),.eui-list:focus [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list .eui-list-item{background:none;border:none;box-shadow:none;cursor:pointer;display:block;max-width:100%;outline:none;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-s);position:relative;-webkit-tap-highlight-color:transparent;text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;width:100%;list-style:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item:hover{background-color:var(--eui-base-color-grey-10)}.eui-list .eui-list-item:focus{outline:2px solid var(--eui-base-color-accessible-focus)!important;outline-offset:-2px;-moz-outline-radius:var(--eui-base-border-radius)!important;transition:outline .15s ease-in-out,border .15s ease-in-out}.eui-list .eui-list-item--active{background-color:var(--eui-base-color-primary-10)}.eui-list .eui-list-item--active:active:not([readonly]),.eui-list .eui-list-item--active:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list .eui-list-item--active [tabindex=\"0\"]:active:not([readonly]),.eui-list .eui-list-item--active [tabindex=\"0\"]:focus:not([readonly]){outline:2px solid var(--eui-base-color-accessible-focus);outline-offset:-2px;transition:none}.eui-list .eui-list-item .eui-list-item__container{display:inline-flex;width:100%}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content{align-items:center;display:inline-flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left{align-items:center;display:flex;width:100%}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon{align-items:center;display:flex}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon .eui-icon{margin-right:var(--eui-base-spacing-xs)}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon-svg{align-items:center;display:flex}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-icon-svg .eui-icon-svg{margin-right:var(--eui-base-spacing-xs)}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-text{display:flex;flex-direction:column;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-left .eui-list-item__content-text .eui-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-right{align-items:center;display:flex;margin-left:auto}.eui-list .eui-list-item .eui-list-item__container .eui-list-item__content .eui-list-item__content-right .eui-list-item__content-toggle{align-items:center;display:inline-flex;font-size:var(--eui-base-font-size-m);margin-left:var(--eui-base-spacing-s);transition:all .3s linear}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu{display:block;width:100%}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__content{align-items:center;display:flex;width:100%}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list{margin-left:var(--eui-base-spacing-m)}.eui-list .eui-list-item .eui-list-item__container.eui-list-item--has-submenu .eui-list-item__sub-list .eui-list-item{padding-right:0}.eui-list .eui-list-item .eui-list-item__container .eui-icon{margin-right:var(--eui-base-spacing-s)}.eui-list .eui-list-item .eui-list-item__container .eui-button{margin-left:var(--eui-base-spacing-s)}.eui-list button.eui-list-item{padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs)}navigation-list nav{height:auto}.eui-list-item--primary{color:var(--eui-base-color-primary-100)}.eui-list-item--secondary{color:var(--eui-base-color-grey-90)}.eui-list-item--info{color:var(--eui-base-color-info-100)}.eui-list-item--success{color:var(--eui-base-color-success-100)}.eui-list-item--warning{color:var(--eui-base-color-warning-140)}.eui-list-item--danger{color:var(--eui-base-color-danger-100)}.eui-list-item__content-toggle--expanded{transform:rotate(-180deg)}.eui-list-item--disabled{pointer-events:none;background-image:none;box-shadow:none;cursor:not-allowed!important;opacity:var(--eui-base-disabled-opacity)}\n"] }]
         }], ctorParameters: () => [{ type: i1.EuiListService }, { type: i0.ElementRef }], propDecorators: { cssClasses: [{
                 type: HostBinding,
                 args: ['class']