tntd 2.1.0 → 2.1.2

package/es/tntd-form/TntdForm/components/ItemComp.js

@@ -7,180 +7,171 @@
  */
 import React, { useState, memo, useEffect, useImperativeHandle } from 'react';
 import { getNames, handleCheckItem, getInitValue } from '../utils';
-const ItemComp = React.forwardRef(({
-  name,
-  children,
-  style,
-  initialValue,
-  rules,
-  shouldUpdate,
-  dependencies,
-  form,
-  updateRefs,
-  initialValues,
-  compsRefs
-}, ref) => {
-  const [value, setValue] = useState(undefined);
-  const [errorMsg, setErrorMsg] = useState(undefined);
-  const [refresh, setRefresh] = useState(false);
-  useImperativeHandle(ref, () => ({
-    onRefresh: () => {
-      setRefresh(!refresh);
-    }
-  }));
-  /** 根据shouldUpdate 和 dependencies收集修改某个字段后需要同步更新的字段 */
-  useEffect(() => {
-    var _a;
-    const nameStr = (_a = getNames(name)) === null || _a === void 0 ? void 0 : _a.join('.');
-    if (shouldUpdate) {
-      updateRefs.current.shouldUpdateList.push(nameStr);
-    }
-    if (Array.isArray(dependencies)) {
-      const arr = dependencies.map(i => getNames(i).join('.'));
-      if (Array.isArray(arr)) {
-        arr.forEach(i => {
-          if (Array.isArray(updateRefs.current.dependencies[i])) {
-            updateRefs.current.dependencies[i] = [...updateRefs.current.dependencies[i], getNames(name).join('.')];
-          } else {
-            updateRefs.current.dependencies[i] = [getNames(name).join('.')];
-          }
+const ItemComp = React.forwardRef(({ name, children, style, initialValue, rules, shouldUpdate, dependencies, form, updateRefs, initialValues, compsRefs, }, ref) => {
+    const [value, setValue] = useState(undefined);
+    const [errorMsg, setErrorMsg] = useState(undefined);
+    const [refresh, setRefresh] = useState(false);
+    useImperativeHandle(ref, () => ({
+        onRefresh: () => {
+            setRefresh(!refresh);
+        },
+    }));
+    /** 根据shouldUpdate 和 dependencies收集修改某个字段后需要同步更新的字段 */
+    useEffect(() => {
+        var _a;
+        const nameStr = (_a = getNames(name)) === null || _a === void 0 ? void 0 : _a.join('.');
+        if (shouldUpdate) {
+            updateRefs.current.shouldUpdateList.push(nameStr);
+        }
+        if (Array.isArray(dependencies)) {
+            const arr = dependencies.map((i) => getNames(i).join('.'));
+            if (Array.isArray(arr)) {
+                arr.forEach((i) => {
+                    if (Array.isArray(updateRefs.current.dependencies[i])) {
+                        updateRefs.current.dependencies[i] = [
+                            ...updateRefs.current.dependencies[i],
+                            getNames(name).join('.'),
+                        ];
+                    }
+                    else {
+                        updateRefs.current.dependencies[i] = [getNames(name).join('.')];
+                    }
+                });
+            }
+        }
+    }, [shouldUpdate, dependencies, name, updateRefs]);
+    const updateRender = () => {
+        if (Array.isArray(updateRefs.current.shouldUpdateList)) {
+            updateRefs.current.shouldUpdateList.forEach((i) => {
+                var _a, _b;
+                (_b = (_a = compsRefs === null || compsRefs === void 0 ? void 0 : compsRefs.current) === null || _a === void 0 ? void 0 : _a[i]) === null || _b === void 0 ? void 0 : _b.call(_a);
+            });
+        }
+        const list = updateRefs.current.dependencies[getNames(name).join('.')];
+        if (Array.isArray(list)) {
+            list.forEach((i) => {
+                var _a, _b;
+                (_b = (_a = compsRefs === null || compsRefs === void 0 ? void 0 : compsRefs.current) === null || _a === void 0 ? void 0 : _a[i]) === null || _b === void 0 ? void 0 : _b.call(_a);
+            });
+        }
+    };
+    /**
+     * 动态修改form内部的值,为啥不在useEffect里面处理的原因是子组件的useEffect会比父组件useEffect先执行，需要保证在子组件useEffect监听value变化的时候获取到的formData永远是最新的
+     * @param name
+     * @param value
+     * @returns
+     */
+    const generateFormData = (name, value) => {
+        if (!name || !form || typeof name !== 'object')
+            return;
+        const [str, ...rest] = name;
+        rest.forEach((i) => {
+            if (form.formData[str]) {
+                form.formData[str][i].value = value;
+                form.formData[str][i].checkItem = () => {
+                    const error = handleCheckItem(value, rules);
+                    setErrorMsg(error);
+                    return error;
+                };
+            }
+            else {
+                form.formData[str] = {
+                    [i]: {
+                        value,
+                        checkItem: () => {
+                            const error = handleCheckItem(value, rules);
+                            setErrorMsg(error);
+                            return error;
+                        },
+                        setItemValue: () => { },
+                        errorMsg: undefined,
+                    },
+                };
+            }
         });
-      }
-    }
-  }, [shouldUpdate, dependencies, name, updateRefs]);
-  const updateRender = () => {
-    if (Array.isArray(updateRefs.current.shouldUpdateList)) {
-      updateRefs.current.shouldUpdateList.forEach(i => {
-        var _a, _b;
-        (_b = (_a = compsRefs === null || compsRefs === void 0 ? void 0 : compsRefs.current) === null || _a === void 0 ? void 0 : _a[i]) === null || _b === void 0 ? void 0 : _b.call(_a);
-      });
-    }
-    const list = updateRefs.current.dependencies[getNames(name).join('.')];
-    if (Array.isArray(list)) {
-      list.forEach(i => {
-        var _a, _b;
-        (_b = (_a = compsRefs === null || compsRefs === void 0 ? void 0 : compsRefs.current) === null || _a === void 0 ? void 0 : _a[i]) === null || _b === void 0 ? void 0 : _b.call(_a);
-      });
-    }
-  };
-  /**
-   * 动态修改form内部的值,为啥不在useEffect里面处理的原因是子组件的useEffect会比父组件useEffect先执行，需要保证在子组件useEffect监听value变化的时候获取到的formData永远是最新的
-   * @param name
-   * @param value
-   * @returns
-   */
-  const generateFormData = (name, value) => {
-    if (!name || !form || typeof name !== 'object') return;
-    const [str, ...rest] = name;
-    rest.forEach(i => {
-      if (form.formData[str]) {
-        form.formData[str][i].value = value;
-        form.formData[str][i].checkItem = () => {
-          const error = handleCheckItem(value, rules);
-          setErrorMsg(error);
-          return error;
-        };
-      } else {
-        form.formData[str] = {
-          [i]: {
-            value,
+    };
+    // 为了给最外层提供方法去校验，比如保存的时候.
+    // 这里依赖不要添加value,因为子组件的useEffect会比父组件useEffect先执行，如果添加了依赖value会导致子组件获取到的formData永远是上一次的
+    useEffect(() => {
+        if (!name || !form || typeof name !== 'object')
+            return;
+        const [str, ...rest] = name;
+        const addItem = {
+            setItemValue: (_val, callback) => {
+                const error = handleCheckItem(_val, rules);
+                setValue(_val);
+                setErrorMsg(error);
+                callback === null || callback === void 0 ? void 0 : callback();
+                updateRender();
+            },
             checkItem: () => {
-              const error = handleCheckItem(value, rules);
-              setErrorMsg(error);
-              return error;
+                const error = handleCheckItem(value, rules);
+                setErrorMsg(error);
+                return error;
             },
-            setItemValue: () => {},
-            errorMsg: undefined
-          }
+            value,
+            errorMsg,
         };
-      }
-    });
-  };
-  // 为了给最外层提供方法去校验，比如保存的时候.
-  // 这里依赖不要添加value,因为子组件的useEffect会比父组件useEffect先执行，如果添加了依赖value会导致子组件获取到的formData永远是上一次的
-  useEffect(() => {
-    if (!name || !form || typeof name !== 'object') return;
-    const [str, ...rest] = name;
-    const addItem = {
-      setItemValue: (_val, callback) => {
-        const error = handleCheckItem(_val, rules);
-        setValue(_val);
-        setErrorMsg(error);
-        callback === null || callback === void 0 ? void 0 : callback();
+        rest.forEach((i) => {
+            if (form.formData[str]) {
+                form.formData[str][i] = addItem;
+            }
+            else {
+                form.formData[str] = {
+                    [i]: addItem,
+                };
+            }
+        });
+    }, [rules, name, errorMsg, form]);
+    /** 这段代码不能删除，当增加/删除列的时候有些默认值需要更新 */
+    useEffect(() => {
+        if (initialValue) {
+            setValue(initialValue);
+            generateFormData(name, initialValue);
+            updateRender();
+        }
+    }, [initialValue]);
+    // 初始化设置默认值,
+    useEffect(() => {
+        const initValue = getInitValue(initialValues, name);
+        // @ts-ignore
+        const _value = ['', null, undefined].includes(initValue) ? initialValue : initValue;
+        setValue(_value);
+        generateFormData(name, _value);
         updateRender();
-      },
-      checkItem: () => {
-        const error = handleCheckItem(value, rules);
+    }, []);
+    // 默认方法
+    const handleChange = (e) => {
+        var _a;
+        let val;
+        if (typeof e === 'object') {
+            val = (_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value;
+        }
+        else {
+            val = e;
+        }
+        setValue(val);
+        generateFormData(name, val);
+        const error = handleCheckItem(val, rules);
         setErrorMsg(error);
-        return error;
-      },
-      value,
-      errorMsg
+        updateRender();
     };
-    rest.forEach(i => {
-      if (form.formData[str]) {
-        form.formData[str][i] = addItem;
-      } else {
-        form.formData[str] = {
-          [i]: addItem
-        };
-      }
-    });
-  }, [rules, name, errorMsg, form]);
-  /** 这段代码不能删除，当增加/删除列的时候有些默认值需要更新 */
-  useEffect(() => {
-    if (initialValue) {
-      setValue(initialValue);
-      generateFormData(name, initialValue);
-      updateRender();
-    }
-  }, [initialValue]);
-  // 初始化设置默认值,
-  useEffect(() => {
-    const initValue = getInitValue(initialValues, name);
-    // @ts-ignore
-    const _value = ['', null, undefined].includes(initValue) ? initialValue : initValue;
-    setValue(_value);
-    generateFormData(name, _value);
-    updateRender();
-  }, []);
-  // 默认方法
-  const handleChange = e => {
-    var _a;
-    let val;
-    if (typeof e === 'object') {
-      val = (_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value;
-    } else {
-      val = e;
-    }
-    setValue(val);
-    generateFormData(name, val);
-    const error = handleCheckItem(val, rules);
-    setErrorMsg(error);
-    updateRender();
-  };
-  return React.createElement("div", {
-    className: errorMsg ? 'has-error custom-form-item-wrapper' : 'custom-form-item-wrapper',
-    style: style
-  }, React.Children.map(children, child => {
-    var _a;
-    if (React.isValidElement(child)) {
-      return React.cloneElement(child, Object.assign({
-        value,
-        form,
-        onChange: handleChange,
-        'data-key': (_a = getNames(name)) === null || _a === void 0 ? void 0 : _a.join('.')
-      }, child.props));
-    }
-    return null;
-  }), errorMsg && React.createElement("div", {
-    className: "ant-form-explain ant-form-item-explain-error"
-  }, errorMsg));
+    return (React.createElement("div", { className: errorMsg ? 'has-error custom-form-item-wrapper' : 'custom-form-item-wrapper', style: style },
+        React.Children.map(children, (child) => {
+            var _a;
+            if (React.isValidElement(child)) {
+                return React.cloneElement(child, Object.assign({ value,
+                    form, onChange: handleChange, 'data-key': (_a = getNames(name)) === null || _a === void 0 ? void 0 : _a.join('.') }, child.props));
+            }
+            return null;
+        }),
+        errorMsg && React.createElement("div", { className: "ant-form-explain ant-form-item-explain-error" }, errorMsg)));
 });
 function arePropsEqual(prevProps, nextProps) {
-  if (!nextProps.shouldUpdate && Array.isArray(nextProps.dependencies)) {
-    return true;
-  }
-  return false;
+    if (!nextProps.shouldUpdate && Array.isArray(nextProps.dependencies)) {
+        return true;
+    }
+    return false;
 }
-export default memo(ItemComp);
+export default memo(ItemComp);
+//# sourceMappingURL=ItemComp.js.map

package/es/tntd-form/TntdForm/components/List.js

@@ -1,5 +1,3 @@
-import _isEqual from "lodash/isEqual";
-import _cloneDeep from "lodash/cloneDeep";
 /*
  * @Descripttion: FormList
  * @Author: 郑泳健
@@ -8,95 +6,86 @@ import _cloneDeep from "lodash/cloneDeep";
  * @LastEditTime: 2023-04-06 17:42:31
  */
 import React, { useState, useEffect, useRef, useContext, memo } from 'react';
+import { cloneDeep, isEqual } from 'lodash';
 import { getNames } from '../utils';
 import { FormContext } from '../store';
-const List = ({
-  name,
-  children
-}) => {
-  const maxRef = useRef(-1);
-  const {
-    form,
-    initialValues,
-    compsRefs,
-    updateRefs
-  } = useContext(FormContext);
-  const [dataLevel, setDataLevel] = useState([]);
-  /** 根据一开始记录的渲染shouldUpdate 和 dependencies组件 */
-  const updateRender = () => {
-    if (Array.isArray(updateRefs.current.shouldUpdateList)) {
-      updateRefs.current.shouldUpdateList.forEach(i => {
-        var _a, _b;
-        (_b = (_a = compsRefs === null || compsRefs === void 0 ? void 0 : compsRefs.current) === null || _a === void 0 ? void 0 : _a[i]) === null || _b === void 0 ? void 0 : _b.call(_a);
-      });
-    }
-    const list = updateRefs.current.dependencies[getNames(name).join('.')];
-    if (Array.isArray(list)) {
-      list.forEach(i => {
-        var _a, _b;
-        (_b = (_a = compsRefs === null || compsRefs === void 0 ? void 0 : compsRefs.current) === null || _a === void 0 ? void 0 : _a[i]) === null || _b === void 0 ? void 0 : _b.call(_a);
-      });
-    }
-  };
-  /** 根据默认数值自动生成dataLevel */
-  useEffect(() => {
-    let dataSource = initialValues;
-    const attrs = getNames(name);
-    const key = Array.isArray(name) ? name === null || name === void 0 ? void 0 : name[0] : name;
-    for (const key of attrs) {
-      dataSource = (dataSource === null || dataSource === void 0 ? void 0 : dataSource[key]) || [{}];
-    }
-    if (Array.isArray(dataSource)) {
-      const _level = dataSource.map((i, index) => {
-        return {
-          key: index,
-          name: `${attrs.join('.')}.${index}`
-        };
-      });
-      setDataLevel(_level);
-      maxRef.current = dataSource.length - 1;
-      if (form) {
-        form.dataLevel[key] = _level;
-      }
-      updateRender();
-    }
-  }, [form, initialValues, name]);
-  /** 新增一列 */
-  const handleAdd = index => {
-    const tempDataLevel = _cloneDeep(dataLevel);
-    const key = Array.isArray(name) ? name === null || name === void 0 ? void 0 : name[0] : name;
-    maxRef.current++;
-    const attrs = getNames(name);
-    tempDataLevel.splice(index + 1, 0, {
-      key: maxRef.current,
-      name: `${attrs === null || attrs === void 0 ? void 0 : attrs.join('.')}.${maxRef.current}`
-    });
-    setDataLevel(tempDataLevel);
-    if (form) {
-      form.dataLevel[key] = tempDataLevel;
-    }
-    updateRender();
-  };
-  /** 删除一列 */
-  const handleDel = index => {
-    const temp = _cloneDeep(dataLevel);
-    const key = Array.isArray(name) ? name === null || name === void 0 ? void 0 : name[0] : name;
-    temp.splice(index, 1);
-    setDataLevel(temp);
-    if (form) {
-      form.dataLevel[key] = temp;
-    }
-    updateRender();
-  };
-  return React.createElement(React.Fragment, null, children === null || children === void 0 ? void 0 : children(dataLevel, {
-    add: handleAdd,
-    remove: handleDel
-  }));
+const List = ({ name, children }) => {
+    const maxRef = useRef(-1);
+    const { form, initialValues, compsRefs, updateRefs } = useContext(FormContext);
+    const [dataLevel, setDataLevel] = useState([]);
+    /** 根据一开始记录的渲染shouldUpdate 和 dependencies组件 */
+    const updateRender = () => {
+        if (Array.isArray(updateRefs.current.shouldUpdateList)) {
+            updateRefs.current.shouldUpdateList.forEach((i) => {
+                var _a, _b;
+                (_b = (_a = compsRefs === null || compsRefs === void 0 ? void 0 : compsRefs.current) === null || _a === void 0 ? void 0 : _a[i]) === null || _b === void 0 ? void 0 : _b.call(_a);
+            });
+        }
+        const list = updateRefs.current.dependencies[getNames(name).join('.')];
+        if (Array.isArray(list)) {
+            list.forEach((i) => {
+                var _a, _b;
+                (_b = (_a = compsRefs === null || compsRefs === void 0 ? void 0 : compsRefs.current) === null || _a === void 0 ? void 0 : _a[i]) === null || _b === void 0 ? void 0 : _b.call(_a);
+            });
+        }
+    };
+    /** 根据默认数值自动生成dataLevel */
+    useEffect(() => {
+        let dataSource = initialValues;
+        const attrs = getNames(name);
+        const key = Array.isArray(name) ? name === null || name === void 0 ? void 0 : name[0] : name;
+        for (const key of attrs) {
+            dataSource = (dataSource === null || dataSource === void 0 ? void 0 : dataSource[key]) || [{}];
+        }
+        if (Array.isArray(dataSource)) {
+            const _level = dataSource.map((i, index) => {
+                return {
+                    key: index,
+                    name: `${attrs.join('.')}.${index}`,
+                };
+            });
+            setDataLevel(_level);
+            maxRef.current = dataSource.length - 1;
+            if (form) {
+                form.dataLevel[key] = _level;
+            }
+            updateRender();
+        }
+    }, [form, initialValues, name]);
+    /** 新增一列 */
+    const handleAdd = (index) => {
+        const tempDataLevel = cloneDeep(dataLevel);
+        const key = Array.isArray(name) ? name === null || name === void 0 ? void 0 : name[0] : name;
+        maxRef.current++;
+        const attrs = getNames(name);
+        tempDataLevel.splice(index + 1, 0, {
+            key: maxRef.current,
+            name: `${attrs === null || attrs === void 0 ? void 0 : attrs.join('.')}.${maxRef.current}`,
+        });
+        setDataLevel(tempDataLevel);
+        if (form) {
+            form.dataLevel[key] = tempDataLevel;
+        }
+        updateRender();
+    };
+    /** 删除一列 */
+    const handleDel = (index) => {
+        const temp = cloneDeep(dataLevel);
+        const key = Array.isArray(name) ? name === null || name === void 0 ? void 0 : name[0] : name;
+        temp.splice(index, 1);
+        setDataLevel(temp);
+        if (form) {
+            form.dataLevel[key] = temp;
+        }
+        updateRender();
+    };
+    return React.createElement(React.Fragment, null, children === null || children === void 0 ? void 0 : children(dataLevel, { add: handleAdd, remove: handleDel }));
 };
 // name 没有改变就不需要重复render
 export default memo(List, (nextProps, prevProps) => {
-  if (_isEqual(nextProps.name, prevProps.name) && !!prevProps.name) {
-    return true;
-  }
-  return false;
-});
+    if (isEqual(nextProps.name, prevProps.name) && !!prevProps.name) {
+        return true;
+    }
+    return false;
+});
+//# sourceMappingURL=List.js.map

package/es/tntd-form/TntdForm/index.js

@@ -10,46 +10,41 @@ import { validateFields, getFieldsValue, getFieldValue } from './utils';
 import { FormContext } from './store';
 import List from './components/List';
 import Item from './components/Item';
-const TntdForm = ({
-  form,
-  initialValues,
-  children
-}) => {
-  const updateRefs = useRef({
-    shouldUpdateList: [],
-    dependencies: {}
-  });
-  const compsRefs = useRef({});
-  return React.createElement(FormContext.Provider, {
-    value: {
-      form,
-      initialValues,
-      updateRefs,
-      compsRefs
-    }
-  }, children);
+const TntdForm = ({ form, initialValues, children }) => {
+    const updateRefs = useRef({
+        shouldUpdateList: [],
+        dependencies: {},
+    });
+    const compsRefs = useRef({});
+    return (React.createElement(FormContext.Provider, { value: {
+            form,
+            initialValues,
+            updateRefs,
+            compsRefs,
+        } }, children));
 };
 TntdForm.useForm = () => {
-  const form = useRef({
-    dataLevel: {},
-    formData: {},
-    validateFields: () => validateFields(form.current),
-    getFieldsValue: () => getFieldsValue(form.current),
-    getFieldValue: field => getFieldValue(form.current, field),
-    setFieldsValue: obj => {
-      for (const i in obj) {
-        if (Object.prototype.hasOwnProperty.call(obj, i)) {
-          const prefix = (i === null || i === void 0 ? void 0 : i.split('.')) || [];
-          const attr = prefix.pop();
-          if (attr && form.current.formData[prefix.join('.')][attr]) {
-            form.current.formData[prefix.join('.')][attr].setItemValue(obj[i]);
-          }
-        }
-      }
-    }
-  });
-  return [form.current];
+    const form = useRef({
+        dataLevel: {},
+        formData: {},
+        validateFields: () => validateFields(form.current),
+        getFieldsValue: () => getFieldsValue(form.current),
+        getFieldValue: (field) => getFieldValue(form.current, field),
+        setFieldsValue: (obj) => {
+            for (const i in obj) {
+                if (Object.prototype.hasOwnProperty.call(obj, i)) {
+                    const prefix = (i === null || i === void 0 ? void 0 : i.split('.')) || [];
+                    const attr = prefix.pop();
+                    if (attr && form.current.formData[prefix.join('.')][attr]) {
+                        form.current.formData[prefix.join('.')][attr].setItemValue(obj[i]);
+                    }
+                }
+            }
+        },
+    });
+    return [form.current];
 };
 TntdForm.List = List;
 TntdForm.Item = Item;
-export default TntdForm;
+export default TntdForm;
+//# sourceMappingURL=index.js.map

package/es/tntd-form/TntdForm/interface.js

@@ -1 +1,2 @@
-export {};
+export {};
+//# sourceMappingURL=interface.js.map

package/es/tntd-form/TntdForm/store.js

@@ -1,2 +1,3 @@
 import React from 'react';
-export const FormContext = React.createContext({});
+export const FormContext = React.createContext({});
+//# sourceMappingURL=store.js.map