Update Radio stories to no longer use styled-components (#6465)

Author: llastflowers

.gitignore

@@ -34,6 +34,7 @@ coverage/
 # Playwright
 stats.html
 blob-report
+results.json
 
 # TypeScript
 *.tsbuildinfo

packages/react/src/Radio/Radio.features.stories.tsx

@@ -1,5 +1,5 @@
 import {MarkGithubIcon} from '@primer/octicons-react'
-import {Avatar, Box, FormControl, Radio} from '..'
+import {Avatar, FormControl, Radio} from '..'
 
 export default {
   title: 'Components/Radio/Features',
@@ -8,7 +8,7 @@ export default {
 
 export const WithLeadingVisual = () => {
   return (
-    <Box as="form">
+    <form>
       <FormControl>
         <FormControl.LeadingVisual>
           <MarkGithubIcon />
@@ -23,29 +23,29 @@ export const WithLeadingVisual = () => {
         <Radio value="default" name="default-radio-name" />
         <FormControl.Label>Default label</FormControl.Label>
       </FormControl>
-    </Box>
+    </form>
   )
 }
 
 export const Disabled = () => {
   return (
-    <Box as="form">
+    <form>
       <FormControl disabled>
         <Radio value="default" name="default-radio-name" />
         <FormControl.Label>Default label</FormControl.Label>
       </FormControl>
-    </Box>
+    </form>
   )
 }
 
 export const WithCaption = () => {
   return (
-    <Box as="form">
+    <form>
       <FormControl>
         <Radio value="default" name="default-radio-name" />
         <FormControl.Label>Default label</FormControl.Label>
         <FormControl.Caption>This is a caption</FormControl.Caption>
       </FormControl>
-    </Box>
+    </form>
   )
 }

packages/react/src/Radio/Radio.stories.tsx

@@ -1,6 +1,6 @@
 import type {Meta} from '@storybook/react-vite'
 import type {RadioProps} from '..'
-import {Box, FormControl, Radio} from '..'
+import {FormControl, Radio} from '..'
 import type {FormControlArgs} from '../utils/form-story-helpers'
 import {
   formControlArgs,
@@ -20,13 +20,13 @@ export const Playground = ({value: _value, ...args}: FormControlArgs<RadioProps>
   const {parentArgs, labelArgs, captionArgs} = getFormControlArgsByChildComponent(args)
 
   return (
-    <Box as="form">
+    <form>
       <FormControl {...parentArgs}>
         <Radio name="default-radio-name" value="default" {...args} />
         <FormControl.Label {...labelArgs} />
         {captionArgs.children && <FormControl.Caption {...captionArgs} />}
       </FormControl>
-    </Box>
+    </form>
   )
 }
 Playground.argTypes = {
@@ -43,10 +43,10 @@ Playground.args = {
 }
 
 export const Default = () => (
-  <Box as="form">
+  <form>
     <FormControl>
       <Radio name="default-radio-name" value="default" />
       <FormControl.Label>Label</FormControl.Label>
     </FormControl>
-  </Box>
+  </form>
 )