import React from 'react';
import PropTypes from 'prop-types';

/**
 * A stateless component which renders Radio button.
 */
const InputRadioButton = props => {
    let radioProps = {...props};
    delete radioProps.parentClassName;

    let classes = ['jp-radio-btn-container',
        props.parentClassName ? props.parentClassName : null,
        props.disabled  ? 'disabled' : null
    ];
    return (
        <label className={classes.join(' ')} id={props.id+'Label'} htmlFor={props.id}>
            <input type="radio" {...radioProps} />
            <span className="jp-radio-style" />
            <span className="jp-radio-label-text">{props.label}</span>
        </label>
       
    );
};
export default InputRadioButton;

InputRadioButton.propTypes = {
    /** Unique ID for the field. Required for web accessibility */
    id: PropTypes.string.isRequired,
    /** Set a value for radio button  */
    value: PropTypes.string,
    /** Set the radio button selected on state change  */
    checked: PropTypes.bool,
    /** Set disabled to radio button depends on disabled state */
    disabled: PropTypes.bool,
    /** Set onChange event for each radio button*/
    onChange: PropTypes.func,
    /** Set label for each radio button*/
    label: PropTypes.string,
    /** Class applied to parent container for additional styling  */
    parentClassName: PropTypes.string
};