fix(ToggleSmall): add optional labels to ToggleSmall

[dakahn]

Closes #2856

Adds optional labels on ToggleSmall and adds an example to the documentation. 👍

Changelog

+ "with labels" story to docs
+ labelA and labelB props to ToggleSmall (mirroring Toggle)
+ a check in render for both props that displays labels over SVGs

To test

Go to the ToggleSmall section of our React documentation (the Netlify builds below) and select the "with labels" option.

[netlify]

Deploy preview for the-carbon-components ready!

Built with commit 92d8dbb

https://deploy-preview-3045--the-carbon-components.netlify.com

[netlify]

Deploy preview for carbon-elements ready!

Built with commit 92d8dbb

https://deploy-preview-3045--carbon-elements.netlify.com

[netlify]

Deploy preview for carbon-components-react ready!

Built with commit 92d8dbb

https://deploy-preview-3045--carbon-components-react.netlify.com

[emyarod]

I think this directly overlaps with #2809 #2885 which is awaiting confirmation from design on visual changes (I guess tagging @laurenmrice to review #2809?)

[snidersd]

I've tested the changes with DAP and there are errors associated with the unlabeled toggles. (see below)

WCAG Technique H44: Using label elements to associate text labels with form controls requires that all form controls have a visible label. . In the test section it states:
For all input elements of type checkbox or radio in the Web page:

1. Check that there is a label element that identifies the purpose of the control after the input element
2. Check that the for attribute of the label element matches the id of the input element
3. Check that the label element is visible.

Remove the examples that do not have a visible label to fix the issue.

[emyarod]

@snidersd unless I am misunderstanding it sounds like the same issue as #2809 (addressed in pending PR #2885) is that right?

[snidersd]

@emyarod, you are correct. I referenced #2809 in the original issue #2856.