@mi-avalon/libs 0.0.22 → 0.0.24

package/dist/components/MForm/MFormItemConst.d.ts

@@ -0,0 +1,25 @@
+import { type IMFormCascaderItem, type IMFormCheckBoxGroupItem, type IMFormDatePickerItem, type IMFormInputItem, type IMFormInputNumItem, type IMFormItem, type IMFormMentionsItem, type IMFormRadioGroupItem, type IMFormRangePickerItem, type IMFormSelectItem, type IMFormTextItem, type IMFormTreeSelectItem, type IMFormUploadItem } from './type';
+export declare class MFormItemConst {
+    static readonly labelCol: {
+        span: number;
+    };
+    static readonly wrapperCol: {
+        span: number;
+    };
+    static readonly defaultRowGutter = 24;
+    static getDefaultArrayPlaceholder(item: IMFormItem): [string, string];
+    static getDefaultPlaceholder(item: IMFormItem): string;
+    static input: (item: IMFormInputItem) => import("react/jsx-runtime").JSX.Element;
+    static password: (item: IMFormInputItem) => import("react/jsx-runtime").JSX.Element;
+    static text: (item: IMFormTextItem) => import("react/jsx-runtime").JSX.Element;
+    static inputNumber: (item: IMFormInputNumItem) => import("react/jsx-runtime").JSX.Element;
+    static datePicker: (item: IMFormDatePickerItem) => import("react/jsx-runtime").JSX.Element;
+    static rangePicker: (item: IMFormRangePickerItem) => import("react/jsx-runtime").JSX.Element;
+    static select: (item: IMFormSelectItem) => import("react/jsx-runtime").JSX.Element;
+    static radio: (item: IMFormRadioGroupItem) => import("react/jsx-runtime").JSX.Element;
+    static checkbox: (item: IMFormCheckBoxGroupItem) => import("react/jsx-runtime").JSX.Element;
+    static upload: (item: IMFormUploadItem) => import("react/jsx-runtime").JSX.Element;
+    static mentions: (item: IMFormMentionsItem) => import("react/jsx-runtime").JSX.Element;
+    static cascader: (item: IMFormCascaderItem) => import("react/jsx-runtime").JSX.Element;
+    static treeSelect: (item: IMFormTreeSelectItem) => import("react/jsx-runtime").JSX.Element;
+}

package/dist/components/MForm/MFormItemConst.js

@@ -0,0 +1,69 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { UploadOutlined } from '@ant-design/icons';
+import { Button, Cascader, Checkbox, DatePicker, Input, InputNumber, Mentions, Radio, Select, TreeSelect, Upload, } from 'antd';
+import { MFormItemTypeEnum, } from './type';
+const { RangePicker } = DatePicker;
+export class MFormItemConst {
+    static labelCol = { span: 7 };
+    static wrapperCol = { span: 17 };
+    static defaultRowGutter = 24;
+    static getDefaultArrayPlaceholder(item) {
+        let placeholder;
+        switch (item.type) {
+            case 'rangePicker':
+                placeholder = ['开始时间', '结束时间'];
+                break;
+        }
+        return placeholder;
+    }
+    static getDefaultPlaceholder(item) {
+        let placeholder;
+        switch (item.type) {
+            case MFormItemTypeEnum.Input:
+            case MFormItemTypeEnum.Password:
+            case MFormItemTypeEnum.InputNumber:
+            case MFormItemTypeEnum.Text:
+            case MFormItemTypeEnum.Mentions:
+                placeholder = `请输入${item.label}`;
+                break;
+            case MFormItemTypeEnum.Select:
+            case MFormItemTypeEnum.Checkbox:
+            case MFormItemTypeEnum.Radio:
+            case MFormItemTypeEnum.DatePicker:
+            case MFormItemTypeEnum.RangePicker:
+            case MFormItemTypeEnum.Cascader:
+            case MFormItemTypeEnum.Upload:
+            case MFormItemTypeEnum.TreeSelect:
+                placeholder = `请选择${item.label}`;
+                break;
+        }
+        return placeholder;
+    }
+    static input = (item) => (_jsx(Input, { disabled: item.disabled, maxLength: item.maxLength, ...item.props, placeholder: item.placeholder || MFormItemConst.getDefaultPlaceholder(item) }));
+    static password = (item) => (_jsx(Input.Password, { disabled: item.disabled, ...item.props, placeholder: item.placeholder || MFormItemConst.getDefaultPlaceholder(item) }));
+    static text = (item) => (_jsx(Input.TextArea, { disabled: item.disabled, maxLength: item.maxLength, ...item.props, placeholder: item.placeholder || MFormItemConst.getDefaultPlaceholder(item) }));
+    static inputNumber = (item) => (_jsx(InputNumber, { disabled: item.disabled, maxLength: item.maxLength, ...item.props, placeholder: item.placeholder || MFormItemConst.getDefaultPlaceholder(item) }));
+    static datePicker = (item) => (_jsx(DatePicker, { disabled: item.disabled, ...item.props, placeholder: item.placeholder || MFormItemConst.getDefaultPlaceholder(item) }));
+    static rangePicker = (item) => (_jsx(RangePicker, { disabled: item.disabled, ...item.props, placeholder: item.placeholder || MFormItemConst.getDefaultArrayPlaceholder(item) }));
+    static select = (item) => {
+        return (_jsx(Select, { ...item.props, disabled: item.disabled, placeholder: item.placeholder || MFormItemConst.getDefaultPlaceholder(item) }));
+    };
+    static radio = (item) => {
+        return _jsx(Radio.Group, { disabled: item.disabled, ...item.props });
+    };
+    static checkbox = (item) => {
+        return _jsx(Checkbox.Group, { disabled: item.disabled, ...item.props });
+    };
+    static upload = (item) => {
+        return (_jsx(Upload, { defaultFileList: item.initialValue, ...item.props, children: item.children || (_jsxs(Button, { children: [_jsx(UploadOutlined, {}), " \u70B9\u51FB\u4E0A\u4F20"] })) }));
+    };
+    static mentions = (item) => {
+        return (_jsx(Mentions, { ...item.props, placeholder: item.placeholder || MFormItemConst.getDefaultPlaceholder(item) }));
+    };
+    static cascader = (item) => {
+        return (_jsx(Cascader, { ...item.props, placeholder: item.placeholder || MFormItemConst.getDefaultPlaceholder(item) }));
+    };
+    static treeSelect = (item) => {
+        return (_jsx(TreeSelect, { ...item.props, placeholder: item.placeholder || MFormItemConst.getDefaultPlaceholder(item) }));
+    };
+}

package/dist/components/MForm/index.d.ts

@@ -0,0 +1,9 @@
+import './index.scss';
+import type { IMFormProps } from './type';
+declare function MForm(props: IMFormProps): import("react/jsx-runtime").JSX.Element;
+declare namespace MForm {
+    var displayName: string;
+}
+export default MForm;
+export * from './MFormItemConst';
+export * from './type';

package/dist/components/MForm/index.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * 表单组件
+ */
+import { Col, Form, Row } from 'antd';
+import { getClassName } from '../../utils';
+import { CompThemeProvider } from '../ThemeContext';
+import './index.scss';
+import { MFormItemConst } from './MFormItemConst';
+const classname = (n = '') => {
+    const cn = 'm-form';
+    return getClassName(cn, n);
+};
+function MForm(props) {
+    const { formProps, formItems = [], column = 1, form, itemLayout, formRowProps } = props;
+    const renderItem = (item, form) => {
+        if (item.render) {
+            return item.render(form);
+        }
+        const func = MFormItemConst[item.type];
+        if (item && item.type && func) {
+            const renderFunc = func;
+            return renderFunc(item);
+        }
+        return _jsx("div", { className: 'error-message', children: "Invalid form item configuration" });
+    };
+    const renderFormItem = (item) => {
+        const { show = true } = item;
+        if (!show)
+            return null;
+        const rules = [...(item.rules || [])];
+        if (item.required) {
+            rules.push({ required: true, message: item.required });
+        }
+        const formItemLayout = {
+            labelCol: MFormItemConst.labelCol,
+            wrapperCol: MFormItemConst.wrapperCol,
+            ...itemLayout,
+            ...item.itemLayout,
+        };
+        return (_jsx(Col, { span: item.span || 24 / column, children: _jsx("div", { className: classname('item-wrapper'), children: _jsx(Form.Item, { label: item.label, name: item.id, rules: rules, initialValue: item.initialValue, ...formItemLayout, ...item.formItemProps, children: renderItem(item, form) }) }) }, `col-${item.id}`));
+    };
+    return (_jsx(CompThemeProvider, { children: _jsx(Form, { form: form, ...formProps, className: `${classname()} ${formProps?.className}`, children: _jsx(Row, { gutter: MFormItemConst.defaultRowGutter, ...formRowProps, className: `${classname('grid')} ${formRowProps?.className}`, children: formItems.map(e => renderFormItem(e)) }) }) }));
+}
+MForm.displayName = 'MForm';
+export default MForm;
+export * from './MFormItemConst';
+export * from './type';

package/dist/components/MForm/type.d.ts

@@ -0,0 +1,178 @@
+import { type CascaderAutoProps, Checkbox, DatePicker, type FormInstance, type FormItemProps, type FormProps, type FormRule, Input, type InputNumberProps, type InputProps, type MentionsProps, type RadioGroupProps, type RowProps, type SelectProps, type TreeSelectProps, type UploadProps } from 'antd';
+import type { ReactElement } from 'react';
+type CheckboxGroupProps = React.ComponentProps<typeof Checkbox.Group>;
+type RangePickerProps = React.ComponentProps<typeof DatePicker.RangePicker>;
+type DatePickerProps = React.ComponentProps<typeof DatePicker>;
+type TextAreaProps = React.ComponentProps<typeof Input.TextArea>;
+export declare enum MFormItemTypeEnum {
+    Input = "input",
+    InputNumber = "inputNumber",
+    Text = "text",
+    Password = "password",
+    Radio = "radio",
+    Select = "select",
+    Checkbox = "checkbox",
+    DatePicker = "datePicker",
+    RangePicker = "rangePicker",
+    Upload = "upload",
+    Mentions = "mentions",
+    Cascader = "cascader",
+    TreeSelect = "treeSelect"
+}
+export declare type MFormItemLayout = {
+    span?: number;
+    offset?: number;
+};
+export interface IMFormProps {
+    /**
+     * 一行显示几个label 默认1个, 其他：2, 3, 4
+     */
+    column?: 1 | 2 | 3 | 4;
+    /**
+     * 需要的数据: [ { label: ...,id: ..., required: ..., type: ..., ... }, ... ]
+     */
+    formItems: IMFormItem[];
+    /**
+     * Antd const [form] = useForm()
+     */
+    form?: FormInstance;
+    /**
+     * 表单其他属性
+     */
+    formProps?: FormProps;
+    /**
+     * 全局 MFormItem layout， 默认为 {labelCol:{span: 7}, wrapperCol: {span: 7}}
+     * @type {{labelCol: MFormItemLayout, wrapperCol: MFormItemLayout}}
+     * @memberof MFormItem
+     */
+    itemLayout?: {
+        labelCol?: MFormItemLayout;
+        wrapperCol?: MFormItemLayout;
+    };
+    /**
+     * Antd Row 的其他属性
+     */
+    formRowProps?: RowProps;
+}
+export interface IMFormBaseItem {
+    /**
+     * 属性名
+     */
+    id: string;
+    /**
+     * label名称
+     */
+    label: string;
+    /**
+     * 组件是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * form类型 FORM_TYPE
+     */
+    type?: MFormItemTypeEnum;
+    /**
+     * 初始值
+     */
+    initialValue?: any;
+    /**
+     * rules required的验证消息， 不填写则不验证
+     */
+    required?: string;
+    /**
+     * rule-max, 正则，验证消息
+     */
+    rules?: FormRule[];
+    /**
+     * 自定义form
+     */
+    render?: (form?: FormInstance) => ReactElement;
+    /**
+     * Antd MForm.Item 的其他属性
+     */
+    formItemProps?: FormItemProps;
+    /**
+     *  MFormItem layout， 默认为 {labelCol:{span: 7}, wrapperCol: {span: 7}}
+     * @type {{labelCol: MFormItemLayout, wrapperCol: MFormItemLayout}}
+     * @memberof MFormItem
+     */
+    itemLayout?: {
+        labelCol?: MFormItemLayout;
+        wrapperCol?: MFormItemLayout;
+    };
+    /**
+     * 当前表单占据行的宽度 1-24 默认 24 / column
+     */
+    span?: number;
+    /**
+     * 是否显示当前组件 默认显示
+     */
+    show?: boolean;
+    /**
+     * item组件的其他属性
+     */
+    props?: any;
+}
+export interface IMFormInputItem extends IMFormBaseItem {
+    type: MFormItemTypeEnum.Input | MFormItemTypeEnum.Password;
+    props?: InputProps;
+    placeholder?: string;
+    maxLength?: number;
+}
+export interface IMFormInputNumItem extends IMFormBaseItem {
+    type: MFormItemTypeEnum.InputNumber;
+    props?: InputNumberProps;
+    placeholder?: string;
+    maxLength?: number;
+}
+export interface IMFormTextItem extends IMFormBaseItem {
+    type: MFormItemTypeEnum.Text;
+    props?: TextAreaProps;
+    placeholder?: string;
+    maxLength?: number;
+}
+export interface IMFormRadioGroupItem extends IMFormBaseItem {
+    type: MFormItemTypeEnum.Radio;
+    props?: RadioGroupProps;
+}
+export interface IMFormCheckBoxGroupItem extends IMFormBaseItem {
+    type: MFormItemTypeEnum.Checkbox;
+    props?: CheckboxGroupProps;
+}
+export interface IMFormSelectItem<T = any> extends IMFormBaseItem {
+    type: MFormItemTypeEnum.Select;
+    placeholder?: string;
+    props?: SelectProps<T>;
+}
+export interface IMFormDatePickerItem extends IMFormBaseItem {
+    type: MFormItemTypeEnum.DatePicker;
+    placeholder?: string;
+    props?: DatePickerProps;
+}
+export interface IMFormRangePickerItem extends IMFormBaseItem {
+    type: MFormItemTypeEnum.RangePicker;
+    placeholder?: [string, string];
+    props?: RangePickerProps;
+}
+export interface IMFormUploadItem extends IMFormBaseItem {
+    type: MFormItemTypeEnum.Upload;
+    children?: ReactElement;
+    props?: UploadProps;
+}
+export interface IMFormMentionsItem extends IMFormBaseItem {
+    type: MFormItemTypeEnum.Mentions;
+    placeholder?: string;
+    props?: MentionsProps;
+}
+export interface IMFormCascaderItem extends IMFormBaseItem {
+    type: MFormItemTypeEnum.Cascader;
+    placeholder?: string;
+    props?: CascaderAutoProps;
+}
+export interface IMFormTreeSelectItem extends IMFormBaseItem {
+    type: MFormItemTypeEnum.TreeSelect;
+    placeholder?: string;
+    props?: TreeSelectProps;
+}
+export type IMFormItem = IMFormInputItem | IMFormInputNumItem | IMFormSelectItem | IMFormCheckBoxGroupItem | IMFormRadioGroupItem | IMFormTextItem | IMFormDatePickerItem | IMFormRangePickerItem | IMFormUploadItem | IMFormMentionsItem | IMFormCascaderItem | IMFormTreeSelectItem;
+export {};

package/dist/components/MForm/type.js

@@ -0,0 +1,18 @@
+export var MFormItemTypeEnum;
+(function (MFormItemTypeEnum) {
+    MFormItemTypeEnum["Input"] = "input";
+    MFormItemTypeEnum["InputNumber"] = "inputNumber";
+    MFormItemTypeEnum["Text"] = "text";
+    MFormItemTypeEnum["Password"] = "password";
+    MFormItemTypeEnum["Radio"] = "radio";
+    MFormItemTypeEnum["Select"] = "select";
+    MFormItemTypeEnum["Checkbox"] = "checkbox";
+    MFormItemTypeEnum["DatePicker"] = "datePicker";
+    MFormItemTypeEnum["RangePicker"] = "rangePicker";
+    MFormItemTypeEnum["Upload"] = "upload";
+    MFormItemTypeEnum["Mentions"] = "mentions";
+    MFormItemTypeEnum["Cascader"] = "cascader";
+    MFormItemTypeEnum["TreeSelect"] = "treeSelect";
+    // Slider = 'slider',
+})(MFormItemTypeEnum || (MFormItemTypeEnum = {}));
+// | IMFormSliderItem;

package/dist/components/MSearch/index.d.ts

@@ -0,0 +1,26 @@
+import { ButtonProps } from 'antd';
+import { FormInstance } from 'antd/lib';
+import React from 'react';
+import { IMFormItem } from '../MForm';
+import './index.scss';
+export interface IMSearchProps {
+    form?: FormInstance;
+    /**
+     * 需要的数据: [ { label: ...,id: ..., required: ..., type: ..., }, ... ]
+     */
+    searchItems: IMFormItem[];
+    className?: string;
+    /**
+     * 搜索按钮 params返回form表单的数据
+     */
+    onSearch?: (params: any, isReset: boolean) => any;
+    /**
+     * 搜索项默认展开，不填写默认false
+     */
+    defaultShowAll?: boolean;
+    /**
+     * 自定义按钮
+     */
+    customButtons?: ButtonProps[];
+}
+export declare const MSearch: React.FC<IMSearchProps>;

package/dist/components/MSearch/index.js

@@ -0,0 +1,68 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { CaretDownOutlined, CaretUpOutlined } from '@ant-design/icons';
+import { Button, Card, Form } from 'antd';
+import { useEffect, useRef, useState } from 'react';
+import { getClassName, removeNull } from '../../utils';
+import MForm from '../MForm';
+import { CompThemeProvider } from '../ThemeContext';
+import './index.scss';
+const ENTER_KEY_CODE = 13; // 回车键的值为13
+const classname = (n = '') => {
+    const cn = 'm-search';
+    return getClassName(cn, n);
+};
+export const MSearch = props => {
+    const { className, searchItems = [], onSearch, defaultShowAll = false, customButtons = [], form: propsForm, } = props;
+    const [showAll, setShowAll] = useState(defaultShowAll);
+    const [curForm] = Form.useForm();
+    const searchWrap = useRef(null);
+    const form = propsForm ?? curForm;
+    // 键盘按下事件处理
+    const onEnterKeySearch = (keyObj) => {
+        const { keyCode } = keyObj;
+        if (keyCode === ENTER_KEY_CODE) {
+            search();
+        }
+    };
+    // 添加和移除事件监听
+    useEffect(() => {
+        const currentWrap = searchWrap.current;
+        currentWrap?.addEventListener('keydown', onEnterKeySearch);
+        return () => {
+            currentWrap?.removeEventListener('keydown', onEnterKeySearch);
+        };
+    }, []);
+    // 重置表单
+    const reset = () => {
+        form?.resetFields();
+        search(true);
+    };
+    // 搜索函数
+    const search = (isReset = false) => {
+        form?.validateFields().then(values => {
+            removeNull(values);
+            onSearch?.(values, isReset);
+        });
+    };
+    // 渲染搜索按钮
+    const renderSearchButtons = () => {
+        const hasMore = searchItems.length > 2;
+        return (_jsxs("div", { className: classname('btn-wrapper'), children: [customButtons?.length > 0 ? (_jsx(_Fragment, { children: customButtons.map((buttonProps, index) => (_jsx(Button, { className: classname('btn'), ...buttonProps, children: buttonProps.children }, `custom-btn-${index}`))) })) : (_jsxs(_Fragment, { children: [_jsx(Button, { className: classname('btn btn-reset'), onClick: reset, children: "\u91CD\u7F6E" }), _jsx(Button, { className: classname('btn btn-search'), onClick: () => search(), type: 'primary', children: "\u641C\u7D22" })] })), hasMore && (_jsxs("div", { className: classname('btn btn-collapse'), onClick: () => setShowAll(!showAll), children: [_jsx("span", { children: showAll ? '收起' : '展开' }), showAll ? _jsx(CaretUpOutlined, {}) : _jsx(CaretDownOutlined, {})] }))] }));
+    };
+    // 处理搜索项显示/隐藏
+    const processedSearchItems = searchItems.map((item, idx) => {
+        const newItem = { ...item };
+        if (searchItems.length > 2 && idx >= 2 && !showAll) {
+            newItem.formItemProps = {
+                ...item.formItemProps,
+                style: {
+                    ...item.formItemProps?.style,
+                    display: 'none',
+                },
+            };
+        }
+        return newItem;
+    });
+    const hasMore = searchItems.length > 2;
+    return (_jsx(CompThemeProvider, { children: _jsx("div", { className: `${classname('')} ${showAll ? '' : classname('collapsed')} ${className || ''}`, ref: searchWrap, children: _jsxs(Card, { children: [_jsxs("div", { className: classname('form'), children: [_jsx(MForm, { form: form, formItems: processedSearchItems, column: 3 }), (!hasMore || (hasMore && !showAll)) && renderSearchButtons()] }), hasMore && showAll && _jsx("div", { className: classname('footer'), children: renderSearchButtons() })] }) }) }));
+};

package/dist/components/index.d.ts

@@ -1,5 +1,8 @@
 export * from './ItemsRow';
 export * from './MBreadcrumb';
 export * from './MDescriptions';
+export * from './MForm';
+export { default as MForm } from './MForm';
+export * from './MSearch';
 export * from './MTable';
 export * from './ThemeContext';

package/dist/components/index.js

@@ -1,9 +1,9 @@
 export * from './ItemsRow';
 export * from './MBreadcrumb';
 export * from './MDescriptions';
-// export * from './MForm';
-// export { default as MForm } from './MForm';
+export * from './MForm';
+export { default as MForm } from './MForm';
 // export * from './MiModal';
-// export { default as MSearch } from './MSearch';
+export * from './MSearch';
 export * from './MTable';
 export * from './ThemeContext';

package/dist/hooks/index.d.ts

@@ -0,0 +1,7 @@
+export * from './useFuncRequest';
+export * from './useInterval';
+export * from './usePagination';
+export * from './useQuery';
+export * from './useReactive';
+export * from './useTimeout';
+export * from './useVirtualList';

package/dist/hooks/index.js

@@ -0,0 +1,7 @@
+export * from './useFuncRequest';
+export * from './useInterval';
+export * from './usePagination';
+export * from './useQuery';
+export * from './useReactive';
+export * from './useTimeout';
+export * from './useVirtualList';

package/dist/hooks/useFuncRequest.d.ts

@@ -0,0 +1,16 @@
+type UnwrapPromise<T> = T extends Promise<infer U> ? U : T;
+export type UseFuncRequestOptions<T extends (...args: any[]) => Promise<any>> = {
+    autoRunArgs?: Parameters<T>;
+    onBefore?: (...args: Parameters<T>) => boolean | Promise<boolean>;
+    onSuccess?: (data: UnwrapPromise<ReturnType<T>>) => void | Promise<void>;
+    onError?: (error: Error) => void | Promise<void>;
+    onFinally?: () => void | Promise<void>;
+};
+export declare function useFuncRequest<T extends (...args: any[]) => Promise<any>>(asyncFunc: T, options?: UseFuncRequestOptions<T>): {
+    run: (...args: Parameters<T>) => Promise<any>;
+    cancel: () => void;
+    loading: boolean;
+    error: Error | null;
+    data: UnwrapPromise<ReturnType<T>> | null;
+};
+export {};

package/dist/hooks/useFuncRequest.js

@@ -0,0 +1,67 @@
+import { useEffect, useRef, useState } from 'react';
+export function useFuncRequest(
+// 异步函数
+asyncFunc, 
+// 配置项
+options) {
+    const [loading, setLoading] = useState(false);
+    const [error, setError] = useState(null);
+    const [data, setData] = useState(null);
+    const abortControllerRef = useRef(undefined);
+    const requestIdRef = useRef(0);
+    const cancel = () => {
+        abortControllerRef.current?.abort();
+        setLoading(false);
+        setError(null);
+    };
+    const run = async (...args) => {
+        const currentRequestId = ++requestIdRef.current;
+        cancel();
+        const abortController = new AbortController();
+        abortControllerRef.current = abortController;
+        try {
+            setLoading(true);
+            setError(null);
+            if (options?.onBefore) {
+                const beforeRes = await options?.onBefore?.(...args);
+                if (!beforeRes) {
+                    cancel();
+                    return;
+                }
+            }
+            // 安全传递 AbortSignal
+            const funcArgs = args.length >= asyncFunc.length
+                ? args
+                : [...args, { signal: abortController.signal }];
+            const res = await asyncFunc(...funcArgs);
+            if (!abortController.signal.aborted &&
+                currentRequestId === requestIdRef.current) {
+                setData(res);
+                await options?.onSuccess?.(res);
+            }
+            return res;
+        }
+        catch (err) {
+            if (!abortController.signal.aborted &&
+                currentRequestId === requestIdRef.current) {
+                setError(err);
+                await options?.onError?.(err);
+            }
+            throw err;
+        }
+        finally {
+            if (!abortController.signal.aborted &&
+                currentRequestId === requestIdRef.current) {
+                setLoading(false);
+                await options?.onFinally?.();
+            }
+        }
+    };
+    useEffect(() => {
+        if (options?.autoRunArgs) {
+            run(...options.autoRunArgs).catch(() => { });
+        }
+        return cancel;
+    }, [JSON.stringify(options?.autoRunArgs)]);
+    return { run, cancel, loading, error, data };
+}

package/dist/hooks/useInterval.d.ts

@@ -0,0 +1,8 @@
+type Callback = () => void;
+interface UseTimeoutReturn {
+    start: Callback;
+    isRunning: boolean;
+    clear: Callback;
+}
+declare function useInterval(callback: Callback, delay: number | null, immediate?: boolean): UseTimeoutReturn;
+export { useInterval };

package/dist/hooks/useInterval.js

@@ -0,0 +1,30 @@
+import { useCallback, useEffect, useRef } from 'react';
+function useInterval(callback, delay, immediate = false) {
+    const timerRef = useRef(undefined);
+    const savedCallback = useRef(callback);
+    // Update callback ref if callback changes
+    useEffect(() => {
+        savedCallback.current = callback;
+    }, [callback]);
+    const clear = useCallback(() => {
+        if (timerRef.current) {
+            clearInterval(timerRef.current);
+            timerRef.current = undefined;
+        }
+    }, []);
+    const start = useCallback(() => {
+        clear();
+        if (delay !== null && delay !== undefined) {
+            timerRef.current = setInterval(() => savedCallback.current(), delay);
+        }
+    }, [delay, clear]);
+    useEffect(() => {
+        if (immediate) {
+            savedCallback.current();
+        }
+        start();
+        return clear;
+    }, [delay, start, clear, immediate]);
+    return { start, clear, isRunning: !!timerRef.current };
+}
+export { useInterval };

package/dist/hooks/usePagination.d.ts

@@ -0,0 +1,42 @@
+interface IPaginationProps {
+    current: number;
+    pageSize: number;
+    total: number;
+    onChange: (page: number, pageSize: number) => Promise<void>;
+    onShowSizeChange: (size: number, current: number) => Promise<void>;
+    showTotal?: (t: number) => React.ReactNode;
+    showQuickJumper?: boolean;
+    showSizeChanger?: boolean;
+}
+interface PaginationResult<T> {
+    tableProps: {
+        loading?: boolean;
+        dataSource: T[];
+    };
+    loading?: boolean;
+    dataSource: T[];
+    paginationProps: IPaginationProps;
+    isFirstComplete: boolean;
+    refresh: (resetPage?: boolean) => Promise<void>;
+    debounceRefresh: (resetPage?: boolean) => void;
+    setDataSource: (data: T[]) => void;
+}
+interface IServerParams {
+    offset: number;
+    limit: number;
+    current: number;
+}
+type IInfoBack<T> = {
+    dataSource: T[];
+    total: number;
+};
+type IInfoServer<T> = (params: IServerParams) => IInfoBack<T> | Promise<IInfoBack<T>>;
+interface IInfoOption<T> {
+    isReady?: boolean;
+    dataSource?: T[];
+    current?: number;
+    pageSize?: number;
+}
+export declare const usePagination: <T>(server: IInfoServer<T>, deps?: any[], // 依赖条件 数据更新默认执行server
+option?: IInfoOption<T>) => PaginationResult<T>;
+export {};