REACT-NATIVES

WIRED FOR SPEED

react-natives v2.1.2

Theme

Light

Dark

Get Started

Components

Navigation

A dropdown menu triggered by a button or other element.

Example

Preview

Code

Props

Menu Props

Prop

Type

Default

Description

className

string

—

NativeWind utility classes to apply to the menu container.

isOpen

boolean

—

Controlled open state of the menu.

onOpenChange

(open: boolean) => void

—

Callback invoked when the open state changes.

MenuTrigger Props

Prop

Type

Default

Description

className

string

—

NativeWind utility classes for the menu trigger.

MenuContent Props

Prop

Type

Default

Description

className

string

—

NativeWind utility classes for the menu content container.

MenuItem Props

Prop

Type

Default

Description

className

string

—

NativeWind utility classes for a menu item.

onPress

() => void

—

Callback invoked when the menu item is pressed.

isDisabled

boolean

false

When true, disables the menu item.

MenuItemText Props

Prop

Type

Default

Description

className

string

—

NativeWind utility classes for the menu item text.

MenuItemIcon Props

Prop

Type

Default

Description

className

string

—

NativeWind utility classes for the menu item icon.

as *

React.ElementType

—

The icon component to render in the menu item.

MenuSeparator Props

Prop

Type

Default

Description

className

string

—

NativeWind utility classes for the menu separator.

MenuGroup Props

Prop

Type

Default

Description

className

string

—

NativeWind utility classes for a menu group.

MenuGroupTitle Props

Prop

Type

Default

Description

className

string

—

NativeWind utility classes for the menu group title.

Usage Guidelines

When to use

Use Menu for contextual actions, navigation options, or command lists triggered by a button or icon.

Best practices

•

Group related menu items with MenuGroup and MenuGroupTitle for scannability.

•

Use MenuSeparator to visually divide menu sections.

•

Limit menu items to 7-10 for usability — use nested menus or navigation for larger sets.

Accessibility

Menu supports keyboard navigation with arrow keys. Items are announced by screen readers. Escape closes the menu and returns focus to the trigger.

Related Components

Popover

A positioned overlay that appears relative to a trigger element.

Select

A compound dropdown select component with trigger, portal-based content, search filtering, single-select, and multi-select badge support.

ActionSheet

A compound bottom-sheet component that slides up from the bottom of the screen with a drag indicator, selectable items, and backdrop.

React-Natives

A comprehensive React Native component library.

Documentation

Getting Started

Components

Theming

Community

GitHub

Discord

Twitter

Blog

Support

FAQ

Contact

Contributing

License