import _extends from "@babel/runtime/helpers/extends";
// Copyright 1999-2020. Plesk International GmbH. All rights reserved.

/* eslint-disable react/prefer-stateless-function */
import React, { cloneElement, Component } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { CLS_PREFIX } from '../../constants';
import FormField from '../FormField';
import Hint from '../Hint';
import Radio from '../Radio';

/**
 * `FormFieldRadioButtons` is used for making a choice among a set of mutually exclusive, related options. Only one option can be chosen.
 * @since 0.2.0
 */
class FormFieldRadioButtons extends Component {
  render() {
    const {
      baseClassName,
      className,
      options,
      autoFocus,
      multi,
      ...props
    } = this.props;
    return /*#__PURE__*/React.createElement(FormField, _extends({
      className: classNames(baseClassName, className)
    }, props), ({
      getId,
      getName,
      getValue,
      setValue,
      isDisabled
    }) => options.map(({
      value,
      label,
      description,
      disabled,
      indentFields = []
    }, index) => /*#__PURE__*/React.createElement("div", {
      className: `${baseClassName}__radio`,
      key: value
    }, /*#__PURE__*/React.createElement(Radio, {
      name: getName(),
      checked: getValue() === value,
      onChange: isChecked => {
        if (isChecked) {
          setValue(value);
        }
      },
      disabled: isDisabled() || disabled,
      inputProps: {
        id: getId() ? `${getId()}-${value}` : null,
        name: getName(),
        value,
        autoFocus: index === 0 && autoFocus ? true : undefined
      }
    }, label || value), description || indentFields ? /*#__PURE__*/React.createElement("div", {
      className: `${baseClassName}__content`
    }, description && /*#__PURE__*/React.createElement(Hint, {
      className: `${FormField.defaultProps.baseClassName}__description`
    }, description), indentFields.map(field => {
      if (isDisabled() || disabled || getValue() !== value) {
        return /*#__PURE__*/cloneElement(field, {
          disabled: true
        });
      }

      return field;
    })) : null)));
  }

}

FormFieldRadioButtons.propTypes = {
  /**
   * Options definition.
   * @since 0.2.0
   */
  options: PropTypes.arrayOf(PropTypes.shape({
    /**
     * Option value.
     */
    value: PropTypes.string.isRequired,

    /**
     * Option label.
     */
    label: PropTypes.node.isRequired,

    /**
     * Text hint located below option for providing additional information.
     */
    description: PropTypes.node,

    /**
     * Set true if option is not available to choice.
     */
    disabled: PropTypes.bool,

    /**
     * Optional array of `FormField` components under this option.
     */
    indentFields: PropTypes.array
  })).isRequired,

  /**
   * Value of current chosen option.
   * @deprecated Use [Form](#!/Form) values.
   * @since 0.2.0
   */
  value: PropTypes.string,

  /**
   * Disabled state of field.
   * @since 0.2.0
   */
  disabled: PropTypes.bool,

  /**
   * The browser will automatically focus on the component upon rendering the screen
   * @since 1.9.0
   */
  autoFocus: PropTypes.bool,

  /**
   * @ignore Field cannot be multiple
   */
  multi: PropTypes.bool,

  /**
   * @ignore
   */
  className: PropTypes.string,

  /**
   * @ignore
   */
  baseClassName: PropTypes.string
};
FormFieldRadioButtons.defaultProps = {
  value: undefined,
  disabled: undefined,
  autoFocus: undefined,
  multi: undefined,
  className: undefined,
  baseClassName: `${CLS_PREFIX}form-field-radio-buttons`
};
export default FormFieldRadioButtons;