Menu convergence - January Project Cycle

[jurokapsiar]

Following epic #16465

Problem

We need a converged menu component that follows the design

Appetite

The Menu component will be a significant step in the development of the convergence project as a whole since it presents interesting challenges:

• Interactions
• States - static and dynamic
• Accessibility
• Layout options
• Popup (pending)

The challenges will need to be addressed over the course of multiple project cycles. We must pay attention to work that should be shared with other convergence projects since the utilities required to fulfil requirements can be reused (e.g. accessibility, styling, layout)

Solution

As an initial step, we will conduct a review of existing Menu like components and post a PR with the findings to open-ui.

Based on the open-ui review, revise and finish the spec currently in the fluent repo and ask for reviews. The Menu spec has not been updated since the import from the archived fluent repo. The spec should be updated to include findings from the open-ui review and address the following concerns:

• Finalize API
• Finalize structure
• Add accessibility specs
• Add input from latest design specs
• Update design tokens in spec based on latest design specs

Deliverable

Reviewed Menu spec that the team agrees to start working on and also includes input from latest design reviews.

Stretch goal

A menu prototype has been developed by @layershifter and @assuncaocharles and is currently a part of the N*. Bootstrap a react-menu package with the prototype which uses React context to create a children API for menu which is mentioned as a recommendation in the current spec. We need to start somewhere.

Out of scope

Code deliverables are not expected as an outcome of this project. In an effort to not do throwaway work we should seek a consensus on the proposed API and behaviours of the component

The spec should be reviewed and accepted, but that does not mean that it has to be finalized. Modifications probably will happen, but it is important that we have a solid plan that the team is aware/informed of.

[layershifter]

I had a deja vu with this proposal 🙀

I posted some questions in Menu epic that can be considered as feedback, #16334 (comment).

[ling1726]

@layershifter regarding scope: I'm taking the converged context menu design as reference. Obv the final decision might rely on spec+review. Provisionally I would like to scope this as:

• Vertical menu context menu
• Support for triggers
• Popout support for triggers (This should definitely be tracked with respect to other projects to be reusable)

Which is what currently is addressed in the design spec linked