foxit-component 0.0.1-alpha.4 → 0.0.1-alpha.40

package/es/Form/FormProvider.js

@@ -1,43 +1,56 @@
 import { __assign } from '../node_modules/tslib/tslib.es6.js';
 import { jsx } from 'react/jsx-runtime';
-import { forwardRef, useState, useRef, useEffect, useCallback, useImperativeHandle } from 'react';
+import { forwardRef, useRef, useState, useEffect, useCallback, useImperativeHandle } from 'react';
 import { FormContext } from './FormContext.js';
 
 var FormProvider = function (_a, ref) {
     var children = _a.children, _b = _a.initialValues, initialValues = _b === void 0 ? {} : _b;
-    var _c = useState({}), formFields = _c[0], setFormFields = _c[1];
+    var formFieldsRef = useRef({});
+    var _c = useState({}), forceUpdate = _c[1]; // Used to force re-render when ref changes
     var formInstanceRef = useRef({});
+    var subscribersRef = useRef([]);
     // 初始值的设置
     useEffect(function () {
         if (Object.keys(initialValues).length > 0) {
-            setFormFields(function (prevFields) {
-                var newFields = __assign({}, prevFields);
-                for (var key in initialValues) {
-                    if (!newFields[key]) {
-                        newFields[key] = { value: initialValues[key], rules: [] };
-                    }
-                    else {
-                        newFields[key] = __assign(__assign({}, newFields[key]), { value: initialValues[key] });
-                    }
+            formFieldsRef.current = __assign({}, formFieldsRef.current); // Create a new object
+            for (var key in initialValues) {
+                if (!formFieldsRef.current[key]) {
+                    formFieldsRef.current[key] = { value: initialValues[key], rules: [] };
                 }
-                return newFields;
-            });
+                else {
+                    formFieldsRef.current[key] = __assign(__assign({}, formFieldsRef.current[key]), { value: initialValues[key] });
+                }
+            }
+            forceUpdate({}); // Trigger re-render
         }
     }, [initialValues]);
+    // 订阅方法
+    var subscribe = useCallback(function (fieldNames, callback) {
+        var subscriber = { fieldNames: fieldNames, callback: callback };
+        subscribersRef.current.push(subscriber);
+        // 立即触发一次回调，提供当前值
+        var currentValues = fieldNames.reduce(function (acc, fieldName) {
+            var _a;
+            acc[fieldName] = (_a = formFieldsRef.current[fieldName]) === null || _a === void 0 ? void 0 : _a.value;
+            return acc;
+        }, {});
+        callback(currentValues);
+        // 返回取消订阅函数
+        return function () {
+            subscribersRef.current = subscribersRef.current.filter(function (s) { return s !== subscriber; });
+        };
+    }, []);
     // 注册字段
     var registerField = useCallback(function (name, rules) {
-        setFormFields(function (prevFields) {
-            var _a;
-            return (__assign(__assign({}, prevFields), (_a = {}, _a[name] = __assign(__assign({}, prevFields[name]), { rules: rules || [] }), _a)));
-        });
+        formFieldsRef.current = __assign({}, formFieldsRef.current); // Create a new object
+        formFieldsRef.current[name] = __assign(__assign({}, formFieldsRef.current[name]), { rules: rules || [] });
+        forceUpdate({}); // Trigger re-render
     }, []);
     // 销毁字段
     var unregisterField = useCallback(function (name) {
-        setFormFields(function (prevFields) {
-            var newFields = __assign({}, prevFields);
-            delete newFields[name];
-            return newFields;
-        });
+        formFieldsRef.current = __assign({}, formFieldsRef.current); // Create a new object
+        delete formFieldsRef.current[name];
+        forceUpdate({}); // Trigger re-render
     }, []);
     // 验证字段
     var validateField = useCallback(function (name, value, rules) {
@@ -60,13 +73,17 @@ var FormProvider = function (_a, ref) {
             if (rule.type === 'string' && typeof value !== 'string') {
                 return { type: 'error', message: rule.message || 'The input is not a string' };
             }
-            if (rule.min !== undefined && typeof value === 'string' && value.length < rule.min) {
+            if (rule.min !== undefined &&
+                typeof value === 'string' &&
+                new Blob([value]).size < rule.min) {
                 return {
                     type: 'error',
                     message: rule.message || "The input is less than ".concat(rule.min, " characters")
                 };
             }
-            if (rule.max !== undefined && typeof value === 'string' && value.length > rule.max) {
+            if (rule.max !== undefined &&
+                typeof value === 'string' &&
+                new Blob([value]).size > rule.max) {
                 return {
                     type: 'error',
                     message: rule.message || "The input is more than ".concat(rule.max, " characters")
@@ -77,140 +94,153 @@ var FormProvider = function (_a, ref) {
     }, []);
     // 设置字段值
     var setFieldsValue = useCallback(function (values) {
-        setFormFields(function (prevFields) {
-            var _a;
-            var newFields = __assign({}, prevFields);
-            for (var key in values) {
-                if (Object.prototype.hasOwnProperty.call(values, key)) {
-                    var newValue = values[key];
-                    newFields[key] = __assign(__assign({}, newFields[key]), { value: newValue });
-                    // 验证字段
-                    var validation = validateField(key, newValue, ((_a = newFields[key]) === null || _a === void 0 ? void 0 : _a.rules) || []);
-                    if (validation) {
-                        if (validation.type === 'error') {
-                            newFields[key] = __assign(__assign({}, newFields[key]), { error: validation.message, warning: undefined // Clear any previous warnings
-                             });
-                        }
-                        else if (validation.type === 'warning') {
-                            newFields[key] = __assign(__assign({}, newFields[key]), { warning: validation.message, error: undefined // Clear any previous errors
-                             });
-                        }
+        var _a, _b;
+        var changedFields = [];
+        formFieldsRef.current = __assign({}, formFieldsRef.current); // Create a new object
+        for (var key in values) {
+            if (Object.prototype.hasOwnProperty.call(values, key)) {
+                var newValue = values[key];
+                var oldValue = (_a = formFieldsRef.current[key]) === null || _a === void 0 ? void 0 : _a.value;
+                if (JSON.stringify(oldValue) !== JSON.stringify(newValue)) {
+                    changedFields.push(key);
+                }
+                formFieldsRef.current[key] = __assign(__assign({}, formFieldsRef.current[key]), { value: newValue });
+                // 验证字段
+                var validation = validateField(key, newValue, ((_b = formFieldsRef.current[key]) === null || _b === void 0 ? void 0 : _b.rules) || []);
+                if (validation) {
+                    if (validation.type === 'error') {
+                        formFieldsRef.current[key] = __assign(__assign({}, formFieldsRef.current[key]), { error: validation.message, warning: undefined // Clear any previous warnings
+                         });
                     }
-                    else {
-                        newFields[key] = __assign(__assign({}, newFields[key]), { error: undefined, warning: undefined });
+                    else if (validation.type === 'warning') {
+                        formFieldsRef.current[key] = __assign(__assign({}, formFieldsRef.current[key]), { warning: validation.message, error: undefined // Clear any previous errors
+                         });
                     }
                 }
+                else {
+                    formFieldsRef.current[key] = __assign(__assign({}, formFieldsRef.current[key]), { error: undefined, warning: undefined });
+                }
             }
-            return newFields;
-        });
-    }, [formFields, validateField]);
+        }
+        // 通知订阅者
+        if (changedFields.length > 0 && subscribersRef.current.length > 0) {
+            subscribersRef.current.forEach(function (subscriber) {
+                // 检查是否有该订阅者关心的字段发生变化
+                var relevantFields = subscriber.fieldNames.filter(function (name) {
+                    return changedFields.includes(name);
+                });
+                if (relevantFields.length > 0) {
+                    // 提取订阅者关心的所有字段当前值
+                    var watchValues = subscriber.fieldNames.reduce(function (acc, fieldName) {
+                        var _a;
+                        acc[fieldName] = (_a = formFieldsRef.current[fieldName]) === null || _a === void 0 ? void 0 : _a.value;
+                        return acc;
+                    }, {});
+                    subscriber.callback(watchValues);
+                }
+            });
+        }
+        forceUpdate({}); // Trigger re-render
+    }, [validateField]);
     // 获取字段值
     var getFieldsValue = useCallback(function (names) {
         if (!names) {
-            return Object.keys(formFields).reduce(function (acc, key) {
-                acc[key] = formFields[key].value;
+            return Object.keys(formFieldsRef.current).reduce(function (acc, key) {
+                acc[key] = formFieldsRef.current[key].value;
                 return acc;
             }, {});
         }
         return names.reduce(function (acc, key) {
             var _a;
-            acc[key] = (_a = formFields[key]) === null || _a === void 0 ? void 0 : _a.value;
+            acc[key] = (_a = formFieldsRef.current[key]) === null || _a === void 0 ? void 0 : _a.value;
             return acc;
         }, {});
-    }, [formFields]);
+    }, []);
     // 重置字段
     var resetFields = useCallback(function (names) {
-        setFormFields(function (prevFields) {
-            var newFields = __assign({}, prevFields);
-            if (names) {
-                names.forEach(function (name) {
-                    if (newFields[name]) {
-                        newFields[name].value = initialValues[name] || '';
-                        newFields[name].error = undefined;
-                        newFields[name].warning = undefined;
-                    }
-                });
-            }
-            else {
-                Object.keys(newFields).forEach(function (key) {
-                    newFields[key].value = initialValues[key] || '';
-                    newFields[key].error = undefined;
-                    newFields[key].warning = undefined;
-                });
-            }
-            return newFields;
-        });
-    }, [formFields, initialValues]);
+        formFieldsRef.current = __assign({}, formFieldsRef.current); // Create a new object
+        if (names) {
+            names.forEach(function (name) {
+                if (formFieldsRef.current[name]) {
+                    formFieldsRef.current[name].value = initialValues[name] || '';
+                    formFieldsRef.current[name].error = undefined;
+                    formFieldsRef.current[name].warning = undefined;
+                }
+            });
+        }
+        else {
+            Object.keys(formFieldsRef.current).forEach(function (key) {
+                formFieldsRef.current[key].value = initialValues[key] || '';
+                formFieldsRef.current[key].error = undefined;
+                formFieldsRef.current[key].warning = undefined;
+            });
+        }
+        forceUpdate({}); // Trigger re-render
+    }, [initialValues]);
     var validateFields = useCallback(function (names) {
         return new Promise(function (resolve, reject) {
-            var fieldsToValidate = names || Object.keys(formFields);
+            var fieldsToValidate = names || Object.keys(formFieldsRef.current);
             var values = getFieldsValue(fieldsToValidate);
             var errors = {};
             for (var _i = 0, fieldsToValidate_1 = fieldsToValidate; _i < fieldsToValidate_1.length; _i++) {
                 var key = fieldsToValidate_1[_i];
-                var field = formFields[key];
+                var field = formFieldsRef.current[key];
                 if (!field)
                     continue; // Skip if field is not registered
                 var validation = validateField(key, values[key], field.rules || []);
-                if (validation) {
-                    if (validation.type === 'error') {
-                        errors[key] = validation.message;
+                if (validation || field.error || field.warning) {
+                    if ((validation === null || validation === void 0 ? void 0 : validation.type) === 'error' || field.error) {
+                        errors[key] = (validation === null || validation === void 0 ? void 0 : validation.message) || field.error || '';
                     }
-                    else if (validation.type === 'warning') {
-                        validation.message;
+                    else if ((validation === null || validation === void 0 ? void 0 : validation.type) === 'warning' || field.warning) {
+                        (validation === null || validation === void 0 ? void 0 : validation.message) || field.warning || '';
                     }
                 }
             }
             if (Object.keys(errors).length > 0) {
-                setFormFields(function (prevFields) {
-                    var newFields = __assign({}, prevFields);
-                    for (var key in errors) {
-                        newFields[key] = __assign(__assign({}, newFields[key]), { error: errors[key] });
-                    }
-                    return newFields;
-                });
+                formFieldsRef.current = __assign({}, formFieldsRef.current); // Create a new object
+                for (var key in errors) {
+                    formFieldsRef.current[key] = __assign(__assign({}, formFieldsRef.current[key]), { error: errors[key] });
+                }
+                forceUpdate({}); // Trigger re-render
                 reject(errors);
             }
             else {
                 resolve(values);
             }
         });
-    }, [formFields, getFieldsValue, validateField]);
+    }, [getFieldsValue, validateField]);
     var setFieldsStatus = useCallback(function (status) {
-        setFormFields(function (prevFields) {
-            var newFields = __assign({}, prevFields);
-            status.forEach(function (_a) {
-                var type = _a.type, name = _a.name, message = _a.message;
-                if (Array.isArray(name)) {
-                    name.forEach(function (n) {
-                        if (newFields[n]) {
-                            // Only update if field exists
-                            if (type === 'error') {
-                                newFields[n] = __assign(__assign({}, newFields[n]), { error: message });
-                            }
-                            else if (type === 'warning') {
-                                newFields[n] = __assign(__assign({}, newFields[n]), { warning: message });
-                            }
-                        }
-                    });
-                }
-                else {
-                    if (newFields[name]) {
+        formFieldsRef.current = __assign({}, formFieldsRef.current); // Create a new object
+        status.forEach(function (_a) {
+            var type = _a.type, name = _a.name, message = _a.message;
+            if (Array.isArray(name)) {
+                name.forEach(function (n) {
+                    if (formFieldsRef.current[n]) {
                         // Only update if field exists
                         if (type === 'error') {
-                            newFields[name] = __assign(__assign({}, newFields[name]), { error: message });
+                            formFieldsRef.current[n] = __assign(__assign({}, formFieldsRef.current[n]), { error: message });
                         }
                         else if (type === 'warning') {
-                            newFields[name] = __assign(__assign({}, newFields[name]), { warning: message });
+                            formFieldsRef.current[n] = __assign(__assign({}, formFieldsRef.current[n]), { warning: message });
                         }
                     }
+                });
+            }
+            else {
+                if (formFieldsRef.current[name]) {
+                    // Only update if field exists
+                    if (type === 'error') {
+                        formFieldsRef.current[name] = __assign(__assign({}, formFieldsRef.current[name]), { error: message });
+                    }
+                    else if (type === 'warning') {
+                        formFieldsRef.current[name] = __assign(__assign({}, formFieldsRef.current[name]), { warning: message });
+                    }
                 }
-            });
-            return newFields;
+            }
         });
-    }, [formFields]);
-    // 暴露给外部的方法
-    useImperativeHandle(ref, function () { return (__assign({}, formInstanceRef.current)); });
+        forceUpdate({}); // Trigger re-render
+    }, []);
     formInstanceRef.current = {
         setFieldsValue: setFieldsValue,
         getFieldsValue: getFieldsValue,
@@ -218,9 +248,12 @@ var FormProvider = function (_a, ref) {
         validateFields: validateFields,
         setFieldsStatus: setFieldsStatus,
         registerField: registerField,
-        unregisterField: unregisterField
+        unregisterField: unregisterField,
+        subscribe: subscribe
     };
-    return (jsx(FormContext.Provider, __assign({ value: { form: formInstanceRef.current, formFields: formFields } }, { children: children })));
+    // 暴露给外部的方法
+    useImperativeHandle(ref, function () { return (__assign({}, formInstanceRef.current)); });
+    return (jsx(FormContext.Provider, __assign({ value: { form: formInstanceRef.current, formFields: formFieldsRef.current } }, { children: children })));
 };
 var FormProvider$1 = forwardRef(FormProvider);
 

package/es/Form/useFormWatch.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { FormRefInstance } from './Form.types';
+export declare function useFormWatch(formRef: React.RefObject<FormRefInstance>, callback: (values: Record<string, unknown>) => void, fieldNames: string[]): void;

package/es/Form/useFormWatch.js

@@ -0,0 +1,37 @@
+import { useRef, useEffect } from 'react';
+
+function useFormWatch(formRef, callback, fieldNames) {
+    var callbackRef = useRef(callback);
+    useEffect(function () {
+        callbackRef.current = callback;
+    }, [callback]);
+    // 处理表单字段监听
+    useEffect(function () {
+        // 如果表单引用不存在，设置轮询检查
+        if (!formRef.current) {
+            var checkInterval_1 = setInterval(function () {
+                if (formRef.current) {
+                    clearInterval(checkInterval_1);
+                    subscribeToFields();
+                }
+            }, 100);
+            // 清理轮询
+            return function () { return clearInterval(checkInterval_1); };
+        }
+        else {
+            // 表单引用存在，直接订阅
+            return subscribeToFields();
+        }
+        function subscribeToFields() {
+            var _a;
+            var unsubscribe = (_a = formRef.current) === null || _a === void 0 ? void 0 : _a.subscribe(fieldNames, function (newValues) {
+                callbackRef.current(newValues);
+            });
+            return function () {
+                unsubscribe === null || unsubscribe === void 0 ? void 0 : unsubscribe();
+            };
+        }
+    }, [formRef, fieldNames.join(',')]);
+}
+
+export { useFormWatch };

package/es/Input/Input.js

@@ -2,7 +2,6 @@ import { __rest, __assign } from '../node_modules/tslib/tslib.es6.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import classNames from 'classnames';
-import './input.css.js';
 import { Icon } from '../Icon/index.js';
 
 var Input = function (_a) {
@@ -11,12 +10,13 @@ var Input = function (_a) {
 };
 var SearchInput = function (_a) {
     var onSearch = _a.onSearch, rest = __rest(_a, ["onSearch"]);
+    var _b = useState(rest.value || ''), value = _b[0], setValue = _b[1];
     var handleSearch = function () {
         if (onSearch) {
-            onSearch(rest.value);
+            onSearch(value);
         }
     };
-    return (jsx(Input, __assign({}, rest, { addonAfter: jsx("div", __assign({ style: { display: 'flex' }, onClick: handleSearch }, { children: jsx(Icon, { name: "SearchOutlined" }) })) })));
+    return (jsx(Input, __assign({}, rest, { onChange: function (e) { return setValue(e.target.value); }, addonAfter: jsx("div", __assign({ style: { display: 'flex' }, onClick: handleSearch }, { children: jsx(Icon, { name: "SearchOutlined" }) })) })));
 };
 var PasswordInput = function (props) {
     var _a = useState(false), visible = _a[0], setVisible = _a[1];

package/es/Menu/Menu.d.ts

@@ -15,7 +15,9 @@ interface MenuProps {
     }) => void;
     defaultSelectedKeys?: string[];
     defaultOpenKeys?: string[];
+    selectedKeys?: string[];
     style?: React.CSSProperties;
+    inlineCollapsed?: boolean;
 }
 export declare const getItem: (label: ReactNode, key: Key, icon?: ReactNode, children?: MenuItem[], type?: 'group') => MenuItem;
 declare const Menu: React.FC<MenuProps>;

package/es/Menu/Menu.js

@@ -1,8 +1,7 @@
 import { __assign, __spreadArray } from '../node_modules/tslib/tslib.es6.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useState } from 'react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { useState, useRef, useEffect } from 'react';
 import { Icon } from '../Icon/index.js';
-import './menu.css.js';
 
 var getItem = function (label, key, icon, children, type) {
     return {
@@ -14,23 +13,30 @@ var getItem = function (label, key, icon, children, type) {
     };
 };
 var Menu = function (_a) {
-    var items = _a.items, onClick = _a.onClick, _b = _a.defaultSelectedKeys, defaultSelectedKeys = _b === void 0 ? [] : _b, _c = _a.defaultOpenKeys, defaultOpenKeys = _c === void 0 ? [] : _c, style = _a.style;
-    var _d = useState(defaultOpenKeys), openKeys = _d[0], setOpenKeys = _d[1];
-    var _e = useState(defaultSelectedKeys), selectedKeys = _e[0], setSelectedKeys = _e[1];
+    var items = _a.items, onClick = _a.onClick, _b = _a.defaultSelectedKeys, defaultSelectedKeys = _b === void 0 ? [] : _b, _c = _a.defaultOpenKeys, defaultOpenKeys = _c === void 0 ? [] : _c, controlledSelectedKeys = _a.selectedKeys, // 新增
+    style = _a.style, _d = _a.inlineCollapsed, inlineCollapsed = _d === void 0 ? false : _d;
+    var _e = useState(defaultOpenKeys), openKeys = _e[0], setOpenKeys = _e[1];
+    var _f = useState(defaultSelectedKeys), uncontrolledSelectedKeys = _f[0], setUncontrolledSelectedKeys = _f[1];
+    var selectedKeys = controlledSelectedKeys !== undefined ? controlledSelectedKeys : uncontrolledSelectedKeys;
+    var _g = useState(null), hoveredKey = _g[0], setHoveredKey = _g[1];
+    var _h = useState({ top: 0, left: 0 }), popupPosition = _h[0], setPopupPosition = _h[1];
+    var menuItemRefs = useRef({});
+    var popupRef = useRef(null);
     var handleMenuClick = function (e) {
         onClick === null || onClick === void 0 ? void 0 : onClick(e);
-        setSelectedKeys([e.key]);
+        if (controlledSelectedKeys === undefined) {
+            setUncontrolledSelectedKeys([e.key]);
+        }
     };
-    // const handleOpenChange = (keys: string[]) => {
-    //   setOpenKeys(keys);
-    // };
     var isFirstLevel = function (item) {
         return items.some(function (i) { return i.key === item.key; });
     };
+    // 标准展开模式的菜单项渲染
     var renderMenuItem = function (item) {
         var isSelected = selectedKeys.includes(item.key.toString());
         return (jsx("div", __assign({ className: "foxit-menu-item ".concat(isSelected ? 'selected' : '') }, { children: jsxs("div", __assign({ className: "foxit-menu-item-content", onClick: function () { return handleMenuClick({ key: item.key.toString() }); } }, { children: [item.icon && jsx("span", __assign({ style: { marginRight: '8px' } }, { children: item.icon })), jsx("span", __assign({ className: isFirstLevel(item) ? 'foxit-menu-item-label' : '' }, { children: item.label }))] })) }), item.key));
     };
+    // 标准展开模式的子菜单渲染
     var renderSubMenu = function (item) {
         var isOpen = openKeys.includes(item.key.toString());
         return (jsxs("div", { children: [jsxs("div", __assign({ className: "foxit-menu-submenu-title", onClick: function () {
@@ -44,7 +50,118 @@ var Menu = function (_a) {
                         return child.children ? renderSubMenu(child) : renderMenuItem(child);
                     }) })))] }, item.key));
     };
-    return (jsx("div", __assign({ className: "foxit-menu", style: __assign({}, style) }, { children: items.map(function (item) { return (item.children ? renderSubMenu(item) : renderMenuItem(item)); }) })));
+    // 收起模式的菜单项渲染
+    var renderMenuCollapsedItem = function (item) {
+        var isSelected = selectedKeys.includes(item.key.toString());
+        return (jsx("div", __assign({ ref: function (el) { return (menuItemRefs.current[item.key.toString()] = el); }, className: "foxit-menu-item foxit-menu-collapsed-item ".concat(isSelected ? 'selected' : ''), onMouseEnter: function () { return handleMouseEnter(item.key.toString()); }, onMouseLeave: handleMouseLeave }, { children: jsx("div", __assign({ className: "foxit-menu-item-content", onClick: function () { return handleMenuClick({ key: item.key.toString() }); } }, { children: item.icon && (jsx("span", __assign({ className: "foxit-menu-item-icon foxit-menu-item-icon-collapsed" }, { children: item.icon }))) })) }), item.key));
+    };
+    // 收起模式的子菜单渲染
+    var renderSubCollapsedMenu = function (item) {
+        var isSelected = selectedKeys.includes(item.key.toString());
+        return (jsx("div", __assign({ ref: function (el) { return (menuItemRefs.current[item.key.toString()] = el); }, className: "foxit-menu-submenu foxit-menu-collapsed-item ".concat(isSelected ? 'selected' : ''), onMouseEnter: function () { return handleMouseEnter(item.key.toString()); }, onMouseLeave: handleMouseLeave }, { children: jsx("div", __assign({ className: "foxit-menu-submenu-title" }, { children: item.icon && (jsx("span", __assign({ className: "foxit-menu-item-icon foxit-menu-item-icon-collapsed" }, { children: item.icon }))) })) }), item.key));
+    };
+    // 处理鼠标悬浮事件
+    var handleMouseEnter = function (key) {
+        setHoveredKey(key);
+        var itemRef = menuItemRefs.current[key];
+        if (itemRef) {
+            var rect = itemRef.getBoundingClientRect();
+            setPopupPosition({
+                top: rect.top,
+                left: rect.right + 5
+            });
+        }
+    };
+    // 处理鼠标离开事件
+    var handleMouseLeave = function () {
+        // 使用延时，允许鼠标移到弹出菜单上
+        setTimeout(function () {
+            if (!isMouseInPopup() && !isMouseOverAnyMenuItem()) {
+                setHoveredKey(null);
+            }
+        }, 50);
+    };
+    // 检查鼠标是否在弹出菜单中
+    var isMouseInPopup = function () {
+        return popupRef.current && popupRef.current.matches(':hover');
+    };
+    // 检查鼠标是否在任何菜单项上
+    var isMouseOverAnyMenuItem = function () {
+        return Object.values(menuItemRefs.current).some(function (ref) { return ref && ref.matches(':hover'); });
+    };
+    // 弹出子菜单渲染
+    var renderPopupMenu = function () {
+        if (!hoveredKey)
+            return null;
+        var item = findItemByKey(items, hoveredKey);
+        if (!(item === null || item === void 0 ? void 0 : item.children))
+            return null;
+        return (jsx("div", __assign({ ref: popupRef, className: "foxit-menu-popup", style: {
+                position: 'fixed',
+                top: "".concat(popupPosition.top, "px"),
+                left: "".concat(popupPosition.left, "px"),
+                zIndex: 1000
+            }, onMouseEnter: function () { return setHoveredKey(hoveredKey); }, onMouseLeave: function () { return setHoveredKey(null); } }, { children: jsxs("div", __assign({ className: "foxit-menu foxit-menu-popup-content" }, { children: [jsxs("div", __assign({ className: "foxit-menu-popup-title" }, { children: [jsx("span", __assign({ className: "foxit-menu-item-icon" }, { children: item.icon })), jsx("span", { children: item.label })] })), item.children.map(function (child) {
+                        return child.children ? renderPopupSubMenu(child) : renderPopupMenuItem(child);
+                    })] })) })));
+    };
+    // 弹出菜单中的普通菜单项渲染
+    var renderPopupMenuItem = function (item) {
+        var isSelected = selectedKeys.includes(item.key.toString());
+        return (jsx("div", __assign({ className: "foxit-menu-item ".concat(isSelected ? 'selected' : '') }, { children: jsxs("div", __assign({ className: "foxit-menu-item-content", onClick: function () {
+                    handleMenuClick({ key: item.key.toString() });
+                    setHoveredKey(null);
+                } }, { children: [item.icon && jsx("span", __assign({ className: "foxit-menu-item-icon" }, { children: item.icon })), jsx("span", { children: item.label })] })) }), item.key));
+    };
+    // 弹出菜单中的子菜单渲染
+    var renderPopupSubMenu = function (item) {
+        var isOpen = openKeys.includes(item.key.toString());
+        return (jsxs("div", { children: [jsxs("div", __assign({ className: "foxit-menu-submenu-title", onClick: function () {
+                        if (isOpen) {
+                            setOpenKeys(openKeys.filter(function (key) { return key !== item.key.toString(); }));
+                        }
+                        else {
+                            setOpenKeys(__spreadArray(__spreadArray([], openKeys, true), [item.key.toString()], false));
+                        }
+                    } }, { children: [jsxs("div", __assign({ style: { display: 'flex', alignItems: 'center' } }, { children: [item.icon && jsx("span", __assign({ className: "foxit-menu-item-icon" }, { children: item.icon })), jsx("span", { children: item.label })] })), jsx("span", { children: jsx(Icon, { name: "DownOutlined", className: "foxit-menu-icon ".concat(isOpen ? '' : 'foxit-menu-rotated-icon') }) })] })), isOpen && item.children && (jsx("div", __assign({ className: "foxit-menu-submenu-items" }, { children: item.children.map(function (child) {
+                        return child.children ? renderPopupSubMenu(child) : renderPopupMenuItem(child);
+                    }) })))] }, item.key));
+    };
+    // 根据key查找菜单项
+    var findItemByKey = function (items, key) {
+        for (var _i = 0, items_1 = items; _i < items_1.length; _i++) {
+            var item = items_1[_i];
+            if (item.key.toString() === key) {
+                return item;
+            }
+            if (item.children) {
+                var found = findItemByKey(item.children, key);
+                if (found)
+                    return found;
+            }
+        }
+        return undefined;
+    };
+    // 关闭副作用处理
+    useEffect(function () {
+        var handleClickOutside = function (event) {
+            if (hoveredKey &&
+                popupRef.current &&
+                !popupRef.current.contains(event.target) &&
+                !Object.values(menuItemRefs.current).some(function (ref) { return ref && ref.contains(event.target); })) {
+                setHoveredKey(null);
+            }
+        };
+        document.addEventListener('mousedown', handleClickOutside);
+        return function () {
+            document.removeEventListener('mousedown', handleClickOutside);
+        };
+    }, [hoveredKey]);
+    return (jsxs(Fragment, { children: [jsx("div", __assign({ className: "foxit-menu", style: __assign({}, style) }, { children: inlineCollapsed
+                    ? items.map(function (item) {
+                        return item.children ? renderSubCollapsedMenu(item) : renderMenuCollapsedItem(item);
+                    })
+                    : items.map(function (item) { return (item.children ? renderSubMenu(item) : renderMenuItem(item)); }) })), inlineCollapsed && hoveredKey && renderPopupMenu()] }));
 };
 
 export { Menu, getItem };

package/es/Modal/Modal.d.ts

@@ -10,6 +10,8 @@ interface IModalProps {
     maskClosable?: boolean;
     children?: React.ReactNode;
     width?: string;
+    type?: 'success';
+    closable?: boolean;
 }
 interface ModalComponent extends FC<IModalProps> {
     confirm: (props: IModalProps & {