The PositionAnchor to use for the menu. Here's the default value for the anchor:
BELOW_CENTER_ANCHOR
TOP_RIGHT_ANCHOR
TOP_INNER_RIGHT_ANCHOR
This is the id
for the toggle element for a DropdownMenu
that is
required for a11y. This is used to also create the Menu
component's id
as ${baseId}-menu
.
Boolean if the menu should close instead of repositioning itself if the browser window is resized.
Boolean if the menu should close if the page is scrolled. The default behavior is to just update the position of the menu relative to the menu button until it can no longer be visible within the viewport.
Boolean if the menu component should not gain focus once it has mounted.
This should really only be set to true
if the enter transition has been
disabled.
Boolean if the toggle element should no longer gain focus when the menu loses visibility.
Note: The toggle element will not gain focus if:
document.activeElement
has moved outside of the menuMenuItem
's action cause the focus to move
alreadydocument.activeElement
is an link (<a href="">
)Boolean if the toggle component is currently disabled which will prevent the arrow keys from opening a menuitem's menu.
{@inheritDoc CalculateFixedPositionOptions}
This is just used to update the default anchor behavior.
Boolean if the menu should be rendered horizontally instead of vertically.
This will also update the aria-orientation
.
An optional aria-label
that should be applied to the Menu
component. If
this is undefined
, an aria-labelledby
will be provided to the Menu
instead linking to the id of the Button
.
Boolean if the menu is being rendered as a menuitem instead of a button.
Setting this to true
implements the
ProvidedMenuToggleProps.onKeyDown functionality.
This function will be called once the TransitionStage has been set
to "enter"
.
This function will be called once the TransitionStage has been set
to "entering"
.
This function will be called once the TransitionStage has been set
to "enter"
.
This function will be called once the TransitionStage has been set
to "exited"
.
An optional function to call if the page resizes while the menu is visible.
{@inheritDoc TransitionScrollCallback}
An optional click handler to merge with the {@link MenuHookReturnValue.onClick} behavior.
An optional keydown handler to merge with the
MenuHookReturnValue.menuProps behavior. Calling
event.stopPropagation()
will prevent the default behavior of closing the
menu when the "Escape"
key is pressed.
An optional click handler to merge with the toggle visibility behavior.
Calling event.stopPropagation()
will prevent the default behavior from
occurring.
An optional keydown handler to merge with the ProvidedMenuToggleProps.onKeyDown behavior.
An optional keydown handler to merge with the ProvidedMenuToggleProps.onMouseEnter behavior.
An optional keydown handler to merge with the ProvidedMenuToggleProps.onMouseLeave behavior.
Boolean if the page should no longer be scrollable while the menu is visible.
This should be the second argument for the useState
hook.
const [visible, setVisible] = useState(false);
This is used to update the visibility of the menu based on click and keyboard events.
An optional style object to merge with the Menu
's fixed positioning
style.
Boolean if the menu is currently visible.
A function that can be used to get the CalculateFixedPositionOptions dynamically.
Generated using TypeDoc
@since 5.0.0