Home > @uniformdev/design-system > MenuProps

MenuProps interface

Signature:

Extends: Pick<React$1.HTMLAttributes<HTMLDivElement>, 'className' | 'id' | 'style'>

Properties

PropertyModifiersTypeDescription
children?React$1.ReactNode(Optional) (optional) allows users to add child elements
disableAutoSeparatorManagement?boolean<p>(Optional) By default the menu will automatically remove MenuItemSeparator components when they are: - the first child - the last child - adjacent to another separator</p><p>...both in the menu's immediate child items and any Fragment or MenuGroup components' children within. This simplifies boolean logic with highly conditional menus so one can not worry about contiguous separators. If you need to disable this functionality, set this prop to true.</p>
disabled?boolean(Optional) (optional) disables the menu trigger so the menu cannot be opened
getAnchorRect?(anchor: HTMLElement | null) => { x?: number; y?: number; width?: number; height?: number; }(Optional) Returns a custom anchor rect for positioning the menu. Used by QuickFilter for custom anchor positioning.
gutter?number(Optional) Distance between the trigger and the menu popup in pixels
maxMenuHeight?string(Optional) (optional) sets the maximum height of the menu setting a max menu height value will make the menu scrollable if the content exceeds the height this is not compatible with nested menus that expand to the left or right of the menu
menuItemsContainerCssClasses?SerializedStyles | string(Optional) (optional) allows users to set additional class names
menuTriggerReact$1.ReactElement & React$1.RefAttributes<any>The component that triggers the menu functionality
onClose?() => void(Optional) Called when the menu closes
onOpenChange?(open: boolean) => void(Optional) Called when the menu open state changes
open?boolean(Optional) Controls the open state of the menu (controlled mode)
placement?Placement | LegacyPlacement(Optional) (optional) placement options for the expandable menu. Root menus default to <code>bottom-end</code> when omitted; use <code>bottom</code> for center alignment.
portal?boolean(Optional)
portalElement?HTMLElement | null(Optional) Optional container element for the portal
shift?number(Optional) Offset along the alignment axis in pixels
size?'small' | 'base'(Optional) Sets the menu size it's recommended to use the same size for all menu items in a menu 'base'
testId?string(Optional) (optional) sets the test id attribute
updatePosition?(props: { updatePosition: () => void; }) => void(Optional) Controls when the menu repositions. When provided, disables automatic anchor tracking after initial placement.
withoutPortal?boolean(Optional) Sets whether to use a React portal rendering or not.