Intro

Gallery

Hosting

Learn

Components

Recipes

API Reference

Getting Started

Tutorial

Reflex Deploy

Self Hosting

Library

/

Chakra

/

Overlay

/

Menu

An accessible dropdown menu for the common dropdown menu button design pattern.

rx.chakra.menu(
    rx.chakra.menu_button("Menu"),
    rx.chakra.menu_list(
        rx.chakra.menu_item("Example"),
        rx.chakra.menu_divider(),
        rx.chakra.menu_item("Example"),
        rx.chakra.menu_item("Example"),
    ),
)

API Reference

The wrapper component provides context, state, and focus management.

Prop	Type	Default Value	Values
`arrow_padding`	int
`auto_select`	bool
`boundary`	str
`close_on_blur`	bool
`close_on_select`	bool
`default_is_open`	bool
`direction`	Literal
`flip`	bool
`gutter`	int
`is_lazy`	bool
`lazy_behavior`	str
`is_open`	bool
`match_width`	bool
`placement`	str
`prevent_overflow`	bool
`strategy`	Literal

Event Triggers

Trigger	Description
`on_close`	Fired when the menu is closed.
`on_open`	Fired when the menu is opened.

MenuButton

The trigger for the menu list. Must be a direct child of Menu.

Prop	Type	Default Value	Values
`variant`	str
`as_`	str

Event Triggers

See the full list of default event triggers

MenuList

The wrapper for the menu items. Must be a direct child of Menu.

Props

No component specific props

Event Triggers

See the full list of default event triggers

MenuItem

The trigger that handles menu selection. Must be a direct child of a MenuList.

Prop	Type	Default Value	Values
`close_on_select`	bool
`command`	str
`command_spacing`	int
`is_disabled`	bool
`is_focusable`	bool

Event Triggers

See the full list of default event triggers

MenuDivider

A visual separator for menu items and groups.

Props

No component specific props

Event Triggers

See the full list of default event triggers

MenuGroup

A wrapper to group related menu items.

Props

No component specific props

Event Triggers

See the full list of default event triggers

MenuOptionGroup

A wrapper for checkable menu items (radio and checkbox).

Prop	Type	Default Value	Values
`type_`	Literal
`value`	str

Event Triggers

See the full list of default event triggers

MenuItemOption

The checkable menu item, to be used with MenuOptionGroup.

Prop	Type	Default Value	Values
`close_on_select`	bool
`command`	str
`command_spacing`	int
`is_checked`	bool
`is_disabled`	bool
`is_focusable`	bool
`type_`	Literal
`value`	str

Event Triggers

See the full list of default event triggers

Did you find this useful?

No

Yes

Home Gallery Changelog Introduction Hosting

Menu

API Reference

Menu

MenuButton

MenuList

MenuItem

MenuDivider

MenuGroup

MenuOptionGroup

MenuItemOption