@hi-ui/form 4.0.0-beta.24 → 4.0.0-beta.25

package/lib/cjs/Form.js

@@ -72,14 +72,14 @@ var Form = /*#__PURE__*/React.forwardRef(function (_a, ref) {
       validate: formContext.submitForm,
       reset: formContext.resetForm,
       validateField: formContext.validateFieldState,
-      // validateFields: formContext.va,
       setFieldValue: formContext.setFieldValue,
       setFieldsValue: formContext.setFieldsValue,
       getFieldValue: formContext.getFieldValue,
       getFieldsValue: formContext.getFieldsValue,
       getFieldError: formContext.getFieldError,
       getFieldsError: formContext.getFieldsError,
-      clearValidates: formContext.resetErrors
+      clearValidates: formContext.resetErrors,
+      clearFieldValidate: formContext.resetFieldError
     };
   });
   var providedValue = React.useMemo(function () {

package/lib/cjs/use-form.js

@@ -309,7 +309,6 @@ var useForm = function useForm(_a) {
    */
 
   var setFieldValue = React.useCallback(function (field, value, shouldValidate) {
-    // @ts-ignore
     formDispatch({
       type: 'SET_FIELD_VALUE',
       payload: {
@@ -318,20 +317,20 @@ var useForm = function useForm(_a) {
       }
     }); // touched 给外部控制展示，而不是当做参数暴露
 
-    var shouldValidateField = // shouldValidate ?? (validateAfterTouched ? getNested(formState.touched, field) : true)
-    validateAfterTouched ? objectUtils.getNested(formState.touched, field) && shouldValidate : shouldValidate;
+    var shouldValidateField = validateAfterTouched ? objectUtils.getNested(formState.touched, field) && shouldValidate : shouldValidate;
 
     if (shouldValidateField) {
       validateField(field, value);
     }
   }, [validateField, validateAfterTouched, formState]);
-  var setFieldsValue = React.useCallback(function (fields, shouldValidate) {
-    Object.entries(fields).forEach(function (_ref) {
-      var fieldName = _ref[0],
-          value = _ref[1];
-      setFieldValue(fieldName, value, shouldValidate);
+  var setFieldsValue = React.useCallback(function (fieldsState) {
+    formDispatch({
+      type: 'SET_VALUES',
+      payload: function payload(prevState) {
+        return typeAssertion.isFunction(fieldsState) ? fieldsState(prevState) : objectUtils.merge(objectUtils.clone(prevState), fieldsState);
+      }
     });
-  }, [setFieldValue]);
+  }, []);
   var normalizeValueFromChange = React.useCallback(function (eventOrValue, valuePropName) {
     var nextValue = eventOrValue;
 
@@ -539,11 +538,13 @@ var useForm = function useForm(_a) {
   }, [resetForm]);
   var resetErrors = React.useCallback(function () {
     formDispatch({
-      // TODO: reset errorMsg
       type: 'SET_ERRORS',
       payload: {}
     });
   }, []);
+  var resetFieldError = React.useCallback(function (field) {
+    setFieldError(field, '');
+  }, [setFieldError]);
   var setFormState = React__default["default"].useCallback(function (stateOrFunc) {
     // @ts-ignore
     formDispatch({
@@ -609,14 +610,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) {
@@ -625,8 +626,9 @@ function formReducer(state, action) {
       return Object.assign(Object.assign({}, state), nextState);
 
     case 'SET_VALUES':
+      var nextValues = typeAssertion.isFunction(action.payload) ? action.payload(state.values) : action.payload;
       return Object.assign(Object.assign({}, state), {
-        values: action.payload
+        values: nextValues
       });
 
     case 'SET_ERRORS':

package/lib/esm/Form.js

@@ -50,14 +50,14 @@ var Form = /*#__PURE__*/forwardRef(function (_a, ref) {
       validate: formContext.submitForm,
       reset: formContext.resetForm,
       validateField: formContext.validateFieldState,
-      // validateFields: formContext.va,
       setFieldValue: formContext.setFieldValue,
       setFieldsValue: formContext.setFieldsValue,
       getFieldValue: formContext.getFieldValue,
       getFieldsValue: formContext.getFieldsValue,
       getFieldError: formContext.getFieldError,
       getFieldsError: formContext.getFieldsError,
-      clearValidates: formContext.resetErrors
+      clearValidates: formContext.resetErrors,
+      clearFieldValidate: formContext.resetFieldError
     };
   });
   var providedValue = useMemo(function () {

package/lib/esm/use-form.js

@@ -12,9 +12,9 @@ import { __rest, __awaiter } from 'tslib';
 import { stringify, parse, 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 { getNested, setNested, merge, clone } from '@hi-ui/object-utils';
 import { stopEvent } from '@hi-ui/dom-utils';
 var EMPTY_RULES = {};
 var EMPTY_ERRORS = {};
@@ -282,7 +282,6 @@ var useForm = function useForm(_a) {
    */
 
   var setFieldValue = useCallback(function (field, value, shouldValidate) {
-    // @ts-ignore
     formDispatch({
       type: 'SET_FIELD_VALUE',
       payload: {
@@ -291,20 +290,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, 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) : merge(clone(prevState), fieldsState);
+      }
     });
-  }, [setFieldValue]);
+  }, []);
   var normalizeValueFromChange = useCallback(function (eventOrValue, valuePropName) {
     var nextValue = eventOrValue;
 
@@ -512,11 +511,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({
@@ -582,14 +583,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) {
@@ -598,8 +599,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':

package/lib/types/types.d.ts

@@ -41,19 +41,19 @@ export declare type FormAction<T> = {
 } | {
     type: 'SET_FIELD_VALUE';
     payload: {
-        field: React.ReactText[];
+        field: FormFieldPath;
         value?: any;
     };
 } | {
     type: 'SET_FIELD_TOUCHED';
     payload: {
-        field: React.ReactText[];
+        field: FormFieldPath;
         value?: boolean;
     };
 } | {
     type: 'SET_FIELD_ERROR';
     payload: {
-        field: React.ReactText[];
+        field: FormFieldPath;
         value?: string;
     };
 } | {
@@ -85,41 +85,38 @@ export interface FormHelpers<T = any> {
      */
     validate: () => Promise<T>;
     /**
-     * 重置整个表单的验证,对应 Form.Reset中的 API
+     * 重置整个表单的验证,对应 Form.Reset中的 API，如果不知道 nextState，则重置为 initialValues
      */
-    reset: (fields?: FormFieldPath, toDefault?: boolean) => Promise<T>;
+    reset: (nextState?: Partial<FormState<any>>) => Promise<T>;
     /**
      * 对指定表单字段进行校验
      */
-    validateField: (fields?: FormFieldPath) => Promise<T>;
+    validateField: (fields: FormFieldPath) => Promise<T>;
     /**
-     * 对指定表单字段进行校验
-     */
-    validateFields: (fields?: FormFieldPath) => Promise<T>;
-    /**
-     * 设置表单的值，在异步获取的数据回显的时候，使用该方法
+     * 设置某个表单字段的值，在更新表单数据的的时候，使用该方法
      */
     setFieldValue: (field: FormFieldPath, value: any) => void;
     /**
      * 设置多个表单的值，在异步获取的数据回显的时候，使用该方法
+     * TODO
      */
-    setFieldsValue: (field: Record<string, any>) => void;
+    setFieldsValue: (field: Record<string, any> | ((prevValues: Record<string, any>) => Record<string, any>)) => void;
     /**
-     * 	获取一个字段名对应的 Values 返回为数组形式, 不传入 fields；默认返回全部信息, 不会触发表单校验
+     * 	获取一个字段名对应的 Value，返回为对应 Field 值
      */
     getFieldValue: (field: FormFieldPath) => any;
     /**
-     * 	获取所有字段名对应的 Values 返回为数组形式, 不传入 fields；默认返回全部信息, 不会触发表单校验
+     * 	获取所有字段名对应的 Values 返回为字典映射数据结构
      */
     getFieldsValue: () => any;
     /**
-     * 获取一组字段名对应的错误信息，返回为数组形式, 不传入 fields；默认返回全部信息
+     * 获取一组字段名对应的 errorMessage，返回为对应 field 错误信息
      */
     getFieldError: (field: FormFieldPath) => any;
     /**
-     * 获取所有字段名对应的错误信息，返回为数组形式, 不传入 fields；默认返回全部信息
+     * 获取所有字段名对应的错误信息，返回为字典映射数据结构
      */
-    getFieldsError: () => any;
+    getFieldsError: () => FormErrors<any>;
     /**
      * 移除所有表单项的校验结果
      */
@@ -127,7 +124,7 @@ export interface FormHelpers<T = any> {
     /**
      *  移除表单项的校验结果，传入待移除的表单项的 field 属性组成的数组
      */
-    clearFieldsValidates: (fields: FormFieldPath) => void;
+    clearFieldValidate: (fields: FormFieldPath) => void;
 }
 export declare type FormFieldPath = (string | number)[] | string | number;
 export declare type FormErrorMessage = string;

package/lib/types/use-form.d.ts

@@ -9,21 +9,22 @@ export declare const useForm: <Values = Record<string, any>>({ initialValues, in
     getFieldError: (fieldName: FormFieldPath) => any;
     getFieldRules: (fieldName: FormFieldPath) => any;
     getRootProps: () => {
-        onSubmit: (evt?: React.FormEvent<HTMLFormElement> | undefined) => Promise<unknown>;
+        onSubmit: (evt?: React.FormEvent<HTMLFormElement> | undefined) => Promise<any>;
         onReset: (evt?: React.FormEvent<HTMLFormElement> | undefined) => void;
     };
     getFieldProps: (props?: any) => any;
     registerField: (keyOrKeys: FormFieldPath, value: FormFieldCollection<Values>) => void;
     unregisterField: (keyOrKeys: FormFieldPath) => void;
-    submitForm: () => Promise<unknown>;
+    submitForm: () => Promise<any>;
     resetForm: (nextState?: Partial<FormState<any>> | undefined) => Promise<void>;
     resetErrors: () => void;
+    resetFieldError: (field: FormFieldPath) => void;
     validateFieldState: (field: FormFieldPath) => Promise<{} | undefined>;
     validateValue: (field: FormFieldPath, value: unknown) => Promise<{} | undefined>;
     getFieldsValue: () => any;
-    setFieldsValue: (fields: Record<string, any>, shouldValidate?: boolean | undefined) => void;
+    setFieldsValue: (fieldsState: Record<string, any> | Function) => void;
     getFieldsError: () => any;
-    values: unknown;
+    values: any;
     errors: FormErrors<unknown>;
     touched: import("./types").FormTouched<unknown>;
     validating: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hi-ui/form",
-  "version": "4.0.0-beta.24",
+  "version": "4.0.0-beta.25",
   "description": "A sub-package for @hi-ui/hiui.",
   "keywords": [],
   "author": "HIUI <mi-hiui@xiaomi.com>",
@@ -49,9 +49,9 @@
     "@hi-ui/core-css": "^4.0.0-beta.5",
     "@hi-ui/dom-utils": "^4.0.0-beta.5",
     "@hi-ui/env": "^4.0.0-beta.0",
-    "@hi-ui/func-utils": "^4.0.0-beta.10",
-    "@hi-ui/locale-context": "^4.0.0-beta.16",
-    "@hi-ui/object-utils": "^4.0.0-beta.9",
+    "@hi-ui/func-utils": "^4.0.0-beta.11",
+    "@hi-ui/locale-context": "^4.0.0-beta.17",
+    "@hi-ui/object-utils": "^4.0.0-beta.10",
     "@hi-ui/type-assertion": "^4.0.0-beta.4",
     "@hi-ui/use-latest": "^4.0.0-beta.4",
     "async-validator": "^4.0.7"
@@ -65,5 +65,5 @@
     "react": "^17.0.1",
     "react-dom": "^17.0.1"
   },
-  "gitHead": "53ae46d5c39ae7c8ed67049ca2ecbc156c891aef"
+  "gitHead": "674c0457e222285057bb82be5dc1ce6bf081b96c"
 }