Add aria-label to badge story and docs (#4044)

* Add aria-label to badge story

* fix(4043): Move aria-label to CheckmarkCircle icon in Badge stories and docs

* remove discouraged documentation example

---------

Co-authored-by: Michael Jordan <[email protected]>

Author: snowystinger

packages/@react-spectrum/badge/docs/Badge.mdx

@@ -51,13 +51,14 @@ import {Text} from '@react-spectrum/text';
 import CheckmarkCircle from '@spectrum-icons/workflow/CheckmarkCircle';
 
 <Badge variant="positive">
-  <CheckmarkCircle />
+  <CheckmarkCircle aria-label="Done" />
   <Text>Icon + Label</Text>
 </Badge>
 ```
 
 ### Accessibility
-If a visible label isn't specified, an `aria-label` must be provided for accessibility.
+If a visible label isn't specified, an `aria-label` must be provided to the icon for accessibility.
+
 
 ### Internationalization
 

packages/@react-spectrum/badge/stories/Badge.stories.tsx

@@ -37,17 +37,17 @@ export const Default: BadgeStory = {
 };
 
 export const WithIcon: BadgeStory = {
-  args: {children: <><CheckmarkCircle /><Text>Licensed</Text></>, variant: 'positive'},
+  args: {children: <><CheckmarkCircle aria-label="Done" /><Text>Licensed</Text></>, variant: 'positive'},
   name: 'With icon'
 };
 
 export const WithIconReverseOrder: BadgeStory = {
-  args: {children: <><Text>Licensed</Text><CheckmarkCircle /></>, variant: 'positive'},
+  args: {children: <><Text>Licensed</Text><CheckmarkCircle aria-label="Done" /></>, variant: 'positive'},
   name: 'With icon, order reversed'
 };
 
 export const IconOnly: BadgeStory = {
-  args: {children: <CheckmarkCircle />, variant: 'positive', 'aria-label': 'Licensed'},
+  args: {children: <CheckmarkCircle aria-label="Licensed" />, variant: 'positive'},
   name: 'Icon only'
 };