@zat-design/sisyphus-react 4.5.10-beta.1 → 4.5.10-beta.2

package/es/ProForm/hooks/useWatch.js

@@ -1,41 +1,29 @@
-import _cloneDeep from "lodash/cloneDeep";
-import _isEqual from "lodash/isEqual";
-import _debounce from "lodash/debounce";
-import warning from 'rc-util/lib/warning';
-import { useState, useEffect, useRef, useMemo } from 'react';
+import debounce from "lodash/debounce";
+import isEqual from "lodash/isEqual";
+import cloneDeep from "lodash/cloneDeep";
+import warning from "rc-util/lib/warning";
+import { useState, useEffect, useRef, useMemo } from "react";
 import { toArray } from "../utils";
-
-// 从一个对象或Form值中获取特定路径的值
 function get(source, path) {
   if (!source || path.length === 0) {
     return source;
   }
   let current = source;
   for (let i = 0; i < path.length; i++) {
-    if (current === undefined || current === null) {
-      return undefined;
+    if (current === void 0 || current === null) {
+      return void 0;
     }
     current = current[path[i]];
   }
   return current;
 }
-
-/**
- * 将值设置到指定路径的嵌套对象中
- * @param obj 目标对象
- * @param path 路径数组
- * @param value 要设置的值
- */
 function setValueByPath(obj, path, value) {
-  if (path.length === 0) return;
-
-  // 处理单层路径
+  if (path.length === 0)
+    return;
   if (path.length === 1) {
     obj[path[0]] = value;
     return;
   }
-
-  // 处理多层嵌套路径
   let current = obj;
   for (let i = 0; i < path.length - 1; i++) {
     const key = path[i];
@@ -46,116 +34,73 @@ function setValueByPath(obj, path, value) {
   }
   current[path[path.length - 1]] = value;
 }
-
-// 创建之后namepath就不可变的警告
-// selector 模式（dependencies 为函数）下跳过：函数引用每次渲染不同，无法稳定 stringify
-// warning 在 production 下本身为空操作；始终走同一实现，避免 Jest 下 production 空函数不可达
-const useWatchWarning = dependencies => {
-  const isSelector = typeof dependencies === 'function';
-  const depsStr = isSelector ? '__selector__' : JSON.stringify(dependencies);
+const useWatchWarning = (dependencies) => {
+  const isSelector = typeof dependencies === "function";
+  const depsStr = isSelector ? "__selector__" : JSON.stringify(dependencies);
   const depsStrRef = useRef(depsStr);
   if (!isSelector) {
-    warning(depsStrRef.current === depsStr, '`useWatch` is not support dynamic `namePath`. Please provide static instead.');
+    warning(
+      depsStrRef.current === depsStr,
+      "`useWatch` is not support dynamic `namePath`. Please provide static instead."
+    );
   }
 };
-
-/**
- * selector 函数：接收所有表单值，返回派生值
- * 与 antd 5.12.0+ Form.useWatch selector 行为一致
- */
-
-/**
- * ProForm的useWatch hook，用于监听表单字段变化
- * 支持三种依赖形式：
- *   1. 字符串路径：useWatch('fieldName', form)
- *   2. 路径数组：useWatch(['a', 'b'], form) 或 useWatch([['a', 'b'], 'c'], form)
- *   3. selector 函数：useWatch((values) => values.a + values.b, form)
- *
- * @param dependencies 监听的字段路径或 selector 函数
- * @param form 表单实例
- * @param wait 防抖等待时间
- * @returns 表单值或 selector 返回的派生值
- */
-
 function useWatch(dependencies, form, wait) {
-  const isSelector = typeof dependencies === 'function';
-
-  // 无条件调用，内部按 isSelector 决定是否真正执行警告逻辑，保证 Hook 顺序稳定
+  const isSelector = typeof dependencies === "function";
   useWatchWarning(dependencies);
-
-  // 获取表单实例
   const formInstance = form;
-
-  // 用于存储最终结果（selector 模式下值类型由 selector 决定）
-  const [state, setState] = useState(isSelector ? undefined : {});
-
-  // 使用ref存储中间状态，避免不必要的渲染
-  const valueRef = useRef(isSelector ? undefined : {});
-  const prevStateRef = useRef(isSelector ? undefined : {});
-
-  // 标准化依赖为路径数组的数组（selector 模式下为空数组，不参与）
-  const namePaths = useMemo(() => {
-    const paths = [];
-    if (isSelector) {
-      return paths;
-    }
-
-    // 字符串形式: 'fieldName'
-    if (typeof dependencies === 'string') {
-      paths.push(dependencies);
-      // 数组形式
-    } else if (Array.isArray(dependencies)) {
-      // 检查是否是路径数组的集合，例如：[['a', 'number'], 'fieldName']
-      const isPathsCollection = dependencies.length > 0 && (typeof dependencies[0] === 'string' || Array.isArray(dependencies[0]));
-      if (isPathsCollection) {
-        // 每个元素都是一个路径
-        dependencies.forEach(path => {
-          paths.push(path);
-        });
-      } else {
-        // 整个数组是一个单一路径
+  const [state, setState] = useState(isSelector ? void 0 : {});
+  const valueRef = useRef(isSelector ? void 0 : {});
+  const prevStateRef = useRef(isSelector ? void 0 : {});
+  const namePaths = useMemo(
+    () => {
+      const paths = [];
+      if (isSelector) {
+        return paths;
+      }
+      if (typeof dependencies === "string") {
         paths.push(dependencies);
+      } else if (Array.isArray(dependencies)) {
+        const isPathsCollection = dependencies.length > 0 && (typeof dependencies[0] === "string" || Array.isArray(dependencies[0]));
+        if (isPathsCollection) {
+          dependencies.forEach((path) => {
+            paths.push(path);
+          });
+        } else {
+          paths.push(dependencies);
+        }
       }
-    }
-    return paths;
-  }, [
-    /* dependencies 故意忽略，与原实现一致 */
-  ]);
-
-  // selector 函数 ref：使最新 selector 始终被调用，但不触发 useEffect 重订阅
+      return paths;
+    },
+    [
+      /* dependencies 故意忽略，与原实现一致 */
+    ]
+  );
   const selectorRef = useRef(null);
   if (isSelector) {
     selectorRef.current = dependencies;
   }
-
-  // 保存防抖函数引用，避免重复创建
   const debouncedFn = useMemo(() => {
     if (wait) {
-      return _debounce(value => {
-        // 只在值真正变化时才更新状态
-        if (!_isEqual(prevStateRef.current, value)) {
-          prevStateRef.current = _cloneDeep(value);
+      return debounce((value) => {
+        if (!isEqual(prevStateRef.current, value)) {
+          prevStateRef.current = cloneDeep(value);
           setState(value);
         }
       }, wait);
     }
-
-    // 非防抖版本
-    return value => {
-      if (!_isEqual(prevStateRef.current, value)) {
-        prevStateRef.current = _cloneDeep(value);
+    return (value) => {
+      if (!isEqual(prevStateRef.current, value)) {
+        prevStateRef.current = cloneDeep(value);
         setState(value);
       }
     };
   }, [wait]);
   useEffect(() => {
-    if (!formInstance) return undefined;
-
-    // 创建更新状态的函数
-    const updateState = watchValues => {
+    if (!formInstance)
+      return void 0;
+    const updateState = (watchValues) => {
       const values = watchValues ?? formInstance.getFieldsValue(true);
-
-      // selector 模式：直接调用 selector 计算派生值
       if (isSelector && selectorRef.current) {
         const next = selectorRef.current(values);
         valueRef.current = next;
@@ -163,39 +108,20 @@ function useWatch(dependencies, form, wait) {
         return;
       }
       const newState = {};
-
-      // 处理每个监听路径
-      namePaths.forEach(path => {
-        // 将路径转换为数组形式
+      namePaths.forEach((path) => {
         const namePath = toArray(path);
-
-        // 获取路径对应的值
         const value = get(values, namePath);
-
-        // 将值设置到正确的嵌套结构中
         setValueByPath(newState, namePath, value);
       });
-
-      // 存储并更新状态
       valueRef.current = newState;
       debouncedFn(newState);
     };
-
-    // 初始调用一次
     updateState();
-
-    // 注册表单变化监听
-    const {
-      getInternalHooks
-    } = formInstance;
-    const {
-      registerWatch
-    } = getInternalHooks('RC_FORM_INTERNAL_HOOKS');
+    const { getInternalHooks } = formInstance;
+    const { registerWatch } = getInternalHooks("RC_FORM_INTERNAL_HOOKS");
     const cancelWatch = registerWatch((values, allValues) => {
       updateState(allValues ?? values);
     });
-
-    // 清理订阅
     return () => {
       if (wait) {
         debouncedFn.cancel();
@@ -205,4 +131,7 @@ function useWatch(dependencies, form, wait) {
   }, [formInstance, namePaths, debouncedFn, wait]);
   return state;
 }
-export default useWatch;
+var useWatch_default = useWatch;
+export {
+  useWatch_default as default
+};