Overview
Dropdown set of options, based on Keen's UI Menu. See these docs to understand the current implementation of the options object array. Notable possible for configuring the menu include icons, text, secondary text, and dividers.
Usage
Button with dropdown
Icon button with dropdown
Options with icons
Context menu
This component can be also used to create a context menu, which is a dropdown menu that appears when a user right-clicks on an element. The context menu will then be attached to the parent element.
Props
| Name | Description | Type | Default | Required |
|---|---|---|---|---|
constrainToScrollParent | The dropdown menu popover flips its position to avoid overflows within the parent.
Setting it to false disables the flipping behavior. | boolean |
true
| — |
options | An array of options objects, with one object per dropdown item | array | — | true |
hasIcons | Whether or not the options display an icon | boolean |
false
| — |
maxWidth | Maximum width for the dropdown menu | number|string |
null
| — |
position | The position of the dropdown relative to the button | string |
'bottom right'
| — |
isContextMenu | Whether or not the dropdown is a context menu, if true, the dropdown will open when
the user right-clicks the parent element | boolean |
false
| — |
hideOnClick | Private. Do not use. | boolean |
true
| — |
Events
| Name | Description |
|---|---|
tab | — |
select | Emitted when an option is selected |
close | — |
Slots
| Name | Description |
|---|---|
header | — |