@hw-component/form 0.0.1-beta → 0.0.1-beta-v2

package/lib/hooks/index.js

@@ -1,137 +1,62 @@
-"use strict";
+'use strict';
 
-var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-var _defineProperty = require("@babel/runtime-corejs3/helpers/defineProperty");
-var _objectWithoutProperties = require("@babel/runtime-corejs3/helpers/objectWithoutProperties");
-var _mapInstanceProperty = require("@babel/runtime-corejs3/core-js/instance/map");
-var _Array$isArray = require("@babel/runtime-corejs3/core-js/array/is-array");
-var _concatInstanceProperty = require("@babel/runtime-corejs3/core-js/instance/concat");
-var _Object$keys = require("@babel/runtime-corejs3/core-js/object/keys");
-var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js/instance/for-each");
-var _Symbol$toPrimitive = require("@babel/runtime-corejs3/core-js/symbol/to-primitive");
-var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js/object/get-own-property-symbols");
-var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js/instance/filter");
-var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js/object/get-own-property-descriptor");
-var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js/object/get-own-property-descriptors");
-var _Object$defineProperties = require("@babel/runtime-corejs3/core-js/object/define-properties");
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js/object/define-property");
-var React = require("react");
-var configProvider = require("antd/es/config-provider");
-var FormConfigProvider = require("../Form/Context/FormConfigProvider.js");
+var _typeof = require('@babel/runtime-corejs3/helpers/typeof');
+var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
+var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
+var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js/instance/map');
+var _Array$isArray = require('@babel/runtime-corejs3/core-js/array/is-array');
+var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js/instance/concat');
+var _Object$keys = require('@babel/runtime-corejs3/core-js/object/keys');
+var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js/instance/for-each');
+var _Symbol$toPrimitive = require('@babel/runtime-corejs3/core-js/symbol/to-primitive');
+var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js/object/get-own-property-symbols');
+var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js/instance/filter');
+var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js/object/get-own-property-descriptor');
+var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js/object/get-own-property-descriptors');
+var _Object$defineProperties = require('@babel/runtime-corejs3/core-js/object/define-properties');
+var _Object$defineProperty = require('@babel/runtime-corejs3/core-js/object/define-property');
+var React = require('react');
+var configProvider = require('antd/es/config-provider');
+var FormConfigProvider = require('../Form/Context/FormConfigProvider.js');
 
-function ownKeys(object, enumerableOnly) {
-  var keys = _Object$keys(object);
-  if (_Object$getOwnPropertySymbols) {
-    var symbols = _Object$getOwnPropertySymbols(object);
-    enumerableOnly &&
-      (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) {
-        return _Object$getOwnPropertyDescriptor(object, sym).enumerable;
-      })),
-      keys.push.apply(keys, symbols);
-  }
-  return keys;
-}
-function _objectSpread(target) {
-  for (var i = 1; i < arguments.length; i++) {
-    var _context4, _context5;
-    var source = null != arguments[i] ? arguments[i] : {};
-    i % 2
-      ? _forEachInstanceProperty(
-          (_context4 = ownKeys(Object(source), !0))
-        ).call(_context4, function (key) {
-          _defineProperty(target, key, source[key]);
-        })
-      : _Object$getOwnPropertyDescriptors
-      ? _Object$defineProperties(
-          target,
-          _Object$getOwnPropertyDescriptors(source)
-        )
-      : _forEachInstanceProperty((_context5 = ownKeys(Object(source)))).call(
-          _context5,
-          function (key) {
-            _Object$defineProperty(
-              target,
-              key,
-              _Object$getOwnPropertyDescriptor(source, key)
-            );
-          }
-        );
-  }
-  return target;
-}
-function _toPropertyKey(arg) {
-  var key = _toPrimitive(arg, "string");
-  return _typeof(key) === "symbol" ? key : String(key);
-}
-function _toPrimitive(input, hint) {
-  if (_typeof(input) !== "object" || input === null) return input;
-  var prim = input[_Symbol$toPrimitive];
-  if (prim !== undefined) {
-    var res = prim.call(input, hint || "default");
-    if (_typeof(res) !== "object") return res;
-    throw new TypeError("@@toPrimitive must return a primitive value.");
-  }
-  return (hint === "string" ? String : Number)(input);
-}
+function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context4, _context5; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context4 = ownKeys(Object(source), !0)).call(_context4, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context5 = ownKeys(Object(source))).call(_context5, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[_Symbol$toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 var useChangeOptions = function useChangeOptions(_ref) {
   var options = _ref.options,
     _ref$fieldNames = _ref.fieldNames,
     fieldNames = _ref$fieldNames === void 0 ? {} : _ref$fieldNames;
-  return React.useMemo(
-    function () {
-      return options === null || options === void 0
-        ? void 0
-        : _mapInstanceProperty(options).call(options, function (item) {
-            var _context;
-            var _fieldNames$label = fieldNames.label,
-              label = _fieldNames$label === void 0 ? "" : _fieldNames$label,
-              _fieldNames$value = fieldNames.value,
-              value = _fieldNames$value === void 0 ? "" : _fieldNames$value;
-            var relLabel = item[label],
-              relVal = item[value],
-              oItem = _objectWithoutProperties(
-                item,
-                _mapInstanceProperty((_context = [label, value])).call(
-                  _context,
-                  _toPropertyKey
-                )
-              );
-            return _objectSpread(
-              _objectSpread({}, oItem),
-              {},
-              {
-                label: relLabel,
-                value: relVal,
-              }
-            );
-          });
-    },
-    [options]
-  );
+  return React.useMemo(function () {
+    return options === null || options === void 0 ? void 0 : _mapInstanceProperty(options).call(options, function (item) {
+      var _context;
+      var _fieldNames$label = fieldNames.label,
+        label = _fieldNames$label === void 0 ? "" : _fieldNames$label,
+        _fieldNames$value = fieldNames.value,
+        value = _fieldNames$value === void 0 ? "" : _fieldNames$value;
+      var relLabel = item[label],
+        relVal = item[value],
+        oItem = _objectWithoutProperties(item, _mapInstanceProperty(_context = [label, value]).call(_context, _toPropertyKey));
+      return _objectSpread(_objectSpread({}, oItem), {}, {
+        label: relLabel,
+        value: relVal
+      });
+    });
+  }, [options]);
 };
 var useClassName = function useClassName(className) {
   var config = React.useContext(configProvider.ConfigContext);
-  return React.useMemo(
-    function () {
-      var _context3;
-      if (_Array$isArray(className)) {
-        var classNames = _mapInstanceProperty(className).call(
-          className,
-          function (item) {
-            var _context2;
-            return _concatInstanceProperty(
-              (_context2 = "".concat(config.getPrefixCls(), "-"))
-            ).call(_context2, item);
-          }
-        );
-        return classNames.join(" ");
-      }
-      return _concatInstanceProperty(
-        (_context3 = "".concat(config.getPrefixCls(), "-"))
-      ).call(_context3, className);
-    },
-    [className]
-  );
+  return React.useMemo(function () {
+    var _context3;
+    if (_Array$isArray(className)) {
+      var classNames = _mapInstanceProperty(className).call(className, function (item) {
+        var _context2;
+        return _concatInstanceProperty(_context2 = "".concat(config.getPrefixCls(), "-")).call(_context2, item);
+      });
+      return classNames.join(" ");
+    }
+    return _concatInstanceProperty(_context3 = "".concat(config.getPrefixCls(), "-")).call(_context3, className);
+  }, [className]);
 };
 var useMatchConfigProps = function useMatchConfigProps(matchProps) {
   var globalConfig = FormConfigProvider.useFormConfigContext();

package/lib/index.d.ts

@@ -2,101 +2,21 @@
 import "./styles/index.less";
 export { default as HForm } from "./Form";
 export { default as useHForm } from "./Form/hooks/useHForm";
-export declare const HSelect: ({
-  style,
-  mode,
-  options,
-  modeConfig,
-  value,
-  onChange,
-  fieldNames: propsFieldNames,
-  request,
-  manual,
-  optionLabelProp,
-  filterProvider,
-  optionFilterProp,
-  serviceSearch,
-  onSearch: propsOnSearch,
-  filterOption,
-  showSearch,
-  labelInValue,
-  noMatchItemRender,
-  allSelect,
-  ...props
-}: import("./Select/modal").HSelectProps) => JSX.Element;
-export declare const HInput: ({
-  ...props
-}: import("antd").InputProps) => JSX.Element;
-export declare const HSelectInput: ({
-  selectProps,
-  value,
-  onChange,
-  valueName,
-  ...props
-}: import("./Input/modal").HSelectInputProps) => JSX.Element;
-export declare const HUpload: import("react").ForwardRefExoticComponent<
-  import("./Upload/modal").IUpLoadProps &
-    import("react").RefAttributes<import("./Upload/modal").IUploadRefModal>
->;
-export declare const HUrlUpload: ({
-  placeholder,
-  value,
-  onChange,
-  mediaType,
-  ...props
-}: import("./Upload/modal").IUrlUploadProps) => JSX.Element;
-export declare const HButtonInput: import("react").FC<
-  import("./Input/modal").HButtonInputProps
->;
-export declare const HCheckBox: import("react").FC<
-  import("./CheckboxGroup/modal").HCheckboxProps
->;
-export declare const HSwitch: import("react").FC<
-  import("./Switch").HSwitchProps
->;
-export declare const HCheckboxGroup: (
-  props: import("./Form/modal").HFormItemProps
-) => import("react").ReactElement<
-  import("./Form/modal").ConnectResultProps,
-  string | import("react").JSXElementConstructor<any>
->;
-export declare const HDatePicker: ({
-  value,
-  onChange,
-  showTime,
-  format,
-  ...props
-}: import("./TDPicker/modal").HDatePickerProps) => JSX.Element;
-export declare const HRangePicker: ({
-  value,
-  onChange,
-  showTime,
-  format,
-  valueMap,
-  ranges,
-  name,
-  ...props
-}: import("./TDPicker/modal").HRangePickerProps) => JSX.Element;
-export declare const HRadioGroup: ({
-  value,
-  options,
-  onChange,
-  fieldNames: propsFieldNames,
-  ...props
-}: import("./RadioGroup").HRadioGroupProps) => JSX.Element;
-export declare const HTimePicker: ({
-  value,
-  format,
-  onChange,
-  ...props
-}: import("./TDPicker/modal").HTimePickerProps) => JSX.Element;
-export declare const HInputNumber: ({
-  style,
-  ...props
-}: import("antd").InputNumberProps<string | number>) => JSX.Element;
-export declare const HPageHandler: import("react").FC<
-  import("./PageHandler/modal").IHPageHandler<any>
->;
-export declare const HFormConfigProvider: import("react").FC<
-  import("./Form/modal").IFormConfigContextProps
->;
+export { useHModalForm } from "./ModalForm/hooks";
+export declare const HSelect: ({ style, mode, options, modeConfig, value, onChange, fieldNames: propsFieldNames, request, manual, optionLabelProp, filterProvider, optionFilterProp, serviceSearch, onSearch: propsOnSearch, filterOption, showSearch, labelInValue, noMatchItemRender, allSelect, ...props }: import("./Select/modal").HSelectProps) => JSX.Element;
+export declare const HInput: ({ ...props }: import("antd").InputProps) => JSX.Element;
+export declare const HSelectInput: (props: import("./Form/modal").HFormItemProps) => import("react").ReactElement<import("./Form/modal").ConnectResultProps, string | import("react").JSXElementConstructor<any>>;
+export declare const HUpload: import("react").ForwardRefExoticComponent<import("./Upload/modal").IUpLoadProps & import("react").RefAttributes<import("./Upload/modal").IUploadRefModal>>;
+export declare const HUrlUpload: ({ placeholder, value, onChange, mediaType, ...props }: import("./Upload/modal").IUrlUploadProps) => JSX.Element;
+export declare const HButtonInput: import("react").FC<import("./Input/modal").HButtonInputProps>;
+export declare const HCheckBox: import("react").FC<import("./CheckboxGroup/modal").HCheckboxProps>;
+export declare const HSwitch: import("react").FC<import("./Switch").HSwitchProps>;
+export declare const HCheckboxGroup: (props: import("./Form/modal").HFormItemProps) => import("react").ReactElement<import("./Form/modal").ConnectResultProps, string | import("react").JSXElementConstructor<any>>;
+export declare const HDatePicker: ({ value, onChange, showTime, format, ...props }: import("./TDPicker/modal").HDatePickerProps) => JSX.Element;
+export declare const HRangePicker: (props: import("./Form/modal").HFormItemProps) => import("react").ReactElement<import("./Form/modal").ConnectResultProps, string | import("react").JSXElementConstructor<any>>;
+export declare const HRadioGroup: ({ value, options, onChange, fieldNames: propsFieldNames, ...props }: import("./RadioGroup").HRadioGroupProps) => JSX.Element;
+export declare const HTimePicker: ({ value, format, onChange, ...props }: import("./TDPicker/modal").HTimePickerProps) => JSX.Element;
+export declare const HInputNumber: ({ style, ...props }: import("antd").InputNumberProps<string | number>) => JSX.Element;
+export declare const HPageHandler: import("react").FC<import("./PageHandler/modal").IHPageHandler<any>>;
+export declare const HFormConfigProvider: import("react").FC<import("./Form/modal").IFormConfigContextProps>;
+export declare const HModalForm: ({ visible, title, onCancel, configData, infoRequest, request, afterClose, modalForm, initialValues, ...props }: import("./ModalForm/modal").ModalFormProps) => JSX.Element;

package/lib/index.js

@@ -1,9 +1,11 @@
-"use strict";
+'use strict';
 
-var config = require("./Form/config.js");
-var index$1 = require("./PageHandler/index.js");
-var index = require("./Form/index.js");
-var useHForm = require("./Form/hooks/useHForm.js");
+var config = require('./Form/config.js');
+var index$1 = require('./PageHandler/index.js');
+var index = require('./Form/index.js');
+var useHForm = require('./Form/hooks/useHForm.js');
+var hooks = require('./ModalForm/hooks.js');
+var index$2 = require('./ModalForm/index.js');
 
 var HSelect = config.default.select;
 var HInput = config.default.input;
@@ -21,9 +23,11 @@ var HTimePicker = config.default.timePicker;
 var HInputNumber = config.default.inputNumber;
 var HPageHandler = index$1.default;
 var HFormConfigProvider = config.default.formConfigProvider;
+var HModalForm = index$2.default;
 
 exports.HForm = index.default;
 exports.useHForm = useHForm.default;
+exports.useHModalForm = hooks.useHModalForm;
 exports.HButtonInput = HButtonInput;
 exports.HCheckBox = HCheckBox;
 exports.HCheckboxGroup = HCheckboxGroup;
@@ -31,6 +35,7 @@ exports.HDatePicker = HDatePicker;
 exports.HFormConfigProvider = HFormConfigProvider;
 exports.HInput = HInput;
 exports.HInputNumber = HInputNumber;
+exports.HModalForm = HModalForm;
 exports.HPageHandler = HPageHandler;
 exports.HRadioGroup = HRadioGroup;
 exports.HRangePicker = HRangePicker;

package/lib/modal.d.ts

@@ -1,15 +1,15 @@
 export interface ValueCheckMapModal {
-  checked?: any;
-  noChecked?: any;
+    checked?: any;
+    noChecked?: any;
 }
 export type PromiseFnResult<T = any, R = any> = (params: T) => Promise<R>;
 export interface ValueSwitchMapModal {
-  open?: any;
-  close?: any;
+    open?: any;
+    close?: any;
 }
 type NameProvider = (name: string) => string;
 export interface DateRangePickerValueMapModal {
-  start?: string | NameProvider;
-  end?: string | NameProvider;
+    start?: string | NameProvider;
+    end?: string | NameProvider;
 }
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hw-component/form",
-  "version": "0.0.1-beta",
+  "version": "0.0.1-beta-v2",
   "description": "基于antd二次开发",
   "repository": {
     "type": "git",

package/src/components/Form/InitSet.tsx

@@ -1,12 +1,10 @@
 import { useFormContext } from "./Context";
 import { useEffect } from "react";
-interface InitSetProps {
-  initValues?: Record<string, any>;
-}
-export default ({ initValues }: InitSetProps) => {
+
+export default () => {
   const { form } = useFormContext();
   useEffect(() => {
-    form.initValues(initValues);
+    form.initValues();
   }, []);
   return <></>;
 };

package/src/components/Form/hooks/index.ts

@@ -20,23 +20,3 @@ export const useSub = ({ request, onFinish, form }: ParamsModal) => {
     { manual: true }
   );
 }; //提交
-
-export const useInit = ({ infoRequest, initialValues = {} }: ParamsModal) => {
-  const {
-    run: infoRun,
-    loading: infoLoading,
-    error: infoErr,
-    data: infoData,
-  } = useRequest(async () => {
-    if (infoRequest) {
-      return infoRequest();
-    }
-    return initialValues;
-  });
-  return {
-    infoRun,
-    infoLoading,
-    infoErr,
-    infoData,
-  };
-}; //初始化

package/src/components/Form/hooks/useHForm.ts

@@ -13,6 +13,7 @@ export default () => {
   return useMemo<HFormInstance>(() => {
     const formatSourceData: Record<string, FormatItemModal> = {};
     let dispatchSourceData: Record<string, DispatchItemData> = {};
+    let cacheValues: Record<string, any> = {};
     const norAddItemDispatch = (name, fn) => {
       if (!name) {
         return {
@@ -28,6 +29,12 @@ export default () => {
       };
     };
     return {
+      initValues() {
+        if (cacheValues) {
+          const newValue = this.formatValues(cacheValues);
+          form.setFieldsValue(newValue);
+        }
+      },
       addFormat(name: string, format?: FormatItemModal) {
         if (!format) {
           return;
@@ -113,16 +120,13 @@ export default () => {
         }
         Reflect.deleteProperty(dispatchSourceData, key);
       },
-      initValues(value = {}) {
-        const newValue = this.formatValues(value);
-        form.setFieldsValue(newValue);
-      },
       outputValues(value) {
         return this.formatValues(value, "outputValue");
       },
       ...form,
       setFieldsValue(values) {
         const newValue = this.formatValues(values);
+        cacheValues = values;
         form.setFieldsValue(newValue);
       },
       validateFields(nameList) {

package/src/components/Form/index.tsx

@@ -1,11 +1,14 @@
 import { Form } from "antd";
 import type { HFormProps } from "./modal";
 import Item from "./FormItem";
-import { useCurrentForm, useInit, useSub } from "./hooks";
+import { useCurrentForm, useSub } from "./hooks";
 import { FormContext } from "./Context";
 import PageHandler from "../PageHandler";
 import useInitConfigData from "./hooks/useInitConfigData";
+import { useEffect } from "react";
+import { useRequest } from "ahooks";
 import InitSet from "./InitSet";
+
 export default ({
   configData,
   labelWidth,
@@ -28,12 +31,27 @@ export default ({
     valueType,
     form: hForm,
   });
-
-  const { infoRun, infoLoading, infoErr, infoData } = useInit({
-    infoRequest,
-    initialValues,
+  const {
+    run: infoRun,
+    loading: infoLoading,
+    error: infoErr,
+    data: infoData,
+  } = useRequest(async () => {
+    let setValue = initialValues;
+    if (!initialValues && !infoRequest) {
+      return {};
+    }
+    if (infoRequest) {
+      setValue = await infoRequest();
+    }
+    hForm.setFieldsValue(setValue);
+    return setValue;
   });
-
+  useEffect(() => {
+    return () => {
+      hForm.removeDispatchListener();
+    };
+  }, []);
   return (
     <PageHandler
       loading={infoLoading}
@@ -53,8 +71,8 @@ export default ({
               />
             );
           })}
+          <InitSet />
         </Form>
-        <InitSet initValues={infoData} />
       </FormContext.Provider>
     </PageHandler>
   );

package/src/components/Form/modal.ts

@@ -53,6 +53,8 @@ type HelperModal = (form: HFormInstance) => React.ReactNode | string;
 
 export type HideModal = (form: HFormInstance) => boolean;
 
+export type AddDispatchListenerFn = (action: ActionModal, fn: argsFn) => void;
+
 export interface HItemProps extends Omit<FormItemProps, "name"> {
   type?: string;
   itemProps?: ItemPropsType;
@@ -108,14 +110,14 @@ interface ActionModal {
 }
 export interface HFormInstance extends FormInstance {
   addFormat: (name: string, formats?: FormatItemModal) => void;
-  initValues: (values?: Record<string, any>) => void;
+  initValues: VoidFunction;
   formatValues: (
     values?: Record<string, any>,
     formatKey?: string
   ) => Record<string, any>;
   dispatch: (action: ActionModal, ...args: any[]) => void;
   outputValues: (values?: Record<string, any>) => Record<string, any>;
-  addDispatchListener: (action: ActionModal, fn: argsFn) => void;
+  addDispatchListener: AddDispatchListenerFn;
   removeDispatchListener: (action?: ActionModal, fn?: argsFn) => void;
 }
 

package/src/components/Input/SelectInput.tsx

@@ -13,6 +13,7 @@ export const Index = ({
   onChange,
   valueName = defaultValueName,
   addFormat,
+  addDispatchListener,
   ...props
 }: HSelectInputProps) => {
   const { input = "", select = "" } = valueName;
@@ -31,7 +32,7 @@ export const Index = ({
   addFormat?.({
     float: {
       inputValue: (item, initValue) => {
-        const { name } = item;
+        const { name = "" } = item;
         const resultObj = {};
         Object.values(valueName).forEach((key) => {
           resultObj[key] = initValue[key];
@@ -41,7 +42,7 @@ export const Index = ({
         };
       },
       outputValue: (item, outputValue) => {
-        const { name } = item;
+        const { name = "" } = item;
         const { [name]: itemVal = {} } = outputValue;
         const newItemVal = { [itemVal[select]]: itemVal[input] };
         return {

package/src/components/Input/modal.ts

@@ -3,6 +3,7 @@ import type { HSelectProps } from "../Select/modal";
 import type { SelectInputType } from "./SelectInput";
 import type { PromiseFnResult } from "../modal";
 import type { addFormatItemModal } from "../Form/modal";
+import type { AddDispatchListenerFn } from "../Form/modal";
 
 export type HInputProps = InputProps;
 
@@ -18,6 +19,7 @@ export interface HSelectInputProps
   onChange?: (value: Record<string, any>, type: SelectInputType) => void;
   valueName?: ValueNameModal;
   addFormat?: (config: Record<string, addFormatItemModal>) => void;
+  addDispatchListener?: AddDispatchListenerFn;
 }
 export interface HButtonProps extends Omit<ButtonProps, "onClick"> {
   onClick: (

package/src/components/ModalForm/hooks.ts

@@ -0,0 +1,45 @@
+import { useEffect, useMemo, useState } from "react";
+import useHForm from "../Form/hooks/useHForm";
+import type {
+  HModalFormInstance,
+  ModifyPropsModal,
+} from "@/components/ModalForm/modal";
+
+export const useModifyProps = ({
+  visible,
+  configData,
+  initialValues,
+}: ModifyPropsModal) => {
+  const [modalVisible, setModalVisible] = useState(visible);
+  const [modalFormData, setModalFormData] = useState(configData);
+  const [initValue, setInitValue] = useState(initialValues);
+  useEffect(() => {
+    setModalVisible(visible);
+  }, [visible]);
+  useEffect(() => {
+    setModalFormData(configData);
+  }, [configData]);
+  return {
+    modalFormData,
+    modalVisible,
+    setModalVisible,
+    setModalFormData,
+    initValue,
+    setInitValue,
+  };
+};
+export const useHModalForm = () => {
+  const hForm = useHForm();
+  return useMemo<HModalFormInstance>(() => {
+    return {
+      ...hForm,
+      show: (params) => {},
+      hide: () => {},
+    };
+  }, []);
+};
+
+export const useCurrentForm = (hModalForm?: HModalFormInstance) => {
+  const defaultHModalForm = useHModalForm();
+  return hModalForm || defaultHModalForm;
+};