@hi-ui/form 4.0.0-beta.8 → 4.0.1

package/lib/esm/FormSubmit.js

@@ -2,7 +2,7 @@
  * @hi-ui/form
  * https://github.com/XiaoMi/hiui/tree/master/packages/ui/form#readme
  *
- * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -47,8 +47,10 @@ var FormSubmit = /*#__PURE__*/forwardRef(function (_a, ref) {
       evt.preventDefault();
       evt.stopPropagation();
       submitForm().then(function (result) {
+        // @ts-ignore
         _onClick === null || _onClick === void 0 ? void 0 : _onClick(result, null);
       })["catch"](function (error) {
+        // @ts-ignore
         _onClick === null || _onClick === void 0 ? void 0 : _onClick(null, error);
       });
     }
@@ -60,4 +62,3 @@ if (__DEV__) {
 }
 
 export { FormSubmit };
-//# sourceMappingURL=FormSubmit.js.map

package/lib/esm/context.js

@@ -2,7 +2,7 @@
  * @hi-ui/form
  * https://github.com/XiaoMi/hiui/tree/master/packages/ui/form#readme
  *
- * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -22,4 +22,3 @@ var useFormContext = function useFormContext() {
 };
 
 export { FormProvider, useFormContext };
-//# sourceMappingURL=context.js.map

package/lib/esm/index.js

@@ -2,7 +2,7 @@
  * @hi-ui/form
  * https://github.com/XiaoMi/hiui/tree/master/packages/ui/form#readme
  *
- * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -24,5 +24,4 @@ var Form = Object.assign(Form$1, {
   Submit: FormSubmit,
   Reset: FormReset
 });
-export default Form;
-//# sourceMappingURL=index.js.map
+export { Form as default };

package/lib/esm/styles/index.scss.js

@@ -2,16 +2,14 @@
  * @hi-ui/form
  * https://github.com/XiaoMi/hiui/tree/master/packages/ui/form#readme
  *
- * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-form {\n  max-width: 100%;\n  position: relative; }\n.hi-v4-form fieldset {\n    margin: 0;\n    padding: 0;\n    border: 0; }\n.hi-v4-form fieldset + fieldset {\n      margin-top: 16px; }\n.hi-v4-form legend {\n    margin: 0 0 16px;\n    color: var(--hi-v4-color-gray-800, #1f2937); }\n.hi-v4-form--placement-horizontal {\n    display: -webkit-box;\n    display: -ms-flexbox;\n    display: flex;\n    -ms-flex-wrap: wrap;\n        flex-wrap: wrap; }\n.hi-v4-form--placement-horizontal .hi-v4-form-label__indent {\n      min-height: 32px; }\n.hi-v4-form-label {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  font-size: var(--hi-v4-text-size-normal, 0.875rem);\n  margin-right: var(--hi-v4-spacing-4, 8px);\n  margin-bottom: 24px; }\n.hi-v4-form-label__text, .hi-v4-form-label__indent {\n    -ms-flex-negative: 0;\n        flex-shrink: 0;\n    -webkit-box-sizing: border-box;\n            box-sizing: border-box;\n    vertical-align: top;\n    color: var(--hi-v4-color-gray-800, #1f2937);\n    overflow-wrap: break-word; }\n.hi-v4-form-label__text {\n    padding-right: var(--hi-v4-spacing-6, 12px);\n    min-height: 32px;\n    line-height: 32px; }\n.hi-v4-form-label--placement-left .hi-v4-form-label__text {\n      text-align: left; }\n.hi-v4-form-label--placement-right .hi-v4-form-label__text {\n      text-align: right; }\n.hi-v4-form-label--placement-top .hi-v4-form-label__text {\n      height: 22px;\n      padding-right: 8px;\n      margin-bottom: 8px; }\n.hi-v4-form-label--required .hi-v4-form-label__text::before {\n      margin-right: var(--hi-v4-spacing-2, 4px);\n      content: '*';\n      color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }\n.hi-v4-form-label--placement-top {\n    text-align: left;\n    -webkit-box-orient: vertical;\n    -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n            flex-direction: column;\n    margin-bottom: var(--hi-v4-spacing-10, 20px);\n    padding-right: 0; }\n.hi-v4-form-label__content {\n    -webkit-box-flex: 1;\n        -ms-flex: 1 1;\n            flex: 1 1;\n    position: relative;\n    vertical-align: top;\n    min-height: 32px;\n    -ms-flex-negative: 0;\n        flex-shrink: 0; }\n.hi-v4-form-message {\n  display: block;\n  font-size: var(--hi-v4-text-size-normal, 0.875rem);\n  min-height: 24px;\n  padding: 2px 0;\n  -webkit-box-sizing: border-box;\n          box-sizing: border-box;\n  line-height: 20px;\n  -webkit-transform: translateY(-10%);\n          transform: translateY(-10%);\n  opacity: 0;\n  color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959));\n  -webkit-transition: all 0.3s;\n  transition: all 0.3s; }\n.hi-v4-form-message--show {\n    opacity: 1;\n    -webkit-transform: translateY(0);\n            transform: translateY(0); }\n.hi-v4-form-item {\n  position: relative; }\n.hi-v4-form-item__message {\n    position: absolute; }\n";
-
-var __styleInject__ = require('style-inject/dist/style-inject.es.js')["default"];
+import __styleInject__ from 'inject-head-style';
+var css_248z = ".hi-v4-form {max-width: 100%;position: relative; }.hi-v4-form fieldset {margin: 0;padding: 0;border: 0; }.hi-v4-form fieldset + fieldset {margin-top: 16px; }.hi-v4-form legend {margin: 0 0 16px;color: var(--hi-v4-color-gray-800, #1f2937); }.hi-v4-form--placement-horizontal {display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-column-gap: var(--hi-v4-spacing-10, 20px);-moz-column-gap: var(--hi-v4-spacing-10, 20px);column-gap: var(--hi-v4-spacing-10, 20px); }.hi-v4-form--placement-horizontal .hi-v4-form-label__indent {min-height: var(--hi-v4-height-8, 32px); }.hi-v4-form-label {display: -webkit-box;display: -ms-flexbox;display: flex;font-size: var(--hi-v4-text-size-md, 0.875rem);-webkit-box-sizing: border-box;box-sizing: border-box;margin-right: 0;margin-bottom: var(--hi-v4-spacing-12, 24px); }.hi-v4-form-label__text, .hi-v4-form-label__indent {-ms-flex-negative: 0;flex-shrink: 0;-webkit-box-sizing: border-box;box-sizing: border-box;vertical-align: top;color: var(--hi-v4-color-gray-800, #1f2937);overflow-wrap: break-word; }.hi-v4-form-label__text {padding-right: var(--hi-v4-spacing-6, 12px);min-height: var(--hi-v4-height-8, 32px);line-height: var(--hi-v4-height-8, 32px); }.hi-v4-form-label--placement-left .hi-v4-form-label__text {text-align: left; }.hi-v4-form-label--placement-right .hi-v4-form-label__text {text-align: right; }.hi-v4-form-label--placement-top .hi-v4-form-label__text {height: 22px;min-height: 22px;line-height: 22px;padding-right: 0;margin-bottom: var(--hi-v4-spacing-4, 8px); }.hi-v4-form-label--required .hi-v4-form-label__text::before {margin-right: var(--hi-v4-spacing-2, 4px);content: '*';color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959)); }.hi-v4-form-label--placement-top {text-align: left;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;margin-bottom: var(--hi-v4-spacing-12, 24px);padding-right: 0; }.hi-v4-form-label__content {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;position: relative;vertical-align: top;min-height: var(--hi-v4-height-8, 32px);-ms-flex-negative: 0;flex-shrink: 0; }.hi-v4-form-label__control {min-width: 1px; }.hi-v4-form-message {display: block;font-size: var(--hi-v4-text-size-md, 0.875rem);min-height: 24px;padding: 2px 0;-webkit-box-sizing: border-box;box-sizing: border-box;line-height: 20px;-webkit-transform: translateY(-10%);transform: translateY(-10%);opacity: 0;color: var(--hi-v4-color-danger-500, var(--hi-v4-color-red-500, #ff5959));-webkit-transition: all 0.3s;transition: all 0.3s; }.hi-v4-form-message--show {opacity: 1;-webkit-transform: translateY(0);transform: translateY(0); }.hi-v4-form-item {position: relative; }.hi-v4-form-item__message {position: absolute; }";
 
 __styleInject__(css_248z);
 
-export default css_248z;
-//# sourceMappingURL=index.scss.js.map
+export { css_248z as default };

package/lib/esm/use-form-field.js

@@ -2,29 +2,26 @@
  * @hi-ui/form
  * https://github.com/XiaoMi/hiui/tree/master/packages/ui/form#readme
  *
- * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
 import { useMemo, useCallback, useEffect } from 'react';
 import { useFormContext } from './context.js';
-import { isArrayNonEmpty, isNullish, isArray } from '@hi-ui/type-assertion';
+import { isArrayNonEmpty } from '@hi-ui/type-assertion';
 import Validater from 'async-validator';
 import { normalizeArray } from '@hi-ui/array-utils';
-import { stringify } from './utils/index.js';
+import { stringify, isValidField } from './utils/index.js';
 
-var useFormField = function useFormField(props) {
+var useFiledRules = function useFiledRules(props) {
   var field = props.field,
       rulesProp = props.rules,
       _props$valueType = props.valueType,
       valueType = _props$valueType === void 0 ? 'any' : _props$valueType;
 
   var _useFormContext = useFormContext(),
-      getFieldRules = _useFormContext.getFieldRules,
-      getFieldProps = _useFormContext.getFieldProps,
-      registerField = _useFormContext.registerField,
-      unregisterField = _useFormContext.unregisterField;
+      getFieldRules = _useFormContext.getFieldRules;
   /**
    * 处理校验规则，item 优先级大于 form
    */
@@ -38,7 +35,19 @@ var useFormField = function useFormField(props) {
         type: valueType
       }, rule);
     });
-  }, [rulesProp, field, getFieldRules, valueType]); // 当前 field 的唯一校验器
+  }, [rulesProp, field, getFieldRules, valueType]);
+  return fieldRules;
+};
+
+var useFormField = function useFormField(props) {
+  var field = props.field;
+
+  var _useFormContext2 = useFormContext(),
+      getFieldProps = _useFormContext2.getFieldProps,
+      registerField = _useFormContext2.registerField,
+      unregisterField = _useFormContext2.unregisterField;
+
+  var fieldRules = useFiledRules(props); // 当前 field 的唯一校验器
 
   var fieldValidate = useCallback(function (value) {
     var _Validater, _validater$validate;
@@ -56,23 +65,16 @@ var useFormField = function useFormField(props) {
   }, [fieldRules, field]); // 注入当前 field 及其验证规则到 Form
 
   useEffect(function () {
-    if (isNullish(field) || field === '') return;
-    if (isArray(field) && field.every(function (item) {
-      return isNullish(item) || item === '';
-    })) return;
+    if (!isValidField(field)) return;
     registerField(field, {
       validate: fieldValidate
     });
     return function () {
-      if (isNullish(field) || field === '') return;
-      if (isArray(field) && field.every(function (item) {
-        return isNullish(item) || item === '';
-      })) return;
+      if (!isValidField(field)) return;
       unregisterField(field);
     };
   }, [registerField, unregisterField, field, fieldValidate]);
   return getFieldProps(props);
 };
 
-export { useFormField };
-//# sourceMappingURL=use-form-field.js.map
+export { useFiledRules, useFormField };

package/lib/esm/use-form.js

@@ -2,17 +2,17 @@
  * @hi-ui/form
  * https://github.com/XiaoMi/hiui/tree/master/packages/ui/form#readme
  *
- * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
 import _regeneratorRuntime from '@babel/runtime/regenerator';
 import { __rest, __awaiter } from 'tslib';
-import { stringify, parse } from './utils/index.js';
+import { stringify, parse, mergeValues, isValidField } from './utils/index.js';
 import React, { useMemo, useReducer, useCallback, useRef } from 'react';
 import { useLatestRef, useLatestCallback } from '@hi-ui/use-latest';
-import { isArray, isObjectLike, isFunction } from '@hi-ui/type-assertion';
+import { isArray, isFunction, isObjectLike } from '@hi-ui/type-assertion';
 import { callAllFuncs } from '@hi-ui/func-utils';
 import { getNested, setNested } from '@hi-ui/object-utils';
 import { stopEvent } from '@hi-ui/dom-utils';
@@ -21,12 +21,16 @@ var EMPTY_ERRORS = {};
 var EMPTY_TOUCHED = {};
 var DEFAULT_VALIDATE_TRIGGER = ['onChange', 'onBlur'];
 
+var EMPTY_FUNC = function EMPTY_FUNC() {};
+
 var useForm = function useForm(_a) {
   var initialValues = _a.initialValues,
       _a$initialErrors = _a.initialErrors,
       initialErrors = _a$initialErrors === void 0 ? EMPTY_ERRORS : _a$initialErrors,
       _a$initialTouched = _a.initialTouched,
       initialTouched = _a$initialTouched === void 0 ? EMPTY_TOUCHED : _a$initialTouched,
+      _a$lazyValidate = _a.lazyValidate,
+      lazyValidate = _a$lazyValidate === void 0 ? false : _a$lazyValidate,
       onValuesChange = _a.onValuesChange,
       onReset = _a.onReset,
       onSubmit = _a.onSubmit,
@@ -152,11 +156,8 @@ var useForm = function useForm(_a) {
                   type: 'SET_VALIDATING',
                   payload: false
                 }); // @ts-ignore
-                // @ts-ignore
-
-                setFieldError(field, (_c = (_b = (_a = errorMsg.fields[stringify(field)]) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.message) !== null && _c !== void 0 ? _c : ''); // TODO: 回调和promise支持
-                // TODO: 回调和promise支持
 
+                setFieldError(field, (_c = (_b = (_a = errorMsg.fields[stringify(field)]) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.message) !== null && _c !== void 0 ? _c : '');
                 throw errorMsg;
               }));
 
@@ -182,16 +183,104 @@ var useForm = function useForm(_a) {
 
   var validateAll = useCallback(function () {
     var fieldNames = getRegisteredKeys();
+    formDispatch({
+      type: 'SET_VALIDATING',
+      payload: true
+    });
     return Promise.all(fieldNames.map(function (fieldName) {
-      return validateFieldState(fieldName);
-    }));
-  }, [getRegisteredKeys, validateFieldState]);
+      var value = getFieldValue(fieldName);
+      var fieldValidation = getValidation(fieldName);
+
+      if (!fieldValidation) {
+        return Promise.resolve(null);
+      } // catch 错误，保证检验所有表单项
+
+
+      return fieldValidation.validate(value)["catch"](function (error) {
+        // 第一个出错，即退出校验
+        if (lazyValidate) {
+          throw error;
+        }
+
+        return error;
+      });
+    })).then(function (result) {
+      // 合并错误，批量更新并返回
+      var combinedError = result.reduce(function (prev, cur, index) {
+        var _a, _b;
+
+        var fieldName = fieldNames[index];
+        var errorMsg;
+
+        if (cur instanceof Error) {
+          // @ts-ignore
+          errorMsg = ((_b = (_a = cur.fields[stringify(fieldName)]) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.message) || '';
+
+          if (typeof errorMsg === 'string' && !!errorMsg) {
+            return setNested(prev, fieldName, errorMsg);
+          }
+        }
+
+        return prev;
+      }, {});
+      formDispatch({
+        type: 'SET_VALIDATING',
+        payload: false
+      });
+      formDispatch({
+        type: 'SET_ERRORS',
+        payload: combinedError
+      });
+      return combinedError;
+    })["catch"](function (error) {
+      var _a, _b;
+
+      var fieldNameStrings = fieldNames.map(function (item) {
+        return stringify(item);
+      }); // @ts-ignore
+
+      var fieldNameString = Object.keys(error.fields).find(function (item) {
+        return fieldNameStrings.includes(item);
+      });
+      var combinedError = {};
+
+      if (!fieldNameString) {
+        formDispatch({
+          type: 'SET_VALIDATING',
+          payload: false
+        });
+        return error;
+      }
+
+      var errorMsg;
+
+      if (error instanceof Error) {
+        // @ts-ignore
+        errorMsg = ((_b = (_a = error.fields[fieldNameString]) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.message) || '';
+      }
+
+      var fieldName = parse(fieldNameString);
+
+      if (typeof errorMsg === 'string' && !!errorMsg) {
+        combinedError = setNested(combinedError, fieldName, errorMsg);
+      }
+
+      formDispatch({
+        type: 'SET_VALIDATING',
+        payload: false
+      });
+      formDispatch({
+        type: 'SET_ERRORS',
+        payload: combinedError
+      });
+      return combinedError;
+    });
+  }, [getRegisteredKeys, getFieldValue, getValidation, lazyValidate]);
   /**
    * 控件值更新策略
    */
 
   var setFieldValue = useCallback(function (field, value, shouldValidate) {
-    // @ts-ignore
     formDispatch({
       type: 'SET_FIELD_VALUE',
       payload: {
@@ -200,20 +289,20 @@ var useForm = function useForm(_a) {
       }
     }); // touched 给外部控制展示，而不是当做参数暴露
 
-    var shouldValidateField = // shouldValidate ?? (validateAfterTouched ? getNested(formState.touched, field) : true)
-    validateAfterTouched ? getNested(formState.touched, field) && shouldValidate : shouldValidate;
+    var shouldValidateField = validateAfterTouched ? getNested(formState.touched, field) && shouldValidate : shouldValidate;
 
     if (shouldValidateField) {
-      validateField(field, value);
+      validateField(field, value)["catch"](EMPTY_FUNC);
     }
   }, [validateField, validateAfterTouched, formState]);
-  var setFieldsValue = useCallback(function (fields, shouldValidate) {
-    Object.entries(fields).forEach(function (_ref) {
-      var fieldName = _ref[0],
-          value = _ref[1];
-      setFieldValue(fieldName, value, shouldValidate);
+  var setFieldsValue = useCallback(function (fieldsState) {
+    formDispatch({
+      type: 'SET_VALUES',
+      payload: function payload(prevState) {
+        return isFunction(fieldsState) ? fieldsState(prevState) : mergeValues(prevState, fieldsState);
+      }
     });
-  }, [setFieldValue]);
+  }, []);
   var normalizeValueFromChange = useCallback(function (eventOrValue, valuePropName) {
     var nextValue = eventOrValue;
 
@@ -258,7 +347,7 @@ var useForm = function useForm(_a) {
   var handleFieldBlur = useCallback(function (fieldName, shouldValidate) {
     return function (evt) {
       if (shouldValidate) {
-        validateFieldState(fieldName);
+        validateFieldState(fieldName)["catch"](EMPTY_FUNC);
       }
 
       setFieldTouched(fieldName, true);
@@ -266,7 +355,7 @@ var useForm = function useForm(_a) {
   }, [setFieldTouched, validateFieldState]);
   var handleFieldTrigger = useCallback(function (fieldName) {
     return function (evt) {
-      validateFieldState(fieldName);
+      validateFieldState(fieldName)["catch"](EMPTY_FUNC);
     };
   }, [validateFieldState]);
   /**
@@ -346,7 +435,7 @@ var useForm = function useForm(_a) {
               });
               return _context3.abrupt("return", validateAll().then(function (combinedErrors) {
                 var isInstanceOfError = combinedErrors instanceof Error;
-                var isActuallyValid = !isInstanceOfError;
+                var isActuallyValid = !!combinedErrors && !isInstanceOfError && Object.keys(combinedErrors).length === 0;
 
                 if (isActuallyValid) {
                   var promiseOrUndefined;
@@ -365,7 +454,6 @@ var useForm = function useForm(_a) {
                     formDispatch({
                       type: 'SUBMIT_DONE'
                     }); // return combinedErrors
-                    // return combinedErrors
 
                     return formState.values;
                   }
@@ -375,8 +463,6 @@ var useForm = function useForm(_a) {
                       type: 'SUBMIT_DONE'
                     }); // return result
                     // TODO: 满足promise 如果既给到values 又给到 errors
-                    // return result
-                    // TODO: 满足promise 如果既给到values 又给到 errors
 
                     return formState.values;
                   })["catch"](function (_errors) {
@@ -392,6 +478,8 @@ var useForm = function useForm(_a) {
 
                   if (isInstanceOfError) {
                     throw combinedErrors;
+                  } else {
+                    throw new TypeError('Validation Error');
                   }
                 }
               }, function (error) {
@@ -419,11 +507,13 @@ var useForm = function useForm(_a) {
   }, [resetForm]);
   var resetErrors = useCallback(function () {
     formDispatch({
-      // TODO: reset errorMsg
       type: 'SET_ERRORS',
       payload: {}
     });
   }, []);
+  var resetFieldError = useCallback(function (field) {
+    setFieldError(field, '');
+  }, [setFieldError]);
   var setFormState = React.useCallback(function (stateOrFunc) {
     // @ts-ignore
     formDispatch({
@@ -437,17 +527,13 @@ var useForm = function useForm(_a) {
       onReset: handleReset
     });
   });
-  var getFieldProps = useCallback(function (props, ref) {
+  var getFieldProps = useCallback(function (props) {
     var _returnProps;
 
     if (props === void 0) {
       props = {};
     }
 
-    if (ref === void 0) {
-      ref = null;
-    }
-
     var _props = props,
         field = _props.field,
         _props$valuePropName = _props.valuePropName,
@@ -458,15 +544,16 @@ var useForm = function useForm(_a) {
         valueConnectTransform = _props.valueConnectTransform,
         _props$validateTrigge = _props.validateTrigger,
         validateTriggerProp = _props$validateTrigge === void 0 ? validateTriggersMemo : _props$validateTrigge,
-        children = _props.children;
-    var controlProps = children.props || {};
+        children = _props.children; // field 未设置，不进行收集管理
+
+    if (!isValidField(field)) return {}; // 控件的 props
+
+    var controlProps = children && children.props || {};
     var validateTrigger = isArray(validateTriggerProp) ? validateTriggerProp : [validateTriggerProp];
     var validateOnCollect = validateTrigger.includes(valueChangeFuncPropName);
     var validateOnBlur = validateTrigger.includes('onBlur');
     var controlledValue = getNested(formState.values, field);
-    var returnProps = (_returnProps = {
-      ref: ref
-    }, _returnProps[valuePropName] = isFunction(valueConnectTransform) ? valueConnectTransform(controlledValue) : controlledValue, _returnProps[valueChangeFuncPropName] = callAllFuncs(controlProps[valueChangeFuncPropName], handleFieldChange(field, valuePropName, valueDispatchTransform, validateOnCollect)), _returnProps.onBlur = callAllFuncs(controlProps.onBlur, handleFieldBlur(field, validateOnBlur)), _returnProps.invalid = getFieldError(field), _returnProps);
+    var returnProps = (_returnProps = {}, _returnProps[valuePropName] = isFunction(valueConnectTransform) ? valueConnectTransform(controlledValue) : controlledValue, _returnProps[valueChangeFuncPropName] = callAllFuncs(controlProps[valueChangeFuncPropName], handleFieldChange(field, valuePropName, valueDispatchTransform, validateOnCollect)), _returnProps.onBlur = callAllFuncs(controlProps.onBlur, handleFieldBlur(field, validateOnBlur)), _returnProps.invalid = getFieldError(field), _returnProps);
     validateTrigger.forEach(function (triggerName) {
       if ([valueChangeFuncPropName, 'onBlur'].indexOf(triggerName) === -1) {
         returnProps[triggerName] = callAllFuncs(controlProps[triggerName], handleFieldTrigger(field));
@@ -492,14 +579,14 @@ var useForm = function useForm(_a) {
     submitForm: submitForm,
     resetForm: resetForm,
     resetErrors: resetErrors,
+    resetFieldError: resetFieldError,
     validateFieldState: validateFieldState,
     validateValue: validateField,
     getFieldsValue: getFieldsValue,
     setFieldsValue: setFieldsValue,
     getFieldsError: getFieldsError
   });
-}; // TODO: field 支持数组
-
+};
 
 function formReducer(state, action) {
   switch (action.type) {
@@ -508,8 +595,9 @@ function formReducer(state, action) {
       return Object.assign(Object.assign({}, state), nextState);
 
     case 'SET_VALUES':
+      var nextValues = isFunction(action.payload) ? action.payload(state.values) : action.payload;
       return Object.assign(Object.assign({}, state), {
-        values: action.payload
+        values: nextValues
       });
 
     case 'SET_ERRORS':
@@ -595,4 +683,3 @@ var useCollection = function useCollection() {
 };
 
 export { useForm };
-//# sourceMappingURL=use-form.js.map

package/lib/esm/utils/index.js

@@ -2,11 +2,14 @@
  * @hi-ui/form
  * https://github.com/XiaoMi/hiui/tree/master/packages/ui/form#readme
  *
- * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
+import { isNullish, isArray } from '@hi-ui/type-assertion';
+import { clone, hasOwnProp } from '@hi-ui/object-utils';
+
 var stringify = function stringify(field) {
   return JSON.stringify(field);
 };
@@ -15,5 +18,26 @@ var parse = function parse(fieldStr) {
   return JSON.parse(fieldStr);
 };
 
-export { parse, stringify };
-//# sourceMappingURL=index.js.map
+var isValidField = function isValidField(field) {
+  if (isNullish(field) || field === '') return false;
+  if (isArray(field) && field.every(function (item) {
+    return isNullish(item) || item === '';
+  })) return false;
+  return true;
+};
+
+var mergeValues = function mergeValues(source, override) {
+  if (!override) return source;
+  if (!source) return clone(override);
+  var target = clone(source);
+
+  for (var key in override) {
+    if (hasOwnProp(override, key)) {
+      target[key] = override[key];
+    }
+  }
+
+  return target;
+};
+
+export { isValidField, mergeValues, parse, stringify };

package/lib/types/Form.d.ts

@@ -32,4 +32,8 @@ export interface FormProps<Values = Record<string, any>> extends Omit<HiBaseHTML
      * 配置是否展示冒号
      */
     showColon?: boolean;
+    /**
+     * FormItem 开启 filed 的 required 校验时，展示红色星号
+     */
+    showRequiredOnValidateRequired?: boolean;
 }

package/lib/types/FormField.d.ts

@@ -8,5 +8,9 @@ export interface FormFieldProps extends UseFormFieldProps {
     /**
      * 表单控件
      */
-    children?: React.ReactElement;
+    children?: React.ReactNode;
+    /**
+     * 支持表单控件 render 渲染
+     */
+    render?: (props: Record<string, any>) => React.ReactNode;
 }

package/lib/types/FormItem.d.ts

@@ -7,7 +7,11 @@ import { FormLabelProps } from './FormLabel';
 export declare const FormItem: React.FC<FormItemProps>;
 export interface FormItemProps extends UseFormFieldProps, FormLabelProps {
     /**
-     * 表单控件
+     * 表单控件或其渲染函数
      */
-    children?: React.ReactElement;
+    children?: React.ReactNode;
+    /**
+     * 支持表单控件 render 渲染
+     */
+    render?: (props: Record<string, any>) => any;
 }

package/lib/types/FormLabel.d.ts

@@ -10,7 +10,7 @@ export interface FormLabelProps extends HiBaseHTMLProps<'div'> {
      */
     labelPlacement?: 'right' | 'left' | 'top';
     /**
-     * 标记是否必填
+     * 是否显示必填信号。这里不做校验处理，若需校验请使用 rules 进行设置
      */
     required?: boolean;
     /**

package/lib/types/FormList.d.ts

@@ -1,15 +1,16 @@
 import React from 'react';
+import { FormFieldPath, FormListChildrenAction } from './types';
 /**
  * TODO: What is FormList
  */
 export declare const FormList: React.FC<FormListProps>;
 export interface FormListProps {
     /**
-     * 表单控件
+     * 表单控件渲染函数
      */
-    children?: (fields: any[], action: any) => React.ReactElement | null;
+    children?: (fields: any[], action: FormListChildrenAction) => React.ReactElement;
     /**
      * 列表名称
      */
-    name: string | string[];
+    name: FormFieldPath;
 }

package/lib/types/FormReset.d.ts

@@ -5,5 +5,8 @@ import { ButtonProps } from '@hi-ui/button';
  */
 export declare const FormReset: React.ForwardRefExoticComponent<FormResetProps & React.RefAttributes<HTMLButtonElement | null>>;
 export interface FormResetProps extends ButtonProps {
+    /**
+     * 点击重置后触发
+     */
     onClick?: () => void;
 }

package/lib/types/FormSubmit.d.ts

@@ -5,5 +5,8 @@ import { ButtonProps } from '@hi-ui/button';
  */
 export declare const FormSubmit: React.ForwardRefExoticComponent<FormSubmitProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement | null>>;
 export interface FormSubmitProps extends Omit<ButtonProps, 'onClick'> {
-    onClick?: (value: any, error: any) => void;
+    /**
+     * 点击提交后触发
+     */
+    onClick?: (result: any, error: any) => void;
 }

package/lib/types/context.d.ts

@@ -5,6 +5,8 @@ export interface FormContextProps extends UseFormReturn {
     labelPlacement: 'left' | 'right' | 'top';
     contentPosition: 'top' | 'center' | 'bottom';
     showColon: boolean;
+    showRequiredOnValidateRequired: boolean;
+    prefixCls: string;
 }
 export declare const FormProvider: React.Provider<Omit<FormContextProps, "rootProps"> | null>;
 export declare const useFormContext: () => Omit<FormContextProps, "rootProps">;