Refactor Radio family to become SelectGroup family

[alexpaxton]

Closes #403

Aiming to make SelectGroup play a little nicer with HTML5 forms by making it utilize HTML inputs under the hood so a form can parse its value. The family has been renamed to indicate that it can be used for multi-select as well as single-select.

Changes

• Rename Radio family to SelectGroup to be more semantic
  • This change was driven by the option to use multi-select and "radio" implies single-select only
• Rename RadioButton to SelectGroupOption
• Change the invisible inputs within Toggle and SelectGroupOption to be uncontrolled and readonly
  • Use onClick instead of onChange because onChange on a checkbox/radio input has inconsistent behavior between browsers
• Listen for Space key instead of Enter to toggle state of Toggle and SelectGroupOption
• Refactor SelectGroupOption to follow a similar pattern to Toggle
  • Instead of <button /> it is now composed of <input /> and <label />
  • SelectGroupOption can be of type radio (default) or checkbox
  • SelectGroupOption is now tab focusable
• Make id prop of SelectGroupOption required
  • Necessary for it to work properly now
• Update styles for disabled state of SelectGroupOption to look more disabled
• Rewrite SelectGroup documentation to explain the new component API

Screenshots

Checklist

Check all that apply

• Updated documentation to reflect changes
• Added entry to top of Changelog with link to PR (not issue)
• Tests pass
• Peer reviewed and approved
• Signed CLA (if not already signed)

[mavarius]

Radio and Checkbox should either be separate components or we should name it something more generic. A radio control by its nature should only allow a single item in a list to be selected.

[mavarius]

awesome!

[alexpaxton]

Based on feedback I made these changes:

• Rename Radio family to SelectGroup to be more semantic
  • This change was driven by the option to use multi-select and "radio" implies single-select only
• Rename RadioButton to SelectGroupOption
• Change the invisible inputs within Toggle and SelectGroupOption to be uncontrolled and readonly
  • Use onClick instead of onChange because onChange on a checkbox/radio input has inconsistent behavior between browsers
• Listen for Space key instead of Enter to toggle state of Toggle and SelectGroupOption