Single toggle button should not have role of group

[romans12]

Describe the bug

The form based toggle button should not have a default role of group if there is a single value (https://react-bootstrap.netlify.com/components/buttons/#checkbox--radio).

To Reproduce

Steps to reproduce the behavior:

1. Inspect single toggle button found here: https://react-bootstrap.netlify.com/components/buttons/#checkbox--radio

Expected behavior

It should only have a role of group if there is more than one value.

macOS
Chrome 77
React-Bootstrap Version: 1.0.0-beta.14

[bpas247]

react-bootstrap/www/src/examples/Button/ToggleButton.js

Lines 2 to 6 in c9cf6ae

	<ButtonGroup toggle>
	<ToggleButton type="checkbox" defaultChecked value="1">
	Checked
	</ToggleButton>
	</ButtonGroup>

So it looks like it is inheriting the role of group from being nested inside of a ButtonGroup component. Would the fix then be to check if the children are only a single element, and not apply the role if it is? How would we go about checking for that?

[jquense]

What is the harm of the role="group" here? It's not the most descriptive but it's not obviously wrong to have a group of one item IMO

[jeffredodd]

I'd add to this that having an extra role='group' around a single button will add an extra layer of roles that isn't needed and could be a less than ideal experience when only one button is in a group. That said, rather than dynamically controlling the role for button group, i'd say a consumer application should handle this at their level.

A fix for this could be perhaps throwing a warning when ButtonGroup contains less than one Button to encourage a more concise experience.

[taion]

tricky on our end, though – we can't necessarily tell how many buttons are in a group