@eui/components 18.0.0-rc.25 → 18.0.0-rc.26

package/fesm2022/eui-components-layout.mjs

@@ -2109,13 +2109,7 @@ class EuiNotificationItemComponent {
         this.markAsReadLabel = null;
         this.dateFormat = 'dd/MM/YYYY';
         this.tooltipSize = 'auto';
-        this._isShowMarkAsRead = true;
-    }
-    get isShowMarkAsRead() {
-        return this._isShowMarkAsRead;
-    }
-    set isShowMarkAsRead(value) {
-        this._isShowMarkAsRead = coerceBooleanProperty(value);
+        this.isShowMarkAsRead = true;
     }
     onItemClick() {
         this.itemClick.emit(this.item);
@@ -2131,7 +2125,7 @@ class EuiNotificationItemComponent {
         return this.item.metadata?.read ? 'neutral-lightest' : 'neutral-light';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiNotificationItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0", type: EuiNotificationItemComponent, selector: "eui-notification-item", inputs: { markAsReadLabel: "markAsReadLabel", item: "item", dateFormat: "dateFormat", isShowMarkAsRead: "isShowMarkAsRead" }, outputs: { itemClick: "itemClick", itemMarkAsRead: "itemMarkAsRead" }, host: { properties: { "class": "this.string" } }, ngImport: i0, template: "<div\n    class=\"eui-notification-item-content\"\n    (click)=\"onItemClick()\"\n    [ngClass]=\"{ 'eui-u-c-bg-white': item.metadata?.read || !item.metadata }\">\n    <div class=\"eui-notification-item-content-top eui-u-f-s\">\n        <div *ngIf=\"item.metadata?.date\" class=\"eui-notification-item-content-top__date\">\n            <span class=\"eui-notification-item-content-top__date-icon eui-u-mr-s\">\n                <eui-icon-svg icon=\"notifications:sharp\" size=\"m\" [fillColor]=\"iconColor\"></eui-icon-svg>\n                <span\n                    *ngIf=\"item.metadata?.new\"\n                    class=\"eui-notification-item-content-top__date-dot eui-u-c-danger-light eui-u-f-s eui-icon eui-icon-circle\"></span>\n            </span>\n            <span>{{ item.metadata?.date | date: dateFormat }}</span>\n        </div>\n        <div *ngIf=\"item.metadata?.important\" class=\"eui-u-f-m-bold\">\n            <eui-icon-svg icon=\"alert:sharp\" fillColor=\"danger\" class=\"eui-u-ml-xs\"></eui-icon-svg>\n        </div>\n    </div>\n    <span class=\"eui-notification-item-content-middle eui-u-cursor-pointer\">\n        <ng-template [ngIf]=\"item.metadata?.url\">\n            <a class=\"eui-u-text-link\" href=\"{{ item.metadata.url }}\">\n                <div\n                    class=\"eui-notification-item-content-middle__label\"\n                    [ngClass]=\"{ 'eui-u-f-m-bold': !item.metadata || (item.metadata && !item.metadata.read) }\">\n                    {{ item.label | translate | euiTruncate: 200 }}\n                </div>\n                <div\n                    *ngIf=\"item.subLabel\"\n                    class=\"eui-notification-item-content-middle__sub-label\"\n                    [innerHTML]=\"item.subLabel | translate | euiTruncate: 200\"></div>\n            </a>\n        </ng-template>\n\n        <ng-template [ngIf]=\"item.metadata?.urlExternal\">\n            <a class=\"eui-u-text-link-external\"\n                href=\"{{ item.metadata.urlExternal }}\"\n                [target]=\"!item.metadata.urlExternalTarget ? '_blank' : item.metadata.urlExternalTarget\">\n                <div\n                    class=\"eui-notification-item-content-middle__label\"\n                    [ngClass]=\"{ 'eui-u-f-m-bold': !item.metadata || (item.metadata && !item.metadata.read) }\">\n                    {{ item.label | translate | euiTruncate: 200 }}\n                </div>\n                <div\n                    *ngIf=\"item.subLabel\"\n                    class=\"eui-notification-item-content-middle__sub-label\"\n                    [innerHTML]=\"item.subLabel | translate | euiTruncate: 200\"></div>\n            </a>\n        </ng-template>\n\n        <ng-template [ngIf]=\"!item.metadata?.url && !item.metadata?.urlExternal\">\n            <div\n                class=\"eui-notification-item-content-middle__label\"\n                [ngClass]=\"{ 'eui-u-f-m-bold': !item.metadata || (item.metadata && !item.metadata.read) }\">\n                {{ item.label | translate | euiTruncate: 200 }}\n            </div>\n            <div\n                *ngIf=\"item.subLabel\"\n                class=\"eui-notification-item-content-middle__sub-label\"\n                [innerHTML]=\"item.subLabel | translate | euiTruncate: 200\"></div>\n        </ng-template>\n    </span>\n    <div class=\"eui-notification-item-content-bottom\">\n        <a *ngIf=\"isShowMarkAsRead && item.metadata && !item.metadata.read\"\n            href=\"javascript:void(0)\"\n            class=\"eui-u-text-link\"\n            (click)=\"onItemMarkAsRead($event)\">\n            {{ markAsReadLabel ? markAsReadLabel : ('eui.NOTIFICATIONMARKASREAD' | translate) }}\n        </a>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$2.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: i4$3.EuiTruncatePipe, name: "euiTruncate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0", type: EuiNotificationItemComponent, selector: "eui-notification-item", inputs: { markAsReadLabel: "markAsReadLabel", item: "item", dateFormat: "dateFormat", isShowMarkAsRead: ["isShowMarkAsRead", "isShowMarkAsRead", booleanAttribute] }, outputs: { itemClick: "itemClick", itemMarkAsRead: "itemMarkAsRead" }, host: { properties: { "class": "this.string" } }, ngImport: i0, template: "<div\n    class=\"eui-notification-item-content\"\n    (click)=\"onItemClick()\"\n    [ngClass]=\"{ 'eui-u-c-bg-white': item.metadata?.read || !item.metadata }\">\n    <div class=\"eui-notification-item-content-top eui-u-f-s\">\n        <div *ngIf=\"item.metadata?.date\" class=\"eui-notification-item-content-top__date\">\n            <span class=\"eui-notification-item-content-top__date-icon eui-u-mr-s\">\n                <eui-icon-svg icon=\"notifications:sharp\" size=\"m\" [fillColor]=\"iconColor\"></eui-icon-svg>\n                <span\n                    *ngIf=\"item.metadata?.new\"\n                    class=\"eui-notification-item-content-top__date-dot eui-u-c-danger-light eui-u-f-s eui-icon eui-icon-circle\"></span>\n            </span>\n            <span>{{ item.metadata?.date | date: dateFormat }}</span>\n        </div>\n        <div *ngIf=\"item.metadata?.important\" class=\"eui-u-f-m-bold\">\n            <eui-icon-svg icon=\"alert:sharp\" fillColor=\"danger\" class=\"eui-u-ml-xs\"></eui-icon-svg>\n        </div>\n    </div>\n    <span class=\"eui-notification-item-content-middle eui-u-cursor-pointer\">\n        <ng-template [ngIf]=\"item.metadata?.url\">\n            <a class=\"eui-u-text-link\" href=\"{{ item.metadata.url }}\">\n                <div\n                    class=\"eui-notification-item-content-middle__label\"\n                    [ngClass]=\"{ 'eui-u-f-m-bold': !item.metadata || (item.metadata && !item.metadata.read) }\">\n                    {{ item.label | translate | euiTruncate: 200 }}\n                </div>\n                <div\n                    *ngIf=\"item.subLabel\"\n                    class=\"eui-notification-item-content-middle__sub-label\"\n                    [innerHTML]=\"item.subLabel | translate | euiTruncate: 200\"></div>\n            </a>\n        </ng-template>\n\n        <ng-template [ngIf]=\"item.metadata?.urlExternal\">\n            <a class=\"eui-u-text-link-external\"\n                href=\"{{ item.metadata.urlExternal }}\"\n                [target]=\"!item.metadata.urlExternalTarget ? '_blank' : item.metadata.urlExternalTarget\">\n                <div\n                    class=\"eui-notification-item-content-middle__label\"\n                    [ngClass]=\"{ 'eui-u-f-m-bold': !item.metadata || (item.metadata && !item.metadata.read) }\">\n                    {{ item.label | translate | euiTruncate: 200 }}\n                </div>\n                <div\n                    *ngIf=\"item.subLabel\"\n                    class=\"eui-notification-item-content-middle__sub-label\"\n                    [innerHTML]=\"item.subLabel | translate | euiTruncate: 200\"></div>\n            </a>\n        </ng-template>\n\n        <ng-template [ngIf]=\"!item.metadata?.url && !item.metadata?.urlExternal\">\n            <div\n                class=\"eui-notification-item-content-middle__label\"\n                [ngClass]=\"{ 'eui-u-f-m-bold': !item.metadata || (item.metadata && !item.metadata.read) }\">\n                {{ item.label | translate | euiTruncate: 200 }}\n            </div>\n            <div\n                *ngIf=\"item.subLabel\"\n                class=\"eui-notification-item-content-middle__sub-label\"\n                [innerHTML]=\"item.subLabel | translate | euiTruncate: 200\"></div>\n        </ng-template>\n    </span>\n    <div class=\"eui-notification-item-content-bottom\">\n        <a *ngIf=\"isShowMarkAsRead && item.metadata && !item.metadata.read\"\n            href=\"javascript:void(0)\"\n            class=\"eui-u-text-link\"\n            (click)=\"onItemMarkAsRead($event)\">\n            {{ markAsReadLabel ? markAsReadLabel : ('eui.NOTIFICATIONMARKASREAD' | translate) }}\n        </a>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$2.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: i4$3.EuiTruncatePipe, name: "euiTruncate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiNotificationItemComponent, decorators: [{
             type: Component,
@@ -2150,7 +2144,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImpor
             }], dateFormat: [{
                 type: Input
             }], isShowMarkAsRead: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }] } });
 
 class EuiNotificationsComponent {
@@ -2199,62 +2194,14 @@ class EuiNotificationsComponent {
         this.noNotificationFoundLabel = null;
         this.nbUnreadCount = null;
         this.dateFormat = 'dd/MM/YYYY';
-        this._noNotificationFoundLink = false;
-        this._isShowMarkAsRead = true;
-        this._isShowViewAllAction = true;
-        this._isHidePanelOnViewAllAction = true;
-        this._customUnreadCount = false;
-        this._isShowMarkAllAsReadButton = true;
-        this._isShowSettingsButton = true;
-        this._isShowRefreshButton = true;
-    }
-    get noNotificationFoundLink() {
-        return this._noNotificationFoundLink;
-    }
-    set noNotificationFoundLink(value) {
-        this._noNotificationFoundLink = coerceBooleanProperty(value);
-    }
-    get isShowMarkAsRead() {
-        return this._isShowMarkAsRead;
-    }
-    set isShowMarkAsRead(value) {
-        this._isShowMarkAsRead = coerceBooleanProperty(value);
-    }
-    get isShowViewAllAction() {
-        return this._isShowViewAllAction;
-    }
-    set isShowViewAllAction(value) {
-        this._isShowViewAllAction = coerceBooleanProperty(value);
-    }
-    get isHidePanelOnViewAllAction() {
-        return this._isHidePanelOnViewAllAction;
-    }
-    set isHidePanelOnViewAllAction(value) {
-        this._isHidePanelOnViewAllAction = coerceBooleanProperty(value);
-    }
-    get customUnreadCount() {
-        return this._customUnreadCount;
-    }
-    set customUnreadCount(value) {
-        this._customUnreadCount = coerceBooleanProperty(value);
-    }
-    get isShowMarkAllAsReadButton() {
-        return this._isShowMarkAllAsReadButton;
-    }
-    set isShowMarkAllAsReadButton(value) {
-        this._isShowMarkAllAsReadButton = coerceBooleanProperty(value);
-    }
-    get isShowSettingsButton() {
-        return this._isShowSettingsButton;
-    }
-    set isShowSettingsButton(value) {
-        this._isShowSettingsButton = coerceBooleanProperty(value);
-    }
-    get isShowRefreshButton() {
-        return this._isShowRefreshButton;
-    }
-    set isShowRefreshButton(value) {
-        this._isShowRefreshButton = coerceBooleanProperty(value);
+        this.noNotificationFoundLink = false;
+        this.isShowMarkAsRead = true;
+        this.isShowViewAllAction = true;
+        this.isHidePanelOnViewAllAction = true;
+        this.customUnreadCount = false;
+        this.isShowMarkAllAsReadButton = true;
+        this.isShowSettingsButton = true;
+        this.isShowRefreshButton = true;
     }
     onHide() {
         this.isOverlayActive = false;
@@ -2326,7 +2273,7 @@ class EuiNotificationsComponent {
         return unreadNotifications.length;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiNotificationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0", 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-button\n    class=\"eui-notifications__trigger\"\n    icon=\"notifications:outline\"\n    fillColor=\"white\"\n    (click)=\"onClicked($event)\"\n    (keydown.enter)=\"onClicked($event)\"\n    (keydown.esc)=\"onHide()\">\n    <eui-badge *ngIf=\"count\" euiDanger [maxCharCount]=\"2\">{{ count }}</eui-badge>\n</eui-icon-button>\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 *ngIf=\"count\">{{ count }}</eui-badge>\n                <eui-badge *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=\"checkmark-done:sharp\"></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=\"settings:sharp\"></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=\"refresh:sharp\"></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            <a (click)=\"onViewAllClick($event)\" class=\"eui-u-text-link\">\n                <strong>{{ viewAllNotificationsLabel ? viewAllNotificationsLabel : ('eui.VIEWALLNOTIFICATIONS' | translate) }}</strong>\n            </a>\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                <a (click)=\"onNoNotificationFoundClick()\" class=\"eui-u-text-link\">\n                    {{ noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND' | translate) }}\n                </a>\n            </div>\n        </ng-template>\n    </eui-overlay-footer>\n</eui-overlay>\n", styles: [".eui-overlay-header{background-color:var(--eui-c-neutral-bg-light);border-bottom:1px solid var(--eui-c-neutral-lightest)}.eui-notifications-items{margin:0;padding:0}.eui-notifications__trigger .eui-icon-svg svg{position:relative;top:var(--eui-s-2xs);transform:scale(1.1)}.eui-notifications__header{align-items:center;border-bottom:1px solid var(--eui-c-neutral-bg-light);color:var(--eui-c-text);cursor:default;display:flex;padding:var(--eui-s-xs) var(--eui-s-m)}.eui-notifications__header-title{display:flex}.eui-notifications__header-title-label{font:var(--eui-f-l-bold)}.eui-notifications__header-title-subLabel{margin-top:var(--eui-s-xs);font:var(--eui-f-m)}.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-c-info-bg);border-bottom:1px solid var(--eui-c-neutral-lightest);display:flex;flex-direction:column;min-height:var(--eui-s-4xl);padding:var(--eui-s-s) var(--eui-s-m);cursor:pointer}.eui-notification-item-content:hover{background-color:var(--eui-c-neutral-bg-light)!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{align-items:center;display:flex;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-s-2xs) 0}.eui-notification-item-content-middle__sub-label{margin-top:var(--eui-s-2xs)}.eui-notification-item-content-bottom{display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$6.EuiOverlayHeaderComponent, selector: "eui-overlay-header" }, { kind: "component", type: i2$6.EuiOverlayBodyComponent, selector: "eui-overlay-body" }, { kind: "component", type: i2$6.EuiOverlayFooterComponent, selector: "eui-overlay-footer" }, { kind: "component", type: i2$6.EuiOverlayComponent, selector: "eui-overlay", inputs: ["isActive", "euiHighlighted", "hasClosedOnClickOutside", "position", "width", "fixedWidth"], outputs: ["activeState"] }, { kind: "component", type: i2$1.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "euiIconButton", "euiLineWrap", "isChecked", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i4$4.EuiBadgeComponent, selector: "div[euiBadge], span[euiBadge], eui-badge", inputs: ["e2eAttr", "aria-label", "maxCharCount", "charReplacement", "euiIconBadge", "euiDottedBadge"] }, { kind: "component", type: i2$2.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "component", type: i4$1.EuiIconButtonComponent, selector: "eui-icon-button", inputs: ["icon", "fillColor", "size", "ariaLabel", "tabindex", "hasNoPadding", "hasFocusHoverColor", "hasFocusHoverBg", "euiRounded", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: EuiNotificationItemComponent, selector: "eui-notification-item", inputs: ["markAsReadLabel", "item", "dateFormat", "isShowMarkAsRead"], outputs: ["itemClick", "itemMarkAsRead"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0", 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", "noNotificationFoundLink", booleanAttribute], isShowMarkAsRead: ["isShowMarkAsRead", "isShowMarkAsRead", booleanAttribute], isShowViewAllAction: ["isShowViewAllAction", "isShowViewAllAction", booleanAttribute], isHidePanelOnViewAllAction: ["isHidePanelOnViewAllAction", "isHidePanelOnViewAllAction", booleanAttribute], customUnreadCount: ["customUnreadCount", "customUnreadCount", booleanAttribute], isShowMarkAllAsReadButton: ["isShowMarkAllAsReadButton", "isShowMarkAllAsReadButton", booleanAttribute], isShowSettingsButton: ["isShowSettingsButton", "isShowSettingsButton", booleanAttribute], isShowRefreshButton: ["isShowRefreshButton", "isShowRefreshButton", booleanAttribute] }, 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-button\n    class=\"eui-notifications__trigger\"\n    icon=\"notifications:outline\"\n    fillColor=\"white\"\n    (click)=\"onClicked($event)\"\n    (keydown.enter)=\"onClicked($event)\"\n    (keydown.esc)=\"onHide()\">\n    <eui-badge *ngIf=\"count\" euiDanger [maxCharCount]=\"2\">{{ count }}</eui-badge>\n</eui-icon-button>\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 *ngIf=\"count\">{{ count }}</eui-badge>\n                <eui-badge *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=\"checkmark-done:sharp\"></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=\"settings:sharp\"></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=\"refresh:sharp\"></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            <a (click)=\"onViewAllClick($event)\" class=\"eui-u-text-link\">\n                <strong>{{ viewAllNotificationsLabel ? viewAllNotificationsLabel : ('eui.VIEWALLNOTIFICATIONS' | translate) }}</strong>\n            </a>\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                <a (click)=\"onNoNotificationFoundClick()\" class=\"eui-u-text-link\">\n                    {{ noNotificationFoundLabel ? noNotificationFoundLabel : ('eui.NONOTIFICATIONFOUND' | translate) }}\n                </a>\n            </div>\n        </ng-template>\n    </eui-overlay-footer>\n</eui-overlay>\n", styles: [".eui-overlay-header{background-color:var(--eui-c-neutral-bg-light);border-bottom:1px solid var(--eui-c-neutral-lightest)}.eui-notifications-items{margin:0;padding:0}.eui-notifications__trigger .eui-icon-svg svg{position:relative;top:var(--eui-s-2xs);transform:scale(1.1)}.eui-notifications__header{align-items:center;border-bottom:1px solid var(--eui-c-neutral-bg-light);color:var(--eui-c-text);cursor:default;display:flex;padding:var(--eui-s-xs) var(--eui-s-m)}.eui-notifications__header-title{display:flex}.eui-notifications__header-title-label{font:var(--eui-f-l-bold)}.eui-notifications__header-title-subLabel{margin-top:var(--eui-s-xs);font:var(--eui-f-m)}.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-c-info-bg);border-bottom:1px solid var(--eui-c-neutral-lightest);display:flex;flex-direction:column;min-height:var(--eui-s-4xl);padding:var(--eui-s-s) var(--eui-s-m);cursor:pointer}.eui-notification-item-content:hover{background-color:var(--eui-c-neutral-bg-light)!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{align-items:center;display:flex;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-s-2xs) 0}.eui-notification-item-content-middle__sub-label{margin-top:var(--eui-s-2xs)}.eui-notification-item-content-bottom{display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$6.EuiOverlayHeaderComponent, selector: "eui-overlay-header" }, { kind: "component", type: i2$6.EuiOverlayBodyComponent, selector: "eui-overlay-body" }, { kind: "component", type: i2$6.EuiOverlayFooterComponent, selector: "eui-overlay-footer" }, { kind: "component", type: i2$6.EuiOverlayComponent, selector: "eui-overlay", inputs: ["isActive", "euiHighlighted", "hasClosedOnClickOutside", "position", "width", "fixedWidth"], outputs: ["activeState"] }, { kind: "component", type: i2$1.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "euiIconButton", "euiLineWrap", "isChecked", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: i4$4.EuiBadgeComponent, selector: "div[euiBadge], span[euiBadge], eui-badge", inputs: ["e2eAttr", "aria-label", "maxCharCount", "charReplacement", "euiIconBadge", "euiDottedBadge"] }, { kind: "component", type: i2$2.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "component", type: i4$1.EuiIconButtonComponent, selector: "eui-icon-button", inputs: ["icon", "fillColor", "size", "ariaLabel", "tabindex", "hasNoPadding", "hasFocusHoverColor", "hasFocusHoverBg", "euiRounded", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: EuiNotificationItemComponent, selector: "eui-notification-item", inputs: ["markAsReadLabel", "item", "dateFormat", "isShowMarkAsRead"], outputs: ["itemClick", "itemMarkAsRead"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiNotificationsComponent, decorators: [{
             type: Component,
@@ -2379,21 +2326,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImpor
             }], dateFormat: [{
                 type: Input
             }], noNotificationFoundLink: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], isShowMarkAsRead: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], isShowViewAllAction: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], isHidePanelOnViewAllAction: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], customUnreadCount: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], isShowMarkAllAsReadButton: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], isShowSettingsButton: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], isShowRefreshButton: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], onHide: [{
                 type: HostListener,
                 args: ['body:click']
@@ -2426,13 +2381,7 @@ class EuiNotificationItemV2Component {
         this.markAsReadLabel = null;
         this.dateFormat = 'dd/MM/YYYY';
         this.tooltipSize = 'auto';
-        this._isShowMarkAsRead = true;
-    }
-    get isShowMarkAsRead() {
-        return this._isShowMarkAsRead;
-    }
-    set isShowMarkAsRead(value) {
-        this._isShowMarkAsRead = coerceBooleanProperty(value);
+        this.isShowMarkAsRead = true;
     }
     get iconColor() {
         return this.item.metadata?.read ? 'neutral-lightest' : 'neutral-light';
@@ -2448,7 +2397,7 @@ class EuiNotificationItemV2Component {
         consumeEvent(event);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiNotificationItemV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0", type: EuiNotificationItemV2Component, selector: "eui-notification-item-v2", inputs: { markAsReadLabel: "markAsReadLabel", item: "item", dateFormat: "dateFormat", isShowMarkAsRead: "isShowMarkAsRead" }, outputs: { itemClick: "itemClick", itemMarkAsRead: "itemMarkAsRead" }, host: { properties: { "class": "this.string" } }, ngImport: i0, template: "<div\n    class=\"eui-notification-item-content\"\n    (click)=\"onItemClick()\"\n    [ngClass]=\"{ 'eui-u-c-bg-white': item.metadata?.read || !item.metadata }\">\n    <div class=\"eui-notification-item-content-top eui-u-f-s\">\n        <div *ngIf=\"item.metadata?.date\" class=\"eui-notification-item-content-top__date\">\n            <span class=\"eui-notification-item-content-top__date-icon eui-u-mr-s\">\n                <eui-icon-svg icon=\"notifications:sharp\" size=\"m\" [fillColor]=\"iconColor\"></eui-icon-svg>\n                <span\n                    *ngIf=\"item.metadata?.new\"\n                    class=\"eui-notification-item-content-top__date-dot eui-u-c-danger-light eui-u-f-s eui-icon eui-icon-circle\"></span>\n            </span>\n            <span>{{ item.metadata?.date | date: dateFormat }}</span>\n        </div>\n        <div *ngIf=\"item.metadata?.important\" class=\"eui-u-f-m-bold\">\n            <eui-icon-svg icon=\"alert:sharp\" fillColor=\"danger-100\" class=\"eui-u-ml-xs\"></eui-icon-svg>\n        </div>\n    </div>\n    <span class=\"eui-notification-item-content-middle eui-u-cursor-pointer\">\n        <ng-template [ngIf]=\"item.metadata?.url\">\n            <a class=\"eui-u-text-link\" href=\"{{ item.metadata.url }}\" tabIndex=\"0\">\n                <div\n                    class=\"eui-notification-item-content-middle__label\"\n                    [ngClass]=\"{ 'eui-u-f-m-bold': !item.metadata || (item.metadata && !item.metadata.read) }\">\n                    {{ item.label | translate | euiTruncate: 200 }}\n                </div>\n                <div\n                    *ngIf=\"item.subLabel\"\n                    class=\"eui-notification-item-content-middle__sub-label\"\n                    [innerHTML]=\"item.subLabel | translate | euiTruncate: 200\"></div>\n            </a>\n        </ng-template>\n\n        <ng-template [ngIf]=\"item.metadata?.urlExternal\">\n            <a class=\"eui-u-text-link-external\"\n                href=\"{{ item.metadata.urlExternal }}\"\n                [target]=\"!item.metadata.urlExternalTarget ? '_blank' : item.metadata.urlExternalTarget\" tabIndex=\"0\">\n                <div\n                    class=\"eui-notification-item-content-middle__label\"\n                    [ngClass]=\"{ 'eui-u-f-m-bold': !item.metadata || (item.metadata && !item.metadata.read) }\">\n                    {{ item.label | translate | euiTruncate: 200 }}\n                </div>\n                <div\n                    *ngIf=\"item.subLabel\"\n                    class=\"eui-notification-item-content-middle__sub-label\"\n                    [innerHTML]=\"item.subLabel | translate | euiTruncate: 200\"></div>\n            </a>\n        </ng-template>\n\n        <ng-template [ngIf]=\"!item.metadata?.url && !item.metadata?.urlExternal\">\n            <div\n                class=\"eui-notification-item-content-middle__label\"\n                [ngClass]=\"{ 'eui-u-f-m-bold': !item.metadata || (item.metadata && !item.metadata.read) }\">\n                {{ item.label | translate | euiTruncate: 200 }}\n            </div>\n            <div\n                *ngIf=\"item.subLabel\"\n                class=\"eui-notification-item-content-middle__sub-label\"\n                [innerHTML]=\"item.subLabel | translate | euiTruncate: 200\"></div>\n        </ng-template>\n    </span>\n    <div class=\"eui-notification-item-content-bottom\">\n        <a\n            class=\"eui-u-text-link\"\n            *ngIf=\"isShowMarkAsRead && item.metadata && !item.metadata.read\"\n            href=\"javascript:void(0)\"\n            (click)=\"onItemMarkAsRead($event)\" tabIndex=\"0\">\n            {{ markAsReadLabel ? markAsReadLabel : ('eui.NOTIFICATIONMARKASREAD' | translate) }}\n        </a>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$2.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: i4$3.EuiTruncatePipe, name: "euiTruncate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0", type: EuiNotificationItemV2Component, selector: "eui-notification-item-v2", inputs: { markAsReadLabel: "markAsReadLabel", item: "item", dateFormat: "dateFormat", isShowMarkAsRead: ["isShowMarkAsRead", "isShowMarkAsRead", booleanAttribute] }, outputs: { itemClick: "itemClick", itemMarkAsRead: "itemMarkAsRead" }, host: { properties: { "class": "this.string" } }, ngImport: i0, template: "<div\n    class=\"eui-notification-item-content\"\n    (click)=\"onItemClick()\"\n    [ngClass]=\"{ 'eui-u-c-bg-white': item.metadata?.read || !item.metadata }\">\n    <div class=\"eui-notification-item-content-top eui-u-f-s\">\n        <div *ngIf=\"item.metadata?.date\" class=\"eui-notification-item-content-top__date\">\n            <span class=\"eui-notification-item-content-top__date-icon eui-u-mr-s\">\n                <eui-icon-svg icon=\"notifications:sharp\" size=\"m\" [fillColor]=\"iconColor\"></eui-icon-svg>\n                <span\n                    *ngIf=\"item.metadata?.new\"\n                    class=\"eui-notification-item-content-top__date-dot eui-u-c-danger-light eui-u-f-s eui-icon eui-icon-circle\"></span>\n            </span>\n            <span>{{ item.metadata?.date | date: dateFormat }}</span>\n        </div>\n        <div *ngIf=\"item.metadata?.important\" class=\"eui-u-f-m-bold\">\n            <eui-icon-svg icon=\"alert:sharp\" fillColor=\"danger-100\" class=\"eui-u-ml-xs\"></eui-icon-svg>\n        </div>\n    </div>\n    <span class=\"eui-notification-item-content-middle eui-u-cursor-pointer\">\n        <ng-template [ngIf]=\"item.metadata?.url\">\n            <a class=\"eui-u-text-link\" href=\"{{ item.metadata.url }}\" tabIndex=\"0\">\n                <div\n                    class=\"eui-notification-item-content-middle__label\"\n                    [ngClass]=\"{ 'eui-u-f-m-bold': !item.metadata || (item.metadata && !item.metadata.read) }\">\n                    {{ item.label | translate | euiTruncate: 200 }}\n                </div>\n                <div\n                    *ngIf=\"item.subLabel\"\n                    class=\"eui-notification-item-content-middle__sub-label\"\n                    [innerHTML]=\"item.subLabel | translate | euiTruncate: 200\"></div>\n            </a>\n        </ng-template>\n\n        <ng-template [ngIf]=\"item.metadata?.urlExternal\">\n            <a class=\"eui-u-text-link-external\"\n                href=\"{{ item.metadata.urlExternal }}\"\n                [target]=\"!item.metadata.urlExternalTarget ? '_blank' : item.metadata.urlExternalTarget\" tabIndex=\"0\">\n                <div\n                    class=\"eui-notification-item-content-middle__label\"\n                    [ngClass]=\"{ 'eui-u-f-m-bold': !item.metadata || (item.metadata && !item.metadata.read) }\">\n                    {{ item.label | translate | euiTruncate: 200 }}\n                </div>\n                <div\n                    *ngIf=\"item.subLabel\"\n                    class=\"eui-notification-item-content-middle__sub-label\"\n                    [innerHTML]=\"item.subLabel | translate | euiTruncate: 200\"></div>\n            </a>\n        </ng-template>\n\n        <ng-template [ngIf]=\"!item.metadata?.url && !item.metadata?.urlExternal\">\n            <div\n                class=\"eui-notification-item-content-middle__label\"\n                [ngClass]=\"{ 'eui-u-f-m-bold': !item.metadata || (item.metadata && !item.metadata.read) }\">\n                {{ item.label | translate | euiTruncate: 200 }}\n            </div>\n            <div\n                *ngIf=\"item.subLabel\"\n                class=\"eui-notification-item-content-middle__sub-label\"\n                [innerHTML]=\"item.subLabel | translate | euiTruncate: 200\"></div>\n        </ng-template>\n    </span>\n    <div class=\"eui-notification-item-content-bottom\">\n        <a\n            class=\"eui-u-text-link\"\n            *ngIf=\"isShowMarkAsRead && item.metadata && !item.metadata.read\"\n            href=\"javascript:void(0)\"\n            (click)=\"onItemMarkAsRead($event)\" tabIndex=\"0\">\n            {{ markAsReadLabel ? markAsReadLabel : ('eui.NOTIFICATIONMARKASREAD' | translate) }}\n        </a>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$2.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: i4$3.EuiTruncatePipe, name: "euiTruncate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiNotificationItemV2Component, decorators: [{
             type: Component,
@@ -2467,7 +2416,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImpor
             }], dateFormat: [{
                 type: Input
             }], isShowMarkAsRead: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }] } });
 
 class EuiNotificationsV2Component {
@@ -2504,65 +2454,17 @@ class EuiNotificationsV2Component {
         this.headerUnreadCountLabel = null;
         this.noNotificationFoundLabel = null;
         this.dateFormat = 'dd/MM/YYYY';
-        this._noNotificationFoundLink = false;
-        this._isShowMarkAsRead = true;
-        this._isShowViewAllAction = true;
-        this._isHidePanelOnViewAllAction = true;
-        this._customUnreadCount = false;
-        this._isShowMarkAllAsReadButton = true;
-        this._isShowSettingsButton = true;
-        this._isShowRefreshButton = true;
-    }
-    get noNotificationFoundLink() {
-        return this._noNotificationFoundLink;
-    }
-    set noNotificationFoundLink(value) {
-        this._noNotificationFoundLink = coerceBooleanProperty(value);
-    }
-    get isShowMarkAsRead() {
-        return this._isShowMarkAsRead;
-    }
-    set isShowMarkAsRead(value) {
-        this._isShowMarkAsRead = coerceBooleanProperty(value);
-    }
-    get isShowViewAllAction() {
-        return this._isShowViewAllAction;
-    }
-    set isShowViewAllAction(value) {
-        this._isShowViewAllAction = coerceBooleanProperty(value);
-    }
-    get isHidePanelOnViewAllAction() {
-        return this._isHidePanelOnViewAllAction;
-    }
-    set isHidePanelOnViewAllAction(value) {
-        this._isHidePanelOnViewAllAction = coerceBooleanProperty(value);
-    }
-    /**
-     * @deprecated customUnreadCount is DEPRECATED, it is not used in the view. To be removed in eUI 18.
-     */
-    get customUnreadCount() {
-        return this._customUnreadCount;
-    }
-    set customUnreadCount(value) {
-        this._customUnreadCount = coerceBooleanProperty(value);
-    }
-    get isShowMarkAllAsReadButton() {
-        return this._isShowMarkAllAsReadButton;
-    }
-    set isShowMarkAllAsReadButton(value) {
-        this._isShowMarkAllAsReadButton = coerceBooleanProperty(value);
-    }
-    get isShowSettingsButton() {
-        return this._isShowSettingsButton;
-    }
-    set isShowSettingsButton(value) {
-        this._isShowSettingsButton = coerceBooleanProperty(value);
-    }
-    get isShowRefreshButton() {
-        return this._isShowRefreshButton;
-    }
-    set isShowRefreshButton(value) {
-        this._isShowRefreshButton = coerceBooleanProperty(value);
+        this.noNotificationFoundLink = false;
+        this.isShowMarkAsRead = true;
+        this.isShowViewAllAction = true;
+        this.isHidePanelOnViewAllAction = true;
+        /**
+         * @deprecated customUnreadCount is DEPRECATED, it is not used in the view. To be removed in eUI 18.
+         */
+        this.customUnreadCount = false;
+        this.isShowMarkAllAsReadButton = true;
+        this.isShowSettingsButton = true;
+        this.isShowRefreshButton = true;
     }
     get isShowUnreadSinceLastCheckCount() {
         return this.unreadSinceLastCheckCount && this.unreadSinceLastCheckCount > 0;
@@ -2570,8 +2472,6 @@ class EuiNotificationsV2Component {
     onHide() {
         this.isOverlayActive = false;
     }
-    // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     onClicked(event) {
         this.notificationsClick.emit();
         consumeEvent(event);
@@ -2581,8 +2481,6 @@ class EuiNotificationsV2Component {
         this.refreshClick.emit();
         consumeEvent(event);
     }
-    // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     onItemClick(link) {
         this.itemClick.emit(link);
         consumeEvent(event);
@@ -2596,8 +2494,6 @@ class EuiNotificationsV2Component {
     onNoNotificationFoundClick() {
         this.noNotificationFoundClick.emit();
     }
-    // TODO: find the correct type or turn into a generic, https://www.typescriptlang.org/docs/handbook/2/generics.html
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     onItemMarkAsRead(link) {
         this.itemMarkAsReadClick.emit(link);
     }
@@ -2611,7 +2507,7 @@ class EuiNotificationsV2Component {
         return item.id;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiNotificationsV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0", 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", 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", markAllAsReadClick: "markAllAsReadClick", noNotificationFoundClick: "noNotificationFoundClick", itemClick: "itemClick", itemMarkAsReadClick: "itemMarkAsReadClick" }, host: { properties: { "class": "this.string" } }, ngImport: i0, template: "<eui-icon-button\n    class=\"eui-notifications-v2__trigger\"\n    icon=\"notifications:outline\"\n    fillColor=\"white\"\n    (click)=\"onClicked($event)\"\n    (keydown.enter)=\"onClicked($event)\"\n    (keydown.esc)=\"onHide()\">\n    <eui-badge *ngIf=\"isShowUnreadSinceLastCheckCount\" euiSizeM euiDanger [maxCharCount]=\"2\">{{ unreadSinceLastCheckCount }}</eui-badge>\n</eui-icon-button>\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                        <eui-icon-svg icon=\"chevron-forward:sharp\" size=\"2xs\"></eui-icon-svg>\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-c-white)}.eui-notifications-items{margin:0;padding:0}.eui-notifications-v2__trigger .eui-icon-svg svg{transform:scale(1.1)}.eui-notifications-v2__header{border-bottom:1px solid var(--eui-c-neutral-bg-light);color:var(--eui-c-text);cursor:default;flex-direction:column;display:flex;width:100%}.eui-notifications-v2__header-title{display:flex;padding:var(--eui-s-xs) var(--eui-s-m)}.eui-notifications-v2__header-title-label{font:var(--eui-f-l-bold)}.eui-notifications-v2__header-title-subLabel{margin-top:var(--eui-s-xs);font:var(--eui-f-s)}.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-c-neutral-bg-light);padding:var(--eui-s-xs) var(--eui-s-m)}.eui-notification-item{display:flex;flex-direction:column;overflow-y:auto;margin:0}.eui-notification-item-content{background-color:var(--eui-c-info-bg);border-bottom:1px solid var(--eui-c-neutral-lightest);display:flex;flex-direction:column;min-height:var(--eui-s-4xl);padding:var(--eui-s-s) var(--eui-s-m);cursor:pointer}.eui-notification-item-content:hover{background-color:var(--eui-c-neutral-bg-light)!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{align-items:center;display:flex;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-s-2xs) 0}.eui-notification-item-content-middle__sub-label{margin-top:var(--eui-s-2xs)}.eui-notification-item-content-bottom{display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$6.EuiOverlayHeaderComponent, selector: "eui-overlay-header" }, { kind: "component", type: i2$6.EuiOverlayBodyComponent, selector: "eui-overlay-body" }, { kind: "component", type: i2$6.EuiOverlayFooterComponent, selector: "eui-overlay-footer" }, { kind: "component", type: i2$6.EuiOverlayComponent, selector: "eui-overlay", inputs: ["isActive", "euiHighlighted", "hasClosedOnClickOutside", "position", "width", "fixedWidth"], outputs: ["activeState"] }, { kind: "component", type: i4$4.EuiBadgeComponent, selector: "div[euiBadge], span[euiBadge], eui-badge", inputs: ["e2eAttr", "aria-label", "maxCharCount", "charReplacement", "euiIconBadge", "euiDottedBadge"] }, { kind: "component", type: i2$2.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "component", type: i4$1.EuiIconButtonComponent, selector: "eui-icon-button", inputs: ["icon", "fillColor", "size", "ariaLabel", "tabindex", "hasNoPadding", "hasFocusHoverColor", "hasFocusHoverBg", "euiRounded", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: EuiNotificationItemV2Component, selector: "eui-notification-item-v2", inputs: ["markAsReadLabel", "item", "dateFormat", "isShowMarkAsRead"], outputs: ["itemClick", "itemMarkAsRead"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0", 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", dateFormat: "dateFormat", noNotificationFoundLink: ["noNotificationFoundLink", "noNotificationFoundLink", booleanAttribute], isShowMarkAsRead: ["isShowMarkAsRead", "isShowMarkAsRead", booleanAttribute], isShowViewAllAction: ["isShowViewAllAction", "isShowViewAllAction", booleanAttribute], isHidePanelOnViewAllAction: ["isHidePanelOnViewAllAction", "isHidePanelOnViewAllAction", booleanAttribute], customUnreadCount: ["customUnreadCount", "customUnreadCount", booleanAttribute], isShowMarkAllAsReadButton: ["isShowMarkAllAsReadButton", "isShowMarkAllAsReadButton", booleanAttribute], isShowSettingsButton: ["isShowSettingsButton", "isShowSettingsButton", booleanAttribute], isShowRefreshButton: ["isShowRefreshButton", "isShowRefreshButton", booleanAttribute] }, outputs: { refreshClick: "refreshClick", notificationsClick: "notificationsClick", viewAllClick: "viewAllClick", markAllAsReadClick: "markAllAsReadClick", noNotificationFoundClick: "noNotificationFoundClick", itemClick: "itemClick", itemMarkAsReadClick: "itemMarkAsReadClick" }, host: { properties: { "class": "this.string" } }, ngImport: i0, template: "<eui-icon-button\n    class=\"eui-notifications-v2__trigger\"\n    icon=\"notifications:outline\"\n    fillColor=\"white\"\n    (click)=\"onClicked($event)\"\n    (keydown.enter)=\"onClicked($event)\"\n    (keydown.esc)=\"onHide()\">\n    <eui-badge *ngIf=\"isShowUnreadSinceLastCheckCount\" euiSizeM euiDanger [maxCharCount]=\"2\">{{ unreadSinceLastCheckCount }}</eui-badge>\n</eui-icon-button>\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                        <eui-icon-svg icon=\"chevron-forward:sharp\" size=\"2xs\"></eui-icon-svg>\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-c-white)}.eui-notifications-items{margin:0;padding:0}.eui-notifications-v2__trigger .eui-icon-svg svg{transform:scale(1.1)}.eui-notifications-v2__header{border-bottom:1px solid var(--eui-c-neutral-bg-light);color:var(--eui-c-text);cursor:default;flex-direction:column;display:flex;width:100%}.eui-notifications-v2__header-title{display:flex;padding:var(--eui-s-xs) var(--eui-s-m)}.eui-notifications-v2__header-title-label{font:var(--eui-f-l-bold)}.eui-notifications-v2__header-title-subLabel{margin-top:var(--eui-s-xs);font:var(--eui-f-s)}.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-c-neutral-bg-light);padding:var(--eui-s-xs) var(--eui-s-m)}.eui-notification-item{display:flex;flex-direction:column;overflow-y:auto;margin:0}.eui-notification-item-content{background-color:var(--eui-c-info-bg);border-bottom:1px solid var(--eui-c-neutral-lightest);display:flex;flex-direction:column;min-height:var(--eui-s-4xl);padding:var(--eui-s-s) var(--eui-s-m);cursor:pointer}.eui-notification-item-content:hover{background-color:var(--eui-c-neutral-bg-light)!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{align-items:center;display:flex;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-s-2xs) 0}.eui-notification-item-content-middle__sub-label{margin-top:var(--eui-s-2xs)}.eui-notification-item-content-bottom{display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$6.EuiOverlayHeaderComponent, selector: "eui-overlay-header" }, { kind: "component", type: i2$6.EuiOverlayBodyComponent, selector: "eui-overlay-body" }, { kind: "component", type: i2$6.EuiOverlayFooterComponent, selector: "eui-overlay-footer" }, { kind: "component", type: i2$6.EuiOverlayComponent, selector: "eui-overlay", inputs: ["isActive", "euiHighlighted", "hasClosedOnClickOutside", "position", "width", "fixedWidth"], outputs: ["activeState"] }, { kind: "component", type: i4$4.EuiBadgeComponent, selector: "div[euiBadge], span[euiBadge], eui-badge", inputs: ["e2eAttr", "aria-label", "maxCharCount", "charReplacement", "euiIconBadge", "euiDottedBadge"] }, { kind: "component", type: i2$2.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "style", "iconUrl", "transform", "euiVariant", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }, { kind: "component", type: i4$1.EuiIconButtonComponent, selector: "eui-icon-button", inputs: ["icon", "fillColor", "size", "ariaLabel", "tabindex", "hasNoPadding", "hasFocusHoverColor", "hasFocusHoverBg", "euiRounded", "euiDisabled"], outputs: ["buttonClick"] }, { kind: "component", type: EuiNotificationItemV2Component, selector: "eui-notification-item-v2", inputs: ["markAsReadLabel", "item", "dateFormat", "isShowMarkAsRead"], outputs: ["itemClick", "itemMarkAsRead"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImport: i0, type: EuiNotificationsV2Component, decorators: [{
             type: Component,
@@ -2670,21 +2566,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0", ngImpor
             }], dateFormat: [{
                 type: Input
             }], noNotificationFoundLink: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], isShowMarkAsRead: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], isShowViewAllAction: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], isHidePanelOnViewAllAction: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], customUnreadCount: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], isShowMarkAllAsReadButton: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], isShowSettingsButton: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }], isShowRefreshButton: [{
-                type: Input
+                type: Input,
+                args: [{ transform: booleanAttribute }]
             }] } });
 
 class EuiNotificationsV2Module {