import React, {Component} from 'react'
import classNames from 'classnames/bind'
import {color} from '../common/constants'

let cx = classNames.bind(require('../styles/radio.scss'))

class Radio extends Component {
  render() {
    return (
      <div className={cx('radio')}>
        {this.props.names.map((name, index) =>
          <div onClick={() => this.props.disabled[name] ? null : this.props.on_click(name)} className={cx('radio__option', {'radio__option_active': !this.props.disabled[name], 'radio__option_selected': this.props.selected == name})} key={name}>
            {this.props.render_radio(name)}
          </div>
        )}
      </div>
    )
  }
}

Radio.defaultProps = {
  on_click: (name) => {},
  disabled: {},
  render_radio: (name) => {},
  selected: "",
  names: [],
}

export default Radio