feat(a11y): radio #205

packages/semi-foundation/radio/radio.scss

@@ -275,9 +275,16 @@ $inner-width: $width-icon-medium;
         }
     }
 
+    // A11y: arrow keyboard control
     .#{$module}-inner-buttonRadio,
     .#{$module}-inner-pureCardRadio  {
-        display: none;
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        z-index: -1;
+        opacity: 0;
     }
 
     &-disabled {

packages/semi-ui/radio/radio.tsx

@@ -82,6 +82,7 @@ class Radio extends BaseComponent<RadioProps, RadioState> {
 
     radioEntity: RadioInner;
     context!: RadioContextValue;
+    foundation: RadioFoundation;
 
     constructor(props: RadioProps) {
         super(props);

packages/semi-ui/radio/radioGroup.tsx

@@ -69,6 +69,7 @@ class RadioGroup extends BaseComponent<RadioGroupProps, RadioGroupState> {
         buttonSize: 'middle'
     };
 
+    foundation: RadioGroupFoundation;
     constructor(props: RadioGroupProps) {
         super(props);
         this.state = {

packages/semi-ui/radio/radioInner.tsx

@@ -44,6 +44,7 @@ class RadioInner extends BaseComponent<RadioInnerProps, RadioInnerState> {
 
 
     inputEntity!: HTMLInputElement;
+    foundation: RadioInnerFoundation;
     constructor(props: RadioInnerProps) {
         super(props);
         this.state = {
@@ -114,6 +115,7 @@ class RadioInner extends BaseComponent<RadioInnerProps, RadioInnerState> {
                     ref={ref => {
                         this.inputEntity = ref;
                     }}
+                    // eslint-disable-next-line jsx-a11y/no-autofocus
                     autoFocus={autoFocus}
                     type={mode === 'advanced' ? 'checkbox' : 'radio'}
                     checked={Boolean(checked)}