Represents a single navigation action within ui5-side-navigation-item.
The ui5-side-navigation-sub-item is intended to be used inside a ui5-side-navigation-item only.
ES6 Module Import​
import "@ui5/webcomponents-fiori/dist/SideNavigationSubItem.js";
Properties​
| Description | Defines the icon of the item.
The SAP-icons font provides numerous options.
See all the available icons in the Icon Explorer. |
| Type | string | undefined |
| Default | undefined |
selected​
| Description | Defines whether the item is selected |
| Type | boolean |
| Default | false |
| Description | Defines the link target URI. Supports standard hyperlink behavior. If a JavaScript action should be triggered, this should not be set, but instead an event handler for the click event should be registered. |
| Type | string | undefined |
| Default | undefined |
| Since | 1.19.0 |
| Description | Defines the component target.
Notes:
- _self
- _top
- _blank
- _parent
- _search
This property must only be used when the href property is set. |
| Type | string | undefined |
| Default | undefined |
| Since | 1.19.0 |
| Description | Item design.
Note: Items with "Action" design must not have sub-items. |
| Type | "Default" | "Action" |
| Default | "Default" |
| Since | 2.7.0 |
unselectable​
| Description | Indicates whether the navigation item is selectable. By default all items are selectable unless specifically marked as unselectable.
When a parent item is marked as unselectable, selecting it will only expand or collapse its sub-items. To improve user experience do not mix unselectable parent items with selectable parent items in a single side navigation.
Guidelines:
- External links should be unselectable.
- Items that trigger actions (with design "Action") should be unselectable. |
| Type | boolean |
| Default | false |
| Since | 2.7.0 |
accessibilityAttributes​
| Description | Defines the additional accessibility attributes that will be applied to the component. The following fields are supported:
- hasPopup: Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by the button. Accepts the following string values: dialog, grid, listbox, menu or tree.
Note: Do not use it on parent items, as it will be overridden if the item is in the overflow menu. |
| Type | SideNavigationItemAccessibilityAttributes |
| Default | {} |
| Since | 2.7.0 |
| Description | Defines the text of the item. |
| Type | string | undefined |
| Default | undefined |
disabled​
| Description | Defines whether the component is disabled. A disabled component can't be pressed or focused, and it is not in the tab chain. |
| Type | boolean |
| Default | false |
| Since | 1.19.0 |
| Description | Defines the tooltip of the component.
A tooltip attribute should be provided, in order to represent meaning/function, when the component is collapsed(icon only is visualized). |
| Type | string | undefined |
| Default | undefined |
| Since | 2.0.0 |
No slots available for this component.
| Description | Fired when the component is activated either with a click/tap or by using the [Enter] or [Space] keys. |
| Type | CustomEvent |
| Bubbles | Yes |
| Cancelable | No |
Methods​
No methods available for this component.
CSS Parts​
No CSS parts available for this component.