Actions & Navigation
Menu
A menu displays a list of actions or options that a user can choose.
One
Two
Three
Four
Five
Separators#
One
Two
Three
Four
Five
Sections#
Introduction
One
Two
Three
Summary
Four
Five
Single select#
One
Two
Three
Four
Five
Multiple select#
One
Two
Three
Four
Five
Preselected#
One
Two
Three
Four
Five
Submenu#
Component props#
Menu#
| Name | Type | Description |
|---|---|---|
| selectionMode | SelectionMode | "none" | "single" | "multiple" |
| selectedKeys | string[] | Controlled selected keys |
| defaultSelectedKeys | string[] | Default selected keys |
| onSelectionChange | (keys: Selection) => void | Called when selection changes |
MenuItem#
| Name | Type | Description |
|---|---|---|
| id | string | Unique item identifier |
| icon | ReactNode | Icon displayed before label |
| label | string | Item label text |
| isDisabled | boolean | Disables the item |
| showChecked | boolean | Shows check mark when selected (default: true) |
| showSubMenuIcon | boolean | Shows submenu arrow icon |