rc-form - npm Package Compare versions

Comparing version 0.3.1 to 0.4.0

lib/createForm.js

@@ -32,3 +32,3 @@ 'use strict';
 // avoid concurrency problems
-var actionId = 0;
+var gid = 0;
 
@@ -56,10 +56,10 @@ function createForm() {
         _get(Object.getPrototypeOf(Form.prototype), 'constructor', this).apply(this, args);
-        var state = undefined;
+        var fields = undefined;
         if (mapPropsToFields) {
-          state = mapPropsToFields(this.props);
+          fields = mapPropsToFields(this.props);
         }
-        this.state = state || {};
+        this.fields = fields || {};
         this.fieldsMeta = {};
         this.cachedBind = {};
-        var bindMethods = ['getFieldProps', 'isFieldValidating', 'getFieldError', 'removeFields', 'validateFieldsByName', 'getFieldsValue', 'setFieldsValue', 'getFieldValue'];
+        var bindMethods = ['getFieldProps', 'isFieldValidating', 'getFieldError', 'validateFieldsByName', 'getFieldsValue', 'setFieldsValue', 'getFieldValue'];
         bindMethods.forEach(function (m) {
@@ -74,5 +74,5 @@ _this[m] = _this[m].bind(_this);
           if (mapPropsToFields) {
-            var state = mapPropsToFields(nextProps);
-            if (state) {
-              this.setState(state);
+            var fields = mapPropsToFields(nextProps);
+            if (fields) {
+              this.fields = _extends({}, this.fields, fields);
             }
@@ -82,2 +82,15 @@ }
       }, {
+        key: 'componentDidUpdate',
+        value: function componentDidUpdate() {
+          var fields = this.fields;
+          var fieldsMeta = this.fieldsMeta;
+
+          var fieldsKeys = Object.keys(fields);
+          fieldsKeys.forEach(function (s) {
+            if (!fieldsMeta[s]) {
+              delete fields[s];
+            }
+          });
+        }
+      }, {
         key: 'onChange',
@@ -87,5 +100,2 @@ value: function onChange(name, event) {
           var rules = fieldMeta.rules;
-          if (rules) {
-            fieldMeta.actionId = ++actionId;
-          }
           var value = (0, _utils.getValueFromEvent)(event);
@@ -95,3 +105,4 @@ var field = this.getField(name, true);
             value: value,
-            dirty: !!rules
+            dirty: !!rules,
+            sid: ++gid
           })));
@@ -125,3 +136,3 @@ }
         value: function getField(name, copy) {
-          var ret = this.state[name];
+          var ret = this.fields[name];
           if (ret) {
@@ -145,4 +156,4 @@ ret.name = name;
           var trigger = _fieldOption$trigger === undefined ? 'onChange' : _fieldOption$trigger;
-          var _fieldOption$initialValue = fieldOption.initialValue;
-          var initialValue = _fieldOption$initialValue === undefined ? undefined : _fieldOption$initialValue;
+          var hidden = fieldOption.hidden;
+          var initialValue = fieldOption.initialValue;
           var _fieldOption$validateTrigger = fieldOption.validateTrigger;
@@ -154,7 +165,16 @@ var validateTrigger = _fieldOption$validateTrigger === undefined ? 'onChange' : _fieldOption$validateTrigger;
           };
+          var originalTriggerFn = undefined;
           if (rules && validateTrigger) {
+            originalTriggerFn = inputProps[validateTrigger];
             inputProps[validateTrigger] = this.getCacheBind(name, validateTrigger, this.onChangeValidate);
+            if (originalTriggerFn) {
+              inputProps[validateTrigger] = (0, _utils.createChainedFunction)(originalTriggerFn, inputProps[validateTrigger]);
+            }
           }
           if (trigger && (validateTrigger !== trigger || !rules)) {
+            originalTriggerFn = inputProps[trigger];
             inputProps[trigger] = this.getCacheBind(name, trigger, this.onChange);
+            if (originalTriggerFn) {
+              inputProps[trigger] = (0, _utils.createChainedFunction)(originalTriggerFn, inputProps[trigger]);
+            }
           }
@@ -165,6 +185,7 @@ var field = this.getField(name);
           }
-          var fieldMeta = this.fieldsMeta[name] || {};
-          fieldMeta.rules = rules;
-          fieldMeta.initialValue = initialValue;
-          this.fieldsMeta[name] = fieldMeta;
+          this.fieldsMeta[name] = {
+            rules: rules,
+            hidden: hidden,
+            initialValue: initialValue
+          };
           return inputProps;
@@ -184,2 +205,10 @@ }
       }, {
+        key: 'getValidFieldsName',
+        value: function getValidFieldsName() {
+          var fieldsMeta = this.fieldsMeta;
+          return Object.keys(this.fieldsMeta).filter(function (name) {
+            return !fieldsMeta[name].hidden;
+          });
+        }
+      }, {
         key: 'getFieldsValue',
@@ -189,3 +218,3 @@ value: function getFieldsValue(names) {
 
-          var fields = names || Object.keys(this.state);
+          var fields = names || this.getValidFieldsName();
           var allValues = {};
@@ -200,6 +229,6 @@ fields.forEach(function (f) {
         value: function getFieldValue(name) {
-          var state = this.state;
+          var fields = this.fields;
           var fieldsMeta = this.fieldsMeta;
 
-          var field = state[name];
+          var field = fields[name];
           if (field && 'value' in field) {
@@ -221,3 +250,2 @@ return field.value;
             isFieldValidating: this.isFieldValidating,
-            removeFields: this.removeFields,
             validateFields: this.validateFieldsByName
@@ -229,3 +257,4 @@ };
         value: function setFields(fields) {
-          this.setState(fields);
+          this.fields = _extends({}, this.fields, fields);
+          this.forceUpdate();
           if (onFieldsChange) {
@@ -254,4 +283,4 @@ onFieldsChange(this.props, fields);
 
-          var currentActionId = actionId;
-          ++actionId;
+          var currentGlobalId = gid;
+          ++gid;
           var allRules = {};
@@ -261,3 +290,2 @@ var allValues = {};
           var alreadyErrors = {};
-
           fields.forEach(function (field) {
@@ -275,3 +303,3 @@ var name = field.name;
             field.dirty = true;
-            fieldMeta.actionId = currentActionId;
+            field.sid = currentGlobalId;
             allRules[name] = fieldMeta.rules;
@@ -281,5 +309,3 @@ allValues[name] = field.value;
           });
-
           this.setFields(allFields);
-
           if (callback && (0, _utils.isEmptyObject)(allFields)) {
@@ -289,3 +315,2 @@ callback((0, _utils.isEmptyObject)(alreadyErrors) ? null : alreadyErrors, this.getFieldsValue(fieldNames));
           }
-
           new _asyncValidator2['default'](allRules).validate(allValues, function (errors) {
@@ -302,28 +327,18 @@ var errorsGroup = _extends({}, alreadyErrors);
             var expired = false;
-
+            var nowAllFields = {};
             Object.keys(allRules).forEach(function (name) {
-              var nowFieldMeta = _this3.getFieldMeta(name);
-              // prevent concurrency call
-              if (nowFieldMeta && nowFieldMeta.actionId !== currentActionId) {
+              var fieldErrors = errorsGroup[name];
+              var nowField = _this3.getField(name, true);
+              if (nowField.sid !== currentGlobalId) {
                 expired = true;
+              } else {
+                nowField.errors = fieldErrors && (0, _utils.getErrorStrs)(fieldErrors);
+                nowField.validating = false;
+                nowField.dirty = false;
+                nowField.value = allValues[name];
+                nowAllFields[name] = nowField;
               }
             });
-
-            if (expired) {
-              return;
-            }
-
-            var nowAllFields = {};
-
-            Object.keys(allRules).forEach(function (name) {
-              var fieldErrors = errorsGroup[name];
-              var nowFieldStatus = _this3.getField(name, true);
-              nowFieldStatus.errors = fieldErrors && (0, _utils.getErrorStrs)(fieldErrors);
-              nowFieldStatus.validating = false;
-              nowFieldStatus.dirty = false;
-              nowFieldStatus.value = allValues[name];
-              nowAllFields[name] = nowFieldStatus;
-            });
             _this3.setFields(nowAllFields);
-            if (callback) {
+            if (callback && !expired) {
               callback((0, _utils.isEmptyObject)(errorsGroup) ? null : errorsGroup, _this3.getFieldsValue(fieldNames));
@@ -344,3 +359,3 @@ }
           }
-          var fieldNames = names || Object.keys(this.fieldsMeta);
+          var fieldNames = names || this.getValidFieldsName();
           var fields = fieldNames.map(function (name) {
@@ -373,19 +388,6 @@ var fieldMeta = _this4.getFieldMeta(name);
       }, {
-        key: 'removeFields',
-        value: function removeFields(names) {
-          var _this5 = this;
-
-          var fields = {};
-          names.forEach(function (name) {
-            if (_this5.fieldsMeta[name]) {
-              delete _this5.fieldsMeta[name];
-              fields[name] = undefined;
-            }
-          });
-          this.setFields(fields);
-        }
-      }, {
         key: 'render',
         value: function render() {
           var formProps = _defineProperty({}, formPropName, this.getForm());
+          this.fieldsMeta = {};
           return _react2['default'].createElement(WrappedComponent, _extends({}, formProps, this.props));
@@ -392,0 +394,0 @@ }

lib/utils.js

@@ -10,2 +10,3 @@ 'use strict';
 exports.isEmptyObject = isEmptyObject;
+exports.createChainedFunction = createChainedFunction;
 
@@ -30,3 +31,8 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
   // support custom element
-  return e && e.target ? e.target.value : e;
+  if (!e || !e.target) {
+    return e;
+  }
+  var target = e.target;
+
+  return target.type === 'checkbox' ? target.checked : target.value;
 }
@@ -48,2 +54,13 @@
   return Object.keys(obj).length === 0;
+}
+
+function createChainedFunction() {
+  var args = arguments;
+  return function chainedFunction() {
+    for (var i = 0; i < args.length; i++) {
+      if (args[i] && args[i].apply) {
+        args[i].apply(this, arguments);
+      }
+    }
+  };
 }

package.json

 {
   "name": "rc-form",
-  "version": "0.3.1",
+  "version": "0.4.0",
   "description": "React High Order Form Component",
@@ -5,0 +5,0 @@ "keywords": [

README.md

@@ -83,3 +83,3 @@ # rc-form
 
-Will pass a object as prop form with the following memebers to WrappedComponent:
+Will pass a object as prop form with the following members to WrappedComponent:
 
@@ -100,2 +100,6 @@ ### Object: getFieldProps(name, option)
 
+#### option.trigger
+
+type: String. event which is listened to collect form data. Default to 'onChange', set to false to stop collect form data.
+
 #### option.rules
@@ -102,0 +106,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

245938

increased by0.36%

Lines of code

4575

increased by0.55%

Number of lines in readme file

138

increased by2.99%

Number of medium supply chain risk alerts

1

decreased by-50%

No dependency changes