{"size": 818, "ext": "js", "max_stars_repo_path": "readable/src/components/RadioButton.js", "max_stars_repo_name": "ricatosin/react-readable", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "readable/src/components/RadioButton.js", "max_issues_repo_name": "ricatosin/react-readable", "max_issues_repo_issues_event_min_datetime": "2020-07-17T02:59:02.000Z", "max_issues_repo_issues_event_max_datetime": "2022-03-08T22:45:01.000Z", "max_forks_repo_path": "readable/src/components/RadioButton.js", "max_forks_repo_name": "ricatosin/react-readable", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": 10, "max_forks_count": null, "avg_line_length": 26.3870967742, "max_line_length": 85, "alphanum_fraction": 0.6711491443}
import React from 'react';
import PropTypes from 'prop-types';
import _ from 'lodash';

const selClass = checked => `btn ${checked ? 'btn-danger active' : 'btn-secondary'}`;

const RadioButton = ({ evtName, val, handleChange, checked, disabled }) => (
  <label htmlFor={val} style={{ width: '100px' }} className={selClass(checked)}>
    <input
      type="radio"
      id={val}
      autoComplete="off"
      value={val}
      onChange={e => handleChange(e, evtName)}
      checked={checked}
      disabled={disabled}
    />
    {_.capitalize(val)}
  </label>
);

RadioButton.propTypes = {
  evtName: PropTypes.string.isRequired,
  val: PropTypes.string.isRequired,
  handleChange: PropTypes.func.isRequired,
  checked: PropTypes.bool.isRequired,
  disabled: PropTypes.bool.isRequired,
};

export default RadioButton;
