The ui5-li-notification is a type of list item, meant to display notifications.
The component has a rich set of various properties that allows the user to set avatar, titleText, descriptive content
and footnotes to fully describe a notification.
The user can:
display a Close button
can control whether the titleText and description should wrap or truncate
and display a ShowMore button to switch between less and more information
add custom actions by using the ui5-notification-action component
Defines if the titleText and description should wrap, they truncate by default. Note: by default the titleText and description, and a ShowMore/Less button would be displayed.
Defines the avatar, displayed in the ui5-li-notification. Note: Consider using the ui5-avatar to display icons, initials or images. Note: In order to be complaint with the UX guidlines and for best experience, we recommend using avatars with 2rem X 2rem in size (32px X 32px). In case you are using the ui5-avatar you can set its size property to XS to get the required size - <ui5-avatar size="XS"></ui5-avatar>.
Defines the content of the ui5-li-notification, usually a description of the notification. Note: Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
The sample demonstrates the usage of the ui5-notification-action.
The actions are displayed just before the close/dismiss button and can overflow if many actions are used.