function _extends() { _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; }; return _extends.apply(this, arguments); }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import cx from 'classnames';
import Checkbox from './Checkbox';
import { asOptionObject, getValue } from './utils/options';
import Icon from '../Icon';
import MarkdownLabel from './MarkdownLabel';

class CheckboxGroup extends PureComponent {
  constructor(...args) {
    super(...args);

    _defineProperty(this, "handleClickOption", index => {
      const {
        input: {
          onChange
        },
        options
      } = this.props;
      const option = getValue(options[index]);
      const newValue = this.isOptionChecked(option) ? this.value.filter(value => value !== option) : [...this.value, option];
      onChange(newValue);
    });

    _defineProperty(this, "isOptionChecked", option => {
      const {
        input: {
          value = []
        }
      } = this.props;
      const included = value.includes(option);
      return included;
    });

    _defineProperty(this, "renderOption", (option, index) => {
      const {
        optionComponent
      } = this.props;
      const OptionComponent = optionComponent;
      const {
        value: optionValue,
        label: optionLabel,
        ...optionRest
      } = asOptionObject(option);
      return /*#__PURE__*/React.createElement(OptionComponent, _extends({
        className: "form-field-checkbox-group__option",
        key: index,
        input: {
          value: index,
          checked: this.isOptionChecked(optionValue),
          onChange: () => this.handleClickOption(index)
        },
        label: optionLabel // eslint-disable-next-line react/jsx-props-no-spreading

      }, optionRest));
    });
  }

  get value() {
    const {
      input: {
        value
      }
    } = this.props;
    return value;
  }

  render() {
    const {
      options,
      className,
      fieldLabel,
      label,
      input: {
        name
      },
      meta: {
        error,
        invalid,
        touched
      }
    } = this.props;
    const classNames = cx('form-field-checkbox-group', 'form-field-container', {
      'form-field-checkbox-group--has-error': invalid && touched && error
    }, className);
    const anyLabel = fieldLabel || label;
    return /*#__PURE__*/React.createElement("div", {
      className: classNames
    }, anyLabel && /*#__PURE__*/React.createElement(MarkdownLabel, {
      label: anyLabel
    }), /*#__PURE__*/React.createElement("div", {
      className: "form-field",
      name: name
    }, options.map(this.renderOption)), invalid && touched && /*#__PURE__*/React.createElement("div", {
      className: "form-field-checkbox-group__error"
    }, /*#__PURE__*/React.createElement(Icon, {
      name: "warning"
    }), error));
  }

}

CheckboxGroup.propTypes = {
  options: PropTypes.array,
  className: PropTypes.string,
  label: PropTypes.string,
  fieldLabel: PropTypes.string,
  input: PropTypes.object.isRequired,
  optionComponent: PropTypes.func,
  meta: PropTypes.object
};
CheckboxGroup.defaultProps = {
  className: null,
  label: null,
  fieldLabel: null,
  options: [],
  optionComponent: Checkbox,
  meta: {}
};
export default CheckboxGroup;