@6thquake/react-material/TextField/TextField.js

React components that implement Google's Material Design.

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _react = _interopRequireWildcard(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _formsyReact = require("formsy-react");

var _recompose = require("recompose");

var _TextField = _interopRequireDefault(require("@material-ui/core/TextField"));

var _withFormItem = _interopRequireDefault(require("../Form/withFormItem"));

var _withForm = _interopRequireDefault(require("../Form/withForm"));

var _withStyles = _interopRequireDefault(require("../styles/withStyles"));

/**
 * @ignore - do not document.
 */
var style = function style(theme) {
  return {};
};

var TextField =
/*#__PURE__*/
function (_Component) {
  (0, _inherits2.default)(TextField, _Component);

  function TextField() {
    var _getPrototypeOf2;

    var _this;

    (0, _classCallCheck2.default)(this, TextField);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(TextField)).call.apply(_getPrototypeOf2, [this].concat(args)));

    _this.onChange = function (event) {
      // setValue() will set the value of the component, which in
      // turn will validate it and the rest of the form
      // Important: Don't skip this step. This pattern is required
      // for Formsy to work.
      var value = event.target.value;

      _this.props.setValue(value);

      var onChange = _this.props.onChange;
      onChange && onChange(event, value);
    };

    return _this;
  }

  (0, _createClass2.default)(TextField, [{
    key: "renderFormComponent",
    value: function renderFormComponent() {
      var _this$props = this.props,
          getErrorMessage = _this$props.getErrorMessage,
          getErrorMessages = _this$props.getErrorMessages,
          getValue = _this$props.getValue,
          hasValue = _this$props.hasValue,
          isFormDisabled = _this$props.isFormDisabled,
          isValid = _this$props.isValid,
          isPristine = _this$props.isPristine,
          isFormSubmitted = _this$props.isFormSubmitted,
          isRequired = _this$props.isRequired,
          isValidValue = _this$props.isValidValue,
          resetValue = _this$props.resetValue,
          setValidations = _this$props.setValidations,
          setValue = _this$props.setValue,
          showRequired = _this$props.showRequired,
          showError = _this$props.showError,
          validationError = _this$props.validationError,
          validationErrors = _this$props.validationErrors,
          validations = _this$props.validations,
          innerRef = _this$props.innerRef,
          value = _this$props.value,
          onChange = _this$props.onChange,
          rest = (0, _objectWithoutProperties2.default)(_this$props, ["getErrorMessage", "getErrorMessages", "getValue", "hasValue", "isFormDisabled", "isValid", "isPristine", "isFormSubmitted", "isRequired", "isValidValue", "resetValue", "setValidations", "setValue", "showRequired", "showError", "validationError", "validationErrors", "validations", "innerRef", "value", "onChange"]);
      var error = false;
      var helperText = ' ';
      var isDisabled = isFormDisabled();

      if (!isDisabled) {
        if (!isPristine()) {
          helperText = getErrorMessage() || ' ';
          error = !isValid();
        }
      }

      return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_TextField.default, (0, _extends2.default)({
        error: error,
        value: getValue(),
        helperText: helperText,
        disabled: isDisabled,
        onChange: this.onChange
      }, rest)));
    }
  }, {
    key: "render",
    value: function render() {
      return this.renderFormComponent();
    }
  }]);
  return TextField;
}(_react.Component);

TextField.displayName = 'TextField';
TextField.propTypes = (0, _extends2.default)({
  classes: _propTypes.default.object.isRequired
}, _formsyReact.propTypes);
TextField.defaultProps = {};
var FormComponent = (0, _recompose.compose)(_formsyReact.withFormsy, _withFormItem.default, (0, _withStyles.default)(style, {
  name: 'RMTextField'
}))(TextField);

var _default = (0, _recompose.compose)(_withForm.default)(FormComponent, _TextField.default);

exports.default = _default;