react-form-controlled/module/Form.js

Intuitive react forms for building powerful applications

function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { step("next", value); }, function (err) { step("throw", err); }); } } return step("next"); }); }; }

import { createElement } from 'react';
import PropTypes from 'prop-types';
import Fieldset from './Fieldset';

export default class Form extends Fieldset {

  constructor(...args) {
    var _this;

    _this = super(...args);

    this.onSubmit = (() => {
      var _ref = _asyncToGenerator(function* (evn) {
        evn.preventDefault();

        if (_this.working) {
          return;
        }

        _this.working = true;
        _this.notifyChildren();

        const { onSubmit, onError, validate } = _this.props;
        const value = _this.getValue();

        _this.errors = validate ? yield validate(value) : [];

        const { errors } = _this;

        if (!errors.length && onSubmit) {
          yield onSubmit(value);
        } else if (errors && errors.length && onError) {
          yield onError(errors, value);
        }

        _this.working = false;
        _this.notifyChildren();
      });

      return function (_x) {
        return _ref.apply(this, arguments);
      };
    })();

    this.defaultValue = this.props.defaultValue;
  }

  getCurrentValue(props) {
    const { defaultValue } = this;
    const { value } = props;

    return defaultValue !== undefined ? defaultValue : value;
  }

  componentWillReceiveProps(props) {
    // reinit default value
    const { enableReinitialize, defaultValue } = props;
    if (enableReinitialize && defaultValue !== this.props.defaultValue) {
      this.defaultValue = defaultValue;
    }

    const value = this.getCurrentValue(props);
    this.setValue(value, this, true);
  }

  getPath() {
    return undefined;
  }

  getOriginalValue() {
    return this.getCurrentValue(this.props);
  }

  getParent() {
    const { ignoreParent } = this.props;
    if (ignoreParent) {
      return undefined;
    }

    return super.getParent();
  }

  getForm() {
    const { ignoreParent } = this.props;
    if (ignoreParent) {
      return this;
    }

    const parent = this.getParent();
    return parent ? parent.getForm() : this;
  }

  getErrors(path, exactMatch) {
    const errors = this.errors || [];
    if (!path) {
      return errors;
    }

    const parentPath = `${path}.`;

    return errors.filter(error => {
      if (!error.path) {
        return false;
      }

      if (error.path === path) {
        return true;
      }

      if (!exactMatch && error.path.indexOf(parentPath) === 0) {
        return true;
      }

      return false;
    });
  }

  hasErrors(path, exact) {
    return !!this.getErrors(path, exact).length;
  }

  isValid(path, exact) {
    return !this.hasErrors(path, exact);
  }

  isWorking() {
    return !!this.working;
  }

  setValue(value, component, notifyChildren) {
    this.clearErrors();

    super.setValue(value, component, notifyChildren);
  }

  clearErrors() {
    this.errors = [];
  }

  getClassName() {
    const { className, tagName } = this.props;
    return className || tagName;
  }

  render() {
    const {
      autoComplete, tagName, children, method, action
    } = this.props;

    const props = tagName === 'form' ? {
      autoComplete,
      method,
      action,
      className: this.getClassName(),
      onSubmit: this.onSubmit
    } : {
      className: this.getClassName()
    };

    return createElement(tagName, props, this.processChildren(children));
  }
}
Form.propTypes = {
  onSubmit: PropTypes.func,
  onChange: PropTypes.func,
  onError: PropTypes.func,
  skipReplace: PropTypes.bool,
  value: PropTypes.any, // eslint-disable-line
  method: PropTypes.string,
  action: PropTypes.string,
  autoComplete: PropTypes.string,
  children: PropTypes.node,
  tagName: PropTypes.string.isRequired,
  debounce: PropTypes.number,
  validate: PropTypes.func,
  sameChildren: PropTypes.bool,
  defaultValue: PropTypes.any, // eslint-disable-line
  enableReinitialize: PropTypes.bool,
  ignoreParent: PropTypes.bool
};
Form.defaultProps = {
  autoComplete: 'off',
  tagName: 'form',
  debounce: 250,
  enableReinitialize: false,
  ignoreParent: false
};
Form.childContextTypes = {
  fieldset: PropTypes.object.isRequired
};
Form.contextTypes = {
  fieldset: PropTypes.object
};
//# sourceMappingURL=Form.js.map