Propose new component: NavigationBar

[booc0mtaco]

A component in Science Design System needs to be flexible enough that it can be used across a wide range of scenarios and shouldn't be constrained to a specific number of products.

Visual

Provide a screenshot or link to a prototype of your component proposal.

https://github.com/chanzuckerberg/sci-components/assets/3056447/a6179b2f-9e6c-4f05-8e8c-742cdbd9f99b

Context

Where and when might this proposed component be used?

• This component is used as the primary navigation for a given application or web experience
• It will have containers and an API to specify a logo (or text) for the top left, two sets of links / menus for the right, and responsive handling for collapsing those in mobile use cases
• It will provide a method of tagging the app's status (beta, etc.) which sits along side the logo

Owner

Is this something you and your product has time to do or is this a request of the Science Design System team?

• POC submitted as part of SDS Hackday as a proof-of-concept, based loosely on work done in the BioHub UI
• Will submit a PR draft including implementation details so far, and placeholder to build upon

State

Does this component have states? If so, what are the different states (e.g. accordion with closed/open states)?

• Nominally includes an expand/collapse state which is automatically triggered by reading break points

Progressive enhancement

A component should be designed small screen first. How does this component scale up? How will this component degrade on less competent browsers?

• The base component(s) provide the a simple structure which can be enhanced with animations, or other enhancements. As of now, handling for responsive states is included in the component design.