-
Notifications
You must be signed in to change notification settings - Fork 1.8k
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
Content Switcher refactor #9519
Comments
API Design// Sample code snippet Props
Links & Resources |
ContentSwitcher checklist
GA
|
Next steps
Use cases
|
Here are some high level thoughts for our Monday discussion: Content switcher let users toggle between different formatting, like with a grid view and a table view. They are also often used to narrow content groups of closely related information. The role of tabs in information hierarchy is to separate content. Tabs follow the metaphor for sections in a filing cabinet and two tabs wouldn’t contain the same sheet of paper. When it comes to content, tabs play a bigger part in information hierarchy while content switchers are more precise in the content/component they are paired with. There are a few similar use cases. For instance, you could use both tabs or a content switcher within a card but it depends on the specific content being organized: different view of same info: different category of same thing: separate but related info: high level differences:
|
ai apps icon switcher: https://pages.github.ibm.com/ai-applications/design/components/iconcontentswitcher/usage/ |
Backlog cleaning: It currently fails the "tab pattern" |
The
ContentSwitcher
component effectively uses the tab pattern under-the-hood in order to be operable. Unfortunately, the current API does not wire up everything that is needed for this pattern to function. In particular, it does not connect the currently selected "tab" with its corresponding "tabpanel".This issue is to update the
ContentSwitcher
API to correctly implement the ARIA Design Pattern for Tab: https://w3c.github.io/aria-practices/#tabpanel behind theenable-v11-release
feature flag. This work can optionally include refactoring the class-based component to a hook-based one, in an earlier stage, if it's helpful.Some potential APIs to consider:
The text was updated successfully, but these errors were encountered: