shineout 1.7.1 → 1.8.0-beta.2

package/es/Form/Field.js

@@ -1,59 +1,83 @@
-import { cloneElement, isValidElement, Component } from 'react'
-import PropTypes from 'prop-types'
-import shallowEqual from '../utils/shallowEqual'
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import { cloneElement, isValidElement, Component } from 'react';
+import PropTypes from 'prop-types';
+import shallowEqual from '../utils/shallowEqual';
 
-class Field extends Component {
-  constructor(props) {
-    super(props)
-    this.handleChange = this.handleChange.bind(this)
+var Field =
+/*#__PURE__*/
+function (_Component) {
+  _inheritsLoose(Field, _Component);
 
-    this.cacheChildren = undefined
-    this.cacheElement = null
-  }
+  function Field(props) {
+    var _this;
 
-  shouldComponentUpdate(nextProps) {
-    const options = this.props.cache ? { skip: ['children'] } : {}
-    return !(shallowEqual(this.props, nextProps, options))
+    _this = _Component.call(this, props) || this;
+    _this.handleChange = _this.handleChange.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.cacheChildren = undefined;
+    _this.cacheElement = null;
+    return _this;
   }
 
-  handleChange(value) {
+  var _proto = Field.prototype;
+
+  _proto.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
+    var options = this.props.cache ? {
+      skip: ['children']
+    } : {};
+    return !shallowEqual(this.props, nextProps, options);
+  };
+
+  _proto.handleChange = function handleChange(value) {
     if (value && value.nativeEvent) {
       // eslint-disable-next-line
-      value = value.target.value
+      value = value.target.value;
     }
 
-    this.props.onChange(value)
-  }
+    this.props.onChange(value);
+  };
 
-  render() {
-    const { children, value, error } = this.props
+  _proto.render = function render() {
+    var _this$props = this.props,
+        children = _this$props.children,
+        value = _this$props.value,
+        error = _this$props.error,
+        disabled = _this$props.disabled;
 
     if (typeof children === 'function') {
-      return children({ value, error, onChange: this.handleChange })
+      return children({
+        value: value,
+        error: error,
+        onChange: this.handleChange,
+        disabled: disabled
+      });
     }
 
     if (isValidElement(children)) {
-      return cloneElement(children, { value, error, onChange: this.handleChange })
+      return cloneElement(children, {
+        value: value,
+        error: error,
+        onChange: this.handleChange,
+        disabled: disabled
+      });
     }
 
-    console.error(new Error('Form.Field expect a single ReactElement or a function.'))
-    return null
-  }
-}
+    console.error(new Error('Form.Field expect a single ReactElement or a function.'));
+    return null;
+  };
+
+  return Field;
+}(Component);
 
 Field.propTypes = {
   cache: PropTypes.bool,
-  children: PropTypes.oneOfType([
-    PropTypes.func,
-    PropTypes.element,
-  ]).isRequired,
+  children: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).isRequired,
   error: PropTypes.object,
   onChange: PropTypes.func.isRequired,
   value: PropTypes.any,
-}
-
+  disabled: PropTypes.bool
+};
 Field.defaultProps = {
-  cache: false,
-}
-
-export default Field
+  cache: false
+};
+export default Field;

package/es/Form/FieldError.js

@@ -1,27 +1,33 @@
-import React, { PureComponent } from 'react'
-import PropTypes from 'prop-types'
-import { formClass } from './styles'
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import React, { PureComponent } from 'react';
+import PropTypes from 'prop-types';
+import { formClass } from './styles';
 
-class FieldError extends PureComponent {
-  render() {
-    let { error } = this.props
+var FieldError =
+/*#__PURE__*/
+function (_PureComponent) {
+  _inheritsLoose(FieldError, _PureComponent);
 
-    // eslint-disable-next-line
-    if (Array.isArray(error)) error = error[0]
+  function FieldError() {
+    return _PureComponent.apply(this, arguments) || this;
+  }
 
-    if (!(error instanceof Error)) return null
+  var _proto = FieldError.prototype;
 
-    return (
-      <div className={formClass('error')}>{error.message}</div>
-    )
-  }
-}
+  _proto.render = function render() {
+    var error = this.props.error; // eslint-disable-next-line
 
-FieldError.propTypes = {
-  error: PropTypes.oneOfType([
-    PropTypes.array,
-    PropTypes.object,
-  ]),
-}
+    if (Array.isArray(error)) error = error[0];
+    if (!(error instanceof Error)) return null;
+    return React.createElement("div", {
+      className: formClass('error')
+    }, error.message);
+  };
 
-export default FieldError
+  return FieldError;
+}(PureComponent);
+
+FieldError.propTypes = {
+  error: PropTypes.oneOfType([PropTypes.array, PropTypes.object])
+};
+export default FieldError;

package/es/Form/FieldSet.js

@@ -1,155 +1,214 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import createReactContext from '../context'
-import { Component } from '../component'
-import { filterProps } from '../utils/objects'
-import validate from '../utils/validate'
-import { FormError, isSameError } from '../utils/errors'
-import { ERROR_TYPE, FORCE_PASS, IGNORE_VALIDATE } from '../Datum/types'
-import FieldError from './FieldError'
-
-const { Provider, Consumer } = createReactContext()
-
-const extendName = (path = '', name) => {
-  if (name === undefined) return undefined
-  if (name === '') return path
-  if (Array.isArray(name)) return name.map(n => extendName(path, n))
-  return `${path}${path.length > 0 ? '.' : ''}${name}`
-}
-
-class FieldSet extends Component {
-  constructor(props) {
-    super(props)
-
-    this.validate = this.validate.bind(this)
-    this.handleUpdate = this.handleUpdate.bind(this)
+import _extends from "@babel/runtime/helpers/extends";
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import React from 'react';
+import PropTypes from 'prop-types';
+import createReactContext from '../context';
+import { Component } from '../component';
+import { filterProps } from '../utils/objects';
+import _validate from '../utils/validate';
+import { FormError, isSameError } from '../utils/errors';
+import { ERROR_TYPE, FORCE_PASS, IGNORE_VALIDATE } from '../Datum/types';
+import FieldError from './FieldError';
+
+var _createReactContext = createReactContext(),
+    Provider = _createReactContext.Provider,
+    Consumer = _createReactContext.Consumer;
+
+var extendName = function extendName(path, name) {
+  if (path === void 0) {
+    path = '';
   }
 
-  componentDidMount() {
-    super.componentDidMount()
-    const { formDatum, name, defaultValue } = this.props
-    formDatum.bind(name, this.handleUpdate, defaultValue, this.validate)
+  if (name === undefined) return undefined;
+  if (name === '') return path;
+  if (Array.isArray(name)) return name.map(function (n) {
+    return extendName(path, n);
+  });
+  return "" + path + (path.length > 0 ? '.' : '') + name;
+};
+
+var FieldSet =
+/*#__PURE__*/
+function (_Component) {
+  _inheritsLoose(FieldSet, _Component);
+
+  function FieldSet(props) {
+    var _this;
+
+    _this = _Component.call(this, props) || this;
+    _this.validate = _this.validate.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.handleUpdate = _this.handleUpdate.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    return _this;
   }
 
-  componentWillUnmount() {
-    super.componentWillUnmount()
-    const { formDatum, name } = this.props
-    formDatum.unbind(name, this.handleUpdate)
-  }
-
-  validate() {
-    const { formDatum, name } = this.props
-    const value = formDatum.get(name)
-    const data = formDatum.getValue()
-    const validateProps = filterProps(this.props, v => typeof v === 'string' || typeof v === 'number')
-    validateProps.type = 'array'
-    let rules = [...this.props.rules]
-    rules = rules.concat(formDatum.getRule(name))
-
-    if (rules.length === 0) return Promise.resolve(true)
-
-    return validate(value, data, rules, validateProps).then(
-      () => {
-        this.handleError()
-        return true
-      },
-      e => {
-        this.handleError(e)
-        return new FormError(e)
-      }
-    )
-  }
-
-  updateWithValidate() {
-    this.validate().then(() => {
-      this.forceUpdate()
-    })
-  }
-
-  handleError(error) {
-    const { formDatum, name, onError } = this.props
-    if (isSameError(error, formDatum.getError(name, true))) return
-    formDatum.setError(name, error, true)
-    if (onError) onError(error)
-  }
-
-  handleUpdate(v, n, type) {
-    if (this.updateTimer) clearTimeout(this.updateTimer)
-    this.updateTimer = setTimeout(() => {
+  var _proto = FieldSet.prototype;
+
+  _proto.componentDidMount = function componentDidMount() {
+    _Component.prototype.componentDidMount.call(this);
+
+    var _this$props = this.props,
+        formDatum = _this$props.formDatum,
+        name = _this$props.name,
+        defaultValue = _this$props.defaultValue;
+    formDatum.bind(name, this.handleUpdate, defaultValue, this.validate);
+  };
+
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    _Component.prototype.componentWillUnmount.call(this);
+
+    var _this$props2 = this.props,
+        formDatum = _this$props2.formDatum,
+        name = _this$props2.name;
+    formDatum.unbind(name, this.handleUpdate);
+  };
+
+  _proto.validate = function validate() {
+    var _this2 = this;
+
+    var _this$props3 = this.props,
+        formDatum = _this$props3.formDatum,
+        name = _this$props3.name;
+    var value = formDatum.get(name);
+    var data = formDatum.getValue();
+    var validateProps = filterProps(this.props, function (v) {
+      return typeof v === 'string' || typeof v === 'number';
+    });
+    validateProps.type = 'array';
+    var rules = [].concat(this.props.rules);
+    rules = rules.concat(formDatum.getRule(name));
+    if (rules.length === 0) return Promise.resolve(true);
+    return _validate(value, data, rules, validateProps).then(function () {
+      _this2.handleError();
+
+      return true;
+    }, function (e) {
+      _this2.handleError(e);
+
+      return new FormError(e);
+    });
+  };
+
+  _proto.updateWithValidate = function updateWithValidate() {
+    var _this3 = this;
+
+    this.validate().then(function () {
+      _this3.forceUpdate();
+    });
+  };
+
+  _proto.handleError = function handleError(error) {
+    var _this$props4 = this.props,
+        formDatum = _this$props4.formDatum,
+        name = _this$props4.name,
+        onError = _this$props4.onError;
+    if (isSameError(error, formDatum.getError(name, true))) return;
+    formDatum.setError(name, error, true);
+    if (onError) onError(error);
+  };
+
+  _proto.handleUpdate = function handleUpdate(v, n, type) {
+    var _this4 = this;
+
+    if (this.updateTimer) clearTimeout(this.updateTimer);
+    this.updateTimer = setTimeout(function () {
       if (type === ERROR_TYPE || type === FORCE_PASS || type === IGNORE_VALIDATE) {
-        this.forceUpdate()
+        _this4.forceUpdate();
       } else {
-        this.updateWithValidate()
+        _this4.updateWithValidate();
       }
-    })
-  }
-
-  handleInsert(index, value) {
-    const { formDatum, name } = this.props
-    formDatum.insert(name, index, value)
-    this.updateWithValidate()
-  }
-
-  handleRemove(index) {
-    const { formDatum, name } = this.props
-    formDatum.splice(name, index)
-    this.updateWithValidate()
-  }
-
-  handleChange(index, value, update) {
-    const { formDatum, name } = this.props
-    formDatum.set(`${name}[${index}]`, value)
-    if (update) this.updateWithValidate()
-  }
-
-  render() {
-    const { children, formDatum, name, empty, defaultValue } = this.props
-
-    const errors = formDatum.getError(name)
-    const result = []
+    });
+  };
+
+  _proto.handleInsert = function handleInsert(index, value) {
+    var _this$props5 = this.props,
+        formDatum = _this$props5.formDatum,
+        name = _this$props5.name;
+    formDatum.insert(name, index, value);
+    this.updateWithValidate();
+  };
+
+  _proto.handleRemove = function handleRemove(index) {
+    var _this$props6 = this.props,
+        formDatum = _this$props6.formDatum,
+        name = _this$props6.name;
+    formDatum.splice(name, index);
+    this.updateWithValidate();
+  };
+
+  _proto.handleChange = function handleChange(index, value, update) {
+    var _this$props7 = this.props,
+        formDatum = _this$props7.formDatum,
+        name = _this$props7.name;
+    formDatum.set(name + "[" + index + "]", value);
+    if (update) this.updateWithValidate();
+  };
+
+  _proto.render = function render() {
+    var _this5 = this;
+
+    var _this$props8 = this.props,
+        children = _this$props8.children,
+        formDatum = _this$props8.formDatum,
+        name = _this$props8.name,
+        empty = _this$props8.empty,
+        defaultValue = _this$props8.defaultValue;
+    var errors = formDatum.getError(name);
+    var result = [];
 
     if (typeof children !== 'function') {
-      return (
-        <Provider value={{ path: name, val: this.validate }}>
-          {children}
-          {errors instanceof Error && <FieldError key="error" error={errors} />}
-        </Provider>
-      )
+      return React.createElement(Provider, {
+        value: {
+          path: name,
+          val: this.validate
+        }
+      }, children, errors instanceof Error && React.createElement(FieldError, {
+        key: "error",
+        error: errors
+      }));
     }
 
-    let values = formDatum.get(name) || defaultValue || []
-    if (values && !Array.isArray(values)) values = [values]
+    var values = formDatum.get(name) || defaultValue || [];
+    if (values && !Array.isArray(values)) values = [values];
+
     if (values.length === 0 && empty) {
-      result.push(empty(this.handleInsert.bind(this, 0)))
+      result.push(empty(this.handleInsert.bind(this, 0)));
     } else {
-      const errorList = (Array.isArray(errors) ? errors : [errors]).filter(Boolean)
-      console.log(errorList)
-      values.forEach((v, i) => {
-        result.push(
-          <Provider key={i} value={{ path: `${name}[${i}]`, val: this.validate }}>
-            {children({
-              list: values,
-              value: v,
-              index: i,
-              error: errorList,
-              datum: formDatum,
-              onChange: this.handleChange.bind(this, i),
-              onInsert: this.handleInsert.bind(this, i),
-              onAppend: this.handleInsert.bind(this, i + 1),
-              onRemove: this.handleRemove.bind(this, i),
-            })}
-          </Provider>
-        )
-      })
+      var errorList = (Array.isArray(errors) ? errors : [errors]).filter(Boolean);
+      console.log(errorList);
+      values.forEach(function (v, i) {
+        result.push(React.createElement(Provider, {
+          key: i,
+          value: {
+            path: name + "[" + i + "]",
+            val: _this5.validate
+          }
+        }, children({
+          list: values,
+          value: v,
+          index: i,
+          error: errorList,
+          datum: formDatum,
+          onChange: _this5.handleChange.bind(_this5, i),
+          onInsert: _this5.handleInsert.bind(_this5, i),
+          onAppend: _this5.handleInsert.bind(_this5, i + 1),
+          onRemove: _this5.handleRemove.bind(_this5, i)
+        })));
+      });
     }
 
     if (errors instanceof Error) {
-      result.push(<FieldError key="error" error={errors} />)
+      result.push(React.createElement(FieldError, {
+        key: "error",
+        error: errors
+      }));
     }
 
-    return result
-  }
-}
+    return result;
+  };
+
+  return FieldSet;
+}(Component);
 
 FieldSet.propTypes = {
   children: PropTypes.any,
@@ -158,27 +217,26 @@ FieldSet.propTypes = {
   formDatum: PropTypes.object.isRequired,
   name: PropTypes.string.isRequired,
   onError: PropTypes.func,
-  rules: PropTypes.array,
-}
-
+  rules: PropTypes.array
+};
 FieldSet.defaultProps = {
-  rules: [],
-}
-
-export const fieldSetConsumer = Origin => props => (
-  <Consumer>
-    {({ path, val } = {}) => (
-      <Origin
-        {...props}
+  rules: []
+};
+export var fieldSetConsumer = function fieldSetConsumer(Origin) {
+  return function (props) {
+    return React.createElement(Consumer, null, function (_temp) {
+      var _ref = _temp === void 0 ? {} : _temp,
+          path = _ref.path,
+          val = _ref.val;
+
+      return React.createElement(Origin, _extends({}, props, {
         // eslint-disable-next-line
-        name={extendName(path, props.name)}
-        innerFormNamePath={path}
-        fieldSetValidate={val}
-      />
-    )}
-  </Consumer>
-)
-
-export const FieldSetProvider = Provider
-
-export default fieldSetConsumer(FieldSet)
+        name: extendName(path, props.name),
+        innerFormNamePath: path,
+        fieldSetValidate: val
+      }));
+    });
+  };
+};
+export var FieldSetProvider = Provider;
+export default fieldSetConsumer(FieldSet);