Application menu that provides access to a set of functionalities.
All components are based on CodyFrame.
The menu component is used to reveal a set of functionalities. Its visibility is triggered by a control element (e.g.,
To connect the control with the menu, make sure the aria-controls value of the control is equal to the menu id value.
The vertical gap between the menu element and its control (e.g., <button>) is set using the
--menu-vertical-gap CSS custom property (deafult value is 4px).
The menu component is viewport aware: its position, relative to the trigger element, is automatically updated based on the available space.
When the menu element is open, the
.menu-control--active class is added to its control element.