File
Description
Enhanced notifications panel component (v2) displaying a dropdown list of user notifications with advanced badge indicators.
Provides comprehensive notification center with unread count, new notifications since last check, and action buttons.
Supports customizable labels, date formatting, and multiple count displays with badge indicators.
Integrates with overlay component for dropdown panel behavior and manages notification state.
Emits events for all user interactions including item clicks, refresh, and mark as read actions.
Improved version with additional features compared to EuiNotificationsComponent.
Index
Properties
|
|
|
Methods
|
|
|
Inputs
|
|
|
Outputs
|
|
|
HostBindings
|
|
|
Accessors
|
|
|
|
count
|
Type : number
|
Default value : null
|
Total count of notifications displayed in the badge.
When null, badge shows unread count instead.
Optional.
|
|
dateFormat
|
Type : string
|
Default value : 'dd/MM/yyyy'
|
Date format string for displaying notification timestamps.
Accepts any valid Angular DatePipe format pattern.
|
|
headerHideLabel
|
Type : string
|
Default value : null
|
Custom label text for hide/close button in header.
When null, uses default translation key.
Optional.
|
|
headerTitleLabel
|
Type : string
|
Default value : null
|
Custom label text for panel header title.
When null, uses default translation key.
Optional.
|
|
headerUnreadCountLabel
|
Type : string
|
Default value : null
|
Custom label text for displaying total unread count in header.
When null, uses default translation key.
Optional.
|
|
headerUnreadSinceLastCheckCountLabel
|
Type : string
|
Default value : null
|
Custom label text for displaying unread count since last check in header.
When null, uses default translation key.
Optional.
|
|
isHidePanelOnViewAllAction
|
Type : boolean
|
Default value : true
|
Automatically closes the notifications panel when "View All" is clicked.
When false, panel remains open after clicking view all.
|
|
isShowMarkAllAsReadButton
|
Type : boolean
|
Default value : true
|
Shows the "Mark All as Read" button in the panel header.
When false, hides the mark all as read functionality.
|
|
isShowMarkAsRead
|
Type : boolean
|
Default value : true
|
Shows the mark as read action button on individual notification items.
When false, hides the mark as read functionality from notification items.
|
|
isShowRefreshButton
|
Type : boolean
|
Default value : true
|
Shows the refresh button in the panel header.
When false, hides the refresh button.
|
|
isShowSettingsButton
|
Type : boolean
|
Default value : true
|
Shows the settings button in the panel header.
When false, hides the settings button.
|
|
isShowViewAllAction
|
Type : boolean
|
Default value : true
|
Shows the "View All" action button in the panel footer.
When false, hides the view all notifications button.
|
|
items
|
Type : {}
|
Default value : []
|
Array of notification items to display in the panel.
Each item should conform to UxLinkLegacy interface with id, label, and metadata properties.
|
|
markAllAsReadLabel
|
Type : string
|
Default value : null
|
Custom label text for "mark all as read" button.
When null, uses default translation key.
Optional.
|
|
markAsReadLabel
|
Type : string
|
Default value : null
|
Custom label text for "mark as read" action.
When null, uses default translation key.
Optional.
|
|
markAsUnReadLabel
|
Type : string
|
Default value : null
|
Custom label text for "mark as unread" action.
When null, uses default translation key.
Optional.
|
|
noNotificationFoundLabel
|
Type : string
|
Default value : null
|
Custom label text for empty state message when no notifications exist.
When null, uses default translation key.
Optional.
|
|
noNotificationFoundLink
|
Type : boolean
|
Default value : false
|
Makes the "no notifications found" message clickable as a link.
When true, emits noNotificationFoundClick event on click.
|
|
refreshLabel
|
Type : string
|
Default value : null
|
Custom label text for refresh button.
When null, uses default translation key.
Optional.
|
|
settingsLabel
|
Type : string
|
Default value : null
|
Custom label text for settings button.
When null, uses default translation key.
Optional.
|
|
totalLabel
|
Type : string
|
Default value : null
|
Custom label text for "total" count display.
When null, uses default translation key.
Optional.
|
|
unreadCount
|
Type : number
|
Default value : null
|
Number of unread notifications to display.
Used for badge display and header information.
Optional.
|
|
unreadLabel
|
Type : string
|
Default value : null
|
Custom label text for "unread" status indicator.
When null, uses default translation key.
Optional.
|
|
unreadSinceLastCheckCount
|
Type : number
|
Default value : null
|
Number of new unread notifications since user last checked the panel.
Displays as a secondary indicator to highlight new activity.
Optional.
|
|
viewAllNotificationsLabel
|
Type : string
|
Default value : null
|
Custom label text for "view all notifications" button.
When null, uses default translation key.
Optional.
|
Outputs
|
itemClick
|
Type : EventEmitter<UxLinkLegacy>
|
Emitted when a notification item is clicked.
Payload: UxLinkLegacy - the clicked notification item
Triggered when user clicks on any notification item in the list.
|
|
itemMarkAsReadClick
|
Type : EventEmitter<UxLinkLegacy>
|
Emitted when the mark as read button on a notification item is clicked.
Payload: UxLinkLegacy - the notification item to mark as read
Triggered when user clicks the mark as read action on an individual notification.
|
|
markAllAsReadClick
|
Type : EventEmitter<MouseEvent>
|
Emitted when the "Mark All as Read" button is clicked.
Payload: MouseEvent - the click event
Triggered when user clicks the mark all as read button in the panel header.
|
|
noNotificationFoundClick
|
Type : EventEmitter<void>
|
Emitted when the "No notifications found" link is clicked.
Payload: void
Triggered when user clicks the no notifications message (when noNotificationFoundLink is true).
|
|
notificationsClick
|
Type : EventEmitter<KeyboardEvent | MouseEvent>
|
Emitted when the notifications bell icon is clicked to toggle the panel.
Payload: KeyboardEvent | MouseEvent - the interaction event
Triggered when user clicks or uses keyboard to open/close the dropdown.
|
|
refreshClick
|
Type : EventEmitter<Event>
|
Emitted when the refresh button is clicked to reload notifications.
Payload: Event - the click event
Triggered when user clicks the refresh button in the notifications panel header.
|
|
viewAllClick
|
Type : EventEmitter<Event>
|
Emitted when the "View All" button is clicked.
Payload: Event - the click event
Triggered when user clicks the view all notifications action button.
|
HostBindings
|
class
|
Type : string
|
Default value : 'eui-notifications-v2'
|
Methods
|
onClicked
|
onClicked(event: Event)
|
Parameters :
| Name |
Type |
Optional |
| event |
Event
|
No
|
|
|
onItemClick
|
onItemClick(link: UxLinkLegacy)
|
Parameters :
| Name |
Type |
Optional |
| link |
UxLinkLegacy
|
No
|
|
|
onItemMarkAsRead
|
onItemMarkAsRead(link: UxLinkLegacy)
|
Parameters :
| Name |
Type |
Optional |
| link |
UxLinkLegacy
|
No
|
|
|
onMarkAllAsRead
|
onMarkAllAsRead(e: MouseEvent)
|
Parameters :
| Name |
Type |
Optional |
| e |
MouseEvent
|
No
|
|
|
onNoNotificationFoundClick
|
onNoNotificationFoundClick()
|
|
|
|
onRefresh
|
onRefresh(event: Event)
|
Parameters :
| Name |
Type |
Optional |
| event |
Event
|
No
|
|
|
onViewAllClick
|
onViewAllClick(event: Event)
|
Parameters :
| Name |
Type |
Optional |
| event |
Event
|
No
|
|
|
trackByFn
|
trackByFn(index: number, item: any)
|
Parameters :
| Name |
Type |
Optional |
| index |
number
|
No
|
| item |
any
|
No
|
|
|
currentDayNotifications
|
Type : []
|
Default value : []
|
|
isOverlayActive
|
Type : unknown
|
Default value : false
|
|
oldestNotifications
|
Type : []
|
Default value : []
|
|
string
|
Type : string
|
Default value : 'eui-notifications-v2'
|
Decorators :
@HostBinding('class')
|
|
today
|
Type : Date
|
Default value : new Date()
|
|
unreadNotifications
|
Type : []
|
Default value : []
|
Accessors
|
isShowUnreadSinceLastCheckCount
|
getisShowUnreadSinceLastCheckCount()
|