<Menu
              trigger={<Button>Open Menu</Button>}
              activation="click"
              aria-label="View options"
              items={[
                { type: "label", label: "File" },
                {
                  label: "Rename",
                  icon: <FaEdit />,
                  shortcut: "Enter",
                  onClick: () => alert("Rename"),
                },
                {
                  label: "Duplicate",
                  icon: <FaCopy />,
                  shortcut: "Ctrl+D",
                  onClick: () => alert("Duplicate"),
                },
                { type: "separator" },
                {
                  label: "Move to",
                  icon: <FaFolderOpen />,
                  submenuAriaLabel: "Move destinations",
                  items: [
                    { label: "Backlog", onClick: () => alert("Backlog") },
                    { label: "In review", onClick: () => alert("In review") },
                    {
                      label: "Archive",
                      items: [
                        {
                          label: "This month",
                          onClick: () => alert("This month"),
                        },
                        { label: "All time", onClick: () => alert("All time") },
                      ],
                    },
                  ],
                },
                { type: "separator" },
                {
                  label: "Delete",
                  icon: <FaTrash />,
                  destructive: true,
                  onClick: () => alert("Delete"),
                },
              ]}
            ></Menu>

Props API

Menu props API
				Default	Description
`activation`	`MenuActivation`	No	props	`trigger ? "click" : "contextmenu"`	How the menu opens. Defaults to "click" when `trigger` is provided, otherwise "contextmenu".
`aria-describedby`	`string`	No	aria	`—`	Accessible description id(s) for the menu panel.
`aria-label`	`string`	No	aria	`"Context menu"`	Accessible label for the menu panel.
`aria-labelledby`	`string`	No	aria	`—`	Accessible labelledby target for the menu panel.
`children`	`ReactNode`	No	props	`—`	Context target content. Used when opening by click or context menu.
`className`	`string`	No	styling	`—`	Optional class name for the outer wrapper.
`closeOnSelect`	`boolean`	No	props	`true`	Whether the menu closes after selecting a non-submenu item.
`data-testid`	`string`	No	testing	`—`	Backward-compatible alias for test ID attributes.
`defaultOpen`	`boolean`	No	props	`false`	Initial open state for uncontrolled usage.
`focusFirstItemOnOpen`	`boolean`	No	props	`true`	Whether focus moves to the first enabled item when the menu opens.
`glass`	`boolean`	No	props	`configured default glass setting (fallback: false)`	Adds glass styling to the menu panel.
`id`	`string`	No	props	`—`	Optional id for the outer wrapper.

Menu

Usage & Examples

Default

Props API