@eui/components 18.0.0-next.29 → 18.0.0-next.30

package/fesm2022/eui-components-eui-popover.mjs

@@ -79,62 +79,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4",
 }] } });
 
 // eui-popover.component.mjs
-import { Component, ChangeDetectionStrategy, ViewEncapsulation, Input as Input2, ViewChild, Output, EventEmitter } from "@angular/core";
+import { Component, ChangeDetectionStrategy, ViewEncapsulation, Input as Input2, ViewChild, Output, EventEmitter, booleanAttribute } from "@angular/core";
 import { TemplatePortal } from "@angular/cdk/portal";
 import { BehaviorSubject, Subject as Subject2, Subscription } from "rxjs";
 import { distinctUntilChanged, map, switchMap, takeUntil as takeUntil2 } from "rxjs/operators";
-import { coerceBooleanProperty } from "@angular/cdk/coercion";
-import { BaseDirective } from "@eui/components/shared";
+import { BaseStatesDirective } from "@eui/components/shared";
 import * as i02 from "@angular/core";
 import * as i1 from "@angular/cdk/overlay";
-import * as i2 from "@angular/common";
-import * as i3 from "@eui/components/eui-button";
-import * as i4 from "@eui/components/eui-icon";
-import * as i5 from "@angular/cdk/a11y";
-import * as i6 from "@angular/cdk/observers";
-var EuiPopoverComponent = class _EuiPopoverComponent extends BaseDirective {
-  get isOpen() {
-    return this._isOpen;
-  }
-  set isOpen(value) {
-    this._isOpen = coerceBooleanProperty(value);
-  }
-  get hasBackDrop() {
-    return this._hasBackDrop;
-  }
-  set hasBackDrop(value) {
-    this._hasBackDrop = coerceBooleanProperty(value);
-  }
-  get hasCloseButton() {
-    return this._hasCloseButton;
-  }
-  set hasCloseButton(value) {
-    this._hasCloseButton = coerceBooleanProperty(value);
-  }
-  get isDismissable() {
-    return this._isDismissable;
-  }
-  set isDismissable(value) {
-    this._isDismissable = coerceBooleanProperty(value);
-  }
-  constructor(overlay, viewContainerRef, scrollDispatcher) {
-    super();
+import * as i2 from "@eui/components/shared";
+import * as i3 from "@angular/common";
+import * as i4 from "@eui/components/eui-button";
+import * as i5 from "@eui/components/eui-icon";
+import * as i6 from "@angular/cdk/a11y";
+import * as i7 from "@angular/cdk/observers";
+var EuiPopoverComponent = class _EuiPopoverComponent {
+  constructor(overlay, viewContainerRef, scrollDispatcher, baseStatesDirective) {
     this.overlay = overlay;
     this.viewContainerRef = viewContainerRef;
     this.scrollDispatcher = scrollDispatcher;
+    this.baseStatesDirective = baseStatesDirective;
     this.position = "bottom";
     this.size = "default";
     this.type = "default";
     this.width = null;
+    this.hasBackDrop = false;
+    this.hasCloseButton = true;
+    this.isDismissable = true;
     this.outsideClick = new EventEmitter();
     this.popoverOpen = new EventEmitter();
     this.popoverClose = new EventEmitter();
     this.cdkTrapFocusAutoCapture = true;
-    this.sizeClass = "m";
-    this._isOpen = false;
-    this._hasBackDrop = false;
-    this._hasCloseButton = true;
-    this._isDismissable = true;
     this.destroy$ = new Subject2();
     this.isOpen$ = new BehaviorSubject(false);
     this.scrollDispatcherSubscription = new Subscription();
@@ -151,20 +125,8 @@ var EuiPopoverComponent = class _EuiPopoverComponent extends BaseDirective {
     } else {
       this.preferredPositons = [BOTTOM, TOP, LEFT, RIGHT];
     }
-    if (c.size) {
-      if (c.size.currentValue === "default") {
-        this.sizeClass = "m";
-      } else if (c.size.currentValue === "small") {
-        this.sizeClass = "s";
-      } else if (c.size.currentValue === "large") {
-        this.sizeClass = "l";
-      } else {
-        this.sizeClass = c.size.currentValue;
-      }
-    }
   }
   ngOnInit() {
-    this.statesClass = [super.getCssClasses("eui-popover")].join(" ").trim();
     this.setPositionStream();
   }
   ngAfterViewInit() {
@@ -177,19 +139,24 @@ var EuiPopoverComponent = class _EuiPopoverComponent extends BaseDirective {
     this.overlayRef?.dispose();
     this.overlayRef = null;
   }
+  /** @deprecated This will be removed in next version of eui in favor of isOpen */
+  get isPopoverOpen() {
+    return this.isOpen$.value;
+  }
   /**
    * Whether the eui-popover is open.
    *
    * @usageNotes
    * ```html
    * <eui-popover #popover>
-   *      <my-component *ngIf="popover.isPopoverOpen"></my-component>
+   *     \@if (popover.isOpen) {
+   *          <my-component></my-component>
+   *     }
    * </eui-popover>
    * ```
    * @returns A boolean with value `true` when open, otherwise `false`.
    */
-  // TODO: In next version, remove isOpen @Input which is not used, deprecated this isPopoverOpen and create isOpen instead
-  get isPopoverOpen() {
+  get isOpen() {
     return this.isOpen$.value;
   }
   onContentChange() {
@@ -218,7 +185,8 @@ var EuiPopoverComponent = class _EuiPopoverComponent extends BaseDirective {
         positionStrategy,
         scrollStrategy,
         disposeOnNavigation: true,
-        width: this.width
+        width: this.width,
+        panelClass: this.baseStatesDirective.getCssClasses("eui-popover").split(" ")
       });
       this.overlayRef.attach(this.templatePortal);
       this.positionStrategy = positionStrategy;
@@ -270,98 +238,28 @@ var EuiPopoverComponent = class _EuiPopoverComponent extends BaseDirective {
     }));
   }
   static {
-    this.ɵfac = i02.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i02, type: _EuiPopoverComponent, deps: [{ token: i1.Overlay }, { token: i02.ViewContainerRef }, { token: i1.ScrollDispatcher }], target: i02.ɵɵFactoryTarget.Component });
+    this.ɵfac = i02.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i02, type: _EuiPopoverComponent, deps: [{ token: i1.Overlay }, { token: i02.ViewContainerRef }, { token: i1.ScrollDispatcher }, { token: i2.BaseStatesDirective }], target: i02.ɵɵFactoryTarget.Component });
   }
   static {
-    this.ɵcmp = i02.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.4", type: _EuiPopoverComponent, selector: "eui-popover", inputs: { title: "title", position: "position", size: "size", type: "type", width: "width", isOpen: "isOpen", hasBackDrop: "hasBackDrop", hasCloseButton: "hasCloseButton", isDismissable: "isDismissable" }, outputs: { outsideClick: "outsideClick", popoverOpen: "popoverOpen", popoverClose: "popoverClose" }, viewQueries: [{ propertyName: "templatePortalContent", first: true, predicate: ["templatePortalContent"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i02, template: `<ng-template #templatePortalContent>
-    <ng-container *ngIf="cdkTrapFocusAutoCapture">
-        <ng-container *ngTemplateOutlet="tmpl; context: { $implicit: true }"></ng-container>
-    </ng-container>
-    <ng-container *ngIf="!cdkTrapFocusAutoCapture">
-        <ng-container *ngTemplateOutlet="tmpl; context: { $implicit: false }"></ng-container>
-    </ng-container>
-</ng-template>
-
-<ng-template #tmpl let-autoCapture>
-    <div
-        cdkTrapFocus
-        [cdkTrapFocusAutoCapture]="autoCapture"
-        class="eui-popover eui-popover--{{ type }} {{ statesClass }}"
-        [class.eui-popover--has-custom-width]="width"
-        [ngClass]="!width ? 'eui-popover--size-' + sizeClass : ''"
-        (keydown)="onKeyDown($event)">
-        <div class="eui-popover__arrow" [euiPopoverArrowPosition]="position$">
-            <div class="eui-popover__arrow-inner"></div>
-        </div>
-        <div *ngIf="title" class="eui-popover__header">
-            <div class="eui-popover__header-title">{{ title }}</div>
-            <button
-                euiButton
-                euiRounded
-                euiIconButton
-                euiBasicButton
-                euiSizeS
-                class="eui-popover__header-close"
-                aria-label="Close Icon Button"
-                *ngIf="hasCloseButton"
-                (click)="closePopover()">
-                <eui-icon-svg icon="eui-close" fillColor="primary-100" aria-label="Close Icon" class="eui-popover__header-close-icon">
-                </eui-icon-svg>
-            </button>
-        </div>
-        <div (cdkObserveContent)="onContentChange()" class="eui-popover__content">
-            <ng-content></ng-content>
-        </div>
-    </div>
-</ng-template>
-`, styles: ['.eui-popover-position .eui-popover__arrow{border-color:inherit;border-style:solid;border-width:8px;display:none;height:0;position:absolute;width:0}.eui-popover-position .eui-popover__arrow-inner{border-color:var(--eui-base-color-white);border-style:solid;border-width:7px;content:" ";display:block;height:0;position:absolute;width:0}.eui-popover-position--top .eui-popover__arrow,.eui-popover-position--bottom .eui-popover__arrow,.eui-popover-position--left .eui-popover__arrow,.eui-popover-position--right .eui-popover__arrow{display:block}.eui-popover-position--top .eui-popover__arrow,.eui-popover-position--bottom .eui-popover__arrow{border-left-color:transparent;border-right-color:transparent;left:50%;transform:translate(-8px)}.eui-popover-position--top .eui-popover__arrow-inner,.eui-popover-position--bottom .eui-popover__arrow-inner{border-left-color:transparent;border-right-color:transparent;margin-left:-7px}.eui-popover-position--top .eui-popover__arrow{border-bottom-width:0;bottom:-7px}.eui-popover-position--top .eui-popover__arrow-inner{border-bottom-width:0;bottom:2px}.eui-popover-position--bottom .eui-popover__arrow{border-top-width:0;top:-7px}.eui-popover-position--bottom .eui-popover__arrow-inner{border-top-width:0;top:1px}.eui-popover-position--left .eui-popover__arrow,.eui-popover-position--right .eui-popover__arrow{border-bottom-color:transparent;border-top-color:transparent;top:50%;transform:translateY(-8px)}.eui-popover-position--left .eui-popover__arrow-inner,.eui-popover-position--right .eui-popover__arrow-inner{border-bottom-color:transparent;border-top-color:transparent;top:-7px}.eui-popover-position--left .eui-popover__arrow{border-right-width:0;right:-7px}.eui-popover-position--left .eui-popover__arrow-inner{border-right-width:0;right:2px}.eui-popover-position--right .eui-popover__arrow{border-left-width:0;left:-7px}.eui-popover-position--right .eui-popover__arrow-inner{border-left-width:0;border-right-color:var(--eui-base-color-white);left:2px}.eui-popover{background-color:var(--eui-base-color-white);border:1px solid var(--eui-base-color-grey-15);border-radius:var(--eui-base-border-radius);box-shadow:var(--eui-base-shadow-2)}.eui-popover__header{align-items:center;border-bottom:1px solid var(--eui-base-color-grey-15);display:flex;justify-content:space-between;padding:var(--eui-base-spacing-xs)}.eui-popover__header-title{font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-popover__content{padding:var(--eui-base-spacing-xs)}.eui-popover--primary .eui-popover__header-title{color:var(--eui-base-color-primary-100)}.eui-popover--secondary .eui-popover__header-title{color:var(--eui-base-color-grey-80)}.eui-popover--info .eui-popover__header-title{color:var(--eui-base-color-info-100)}.eui-popover--success .eui-popover__header-title{color:var(--eui-base-color-success-100)}.eui-popover--warning .eui-popover__header-title{color:var(--eui-base-color-warning-100)}.eui-popover--danger .eui-popover__header-title{color:var(--eui-base-color-danger-100)}.eui-popover--accent .eui-popover__header-title{color:var(--eui-base-color-accent-100)}.eui-popover--has-custom-width{width:100%!important}.eui-popover--size-s{max-width:12rem;width:12rem}.eui-popover--size-m{max-width:25rem;width:25rem}.eui-popover--size-l{max-width:35rem;width:35rem}.eui-popover--size-xl{max-width:50rem;width:50rem}.eui-popover--size-2xl{max-width:75rem;width:75rem}.eui-popover--size-auto{max-width:none;width:auto}.eui-popover--flat .eui-popover__header{border-bottom:none;padding-bottom:0}.eui-popover--colored-header{background:none;border:none;border-color:var(--eui-base-color-grey-90)}.eui-popover--colored-header .eui-popover__header{background-color:var(--eui-base-color-grey-90);border:0;color:var(--eui-base-color-white);border-top-left-radius:var(--eui-base-border-radius);border-top-right-radius:var(--eui-base-border-radius)}.eui-popover--colored-header .eui-popover__header+.eui-popover__content{border-top:0;border-top-left-radius:0;border-top-right-radius:0}.eui-popover--colored-header .eui-popover__header-title{color:var(--eui-base-color-white)}.eui-popover--colored-header .eui-popover__header-close .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-white)}.eui-popover--colored-header .eui-popover__header-close:hover .eui-popover__header-close-icon>svg,.eui-popover--colored-header .eui-popover__header-close:focus .eui-popover__header-close-icon>svg,.eui-popover--colored-header .eui-popover__header-close:active .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-primary-100)}.eui-popover--colored-header .eui-popover__content{background-color:var(--eui-base-color-white);border-color:inherit;border-radius:var(--eui-base-border-radius);border-style:solid;border-width:2px}.eui-popover--colored-header.eui-popover--left .eui-popover__arrow-inner{right:3px}.eui-popover--colored-header.eui-popover--right .eui-popover__arrow-inner{left:3px}.eui-popover--colored-header.eui-popover--top .eui-popover__arrow-inner{bottom:3px}.eui-popover--colored-header.eui-popover--bottom .eui-popover__arrow-inner,.eui-popover--colored-header .eui-popover__arrow-inner{border:none}.eui-popover--colored-solid{background-color:var(--eui-base-color-grey-90);border-color:var(--eui-base-color-grey-90);border-style:none}.eui-popover--colored-solid .eui-popover__header{border-bottom-color:var(--eui-base-color-grey-5)}.eui-popover--colored-solid .eui-popover__header-title,.eui-popover--colored-solid .eui-popover__content{color:var(--eui-base-color-white)}.eui-popover--colored-solid .eui-popover__header-close .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-white)}.eui-popover--colored-solid .eui-popover__header-close:hover .eui-popover__header-close-icon>svg,.eui-popover--colored-solid .eui-popover__header-close:focus .eui-popover__header-close-icon>svg,.eui-popover--colored-solid .eui-popover__header-close:active .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-primary-100)}.eui-popover--colored-solid .eui-popover__arrow-inner{border:none}\n'], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap", "isChecked", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i4.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "directive", type: i5.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: i6.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }, { kind: "directive", type: EuiPopoverArrowPositionDirective, selector: "[euiPopoverArrowPosition]", inputs: ["euiPopoverArrowPosition"] }], changeDetection: i02.ChangeDetectionStrategy.OnPush, encapsulation: i02.ViewEncapsulation.None });
+    this.ɵcmp = i02.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.0-next.4", type: _EuiPopoverComponent, selector: "eui-popover", inputs: { title: "title", position: "position", size: "size", type: "type", width: "width", hasBackDrop: ["hasBackDrop", "hasBackDrop", booleanAttribute], hasCloseButton: ["hasCloseButton", "hasCloseButton", booleanAttribute], isDismissable: ["isDismissable", "isDismissable", booleanAttribute] }, outputs: { outsideClick: "outsideClick", popoverOpen: "popoverOpen", popoverClose: "popoverClose" }, viewQueries: [{ propertyName: "templatePortalContent", first: true, predicate: ["templatePortalContent"], descendants: true }], usesOnChanges: true, hostDirectives: [{ directive: i2.BaseStatesDirective, inputs: ["euiSizeS", "euiSizeS", "euiSizeM", "euiSizeM", "euiSizeL", "euiSizeL", "euiSizeXL", "euiSizeXL", "euiSize2XL", "euiSize2XL", "euiSizeVariant", "euiSizeVariant"] }], ngImport: i02, template: '<ng-template #templatePortalContent>\n    @if (cdkTrapFocusAutoCapture) {\n        <ng-container *ngTemplateOutlet="template; context: { $implicit: true }"></ng-container>\n    }\n    @if (!cdkTrapFocusAutoCapture) {\n        <ng-container *ngTemplateOutlet="template; context: { $implicit: false }"></ng-container>\n    }\n</ng-template>\n\n<ng-template #template let-autoCapture>\n    <div class="eui-popover__container" cdkTrapFocus [cdkTrapFocusAutoCapture]="autoCapture" (keydown)="onKeyDown($event)">\n        <div class="eui-popover__arrow" [euiPopoverArrowPosition]="position$">\n            <div class="eui-popover__arrow-inner"></div>\n        </div>\n        @if (title) {\n            <div class="eui-popover__header">\n                <div class="eui-popover__header-title">{{ title }}</div>\n                @if (title) {\n                    <button euiButton euiRounded euiIconButton euiBasicButton euiSizeS class="eui-popover__header-close" aria-label="Close Icon Button" (click)="closePopover()">\n                        <eui-icon-svg icon="eui-close" fillColor="primary-100" aria-label="Close Icon" class="eui-popover__header-close-icon"></eui-icon-svg>\n                    </button>\n                }\n            </div>\n        }\n        <div (cdkObserveContent)="onContentChange()" class="eui-popover__content">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</ng-template>\n', styles: ['.eui-popover-position .eui-popover__arrow{border-color:inherit;border-style:solid;border-width:8px;display:none;height:0;position:absolute;width:0}.eui-popover-position .eui-popover__arrow-inner{border-color:var(--eui-base-color-white);border-style:solid;border-width:7px;content:" ";display:block;height:0;position:absolute;width:0}.eui-popover-position--top .eui-popover__arrow,.eui-popover-position--bottom .eui-popover__arrow,.eui-popover-position--left .eui-popover__arrow,.eui-popover-position--right .eui-popover__arrow{display:block}.eui-popover-position--top .eui-popover__arrow,.eui-popover-position--bottom .eui-popover__arrow{border-left-color:transparent;border-right-color:transparent;left:50%;transform:translate(-8px)}.eui-popover-position--top .eui-popover__arrow-inner,.eui-popover-position--bottom .eui-popover__arrow-inner{border-left-color:transparent;border-right-color:transparent;margin-left:-7px}.eui-popover-position--top .eui-popover__arrow{border-bottom-width:0;bottom:-7px}.eui-popover-position--top .eui-popover__arrow-inner{border-bottom-width:0;bottom:2px}.eui-popover-position--bottom .eui-popover__arrow{border-top-width:0;top:-7px}.eui-popover-position--bottom .eui-popover__arrow-inner{border-top-width:0;top:1px}.eui-popover-position--left .eui-popover__arrow,.eui-popover-position--right .eui-popover__arrow{border-bottom-color:transparent;border-top-color:transparent;top:50%;transform:translateY(-8px)}.eui-popover-position--left .eui-popover__arrow-inner,.eui-popover-position--right .eui-popover__arrow-inner{border-bottom-color:transparent;border-top-color:transparent;top:-7px}.eui-popover-position--left .eui-popover__arrow{border-right-width:0;right:-7px}.eui-popover-position--left .eui-popover__arrow-inner{border-right-width:0;right:2px}.eui-popover-position--right .eui-popover__arrow{border-left-width:0;left:-7px}.eui-popover-position--right .eui-popover__arrow-inner{border-left-width:0;border-right-color:var(--eui-base-color-white);left:2px}.eui-popover{background-color:var(--eui-base-color-white);border:1px solid var(--eui-base-color-grey-15);border-radius:var(--eui-base-border-radius);box-shadow:var(--eui-base-shadow-2);max-width:25rem;width:25rem}.eui-popover__container{width:100%}.eui-popover__header{align-items:center;border-bottom:1px solid var(--eui-base-color-grey-15);display:flex;justify-content:space-between;padding:var(--eui-base-spacing-xs)}.eui-popover__header-title{font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-popover__content{padding:var(--eui-base-spacing-xs)}.eui-popover--has-custom-width{width:100%!important}.eui-popover--size-s{max-width:12rem;width:12rem}.eui-popover--size-m{max-width:25rem;width:25rem}.eui-popover--size-l{max-width:35rem;width:35rem}.eui-popover--size-xl{max-width:50rem;width:50rem}.eui-popover--size-2xl{max-width:75rem;width:75rem}.eui-popover--size-auto{max-width:none;width:auto}.eui-popover--flat .eui-popover__header{border-bottom:none;padding-bottom:0}.eui-popover--colored-header{background:none;border:none;border-color:var(--eui-base-color-grey-90)}.eui-popover--colored-header .eui-popover__header{background-color:var(--eui-base-color-grey-90);border:0;color:var(--eui-base-color-white);border-top-left-radius:var(--eui-base-border-radius);border-top-right-radius:var(--eui-base-border-radius)}.eui-popover--colored-header .eui-popover__header+.eui-popover__content{border-top:0;border-top-left-radius:0;border-top-right-radius:0}.eui-popover--colored-header .eui-popover__header-title{color:var(--eui-base-color-white)}.eui-popover--colored-header .eui-popover__header-close .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-white)}.eui-popover--colored-header .eui-popover__header-close:hover .eui-popover__header-close-icon>svg,.eui-popover--colored-header .eui-popover__header-close:focus .eui-popover__header-close-icon>svg,.eui-popover--colored-header .eui-popover__header-close:active .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-info-130)}.eui-popover--colored-header .eui-popover__content{background-color:var(--eui-base-color-white);border-color:inherit;border-radius:var(--eui-base-border-radius);border-style:solid;border-width:2px}.eui-popover--colored-header.eui-popover--left .eui-popover__arrow-inner{right:3px}.eui-popover--colored-header.eui-popover--right .eui-popover__arrow-inner{left:3px}.eui-popover--colored-header.eui-popover--top .eui-popover__arrow-inner{bottom:3px}.eui-popover--colored-header.eui-popover--bottom .eui-popover__arrow-inner,.eui-popover--colored-header .eui-popover__arrow-inner{border:none}.eui-popover--colored-solid{background-color:var(--eui-base-color-grey-90);border-color:var(--eui-base-color-grey-90);border-style:none}.eui-popover--colored-solid .eui-popover__header{border-bottom-color:var(--eui-base-color-grey-5)}.eui-popover--colored-solid .eui-popover__header-title,.eui-popover--colored-solid .eui-popover__content{color:var(--eui-base-color-white)}.eui-popover--colored-solid .eui-popover__header-close .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-white)}.eui-popover--colored-solid .eui-popover__header-close:hover .eui-popover__header-close-icon>svg,.eui-popover--colored-solid .eui-popover__header-close:focus .eui-popover__header-close-icon>svg,.eui-popover--colored-solid .eui-popover__header-close:active .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-info-130)}.eui-popover--colored-solid .eui-popover__arrow-inner{border:none}\n'], dependencies: [{ kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap", "isChecked", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i5.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "directive", type: i6.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "directive", type: i7.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }, { kind: "directive", type: EuiPopoverArrowPositionDirective, selector: "[euiPopoverArrowPosition]", inputs: ["euiPopoverArrowPosition"] }], changeDetection: i02.ChangeDetectionStrategy.OnPush, encapsulation: i02.ViewEncapsulation.None });
   }
 };
 i02.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i02, type: EuiPopoverComponent, decorators: [{
   type: Component,
-  args: [{ selector: "eui-popover", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `<ng-template #templatePortalContent>
-    <ng-container *ngIf="cdkTrapFocusAutoCapture">
-        <ng-container *ngTemplateOutlet="tmpl; context: { $implicit: true }"></ng-container>
-    </ng-container>
-    <ng-container *ngIf="!cdkTrapFocusAutoCapture">
-        <ng-container *ngTemplateOutlet="tmpl; context: { $implicit: false }"></ng-container>
-    </ng-container>
-</ng-template>
-
-<ng-template #tmpl let-autoCapture>
-    <div
-        cdkTrapFocus
-        [cdkTrapFocusAutoCapture]="autoCapture"
-        class="eui-popover eui-popover--{{ type }} {{ statesClass }}"
-        [class.eui-popover--has-custom-width]="width"
-        [ngClass]="!width ? 'eui-popover--size-' + sizeClass : ''"
-        (keydown)="onKeyDown($event)">
-        <div class="eui-popover__arrow" [euiPopoverArrowPosition]="position$">
-            <div class="eui-popover__arrow-inner"></div>
-        </div>
-        <div *ngIf="title" class="eui-popover__header">
-            <div class="eui-popover__header-title">{{ title }}</div>
-            <button
-                euiButton
-                euiRounded
-                euiIconButton
-                euiBasicButton
-                euiSizeS
-                class="eui-popover__header-close"
-                aria-label="Close Icon Button"
-                *ngIf="hasCloseButton"
-                (click)="closePopover()">
-                <eui-icon-svg icon="eui-close" fillColor="primary-100" aria-label="Close Icon" class="eui-popover__header-close-icon">
-                </eui-icon-svg>
-            </button>
-        </div>
-        <div (cdkObserveContent)="onContentChange()" class="eui-popover__content">
-            <ng-content></ng-content>
-        </div>
-    </div>
-</ng-template>
-`, styles: ['.eui-popover-position .eui-popover__arrow{border-color:inherit;border-style:solid;border-width:8px;display:none;height:0;position:absolute;width:0}.eui-popover-position .eui-popover__arrow-inner{border-color:var(--eui-base-color-white);border-style:solid;border-width:7px;content:" ";display:block;height:0;position:absolute;width:0}.eui-popover-position--top .eui-popover__arrow,.eui-popover-position--bottom .eui-popover__arrow,.eui-popover-position--left .eui-popover__arrow,.eui-popover-position--right .eui-popover__arrow{display:block}.eui-popover-position--top .eui-popover__arrow,.eui-popover-position--bottom .eui-popover__arrow{border-left-color:transparent;border-right-color:transparent;left:50%;transform:translate(-8px)}.eui-popover-position--top .eui-popover__arrow-inner,.eui-popover-position--bottom .eui-popover__arrow-inner{border-left-color:transparent;border-right-color:transparent;margin-left:-7px}.eui-popover-position--top .eui-popover__arrow{border-bottom-width:0;bottom:-7px}.eui-popover-position--top .eui-popover__arrow-inner{border-bottom-width:0;bottom:2px}.eui-popover-position--bottom .eui-popover__arrow{border-top-width:0;top:-7px}.eui-popover-position--bottom .eui-popover__arrow-inner{border-top-width:0;top:1px}.eui-popover-position--left .eui-popover__arrow,.eui-popover-position--right .eui-popover__arrow{border-bottom-color:transparent;border-top-color:transparent;top:50%;transform:translateY(-8px)}.eui-popover-position--left .eui-popover__arrow-inner,.eui-popover-position--right .eui-popover__arrow-inner{border-bottom-color:transparent;border-top-color:transparent;top:-7px}.eui-popover-position--left .eui-popover__arrow{border-right-width:0;right:-7px}.eui-popover-position--left .eui-popover__arrow-inner{border-right-width:0;right:2px}.eui-popover-position--right .eui-popover__arrow{border-left-width:0;left:-7px}.eui-popover-position--right .eui-popover__arrow-inner{border-left-width:0;border-right-color:var(--eui-base-color-white);left:2px}.eui-popover{background-color:var(--eui-base-color-white);border:1px solid var(--eui-base-color-grey-15);border-radius:var(--eui-base-border-radius);box-shadow:var(--eui-base-shadow-2)}.eui-popover__header{align-items:center;border-bottom:1px solid var(--eui-base-color-grey-15);display:flex;justify-content:space-between;padding:var(--eui-base-spacing-xs)}.eui-popover__header-title{font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-popover__content{padding:var(--eui-base-spacing-xs)}.eui-popover--primary .eui-popover__header-title{color:var(--eui-base-color-primary-100)}.eui-popover--secondary .eui-popover__header-title{color:var(--eui-base-color-grey-80)}.eui-popover--info .eui-popover__header-title{color:var(--eui-base-color-info-100)}.eui-popover--success .eui-popover__header-title{color:var(--eui-base-color-success-100)}.eui-popover--warning .eui-popover__header-title{color:var(--eui-base-color-warning-100)}.eui-popover--danger .eui-popover__header-title{color:var(--eui-base-color-danger-100)}.eui-popover--accent .eui-popover__header-title{color:var(--eui-base-color-accent-100)}.eui-popover--has-custom-width{width:100%!important}.eui-popover--size-s{max-width:12rem;width:12rem}.eui-popover--size-m{max-width:25rem;width:25rem}.eui-popover--size-l{max-width:35rem;width:35rem}.eui-popover--size-xl{max-width:50rem;width:50rem}.eui-popover--size-2xl{max-width:75rem;width:75rem}.eui-popover--size-auto{max-width:none;width:auto}.eui-popover--flat .eui-popover__header{border-bottom:none;padding-bottom:0}.eui-popover--colored-header{background:none;border:none;border-color:var(--eui-base-color-grey-90)}.eui-popover--colored-header .eui-popover__header{background-color:var(--eui-base-color-grey-90);border:0;color:var(--eui-base-color-white);border-top-left-radius:var(--eui-base-border-radius);border-top-right-radius:var(--eui-base-border-radius)}.eui-popover--colored-header .eui-popover__header+.eui-popover__content{border-top:0;border-top-left-radius:0;border-top-right-radius:0}.eui-popover--colored-header .eui-popover__header-title{color:var(--eui-base-color-white)}.eui-popover--colored-header .eui-popover__header-close .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-white)}.eui-popover--colored-header .eui-popover__header-close:hover .eui-popover__header-close-icon>svg,.eui-popover--colored-header .eui-popover__header-close:focus .eui-popover__header-close-icon>svg,.eui-popover--colored-header .eui-popover__header-close:active .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-primary-100)}.eui-popover--colored-header .eui-popover__content{background-color:var(--eui-base-color-white);border-color:inherit;border-radius:var(--eui-base-border-radius);border-style:solid;border-width:2px}.eui-popover--colored-header.eui-popover--left .eui-popover__arrow-inner{right:3px}.eui-popover--colored-header.eui-popover--right .eui-popover__arrow-inner{left:3px}.eui-popover--colored-header.eui-popover--top .eui-popover__arrow-inner{bottom:3px}.eui-popover--colored-header.eui-popover--bottom .eui-popover__arrow-inner,.eui-popover--colored-header .eui-popover__arrow-inner{border:none}.eui-popover--colored-solid{background-color:var(--eui-base-color-grey-90);border-color:var(--eui-base-color-grey-90);border-style:none}.eui-popover--colored-solid .eui-popover__header{border-bottom-color:var(--eui-base-color-grey-5)}.eui-popover--colored-solid .eui-popover__header-title,.eui-popover--colored-solid .eui-popover__content{color:var(--eui-base-color-white)}.eui-popover--colored-solid .eui-popover__header-close .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-white)}.eui-popover--colored-solid .eui-popover__header-close:hover .eui-popover__header-close-icon>svg,.eui-popover--colored-solid .eui-popover__header-close:focus .eui-popover__header-close-icon>svg,.eui-popover--colored-solid .eui-popover__header-close:active .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-primary-100)}.eui-popover--colored-solid .eui-popover__arrow-inner{border:none}\n'] }]
-}], ctorParameters: () => [{ type: i1.Overlay }, { type: i02.ViewContainerRef }, { type: i1.ScrollDispatcher }], propDecorators: { title: [{
+  args: [{ selector: "eui-popover", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, hostDirectives: [
+    {
+      directive: BaseStatesDirective,
+      inputs: [
+        "euiSizeS",
+        "euiSizeM",
+        "euiSizeL",
+        "euiSizeXL",
+        "euiSize2XL",
+        "euiSizeVariant"
+      ]
+    }
+  ], template: '<ng-template #templatePortalContent>\n    @if (cdkTrapFocusAutoCapture) {\n        <ng-container *ngTemplateOutlet="template; context: { $implicit: true }"></ng-container>\n    }\n    @if (!cdkTrapFocusAutoCapture) {\n        <ng-container *ngTemplateOutlet="template; context: { $implicit: false }"></ng-container>\n    }\n</ng-template>\n\n<ng-template #template let-autoCapture>\n    <div class="eui-popover__container" cdkTrapFocus [cdkTrapFocusAutoCapture]="autoCapture" (keydown)="onKeyDown($event)">\n        <div class="eui-popover__arrow" [euiPopoverArrowPosition]="position$">\n            <div class="eui-popover__arrow-inner"></div>\n        </div>\n        @if (title) {\n            <div class="eui-popover__header">\n                <div class="eui-popover__header-title">{{ title }}</div>\n                @if (title) {\n                    <button euiButton euiRounded euiIconButton euiBasicButton euiSizeS class="eui-popover__header-close" aria-label="Close Icon Button" (click)="closePopover()">\n                        <eui-icon-svg icon="eui-close" fillColor="primary-100" aria-label="Close Icon" class="eui-popover__header-close-icon"></eui-icon-svg>\n                    </button>\n                }\n            </div>\n        }\n        <div (cdkObserveContent)="onContentChange()" class="eui-popover__content">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</ng-template>\n', styles: ['.eui-popover-position .eui-popover__arrow{border-color:inherit;border-style:solid;border-width:8px;display:none;height:0;position:absolute;width:0}.eui-popover-position .eui-popover__arrow-inner{border-color:var(--eui-base-color-white);border-style:solid;border-width:7px;content:" ";display:block;height:0;position:absolute;width:0}.eui-popover-position--top .eui-popover__arrow,.eui-popover-position--bottom .eui-popover__arrow,.eui-popover-position--left .eui-popover__arrow,.eui-popover-position--right .eui-popover__arrow{display:block}.eui-popover-position--top .eui-popover__arrow,.eui-popover-position--bottom .eui-popover__arrow{border-left-color:transparent;border-right-color:transparent;left:50%;transform:translate(-8px)}.eui-popover-position--top .eui-popover__arrow-inner,.eui-popover-position--bottom .eui-popover__arrow-inner{border-left-color:transparent;border-right-color:transparent;margin-left:-7px}.eui-popover-position--top .eui-popover__arrow{border-bottom-width:0;bottom:-7px}.eui-popover-position--top .eui-popover__arrow-inner{border-bottom-width:0;bottom:2px}.eui-popover-position--bottom .eui-popover__arrow{border-top-width:0;top:-7px}.eui-popover-position--bottom .eui-popover__arrow-inner{border-top-width:0;top:1px}.eui-popover-position--left .eui-popover__arrow,.eui-popover-position--right .eui-popover__arrow{border-bottom-color:transparent;border-top-color:transparent;top:50%;transform:translateY(-8px)}.eui-popover-position--left .eui-popover__arrow-inner,.eui-popover-position--right .eui-popover__arrow-inner{border-bottom-color:transparent;border-top-color:transparent;top:-7px}.eui-popover-position--left .eui-popover__arrow{border-right-width:0;right:-7px}.eui-popover-position--left .eui-popover__arrow-inner{border-right-width:0;right:2px}.eui-popover-position--right .eui-popover__arrow{border-left-width:0;left:-7px}.eui-popover-position--right .eui-popover__arrow-inner{border-left-width:0;border-right-color:var(--eui-base-color-white);left:2px}.eui-popover{background-color:var(--eui-base-color-white);border:1px solid var(--eui-base-color-grey-15);border-radius:var(--eui-base-border-radius);box-shadow:var(--eui-base-shadow-2);max-width:25rem;width:25rem}.eui-popover__container{width:100%}.eui-popover__header{align-items:center;border-bottom:1px solid var(--eui-base-color-grey-15);display:flex;justify-content:space-between;padding:var(--eui-base-spacing-xs)}.eui-popover__header-title{font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-popover__content{padding:var(--eui-base-spacing-xs)}.eui-popover--has-custom-width{width:100%!important}.eui-popover--size-s{max-width:12rem;width:12rem}.eui-popover--size-m{max-width:25rem;width:25rem}.eui-popover--size-l{max-width:35rem;width:35rem}.eui-popover--size-xl{max-width:50rem;width:50rem}.eui-popover--size-2xl{max-width:75rem;width:75rem}.eui-popover--size-auto{max-width:none;width:auto}.eui-popover--flat .eui-popover__header{border-bottom:none;padding-bottom:0}.eui-popover--colored-header{background:none;border:none;border-color:var(--eui-base-color-grey-90)}.eui-popover--colored-header .eui-popover__header{background-color:var(--eui-base-color-grey-90);border:0;color:var(--eui-base-color-white);border-top-left-radius:var(--eui-base-border-radius);border-top-right-radius:var(--eui-base-border-radius)}.eui-popover--colored-header .eui-popover__header+.eui-popover__content{border-top:0;border-top-left-radius:0;border-top-right-radius:0}.eui-popover--colored-header .eui-popover__header-title{color:var(--eui-base-color-white)}.eui-popover--colored-header .eui-popover__header-close .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-white)}.eui-popover--colored-header .eui-popover__header-close:hover .eui-popover__header-close-icon>svg,.eui-popover--colored-header .eui-popover__header-close:focus .eui-popover__header-close-icon>svg,.eui-popover--colored-header .eui-popover__header-close:active .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-info-130)}.eui-popover--colored-header .eui-popover__content{background-color:var(--eui-base-color-white);border-color:inherit;border-radius:var(--eui-base-border-radius);border-style:solid;border-width:2px}.eui-popover--colored-header.eui-popover--left .eui-popover__arrow-inner{right:3px}.eui-popover--colored-header.eui-popover--right .eui-popover__arrow-inner{left:3px}.eui-popover--colored-header.eui-popover--top .eui-popover__arrow-inner{bottom:3px}.eui-popover--colored-header.eui-popover--bottom .eui-popover__arrow-inner,.eui-popover--colored-header .eui-popover__arrow-inner{border:none}.eui-popover--colored-solid{background-color:var(--eui-base-color-grey-90);border-color:var(--eui-base-color-grey-90);border-style:none}.eui-popover--colored-solid .eui-popover__header{border-bottom-color:var(--eui-base-color-grey-5)}.eui-popover--colored-solid .eui-popover__header-title,.eui-popover--colored-solid .eui-popover__content{color:var(--eui-base-color-white)}.eui-popover--colored-solid .eui-popover__header-close .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-white)}.eui-popover--colored-solid .eui-popover__header-close:hover .eui-popover__header-close-icon>svg,.eui-popover--colored-solid .eui-popover__header-close:focus .eui-popover__header-close-icon>svg,.eui-popover--colored-solid .eui-popover__header-close:active .eui-popover__header-close-icon>svg{fill:var(--eui-base-color-info-130)}.eui-popover--colored-solid .eui-popover__arrow-inner{border:none}\n'] }]
+}], ctorParameters: () => [{ type: i1.Overlay }, { type: i02.ViewContainerRef }, { type: i1.ScrollDispatcher }, { type: i2.BaseStatesDirective }], propDecorators: { title: [{
   type: Input2
 }], position: [{
   type: Input2
@@ -371,6 +269,15 @@ i02.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4",
   type: Input2
 }], width: [{
   type: Input2
+}], hasBackDrop: [{
+  type: Input2,
+  args: [{ transform: booleanAttribute }]
+}], hasCloseButton: [{
+  type: Input2,
+  args: [{ transform: booleanAttribute }]
+}], isDismissable: [{
+  type: Input2,
+  args: [{ transform: booleanAttribute }]
 }], outsideClick: [{
   type: Output
 }], popoverOpen: [{
@@ -380,14 +287,6 @@ i02.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4",
 }], templatePortalContent: [{
   type: ViewChild,
   args: ["templatePortalContent"]
-}], isOpen: [{
-  type: Input2
-}], hasBackDrop: [{
-  type: Input2
-}], hasCloseButton: [{
-  type: Input2
-}], isDismissable: [{
-  type: Input2
 }] } });
 
 // eui-popover.module.mjs

package/fesm2022/eui-components-eui-popover.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../eui-popover/models/eui-popover-position.model.ts", "../../eui-popover/directives/eui-popover-arrow-position.directive.ts", "../../eui-popover/eui-popover.component.ts", "../../eui-popover/eui-popover.component.html", "../../eui-popover/eui-popover.module.ts"],
-  "sourcesContent": ["import { ConnectedOverlayPositionChange, ConnectionPositionPair } from '@angular/cdk/overlay';\n\nexport type EuiPopoverPosition = 'top' | 'right' | 'bottom' | 'left';\n\nexport const TOP = new ConnectionPositionPair({ originX: 'center', originY: 'top' }, { overlayX: 'center', overlayY: 'bottom' }, 0, 0, ['eui-popover-position', 'eui-popover-position--top']);\nexport const BOTTOM = new ConnectionPositionPair({ originX: 'center', originY: 'bottom' }, { overlayX: 'center', overlayY: 'top' }, 0, 0, ['eui-popover-position', 'eui-popover-position--bottom']);\nexport const LEFT = new ConnectionPositionPair({ originX: 'start', originY: 'center' }, { overlayX: 'end', overlayY: 'center' }, 0, 0, ['eui-popover-position', 'eui-popover-position--left']);\nexport const RIGHT = new ConnectionPositionPair({ originX: 'end', originY: 'center' }, { overlayX: 'start', overlayY: 'center' }, 0, 0, ['eui-popover-position', 'eui-popover-position--right']);\n\nexport const getPosition = ({ connectionPair }: ConnectedOverlayPositionChange): EuiPopoverPosition => {\n    switch (connectionPair) {\n        case TOP:\n            return 'top';\n        case BOTTOM:\n            return 'bottom';\n        case LEFT:\n            return 'left';\n        case RIGHT:\n            return 'right';\n    }\n};\n", "import { DOCUMENT } from '@angular/common';\nimport { Directive, ElementRef, Inject, Input, OnDestroy, OnInit, Renderer2 } from '@angular/core';\nimport { Observable, Subject, takeUntil } from 'rxjs';\n\nimport { EuiPopoverPosition } from '../models/eui-popover-position.model';\n\n@Directive({\n    selector: '[euiPopoverArrowPosition]',\n})\nexport class EuiPopoverArrowPositionDirective implements OnInit, OnDestroy {\n    @Input('euiPopoverArrowPosition')\n    public position$: Observable<[EuiPopoverPosition, DOMRect]>;\n\n    private destroy$: Subject<void> = new Subject();\n\n    constructor(\n        private renderer: Renderer2,\n        private elementRef: ElementRef,\n        @Inject(DOCUMENT) private document: Document,\n    ) {}\n\n    ngOnInit(): void {\n        this.position$.pipe(takeUntil(this.destroy$)).subscribe(([position, originRect]) => {\n            this.renderer.setProperty(this.elementRef.nativeElement, 'style', this.getStyle(position, originRect));\n        });\n    }\n\n    ngOnDestroy(): void {\n        this.destroy$.next();\n        this.destroy$.complete();\n    }\n\n    private getStyle(position: EuiPopoverPosition, originRect: DOMRect): string {\n        const arrowRect: DOMRect = this.elementRef.nativeElement.getBoundingClientRect();\n\n        if (position === 'left' || position === 'right') {\n            const verticalDiff: number =\n                Math.floor(arrowRect.top + arrowRect.height / 2) - Math.floor(originRect.top + originRect.height / 2);\n\n            if (verticalDiff > 0) {\n                return `top: ${originRect.top + originRect.height / 2}px`;\n            } else if (verticalDiff < 0) {\n                return `top: unset; bottom: ${\n                    this.document.body.clientHeight - originRect.bottom + originRect.height / 2 - arrowRect.height\n                }px`;\n            }\n        }\n        if (position === 'top' || position === 'bottom') {\n            const horizontalDiff: number =\n                Math.floor(arrowRect.left + arrowRect.width / 2) - Math.floor(originRect.left + originRect.width / 2);\n\n            if (horizontalDiff > 0) {\n                return `left: ${originRect.left + originRect.width / 2}px`;\n            } else if (horizontalDiff < 0) {\n                return `left: unset; right: ${\n                    this.document.body.clientWidth - originRect.right + originRect.width / 2 - arrowRect.width\n                }px`;\n            }\n        }\n        return '';\n    }\n}\n", "import {\n    Component,\n    ChangeDetectionStrategy,\n    ViewEncapsulation,\n    Input,\n    ViewChild,\n    TemplateRef,\n    ViewContainerRef,\n    AfterViewInit,\n    OnDestroy,\n    OnInit,\n    Output,\n    EventEmitter,\n    ElementRef,\n    OnChanges,\n    SimpleChanges,\n} from '@angular/core';\nimport { TemplatePortal } from '@angular/cdk/portal';\nimport {\n    Overlay,\n    OverlayRef,\n    ConnectionPositionPair,\n    FlexibleConnectedPositionStrategyOrigin,\n    ScrollDispatcher,\n    CdkScrollable,\n    FlexibleConnectedPositionStrategy,\n} from '@angular/cdk/overlay';\nimport { BehaviorSubject, Observable, Subject, Subscription } from 'rxjs';\nimport { distinctUntilChanged, map, switchMap, takeUntil } from 'rxjs/operators';\nimport { coerceBooleanProperty, BooleanInput } from '@angular/cdk/coercion';\n\nimport { BaseDirective } from '@eui/components/shared';\nimport { BOTTOM, EuiPopoverPosition, LEFT, RIGHT, TOP, getPosition } from './models/eui-popover-position.model';\n\n@Component({\n    selector: 'eui-popover',\n    templateUrl: './eui-popover.component.html',\n    styleUrls: ['./styles/_index.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n})\nexport class EuiPopoverComponent extends BaseDirective implements AfterViewInit, OnDestroy, OnInit, OnChanges {\n    @Input() title: string;\n    @Input() position: EuiPopoverPosition = 'bottom';\n    @Input() size: 'default' | 'small' | 'large' | 'auto' | 's' | 'm' | 'l' | 'xl' | string = 'default';\n    @Input() type: 'default' | 'flat' | 'colored-header' | 'colored-solid' = 'default';\n    @Input() width: string = null;\n\n    @Output() outsideClick = new EventEmitter();\n    @Output() popoverOpen = new EventEmitter();\n    @Output() popoverClose = new EventEmitter();\n\n    public statesClass: string;\n    public cdkTrapFocusAutoCapture = true;\n    public sizeClass = 'm';\n    public position$: Observable<[EuiPopoverPosition, DOMRect]>;\n\n    @ViewChild('templatePortalContent') templatePortalContent: TemplateRef<unknown>;\n\n    @Input()\n    get isOpen(): boolean {\n        return this._isOpen;\n    }\n    set isOpen(value: BooleanInput) {\n        this._isOpen = coerceBooleanProperty(value);\n    }\n    private _isOpen = false;\n    @Input()\n    get hasBackDrop(): boolean {\n        return this._hasBackDrop;\n    }\n    set hasBackDrop(value: BooleanInput) {\n        this._hasBackDrop = coerceBooleanProperty(value);\n    }\n    private _hasBackDrop = false;\n    @Input()\n    get hasCloseButton(): boolean {\n        return this._hasCloseButton;\n    }\n    set hasCloseButton(value: BooleanInput) {\n        this._hasCloseButton = coerceBooleanProperty(value);\n    }\n    private _hasCloseButton = true;\n    @Input()\n    get isDismissable(): boolean {\n        return this._isDismissable;\n    }\n    set isDismissable(value: BooleanInput) {\n        this._isDismissable = coerceBooleanProperty(value);\n    }\n    private _isDismissable = true;\n\n    private templatePortal: TemplatePortal;\n    private overlayRef: OverlayRef;\n    private destroy$: Subject<boolean> = new Subject<boolean>();\n    private isOpen$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);\n    private scrollDispatcherSubscription = new Subscription();\n    private origin: ElementRef;\n    private preferredPositons: ConnectionPositionPair[] = [BOTTOM, TOP, LEFT, RIGHT];\n    private positionStrategy: FlexibleConnectedPositionStrategy;\n    private positionStrategyUpdate$: Subject<void> = new Subject();\n\n    constructor(\n        private overlay: Overlay,\n        private viewContainerRef: ViewContainerRef,\n        private scrollDispatcher: ScrollDispatcher,\n    ) {\n        super();\n    }\n\n    ngOnChanges(c: SimpleChanges): void {\n        if (this.position === 'top') {\n            this.preferredPositons = [TOP, BOTTOM, LEFT, RIGHT];\n        } else if (this.position === 'right') {\n            this.preferredPositons = [RIGHT, LEFT, TOP, BOTTOM];\n        } else if (this.position === 'left') {\n            this.preferredPositons = [LEFT, RIGHT, TOP, BOTTOM];\n        } else {\n            this.preferredPositons = [BOTTOM, TOP, LEFT, RIGHT];\n        }\n\n        if (c.size) {\n            if (c.size.currentValue === 'default') {\n                this.sizeClass = 'm';\n            } else if (c.size.currentValue === 'small') {\n                this.sizeClass = 's';\n            } else if (c.size.currentValue === 'large') {\n                this.sizeClass = 'l';\n            } else {\n                this.sizeClass = c.size.currentValue;\n            }\n        }\n    }\n\n    ngOnInit(): void {\n        this.statesClass = [super.getCssClasses('eui-popover')].join(' ').trim();\n        this.setPositionStream();\n    }\n\n    ngAfterViewInit(): void {\n        this.templatePortal = new TemplatePortal(this.templatePortalContent, this.viewContainerRef);\n    }\n\n    ngOnDestroy(): void {\n        this.destroy$.next(true);\n        this.destroy$.unsubscribe();\n        this.scrollDispatcherSubscription.unsubscribe();\n        this.overlayRef?.dispose();\n        this.overlayRef = null;\n    }\n\n    /**\n     * Whether the eui-popover is open.\n     *\n     * @usageNotes\n     * ```html\n     * <eui-popover #popover>\n     *      <my-component *ngIf=\"popover.isPopoverOpen\"></my-component>\n     * </eui-popover>\n     * ```\n     * @returns A boolean with value `true` when open, otherwise `false`.\n     */\n    // TODO: In next version, remove isOpen @Input which is not used, deprecated this isPopoverOpen and create isOpen instead\n    get isPopoverOpen(): boolean {\n        return this.isOpen$.value;\n    }\n\n    public onContentChange(): void {\n        this.positionStrategy = this.getPositionStrategy();\n        this.positionStrategyUpdate$.next();\n        this.overlayRef.updatePositionStrategy(this.positionStrategy);\n    }\n\n    /**\n     * Open a popover\n     *\n     * @param origin Origin of the popover position\n     */\n    public openPopover(origin: ElementRef): void {\n        if (!this.isPopoverOpen) {\n            this.cdkTrapFocusAutoCapture = true;\n            this.scrollDispatcherSubscription = this.scrollDispatcher.ancestorScrolled(origin).subscribe((event: CdkScrollable) => {\n                const scrollableParent = event ? event.getElementRef().nativeElement : document.querySelector('body');\n                if (!this.isVisible(origin as unknown as HTMLElement, scrollableParent)) {\n                    this.closePopover();\n                }\n            });\n\n            this.origin = origin;\n            const positionStrategy = this.getPositionStrategy();\n\n            const scrollStrategy = this.overlay.scrollStrategies.reposition({ scrollThrottle: 10 });\n\n            this.overlayRef = this.overlay.create({\n                positionStrategy,\n                scrollStrategy,\n                disposeOnNavigation: true,\n                width: this.width,\n            });\n            this.overlayRef.attach(this.templatePortal);\n\n            this.positionStrategy = positionStrategy;\n            this.positionStrategyUpdate$.next();\n\n            this.overlayRef\n                .outsidePointerEvents()\n                .pipe(takeUntil(this.destroy$))\n                .subscribe(() => {\n                    if (this.isDismissable) {\n                        this.outsideClick.emit();\n                        this.closePopover();\n                    }\n                });\n\n            this.isOpen$.next(true);\n            this.popoverOpen.emit();\n        }\n    }\n\n    /**\n     * Close a popover\n     */\n    public closePopover(): void {\n        this.scrollDispatcherSubscription.unsubscribe();\n        this.overlayRef.dispose();\n        this.overlayRef = null;\n        this.isOpen$.next(false);\n        this.popoverClose.emit();\n    }\n\n    /**\n     * Reacts on the Esc keydown event to close the popup. Can be used as alternative to the close icon button,\n     * or as the main way to close the popup when hasCloseButton is false\n     *\n     * @param event The key event pressed\n     */\n    public onKeyDown(event: KeyboardEvent): void {\n        if (event.key === 'Escape') {\n            this.closePopover();\n        }\n    }\n\n    private isVisible(origin: HTMLElement, scrollableParent: HTMLElement): boolean {\n        const originY = origin.getBoundingClientRect().y;\n        const scrollableParentY = Math.abs(scrollableParent.getBoundingClientRect().y);\n        const scrollableParentHeight = scrollableParent.getBoundingClientRect().height - 50;\n\n        return (\n            (originY > 0 && originY < scrollableParentHeight) ||\n            (originY - scrollableParentY > 0 && originY < scrollableParentY + scrollableParentHeight)\n        );\n    }\n\n    private getPositionStrategy(): FlexibleConnectedPositionStrategy {\n        return this.overlay\n            .position()\n            .flexibleConnectedTo(this.origin as FlexibleConnectedPositionStrategyOrigin)\n            .withPositions(this.preferredPositons)\n            .withFlexibleDimensions(false)\n            .withLockedPosition(true);\n    }\n\n    private setPositionStream(): void {\n        this.position$ = this.positionStrategyUpdate$.pipe(\n            switchMap(() => this.positionStrategy.positionChanges),\n            map(getPosition),\n            distinctUntilChanged(),\n            map((position) => {\n                const rect = this.origin.nativeElement ?\n                    this.origin.nativeElement.getBoundingClientRect() :\n                    (this.origin as unknown as HTMLElement).getBoundingClientRect();\n                return [position, rect];\n            }),\n        );\n    }\n}\n", "<ng-template #templatePortalContent>\n    <ng-container *ngIf=\"cdkTrapFocusAutoCapture\">\n        <ng-container *ngTemplateOutlet=\"tmpl; context: { $implicit: true }\"></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"!cdkTrapFocusAutoCapture\">\n        <ng-container *ngTemplateOutlet=\"tmpl; context: { $implicit: false }\"></ng-container>\n    </ng-container>\n</ng-template>\n\n<ng-template #tmpl let-autoCapture>\n    <div\n        cdkTrapFocus\n        [cdkTrapFocusAutoCapture]=\"autoCapture\"\n        class=\"eui-popover eui-popover--{{ type }} {{ statesClass }}\"\n        [class.eui-popover--has-custom-width]=\"width\"\n        [ngClass]=\"!width ? 'eui-popover--size-' + sizeClass : ''\"\n        (keydown)=\"onKeyDown($event)\">\n        <div class=\"eui-popover__arrow\" [euiPopoverArrowPosition]=\"position$\">\n            <div class=\"eui-popover__arrow-inner\"></div>\n        </div>\n        <div *ngIf=\"title\" class=\"eui-popover__header\">\n            <div class=\"eui-popover__header-title\">{{ title }}</div>\n            <button\n                euiButton\n                euiRounded\n                euiIconButton\n                euiBasicButton\n                euiSizeS\n                class=\"eui-popover__header-close\"\n                aria-label=\"Close Icon Button\"\n                *ngIf=\"hasCloseButton\"\n                (click)=\"closePopover()\">\n                <eui-icon-svg icon=\"eui-close\" fillColor=\"primary-100\" aria-label=\"Close Icon\" class=\"eui-popover__header-close-icon\">\n                </eui-icon-svg>\n            </button>\n        </div>\n        <div (cdkObserveContent)=\"onContentChange()\" class=\"eui-popover__content\">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</ng-template>\n", "import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { OverlayModule } from '@angular/cdk/overlay';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { ObserversModule } from '@angular/cdk/observers';\n\nimport { EuiButtonModule } from '@eui/components/eui-button';\nimport { EuiIconModule } from '@eui/components/eui-icon';\n\nimport { EuiPopoverComponent } from './eui-popover.component';\nimport { EuiPopoverArrowPositionDirective } from './directives/eui-popover-arrow-position.directive';\n\n@NgModule({\n    imports: [CommonModule, OverlayModule, EuiButtonModule, EuiIconModule, A11yModule, ObserversModule],\n    declarations: [EuiPopoverComponent, EuiPopoverArrowPositionDirective],\n    exports: [EuiPopoverComponent],\n})\nexport class EuiPopoverModule {}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { ConnectedOverlayPositionChange, ConnectionPositionPair } from '@angular/cdk/overlay';\n\nexport type EuiPopoverPosition = 'top' | 'right' | 'bottom' | 'left';\n\nexport const TOP = new ConnectionPositionPair({ originX: 'center', originY: 'top' }, { overlayX: 'center', overlayY: 'bottom' }, 0, 0, ['eui-popover-position', 'eui-popover-position--top']);\nexport const BOTTOM = new ConnectionPositionPair({ originX: 'center', originY: 'bottom' }, { overlayX: 'center', overlayY: 'top' }, 0, 0, ['eui-popover-position', 'eui-popover-position--bottom']);\nexport const LEFT = new ConnectionPositionPair({ originX: 'start', originY: 'center' }, { overlayX: 'end', overlayY: 'center' }, 0, 0, ['eui-popover-position', 'eui-popover-position--left']);\nexport const RIGHT = new ConnectionPositionPair({ originX: 'end', originY: 'center' }, { overlayX: 'start', overlayY: 'center' }, 0, 0, ['eui-popover-position', 'eui-popover-position--right']);\n\nexport const getPosition = ({ connectionPair }: ConnectedOverlayPositionChange): EuiPopoverPosition => {\n    switch (connectionPair) {\n        case TOP:\n            return 'top';\n        case BOTTOM:\n            return 'bottom';\n        case LEFT:\n            return 'left';\n        case RIGHT:\n            return 'right';\n    }\n};\n", "import { DOCUMENT } from '@angular/common';\nimport { Directive, ElementRef, Inject, Input, OnDestroy, OnInit, Renderer2 } from '@angular/core';\nimport { Observable, Subject, takeUntil } from 'rxjs';\n\nimport { EuiPopoverPosition } from '../models/eui-popover-position.model';\n\n@Directive({\n    selector: '[euiPopoverArrowPosition]',\n})\nexport class EuiPopoverArrowPositionDirective implements OnInit, OnDestroy {\n    @Input('euiPopoverArrowPosition')\n    public position$: Observable<[EuiPopoverPosition, DOMRect]>;\n\n    private destroy$: Subject<void> = new Subject();\n\n    constructor(\n        private renderer: Renderer2,\n        private elementRef: ElementRef,\n        @Inject(DOCUMENT) private document: Document,\n    ) {}\n\n    ngOnInit(): void {\n        this.position$.pipe(takeUntil(this.destroy$)).subscribe(([position, originRect]) => {\n            this.renderer.setProperty(this.elementRef.nativeElement, 'style', this.getStyle(position, originRect));\n        });\n    }\n\n    ngOnDestroy(): void {\n        this.destroy$.next();\n        this.destroy$.complete();\n    }\n\n    private getStyle(position: EuiPopoverPosition, originRect: DOMRect): string {\n        const arrowRect: DOMRect = this.elementRef.nativeElement.getBoundingClientRect();\n\n        if (position === 'left' || position === 'right') {\n            const verticalDiff: number =\n                Math.floor(arrowRect.top + arrowRect.height / 2) - Math.floor(originRect.top + originRect.height / 2);\n\n            if (verticalDiff > 0) {\n                return `top: ${originRect.top + originRect.height / 2}px`;\n            } else if (verticalDiff < 0) {\n                return `top: unset; bottom: ${\n                    this.document.body.clientHeight - originRect.bottom + originRect.height / 2 - arrowRect.height\n                }px`;\n            }\n        }\n        if (position === 'top' || position === 'bottom') {\n            const horizontalDiff: number =\n                Math.floor(arrowRect.left + arrowRect.width / 2) - Math.floor(originRect.left + originRect.width / 2);\n\n            if (horizontalDiff > 0) {\n                return `left: ${originRect.left + originRect.width / 2}px`;\n            } else if (horizontalDiff < 0) {\n                return `left: unset; right: ${\n                    this.document.body.clientWidth - originRect.right + originRect.width / 2 - arrowRect.width\n                }px`;\n            }\n        }\n        return '';\n    }\n}\n", "import {\n    Component,\n    ChangeDetectionStrategy,\n    ViewEncapsulation,\n    Input,\n    ViewChild,\n    TemplateRef,\n    ViewContainerRef,\n    AfterViewInit,\n    OnDestroy,\n    OnInit,\n    Output,\n    EventEmitter,\n    ElementRef,\n    OnChanges,\n    SimpleChanges,\n    booleanAttribute,\n} from '@angular/core';\nimport { TemplatePortal } from '@angular/cdk/portal';\nimport {\n    Overlay,\n    OverlayRef,\n    ConnectionPositionPair,\n    FlexibleConnectedPositionStrategyOrigin,\n    ScrollDispatcher,\n    CdkScrollable,\n    FlexibleConnectedPositionStrategy,\n} from '@angular/cdk/overlay';\nimport { BehaviorSubject, Observable, Subject, Subscription } from 'rxjs';\nimport { distinctUntilChanged, map, switchMap, takeUntil } from 'rxjs/operators';\n\nimport { BaseDirective, BaseStatesDirective } from '@eui/components/shared';\n\nimport { EuiPopoverPosition, BOTTOM, LEFT, RIGHT, TOP, getPosition } from './models/eui-popover-position.model';\n\n@Component({\n    selector: 'eui-popover',\n    templateUrl: './eui-popover.component.html',\n    styleUrls: ['./styles/_index.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    hostDirectives: [\n        {\n            directive: BaseStatesDirective,\n            inputs: [\n                'euiSizeS',\n                'euiSizeM',\n                'euiSizeL',\n                'euiSizeXL',\n                'euiSize2XL',\n                'euiSizeVariant',\n            ],\n        },\n    ],\n})\nexport class EuiPopoverComponent implements AfterViewInit, OnDestroy, OnInit, OnChanges {\n    @Input() title: string;\n    @Input() position: EuiPopoverPosition = 'bottom';\n    @Input() size: 'default' | 'small' | 'large' | 'auto' | 's' | 'm' | 'l' | 'xl' | string = 'default';\n    @Input() type: 'default' | 'flat' | 'colored-header' | 'colored-solid' = 'default';\n    @Input() width: string = null;\n    @Input({ transform: booleanAttribute }) hasBackDrop = false;\n    @Input({ transform: booleanAttribute }) hasCloseButton = true;\n    @Input({ transform: booleanAttribute }) isDismissable = true;\n\n    @Output() outsideClick = new EventEmitter();\n    @Output() popoverOpen = new EventEmitter();\n    @Output() popoverClose = new EventEmitter();\n\n    public cdkTrapFocusAutoCapture = true;\n    public position$: Observable<[EuiPopoverPosition, DOMRect]>;\n\n    @ViewChild('templatePortalContent') templatePortalContent: TemplateRef<unknown>;\n\n    private templatePortal: TemplatePortal;\n    private overlayRef: OverlayRef;\n    private destroy$: Subject<boolean> = new Subject<boolean>();\n    private isOpen$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);\n    private scrollDispatcherSubscription = new Subscription();\n    private origin: ElementRef;\n    private preferredPositons: ConnectionPositionPair[] = [BOTTOM, TOP, LEFT, RIGHT];\n    private positionStrategy: FlexibleConnectedPositionStrategy;\n    private positionStrategyUpdate$: Subject<void> = new Subject();\n\n    constructor(private overlay: Overlay,\n                private viewContainerRef: ViewContainerRef,\n                private scrollDispatcher: ScrollDispatcher,\n                private baseStatesDirective: BaseStatesDirective){\n    }\n\n    ngOnChanges(c: SimpleChanges): void {\n        if (this.position === 'top') {\n            this.preferredPositons = [TOP, BOTTOM, LEFT, RIGHT];\n        } else if (this.position === 'right') {\n            this.preferredPositons = [RIGHT, LEFT, TOP, BOTTOM];\n        } else if (this.position === 'left') {\n            this.preferredPositons = [LEFT, RIGHT, TOP, BOTTOM];\n        } else {\n            this.preferredPositons = [BOTTOM, TOP, LEFT, RIGHT];\n        }\n    }\n\n    ngOnInit(): void {\n        this.setPositionStream();\n    }\n\n    ngAfterViewInit(): void {\n        this.templatePortal = new TemplatePortal(this.templatePortalContent, this.viewContainerRef);\n    }\n\n    ngOnDestroy(): void {\n        this.destroy$.next(true);\n        this.destroy$.unsubscribe();\n        this.scrollDispatcherSubscription.unsubscribe();\n        this.overlayRef?.dispose();\n        this.overlayRef = null;\n    }\n\n    /** @deprecated This will be removed in next version of eui in favor of isOpen */\n    get isPopoverOpen(): boolean {\n        return this.isOpen$.value;\n    }\n\n    /**\n     * Whether the eui-popover is open.\n     *\n     * @usageNotes\n     * ```html\n     * <eui-popover #popover>\n     *     \\@if (popover.isOpen) {\n     *          <my-component></my-component>\n     *     }\n     * </eui-popover>\n     * ```\n     * @returns A boolean with value `true` when open, otherwise `false`.\n     */\n    get isOpen(): boolean {\n        return this.isOpen$.value;\n    }\n\n    public onContentChange(): void {\n        this.positionStrategy = this.getPositionStrategy();\n        this.positionStrategyUpdate$.next();\n        this.overlayRef.updatePositionStrategy(this.positionStrategy);\n    }\n\n    /**\n     * Open a popover\n     *\n     * @param origin Origin of the popover position\n     */\n    public openPopover(origin: ElementRef): void {\n        if (!this.isPopoverOpen) {\n            this.cdkTrapFocusAutoCapture = true;\n            this.scrollDispatcherSubscription = this.scrollDispatcher.ancestorScrolled(origin).subscribe((event: CdkScrollable) => {\n                const scrollableParent = event ? event.getElementRef().nativeElement : document.querySelector('body');\n                if (!this.isVisible(origin as unknown as HTMLElement, scrollableParent)) {\n                    this.closePopover();\n                }\n            });\n\n            this.origin = origin;\n            const positionStrategy = this.getPositionStrategy();\n\n            const scrollStrategy = this.overlay.scrollStrategies.reposition({ scrollThrottle: 10 });\n\n            this.overlayRef = this.overlay.create({\n                positionStrategy,\n                scrollStrategy,\n                disposeOnNavigation: true,\n                width: this.width,\n                panelClass: this.baseStatesDirective.getCssClasses('eui-popover').split(' '),\n            });\n            this.overlayRef.attach(this.templatePortal);\n\n            this.positionStrategy = positionStrategy;\n            this.positionStrategyUpdate$.next();\n\n            this.overlayRef\n                .outsidePointerEvents()\n                .pipe(takeUntil(this.destroy$))\n                .subscribe(() => {\n                    if (this.isDismissable) {\n                        this.outsideClick.emit();\n                        this.closePopover();\n                    }\n                });\n\n            this.isOpen$.next(true);\n            this.popoverOpen.emit();\n        }\n    }\n\n    /**\n     * Close a popover\n     */\n    public closePopover(): void {\n        this.scrollDispatcherSubscription.unsubscribe();\n        this.overlayRef.dispose();\n        this.overlayRef = null;\n        this.isOpen$.next(false);\n        this.popoverClose.emit();\n    }\n\n    /**\n     * Reacts on the Esc keydown event to close the popup. Can be used as alternative to the close icon button,\n     * or as the main way to close the popup when hasCloseButton is false\n     *\n     * @param event The key event pressed\n     */\n    public onKeyDown(event: KeyboardEvent): void {\n        if (event.key === 'Escape') {\n            this.closePopover();\n        }\n    }\n\n    private isVisible(origin: HTMLElement, scrollableParent: HTMLElement): boolean {\n        const originY = origin.getBoundingClientRect().y;\n        const scrollableParentY = Math.abs(scrollableParent.getBoundingClientRect().y);\n        const scrollableParentHeight = scrollableParent.getBoundingClientRect().height - 50;\n\n        return (\n            (originY > 0 && originY < scrollableParentHeight) ||\n            (originY - scrollableParentY > 0 && originY < scrollableParentY + scrollableParentHeight)\n        );\n    }\n\n    private getPositionStrategy(): FlexibleConnectedPositionStrategy {\n        return this.overlay\n            .position()\n            .flexibleConnectedTo(this.origin as FlexibleConnectedPositionStrategyOrigin)\n            .withPositions(this.preferredPositons)\n            .withFlexibleDimensions(false)\n            .withLockedPosition(true);\n    }\n\n    private setPositionStream(): void {\n        this.position$ = this.positionStrategyUpdate$.pipe(\n            switchMap(() => this.positionStrategy.positionChanges),\n            map(getPosition),\n            distinctUntilChanged(),\n            map((position) => {\n                const rect = this.origin.nativeElement ?\n                    this.origin.nativeElement.getBoundingClientRect() :\n                    (this.origin as unknown as HTMLElement).getBoundingClientRect();\n                return [position, rect];\n            }),\n        );\n    }\n}\n", "<ng-template #templatePortalContent>\n    @if (cdkTrapFocusAutoCapture) {\n        <ng-container *ngTemplateOutlet=\"template; context: { $implicit: true }\"></ng-container>\n    }\n    @if (!cdkTrapFocusAutoCapture) {\n        <ng-container *ngTemplateOutlet=\"template; context: { $implicit: false }\"></ng-container>\n    }\n</ng-template>\n\n<ng-template #template let-autoCapture>\n    <div class=\"eui-popover__container\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"autoCapture\" (keydown)=\"onKeyDown($event)\">\n        <div class=\"eui-popover__arrow\" [euiPopoverArrowPosition]=\"position$\">\n            <div class=\"eui-popover__arrow-inner\"></div>\n        </div>\n        @if (title) {\n            <div class=\"eui-popover__header\">\n                <div class=\"eui-popover__header-title\">{{ title }}</div>\n                @if (title) {\n                    <button euiButton euiRounded euiIconButton euiBasicButton euiSizeS class=\"eui-popover__header-close\" aria-label=\"Close Icon Button\" (click)=\"closePopover()\">\n                        <eui-icon-svg icon=\"eui-close\" fillColor=\"primary-100\" aria-label=\"Close Icon\" class=\"eui-popover__header-close-icon\"></eui-icon-svg>\n                    </button>\n                }\n            </div>\n        }\n        <div (cdkObserveContent)=\"onContentChange()\" class=\"eui-popover__content\">\n            <ng-content></ng-content>\n        </div>\n    </div>\n</ng-template>\n", "import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { OverlayModule } from '@angular/cdk/overlay';\nimport { A11yModule } from '@angular/cdk/a11y';\nimport { ObserversModule } from '@angular/cdk/observers';\n\nimport { EuiButtonModule } from '@eui/components/eui-button';\nimport { EuiIconModule } from '@eui/components/eui-icon';\n\nimport { EuiPopoverComponent } from './eui-popover.component';\nimport { EuiPopoverArrowPositionDirective } from './directives/eui-popover-arrow-position.directive';\n\n@NgModule({\n    imports: [CommonModule, OverlayModule, EuiButtonModule, EuiIconModule, A11yModule, ObserversModule],\n    declarations: [EuiPopoverComponent, EuiPopoverArrowPositionDirective],\n    exports: [EuiPopoverComponent],\n})\nexport class EuiPopoverModule {}\n"],
+  "mappings": "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",
   "names": ["document", "Input", "Subject", "takeUntil", "i0"]
 }

package/fesm2022/eui-components-eui-progress-bar.mjs

@@ -46,7 +46,7 @@ var EuiProgressBarComponent = class _EuiProgressBarComponent {
 <div class="eui-progress-bar__indicator-container">
     <div class="eui-progress-bar__indicator" [style.width]="!isIndeterminate ? progress + '%' : null"></div>
 </div>
-`, styles: [":host.eui-progress-bar{align-items:center;display:flex;flex-direction:column;position:relative}.eui-progress-bar__header{align-items:center;display:flex;justify-content:space-between;height:var(--eui-base-spacing-l);margin-bottom:var(--eui-base-spacing-s);width:100%}.eui-progress-bar__header-label{display:flex;justify-content:flex-start;font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-progress-bar__header-status{display:flex;justify-content:flex-end}.eui-progress-bar__indicator-container{margin-bottom:var(--eui-base-spacing-2xs);background-color:var(--eui-base-color-grey-15);height:var(--eui-base-spacing-2xs);position:relative;width:100%}.eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-primary-100);height:100%;transition:width .25s ease}:host.eui-progress-bar--size-2xs .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-2xs)}:host.eui-progress-bar--size-xs .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-xs)}:host.eui-progress-bar--size-s .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-s)}:host.eui-progress-bar--size-m .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-m)}:host.eui-progress-bar--size-l .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-l)}:host.eui-progress-bar--size-xl .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-xl)}@media screen and (max-width: 767px){:host.eui-progress-bar--size-2xs .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-xs)}}:host.eui-progress-bar--secondary .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-grey-100)}:host.eui-progress-bar--success .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-success-100)}:host.eui-progress-bar--info .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-info-100)}:host.eui-progress-bar--warning .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-warning-100)}:host.eui-progress-bar--danger .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-danger-100)}:host.eui-progress-bar--accent .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-accent-100)}:host.eui-progress-bar--indeterminate .eui-progress-bar__indicator-container .eui-progress-bar__indicator{animation:progress-linear-indeterminate 2s infinite linear;background-color:var(--eui-base-color-grey-15);background-size:200% 100%;background-image:linear-gradient(to right,transparent 50%,var(--eui-base-color-primary-100) 50%,var(--eui-base-color-primary-100) 60%,transparent 60%,transparent 71.5%,var(--eui-base-color-primary-100) 71.5%,var(--eui-base-color-primary-100) 84%,transparent 84%);transition:all .2s}@keyframes progress-linear-indeterminate{0%{background-size:200% 100%;background-position:left -31.25% top 0%}50%{background-size:800% 100%;background-position:left -49% top 0%}to{background-size:400% 100%;background-position:left -102% top 0%}}\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", "isInputIcon", "euiStart", "euiEnd"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+`, styles: [":host.eui-progress-bar{align-items:center;display:flex;flex-direction:column;position:relative}.eui-progress-bar__header{align-items:center;display:flex;justify-content:space-between;height:var(--eui-base-spacing-l);margin-bottom:var(--eui-base-spacing-s);width:100%}.eui-progress-bar__header-label{display:flex;justify-content:flex-start;font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-progress-bar__header-status{display:flex;justify-content:flex-end}.eui-progress-bar__indicator-container{margin-bottom:var(--eui-base-spacing-2xs);background-color:var(--eui-base-color-grey-15);height:var(--eui-base-spacing-2xs);position:relative;width:100%}.eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-info-130);height:100%;transition:width .25s ease}:host.eui-progress-bar--size-2xs .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-2xs)}:host.eui-progress-bar--size-xs .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-xs)}:host.eui-progress-bar--size-s .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-s)}:host.eui-progress-bar--size-m .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-m)}:host.eui-progress-bar--size-l .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-l)}:host.eui-progress-bar--size-xl .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-xl)}@media screen and (max-width: 767px){:host.eui-progress-bar--size-2xs .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-xs)}}:host.eui-progress-bar--secondary .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-grey-100)}:host.eui-progress-bar--success .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-success-100)}:host.eui-progress-bar--info .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-info-100)}:host.eui-progress-bar--warning .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-warning-100)}:host.eui-progress-bar--danger .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-danger-100)}:host.eui-progress-bar--accent .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-accent-100)}:host.eui-progress-bar--indeterminate .eui-progress-bar__indicator-container .eui-progress-bar__indicator{animation:progress-linear-indeterminate 2s infinite linear;background-color:var(--eui-base-color-grey-15);background-size:200% 100%;background-image:linear-gradient(to right,transparent 50%,var(--eui-base-color-primary-100) 50%,var(--eui-base-color-primary-100) 60%,transparent 60%,transparent 71.5%,var(--eui-base-color-primary-100) 71.5%,var(--eui-base-color-primary-100) 84%,transparent 84%);transition:all .2s}@keyframes progress-linear-indeterminate{0%{background-size:200% 100%;background-position:left -31.25% top 0%}50%{background-size:800% 100%;background-position:left -49% top 0%}to{background-size:400% 100%;background-position:left -102% top 0%}}\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", "isInputIcon", "euiStart", "euiEnd"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
   }
 };
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i0, type: EuiProgressBarComponent, decorators: [{
@@ -82,7 +82,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4",
 <div class="eui-progress-bar__indicator-container">
     <div class="eui-progress-bar__indicator" [style.width]="!isIndeterminate ? progress + '%' : null"></div>
 </div>
-`, styles: [":host.eui-progress-bar{align-items:center;display:flex;flex-direction:column;position:relative}.eui-progress-bar__header{align-items:center;display:flex;justify-content:space-between;height:var(--eui-base-spacing-l);margin-bottom:var(--eui-base-spacing-s);width:100%}.eui-progress-bar__header-label{display:flex;justify-content:flex-start;font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-progress-bar__header-status{display:flex;justify-content:flex-end}.eui-progress-bar__indicator-container{margin-bottom:var(--eui-base-spacing-2xs);background-color:var(--eui-base-color-grey-15);height:var(--eui-base-spacing-2xs);position:relative;width:100%}.eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-primary-100);height:100%;transition:width .25s ease}:host.eui-progress-bar--size-2xs .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-2xs)}:host.eui-progress-bar--size-xs .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-xs)}:host.eui-progress-bar--size-s .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-s)}:host.eui-progress-bar--size-m .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-m)}:host.eui-progress-bar--size-l .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-l)}:host.eui-progress-bar--size-xl .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-xl)}@media screen and (max-width: 767px){:host.eui-progress-bar--size-2xs .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-xs)}}:host.eui-progress-bar--secondary .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-grey-100)}:host.eui-progress-bar--success .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-success-100)}:host.eui-progress-bar--info .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-info-100)}:host.eui-progress-bar--warning .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-warning-100)}:host.eui-progress-bar--danger .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-danger-100)}:host.eui-progress-bar--accent .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-accent-100)}:host.eui-progress-bar--indeterminate .eui-progress-bar__indicator-container .eui-progress-bar__indicator{animation:progress-linear-indeterminate 2s infinite linear;background-color:var(--eui-base-color-grey-15);background-size:200% 100%;background-image:linear-gradient(to right,transparent 50%,var(--eui-base-color-primary-100) 50%,var(--eui-base-color-primary-100) 60%,transparent 60%,transparent 71.5%,var(--eui-base-color-primary-100) 71.5%,var(--eui-base-color-primary-100) 84%,transparent 84%);transition:all .2s}@keyframes progress-linear-indeterminate{0%{background-size:200% 100%;background-position:left -31.25% top 0%}50%{background-size:800% 100%;background-position:left -49% top 0%}to{background-size:400% 100%;background-position:left -102% top 0%}}\n"] }]
+`, styles: [":host.eui-progress-bar{align-items:center;display:flex;flex-direction:column;position:relative}.eui-progress-bar__header{align-items:center;display:flex;justify-content:space-between;height:var(--eui-base-spacing-l);margin-bottom:var(--eui-base-spacing-s);width:100%}.eui-progress-bar__header-label{display:flex;justify-content:flex-start;font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-progress-bar__header-status{display:flex;justify-content:flex-end}.eui-progress-bar__indicator-container{margin-bottom:var(--eui-base-spacing-2xs);background-color:var(--eui-base-color-grey-15);height:var(--eui-base-spacing-2xs);position:relative;width:100%}.eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-info-130);height:100%;transition:width .25s ease}:host.eui-progress-bar--size-2xs .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-2xs)}:host.eui-progress-bar--size-xs .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-xs)}:host.eui-progress-bar--size-s .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-s)}:host.eui-progress-bar--size-m .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-m)}:host.eui-progress-bar--size-l .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-l)}:host.eui-progress-bar--size-xl .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-xl)}@media screen and (max-width: 767px){:host.eui-progress-bar--size-2xs .eui-progress-bar__indicator-container{height:var(--eui-base-spacing-xs)}}:host.eui-progress-bar--secondary .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-grey-100)}:host.eui-progress-bar--success .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-success-100)}:host.eui-progress-bar--info .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-info-100)}:host.eui-progress-bar--warning .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-warning-100)}:host.eui-progress-bar--danger .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-danger-100)}:host.eui-progress-bar--accent .eui-progress-bar__indicator-container .eui-progress-bar__indicator{background-color:var(--eui-base-color-accent-100)}:host.eui-progress-bar--indeterminate .eui-progress-bar__indicator-container .eui-progress-bar__indicator{animation:progress-linear-indeterminate 2s infinite linear;background-color:var(--eui-base-color-grey-15);background-size:200% 100%;background-image:linear-gradient(to right,transparent 50%,var(--eui-base-color-primary-100) 50%,var(--eui-base-color-primary-100) 60%,transparent 60%,transparent 71.5%,var(--eui-base-color-primary-100) 71.5%,var(--eui-base-color-primary-100) 84%,transparent 84%);transition:all .2s}@keyframes progress-linear-indeterminate{0%{background-size:200% 100%;background-position:left -31.25% top 0%}50%{background-size:800% 100%;background-position:left -49% top 0%}to{background-size:400% 100%;background-position:left -102% top 0%}}\n"] }]
 }], ctorParameters: () => [{ type: i1.BaseStatesDirective }], propDecorators: { e2eAttr: [{
   type: HostBinding,
   args: ["attr.data-e2e"]

package/fesm2022/eui-components-eui-progress-bar.mjs.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../eui-progress-bar/eui-progress-bar.component.ts", "../../eui-progress-bar/eui-progress-bar.component.html", "../../eui-progress-bar/eui-progress-bar.module.ts"],
   "sourcesContent": ["import {\n    Component,\n    Input,\n    ChangeDetectionStrategy,\n    SimpleChanges,\n    OnChanges,\n    HostBinding,\n    booleanAttribute,\n    numberAttribute,\n} from '@angular/core';\nimport { BooleanInput, NumberInput } from '@angular/cdk/coercion';\n\nimport { BaseStatesDirective } from '@eui/components/shared';\n\n@Component({\n    templateUrl: './eui-progress-bar.component.html',\n    selector: 'eui-progress-bar',\n    styleUrls: ['./styles/_index.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    hostDirectives: [\n        {\n            directive: BaseStatesDirective,\n            inputs: [\n                'euiSecondary',\n                'euiSuccess',\n                'euiInfo',\n                'euiWarning',\n                'euiDanger',\n                'euiAccent',\n                'euiSize2XS',\n                'euiSizeXS',\n                'euiSizeS',\n                'euiSizeM',\n                'euiSizeL',\n                'euiSizeXL',\n                'euiVariant',\n                'euiSizeVariant',\n            ],\n        },\n    ],\n})\nexport class EuiProgressBarComponent implements OnChanges {\n    @HostBinding('attr.data-e2e') @Input() e2eAttr = 'eui-progress-bar';\n    @HostBinding('class')\n    public get cssClasses(): string {\n        return this.getCssClasses();\n    }\n\n    @Input() label = '';\n\n    @Input({ transform: numberAttribute })\n    progress: NumberInput;\n\n    @Input({ transform: booleanAttribute })\n    isIndeterminate: BooleanInput = false;\n\n    @Input({ transform: booleanAttribute })\n    hasStatusIcon: BooleanInput = false;\n\n    constructor(public baseStatesDirective: BaseStatesDirective) {}\n\n    ngOnChanges(changes: SimpleChanges): void {\n        if (changes['progress']) {\n            this.progress = changes['progress'].currentValue;\n            if ((this?.progress as number) > 100) {\n                this.progress = 100;\n            }\n        }\n    }\n\n    private getCssClasses(): string {\n        return [\n            this.baseStatesDirective.getCssClasses('eui-progress-bar'),\n            this.isIndeterminate ? 'eui-progress-bar--indeterminate' : '',\n            this.hasStatusIcon ? 'eui-progress-bar--hasStatusIcon' : '',\n        ]\n            .join(' ')\n            .trim();\n    }\n}\n", "<div *ngIf=\"label || hasStatusIcon\" class=\"eui-progress-bar__header\">\n    <div *ngIf=\"label\" class=\"eui-progress-bar__header-label\">{{ label }}</div>\n    <div *ngIf=\"hasStatusIcon\" class=\"eui-progress-bar__header-status\">\n        <eui-icon-svg *ngIf=\"baseStatesDirective?.euiSuccess\" icon=\"eui-ecl-success\" fillColor=\"success-100\"></eui-icon-svg>\n        <eui-icon-svg *ngIf=\"baseStatesDirective?.euiWarning\" icon=\"eui-ecl-warning\" fillColor=\"warning-100\"></eui-icon-svg>\n        <eui-icon-svg *ngIf=\"baseStatesDirective?.euiDanger\" icon=\"eui-ecl-error\" fillColor=\"danger-100\"></eui-icon-svg>\n    </div>\n</div>\n<div class=\"eui-progress-bar__indicator-container\">\n    <div class=\"eui-progress-bar__indicator\" [style.width]=\"!isIndeterminate ? progress + '%' : null\"></div>\n</div>\n", "import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { EuiIconModule } from '@eui/components/eui-icon';\nimport { EuiProgressBarComponent } from './eui-progress-bar.component';\n\n@NgModule({\n    imports: [CommonModule, EuiIconModule],\n    declarations: [EuiProgressBarComponent],\n    exports: [EuiProgressBarComponent],\n})\nexport class EuiProgressBarModule {}\n"],
-  "mappings": "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",
+  "mappings": "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",
   "names": []
 }