Repository: zeit-ui/react (ts)

Issue:
Radio value should also accept numbers
# Feature request 🚀

Currently `value` in `Radio.Props` and `Radio.Group.Props` is set to `string`.

http://react.zeit-ui.co/en-us/components/radio

Though you can convert number to string easily by template literals, it would be nicer to use `number` props directly.

### Expected:
  - No breaking changes

### Examples:
```js
<Radio value={1}>Option 1</Radio>
```

### Programme:

### Others:






Pull request:
feat(radio): support for number type
## PR Checklist

- [x] Fix linting errors
- [x] Label has been added


## Change information

resolved #269 


Patch:
diff --git a/components/radio/radio-context.ts b/components/radio/radio-context.ts
index b29271b..41fcce4 100644
--- a/components/radio/radio-context.ts
+++ b/components/radio/radio-context.ts
@@ -1,9 +1,9 @@
 import React from 'react'
 
 export interface RadioConfig {
-  updateState?: (value: string) => void
+  updateState?: (value: string | number) => void
   disabledAll: boolean
-  value?: string
+  value?: string | number
   inGroup: boolean
 }
 
diff --git a/components/radio/radio-group.tsx b/components/radio/radio-group.tsx
index 802d3ce..21954f1 100644
--- a/components/radio/radio-group.tsx
+++ b/components/radio/radio-group.tsx
@@ -4,11 +4,11 @@ import { RadioContext } from './radio-context'
 import { NormalSizes } from 'components/utils/prop-types'
 
 interface Props {
-  value?: string
-  initialValue?: string
+  value?: string | number
+  initialValue?: string | number
   disabled?: boolean
   size?: NormalSizes
-  onChange?: (value: string) => void
+  onChange?: (value: string | number) => void
   className?: string
   useRow?: boolean
 }
@@ -44,8 +44,8 @@ const RadioGroup: React.FC<React.PropsWithChildren<RadioGroupProps>> = ({
   useRow,
   ...props
 }) => {
-  const [selfVal, setSelfVal] = useState<string | undefined>(initialValue)
-  const updateState = (nextValue: string) => {
+  const [selfVal, setSelfVal] = useState<string | number | undefined>(initialValue)
+  const updateState = (nextValue: string | number) => {
     setSelfVal(nextValue)
     onChange && onChange(nextValue)
   }
diff --git a/components/radio/radio.tsx b/components/radio/radio.tsx
index b449ad7..15109e4 100644
--- a/components/radio/radio.tsx
+++ b/components/radio/radio.tsx
@@ -20,7 +20,7 @@ export interface RadioEvent {
 
 interface Props {
   checked?: boolean
-  value?: string
+  value?: string | number
   size?: NormalSizes
   className?: string
   disabled?: boolean
@@ -77,7 +77,7 @@ const Radio: React.FC<React.PropsWithChildren<RadioProps>> = ({
     }
     setSelfChecked(!selfChecked)
     if (inGroup) {
-      updateState && updateState(radioValue as string)
+      updateState && updateState(radioValue as string | number)
     }
     onChange && onChange(selfEvent)
   }


Test patch:
diff --git a/components/radio/__tests__/group.test.tsx b/components/radio/__tests__/group.test.tsx
index 9cb15c5..22bd1e1 100644
--- a/components/radio/__tests__/group.test.tsx
+++ b/components/radio/__tests__/group.test.tsx
@@ -61,6 +61,28 @@ describe('Radio Group', () => {
     changeHandler.mockRestore()
   })
 
+  it('the radio value should be support number', () => {
+    let value = ''
+    const changeHandler = jest.fn().mockImplementation(val => (value = val))
+    const wrapper = mount(
+      <Radio.Group onChange={changeHandler}>
+        <Radio value={5}>Option 1</Radio>
+        <Radio value={10}>Option 2</Radio>
+      </Radio.Group>,
+    )
+
+    wrapper
+      .find('input')
+      .at(0)
+      .simulate('change', {
+        ...nativeEvent,
+        target: { checked: true },
+      })
+    expect(changeHandler).toHaveBeenCalled()
+    expect(value).toEqual(5)
+    changeHandler.mockRestore()
+  })
+
   it('should ignore events when disabled', () => {
     const changeHandler = jest.fn()
     const wrapper = mount(