Similar to toolbars, menu components are used to group and arrange a set of UI elements, primarily button objects. They act as containers and have an influence on the visual appearance and user interactions with the contained elements. Menus primarily have a state (visible or hidden) and can either be bound to a button element (open below or above the button) or pop-up at a specific location in the UI (context menus).
Menu components should respect the WCAG 2.0 and WAI ARIA guidelines and contain the according markup attributes like role or aria-hidden.
User Story
- Susan processes the new messages in her Inbox
- The first two messages are from her boss and she needs to re-visit them later
- She clicks the "Mark as" button
- From the menu that opens, she chooses "As Flagged"
NOTE: the menu component is subject to be re-visited for the UX refinements.