A menu row with an icon, a label, an optional keyboard shortcut and a colour for destructive actions.
Examples
Rows
Items shown inside a menu-style panel.
<div class="w-56 rounded-xl border border-gray-200 bg-white p-1 shadow-card dark:border-gray-700 dark:bg-gray-900">
<UiDropdownItem icon="mdi:pencil" label="Edit" />
<UiDropdownItem icon="mdi:content-copy" label="Duplicate" shortcut="⌘D" />
<UiDropdownItem icon="mdi:trash-can-outline" label="Delete" color="red" />
</div>Props
| Name | Type | Default | Description |
|---|---|---|---|
| iconrequired | string | — | Leading MDI icon. |
| labelrequired | string | — | Row label. |
| shortcut | string | '' | Keyboard shortcut hint shown on the right. |
| disabled | boolean | false | Disables the row. |
| color | string | 'gray' | Row colour. grayredgreenamber |
Events
| Event | Payload | Description |
|---|---|---|
click | void | Emitted when the row is activated (unless disabled). |