Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature Request: Tab overflow "More" dropdown #4748

Open
mcherun opened this issue Aug 20, 2024 · 0 comments
Open

Feature Request: Tab overflow "More" dropdown #4748

mcherun opened this issue Aug 20, 2024 · 0 comments

Comments

@mcherun
Copy link

mcherun commented Aug 20, 2024

As a designer, I never loved how tabs sometimes stack vertically (when wrapping tabs as the container shrinks). It loses the physical metaphor of folders and tabs.

image

My recommendation is to generate a "More" dropdown menu that only appears when there is a tab overflow (too many tabs than can fit). The options that exist would be the tab titles that could not be visible which would change depending on the active tab.

  • This menu would of course need to be translatable.
  • Interacting with this menu would also need to ensure AODA accessibility focus states, so the user could use the left and right arrows to access the menu when navigating tabs, and when selected, the focus would be on the menu options.
  • Selecing an option would open the related tab.
  • Only hidden tabs woudl be displayed in the menu.

I've seen similar technologies achive this such as:
https://canvas.workday.com/v9/patterns/overflow/

https://www.patternfly.org/components/tabs/design-guidelines/

https://open-ui.org/components/tabs.research.parts/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant