NotificationList
<ui5-notification-list>
| Since 2.0.0The ui5-notification-list
web component represents
a container for ui5-li-notification-group
and ui5-li-notification
.
Keyboard Handling​
Basic Navigation​
The ui5-notification-list
provides advanced keyboard handling.
When a list is focused the user can use the following keyboard
shortcuts in order to perform a navigation:
- [Up] or [Left] - Navigates up the items
- [Down] or [Right] - Navigates down the items
- [Home] - Navigates to first item
- [End] - Navigates to the last item
Fast Navigation​
This component provides a build in fast navigation group which can be used via [F6] / [Shift] + [F6] / [Ctrl] + [Alt/Option] / [Down] or [Ctrl] + [Alt/Option] + [Up].
In order to use this functionality, you need to import the following module:
import "@ui5/webcomponents-base/dist/features/F6Navigation.js"
ES6 Module Import​
`import "@ui5/webcomponents-fiori/dist/NotificationList.js";``
Basic Sample​
Properties​
noDataText​
Slots​
default​
Events​
item-click​
item-close​
item-toggle​
Methods​
No methods available for this component.
CSS Parts​
No CSS parts available for this component.
More Samples​
Notification List with Group Items​
Notifications in ShellBar​
The main usage of the Notifications is in the ShellBar. Press the "notifications" icon on the right side of the ShellBar to show the Notifications.