@eui/components 16.2.16-snapshot-1711635173997 → 16.2.17-snapshot-1712283114368

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

@@ -182,7 +182,7 @@ export class EuiNotificationsComponent {
         return unreadNotifications.length;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EuiNotificationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EuiNotificationsComponent, selector: "eui-notifications", inputs: { count: "count", items: "items", unreadLabel: "unreadLabel", totalLabel: "totalLabel", markAsReadLabel: "markAsReadLabel", markAsUnReadLabel: "markAsUnReadLabel", markAllAsReadLabel: "markAllAsReadLabel", settingsLabel: "settingsLabel", refreshLabel: "refreshLabel", viewAllNotificationsLabel: "viewAllNotificationsLabel", headerTitleLabel: "headerTitleLabel", noNotificationFoundLabel: "noNotificationFoundLabel", nbUnreadCount: "nbUnreadCount", dateFormat: "dateFormat", noNotificationFoundLink: "noNotificationFoundLink", isShowMarkAsRead: "isShowMarkAsRead", isShowViewAllAction: "isShowViewAllAction", isHidePanelOnViewAllAction: "isHidePanelOnViewAllAction", customUnreadCount: "customUnreadCount", isShowMarkAllAsReadButton: "isShowMarkAllAsReadButton", isShowSettingsButton: "isShowSettingsButton", isShowRefreshButton: "isShowRefreshButton" }, outputs: { refreshClick: "refreshClick", notificationsClick: "notificationsClick", viewAllClick: "viewAllClick", settingsClick: "settingsClick", markAllAsReadClick: "markAllAsReadClick", noNotificationFoundClick: "noNotificationFoundClick", itemClick: "itemClick", itemMarkAsReadClick: "itemMarkAsReadClick" }, host: { listeners: { "body:click": "onHide()" }, properties: { "class": "this.string" } }, usesOnChanges: true, ngImport: i0, template: "<eui-icon-svg\n    class=\"eui-notifications__trigger\"\n    role=\"button\"\n    size=\"m\"\n    icon=\"eui-notifications\"\n    fillColor=\"grey-5\"\n    (click)=\"onClicked($event)\"\n    (keydown.enter)=\"onClicked($event)\"\n    (keydown.esc)=\"onHide()\"\n    tabindex=\"0\">\n    <eui-badge *ngIf=\"count\" euiSizeS euiDanger>{{ count }}</eui-badge>\n</eui-icon-svg>\n\n<eui-overlay [isActive]=\"isOverlayActive\" class=\"eui-overlay-offset--width-30\">\n    <eui-overlay-header>\n        <div class=\"eui-notifications__header-title\">\n            <div class=\"eui-notifications__header-title-label\">\n                {{ headerTitleLabel ? headerTitleLabel : ('eui.MYNOTIFICATIONS' | translate) }}\n                <span\n                    *ngIf=\"items\"\n                    class=\"eui-u-cursor-help eui-u-ml-s\"\n                    attr.aria-label=\"{{ unreadLabel ? unreadLabel : ('eui.NOTIFICATIONSUNREAD' | translate) }}\"\n                    title=\"{{ unreadLabel ? unreadLabel : ('eui.NOTIFICATIONSUNREAD' | translate) }}\">\n                </span>\n                <eui-badge euiSizeL *ngIf=\"count\">{{ count }}</eui-badge>\n                <eui-badge euiSizeL *ngIf=\"!count\">{{ items.length }}</eui-badge>\n            </div>\n        </div>\n\n        <div *ngIf=\"items\" class=\"eui-notifications__header-actions\">\n            <button\n                euiButton\n                euiPrimary\n                euiRounded\n                euiIconButton\n                euiBasicButton\n                euiSizeS\n                type=\"button\"\n                *ngIf=\"isShowMarkAllAsReadButton\"\n                [attr.aria-label]=\"markAllAsReadLabel ? markAllAsReadLabel : ('eui.NOTIFICATIONMARKALLASREAD' | translate)\"\n                title=\"{{ markAllAsReadLabel ? markAllAsReadLabel : ('eui.NOTIFICATIONMARKALLASREAD' | translate) }}\"\n                (click)=\"onMarkAllAsRead($event)\">\n                <eui-icon-svg icon=\"eui-checkmark-done\" fillColor=\"primary-100\"></eui-icon-svg>\n            </button>\n            <button\n                euiButton\n                euiPrimary\n                euiRounded\n                euiIconButton\n                euiBasicButton\n                euiSizeS\n                type=\"button\"\n                *ngIf=\"isShowSettingsButton\"\n                [attr.aria-label]=\"settingsLabel ? settingsLabel : ('eui.SETTINGS' | translate)\"\n                title=\"{{ settingsLabel ? settingsLabel : ('eui.SETTINGS' | translate) }}\"\n                (click)=\"onSettings($event)\">\n                <eui-icon-svg icon=\"eui-settings\" fillColor=\"primary-100\"></eui-icon-svg>\n            </button>\n            <button\n                euiButton\n                euiPrimary\n                euiRounded\n                euiIconButton\n                euiBasicButton\n                euiSizeS\n                type=\"button\"\n                *ngIf=\"isShowRefreshButton\"\n                [attr.aria-label]=\"refreshLabel ? refreshLabel : ('eui.REFRESH' | translate)\"\n                title=\"{{ refreshLabel ? refreshLabel : ('eui.REFRESH' | translate) }}\"\n                (click)=\"onRefresh($event)\">\n                <eui-icon-svg icon=\"eui-refresh\" fillColor=\"primary-100\"></eui-icon-svg>\n            </button>\n        </div>\n    </eui-overlay-header>\n\n    <eui-overlay-body>\n        <ul class=\"eui-notifications-items\" *ngIf=\"items\">\n            <eui-notification-item\n                *ngFor=\"let item of items; trackBy: trackByFn\"\n                [item]=\"item\"\n                [dateFormat]=\"dateFormat\"\n                [markAsReadLabel]=\"markAsReadLabel\"\n                [isShowMarkAsRead]=\"isShowMarkAsRead\"\n                (itemClick)=\"onItemClick($event)\"\n                (itemMarkAsRead)=\"onItemMarkAsRead($event)\">\n            </eui-notification-item>\n        </ul>\n    </eui-overlay-body>\n\n    <eui-overlay-footer>\n        <ng-template [ngIf]=\"items?.length > 0\">\n            <strong\n                ><a (click)=\"onViewAllClick($event)\">{{\n                    viewAllNotificationsLabel ? viewAllNotificationsLabel : ('eui.VIEWALLNOTIFICATIONS' | translate)\n                }}</a></strong\n            >\n        </ng-template>\n        <ng-template [ngIf]=\"items?.length === 0\">\n            <div class=\"ux-notification__item-content\" *ngIf=\"!noNotificationFoundLink\">\n                {{ noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND' | translate) }}\n            </div>\n            <div class=\"ux-notification__item-content\" *ngIf=\"noNotificationFoundLink\">\n                <strong\n                    ><a (click)=\"onNoNotificationFoundClick()\">{{\n                        noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND' | translate)\n                    }}</a></strong\n                >\n            </div>\n        </ng-template>\n    </eui-overlay-footer>\n</eui-overlay>\n", styles: [".eui-overlay-header{background-color:var(--eui-base-color-grey-10);border-bottom:1px solid var(--eui-base-color-grey-20)}.eui-notifications-items{margin:0;padding:0}.eui-notifications__trigger{cursor:pointer;margin-top:var(--eui-base-spacing-xs)}.eui-notifications__trigger:focus{outline:2px solid var(--eui-base-color-accessible-focus)!important;outline-offset:5px;-moz-outline-radius:var(--eui-base-border-radius)!important;transition:outline .15s ease-in-out,border .15s ease-in-out}.eui-notifications__header{align-items:center;border-bottom:1px solid var(--eui-base-color-grey-10);color:var(--eui-base-color-font);cursor:default;display:flex;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-notifications__header-title{display:flex}.eui-notifications__header-title-label{font-size:var(--eui-base-font-size-l);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.eui-notifications__header-title-subLabel{font-size:var(--eui-base-font-size-s);margin-top:var(--eui-base-spacing-xs);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-notifications__header-actions{align-items:center;display:flex;margin-left:auto}.eui-notification-item{display:flex;flex-direction:column;overflow-y:auto;margin:0}.eui-notification-item-content{background-color:var(--eui-base-color-primary-5);border-bottom:1px solid var(--eui-base-color-grey-15);display:flex;flex-direction:column;min-height:var(--eui-base-spacing-4xl);padding:var(--eui-base-spacing-s) var(--eui-base-spacing-m);cursor:pointer}.eui-notification-item-content:hover{background-color:var(--eui-base-color-grey-5)!important}.eui-notification-item-content-top{align-items:center;display:flex;justify-content:space-between}.eui-notification-item-content-top__date{display:flex;align-items:center}.eui-notification-item-content-top__date-icon{position:relative}.eui-notification-item-content-top__date-icon--rotated{transform:rotate(20deg)}.eui-notification-item-content-top__date-icon-dot{position:absolute;top:0;right:0}.eui-notification-item-content-middle{margin:var(--eui-base-spacing-2xs) 0}.eui-notification-item-content-middle__sub-label{margin-top:var(--eui-base-spacing-2xs)}.eui-notification-item-content-bottom{display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.EuiOverlayHeaderComponent, selector: "eui-overlay-header" }, { kind: "component", type: i2.EuiOverlayBodyComponent, selector: "eui-overlay-body" }, { kind: "component", type: i2.EuiOverlayFooterComponent, selector: "eui-overlay-footer" }, { kind: "component", type: i2.EuiOverlayComponent, selector: "eui-overlay", inputs: ["isActive", "position", "width", "fixedWidth"], outputs: ["activeState"] }, { kind: "component", type: i3.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "component", type: i4.EuiBadgeComponent, selector: "div[euiBadge], span[euiBadge], eui-badge", inputs: ["aria-label"] }, { kind: "component", type: i5.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading"] }, { kind: "component", type: i6.EuiNotificationItemComponent, selector: "eui-notification-item", inputs: ["markAsReadLabel", "item", "dateFormat", "isShowMarkAsRead"], outputs: ["itemClick", "itemMarkAsRead"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EuiNotificationsComponent, selector: "eui-notifications", inputs: { count: "count", items: "items", unreadLabel: "unreadLabel", totalLabel: "totalLabel", markAsReadLabel: "markAsReadLabel", markAsUnReadLabel: "markAsUnReadLabel", markAllAsReadLabel: "markAllAsReadLabel", settingsLabel: "settingsLabel", refreshLabel: "refreshLabel", viewAllNotificationsLabel: "viewAllNotificationsLabel", headerTitleLabel: "headerTitleLabel", noNotificationFoundLabel: "noNotificationFoundLabel", nbUnreadCount: "nbUnreadCount", dateFormat: "dateFormat", noNotificationFoundLink: "noNotificationFoundLink", isShowMarkAsRead: "isShowMarkAsRead", isShowViewAllAction: "isShowViewAllAction", isHidePanelOnViewAllAction: "isHidePanelOnViewAllAction", customUnreadCount: "customUnreadCount", isShowMarkAllAsReadButton: "isShowMarkAllAsReadButton", isShowSettingsButton: "isShowSettingsButton", isShowRefreshButton: "isShowRefreshButton" }, outputs: { refreshClick: "refreshClick", notificationsClick: "notificationsClick", viewAllClick: "viewAllClick", settingsClick: "settingsClick", markAllAsReadClick: "markAllAsReadClick", noNotificationFoundClick: "noNotificationFoundClick", itemClick: "itemClick", itemMarkAsReadClick: "itemMarkAsReadClick" }, host: { listeners: { "body:click": "onHide()" }, properties: { "class": "this.string" } }, usesOnChanges: true, ngImport: i0, template: "<eui-icon-svg\n    class=\"eui-notifications__trigger\"\n    role=\"button\"\n    size=\"m\"\n    icon=\"eui-notifications\"\n    fillColor=\"grey-5\"\n    (click)=\"onClicked($event)\"\n    (keydown.enter)=\"onClicked($event)\"\n    (keydown.esc)=\"onHide()\"\n    tabindex=\"0\">\n    <eui-badge *ngIf=\"count\" euiSizeS euiDanger>{{ count }}</eui-badge>\n</eui-icon-svg>\n\n<eui-overlay [isActive]=\"isOverlayActive\" class=\"eui-overlay-offset--width-30\">\n    <eui-overlay-header>\n        <div class=\"eui-notifications__header-title\">\n            <div class=\"eui-notifications__header-title-label\">\n                {{ headerTitleLabel ? headerTitleLabel : ('eui.MYNOTIFICATIONS' | translate) }}\n                <span\n                    *ngIf=\"items\"\n                    class=\"eui-u-cursor-help eui-u-ml-s\"\n                    attr.aria-label=\"{{ unreadLabel ? unreadLabel : ('eui.NOTIFICATIONSUNREAD' | translate) }}\"\n                    title=\"{{ unreadLabel ? unreadLabel : ('eui.NOTIFICATIONSUNREAD' | translate) }}\">\n                </span>\n                <eui-badge euiSizeL *ngIf=\"count\">{{ count }}</eui-badge>\n                <eui-badge euiSizeL *ngIf=\"!count\">{{ items.length }}</eui-badge>\n            </div>\n        </div>\n\n        <div *ngIf=\"items\" class=\"eui-notifications__header-actions\">\n            <button\n                euiButton\n                euiPrimary\n                euiRounded\n                euiIconButton\n                euiBasicButton\n                euiSizeS\n                type=\"button\"\n                *ngIf=\"isShowMarkAllAsReadButton\"\n                [attr.aria-label]=\"markAllAsReadLabel ? markAllAsReadLabel : ('eui.NOTIFICATIONMARKALLASREAD' | translate)\"\n                title=\"{{ markAllAsReadLabel ? markAllAsReadLabel : ('eui.NOTIFICATIONMARKALLASREAD' | translate) }}\"\n                (click)=\"onMarkAllAsRead($event)\">\n                <eui-icon-svg icon=\"eui-checkmark-done\" fillColor=\"primary-100\"></eui-icon-svg>\n            </button>\n            <button\n                euiButton\n                euiPrimary\n                euiRounded\n                euiIconButton\n                euiBasicButton\n                euiSizeS\n                type=\"button\"\n                *ngIf=\"isShowSettingsButton\"\n                [attr.aria-label]=\"settingsLabel ? settingsLabel : ('eui.SETTINGS' | translate)\"\n                title=\"{{ settingsLabel ? settingsLabel : ('eui.SETTINGS' | translate) }}\"\n                (click)=\"onSettings($event)\">\n                <eui-icon-svg icon=\"eui-settings\" fillColor=\"primary-100\"></eui-icon-svg>\n            </button>\n            <button\n                euiButton\n                euiPrimary\n                euiRounded\n                euiIconButton\n                euiBasicButton\n                euiSizeS\n                type=\"button\"\n                *ngIf=\"isShowRefreshButton\"\n                [attr.aria-label]=\"refreshLabel ? refreshLabel : ('eui.REFRESH' | translate)\"\n                title=\"{{ refreshLabel ? refreshLabel : ('eui.REFRESH' | translate) }}\"\n                (click)=\"onRefresh($event)\">\n                <eui-icon-svg icon=\"eui-refresh\" fillColor=\"primary-100\"></eui-icon-svg>\n            </button>\n        </div>\n    </eui-overlay-header>\n\n    <eui-overlay-body>\n        <ul class=\"eui-notifications-items\" *ngIf=\"items\">\n            <eui-notification-item\n                *ngFor=\"let item of items; trackBy: trackByFn\"\n                [item]=\"item\"\n                [dateFormat]=\"dateFormat\"\n                [markAsReadLabel]=\"markAsReadLabel\"\n                [isShowMarkAsRead]=\"isShowMarkAsRead\"\n                (itemClick)=\"onItemClick($event)\"\n                (itemMarkAsRead)=\"onItemMarkAsRead($event)\">\n            </eui-notification-item>\n        </ul>\n    </eui-overlay-body>\n\n    <eui-overlay-footer>\n        <ng-template [ngIf]=\"items?.length > 0\">\n            <strong\n                ><a (click)=\"onViewAllClick($event)\">{{\n                    viewAllNotificationsLabel ? viewAllNotificationsLabel : ('eui.VIEWALLNOTIFICATIONS' | translate)\n                }}</a></strong\n            >\n        </ng-template>\n        <ng-template [ngIf]=\"items?.length === 0\">\n            <div class=\"ux-notification__item-content\" *ngIf=\"!noNotificationFoundLink\">\n                {{ noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND' | translate) }}\n            </div>\n            <div class=\"ux-notification__item-content\" *ngIf=\"noNotificationFoundLink\">\n                <strong\n                    ><a (click)=\"onNoNotificationFoundClick()\">{{\n                        noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND' | translate)\n                    }}</a></strong\n                >\n            </div>\n        </ng-template>\n    </eui-overlay-footer>\n</eui-overlay>\n", styles: [".eui-overlay-header{background-color:var(--eui-base-color-grey-10);border-bottom:1px solid var(--eui-base-color-grey-20)}.eui-notifications-items{margin:0;padding:0}.eui-notifications__trigger{cursor:pointer;margin-top:var(--eui-base-spacing-xs)}.eui-notifications__trigger:focus{outline:2px solid var(--eui-base-color-accessible-focus)!important;outline-offset:5px;-moz-outline-radius:var(--eui-base-border-radius)!important;transition:outline .15s ease-in-out,border .15s ease-in-out}.eui-notifications__header{align-items:center;border-bottom:1px solid var(--eui-base-color-grey-10);color:var(--eui-base-color-font);cursor:default;display:flex;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-notifications__header-title{display:flex}.eui-notifications__header-title-label{font-size:var(--eui-base-font-size-l);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700}.eui-notifications__header-title-subLabel{font-size:var(--eui-base-font-size-s);margin-top:var(--eui-base-spacing-xs);font:normal normal 400 1rem/1.25rem var(--eui-base-font-family)}.eui-notifications__header-actions{align-items:center;display:flex;margin-left:auto}.eui-notification-item{display:flex;flex-direction:column;overflow-y:auto;margin:0}.eui-notification-item-content{background-color:var(--eui-base-color-primary-5);border-bottom:1px solid var(--eui-base-color-grey-15);display:flex;flex-direction:column;min-height:var(--eui-base-spacing-4xl);padding:var(--eui-base-spacing-s) var(--eui-base-spacing-m);cursor:pointer}.eui-notification-item-content:hover{background-color:var(--eui-base-color-grey-5)!important}.eui-notification-item-content-top{align-items:center;display:flex;justify-content:space-between}.eui-notification-item-content-top__date{display:flex;align-items:center}.eui-notification-item-content-top__date-icon{position:relative}.eui-notification-item-content-top__date-icon--rotated{transform:rotate(20deg)}.eui-notification-item-content-top__date-icon-dot{position:absolute;top:0;right:0}.eui-notification-item-content-middle{margin:var(--eui-base-spacing-2xs) 0}.eui-notification-item-content-middle__sub-label{margin-top:var(--eui-base-spacing-2xs)}.eui-notification-item-content-bottom{display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.EuiOverlayHeaderComponent, selector: "eui-overlay-header" }, { kind: "component", type: i2.EuiOverlayBodyComponent, selector: "eui-overlay-body" }, { kind: "component", type: i2.EuiOverlayFooterComponent, selector: "eui-overlay-footer" }, { kind: "component", type: i2.EuiOverlayComponent, selector: "eui-overlay", inputs: ["isActive", "hasClosedOnClickOutside", "position", "width", "fixedWidth"], outputs: ["activeState"] }, { kind: "component", type: i3.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "component", type: i4.EuiBadgeComponent, selector: "div[euiBadge], span[euiBadge], eui-badge", inputs: ["aria-label"] }, { kind: "component", type: i5.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading"] }, { kind: "component", type: i6.EuiNotificationItemComponent, selector: "eui-notification-item", inputs: ["markAsReadLabel", "item", "dateFormat", "isShowMarkAsRead"], outputs: ["itemClick", "itemMarkAsRead"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EuiNotificationsComponent, decorators: [{
             type: Component,

package/esm2022/layout/eui-notifications-v2/eui-notifications.component.mjs

@@ -186,7 +186,7 @@ export class EuiNotificationsV2Component {
         return unreadNotifications.length;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EuiNotificationsV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EuiNotificationsV2Component, selector: "eui-notifications-v2", inputs: { count: "count", unreadCount: "unreadCount", unreadSinceLastCheckCount: "unreadSinceLastCheckCount", items: "items", unreadLabel: "unreadLabel", totalLabel: "totalLabel", markAsReadLabel: "markAsReadLabel", markAsUnReadLabel: "markAsUnReadLabel", markAllAsReadLabel: "markAllAsReadLabel", settingsLabel: "settingsLabel", refreshLabel: "refreshLabel", viewAllNotificationsLabel: "viewAllNotificationsLabel", headerTitleLabel: "headerTitleLabel", headerHideLabel: "headerHideLabel", headerUnreadSinceLastCheckCountLabel: "headerUnreadSinceLastCheckCountLabel", headerUnreadCountLabel: "headerUnreadCountLabel", noNotificationFoundLabel: "noNotificationFoundLabel", nbUnreadCount: "nbUnreadCount", dateFormat: "dateFormat", noNotificationFoundLink: "noNotificationFoundLink", isShowMarkAsRead: "isShowMarkAsRead", isShowViewAllAction: "isShowViewAllAction", isHidePanelOnViewAllAction: "isHidePanelOnViewAllAction", customUnreadCount: "customUnreadCount", isShowMarkAllAsReadButton: "isShowMarkAllAsReadButton", isShowSettingsButton: "isShowSettingsButton", isShowRefreshButton: "isShowRefreshButton" }, outputs: { refreshClick: "refreshClick", notificationsClick: "notificationsClick", viewAllClick: "viewAllClick", settingsClick: "settingsClick", markAllAsReadClick: "markAllAsReadClick", noNotificationFoundClick: "noNotificationFoundClick", itemClick: "itemClick", itemMarkAsReadClick: "itemMarkAsReadClick" }, host: { properties: { "class": "this.string" } }, usesOnChanges: true, ngImport: i0, template: "<eui-icon-svg\n    class=\"eui-notifications-v2__trigger\"\n    role=\"button\"\n    size=\"m\"\n    icon=\"eui-notifications\"\n    fillColor=\"grey-5\"\n    (click)=\"onClicked($event)\"\n    (keydown.enter)=\"onClicked($event)\"\n    (keydown.esc)=\"onHide()\"\n    tabindex=\"0\">\n    <eui-badge *ngIf=\"unreadSinceLastCheckCount\" euiSizeS euiDanger>{{ unreadSinceLastCheckCount }}</eui-badge>\n</eui-icon-svg>\n\n<eui-overlay [isActive]=\"isOverlayActive\" class=\"eui-overlay-offset--width-30\">\n    <eui-overlay-header>\n        <div class=\"eui-notifications-v2__header\">\n            <div class=\"eui-notifications-v2__header-title\">\n                <div class=\"eui-notifications-v2__header-title-label\">\n                    {{ headerTitleLabel ? headerTitleLabel : ('eui.MYNOTIFICATIONS' | translate) }}\n                </div>\n\n                <div class=\"eui-notifications-v2__header-title-actions\">\n                    <span class=\"hide\">\n                        <a (click)=\"onHide()\" class=\"eui-u-text-link\" role=\"button\" tabIndex=\"0\">\n                            {{ headerHideLabel ? headerHideLabel : ('eui.HIDE' | translate) }}\n                        </a>\n                        <span class=\"ml-2 eui-u-font-size-xs eui-icon eui-icon-chevron-right\"></span>\n                    </span>\n                </div>\n            </div>\n\n            <div class=\"eui-notifications-v2__header-subinfos-bar\">\n                <strong>{{ unreadSinceLastCheckCount }}</strong>\n                <span class=\"eui-u-ml-xs\">{{\n                    headerUnreadSinceLastCheckCountLabel ? headerUnreadSinceLastCheckCountLabel : ('eui.NEW-COUNT' | translate)\n                }}</span>\n\n                <span class=\"eui-u-ml-xs\">|</span>\n\n                <span class=\"eui-u-ml-xs\">{{ unreadCount }}</span>\n                <span class=\"eui-u-ml-xs\">{{ headerUnreadCountLabel ? headerUnreadCountLabel : ('eui.NEW-COUNT' | translate) }}</span>\n            </div>\n\n            <div class=\"eui-notifications-v2__header-subactions-bar\">\n                <a *ngIf=\"items.length > 0\" (click)=\"onMarkAllAsRead($event)\" class=\"eui-u-text-link\" tabIndex=\"0\">\n                    {{ 'notif.MARK-ALL-READ' | translate }}\n                </a>\n                <a (click)=\"onRefresh($event)\" class=\"eui-u-text-link eui-u-ml-auto\" tabIndex=\"0\">\n                    <span class=\"eui-u-flex\">\n                        <span class=\"eui-icon eui-icon-refresh mr-1\"></span>\n                        {{ 'notif.SV-REFRESH' | translate }}\n                    </span>\n                </a>\n            </div>\n        </div>\n    </eui-overlay-header>\n\n    <eui-overlay-body>\n        <ul class=\"eui-notifications-items\" *ngIf=\"items\">\n            <eui-notification-item-v2\n                *ngFor=\"let item of items; trackBy: trackByFn\"\n                [item]=\"item\"\n                [dateFormat]=\"dateFormat\"\n                [markAsReadLabel]=\"markAsReadLabel\"\n                [isShowMarkAsRead]=\"isShowMarkAsRead\"\n                (itemClick)=\"onItemClick($event)\"\n                (itemMarkAsRead)=\"onItemMarkAsRead($event)\">\n            </eui-notification-item-v2>\n        </ul>\n    </eui-overlay-body>\n\n    <eui-overlay-footer>\n        <ng-template [ngIf]=\"items?.length > 0\">\n            <strong\n                ><a (click)=\"onViewAllClick($event)\" class=\"eui-u-text-link\">{{\n                    viewAllNotificationsLabel ? viewAllNotificationsLabel : ('eui.VIEWALLNOTIFICATIONS' | translate)\n                }}</a></strong\n            >\n        </ng-template>\n        <ng-template [ngIf]=\"items?.length === 0\">\n            <div class=\"ux-notification__item-content\" *ngIf=\"!noNotificationFoundLink\">\n                {{ noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND' | translate) }}\n            </div>\n            <div class=\"ux-notification__item-content\" *ngIf=\"noNotificationFoundLink\">\n                <strong\n                    ><a (click)=\"onNoNotificationFoundClick()\" class=\"eui-u-text-link\">{{\n                        noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND' | translate)\n                    }}</a></strong\n                >\n            </div>\n        </ng-template>\n    </eui-overlay-footer>\n</eui-overlay>\n", styles: [".eui-overlay-header{padding:0}.eui-overlay-footer{background-color:var(--eui-base-color-white)}.eui-notifications-items{margin:0;padding:0}.eui-notifications-v2__trigger{cursor:pointer;margin-top:var(--eui-base-spacing-xs);margin-left:var(--eui-base-spacing-s)}.eui-notifications-v2__trigger:focus{outline:2px solid var(--eui-base-color-accessible-focus)!important;outline-offset:5px;-moz-outline-radius:var(--eui-base-border-radius)!important;transition:outline .15s ease-in-out,border .15s ease-in-out}.eui-notifications-v2__header{border-bottom:1px solid var(--eui-base-color-grey-10);color:var(--eui-base-color-font);cursor:default;flex-direction:column;display:flex;width:100%}.eui-notifications-v2__header-title{display:flex;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-notifications-v2__header-title-label{font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family);font-weight:700}.eui-notifications-v2__header-title-subLabel{margin-top:var(--eui-base-spacing-xs);font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-notifications-v2__header-title-actions{align-items:center;display:flex;margin-left:auto}.eui-notifications-v2__header-subinfos-bar,.eui-notifications-v2__header-subactions-bar{display:flex;align-items:center;border-bottom:1px solid var(--eui-base-color-grey-10);padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-notification-item{display:flex;flex-direction:column;overflow-y:auto;margin:0}.eui-notification-item-content{background-color:var(--eui-base-color-info-10);border-bottom:1px solid var(--eui-base-color-grey-15);display:flex;flex-direction:column;min-height:var(--eui-base-spacing-4xl);padding:var(--eui-base-spacing-s) var(--eui-base-spacing-m);cursor:pointer}.eui-notification-item-content:hover{background-color:var(--eui-base-color-grey-5)!important}.eui-notification-item-content-top{align-items:center;display:flex;justify-content:space-between}.eui-notification-item-content-top__date{display:flex;align-items:center}.eui-notification-item-content-top__date-icon{position:relative}.eui-notification-item-content-top__date-icon--rotated{transform:rotate(20deg)}.eui-notification-item-content-top__date-icon-dot{position:absolute;top:0;right:0}.eui-notification-item-content-middle{display:flex;margin:var(--eui-base-spacing-2xs) 0}.eui-notification-item-content-middle__sub-label{margin-top:var(--eui-base-spacing-2xs)}.eui-notification-item-content-bottom{display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.EuiOverlayHeaderComponent, selector: "eui-overlay-header" }, { kind: "component", type: i2.EuiOverlayBodyComponent, selector: "eui-overlay-body" }, { kind: "component", type: i2.EuiOverlayFooterComponent, selector: "eui-overlay-footer" }, { kind: "component", type: i2.EuiOverlayComponent, selector: "eui-overlay", inputs: ["isActive", "position", "width", "fixedWidth"], outputs: ["activeState"] }, { kind: "component", type: i3.EuiBadgeComponent, selector: "div[euiBadge], span[euiBadge], eui-badge", inputs: ["aria-label"] }, { 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"] }, { kind: "component", type: i5.EuiNotificationItemV2Component, selector: "eui-notification-item-v2", inputs: ["markAsReadLabel", "item", "dateFormat", "isShowMarkAsRead"], outputs: ["itemClick", "itemMarkAsRead"] }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EuiNotificationsV2Component, selector: "eui-notifications-v2", inputs: { count: "count", unreadCount: "unreadCount", unreadSinceLastCheckCount: "unreadSinceLastCheckCount", items: "items", unreadLabel: "unreadLabel", totalLabel: "totalLabel", markAsReadLabel: "markAsReadLabel", markAsUnReadLabel: "markAsUnReadLabel", markAllAsReadLabel: "markAllAsReadLabel", settingsLabel: "settingsLabel", refreshLabel: "refreshLabel", viewAllNotificationsLabel: "viewAllNotificationsLabel", headerTitleLabel: "headerTitleLabel", headerHideLabel: "headerHideLabel", headerUnreadSinceLastCheckCountLabel: "headerUnreadSinceLastCheckCountLabel", headerUnreadCountLabel: "headerUnreadCountLabel", noNotificationFoundLabel: "noNotificationFoundLabel", nbUnreadCount: "nbUnreadCount", dateFormat: "dateFormat", noNotificationFoundLink: "noNotificationFoundLink", isShowMarkAsRead: "isShowMarkAsRead", isShowViewAllAction: "isShowViewAllAction", isHidePanelOnViewAllAction: "isHidePanelOnViewAllAction", customUnreadCount: "customUnreadCount", isShowMarkAllAsReadButton: "isShowMarkAllAsReadButton", isShowSettingsButton: "isShowSettingsButton", isShowRefreshButton: "isShowRefreshButton" }, outputs: { refreshClick: "refreshClick", notificationsClick: "notificationsClick", viewAllClick: "viewAllClick", settingsClick: "settingsClick", markAllAsReadClick: "markAllAsReadClick", noNotificationFoundClick: "noNotificationFoundClick", itemClick: "itemClick", itemMarkAsReadClick: "itemMarkAsReadClick" }, host: { properties: { "class": "this.string" } }, usesOnChanges: true, ngImport: i0, template: "<eui-icon-svg\n    class=\"eui-notifications-v2__trigger\"\n    role=\"button\"\n    size=\"m\"\n    icon=\"eui-notifications\"\n    fillColor=\"grey-5\"\n    (click)=\"onClicked($event)\"\n    (keydown.enter)=\"onClicked($event)\"\n    (keydown.esc)=\"onHide()\"\n    tabindex=\"0\">\n    <eui-badge *ngIf=\"unreadSinceLastCheckCount\" euiSizeS euiDanger>{{ unreadSinceLastCheckCount }}</eui-badge>\n</eui-icon-svg>\n\n<eui-overlay [isActive]=\"isOverlayActive\" class=\"eui-overlay-offset--width-30\">\n    <eui-overlay-header>\n        <div class=\"eui-notifications-v2__header\">\n            <div class=\"eui-notifications-v2__header-title\">\n                <div class=\"eui-notifications-v2__header-title-label\">\n                    {{ headerTitleLabel ? headerTitleLabel : ('eui.MYNOTIFICATIONS' | translate) }}\n                </div>\n\n                <div class=\"eui-notifications-v2__header-title-actions\">\n                    <span class=\"hide\">\n                        <a (click)=\"onHide()\" class=\"eui-u-text-link\" role=\"button\" tabIndex=\"0\">\n                            {{ headerHideLabel ? headerHideLabel : ('eui.HIDE' | translate) }}\n                        </a>\n                        <span class=\"ml-2 eui-u-font-size-xs eui-icon eui-icon-chevron-right\"></span>\n                    </span>\n                </div>\n            </div>\n\n            <div class=\"eui-notifications-v2__header-subinfos-bar\">\n                <strong>{{ unreadSinceLastCheckCount }}</strong>\n                <span class=\"eui-u-ml-xs\">{{\n                    headerUnreadSinceLastCheckCountLabel ? headerUnreadSinceLastCheckCountLabel : ('eui.NEW-COUNT' | translate)\n                }}</span>\n\n                <span class=\"eui-u-ml-xs\">|</span>\n\n                <span class=\"eui-u-ml-xs\">{{ unreadCount }}</span>\n                <span class=\"eui-u-ml-xs\">{{ headerUnreadCountLabel ? headerUnreadCountLabel : ('eui.NEW-COUNT' | translate) }}</span>\n            </div>\n\n            <div class=\"eui-notifications-v2__header-subactions-bar\">\n                <a *ngIf=\"items.length > 0\" (click)=\"onMarkAllAsRead($event)\" class=\"eui-u-text-link\" tabIndex=\"0\">\n                    {{ 'notif.MARK-ALL-READ' | translate }}\n                </a>\n                <a (click)=\"onRefresh($event)\" class=\"eui-u-text-link eui-u-ml-auto\" tabIndex=\"0\">\n                    <span class=\"eui-u-flex\">\n                        <span class=\"eui-icon eui-icon-refresh mr-1\"></span>\n                        {{ 'notif.SV-REFRESH' | translate }}\n                    </span>\n                </a>\n            </div>\n        </div>\n    </eui-overlay-header>\n\n    <eui-overlay-body>\n        <ul class=\"eui-notifications-items\" *ngIf=\"items\">\n            <eui-notification-item-v2\n                *ngFor=\"let item of items; trackBy: trackByFn\"\n                [item]=\"item\"\n                [dateFormat]=\"dateFormat\"\n                [markAsReadLabel]=\"markAsReadLabel\"\n                [isShowMarkAsRead]=\"isShowMarkAsRead\"\n                (itemClick)=\"onItemClick($event)\"\n                (itemMarkAsRead)=\"onItemMarkAsRead($event)\">\n            </eui-notification-item-v2>\n        </ul>\n    </eui-overlay-body>\n\n    <eui-overlay-footer>\n        <ng-template [ngIf]=\"items?.length > 0\">\n            <strong\n                ><a (click)=\"onViewAllClick($event)\" class=\"eui-u-text-link\">{{\n                    viewAllNotificationsLabel ? viewAllNotificationsLabel : ('eui.VIEWALLNOTIFICATIONS' | translate)\n                }}</a></strong\n            >\n        </ng-template>\n        <ng-template [ngIf]=\"items?.length === 0\">\n            <div class=\"ux-notification__item-content\" *ngIf=\"!noNotificationFoundLink\">\n                {{ noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND' | translate) }}\n            </div>\n            <div class=\"ux-notification__item-content\" *ngIf=\"noNotificationFoundLink\">\n                <strong\n                    ><a (click)=\"onNoNotificationFoundClick()\" class=\"eui-u-text-link\">{{\n                        noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND' | translate)\n                    }}</a></strong\n                >\n            </div>\n        </ng-template>\n    </eui-overlay-footer>\n</eui-overlay>\n", styles: [".eui-overlay-header{padding:0}.eui-overlay-footer{background-color:var(--eui-base-color-white)}.eui-notifications-items{margin:0;padding:0}.eui-notifications-v2__trigger{cursor:pointer;margin-top:var(--eui-base-spacing-xs);margin-left:var(--eui-base-spacing-s)}.eui-notifications-v2__trigger:focus{outline:2px solid var(--eui-base-color-accessible-focus)!important;outline-offset:5px;-moz-outline-radius:var(--eui-base-border-radius)!important;transition:outline .15s ease-in-out,border .15s ease-in-out}.eui-notifications-v2__header{border-bottom:1px solid var(--eui-base-color-grey-10);color:var(--eui-base-color-font);cursor:default;flex-direction:column;display:flex;width:100%}.eui-notifications-v2__header-title{display:flex;padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-notifications-v2__header-title-label{font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family);font-weight:700}.eui-notifications-v2__header-title-subLabel{margin-top:var(--eui-base-spacing-xs);font:normal normal 400 .875rem/1rem var(--eui-base-font-family)}.eui-notifications-v2__header-title-actions{align-items:center;display:flex;margin-left:auto}.eui-notifications-v2__header-subinfos-bar,.eui-notifications-v2__header-subactions-bar{display:flex;align-items:center;border-bottom:1px solid var(--eui-base-color-grey-10);padding:var(--eui-base-spacing-xs) var(--eui-base-spacing-m)}.eui-notification-item{display:flex;flex-direction:column;overflow-y:auto;margin:0}.eui-notification-item-content{background-color:var(--eui-base-color-info-10);border-bottom:1px solid var(--eui-base-color-grey-15);display:flex;flex-direction:column;min-height:var(--eui-base-spacing-4xl);padding:var(--eui-base-spacing-s) var(--eui-base-spacing-m);cursor:pointer}.eui-notification-item-content:hover{background-color:var(--eui-base-color-grey-5)!important}.eui-notification-item-content-top{align-items:center;display:flex;justify-content:space-between}.eui-notification-item-content-top__date{display:flex;align-items:center}.eui-notification-item-content-top__date-icon{position:relative}.eui-notification-item-content-top__date-icon--rotated{transform:rotate(20deg)}.eui-notification-item-content-top__date-icon-dot{position:absolute;top:0;right:0}.eui-notification-item-content-middle{display:flex;margin:var(--eui-base-spacing-2xs) 0}.eui-notification-item-content-middle__sub-label{margin-top:var(--eui-base-spacing-2xs)}.eui-notification-item-content-bottom{display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.EuiOverlayHeaderComponent, selector: "eui-overlay-header" }, { kind: "component", type: i2.EuiOverlayBodyComponent, selector: "eui-overlay-body" }, { kind: "component", type: i2.EuiOverlayFooterComponent, selector: "eui-overlay-footer" }, { kind: "component", type: i2.EuiOverlayComponent, selector: "eui-overlay", inputs: ["isActive", "hasClosedOnClickOutside", "position", "width", "fixedWidth"], outputs: ["activeState"] }, { kind: "component", type: i3.EuiBadgeComponent, selector: "div[euiBadge], span[euiBadge], eui-badge", inputs: ["aria-label"] }, { 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"] }, { kind: "component", type: i5.EuiNotificationItemV2Component, selector: "eui-notification-item-v2", inputs: ["markAsReadLabel", "item", "dateFormat", "isShowMarkAsRead"], outputs: ["itemClick", "itemMarkAsRead"] }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EuiNotificationsV2Component, decorators: [{
             type: Component,

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

@@ -27,7 +27,7 @@ export class EuiSearchComponent extends BaseDirective {
         this.isActive = !this.isActive;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EuiSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EuiSearchComponent, selector: "eui-search", inputs: { isActive: "isActive" }, outputs: { search: "search" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<button euiButton euiIconButton euiPrimary class=\"eui-search__trigger\" (click)=\"onToggle()\">\n    <eui-icon-svg icon=\"eui-search\" size=\"l\" fillColor=\"grey-5\"></eui-icon-svg>\n</button>\n<eui-overlay euiSizeFullScreen euiPrimary [isActive]=\"isActive\">\n    <eui-overlay-header>\n        <div euiInputGroup class=\"eui-u-mb-none\">\n            <div class=\"eui-input-group-addon\">\n                <button euiButton euiIconButton type=\"button\" (click)=\"onBackClicked()\">\n                    <eui-icon-svg icon=\"eui-arrow-back\" size=\"l\" fillColor=\"grey-100\"></eui-icon-svg>\n                </button>\n                <input\n                    euiInputText\n                    type=\"search\"\n                    placeholder=\"Search website...\"\n                    [(ngModel)]=\"searchField\"\n                    aria-label=\"Search website\"\n                    (keypress.enter)=\"onSearchClicked()\" />\n                <button euiButton euiIconButton type=\"button\" (click)=\"onSearchClicked()\">\n                    <eui-icon-svg icon=\"eui-search\" size=\"l\" fillColor=\"grey-100\"></eui-icon-svg>\n                </button>\n            </div>\n        </div>\n    </eui-overlay-header>\n    <eui-overlay-body>\n        <ng-content></ng-content>\n    </eui-overlay-body>\n</eui-overlay>\n", styles: [".eui-search{align-items:center;display:flex}.eui-search__trigger{align-items:center;border:none!important;background:transparent!important;display:inline-flex;height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs));width:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs))}.eui-search-overlay-main{display:none}\n"], dependencies: [{ kind: "component", type: i1.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading"] }, { kind: "component", type: i2.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "component", type: i3.EuiOverlayHeaderComponent, selector: "eui-overlay-header" }, { kind: "component", type: i3.EuiOverlayBodyComponent, selector: "eui-overlay-body" }, { kind: "component", type: i3.EuiOverlayComponent, selector: "eui-overlay", inputs: ["isActive", "position", "width", "fixedWidth"], outputs: ["activeState"] }, { kind: "component", type: i4.EuiInputTextComponent, selector: "input[euiInputText]", inputs: ["class", "isInvalid"] }, { kind: "component", type: i5.EuiInputGroupComponent, selector: "div[euiInputGroup]", inputs: ["e2eAttr", "styleClass"] }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EuiSearchComponent, selector: "eui-search", inputs: { isActive: "isActive" }, outputs: { search: "search" }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<button euiButton euiIconButton euiPrimary class=\"eui-search__trigger\" (click)=\"onToggle()\">\n    <eui-icon-svg icon=\"eui-search\" size=\"l\" fillColor=\"grey-5\"></eui-icon-svg>\n</button>\n<eui-overlay euiSizeFullScreen euiPrimary [isActive]=\"isActive\">\n    <eui-overlay-header>\n        <div euiInputGroup class=\"eui-u-mb-none\">\n            <div class=\"eui-input-group-addon\">\n                <button euiButton euiIconButton type=\"button\" (click)=\"onBackClicked()\">\n                    <eui-icon-svg icon=\"eui-arrow-back\" size=\"l\" fillColor=\"grey-100\"></eui-icon-svg>\n                </button>\n                <input\n                    euiInputText\n                    type=\"search\"\n                    placeholder=\"Search website...\"\n                    [(ngModel)]=\"searchField\"\n                    aria-label=\"Search website\"\n                    (keypress.enter)=\"onSearchClicked()\" />\n                <button euiButton euiIconButton type=\"button\" (click)=\"onSearchClicked()\">\n                    <eui-icon-svg icon=\"eui-search\" size=\"l\" fillColor=\"grey-100\"></eui-icon-svg>\n                </button>\n            </div>\n        </div>\n    </eui-overlay-header>\n    <eui-overlay-body>\n        <ng-content></ng-content>\n    </eui-overlay-body>\n</eui-overlay>\n", styles: [".eui-search{align-items:center;display:flex}.eui-search__trigger{align-items:center;border:none!important;background:transparent!important;display:inline-flex;height:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs));width:calc(var(--eui-base-spacing-2xl) + var(--eui-base-spacing-2xs))}.eui-search-overlay-main{display:none}\n"], dependencies: [{ kind: "component", type: i1.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading"] }, { kind: "component", type: i2.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "component", type: i3.EuiOverlayHeaderComponent, selector: "eui-overlay-header" }, { kind: "component", type: i3.EuiOverlayBodyComponent, selector: "eui-overlay-body" }, { kind: "component", type: i3.EuiOverlayComponent, selector: "eui-overlay", inputs: ["isActive", "hasClosedOnClickOutside", "position", "width", "fixedWidth"], outputs: ["activeState"] }, { kind: "component", type: i4.EuiInputTextComponent, selector: "input[euiInputText]", inputs: ["class", "isInvalid"] }, { kind: "component", type: i5.EuiInputGroupComponent, selector: "div[euiInputGroup]", inputs: ["e2eAttr", "styleClass"] }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EuiSearchComponent, decorators: [{
             type: Component,

package/eui-file-upload/file-preview/file-preview.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"file-preview.component.d.ts","sourceRoot":"","sources":["../../../eui-file-upload/file-preview/file-preview.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAEH,MAAM,EAIN,iBAAiB,EAEjB,YAAY,EACf,MAAM,eAAe,CAAC;AACvB,OAAO,EAAyB,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE5E,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;;AAEhE,qBAMa,uBAAwB,YAAW,MAAM;IAmGtC,OAAO,CAAC,EAAE;IAhGb,IAAI,EAAE,IAAI,GAAG,eAAe,GAAG,GAAG,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IAEd,mBAAmB;;;;;;;;;;;;;;;;;;;;;;MAsB1B;IAEQ,cAAc,uBAA8B;IAE/C,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE;QAAE,KAAK,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IACjD,SAAS,UAAS;IAIf,SAAS,oBAAoD;IAEvE,IACI,UAAU,IAAI,OAAO,CAExB;IACD,IAAI,UAAU,CAAC,KAAK,EAAE,YAAY,EAEjC;IACD,OAAO,CAAC,WAAW,CAAQ;IAC3B,IACI,mBAAmB,IAAI,OAAO,CAEjC;IACD,IAAI,mBAAmB,CAAC,KAAK,EAAE,YAAY,EAE1C;IACD,OAAO,CAAC,oBAAoB,CAAQ;IACpC,IACI,mBAAmB,IAAI,OAAO,CAEjC;IACD,IAAI,mBAAmB,CAAC,KAAK,EAAE,YAAY,EAE1C;IACD,OAAO,CAAC,oBAAoB,CAAQ;IACpC,IACI,mBAAmB,IAAI,OAAO,CAEjC;IACD,IAAI,mBAAmB,CAAC,KAAK,EAAE,YAAY,EAE1C;IACD,OAAO,CAAC,oBAAoB,CAAQ;IACpC,IACI,iBAAiB,IAAI,OAAO,CAE/B;IACD,IAAI,iBAAiB,CAAC,KAAK,EAAE,YAAY,EAExC;IACD,OAAO,CAAC,kBAAkB,CAAQ;IAClC,IACI,gBAAgB,IAAI,OAAO,CAE9B;IACD,IAAI,gBAAgB,CAAC,KAAK,EAAE,YAAY,EAEvC;IACD,OAAO,CAAC,iBAAiB,CAAS;IAClC,IACI,gBAAgB,IAAI,OAAO,CAE9B;IACD,IAAI,gBAAgB,CAAC,KAAK,EAAE,YAAY,EAEvC;IACD,OAAO,CAAC,iBAAiB,CAAS;gBAEd,EAAE,EAAE,iBAAiB;IAEzC,QAAQ,IAAI,IAAI;IAoCT,gBAAgB,IAAI,IAAI;IAIxB,WAAW,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAKlC,OAAO,CAAC,gBAAgB;IAMxB,OAAO,CAAC,iBAAiB;IAQzB,OAAO,CAAC,cAAc;yCAhKb,uBAAuB;2CAAvB,uBAAuB;CAoKnC"}
+{"version":3,"file":"file-preview.component.d.ts","sourceRoot":"","sources":["../../../eui-file-upload/file-preview/file-preview.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAEH,MAAM,EAIN,iBAAiB,EAEjB,YAAY,EACf,MAAM,eAAe,CAAC;AACvB,OAAO,EAAyB,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE5E,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;;AAEhE,qBAMa,uBAAwB,YAAW,MAAM;IAmGtC,OAAO,CAAC,EAAE;IAhGb,IAAI,EAAE,IAAI,GAAG,eAAe,GAAG,GAAG,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IAEd,mBAAmB;;;;;;;;;;;;;;;;;;;;;;MAsB1B;IAEQ,cAAc,uBAA8B;IAE/C,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE;QAAE,KAAK,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IACjD,SAAS,UAAS;IAIf,SAAS,oBAAoD;IAEvE,IACI,UAAU,IAAI,OAAO,CAExB;IACD,IAAI,UAAU,CAAC,KAAK,EAAE,YAAY,EAEjC;IACD,OAAO,CAAC,WAAW,CAAQ;IAC3B,IACI,mBAAmB,IAAI,OAAO,CAEjC;IACD,IAAI,mBAAmB,CAAC,KAAK,EAAE,YAAY,EAE1C;IACD,OAAO,CAAC,oBAAoB,CAAQ;IACpC,IACI,mBAAmB,IAAI,OAAO,CAEjC;IACD,IAAI,mBAAmB,CAAC,KAAK,EAAE,YAAY,EAE1C;IACD,OAAO,CAAC,oBAAoB,CAAQ;IACpC,IACI,mBAAmB,IAAI,OAAO,CAEjC;IACD,IAAI,mBAAmB,CAAC,KAAK,EAAE,YAAY,EAE1C;IACD,OAAO,CAAC,oBAAoB,CAAQ;IACpC,IACI,iBAAiB,IAAI,OAAO,CAE/B;IACD,IAAI,iBAAiB,CAAC,KAAK,EAAE,YAAY,EAExC;IACD,OAAO,CAAC,kBAAkB,CAAQ;IAClC,IACI,gBAAgB,IAAI,OAAO,CAE9B;IACD,IAAI,gBAAgB,CAAC,KAAK,EAAE,YAAY,EAEvC;IACD,OAAO,CAAC,iBAAiB,CAAS;IAClC,IACI,gBAAgB,IAAI,OAAO,CAE9B;IACD,IAAI,gBAAgB,CAAC,KAAK,EAAE,YAAY,EAEvC;IACD,OAAO,CAAC,iBAAiB,CAAS;gBAEd,EAAE,EAAE,iBAAiB;IAEzC,QAAQ,IAAI,IAAI;IA2CT,gBAAgB,IAAI,IAAI;IAIxB,WAAW,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAKlC,OAAO,CAAC,gBAAgB;IAMxB,OAAO,CAAC,iBAAiB;IAQzB,OAAO,CAAC,cAAc;yCAvKb,uBAAuB;2CAAvB,uBAAuB;CA2KnC"}

package/eui-overlay/eui-overlay.component.d.ts

@@ -1,6 +1,6 @@
 import { EventEmitter } from '@angular/core';
-import { BaseDirective } from '@eui/components/shared';
 import { BooleanInput } from '@angular/cdk/coercion';
+import { BaseDirective } from '@eui/components/shared';
 import * as i0 from "@angular/core";
 import * as i1 from "./components/eui-overlay-header/eui-overlay-header.component";
 import * as i2 from "./components/eui-overlay-body/eui-overlay-body.component";
@@ -8,27 +8,30 @@ import * as i3 from "./components/eui-overlay-footer/eui-overlay-footer.componen
 import * as i4 from "./components/eui-overlay-header/eui-overlay-header-title/eui-overlay-header-title.component";
 import * as i5 from "@angular/common";
 import * as i6 from "@eui/components/eui-badge";
-import * as i7 from "@angular/cdk/overlay";
-import * as i8 from "@angular/cdk/a11y";
-import * as i9 from "@eui/components/eui-icon";
-import * as i10 from "@eui/components/eui-label";
+import * as i7 from "@angular/cdk/a11y";
+import * as i8 from "@eui/components/eui-icon";
 export declare class EuiOverlayComponent extends BaseDirective {
     get cssClasses(): string;
     role: string;
-    activeState: EventEmitter<boolean>;
     get isActive(): boolean;
     set isActive(value: BooleanInput);
+    get hasClosedOnClickOutside(): boolean;
+    set hasClosedOnClickOutside(value: BooleanInput);
     position: string;
     width: string;
     fixedWidth: string;
+    activeState: EventEmitter<boolean>;
     private _isActive;
+    private _hasClosedOnClickOutside;
+    constructor();
     onKeydown(event: KeyboardEvent): void;
+    onClick(event: MouseEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<EuiOverlayComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<EuiOverlayComponent, "eui-overlay", never, { "isActive": { "alias": "isActive"; "required": false; }; "position": { "alias": "position"; "required": false; }; "width": { "alias": "width"; "required": false; }; "fixedWidth": { "alias": "fixedWidth"; "required": false; }; }, { "activeState": "activeState"; }, never, ["eui-overlay-header", "eui-overlay-body", "eui-overlay-footer"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<EuiOverlayComponent, "eui-overlay", never, { "isActive": { "alias": "isActive"; "required": false; }; "hasClosedOnClickOutside": { "alias": "hasClosedOnClickOutside"; "required": false; }; "position": { "alias": "position"; "required": false; }; "width": { "alias": "width"; "required": false; }; "fixedWidth": { "alias": "fixedWidth"; "required": false; }; }, { "activeState": "activeState"; }, never, ["eui-overlay-header", "eui-overlay-body", "eui-overlay-footer"], false, never>;
 }
 export declare class EuiOverlayModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<EuiOverlayModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<EuiOverlayModule, [typeof i1.EuiOverlayHeaderComponent, typeof i2.EuiOverlayBodyComponent, typeof i3.EuiOverlayFooterComponent, typeof EuiOverlayComponent, typeof i4.EuiOverlayHeaderTitleComponent], [typeof i5.CommonModule, typeof i6.EuiBadgeModule, typeof i7.OverlayModule, typeof i8.A11yModule, typeof i9.EuiIconModule, typeof i10.EuiLabelModule], [typeof i1.EuiOverlayHeaderComponent, typeof i2.EuiOverlayBodyComponent, typeof i3.EuiOverlayFooterComponent, typeof EuiOverlayComponent, typeof i4.EuiOverlayHeaderTitleComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<EuiOverlayModule, [typeof i1.EuiOverlayHeaderComponent, typeof i2.EuiOverlayBodyComponent, typeof i3.EuiOverlayFooterComponent, typeof EuiOverlayComponent, typeof i4.EuiOverlayHeaderTitleComponent], [typeof i5.CommonModule, typeof i6.EuiBadgeModule, typeof i7.A11yModule, typeof i8.EuiIconModule], [typeof i1.EuiOverlayHeaderComponent, typeof i2.EuiOverlayBodyComponent, typeof i3.EuiOverlayFooterComponent, typeof EuiOverlayComponent, typeof i4.EuiOverlayHeaderTitleComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<EuiOverlayModule>;
 }
 //# sourceMappingURL=eui-overlay.component.d.ts.map

package/eui-overlay/eui-overlay.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"eui-overlay.component.d.ts","sourceRoot":"","sources":["../../eui-overlay/eui-overlay.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAoF,YAAY,EAAE,MAAM,eAAe,CAAC;AAC/H,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAIvD,OAAO,EAAyB,YAAY,EAAE,MAAM,uBAAuB,CAAC;;;;;;;;;;;;AAW5E,qBAMa,mBAAoB,SAAQ,aAAa;IAClD,IACI,UAAU,IAAI,MAAM,CAUvB;IAEyB,IAAI,SAAY;IAEhC,WAAW,wBAA6B;IAElD,IACI,QAAQ,IAAI,OAAO,CAEtB;IACD,IAAI,QAAQ,CAAC,KAAK,EAAE,YAAY,EAE/B;IACQ,QAAQ,SAAW;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IAC5B,OAAO,CAAC,SAAS,CAAS;IAG1B,SAAS,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI;yCA/B5B,mBAAmB;2CAAnB,mBAAmB;CAoC/B;AAKD,qBAiBa,gBAAgB;yCAAhB,gBAAgB;0CAAhB,gBAAgB,uHA1DhB,mBAAmB,yTAAnB,mBAAmB;0CA0DnB,gBAAgB;CAAG"}
+{"version":3,"file":"eui-overlay.component.d.ts","sourceRoot":"","sources":["../../eui-overlay/eui-overlay.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAoF,YAAY,EAAE,MAAM,eAAe,CAAC;AAE/H,OAAO,EAAyB,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE5E,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;;;;;;;;;;AASvD,qBAMa,mBAAoB,SAAQ,aAAa;IAClD,IACI,UAAU,IAAI,MAAM,CAWvB;IAEyB,IAAI,SAAY;IAE1C,IACI,QAAQ,IAAI,OAAO,CAEtB;IACD,IAAI,QAAQ,CAAC,KAAK,EAAE,YAAY,EAE/B;IACD,IACI,uBAAuB,IAAI,OAAO,CAErC;IACD,IAAI,uBAAuB,CAAC,KAAK,EAAE,YAAY,EAE9C;IAEQ,QAAQ,SAAW;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IAElB,WAAW,wBAA6B;IAElD,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,wBAAwB,CAAS;;IAOzC,SAAS,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI;IAOrC,OAAO,CAAC,KAAK,EAAE,UAAU,GAAG,IAAI;yCArDvB,mBAAmB;2CAAnB,mBAAmB;CAuE/B;AAKD,qBAiBa,gBAAgB;yCAAhB,gBAAgB;0CAAhB,gBAAgB,uHA7FhB,mBAAmB,qQAAnB,mBAAmB;0CA6FnB,gBAAgB;CAAG"}

package/fesm2022/eui-components-eui-file-upload.mjs

@@ -148,7 +148,9 @@ class EuiFilePreviewComponent {
                 this.url = event.target.result;
                 this.fileExtension = this.getFileExtension(this.file.name);
                 this.icon = this.getIconForMime(this.fileExtension);
-                this.previewData = this.getPreviewForMime(this.fileExtension);
+                const blob = new Blob([reader.result], { type: this.file.type });
+                const imageUrl = URL.createObjectURL(blob);
+                this.previewData = this.getPreviewForMime(this.fileExtension, imageUrl);
                 this.cd.detectChanges();
             };
             // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -166,7 +168,7 @@ class EuiFilePreviewComponent {
             this.url = this.file.url;
             this.fileExtension = this.getFileExtension(this.file.name);
             this.icon = this.getIconForMime(this.fileExtension);
-            this.previewData = this.getPreviewForMime(this.fileExtension);
+            this.previewData = this.getPreviewForMime(this.fileExtension, this.url);
             this.cd.detectChanges();
         }
     }
@@ -181,10 +183,10 @@ class EuiFilePreviewComponent {
         const ext = fileName.split('.');
         return ext[ext.length - 1];
     }
-    getPreviewForMime(fileExtension) {
+    getPreviewForMime(fileExtension, imgUrl) {
         const f = fileExtension.toLowerCase();
         const image = f === 'jpeg' || f === 'jpg' || f === 'png' || f === 'gif' ? true : false;
-        const display = f === 'jpeg' || f === 'jpg' || f === 'png' || f === 'gif' ? this.url : this.getIconForMime(f);
+        const display = f === 'jpeg' || f === 'jpg' || f === 'png' || f === 'gif' ? imgUrl : this.getIconForMime(f);
         return { image, display };
     }
     getIconForMime(fileExtension) {