var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import InputRadio from '../InputRadio';
import ErrorMessage from '../ErrorMessage';
import './style.css';

var InputRadioGroup = function (_React$Component) {
  _inherits(InputRadioGroup, _React$Component);

  function InputRadioGroup(props) {
    _classCallCheck(this, InputRadioGroup);

    var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));

    _this.handleChange = function (event) {
      var selected = event.target.value;
      if (selected !== _this.state.selected) {
        _this.setState({ selected: selected });
        if (typeof _this.props.onChange === 'function') {
          var name = _this.props.name;

          _this.props.onChange({ selected: selected, name: name, event: event });
        }
      }
    };

    _this.state = {
      selected: _this.props.defaultSelected
    };
    return _this;
  }

  InputRadioGroup.prototype.render = function render() {
    var _this2 = this;

    var itemsClasses = classNames({
      'ma__input-group__items': true,
      'ma__input-group__items--inline': this.props.inline,
      'ma__input-group__items--outline': this.props.outline
    });
    var titleClasses = classNames({
      'ma__input-group__title': true,
      'ma__input-group__title--error': this.props.error,
      'ma__input-group__title--disabled': this.props.disabled
    });

    return React.createElement(
      React.Fragment,
      null,
      React.createElement(
        'fieldset',
        null,
        React.createElement(
          'div',
          { className: 'ma__input-group' },
          React.createElement(
            'legend',
            { className: titleClasses },
            this.props.title
          ),
          React.createElement(
            'div',
            { className: itemsClasses },
            this.props.radioButtons.map(function (radioButton, index) {
              var isChecked = radioButton.value === _this2.state.selected;
              var buttonId = radioButton.id || radioButton.value;
              return (
                /* eslint-disable-next-line react/no-array-index-key */
                React.createElement(
                  'div',
                  { className: 'ma__input-group__item item-' + _this2.props.radioButtons.length + ' ' + radioButton.class, key: 'InputRadioGroupDiv-' + buttonId + '-' + index },
                  React.createElement(InputRadio, _extends({}, radioButton, {
                    name: _this2.props.name,
                    onChange: _this2.handleChange,
                    checked: isChecked,
                    required: _this2.props.required,
                    outline: _this2.props.outline,
                    error: _this2.props.error,
                    disabled: _this2.props.disabled
                    /* eslint-disable-next-line react/no-array-index-key */
                    , key: 'InputRadioGroup-' + buttonId + '-' + index
                  }))
                )
              );
            })
          )
        )
      ),
      this.props.errorMsg && this.props.error && React.createElement(ErrorMessage, { status: true, error: this.props.errorMsg, inputID: this.props.name })
    );
  };

  return InputRadioGroup;
}(React.Component);

InputRadioGroup.propTypes = process.env.NODE_ENV !== "production" ? {
  /** The legend title of the radio button group. */
  title: PropTypes.string.isRequired,
  /** The name of the radio button group */
  name: PropTypes.string.isRequired,
  /** Whether radio input is required or not */
  required: PropTypes.bool,
  /** Whether you want the radio input outlined */
  outline: PropTypes.bool,
  /** The default select radio button option on initial render */
  defaultSelected: PropTypes.string,
  /** Whether the radio group is in error state or not. */
  error: PropTypes.bool,
  /** Error Message content. */
  errorMsg: PropTypes.string,
  /** Display Inputs inline */
  inline: PropTypes.bool,
  /** Whether the radio button group is in a disabled state or not */
  disabled: PropTypes.bool,
  /** On change callback function */
  onChange: PropTypes.func,
  /** An array of radio buttons. */
  radioButtons: PropTypes.arrayOf(PropTypes.shape({
    id: PropTypes.string,
    value: PropTypes.string.isRequired,
    label: PropTypes.string.isRequired,
    /** Allow adding one class to radio button, e.g. "col-medium-1", "col-large-1" */
    class: PropTypes.string
  }))
} : {};

InputRadioGroup.defaultProps = {
  outline: false,
  required: false,
  inline: true,
  error: false,
  disabled: false
};

export default InputRadioGroup;