UserSettingsNotificationsView

<ui5-user-settings-notifications-view> | Since 2.27.0

The ui5-user-settings-notifications-view represents a view displayed in the ui5-user-settings-item that lists notification preferences. Individual settings are represented by ui5-user-settings-notifications-view-item elements, optionally grouped by ui5-user-settings-notifications-view-group.

When a navigable item is clicked, the view drills into a sibling secondary view of its parent ui5-user-settings-item. When an item's item-key matches a target view's id, that view is opened and keeps its own text. Otherwise the first sibling marked as secondary is opened and its text is set to the clicked item's text so the drill-in header reflects the origin.

Apps can override this behavior by preventing the item-click event.

Applications should listen to the item's switch-change event (which bubbles) to be notified when a switch is toggled.

Additional content (e.g. an information message strip) can be placed via the additionalContent slot, which is rendered above the list.

ES6 Module Import

import "@ui5/webcomponents-fiori/dist/UserSettingsNotificationsView.js";

Properties

secondary

Description	Indicates whether the view is secondary. It is relevant only if the view is used in pages slot of ui5-user-settings-item and controls the visibility of the back button.
Type	boolean
Default	false

selected

Description	Defines whether the view is selected. There can be just one selected view at a time.
Type	boolean
Default	false

text

Description	Defines the title text of the user settings view.
Type	string | undefined
Default	undefined

Slots

additionalContent

Description	Defines additional content displayed above the items list.
Type	Array<HTMLElement>

default

Description	Defines the items of the component. Can be a mix of ui5-user-settings-notifications-view-item and ui5-user-settings-notifications-view-group elements.
Type	Array<UserSettingsNotificationsViewGroup | UserSettingsNotificationsViewItem>

headerItems

Description	Defines header items rendered above the grouped items list. Each item is wrapped in a role="form" landmark — a separate Tab stop. Use this slot for product-level toggles (e.g. "Allow Notifications") that appear above the notification-type groups.
Type	Array<UserSettingsNotificationsViewItem>

Events

item-click

Description	Fired when a navigable item in the list is clicked. The event is cancelable: preventing it skips the built-in drill-in to the parent's secondary view, allowing the application to take over.
Type	CustomEvent<UserSettingsNotificationsViewItemClickEventDetail>
Parameters	item: UserSettingsNotificationsViewItem The clicked notifications view item.
Bubbles	No
Cancelable	Yes - via preventDefault()

Methods

No methods available for this component.

CSS Parts

No CSS parts available for this component.

CSS Custom States

No CSS custom states available for this component.