The ui5-option component defines the content of an option in the ui5-select.
ES6 Module Import
import "@ui5/webcomponents/dist/Option.js";
Properties
additionalText
| Description | Defines the additionalText, displayed in the end of the option. |
| Type | string | undefined |
| Default | undefined |
| Since | 1.0.0-rc.15 |
icon
| Description | Defines the icon source URI.
Note: SAP-icons font provides numerous built-in icons. To find all the available icons, see the Icon Explorer. |
| Type | string | undefined |
| Default | undefined |
selected
| Description | Defines the selected state of the component. |
| Type | boolean |
| Default | false |
| Deprecated | since 2.20.0, please use the parent Select's value property instead. |
| Description | Defines the tooltip of the option. |
| Type | string | undefined |
| Default | undefined |
| Since | 2.0.0 |
value
| Description | Defines the value of the ui5-select inside an HTML Form element when this component is selected. For more information on HTML Form support, see the name property of ui5-select. |
| Type | string | undefined |
| Default | undefined |
Slots
default
| Description | Defines the text of the component.
Note: Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design. |
| Type | Array<Node> |
Events
click
| Description | Fired when the component is activated either with a mouse/tap or by using the Enter or Space key.
Note: The event will not be fired if the disabled property is set to true. |
| Type | CustomEvent<ListItemBaseClickEventDetail> |
| Parameters | item: ListItemBase
The activated item.
originalEvent: Event
The original event from the user interaction. |
| Since | 2.22.0 |
| Bubbles | Yes |
| Cancelable | No |
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.