fix(button): Fix Component Selector Issue

[lychyi]

Summary

Due to some changes in the way we use @emotion/styled, we are no longer able use component selectors in Emotion via Babel. This is because styled functions using Emotion's CreateStyled, like our own Canvas styled component, does not work with the babel plugin for emotion.

This is a known issue and will be fixed in Emotion 11 by emotion-js/emotion#1220 via a mapping configuration so the plugin knows about custom styled functions.

For now the fix is to just remove the usage of component selectors. This PR addresses that by using an identifier class name (similar to how Emotion identifies component selectors) in IconButton and then styling that class name in IconButtonToggleGroup.

Checklist

• branch has been rebased on the latest master commit
• tests are changed or added
• yarn test passes
• all (dev)dependencies that the module needs is added to its package.json
• code has been documented and, if applicable, usage described in README.md
• module has been added to canvas-kit-react and/or canvas-kit-css universal modules, if
  applicable
• design approved final implementation
• a11y approved final implementation
• code adheres to the API & Pattern guidelines

Additional References

[cypress]

---

Test summary

155 • 0 • 0 • 0

---

Run details

Project	canvas-kit
Status	Passed
Commit	8819eef
Started	Feb 19, 2020 9:27 PM
Ended	Feb 19, 2020 9:31 PM
Duration	03:48 💡
OS	Linux Ubuntu Linux - 16.04
Browser	Electron 78

View run in Cypress Dashboard ➡️

---

This comment has been generated by cypress-bot as a result of this project's GitHub integration settings. You can manage this integration in this project's settings in the Cypress Dashboard