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

package/es/ProForm/index.js

@@ -1,15 +1,27 @@
-import _omit from "lodash/omit";
-import _merge from "lodash/merge";
-import _isObject from "lodash/isObject";
-import { DoubleLeftOutlined } from '@ant-design/icons';
-import { Col, Form, Row, Space } from 'antd';
-import classnames from 'classnames';
-import React, { forwardRef, useImperativeHandle, useMemo, useEffect } from 'react';
+import { jsx, jsxs } from "react/jsx-runtime";
+import { DoubleLeftOutlined } from "@ant-design/icons";
+import { Col, Form, Row, Space } from "antd";
+import classnames from "classnames";
+import React, {
+  forwardRef,
+  useImperativeHandle,
+  useMemo,
+  useEffect
+} from "react";
+import isObject from "lodash/isObject";
+import merge from "lodash/merge";
+import omit from "lodash/omit";
 import { FormFooter } from "./components";
 import RenderFields from "./components/render/RenderFields";
 import { useProConfig } from "../ProConfigProvider";
 import { useProDrawerFormContext } from "../ProDrawerForm";
-import { getLayout, splitNameStr, initialValuesToNames, filterInternalFields, getFormFieldPaths } from "./utils/index";
+import {
+  getLayout,
+  splitNameStr,
+  initialValuesToNames,
+  filterInternalFields,
+  getFormFieldPaths
+} from "./utils/index";
 import { useControlled } from "./hooks/useControlled";
 import { useForm } from "./hooks/useForm";
 import { useFieldProps } from "./hooks/useFieldProps";
@@ -17,10 +29,9 @@ import locale from "../locale";
 import useWatch from "./hooks/useWatch";
 import FormsProvider, { useContextForms, useForms } from "../FormsProvider";
 import { useStep } from "../ProStep";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const ProForm = (props, ref) => {
   const {
-    mode = 'search',
+    mode = "search",
     span,
     disabled,
     isView,
@@ -38,7 +49,7 @@ const ProForm = (props, ref) => {
     expand,
     expandOpen,
     expandOpenChange,
-    viewEmpty = '-',
+    viewEmpty = "-",
     labelAlign,
     labelWidth,
     onValuesChange,
@@ -58,23 +69,15 @@ const ProForm = (props, ref) => {
     shouldUpdateDebounce = 200,
     ...otherProps
   } = props;
-  const config = useProConfig('ProForm');
-  // source: 用于区分是哪个组件调用，用于错误提示
-  const {
-    source = ''
-  } = useProDrawerFormContext() || {};
-  // stepSource: 用于区分是哪个组件调用，用于错误提示
-  const {
-    source: stepSource = ''
-  } = useStep() || {};
+  const config = useProConfig("ProForm");
+  const { source = "" } = useProDrawerFormContext() || {};
+  const { source: stepSource = "" } = useStep() || {};
   const [form] = useForm(originForm, {
     scrollToError,
     optimize,
     formKey,
-    source: source || stepSource || 'ProForm'
+    source: source || stepSource || "ProForm"
   });
-
-  // 保存内部配置
   useEffect(() => {
     if (!form.__INTERNAL_CONFIG__) {
       form.__INTERNAL_CONFIG__ = {};
@@ -86,210 +89,167 @@ const ProForm = (props, ref) => {
     value: expandOpen,
     onChange: expandOpenChange
   });
-  const {
-    formProps,
-    colProps,
-    onOk: _onOk,
-    onCancel: _onCancel
-  } = getLayout({
-    span,
-    form
-  });
-
-  // 初始值names转换
+  const { formProps, colProps, onOk: _onOk, onCancel: _onCancel } = getLayout({ span, form });
   const _initialValues = useMemo(() => {
     const values = initialValuesToNames(initialValues, columns);
     return values;
   }, []);
-
-  /**
-   * 展开&收起函数
-   */
   const expandHandle = () => {
-    setOpenState?.(!openState);
+    setOpenState == null ? void 0 : setOpenState(!openState);
   };
   const expandRender = () => {
-    return !!expand && columns.length > Number(expand) && /*#__PURE__*/_jsx("div", {
-      className: "expand-button",
-      onClick: expandHandle,
-      children: !openState ? /*#__PURE__*/_jsxs(Space, {
-        align: "center",
-        children: [locale.ProForm.unfold, /*#__PURE__*/_jsx(DoubleLeftOutlined, {
-          className: "rotate-to-bottom"
-        })]
-      }) : /*#__PURE__*/_jsxs(Space, {
-        align: "center",
-        children: [locale.ProForm.packUp, /*#__PURE__*/_jsx(DoubleLeftOutlined, {
-          className: "rotate-to-top"
-        })]
-      })
-    });
+    return !!expand && columns.length > Number(expand) && /* @__PURE__ */ jsx("div", { className: "expand-button", onClick: expandHandle, children: !openState ? /* @__PURE__ */ jsxs(Space, { align: "center", children: [
+      locale.ProForm.unfold,
+      /* @__PURE__ */ jsx(DoubleLeftOutlined, { className: "rotate-to-bottom" })
+    ] }) : /* @__PURE__ */ jsxs(Space, { align: "center", children: [
+      locale.ProForm.packUp,
+      /* @__PURE__ */ jsx(DoubleLeftOutlined, { className: "rotate-to-top" })
+    ] }) });
   };
-  const defaultFooter = footerConfig => {
-    return /*#__PURE__*/_jsx(FormFooter, {
-      formId: formId,
-      onOk: onOk || _onOk,
-      okText: okText,
-      confirmLoading: confirmLoading,
-      onCancel: onCancel || _onCancel,
-      cancelText: cancelText,
-      footer: footerConfig,
-      form: form
-    });
+  const defaultFooter = (footerConfig) => {
+    return /* @__PURE__ */ jsx(
+      FormFooter,
+      {
+        formId,
+        onOk: onOk || _onOk,
+        okText,
+        confirmLoading,
+        onCancel: onCancel || _onCancel,
+        cancelText,
+        footer: footerConfig,
+        form
+      }
+    );
   };
-
-  // 暴露form出去给类组件使用
   useImperativeHandle(ref, () => form);
-
-  // 解决平铺后的值拿不到的问题
-  const handleValuesChange = changedValue => {
-    if (!onValuesChange) return;
-
-    // 暂时通过'-'区分组合组件字段和普通字段
+  const handleValuesChange = (changedValue) => {
+    if (!onValuesChange)
+      return;
     const keys = Object.keys(changedValue);
     if (!keys.length) {
       onValuesChange(filterInternalFields(changedValue, optimize), form.getFieldsValue());
     } else {
-      const values = keys.map(key => {
-        if (key.includes('-')) {
+      const values = keys.map((key) => {
+        if (key.includes("-")) {
           let comKeys = [];
-          comKeys = key.split('-').map(keyStr => keyStr.split('_'));
+          comKeys = key.split("-").map((keyStr) => keyStr.split("_"));
           return form.getFieldsValue(comKeys);
         }
         return {};
       });
-      onValuesChange(filterInternalFields(_merge(changedValue, ...values), optimize), form.getFieldsValue());
+      onValuesChange(
+        filterInternalFields(merge(changedValue, ...values), optimize),
+        form.getFieldsValue()
+      );
     }
   };
-
-  // 包装一层兼容 names 改变
   const handleFinish = () => {
-    onFinish?.(form.getFieldsValue());
+    onFinish == null ? void 0 : onFinish(form.getFieldsValue());
   };
   const cls = classnames({
-    'pro-form': true,
-    'pro-form-view': isView,
+    "pro-form": true,
+    "pro-form-view": isView,
     [className]: className
   });
   const footerCls = classnames({
-    'pro-form-custom-footer': true
+    "pro-form-custom-footer": true
   });
   const footerRender = () => {
     let footerEle = null;
     if (isView || disabled) {
-      // 查看或禁用模式
       footerEle = null;
-    } else if ( /*#__PURE__*/React.isValidElement(footer)) {
-      // 传入组件渲染组件
+    } else if (React.isValidElement(footer)) {
       footerEle = footer;
-    } else if (footer === undefined || footer || _isObject(footer)) {
-      // 不传或者传入对象 渲染默认
+    } else if (footer === void 0 || footer || isObject(footer)) {
       footerEle = defaultFooter(footer);
     }
-
-    // 展开折叠按钮
     const expandEle = expandRender();
     const hasElement = footerEle || expandEle;
-    return hasElement ? /*#__PURE__*/_jsx(Col, {
-      ...colProps,
-      className: footerCls,
-      children: /*#__PURE__*/_jsxs(Space, {
-        align: "center",
-        children: [footerEle, expandEle]
-      })
-    }) : null;
+    return hasElement ? /* @__PURE__ */ jsx(Col, { ...colProps, className: footerCls, children: /* @__PURE__ */ jsxs(Space, { align: "center", children: [
+      footerEle,
+      expandEle
+    ] }) }) : null;
   };
-
-  // 国际化，非中文时默认上下布局
-  if (localStorage?.locale && localStorage.locale !== 'zh-CN') {
-    // 一行布局时，左右布局
+  if ((localStorage == null ? void 0 : localStorage.locale) && localStorage.locale !== "zh-CN") {
     if (span === 24) {
-      otherProps.layout = otherProps.layout || 'horizontal';
+      otherProps.layout = otherProps.layout || "horizontal";
     } else {
-      // 其他布局时，上下布局
-      otherProps.layout = otherProps.layout || 'vertical';
+      otherProps.layout = otherProps.layout || "vertical";
     }
   }
-
-  // 过滤掉自定义 props，避免传递到 DOM 元素
-  const filteredOtherProps = _omit(otherProps, ['desensitizationKey']);
-  return /*#__PURE__*/_jsxs(Form, {
-    onKeyPress: event => {
-      if (!submitOnEnter) return;
-      if (event.key === 'Enter') {
-        form.submit();
-      }
-    },
-    className: cls,
-    form: form,
-    ...formProps,
-    ..._omit(config, ['isDiffAll']),
-    ...filteredOtherProps,
-    labelAlign: labelAlign ?? config.labelAlign ?? 'left',
-    onValuesChange: handleValuesChange,
-    onFinish: handleFinish,
-    onFinishFailed: ({
-      errorFields
-    }) => {
-      if (scrollToError && errorFields?.length) {
-        form.scrollToField(errorFields[0]?.name, {
-          block: 'center',
-          behavior: 'smooth'
-        });
-      }
-    },
-    initialValues: _initialValues,
-    children: [/*#__PURE__*/_jsxs(Row, {
-      gutter: 24,
-      ...rowProps,
-      children: [/*#__PURE__*/_jsx(RenderFields, {
-        form: form,
-        isView: isView,
-        columns: columns,
-        disabled: disabled,
-        expand: expand // 展示条数
-        ,
-        openState: openState // 展开折叠状态
-        ,
-        colProps: colProps,
-        viewEmpty: viewEmpty,
-        labelWidth: labelWidth,
-        diffConfig: diffConfig,
-        clearNotShow: clearNotShow,
-        requiredOnView: requiredOnView,
-        required: required,
-        globalControl: globalControl,
-        shouldUpdateDebounce: shouldUpdateDebounce
-      }), footerRender()]
-    }), children]
-  });
+  const filteredOtherProps = omit(otherProps, ["desensitizationKey"]);
+  return /* @__PURE__ */ jsxs(
+    Form,
+    {
+      onKeyPress: (event) => {
+        if (!submitOnEnter)
+          return;
+        if (event.key === "Enter") {
+          form.submit();
+        }
+      },
+      className: cls,
+      form,
+      ...formProps,
+      ...omit(config, ["isDiffAll"]),
+      ...filteredOtherProps,
+      labelAlign: labelAlign ?? config.labelAlign ?? "left",
+      onValuesChange: handleValuesChange,
+      onFinish: handleFinish,
+      onFinishFailed: ({ errorFields }) => {
+        var _a;
+        if (scrollToError && (errorFields == null ? void 0 : errorFields.length)) {
+          form.scrollToField((_a = errorFields[0]) == null ? void 0 : _a.name, {
+            block: "center",
+            behavior: "smooth"
+          });
+        }
+      },
+      initialValues: _initialValues,
+      children: [
+        /* @__PURE__ */ jsxs(Row, { gutter: 24, ...rowProps, children: [
+          /* @__PURE__ */ jsx(
+            RenderFields,
+            {
+              form,
+              isView,
+              columns,
+              disabled,
+              expand,
+              openState,
+              colProps,
+              viewEmpty,
+              labelWidth,
+              diffConfig,
+              clearNotShow,
+              requiredOnView,
+              required,
+              globalControl,
+              shouldUpdateDebounce
+            }
+          ),
+          footerRender()
+        ] }),
+        children
+      ]
+    }
+  );
 };
-const ProFormForward = /*#__PURE__*/forwardRef(ProForm);
+const ProFormForward = forwardRef(ProForm);
 ProFormForward.useForm = useForm;
 ProFormForward.useWatch = useWatch;
-export const ProFormProvider = props => {
-  const {
-    onFormChange,
-    onFormFinish,
-    children
-  } = props;
+const ProFormProvider = (props) => {
+  const { onFormChange, onFormFinish, children } = props;
   const handleFormChange = (formName, info) => {
-    const {
-      changedFields
-    } = info;
-    const _changedFields = changedFields.flatMap(item => {
-      const {
-        value = []
-      } = item;
+    const { changedFields } = info;
+    const _changedFields = changedFields.flatMap((item) => {
+      const { value = [] } = item;
       const name = item.name;
       const namesStr = name[name.length - 1];
-
-      // name中的最后一位如果包含 '-' 则是names组件
-      const isNames = String(namesStr).includes('-');
-      if (!isNames) return item; // 不是names组件直接返回
-
-      const namesList = splitNameStr(String(namesStr)); // 拆解出name列表
-
+      const isNames = String(namesStr).includes("-");
+      if (!isNames)
+        return item;
+      const namesList = splitNameStr(String(namesStr));
       const prefix = name.slice(0, name.length - 1);
       return namesList.map((nameItem, index) => {
         return {
@@ -301,21 +261,24 @@ export const ProFormProvider = props => {
       });
     });
     info.changedFields = _changedFields;
-
-    // @ts-ignore
     onFormChange(formName, info);
   };
-  return /*#__PURE__*/_jsx(Form.Provider, {
-    onFormChange: onFormChange ? handleFormChange : undefined,
-    onFormFinish: onFormFinish,
-    children: children
-  });
+  return /* @__PURE__ */ jsx(
+    Form.Provider,
+    {
+      onFormChange: onFormChange ? handleFormChange : void 0,
+      onFormFinish,
+      children
+    }
+  );
+};
+ProFormForward.Provider = ProFormProvider;
+ProFormForward.useFieldProps = useFieldProps;
+ProFormForward.FormsProvider = FormsProvider;
+ProFormForward.useForms = useForms;
+ProFormForward.useContextForms = useContextForms;
+var ProForm_default = ProFormForward;
+export {
+  ProFormProvider,
+  ProForm_default as default
 };
-ProFormForward.Provider = ProFormProvider; // 包装Provider
-ProFormForward.useFieldProps = useFieldProps; // 获取每个字段的其他参数  -otherProps
-// 表单实例共享
-ProFormForward.FormsProvider = FormsProvider; // 表单实例共享Provider
-ProFormForward.useForms = useForms; // 获取上下文中的共享的表单实例map
-ProFormForward.useContextForms = useContextForms; // 获取上下文中的共享的表单实例map
-
-export default ProFormForward;

package/es/ProForm/propsType.js

@@ -1,7 +1,15 @@
-export const otherKeys = ['isView', 'viewEmpty', 'label', 'valueType', 'viewType', 'name', 'names', 'form', 'type', 'hiddenNames'];
-
-/**
- * ProForm 组件接口类型
- * 用于定义 ProForm 组件及其静态方法的类型
- * 注意：此接口的具体实现方法类型在组件文件中定义，这里只提供基础结构
- */
+const otherKeys = [
+  "isView",
+  "viewEmpty",
+  "label",
+  "valueType",
+  "viewType",
+  "name",
+  "names",
+  "form",
+  "type",
+  "hiddenNames"
+];
+export {
+  otherKeys
+};

package/es/ProForm/utils/buildFormItemProps.js

@@ -1,16 +1,20 @@
-import _omit from "lodash/omit";
-import _isFunction from "lodash/isFunction";
+import isFunction from "lodash/isFunction";
+import omit from "lodash/omit";
 import { isTrim, isUpperCase } from "./index";
 import transformNames from "./transformNames";
 import valueTypeMap from "./valueType";
-
-/** 整理 lastFormItemProps 时需要剔除、防止透传给 Form.Item 报错的 key */
-const OMIT_FORM_ITEM_KEYS = ['component', 'names', 'format', 'toISOString', 'toCSTString', 'switchValue', 'precision', 'clearNotShow', 'dependNames'];
-/**
- * 将列配置整理为最终透传给 Form.Item 的 props（纯函数）
- * 聚合 valueType transform / transformNames / 校验规则 / disabled 优先级 / omit
- */
-export const buildFormItemProps = params => {
+const OMIT_FORM_ITEM_KEYS = [
+  "component",
+  "names",
+  "format",
+  "toISOString",
+  "toCSTString",
+  "switchValue",
+  "precision",
+  "clearNotShow",
+  "dependNames"
+];
+const buildFormItemProps = (params) => {
   const {
     baseFormItemProps,
     otherProps,
@@ -29,22 +33,14 @@ export const buildFormItemProps = params => {
     lastDisabled,
     labelWidth
   } = params;
-
-  /**
-   * 基于formItem的normalize与getValueProps进行值类型转换
-   */
   const valueTypeTransform = () => {
-    let {
-      valueType
-    } = otherProps || {};
-    // SwitchCheckbox默认YN, 兼容已有组件
-    if (type === 'SwitchCheckbox') {
-      valueType = 'switch';
+    let { valueType } = otherProps || {};
+    if (type === "SwitchCheckbox") {
+      valueType = "switch";
     }
-    if (type === 'Input') {
-      valueType = valueType || 'trim';
+    if (type === "Input") {
+      valueType = valueType || "trim";
     }
-    // 不存在valueType返回空
     if (!valueType) {
       return {};
     }
@@ -52,39 +48,36 @@ export const buildFormItemProps = params => {
       ...otherProps,
       ...baseFormItemProps
     };
-    return _isFunction(valueTypeMap[valueType]) ? valueTypeMap[valueType](valueTypeParams) : {};
+    return isFunction(valueTypeMap[valueType]) ? valueTypeMap[valueType](valueTypeParams) : {};
   };
-
-  /**
-   * transform对象
-   * 存在names通过transformNames转换平铺处理, 没有默认走valueType的处理
-   */
-  const transforms = Array.isArray(otherProps?.names) ? transformNames({
-    ...baseFormItemProps,
-    ...valueTypeTransform()
-  },
-  // 合并valueType的transform
-  form, otherProps.names, namesStr, otherProps.type) : valueTypeTransform();
-  return _omit({
-    ...baseFormItemProps,
-    ...transforms,
-    names: otherProps.names,
-    ...internalRule,
-    required: resolvedRequired || Array.isArray(rules) && rules?.some(item => item?.required) || (typeof labelRequired === 'boolean' ? labelRequired : false),
-    ...(otherProps.isView && !requiredOnView ? {
-      required: false
-    } : null),
-    ...isTrim(type, trim, proConfig),
-    // 优先取传进来的，其次取ProConfigProvider配置的
-    ...isUpperCase(type, upperCase),
-    validateFirst,
-    // 当某一规则校验不通过时，是否停止剩下的规则的校验
-    disabled: lastDisabled,
-    // 添加label宽度
-    ...(labelWidth ? {
-      labelCol: {
-        flex: `${labelWidth}px`
-      }
-    } : null)
-  }, OMIT_FORM_ITEM_KEYS);
-};
+  const transforms = Array.isArray(otherProps == null ? void 0 : otherProps.names) ? transformNames(
+    { ...baseFormItemProps, ...valueTypeTransform() },
+    // 合并valueType的transform
+    form,
+    otherProps.names,
+    namesStr,
+    otherProps.type
+  ) : valueTypeTransform();
+  return omit(
+    {
+      ...baseFormItemProps,
+      ...transforms,
+      names: otherProps.names,
+      ...internalRule,
+      required: resolvedRequired || Array.isArray(rules) && (rules == null ? void 0 : rules.some((item) => item == null ? void 0 : item.required)) || (typeof labelRequired === "boolean" ? labelRequired : false),
+      ...otherProps.isView && !requiredOnView ? { required: false } : null,
+      ...isTrim(type, trim, proConfig),
+      // 优先取传进来的，其次取ProConfigProvider配置的
+      ...isUpperCase(type, upperCase),
+      validateFirst,
+      // 当某一规则校验不通过时，是否停止剩下的规则的校验
+      disabled: lastDisabled,
+      // 添加label宽度
+      ...labelWidth ? { labelCol: { flex: `${labelWidth}px` } } : null
+    },
+    OMIT_FORM_ITEM_KEYS
+  );
+};
+export {
+  buildFormItemProps
+};