Button usage does not cover toggle buttons or menu buttons

[mbgower]

The following are not strictly accessibility, more usability.

Toggle button

On the Button usage page, the Overview section makes no mention of toggle buttons (a button that can have a pressed or ‘on’ state). An example would be a Mute button in a player. Such a button although similar in function to a Toggle, is typically distinct, in that it keeps a ‘button’ shape but either visually shows as depressed, or else changes its label.

Another would be stars (for rating) . There are a number of other examples if you go to the buttons library and change the select element to Toggle.

The things I’m wondering… Does it make more sense to just have the name be “Star” regardless and the button have a pressed state? Or is it better to alter the name? And which does Carbon implement at the moment?

Menu button

In the same section, there is no reference to button menus (buttons you push to reveal a menu). Potentially these are covered entirely by the Overflow menu, although that seems like a specialized example of one, not the superset.

---

The ARIA Authoring Practices guide specifies both of these types of button for guidance.

Especially for toggle buttons, some guidance would be appropriate. At the least, i think some guidance in the When to/not to use subsections, and both Toggle and Overflow menu should also both appear in the Related section.

[laurenmrice]

@mbgower

• For "Toggle buttons", we could add guidance for this in the Related section and expand on the other related components and list their similarities and differences, etc.
• For "Menu buttons", we have talked about making components or variants for a menu button and a combo button. We still have not worked out where these would live in our system.

[mbgower]

Typically the related section is just a link to other component's pages. Do you envision starting to put material in there? I had been thinking that we could have a variant of button that is a toggle button, or consider making an entirely different component. Obviously the former could be an intermediary step to the latter (if even necessary).

For menu buttons, my suspicion is that menu button will likely work as a separate component, and that the Overflow menu could potentially be variant of that. The kebab menu is to me just a menu button. I don't even think of that as an overflow (except in response design, it's not like it's really handling overflow; it's just providing a small, unlabelled menu affordance). Where Carbon uses an ellipse for overflow (as in a breadcrumb), it feels like a different beast to me. For one thing, visually, it is just a link (a link that breaks the list of four things a link should be used for, btw, but I digress :)