Controls the appearance of the menu. The default menu will scroll after its height exceeds the pre-defined amount. The tall menu won't scroll until the height exceeds the height of the viewport.

Controls if the first menu item receives focus when menu is opened. Note that the menu has a focus lock which traps the focus within the menu. The first item gets focus automatically if the menu is triggered using the keyboard.

Content that will be rendered inside the layer element. Should typically be DropdownItemGroup or DropdownItem, or the checkbox and radio variants of those.

Controls the initial open state of the dropdown. If provided, the component is considered to be controlled which means that the user is responsible for managing the open and close state of the menu. Using defaultOpen may cause accessiblity issues because it will automatically shift focus to the first menu item; which can be disorienting. Only use this if action on the menu is required to proceed.

An optional name used to identify events for React UFO (Unified Frontend Observability) press interactions. For more information, see React UFO integration into Design System components.

If true, a spinner is rendered instead of the items.

Controls the open state of the dropdown.

Provide an accessible label via aria-label for assistive technology.

Provide an accessible label for the menu element for assistive technology.

Called when the menu should be open/closed. Receives an object with isOpen state.

If the dropdown was closed programatically, the event parameter will be null.

Position of the menu.

If ref is passed, focus returns to that specific ref element after dropdown dismissed.

This fits the dropdown menu width to its parent's width. When set to true, the trigger and dropdown menu elements will be wrapped in a div with position: relative. The dropdown menu will be rendered as a sibling to the trigger element, and will be full width. The default is false.

This fits the dropdown menu width to its parent's width. When set to true, the trigger and dropdown menu elements will be wrapped in a div with position: relative. The dropdown menu will be rendered as a sibling to the trigger element, and will be full width. The default is false.

Allows the dropdown menu to be placed on the opposite side of its trigger if it does not fit in the viewport.

@private No-op when platform-dst-top-layer is enabled — CSS Anchor Positioning handles flipping natively via position-try-fallbacks.

Allows consumers to ignore specific close events, for example when an external overlay should be treated as part of the dropdown interaction.

When set to true, will call stopPropagation on the ESCAPE key event. This prevents the ESCAPE event from bubbling up to parent elements.

@private No-op when platform-dst-top-layer is enabled — the native popover dismiss handles Escape propagation.

Controls whether the popup is rendered inline within its parent component or in a portal at the document root. true renders the dropdown menu in the DOM node closest to the trigger; focus is not trapped inside the element. false renders the dropdown menu in React.Portal and focus is trapped inside the element. Defaults to false.

@private No-op when platform-dst-top-layer is enabled — content always renders in the browser's top layer. Controls whether the popup is rendered inline within its parent component or in a portal at the document root. true renders the dropdown menu in the DOM node closest to the trigger; focus is not trapped inside the element. false renders the dropdown menu in React.Portal and focus is trapped inside the element. Defaults to false.

@private @deprecated No-op when platform-dst-top-layer is enabled — content always renders in the browser's top layer.

Controls the spacing density of the menu.

Text to be used as status for assistive technologies. Defaults to "Loading".

This controls the positioning strategy to use. Can vary between absolute and fixed. The default is fixed.

@private No-op when platform-dst-top-layer is enabled — CSS Anchor Positioning replaces Popper's positioning strategy. This controls the positioning strategy to use. Can vary between absolute and fixed. The default is fixed.

@private @deprecated No-op when platform-dst-top-layer is enabled — CSS Anchor Positioning replaces Popper's positioning strategy.

A testId prop is provided for specified elements, which is a unique string that appears as a data attribute data-testid in the rendered code, serving as a hook for automated tests.

As dropdown-menu is composed of different components, we passed down the testId to the sub component you want to test:

• testId--trigger to get the menu trigger.
• testId--content to get the dropdown content trigger.

Content that triggers the dropdown menu to open and close. Use with triggerType to get a button trigger. To customize the trigger element, provide a function to this prop. You can find examples for custom triggers in our documentation.

Z-index that the popup should be displayed in. This is passed to the portal component. Defaults to layers.modal() from @atlaskit/theme which is 510.

@private No-op when platform-dst-top-layer is enabled — the browser's top layer manages stacking without z-index.