Context Menu Item
@astryxdesign/core v0.7.1 · ContextMenuItem
ContextMenuItem Props
| Name | Type | Default | Description |
|---|---|---|---|
label | string | number | — | Primary label of the row. Use the label slot for rich content. |
description | string | — | Secondary text rendered below the label. Use the description slot for rich content. |
icon | string | Component | — | Icon rendered before the label: a CSS icon class or a component that draws the SVG. Use the icon slot for arbitrary content. |
endContent | string | number | — | Plain text rendered after the label area. Use the endContent slot for rich trailing content such as a badge. |
href | string | — | Address the row navigates to; the row then renders as an anchor. |
target | '_blank' | '_self' | — | Link target, only used with href. |
rel | string | — | Link relationship, only used with href. |
isDisabled | boolean | false | Whether the row is disabled. A disabled row is dimmed, skipped by arrow keys and typeahead, and cannot be activated. |
hasCloseOnSelect | boolean | true | Whether activating the row closes the menu. |
variant | 'default' | 'destructive' | 'default' | Visual variant of the row. |
Events
| Name | Payload | Description |
|---|---|---|
click | MouseEvent | Fired when the row is activated, with the click that activated it. |
Slots
label: rich content replacing thelabelprop.icon: leading content replacing theiconprop.description: rich content replacing thedescriptionprop.endContent: trailing content after the label area.
The row is role="menuitem", so the keyboard belongs to the menu above it: arrow keys, Home, End, and typeahead move between rows.