// @flow
import React, { Fragment, PureComponent } from 'react'
import { Label, Input } from '../Checkbox'
import { type InputType } from '../../types'

type Props = {
  defaultChecked: boolean,
  id: string,
  label: string,
  readOnly?: boolean,
  tabIndex?: string,
}

class Radio extends PureComponent<Props & InputType> {
  static defaultProps = {
    tabIndex: undefined,
    readOnly: false,
  }

  render() {
    const { defaultChecked, name, label, id, onBlur,
      onChange, readOnly, tabIndex, value } = this.props
    return (
      <Fragment>
        <Input
          id={id}
          name={name}
          onBlur={onBlur}
          onChange={onChange}
          readOnly={readOnly}
          tabIndex={tabIndex}
          type="radio"
          value={value}
          defaultChecked={defaultChecked}
        />
        <Label htmlFor={id}>
          {label}
        </Label>
      </Fragment>
    )
  }
}

export default Radio