import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import React, { createElement } from 'react';
import { Input } from './component';
import { FormContext } from '../Form/component';
export var InputContainer =
/*#__PURE__*/
function (_React$Component) {
  _inherits(InputContainer, _React$Component);

  function InputContainer(props) {
    var _this;

    _classCallCheck(this, InputContainer);

    _this = _possibleConstructorReturn(this, _getPrototypeOf(InputContainer).call(this, props));

    _this.handleChange = function (e) {
      var value = e.currentTarget.value;
      var handleChange = _this.props.onChange;

      var validation = _this.validations.find(function (_ref) {
        var validator = _ref.validator;
        return validator(value);
      });

      if (validation && validation.message) {
        _this.setState({
          message: validation.message,
          valid: false,
          value: value
        });

        _this.validChange(false);
      } else {
        handleChange(e, value);

        _this.setState({
          message: _this.validator.message,
          valid: true,
          value: value
        });

        _this.validChange(true);
      }
    };

    _this.state = {
      value: '',
      message: '',
      valid: true
    };
    return _this;
  }

  _createClass(InputContainer, [{
    key: "validChange",
    value: function validChange(valid) {
      var handleValidChange = this.props.onValidChange;

      if (this.state.valid !== valid && !!handleValidChange) {
        handleValidChange(valid);
      }
    }
  }, {
    key: "render",
    value: function render() {
      var _this$props = this.props,
          id = _this$props.id,
          label = _this$props.label,
          placeholder = _this$props.placeholder,
          type = _this$props.type;
      var _this$state = this.state,
          message = _this$state.message,
          valid = _this$state.valid,
          value = _this$state.value;
      var props = {
        id: id,
        label: label,
        value: value,
        placeholder: placeholder,
        type: type,
        message: message,
        valid: valid,
        onChange: this.handleChange,
        formType: this.context
      };
      return createElement(Input, props);
    }
  }, {
    key: "validations",
    get: function get() {
      return this.validator.validations;
    }
  }, {
    key: "validator",
    get: function get() {
      return this.props.validator;
    }
  }]);

  return InputContainer;
}(React.Component);
InputContainer.contextType = FormContext;