foxit-component 0.0.1-alpha.9 → 1.0.0-alpha.29

package/es/Alert/Alert.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @name Alert
+ */
+import React from 'react';
+import './alert.css';
+interface AlertProps {
+    message: string | React.ReactNode;
+    showIcon?: boolean;
+    type?: 'success' | 'warning' | 'error' | 'gradient';
+}
+declare const Alert: React.FC<AlertProps>;
+export { Alert };

package/es/Alert/Alert.js

@@ -0,0 +1,24 @@
+import { __assign } from '../node_modules/tslib/tslib.es6.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Icon } from '../Icon/index.js';
+
+var Alert = function (_a) {
+    var message = _a.message, _b = _a.showIcon, showIcon = _b === void 0 ? true : _b, _c = _a.type, type = _c === void 0 ? 'success' : _c;
+    var getIconName = function (type) {
+        switch (type) {
+            case 'success':
+                return 'SuccessColoursOutlined';
+            case 'error':
+                return 'ErrorColoursOutlined';
+            case 'warning':
+                return 'WarningColoursOutlined';
+            case 'loading':
+                return 'LoadingOutlined';
+            default:
+                return 'WarningColoursOutlined';
+        }
+    };
+    return (jsxs("div", __assign({ className: "foxit-alert foxit-alert-".concat(type) }, { children: [showIcon && (jsx("div", __assign({ className: "foxit-alert-icon-container" }, { children: jsx(Icon, { name: getIconName(type), className: "foxit-alert-icon" }) }))), jsx("div", __assign({ className: "foxit-alert-message" }, { children: message }))] })));
+};
+
+export { Alert };

package/es/Button/Button.js

@@ -6,7 +6,7 @@ import { Icon } from '../Icon/index.js';
 var Button = function (_a) {
     var _b = _a.primary, primary = _b === void 0 ? false : _b, _c = _a.size, size = _c === void 0 ? 'large' : _c, _d = _a.children, children = _d === void 0 ? '' : _d, className = _a.className, style = _a.style, loading = _a.loading, props = __rest(_a, ["primary", "size", "children", "className", "style", "loading"]);
     var mode = primary ? 'foxit-button-primary' : 'foxit-button-secondary';
-    return (jsxs("button", __assign({ type: "button", className: classNames('foxit-button', "foxit-button-".concat(size), mode, className), style: style }, props, { children: [loading && jsx(Icon, { name: "LoadingOutlined", className: "foxit-button-loading" }), children] })));
+    return (jsxs("button", __assign({ type: "button", className: classNames('foxit-button', "foxit-button-".concat(size), mode, className, loading && 'foxit-button-prevent-click'), style: style }, props, { children: [loading && jsx(Icon, { name: "LoadingOutlined", className: "foxit-button-loading" }), children] })));
 };
 
 export { Button };

package/es/Drawer/Drawer.d.ts

@@ -0,0 +1,10 @@
+import React, { ReactNode } from 'react';
+import './drawer.css';
+interface DrawerProps {
+    open?: boolean;
+    width?: number | string;
+    onClose?: () => void;
+    children?: ReactNode;
+}
+declare const Drawer: React.FC<DrawerProps>;
+export { Drawer };

package/es/Drawer/Drawer.js

@@ -0,0 +1,14 @@
+import { __assign } from '../node_modules/tslib/tslib.es6.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import classNames from 'classnames';
+
+var Drawer = function (_a) {
+    var open = _a.open, _b = _a.width, width = _b === void 0 ? 375 : _b, onClose = _a.onClose, children = _a.children;
+    return (jsxs(Fragment, { children: [jsx("div", { className: classNames('foxit-drawer-mask', {
+                    'foxit-drawer-mask-open': open
+                }), onClick: onClose, style: { display: open ? 'block' : 'none' } }), jsx("div", __assign({ className: classNames('foxit-drawer', {
+                    'foxit-drawer-open': open
+                }), style: { width: width, right: open ? 0 : -width } }, { children: jsx("div", __assign({ className: "foxit-drawer-content" }, { children: children })) }))] }));
+};
+
+export { Drawer };

package/es/Form/Form.d.ts

@@ -1,6 +1,7 @@
 import React, { ReactNode } from 'react';
 import { FormRefInstance } from './Form.types';
 import FormItem from './FormItem';
+import { useFormWatch } from './useFormWatch';
 export type { FormRefInstance } from './Form.types';
 interface FormProps {
     children: ReactNode;
@@ -9,6 +10,6 @@ interface FormProps {
         [key: string]: unknown;
     };
 }
-export { FormItem };
+export { FormItem, useFormWatch };
 declare const _default: React.ForwardRefExoticComponent<FormProps & React.RefAttributes<FormRefInstance>>;
 export default _default;

package/es/Form/Form.js

@@ -21,13 +21,14 @@ var Form = function (_a, ref) {
         }
     }, [onFinish]);
     useImperativeHandle(ref, function () {
-        var _a, _b, _c, _d, _e;
+        var _a, _b, _c, _d, _e, _f;
         return ({
             setFieldsValue: (_a = formRef.current) === null || _a === void 0 ? void 0 : _a.setFieldsValue,
             getFieldsValue: (_b = formRef.current) === null || _b === void 0 ? void 0 : _b.getFieldsValue,
             resetFields: (_c = formRef.current) === null || _c === void 0 ? void 0 : _c.resetFields,
             validateFields: (_d = formRef.current) === null || _d === void 0 ? void 0 : _d.validateFields,
-            setFieldsStatus: (_e = formRef.current) === null || _e === void 0 ? void 0 : _e.setFieldsStatus
+            setFieldsStatus: (_e = formRef.current) === null || _e === void 0 ? void 0 : _e.setFieldsStatus,
+            subscribe: (_f = formRef.current) === null || _f === void 0 ? void 0 : _f.subscribe
         });
     });
     return (jsx(FormProvider, __assign({ initialValues: initialValues, ref: formRef }, { children: jsx("form", __assign({ onSubmit: handleSubmit }, { children: children })) })));

package/es/Form/Form.types.d.ts

@@ -11,6 +11,12 @@ export interface ValidationRule {
     min?: number;
     max?: number;
 }
+export interface FieldSubscriber {
+    fieldNames: string[];
+    callback: (values: {
+        [key: string]: unknown;
+    }) => void;
+}
 export interface FormInstance {
     setFieldsValue: (values: {
         [key: string]: unknown;
@@ -29,6 +35,9 @@ export interface FormInstance {
     }[]) => void;
     registerField: (name: string, rules: ValidationRule[]) => void;
     unregisterField: (name: string) => void;
+    subscribe: (fieldNames: string[], callback: (values: {
+        [key: string]: unknown;
+    }) => void) => () => void;
 }
 export type FormRefInstance = Omit<FormInstance, 'registerField' | 'unregisterField'>;
 export interface FormContextProps {

package/es/Form/FormItem.js

@@ -23,7 +23,7 @@ var FormItem = function (_a) {
         var newValue = ((_b = e === null || e === void 0 ? void 0 : e.target) === null || _b === void 0 ? void 0 : _b.value) !== undefined ? e.target.value : e;
         form.setFieldsValue((_a = {}, _a[name] = newValue, _a));
     }, [form, name]);
-    return (jsxs("div", __assign({ className: "foxit-form-item" }, { children: [label && jsx("label", { children: label }), jsx("span", __assign({ className: "".concat(error ? 'foxit-form-error-component' : warning ? 'foxit-form-warning-component' : '') }, { children: React.Children.map(children, function (child) {
+    return (jsxs("div", __assign({ className: "foxit-form-item" }, { children: [label && (jsxs("label", { children: [label, rules.some(function (rule) { return rule.required; }) && jsx("span", __assign({ className: "foxit-form-required" }, { children: "*" }))] })), jsx("span", __assign({ className: "".concat(error ? 'foxit-form-error-component' : warning ? 'foxit-form-warning-component' : '') }, { children: React.Children.map(children, function (child) {
                     return React.cloneElement(child, {
                         value: value,
                         onChange: handleChange

package/es/Form/FormProvider.js

@@ -8,6 +8,7 @@ var FormProvider = function (_a, ref) {
     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) {
@@ -23,6 +24,22 @@ var FormProvider = function (_a, ref) {
             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) {
         formFieldsRef.current = __assign({}, formFieldsRef.current); // Create a new object
@@ -56,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")
@@ -73,14 +94,19 @@ var FormProvider = function (_a, ref) {
     }, []);
     // 设置字段值
     var setFieldsValue = useCallback(function (values) {
-        var _a;
+        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, ((_a = formFieldsRef.current[key]) === null || _a === void 0 ? void 0 : _a.rules) || []);
+                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
@@ -96,6 +122,24 @@ var FormProvider = function (_a, ref) {
                 }
             }
         }
+        // 通知订阅者
+        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]);
     // 获取字段值
@@ -144,12 +188,12 @@ var FormProvider = function (_a, ref) {
                 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 || '';
                     }
                 }
             }
@@ -204,7 +248,8 @@ var FormProvider = function (_a, ref) {
         validateFields: validateFields,
         setFieldsStatus: setFieldsStatus,
         registerField: registerField,
-        unregisterField: unregisterField
+        unregisterField: unregisterField,
+        subscribe: subscribe
     };
     // 暴露给外部的方法
     useImperativeHandle(ref, function () { return (__assign({}, formInstanceRef.current)); });

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/Menu/Menu.d.ts

@@ -16,6 +16,7 @@ interface MenuProps {
     defaultSelectedKeys?: string[];
     defaultOpenKeys?: 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,6 +1,6 @@
 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';
 
 var getItem = function (label, key, icon, children, type) {
@@ -13,23 +13,26 @@ 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, 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), selectedKeys = _f[0], setSelectedKeys = _f[1];
+    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]);
     };
-    // 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 () {
@@ -43,7 +46,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 & {

package/es/Modal/Modal.js

@@ -2,80 +2,67 @@ import { __assign, __awaiter, __generator } from '../node_modules/tslib/tslib.es
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { Icon } from '../Icon/index.js';
+import classNames from 'classnames';
 import { createRoot } from 'react-dom/client';
 import { Modal as Modal$1 } from './ModalTemp.js';
 import { Button } from '../Button/Button.js';
 
 var ModalContent = function (_a) {
-    var title = _a.title, onCancel = _a.onCancel, _b = _a.onCancelText, onCancelText = _b === void 0 ? undefined : _b, onOk = _a.onOk, _c = _a.onOkText, onOkText = _c === void 0 ? undefined : _c, children = _a.children, _d = _a.width, width = _d === void 0 ? '400px' : _d;
-    var _e = useState(false), loading = _e[0], setLoading = _e[1];
-    var _f = useState(false), cancelLoading = _f[0], setCancelLoading = _f[1];
+    var title = _a.title, onCancel = _a.onCancel, _b = _a.onCancelText, onCancelText = _b === void 0 ? undefined : _b, onOk = _a.onOk, _c = _a.onOkText, onOkText = _c === void 0 ? undefined : _c, children = _a.children, _d = _a.width, width = _d === void 0 ? '400px' : _d, type = _a.type, _e = _a.closable, closable = _e === void 0 ? true : _e;
+    var _f = useState(false), loading = _f[0], setLoading = _f[1];
+    var _g = useState(false), cancelLoading = _g[0], setCancelLoading = _g[1];
     var handleOk = function () { return __awaiter(void 0, void 0, void 0, function () {
-        var result;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
-                    if (!onOk) return [3 /*break*/, 6];
+                    if (!onOk) return [3 /*break*/, 4];
                     _a.label = 1;
                 case 1:
-                    _a.trys.push([1, , 5, 6]);
-                    result = onOk();
-                    if (!(result instanceof Promise)) return [3 /*break*/, 3];
+                    _a.trys.push([1, , 3, 4]);
                     setLoading(true);
-                    return [4 /*yield*/, result];
+                    return [4 /*yield*/, onOk()];
                 case 2:
                     _a.sent();
                     return [3 /*break*/, 4];
                 case 3:
-                    onOk();
-                    _a.label = 4;
-                case 4: return [3 /*break*/, 6];
-                case 5:
                     setLoading(false);
                     return [7 /*endfinally*/];
-                case 6: return [2 /*return*/];
+                case 4: return [2 /*return*/];
             }
         });
     }); };
     var handleCancel = function () { return __awaiter(void 0, void 0, void 0, function () {
-        var result;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
-                    if (!onCancel) return [3 /*break*/, 6];
+                    if (!onCancel) return [3 /*break*/, 4];
                     _a.label = 1;
                 case 1:
-                    _a.trys.push([1, , 5, 6]);
-                    result = onCancel();
-                    if (!(result instanceof Promise)) return [3 /*break*/, 3];
+                    _a.trys.push([1, , 3, 4]);
                     setCancelLoading(true);
-                    return [4 /*yield*/, result];
+                    return [4 /*yield*/, onCancel()];
                 case 2:
                     _a.sent();
                     return [3 /*break*/, 4];
                 case 3:
-                    onCancel();
-                    _a.label = 4;
-                case 4: return [3 /*break*/, 6];
-                case 5:
                     setCancelLoading(false);
                     return [7 /*endfinally*/];
-                case 6: return [2 /*return*/];
+                case 4: return [2 /*return*/];
             }
         });
     }); };
-    return (jsxs("div", __assign({ className: "foxit-modal-content-container", style: {
-            maxWidth: width,
+    return (jsxs("div", __assign({ className: classNames('foxit-modal-content-container', type === 'success' ? 'foxit-modal-success' : ''), style: {
+            maxWidth: "min(".concat(width, ", calc(100vw - 32px))"),
             width: width
-        } }, { children: [jsxs("div", __assign({ className: "foxit-modal-head" }, { children: [jsx("div", __assign({ className: "foxit-modal-title" }, { children: title })), jsx("div", __assign({ onClick: onCancel, className: "foxit-modal-close-button" }, { children: jsx(Icon, { name: "CloseOutlined" }) }))] })), jsx("div", { children: children }), jsxs("div", __assign({ className: "foxit-modal-footer" }, { children: [onCancelText && (jsx(Button, __assign({ size: "medium", onClick: handleCancel, loading: cancelLoading }, { children: onCancelText }))), onOkText && (jsx(Button, __assign({ primary: true, size: "medium", onClick: handleOk, loading: loading }, { children: onOkText })))] }))] })));
+        } }, { children: [jsxs("div", __assign({ className: "foxit-modal-head" }, { children: [jsx("div", __assign({ className: "foxit-modal-title" }, { children: title })), closable && (jsx("div", __assign({ onClick: onCancel, className: type === 'success' ? 'foxit-modal-success-icon' : 'foxit-modal-close-button' }, { children: type === 'success' ? (jsx(Icon, { name: "FireWorkColoursOutlined" })) : (jsx(Icon, { name: "CloseOutlined" })) })))] })), jsx("div", __assign({ className: "foxit-modal-children" }, { children: children })), jsxs("div", __assign({ className: "foxit-modal-footer" }, { children: [onCancelText && (jsx(Button, __assign({ size: "medium", onClick: handleCancel, loading: cancelLoading }, { children: onCancelText }))), onOkText && (jsx(Button, __assign({ primary: true, size: "medium", onClick: handleOk, loading: loading }, { children: onOkText })))] }))] })));
 };
 var Modal = function (_a) {
-    var title = _a.title, opened = _a.opened, onOk = _a.onOk, onOkText = _a.onOkText, onCancel = _a.onCancel, onCancelText = _a.onCancelText, maskClosable = _a.maskClosable, children = _a.children, width = _a.width;
-    return (jsx(Modal$1, __assign({ opened: opened, onClose: onCancel || (function () { }), maskClosable: maskClosable, position: "top" }, { children: jsx(ModalContent, __assign({ title: title, width: width, onCancel: onCancel, onCancelText: onCancelText, onOk: onOk, onOkText: onOkText }, { children: children })) })));
+    var title = _a.title, opened = _a.opened, onOk = _a.onOk, onOkText = _a.onOkText, onCancel = _a.onCancel, onCancelText = _a.onCancelText, maskClosable = _a.maskClosable, children = _a.children, width = _a.width, type = _a.type, closable = _a.closable;
+    return (jsx(Modal$1, __assign({ opened: opened, onClose: onCancel || (function () { }), maskClosable: maskClosable, position: "top" }, { children: jsx(ModalContent, __assign({ title: title, width: width, onCancel: onCancel, onCancelText: onCancelText, onOk: onOk, onOkText: onOkText, type: type, closable: closable }, { children: children })) })));
 };
 // 语法糖的调用方式
 Modal.confirm = function (_a) {
-    var title = _a.title, onOk = _a.onOk, onCancel = _a.onCancel, onOkText = _a.onOkText, onCancelText = _a.onCancelText, _b = _a.maskClosable, maskClosable = _b === void 0 ? true : _b, content = _a.content, width = _a.width;
+    var title = _a.title, onOk = _a.onOk, onCancel = _a.onCancel, onOkText = _a.onOkText, onCancelText = _a.onCancelText, _b = _a.maskClosable, maskClosable = _b === void 0 ? true : _b, content = _a.content, width = _a.width, closable = _a.closable;
     var modalRoot = document.createElement('div');
     document.body.appendChild(modalRoot);
     var root = createRoot(modalRoot);
@@ -117,7 +104,7 @@ Modal.confirm = function (_a) {
                 : function () {
                     onOk === null || onOk === void 0 ? void 0 : onOk();
                     handleClose();
-                }, onOkText: onOkText }, { children: content })) })));
+                }, onOkText: onOkText, closable: closable }, { children: content })) })));
 };
 
 export { Modal };

package/es/Pagination/Pagination.d.ts

@@ -6,6 +6,7 @@ interface PaginationProps {
     onChange?: (page: number) => void;
     defaultCurrent?: number;
     current?: number;
+    mobile?: boolean;
 }
 declare const Pagination: React.FC<PaginationProps>;
 export default Pagination;

package/es/Pagination/Pagination.js

@@ -1,12 +1,13 @@
 import { __assign } from '../node_modules/tslib/tslib.es6.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState, useEffect } from 'react';
+import { Button } from '../Button/Button.js';
 
 var $_MORE = 9999999999;
 var Pagination = function (_a) {
-    var total = _a.total, pageSize = _a.pageSize, onChange = _a.onChange, _b = _a.defaultCurrent, defaultCurrent = _b === void 0 ? 1 : _b, currentProp = _a.current;
-    var _c = useState(currentProp !== undefined ? currentProp : defaultCurrent), current = _c[0], setCurrent = _c[1];
-    var _d = useState([]), pages = _d[0], setPages = _d[1];
+    var total = _a.total, pageSize = _a.pageSize, onChange = _a.onChange, _b = _a.defaultCurrent, defaultCurrent = _b === void 0 ? 1 : _b, currentProp = _a.current, _c = _a.mobile, mobile = _c === void 0 ? false : _c;
+    var _d = useState(currentProp !== undefined ? currentProp : defaultCurrent), current = _d[0], setCurrent = _d[1];
+    var _e = useState([]), pages = _e[0], setPages = _e[1];
     var maxButtons = 5;
     var totalPages = Math.ceil(total / pageSize);
     useEffect(function () {
@@ -84,6 +85,10 @@ var Pagination = function (_a) {
             onChange === null || onChange === void 0 ? void 0 : onChange(newPage);
         }
     };
+    // 新增：移动端只显示“展开更多”按钮
+    if (mobile) {
+        return total > pageSize ? (jsxs("div", __assign({ className: "foxit-pagination-mobile-container" }, { children: [jsx(Button, __assign({ className: "foxit-pagination-mobile-prev", onClick: handlePrev, size: "small", disabled: current === 1 }, { children: '<' })), jsxs("span", __assign({ className: "foxit-pagination-mobile-info" }, { children: [current, " / ", totalPages] })), jsx(Button, __assign({ className: "foxit-pagination-mobile-next", onClick: handleNext, size: "small", disabled: current === totalPages }, { children: '>' }))] }))) : null;
+    }
     return total > pageSize ? (jsxs("div", __assign({ className: "foxit-pagination-container" }, { children: [jsx("button", __assign({ className: "foxit-pagination-prev", onClick: handlePrev, disabled: current === 1 }, { children: '<' })), pages.map(function (page, index) { return (jsx("button", __assign({ className: "foxit-pagination-button", onClick: function () { return handleClick(page, index); }, disabled: page === current }, { children: page === $_MORE ? '...' : page }), index)); }), jsx("button", __assign({ className: "foxit-pagination-next", onClick: handleNext, disabled: current === totalPages }, { children: '>' }))] }))) : null;
 };
 

package/es/Quantity/Quantity.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import './quantity.css';
+interface QuantityProps {
+    value?: number;
+    onChange?: (value: number) => void;
+    min?: number;
+    max?: number;
+}
+declare const Quantity: React.FC<QuantityProps>;
+export { Quantity };

package/es/Quantity/Quantity.js

@@ -0,0 +1,45 @@
+import { __assign } from '../node_modules/tslib/tslib.es6.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+
+var Quantity = function (_a) {
+    var value = _a.value, onChange = _a.onChange, min = _a.min, max = _a.max;
+    var _b = useState(value || min || 0), internalValue = _b[0], setInternalValue = _b[1];
+    var currentValue = value !== undefined ? value : internalValue;
+    var handleIncrement = function () {
+        var newValue = currentValue + 1;
+        if (max !== undefined && newValue > max)
+            return;
+        if (onChange) {
+            onChange(newValue);
+        }
+        setInternalValue(newValue);
+    };
+    var handleDecrement = function () {
+        var newValue = currentValue - 1;
+        if (min !== undefined && newValue < min)
+            return;
+        if (onChange) {
+            onChange(newValue);
+        }
+        setInternalValue(newValue);
+    };
+    var handleChange = function (e) {
+        var newValue = parseInt(e.target.value, 10) || 0;
+        if (min !== undefined && newValue < min) {
+            newValue = min;
+        }
+        if (max !== undefined && newValue > max) {
+            newValue = max;
+        }
+        if (onChange) {
+            onChange(newValue);
+        }
+        setInternalValue(newValue);
+    };
+    return (jsxs("div", __assign({ className: "foxit-quantity" }, { children: [jsx("button", __assign({ className: "foxit-quantity-button", onClick: handleDecrement, disabled: min !== undefined && currentValue <= min }, { children: jsx("div", { children: "-" }) })), jsx("input", { 
+                // type="number"
+                value: currentValue, onChange: handleChange, min: min, max: max, className: "foxit-quantity-number" }), jsx("button", __assign({ className: "foxit-quantity-button", onClick: handleIncrement, disabled: max !== undefined && currentValue >= max }, { children: jsx("div", { children: "+" }) }))] })));
+};
+
+export { Quantity };

package/es/Select/Select.d.ts

@@ -14,6 +14,7 @@ export interface SelectProps {
     preIcon?: React.ReactNode;
     value?: string | number | CustomOption | null;
     onChange?: (v: unknown) => void;
+    [key: string]: unknown;
 }
 interface CustomOption {
     readonly value: string | number;

package/es/Select/Select.js

@@ -39,16 +39,7 @@ var Select = function (_a) {
                 return Array.isArray(defaultValue) &&
                     defaultValue.includes(option.value);
             })
-            : options.find(function (option) { return option.value === defaultValue; }), isDisabled: isDisabled, isClearable: isClearable, isSearchable: isSearchable, isMulti: isMulti, components: { Control: CustomControl, Option: CustomOptionComp }, onChange: onChange }, rest, { 
-        // value={
-        //   isMulti
-        //     ? options.filter(
-        //         (option) =>
-        //           Array.isArray(value) && (value as (string | number)[]).includes(option.value)
-        //       )
-        //     : options.find((option) => option.value === value) || value as CustomOption || null
-        // }
-        value: isMulti && Array.isArray(value)
+            : options.find(function (option) { return option.value === defaultValue; }), isDisabled: isDisabled, isClearable: isClearable, isSearchable: isSearchable, isMulti: isMulti, components: { Control: CustomControl, Option: CustomOptionComp }, onChange: onChange, menuPosition: "fixed" }, rest, { value: isMulti && Array.isArray(value)
             ? value.map(function (v) { return options.find(function (option) { return option.value === v; }); })
             : options.find(function (option) { return option.value === value; }) || value })));
 };

package/es/Spin/Spin.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import './spin.css';
+interface FoxitSpinProps {
+    spinning: boolean;
+    size?: 'small' | 'default' | 'large';
+    children?: React.ReactNode;
+    className?: string;
+}
+declare const Spin: React.FC<FoxitSpinProps>;
+export { Spin };

package/es/Spin/Spin.js

@@ -0,0 +1,23 @@
+import { __assign } from '../node_modules/tslib/tslib.es6.js';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import classNames from 'classnames';
+import { Icon } from '../Icon/index.js';
+
+var Spin = function (_a) {
+    var _b = _a.spinning, spinning = _b === void 0 ? true : _b, _c = _a.size, size = _c === void 0 ? 'default' : _c, children = _a.children, className = _a.className;
+    // return spinning ? (
+    //   <div className={classNames('foxit-spin', `foxit-spin-${size}`)}>
+    //     <div className="foxit-spin-icon">
+    //       <Icon name="LoadingOutlined" className={classNames('foxit-spin-spinning', className)} />
+    //     </div>
+    //     {children && <div className="foxit-spin-container">{children}</div>}
+    //   </div>
+    // ) : children ? (
+    //   <>{children}</>
+    // ) : (
+    //   <></>
+    // );
+    return (jsxs("div", __assign({ className: classNames(spinning && 'foxit-spin', spinning && "foxit-spin-".concat(size)) }, { children: [spinning && (jsx("div", __assign({ className: "foxit-spin-icon" }, { children: jsx(Icon, { name: "LoadingOutlined", className: classNames('foxit-spin-spinning', className) }) }))), children && jsx("div", __assign({ className: classNames(spinning && 'foxit-spin-container') }, { children: children })), !children && !spinning && jsx(Fragment, {})] })));
+};
+
+export { Spin };

package/es/Table/Table.d.ts

@@ -12,6 +12,7 @@ interface TableProps<T> {
     data: T[];
     loading?: boolean;
     emptyText?: React.ReactNode;
+    mobile?: boolean;
 }
-declare const Table: <T>({ columns, data, loading, emptyText }: TableProps<T>) => import("react/jsx-runtime").JSX.Element;
+declare const Table: <T>({ columns, data, loading, emptyText, mobile }: TableProps<T>) => import("react/jsx-runtime").JSX.Element;
 export default Table;

package/es/Table/Table.js

@@ -4,8 +4,18 @@ import Empty from '../Empty/Empty.js';
 import { Icon } from '../Icon/index.js';
 
 var Table = function (_a) {
-    var columns = _a.columns, data = _a.data, loading = _a.loading, emptyText = _a.emptyText;
-    return !loading && data.length === 0 ? (jsx(Empty, { description: emptyText || 'No Data' })) : (jsxs("div", __assign({ className: "foxit-table" }, { children: [loading ? (jsx("div", __assign({ className: "foxit-table-loading" }, { children: jsx(Icon, { name: "LoadingOutlined", className: "foxit-table-icon-loading" }) }))) : null, jsxs("table", __assign({ className: "foxit-table-container" }, { children: [jsx("thead", { children: jsx("tr", { children: columns.map(function (column, index) { return (jsx("th", __assign({ style: {
+    var columns = _a.columns, data = _a.data, loading = _a.loading, emptyText = _a.emptyText, _b = _a.mobile, mobile = _b === void 0 ? false : _b;
+    if (!loading && data.length === 0) {
+        return jsx(Empty, { description: emptyText || 'No Data' });
+    }
+    if (mobile) {
+        return (jsxs("div", __assign({ className: "foxit-table-mobile-list" }, { children: [loading && (jsx("div", __assign({ className: "foxit-table-mobile-loading" }, { children: jsx(Icon, { name: "LoadingOutlined", className: "foxit-table-icon-loading" }) }))), data.map(function (record, rowIndex) { return (jsx("div", __assign({ className: "foxit-table-mobile-card" }, { children: columns.map(function (column, colIndex) { return (jsxs("div", __assign({ className: "foxit-table-mobile-row" }, { children: [jsx("span", __assign({ className: "foxit-table-mobile-label" }, { children: column.title })), jsx("span", __assign({ className: "foxit-table-mobile-value" }, { children: column.render
+                                    ? column.render(record[column.dataIndex], record)
+                                    : typeof record[column.dataIndex] === 'object'
+                                        ? JSON.stringify(record[column.dataIndex])
+                                        : String(record[column.dataIndex]) }))] }), colIndex)); }) }), rowIndex)); })] })));
+    }
+    return (jsxs("div", __assign({ className: "foxit-table" }, { children: [loading ? (jsx("div", __assign({ className: "foxit-table-loading" }, { children: jsx(Icon, { name: "LoadingOutlined", className: "foxit-table-icon-loading" }) }))) : null, jsxs("table", __assign({ className: "foxit-table-container" }, { children: [jsx("thead", { children: jsx("tr", { children: columns.map(function (column, index) { return (jsx("th", __assign({ style: {
                                     width: column.width ? "".concat(column.width, "px") : 'auto',
                                     textAlign: column.align || 'left'
                                 } }, { children: column.title }), index)); }) }) }), jsx("tbody", { children: data.map(function (record, rowIndex) { return (jsx("tr", __assign({ className: rowIndex % 2 === 0 ? 'foxit-even-row' : 'foxit-odd-row' }, { children: columns.map(function (column, colIndex) { return (jsx("td", __assign({ style: { textAlign: column.align || 'left' } }, { children: column.render

package/es/Tooltip/Tooltip.js

@@ -1,30 +1,51 @@
 import { __assign } from '../node_modules/tslib/tslib.es6.js';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { useState, useRef } from 'react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { useRef, useState, useEffect } from 'react';
+import ReactDOM from 'react-dom';
 
 var Tooltip = function (_a) {
     var title = _a.title, children = _a.children;
-    var _b = useState(false), visible = _b[0], setVisible = _b[1];
     var childRef = useRef(null);
     var tooltipRef = useRef(null);
+    var _b = useState({ visibility: 'hidden' }), tooltipStyle = _b[0], setTooltipStyle = _b[1];
+    var isVisibleRef = useRef(false);
+    var calculateTooltipPosition = function () {
+        if (childRef.current && tooltipRef.current && isVisibleRef.current) {
+            var childRect = childRef.current.getBoundingClientRect();
+            var tooltipHeight = tooltipRef.current.offsetHeight;
+            var tooltipWidth = tooltipRef.current.offsetWidth;
+            var top_1 = window.scrollY + childRect.top - tooltipHeight - 4; // 计算绝对位置，考虑页面滚动
+            var left = window.scrollX + childRect.left + childRect.width / 2 - tooltipWidth / 2;
+            setTooltipStyle({
+                position: 'absolute',
+                top: "".concat(top_1, "px"),
+                left: "".concat(left, "px"),
+                visibility: 'visible',
+                zIndex: 9999 // 确保层级足够高
+            });
+        }
+    };
     var handleMouseEnter = function () {
-        setVisible(true);
+        isVisibleRef.current = true;
+        calculateTooltipPosition();
+        window.addEventListener('scroll', calculateTooltipPosition); // 监听滚动事件
+        window.addEventListener('resize', calculateTooltipPosition); // 监听窗口大小变化
     };
     var handleMouseLeave = function () {
-        setVisible(false);
-    };
-    var calculateTooltipPosition = function () {
-        var _a;
-        if (childRef.current) {
-            var tooltipHeight = ((_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight) || 0;
-            return tooltipHeight + 4;
-        }
-        return '';
+        isVisibleRef.current = false;
+        setTooltipStyle(function (prev) { return (__assign(__assign({}, prev), { visibility: 'hidden' })); });
+        window.removeEventListener('scroll', calculateTooltipPosition); // 移除滚动事件监听
+        window.removeEventListener('resize', calculateTooltipPosition); // 移除窗口大小变化监听
     };
-    return (jsxs("div", __assign({ className: "foxit-tooltip-container", onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, ref: childRef }, { children: [children, jsxs("div", __assign({ className: "foxit-tooltip-content", style: {
-                    visibility: visible ? 'visible' : 'hidden',
-                    top: -calculateTooltipPosition()
-                }, ref: tooltipRef }, { children: [jsx(Fragment, { children: title }), jsx("div", { className: "foxit-tooltip-arrow" })] }))] })));
+    useEffect(function () {
+        return function () {
+            // 清理事件监听器，防止内存泄漏
+            window.removeEventListener('scroll', calculateTooltipPosition);
+            window.removeEventListener('resize', calculateTooltipPosition);
+        };
+    }, []);
+    return (jsxs(Fragment, { children: [jsx("div", __assign({ className: "foxit-tooltip-container", onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, ref: childRef }, { children: children })), ReactDOM.createPortal(jsxs("div", __assign({ onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, className: "foxit-tooltip-content", style: tooltipStyle, ref: tooltipRef }, { children: [title, jsx("div", { className: "foxit-tooltip-arrow" })] })), document.body // 直接挂载到 body，避免层叠上下文限制
+            )] }));
 };
 
 export { Tooltip as default };

package/es/constants/icons.d.ts

@@ -20,8 +20,21 @@ export declare const ICONS: Readonly<{
     EditorOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
     DateOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
     DownLoadOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
+    UserConfigOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
+    PlusCircleOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
+    RemoveOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
+    ChangeRoleOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
+    ResendEmailOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
+    ViewDetailsOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
+    ExportRecordOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
+    BillingColoursOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
+    ManageColoursOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
     SuccessColoursOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
     ErrorColoursOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
     WarningColoursOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
+    UpgradeColoursOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
+    SwitchToColoursOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
+    ShoppingColoursOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
     EmptyColoursOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
+    FireWorkColoursOutlined: (className?: string) => import("react/jsx-runtime").JSX.Element;
 }>;

package/es/constants/icons.js

@@ -22,11 +22,24 @@ var ICONS = Object.freeze({
     EditorOutlined: function (className) { return (jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("path", { d: "M8.39447 12.9991C8.38198 13.0151 8.36948 13.0318 8.36392 13.0519L7.40054 16.5839C7.34427 16.7896 7.40193 17.0111 7.55406 17.1674C7.66798 17.2785 7.818 17.3396 7.97776 17.3396C8.03054 17.3396 8.08333 17.3334 8.13542 17.3195L11.6424 16.363C11.648 16.363 11.6508 16.3679 11.6549 16.3679C11.6952 16.3679 11.7348 16.3533 11.7647 16.3227L21.1424 6.94643C21.4209 6.66757 21.5737 6.28762 21.5737 5.87434C21.5737 5.40584 21.375 4.9377 21.027 4.59073L20.1414 3.70374C19.7942 3.35573 19.3253 3.15674 18.8571 3.15674C18.4439 3.15674 18.0639 3.30956 17.7847 3.58773L8.40836 12.9665C8.39867 12.9755 8.40143 12.9887 8.39447 12.9991ZM20.2248 6.02819L19.2933 6.95898L17.7833 5.42495L18.7016 4.50669C18.8467 4.36084 19.128 4.38204 19.2947 4.5494L20.181 5.43642C20.2734 5.5288 20.3262 5.65172 20.3262 5.77327C20.3255 5.87297 20.29 5.96327 20.2248 6.02819ZM10.0622 13.1464L16.8289 6.37931L18.3397 7.91437L11.5855 14.6682L10.0622 13.1464ZM8.8293 15.89L9.31828 14.0952L10.6227 15.3997L8.8293 15.89Z", fill: "currentColor" }), jsx("path", { d: "M20.8187 9.74373C20.4638 9.74373 20.1727 10.0323 20.1714 10.3921V19.1339C20.1714 19.5923 19.7991 19.9646 19.3399 19.9646H4.55207C4.09364 19.9646 3.71993 19.5924 3.71993 19.1339V4.86561C3.71993 4.4068 4.09364 4.03416 4.55207 4.03416H14.0763C14.4333 4.03416 14.723 3.7442 14.723 3.38713C14.723 3.03083 14.4333 2.74048 14.0763 2.74048H4.45345C3.33585 2.74048 2.42627 3.64937 2.42627 4.76766V19.2326C2.42627 20.3509 3.33585 21.2594 4.45345 21.2594H19.4378C20.5562 21.2594 21.4654 20.3509 21.4654 19.2326V10.388C21.4639 10.0323 21.1737 9.74373 20.8187 9.74373Z", fill: "currentColor" })] }))); },
     DateOutlined: function (className) { return (jsx("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: jsx("path", { d: "M9 6H15V5H17V6H20V19H4V6H7V5H9V6ZM18 8H6V17H18V8ZM10 10V12H8V10H10ZM13 10V12H11V10H13ZM16 10V12H14V10H16ZM10 13V15H8V13H10ZM13 13V15H11V13H13ZM16 13V15H14V13H16Z", fill: "currentColor" }) }))); },
     DownLoadOutlined: function (className) { return (jsx("svg", __assign({ width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: jsx("path", { d: "M11.9969 5.21521H9.14154V0.932129H4.85844V5.21521H2.00307L6.99999 10.2121L11.9969 5.21521ZM2.00307 11.6398V13.0675H11.9969V11.6398H2.00307Z", fill: "currentColor" }) }))); },
+    UserConfigOutlined: function (className) { return (jsx("svg", __assign({ width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: jsx("path", { d: "M15.3996 13.5183C15.4896 14.1303 16.0118 14.0403 16.1018 14.3103C16.1018 14.4811 16.0118 15.1023 15.7508 15.1833C15.4899 15.1833 15.1388 15.0933 14.8778 15.1833C14.707 15.2733 14.527 15.3542 14.437 15.5342C14.266 15.9751 14.6078 16.3261 14.437 16.4971C14.176 16.6681 13.6449 16.9381 13.474 16.7581C13.2131 16.4971 13.2131 16.146 12.682 16.146C11.9799 16.146 11.9799 16.8481 11.629 16.8481C11.2781 16.8481 10.666 16.5871 10.666 16.326C10.756 15.9751 10.927 15.7141 10.576 15.3631C10.135 15.0121 9.61306 15.3631 9.43306 15.1921C9.17215 15.0211 9.08215 14.5801 9.17215 14.3192C9.26215 14.0583 9.87415 14.0583 9.87415 13.3561C9.87415 12.8342 9.26215 12.7442 9.17215 12.3933C9.08215 12.1323 9.26215 11.6911 9.52306 11.6011C9.96397 11.4303 10.225 11.7721 10.666 11.4303C10.927 11.1694 10.837 10.5573 10.837 10.3773C10.927 10.1163 11.2778 10.0263 11.539 10.0263C12.061 10.0263 11.8899 10.6384 12.592 10.7284C13.294 10.7284 13.204 10.4674 13.5549 10.0263C13.9958 10.0263 14.347 10.1973 14.4278 10.3773C14.5988 10.7283 14.257 11.2503 14.7788 11.6013C15.2196 11.8623 15.6518 11.5113 15.9218 11.6013C16.0927 11.6913 16.1827 11.9523 16.2727 12.3034C16.1018 12.8161 15.3096 12.7261 15.3996 13.5183ZM12.2408 11.7633C10.1349 12.2853 10.9268 15.3542 12.9428 15.0123C14.9678 14.5711 14.6978 11.3223 12.2408 11.7633ZM8.64979 8.69434C6.54379 8.69434 4.87879 7.02934 4.87879 4.92334C4.87879 2.81734 6.54379 1.15234 8.64979 1.15234C10.7557 1.15234 12.4207 2.81734 12.4207 4.92334C12.4208 6.93934 10.7558 8.69434 8.64979 8.69434ZM11.7188 9.56725C11.7188 9.56725 10.3146 9.56725 10.4046 10.5303C10.4946 11.5833 9.09061 10.7911 8.8297 11.6733C8.4787 12.7261 9.00061 12.5461 9.27061 13.2483C9.44161 13.6892 8.56861 13.9503 8.65861 14.7423C8.82961 15.7953 9.71161 15.2644 9.9727 15.8853C10.1436 16.4073 9.53179 16.7583 8.1277 16.7583C6.98479 16.7583 4.7977 16.7583 4.0057 16.6683C4.0057 16.6683 1.7287 16.5783 1.7287 15.0933C1.7287 15.0933 1.6387 12.8973 3.0427 11.3223C3.0427 11.3223 4.5367 9.39634 7.07479 9.39634L11.7188 9.56725Z", fill: "currentColor" }) }))); },
+    PlusCircleOutlined: function (className) { return (jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("path", { d: "M12.0004 19.7147C7.74673 19.7147 4.28613 16.2541 4.28613 12.0004C4.28613 7.74673 7.74673 4.28613 12.0004 4.28613C16.2541 4.28613 19.7147 7.74673 19.7147 12.0004C19.7147 16.2541 16.2541 19.7147 12.0004 19.7147ZM12.0004 6.14507C8.77195 6.14507 6.14507 8.77195 6.14507 12.0004C6.14507 15.2289 8.77195 17.8558 12.0004 17.8558C15.2289 17.8558 17.8558 15.2289 17.8558 12.0004C17.8558 8.77195 15.2289 6.14507 12.0004 6.14507Z", fill: "currentColor" }), jsx("path", { d: "M12.8063 12.8063H14.622C15.0662 12.8063 15.4284 12.4441 15.4284 11.9999C15.4284 11.5557 15.0662 11.1934 14.622 11.1934H12.8063V9.37776C12.8063 8.93355 12.4441 8.57129 11.9999 8.57129C11.5557 8.57129 11.1934 8.93355 11.1934 9.37776V11.1934H9.37776C8.93355 11.1934 8.57129 11.5557 8.57129 11.9999C8.57129 12.4441 8.93355 12.8063 9.37776 12.8063H11.1934V14.622C11.1934 15.0662 11.5557 15.4284 11.9999 15.4284C12.4441 15.4284 12.8063 15.0662 12.8063 14.622V12.8063Z", fill: "currentColor" })] }))); },
+    RemoveOutlined: function (className) { return (jsx("svg", __assign({ width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: jsx("path", { d: "M3.85714 4.78125H14.1429V15.75H3.85714V4.78125ZM5.57143 6.46875V14.0625H12.4286V6.46875H5.57143ZM6.42857 8.15625H8.14286V12.375H6.42857V8.15625ZM9.85714 8.15625H11.5714V12.375H9.85714V8.15625ZM3 4.78125H15V6.46875H3V4.78125ZM6.42857 2.25H11.5714V3.9375H6.42857V2.25Z", fill: "currentColor" }) }))); },
+    ChangeRoleOutlined: function (className) { return (jsx("svg", __assign({ width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: jsx("path", { d: "M16.0609 8.67863L17.9655 10.6669C17.9875 10.6902 17.9998 10.7211 17.9998 10.7531C17.9998 10.7852 17.9875 10.8161 17.9655 10.8394C17.9549 10.8506 17.9421 10.8595 17.9279 10.8656C17.9137 10.8718 17.8984 10.8749 17.883 10.875H16.6496C15.8089 14.3194 12.7028 16.875 8.99963 16.875C5.2965 16.875 2.19038 14.319 1.34925 10.875H2.90475C3.70538 13.4805 6.13125 15.375 8.99963 15.375C11.868 15.375 14.2935 13.4809 15.0945 10.875H13.9909C13.9752 10.8747 13.9598 10.8712 13.9454 10.8649C13.9311 10.8586 13.9181 10.8495 13.9073 10.8382C13.8965 10.8269 13.888 10.8136 13.8823 10.799C13.8766 10.7844 13.8739 10.7688 13.8743 10.7531C13.8743 10.7209 13.8866 10.6897 13.9084 10.6669L15.813 8.67863C15.8289 8.66173 15.8481 8.64827 15.8693 8.63907C15.8906 8.62987 15.9136 8.62513 15.9368 8.62513C15.9599 8.62513 15.9829 8.62987 16.0042 8.63907C16.0254 8.64827 16.0446 8.66173 16.0605 8.67863H16.0609ZM9.70763 10.125C11.0809 10.125 12.3746 11.058 12.3746 12.4395C12.3748 12.4863 12.3657 12.5326 12.3479 12.5759C12.3302 12.6192 12.3041 12.6586 12.2711 12.6917C12.2381 12.7249 12.1989 12.7513 12.1557 12.7693C12.1126 12.7874 12.0663 12.7967 12.0195 12.7969H5.97975C5.93297 12.7967 5.88667 12.7874 5.84351 12.7693C5.80034 12.7513 5.76115 12.7249 5.72817 12.6917C5.6952 12.6586 5.66908 12.6192 5.65131 12.5759C5.63355 12.5326 5.62448 12.4863 5.62463 12.4395C5.62463 11.058 6.92213 10.125 8.29575 10.125H9.70763ZM9.054 5.625C9.30737 5.625 9.55826 5.6749 9.79234 5.77186C10.0264 5.86882 10.2391 6.01094 10.4183 6.1901C10.5974 6.36926 10.7396 6.58195 10.8365 6.81603C10.9335 7.05012 10.9834 7.30101 10.9834 7.55438C10.9834 7.80774 10.9335 8.05863 10.8365 8.29272C10.7396 8.5268 10.5974 8.73949 10.4183 8.91865C10.2391 9.09781 10.0264 9.23993 9.79234 9.33689C9.55826 9.43385 9.30737 9.48375 9.054 9.48375C8.5423 9.48375 8.05156 9.28048 7.68973 8.91865C7.3279 8.55682 7.12463 8.06608 7.12463 7.55438C7.12463 7.04267 7.3279 6.55193 7.68973 6.1901C8.05156 5.82827 8.5423 5.625 9.054 5.625ZM0.116252 7.125H4.00838C4.03913 7.125 4.06913 7.13775 4.09088 7.16062C4.10951 7.18045 4.12122 7.20578 4.12426 7.23282C4.1273 7.25986 4.12151 7.28715 4.10775 7.31063L4.09088 7.33313L2.18625 9.32137C2.15849 9.35105 2.12098 9.36975 2.08058 9.37409C2.04017 9.37843 1.99956 9.3681 1.96613 9.345L1.93875 9.32137L0.0341265 7.33313C0.0120667 7.30984 -0.000157592 7.27895 1.53426e-06 7.24687C1.53426e-06 7.18913 0.0382515 7.14075 0.0900015 7.12838L0.115877 7.125H0.116252ZM8.99963 1.125C12.7028 1.125 15.8089 3.681 16.65 7.125H15.0945C14.2939 4.5195 11.868 2.625 8.99963 2.625C6.13125 2.625 3.70575 4.51913 2.90475 7.125H1.34963C2.19038 3.68063 5.2965 1.125 8.99963 1.125Z", fill: "currentColor" }) }))); },
+    ResendEmailOutlined: function (className) { return (jsx("svg", __assign({ width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: jsx("path", { d: "M0.317796 3.60993C0.188324 3.5166 0.105932 3.44077 0.0706213 3.38244C0.0353107 3.32411 0.0176553 3.24244 0.0176553 3.13745V2.97996C0.0176553 2.67664 0.0941618 2.43748 0.247175 2.26249C0.400188 2.0875 0.665018 2 1.04166 2L15.5897 2.0175C15.9781 2.0175 16.2488 2.09916 16.4018 2.26249C16.5548 2.42581 16.6313 2.6533 16.6313 2.94496L16.649 3.13745C16.649 3.24244 16.6372 3.31536 16.6137 3.35619C16.5901 3.39702 16.496 3.4816 16.3312 3.60993L9.11015 7.91474C8.99245 7.9614 8.84827 8.02556 8.6776 8.10723C8.50693 8.18889 8.39217 8.23555 8.33332 8.24722C8.2627 8.24722 8.15676 8.21514 8.01552 8.15097C7.87428 8.08681 7.71538 8.00223 7.53883 7.89724L0.317796 3.60993ZM11.1758 10.6971C10.9287 10.6971 10.7286 10.7496 10.5755 10.8546C10.4225 10.9596 10.3019 11.0938 10.2136 11.2571C10.1253 11.4204 10.0665 11.6042 10.0371 11.8083C10.0076 12.0125 9.99292 12.2079 9.99292 12.3945V13.6195V13.8295C9.99292 13.8995 9.99881 13.9636 10.0106 14.022H7.57414C6.73845 14.022 5.95573 14.019 5.22598 14.0132C4.49623 14.0074 3.85475 14.0045 3.30155 14.0045H2.08333C1.6596 14.0045 1.31238 13.949 1.04166 13.8382C0.77095 13.7274 0.559086 13.5845 0.406073 13.4095C0.25306 13.2345 0.147128 13.0333 0.0882767 12.8058C0.0294256 12.5783 0 12.342 0 12.097V5.62234C0 5.37735 0.0588511 5.22277 0.176553 5.15861C0.294256 5.09444 0.441383 5.12653 0.617937 5.25485C0.676788 5.28985 0.78272 5.35693 0.935733 5.4561C1.08875 5.55526 1.27118 5.669 1.48305 5.79733C1.69491 5.92566 1.9156 6.06274 2.14512 6.20856C2.37464 6.35439 2.59239 6.49147 2.79837 6.61979C3.00435 6.74812 3.1809 6.85895 3.32803 6.95228C3.47516 7.04561 3.57226 7.10394 3.61934 7.12727C3.78413 7.23227 3.87829 7.36351 3.90183 7.521C3.92537 7.6785 3.90771 7.81557 3.84886 7.93223C3.80178 8.0489 3.73116 8.20056 3.637 8.38721C3.54284 8.57387 3.44279 8.76345 3.33686 8.95594C3.23093 9.14843 3.12794 9.33217 3.02789 9.50716C2.92784 9.68216 2.86016 9.81632 2.82485 9.90965C2.766 10.073 2.77777 10.1838 2.86016 10.2421C2.94256 10.3005 3.07203 10.2771 3.24858 10.1721C3.28389 10.1488 3.381 10.0584 3.5399 9.9009C3.69879 9.7434 3.86652 9.56841 4.04307 9.37592C4.21963 9.18343 4.38735 9.0026 4.54625 8.83344C4.70515 8.66429 4.81402 8.56221 4.87287 8.52721C4.9788 8.43388 5.11711 8.3668 5.28777 8.32597C5.45844 8.28514 5.60851 8.29972 5.73798 8.36972C5.82038 8.41638 5.93219 8.48638 6.07344 8.57971C6.21468 8.67303 6.37063 8.77511 6.5413 8.88594C6.71197 8.99677 6.88558 9.11052 7.06213 9.22718L7.53883 9.54216C7.68007 9.63549 7.83014 9.69382 7.98904 9.71715C8.14794 9.74049 8.30095 9.74632 8.44808 9.73465C8.59521 9.72299 8.72762 9.69674 8.84532 9.65591C8.96303 9.61508 9.0513 9.57716 9.11015 9.54216C9.169 9.50716 9.28082 9.44008 9.4456 9.34092C9.61039 9.24176 9.78988 9.13385 9.98409 9.01719C10.1783 8.90052 10.3607 8.7897 10.5314 8.6847C10.7021 8.57971 10.8286 8.50388 10.911 8.45721L13.1356 7.09227C13.1591 7.08061 13.2327 7.03394 13.3563 6.95228C13.4798 6.87062 13.6329 6.77145 13.8153 6.65479C13.9977 6.53813 14.1978 6.4098 14.4156 6.26981C14.6333 6.12982 14.8393 5.99857 15.0335 5.87608C15.2277 5.75358 15.4072 5.63984 15.572 5.53484C15.7368 5.42985 15.8545 5.35402 15.9251 5.30735C16.1487 5.16736 16.3224 5.11194 16.4459 5.14111C16.5695 5.17027 16.6313 5.26652 16.6313 5.42985V9.97964C16.3018 9.71132 15.981 9.4605 15.6691 9.22718C15.3572 8.99385 15.0718 8.79553 14.8128 8.6322C14.5539 8.45721 14.3273 8.39596 14.1331 8.44846C13.9389 8.50096 13.78 8.6147 13.6564 8.7897C13.5328 8.96469 13.4387 9.16885 13.3739 9.40217C13.3092 9.63549 13.2768 9.84548 13.2768 10.0321C13.2768 10.1605 13.2739 10.2655 13.268 10.3471C13.2621 10.4288 13.2592 10.4988 13.2592 10.5571C13.2474 10.6154 13.2415 10.6621 13.2415 10.6971H12.9767H11.1758ZM17.7613 12.5345C17.9143 12.6512 17.9937 12.8145 17.9996 13.0245C18.0055 13.2345 17.9437 13.3862 17.8142 13.4795C17.6377 13.6195 17.4317 13.7857 17.1963 13.9782C16.9609 14.1707 16.7167 14.3661 16.4636 14.5644C16.2105 14.7628 15.9634 14.9611 15.7221 15.1594C15.4808 15.3577 15.2601 15.5327 15.06 15.6844C14.8128 15.8827 14.6392 15.9877 14.5392 15.9994C14.4391 16.011 14.3891 15.8594 14.3891 15.5444V14.7569C14.3891 14.5586 14.3391 14.3953 14.239 14.267C14.139 14.1386 14.0066 14.0745 13.8418 14.0745H11.7938C11.629 14.0745 11.4671 14.0161 11.3082 13.8995C11.1493 13.7828 11.0699 13.6311 11.0699 13.4445V12.552C11.0699 12.2254 11.1229 12.0271 11.2288 11.9571C11.3347 11.8871 11.523 11.8521 11.7938 11.8521H12.1469C12.2528 11.8521 12.3734 11.855 12.5088 11.8608C12.6442 11.8666 12.806 11.8696 12.9943 11.8696H13.7359C13.9713 11.8696 14.139 11.8287 14.239 11.7471C14.3391 11.6654 14.3891 11.5196 14.3891 11.3096V10.5396C14.3891 10.3296 14.4244 10.1955 14.495 10.1371C14.5657 10.0788 14.6951 10.1255 14.8834 10.2771C15.0718 10.4171 15.2895 10.5863 15.5367 10.7846C15.7839 10.9829 16.0399 11.1842 16.3047 11.3883C16.5695 11.5925 16.8285 11.7966 17.0815 12.0008C17.3346 12.205 17.5612 12.3829 17.7613 12.5345Z", fill: "currentColor" }) }))); },
+    ViewDetailsOutlined: function (className) { return (jsx("svg", __assign({ width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: jsx("path", { d: "M1.7998 0V18H16.1998V0H1.7998ZM13.4998 11.7H4.4998V9.9H13.4998V11.7ZM13.4998 8.1H4.4998V6.3H13.4998V8.1ZM13.4998 4.5H4.4998V2.7H13.4998V4.5Z", fill: "currentColor" }) }))); },
+    ExportRecordOutlined: function (className) { return (jsxs("svg", __assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("path", { d: "M13.8639 19V16.0553H17L13.8639 19ZM3.48936 16.9321H2V2H14.0857V3.44786H3.48936V16.9321Z", fill: "currentColor" }), jsx("path", { d: "M13.0003 19H5V4H17V14.9979H13.0007L13.0003 19ZM11.7973 7.54554V9.31261H7.50944V11.33H11.7973V13.0971L15.4401 10.3214L11.7973 7.54554Z", fill: "currentColor" })] }))); },
     // ColoursOutlined 带颜色的图标
+    BillingColoursOutlined: function (className) { return (jsxs("svg", __assign({ width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("path", { d: "M10.24 1.91992C10.7492 1.91992 11.2376 2.12221 11.5977 2.48228C11.9577 2.84235 12.16 3.33071 12.16 3.83992H13.44C13.9492 3.83992 14.4376 4.04221 14.7977 4.40228C15.1577 4.76235 15.36 5.25071 15.36 5.75992V12.1599C15.36 12.6691 15.1577 13.1575 14.7977 13.5176C14.4376 13.8776 13.9492 14.0799 13.44 14.0799H2.56001C2.0508 14.0799 1.56244 13.8776 1.20237 13.5176C0.8423 13.1575 0.640015 12.6691 0.640015 12.1599V3.83992C0.640015 3.33071 0.8423 2.84235 1.20237 2.48228C1.56244 2.12221 2.0508 1.91992 2.56001 1.91992H10.24ZM10.24 2.87992H2.56001C2.31515 2.87991 2.07953 2.97347 1.90137 3.14145C1.72321 3.30944 1.61598 3.53916 1.60161 3.7836L1.60001 3.83992H11.2C11.2 3.59505 11.1065 3.35944 10.9385 3.18128C10.7705 3.00312 10.5408 2.89589 10.2963 2.88152L10.24 2.87992Z", fill: "#016FB9" }), jsx("path", { d: "M15.36 6.40039V10.2404H11.2C10.6908 10.2404 10.2025 10.0381 9.84238 9.67804C9.48231 9.31797 9.28003 8.82961 9.28003 8.32039C9.28003 7.81117 9.48231 7.32282 9.84238 6.96275C10.2025 6.60268 10.6908 6.40039 11.2 6.40039H15.36ZM11.2 7.36039C10.9454 7.36039 10.7012 7.46153 10.5212 7.64157C10.3412 7.8216 10.24 8.06578 10.24 8.32039C10.24 8.575 10.3412 8.81918 10.5212 8.99921C10.7012 9.17925 10.9454 9.28039 11.2 9.28039C11.4546 9.28039 11.6988 9.17925 11.8789 8.99921C12.0589 8.81918 12.16 8.575 12.16 8.32039C12.16 8.06578 12.0589 7.8216 11.8789 7.64157C11.6988 7.46153 11.4546 7.36039 11.2 7.36039Z", fill: "white" })] }))); },
+    ManageColoursOutlined: function (className) { return (jsx("svg", __assign({ width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: jsx("path", { d: "M5.283 15.75C4.92863 15.75 4.64062 15.498 4.64062 15.1875C4.64062 14.8995 4.88813 14.661 5.20875 14.6284L5.283 14.625H7.875V12.3953L1.82812 12.3964C1.65978 12.3964 1.49703 12.336 1.36945 12.2262C1.24187 12.1163 1.15792 11.9644 1.13287 11.7979L1.125 11.6933V2.96777C1.125 2.61565 1.38487 2.32315 1.72462 2.27252L1.82812 2.26465H16.1741C16.5274 2.26465 16.8199 2.52565 16.8694 2.86427L16.8772 2.96777V11.6933C16.8775 11.8618 16.8172 12.0248 16.7074 12.1526C16.5975 12.2805 16.4454 12.3646 16.2788 12.3896L16.1741 12.3964H10.125V14.6239L12.9983 14.625C13.3526 14.625 13.6406 14.877 13.6406 15.1875C13.6406 15.4755 13.3931 15.714 13.0725 15.7466L12.9983 15.75H5.283ZM4.5 7.88965C3.93075 7.88965 3.45937 8.10227 3.38625 8.37677L3.375 8.45215V9.57715L3.38287 9.64352C3.447 9.92252 3.92287 10.1396 4.5 10.1396C5.06925 10.1396 5.54062 9.92815 5.61375 9.65365L5.625 9.57715V8.45215L5.61713 8.3869C5.553 8.10677 5.07713 7.88965 4.5 7.88965ZM13.5 3.38965C12.9263 3.38965 12.4538 3.71252 12.384 4.12765L12.375 4.2334V9.2959L12.3829 9.3949C12.447 9.81452 12.9229 10.1396 13.5 10.1396C14.0737 10.1396 14.5462 9.8179 14.616 9.40277L14.625 9.2959V4.2334L14.6171 4.13552C14.553 3.7159 14.0771 3.38965 13.5 3.38965ZM9 5.63965C8.42625 5.63965 7.95375 5.92652 7.884 6.29552L7.875 6.39002V9.3904L7.88287 9.47815C7.9425 9.81902 8.34637 10.0913 8.85713 10.134C8.95233 10.1213 9.0488 10.1213 9.144 10.134C9.65025 10.0913 10.053 9.8224 10.116 9.48377L10.125 9.3904V6.39002L10.1171 6.30227C10.053 5.9299 9.57712 5.63965 9 5.63965Z", fill: "#FF5F00" }) }))); },
     SuccessColoursOutlined: function (className) { return (jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("rect", { width: "24", height: "24", rx: "12", fill: "#30DC6B" }), jsx("path", { d: "M7.33337 12.6665L10 15.3332L16.6667 8.6665", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })] }))); },
     ErrorColoursOutlined: function (className) { return (jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("rect", { width: "24", height: "24", rx: "12", fill: "#FF3C3C" }), jsx("path", { d: "M15.9854 7.75732L7.50007 16.2426", stroke: "white", strokeWidth: "2", strokeLinecap: "round" }), jsx("path", { d: "M7.5 7.75732L15.9853 16.2426", stroke: "white", strokeWidth: "2", strokeLinecap: "round" })] }))); },
     WarningColoursOutlined: function (className) { return (jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsxs("g", __assign({ clipPath: "url(#clip0_1808_22773)" }, { children: [jsx("circle", { cx: "12", cy: "12", r: "12", fill: "white" }), jsx("path", { d: "M12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0ZM13.0312 6V13.9568C13.0312 14.5264 12.5695 14.9881 12 14.9881C11.4305 14.9881 10.9688 14.5264 10.9688 13.9568V6C10.9688 5.43047 11.4305 4.96875 12 4.96875C12.5695 4.96875 13.0312 5.43047 13.0312 6ZM12 16.0312C12.8284 16.0312 13.5 16.7028 13.5 17.5312C13.5 18.3597 12.8284 19.0312 12 19.0312C11.1716 19.0312 10.5 18.3597 10.5 17.5312C10.5 16.7028 11.1716 16.0312 12 16.0312Z", fill: "#FFAA19" })] })), jsx("defs", { children: jsx("clipPath", __assign({ id: "clip0_1808_22773" }, { children: jsx("rect", { width: "24", height: "24", fill: "white" }) })) })] }))); },
-    EmptyColoursOutlined: function (className) { return (jsxs("svg", __assign({ width: "129", height: "128", viewBox: "0 0 129 128", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("path", { opacity: "0.1", d: "M13.3 112C13.3 113.697 18.6943 115.325 28.2962 116.526C37.898 117.726 50.921 118.4 64.5 118.4C78.0791 118.4 91.102 117.726 100.704 116.526C110.306 115.325 115.7 113.697 115.7 112C115.7 110.303 110.306 108.675 100.704 107.475C91.102 106.274 78.0791 105.6 64.5 105.6C50.921 105.6 37.898 106.274 28.2962 107.475C18.6943 108.675 13.3 110.303 13.3 112Z", fill: "#FF5F00" }), jsx("path", { opacity: "0.5", d: "M15.092 47.1042C15.092 48.1922 15.924 49.0242 17.012 49.0242C18.1 49.0242 18.932 48.1922 18.932 47.1042C18.932 46.0162 18.1 45.1842 17.012 45.1842C15.988 45.1842 15.092 46.0802 15.092 47.1042ZM116.34 104C113.908 104.64 113.396 105.152 112.82 107.52C112.18 105.088 111.668 104.576 109.3 104C111.668 103.36 112.244 102.848 112.82 100.48C113.396 102.848 113.908 103.424 116.34 104ZM25.78 40.3842C22.644 41.2162 22.004 41.8562 21.172 44.9922C20.34 41.8562 19.7 41.2162 16.564 40.3842C19.7 39.5522 20.34 38.8482 21.172 35.7762C21.94 38.9122 22.644 39.5522 25.78 40.3842ZM102.58 29.3762C100.66 29.8882 100.276 30.2722 99.764 32.1922C99.252 30.2722 98.868 29.8882 96.948 29.3762C98.868 28.8642 99.252 28.4802 99.764 26.5602C100.212 28.4802 100.66 28.8642 102.58 29.3762ZM110.836 19.5202C105.844 20.8002 104.82 21.8882 103.476 26.8802C102.196 21.8882 101.108 20.8642 96.116 19.5202C101.108 18.2402 102.132 17.1522 103.476 12.1602C104.756 17.0882 105.844 18.1762 110.836 19.5202Z", fill: "#FF5F00" }), jsx("path", { opacity: "0.2", d: "M52.98 89.1518V89.6638L57.204 93.5678L73.396 85.6958L58.74 95.1038V99.7118L61.108 97.4078L63.476 99.7118L76.02 84.3518V83.8398L52.98 89.1518Z", fill: "#FF5F00" }), jsx("path", { opacity: "0.5", d: "M108.02 68.9919V68.8639C108.02 68.7359 107.956 68.6719 107.956 68.5439V68.4799L94.1959 32.5759C92.2119 26.4959 86.5799 22.3999 80.1799 22.3999H48.8839C42.4839 22.3999 36.8519 26.4959 34.8679 32.5759L21.1079 68.4799V68.5439C21.0439 68.6719 21.0439 68.7359 21.0439 68.8639V94.7199C21.0439 102.848 27.6359 109.44 35.7639 109.44H93.3639C101.492 109.44 108.084 102.848 108.084 94.7199V69.1199C108.02 69.0559 108.02 69.0559 108.02 68.9919ZM38.4519 33.9199C38.4519 33.9199 38.4519 33.8559 38.5159 33.8559C39.9239 29.2479 44.1479 26.2399 48.8839 26.2399H80.1159C84.8519 26.2399 89.0759 29.2479 90.5479 33.7919C90.5479 33.7919 90.5479 33.8559 90.6119 33.8559L103.348 67.1359H74.0999C73.0119 67.1359 72.1799 67.9679 72.1799 69.0559C72.1799 73.2799 68.7239 76.7359 64.4999 76.7359C60.2759 76.7359 56.8199 73.2799 56.8199 69.0559C56.8199 67.9679 55.9879 67.1359 54.8999 67.1359H25.7159L38.4519 33.9199ZM104.18 94.7199C104.18 100.736 99.3159 105.6 93.2999 105.6H35.6999C29.6839 105.6 24.8199 100.736 24.8199 94.7199V71.0399H53.1719C54.0679 76.4799 58.8039 80.6399 64.4999 80.6399C70.1959 80.6399 74.9319 76.4799 75.8279 71.0399H104.18V94.7199Z", fill: "#FF5F00" }), jsx("path", { opacity: "0.2", d: "M64.4999 72.3202C62.7079 72.3202 61.2999 70.9122 61.2999 69.1202V62.7202H32.1799L42.6759 35.3282L42.7399 35.2002C43.6359 32.5122 46.0679 30.7202 48.8839 30.7202H80.1159C82.9319 30.7202 85.3639 32.5122 86.2599 35.2002L86.3239 35.3282L96.8199 62.7202H67.6999V69.1202C67.6999 70.9122 66.2919 72.3202 64.4999 72.3202Z", fill: "#FF5F00" })] }))); }
+    UpgradeColoursOutlined: function (className) { return (jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("rect", { width: "24", height: "24", rx: "2", fill: "#016FB9" }), jsx("path", { d: "M14.681 16H9.32576C9.114 16 8.94304 15.8343 8.94304 15.6206V10.3044L6.39283 10.3065C6.17884 10.3065 5.99683 10.1386 6.00014 9.93149C5.99683 9.82026 6.0509 9.72651 6.11708 9.65237L11.7293 4.10931C11.8792 3.96319 12.1264 3.96539 12.272 4.10493L17.8842 9.65235C18.0386 9.80716 18.0386 10.0492 17.8842 10.1975C17.8103 10.276 17.711 10.3065 17.6206 10.3065H15.0626V15.6206C15.0659 15.8343 14.8994 16 14.681 16Z", fill: "white" }), jsx("path", { d: "M19.3527 19C19.7106 19 20 19.2213 20 19.5008C20.0044 19.7787 19.7106 19.9983 19.3527 20L4.64283 19.9983C4.2894 19.9983 4 19.7787 4 19.5008C4 19.2213 4.2894 19 4.64283 19H19.3527Z", fill: "white" })] }))); },
+    SwitchToColoursOutlined: function (className) { return (jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("rect", { width: "24", height: "24", rx: "2", fill: "#9131A0" }), jsx("path", { d: "M7.21053 17H5L9.78947 12.1853L5 7H7.21053L12 12.1853L7.21053 17Z", fill: "white" }), jsx("path", { d: "M14.2105 17H12L16.7895 12.1853L12 7H14.2105L19 12.1853L14.2105 17Z", fill: "white" })] }))); },
+    ShoppingColoursOutlined: function (className) { return (jsxs("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("rect", { width: "24", height: "24", rx: "2", fill: "#FF5F00" }), jsx("path", { d: "M16.6668 7.57111H15.3333C15.3333 5.59994 13.8402 4 12.0002 4C10.1602 4 8.66707 5.59994 8.66707 7.57111H7.33354C6.60046 7.57111 6.00729 8.21413 6.00729 8.99987L6 17.5712C6.00077 17.9497 6.14147 18.3123 6.39134 18.5801C6.64122 18.8478 6.97996 18.9988 7.33354 19H16.6665C17.02 18.9988 17.3588 18.8478 17.6087 18.5801C17.8585 18.3123 17.9992 17.9497 18 17.5712V9.00026C17.9992 8.62185 17.8585 8.25916 17.6087 7.99144C17.3588 7.72371 17.02 7.57274 16.6665 7.5715L16.6668 7.57111ZM12.0002 5.42837C12.2631 5.42811 12.5235 5.48337 12.7664 5.59099C13.0093 5.6986 13.23 5.85646 13.4158 6.05551C13.6016 6.25456 13.7489 6.49089 13.8492 6.75096C13.9496 7.01104 14.001 7.28974 14.0005 7.57111H9.99988C9.9994 7.28974 10.0508 7.01104 10.1511 6.75096C10.2515 6.49089 10.3988 6.25456 10.5846 6.05551C10.7704 5.85646 10.9911 5.6986 11.234 5.59099C11.4769 5.48337 11.7373 5.42811 12.0002 5.42837ZM12.0002 12.5714C10.1602 12.5714 8.66707 10.9714 8.66707 8.99948H10.0002C9.99972 9.28088 10.0511 9.55963 10.1514 9.81975C10.2517 10.0799 10.399 10.3162 10.5848 10.5153C10.7706 10.7144 10.9913 10.8723 11.2343 10.98C11.4772 11.0876 11.7376 11.1429 12.0005 11.1426C12.2634 11.1428 12.5237 11.0874 12.7665 10.9798C13.0093 10.8721 13.2299 10.7142 13.4157 10.5152C13.6014 10.3162 13.7487 10.0799 13.8489 9.81984C13.9492 9.55982 14.0006 9.28117 14.0001 8.99987H15.3337C15.3337 10.9714 13.8402 12.5714 12.0002 12.5714Z", fill: "white" })] }))); },
+    EmptyColoursOutlined: function (className) { return (jsxs("svg", __assign({ width: "129", height: "128", viewBox: "0 0 129 128", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("path", { opacity: "0.1", d: "M13.3 112C13.3 113.697 18.6943 115.325 28.2962 116.526C37.898 117.726 50.921 118.4 64.5 118.4C78.0791 118.4 91.102 117.726 100.704 116.526C110.306 115.325 115.7 113.697 115.7 112C115.7 110.303 110.306 108.675 100.704 107.475C91.102 106.274 78.0791 105.6 64.5 105.6C50.921 105.6 37.898 106.274 28.2962 107.475C18.6943 108.675 13.3 110.303 13.3 112Z", fill: "#FF5F00" }), jsx("path", { opacity: "0.5", d: "M15.092 47.1042C15.092 48.1922 15.924 49.0242 17.012 49.0242C18.1 49.0242 18.932 48.1922 18.932 47.1042C18.932 46.0162 18.1 45.1842 17.012 45.1842C15.988 45.1842 15.092 46.0802 15.092 47.1042ZM116.34 104C113.908 104.64 113.396 105.152 112.82 107.52C112.18 105.088 111.668 104.576 109.3 104C111.668 103.36 112.244 102.848 112.82 100.48C113.396 102.848 113.908 103.424 116.34 104ZM25.78 40.3842C22.644 41.2162 22.004 41.8562 21.172 44.9922C20.34 41.8562 19.7 41.2162 16.564 40.3842C19.7 39.5522 20.34 38.8482 21.172 35.7762C21.94 38.9122 22.644 39.5522 25.78 40.3842ZM102.58 29.3762C100.66 29.8882 100.276 30.2722 99.764 32.1922C99.252 30.2722 98.868 29.8882 96.948 29.3762C98.868 28.8642 99.252 28.4802 99.764 26.5602C100.212 28.4802 100.66 28.8642 102.58 29.3762ZM110.836 19.5202C105.844 20.8002 104.82 21.8882 103.476 26.8802C102.196 21.8882 101.108 20.8642 96.116 19.5202C101.108 18.2402 102.132 17.1522 103.476 12.1602C104.756 17.0882 105.844 18.1762 110.836 19.5202Z", fill: "#FF5F00" }), jsx("path", { opacity: "0.2", d: "M52.98 89.1518V89.6638L57.204 93.5678L73.396 85.6958L58.74 95.1038V99.7118L61.108 97.4078L63.476 99.7118L76.02 84.3518V83.8398L52.98 89.1518Z", fill: "#FF5F00" }), jsx("path", { opacity: "0.5", d: "M108.02 68.9919V68.8639C108.02 68.7359 107.956 68.6719 107.956 68.5439V68.4799L94.1959 32.5759C92.2119 26.4959 86.5799 22.3999 80.1799 22.3999H48.8839C42.4839 22.3999 36.8519 26.4959 34.8679 32.5759L21.1079 68.4799V68.5439C21.0439 68.6719 21.0439 68.7359 21.0439 68.8639V94.7199C21.0439 102.848 27.6359 109.44 35.7639 109.44H93.3639C101.492 109.44 108.084 102.848 108.084 94.7199V69.1199C108.02 69.0559 108.02 69.0559 108.02 68.9919ZM38.4519 33.9199C38.4519 33.9199 38.4519 33.8559 38.5159 33.8559C39.9239 29.2479 44.1479 26.2399 48.8839 26.2399H80.1159C84.8519 26.2399 89.0759 29.2479 90.5479 33.7919C90.5479 33.7919 90.5479 33.8559 90.6119 33.8559L103.348 67.1359H74.0999C73.0119 67.1359 72.1799 67.9679 72.1799 69.0559C72.1799 73.2799 68.7239 76.7359 64.4999 76.7359C60.2759 76.7359 56.8199 73.2799 56.8199 69.0559C56.8199 67.9679 55.9879 67.1359 54.8999 67.1359H25.7159L38.4519 33.9199ZM104.18 94.7199C104.18 100.736 99.3159 105.6 93.2999 105.6H35.6999C29.6839 105.6 24.8199 100.736 24.8199 94.7199V71.0399H53.1719C54.0679 76.4799 58.8039 80.6399 64.4999 80.6399C70.1959 80.6399 74.9319 76.4799 75.8279 71.0399H104.18V94.7199Z", fill: "#FF5F00" }), jsx("path", { opacity: "0.2", d: "M64.4999 72.3202C62.7079 72.3202 61.2999 70.9122 61.2999 69.1202V62.7202H32.1799L42.6759 35.3282L42.7399 35.2002C43.6359 32.5122 46.0679 30.7202 48.8839 30.7202H80.1159C82.9319 30.7202 85.3639 32.5122 86.2599 35.2002L86.3239 35.3282L96.8199 62.7202H67.6999V69.1202C67.6999 70.9122 66.2919 72.3202 64.4999 72.3202Z", fill: "#FF5F00" })] }))); },
+    FireWorkColoursOutlined: function (className) { return (jsxs("svg", __assign({ width: "115", height: "94", viewBox: "0 0 115 94", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className }, { children: [jsx("path", { d: "M42.0299 59.8537L44.05 82.9267L34.9637 88.1727L32.9436 65.0996L42.0299 59.8537Z", fill: "#00B2A7" }), jsx("path", { d: "M44.057 82.9219L25.0923 69.6318L15.999 74.8818L34.9708 88.1678L44.057 82.9219ZM60.9315 73.1794L41.9597 59.8934L32.8735 65.1394L51.8453 78.4254L60.9315 73.1794Z", fill: "#6ADDD6" }), jsx("path", { d: "M62.379 88.5858L62.379 91.0065C62.4034 91.2778 62.5294 91.5303 62.7323 91.7141C62.9352 91.898 63.2002 92 63.4751 92C63.7501 92 64.0151 91.898 64.218 91.7141C64.4209 91.5303 64.5469 91.2778 64.5713 91.0065L64.5713 88.5858L67.0148 88.5858C67.1669 88.5993 67.3202 88.5812 67.4649 88.5327C67.6096 88.4842 67.7425 88.4064 67.8552 88.3043C67.9679 88.2022 68.0579 88.0779 68.1194 87.9394C68.181 87.801 68.2128 87.6513 68.2128 87.5C68.2128 87.3487 68.181 87.199 68.1194 87.0606C68.0579 86.9221 67.9679 86.7978 67.8552 86.6957C67.7425 86.5936 67.6096 86.5158 67.4649 86.4673C67.3202 86.4188 67.1669 86.4007 67.0148 86.4142L64.5713 86.4142L64.5713 83.9935C64.5469 83.7222 64.4209 83.4697 64.218 83.2858C64.0151 83.102 63.7501 83 63.4751 83C63.2002 83 62.9352 83.102 62.7323 83.2858C62.5294 83.4697 62.4034 83.7222 62.379 83.9935L62.379 86.4142L59.9355 86.4142C59.6616 86.4383 59.4068 86.5631 59.2212 86.7641C59.0356 86.9651 58.9326 87.2276 58.9326 87.5C58.9326 87.7724 59.0356 88.0349 59.2212 88.2359C59.4068 88.4369 59.6616 88.5617 59.9355 88.5858L62.379 88.5858Z", fill: "#FFC2A0" }), jsx("path", { d: "M76.9251 89.3556C76.5534 89.5998 76.117 89.7292 75.6711 89.7275C75.3756 89.7275 75.0831 89.6697 74.8102 89.5575C74.5374 89.4452 74.2896 89.2807 74.0811 89.0733C73.8726 88.8659 73.7075 88.6198 73.5952 88.3491C73.4829 88.0784 73.4257 87.7884 73.4268 87.4957C73.4268 87.0539 73.5592 86.6221 73.8071 86.2549C74.0551 85.8877 74.4074 85.6017 74.8196 85.433C75.2318 85.2643 75.6852 85.2206 76.1224 85.3074C76.5597 85.3943 76.9611 85.6077 77.2758 85.9207C77.5906 86.2336 77.8044 86.6321 77.8904 87.0656C77.9763 87.4991 77.9305 87.9481 77.7586 88.3557C77.5868 88.7634 77.2967 89.1114 76.9251 89.3556Z", fill: "#FFC2A0" }), jsx("path", { d: "M37.5448 40.2722L37.5448 42.5569C37.5322 42.6992 37.5492 42.8425 37.595 42.9778C37.6407 43.1131 37.7142 43.2374 37.8106 43.3427C37.907 43.4481 38.0242 43.5322 38.1549 43.5898C38.2856 43.6474 38.4269 43.6771 38.5697 43.6771C38.7125 43.6771 38.8537 43.6474 38.9844 43.5898C39.1151 43.5322 39.2324 43.4481 39.3288 43.3427C39.4252 43.2374 39.4986 43.1131 39.5444 42.9778C39.5901 42.8425 39.6072 42.6992 39.5946 42.5569L39.5946 40.2722L41.9117 40.2722C42.1824 40.2722 42.4421 40.1647 42.6335 39.9732C42.825 39.7818 42.9325 39.5221 42.9325 39.2514C42.9325 38.9806 42.825 38.721 42.6335 38.5295C42.4421 38.3381 42.1824 38.2305 41.9117 38.2305L39.5946 38.2305L39.5946 35.9377C39.5718 35.6816 39.4539 35.4434 39.2643 35.2698C39.0746 35.0963 38.8268 35 38.5697 35C38.3126 35 38.0648 35.0963 37.8751 35.2698C37.6854 35.4434 37.5676 35.6816 37.5448 35.9377L37.5448 38.2305L35.2601 38.2305C35.126 38.2305 34.9933 38.257 34.8694 38.3083C34.7456 38.3596 34.633 38.4347 34.5383 38.5295C34.4435 38.6243 34.3683 38.7369 34.317 38.8607C34.2657 38.9846 34.2393 39.1173 34.2393 39.2514C34.2393 39.3854 34.2657 39.5182 34.317 39.642C34.3683 39.7659 34.4435 39.8784 34.5383 39.9732C34.633 40.068 34.7456 40.1432 34.8694 40.1945C34.9933 40.2458 35.126 40.2722 35.2601 40.2722L37.5448 40.2722Z", fill: "#FFC2A0" }), jsx("path", { d: "M92.0093 28.7616L92.0093 31.0463L92.0093 31.0868C92.0093 31.3576 92.1168 31.6172 92.3083 31.8086C92.4997 32.0001 92.7594 32.1076 93.0301 32.1076C93.3008 32.1076 93.5605 32.0001 93.7519 31.8086C93.9434 31.6172 94.0509 31.3576 94.0509 31.0868L94.0509 28.8021L96.3519 28.8021C96.4941 28.8147 96.6374 28.7977 96.7727 28.7519C96.908 28.7062 97.0323 28.6327 97.1376 28.5363C97.243 28.4399 97.3271 28.3227 97.3847 28.192C97.4423 28.0613 97.472 27.92 97.472 27.7772C97.472 27.6344 97.4423 27.4931 97.3847 27.3625C97.3271 27.2318 97.243 27.1145 97.1376 27.0181C97.0323 26.9217 96.908 26.8483 96.7727 26.8025C96.6374 26.7567 96.4941 26.7397 96.3519 26.7523L94.0671 26.7523L94.0671 24.4676C94.0671 24.1969 93.9596 23.9372 93.7681 23.7458C93.5767 23.5543 93.317 23.4468 93.0463 23.4468C92.7756 23.4468 92.5159 23.5543 92.3245 23.7458C92.133 23.9372 92.0255 24.1969 92.0255 24.4676L92.0255 26.7118L89.7326 26.7118C89.4766 26.7346 89.2383 26.8524 89.0647 27.0421C88.8912 27.2318 88.7949 27.4796 88.7949 27.7367C88.7949 27.9938 88.8912 28.2416 89.0647 28.4313C89.2383 28.6209 89.4766 28.7388 89.7326 28.7616L92.0093 28.7616Z", fill: "#FFC2A0" }), jsx("path", { d: "M113.993 3.85796C113.647 4.08942 113.24 4.21296 112.823 4.21296C112.264 4.21296 111.728 3.99103 111.333 3.59599C110.938 3.20095 110.716 2.66516 110.716 2.10648C110.716 1.68986 110.84 1.28259 111.071 0.936183C111.303 0.589774 111.632 0.319781 112.017 0.160346C112.402 0.0009115 112.825 -0.0408036 113.234 0.0404754C113.642 0.121754 114.018 0.322377 114.312 0.616974C114.607 0.911571 114.808 1.28691 114.889 1.69553C114.97 2.10414 114.928 2.52769 114.769 2.9126C114.61 3.29751 114.34 3.62649 113.993 3.85796Z", fill: "#FFC2A0" }), jsx("path", { d: "M63.2618 59.75C63.0143 59.9141 62.7238 60.0011 62.4269 60C62.2301 60 62.0354 59.9612 61.8537 59.8857C61.672 59.8102 61.5071 59.6997 61.3682 59.5603C61.2294 59.4209 61.1195 59.2555 61.0447 59.0736C60.97 58.8916 60.9319 58.6967 60.9326 58.5C60.9326 58.2031 61.0207 57.9128 61.1858 57.666C61.3509 57.4192 61.5855 57.227 61.8599 57.1136C62.1344 57.0003 62.4363 56.9709 62.7274 57.0292C63.0185 57.0876 63.2858 57.231 63.4953 57.4414C63.7049 57.6517 63.8473 57.9196 63.9045 58.2109C63.9617 58.5023 63.9312 58.804 63.8168 59.078C63.7024 59.352 63.5092 59.5859 63.2618 59.75Z", fill: "#FFC2A0" }), jsx("path", { d: "M19 52.7523L7.27619 60L0 56.3761L12.9977 51L19 52.7523Z", fill: "#FFC2A0" }), jsx("path", { d: "M36.3038 4.23805L34 6.69027L37.0034 8L44 1H39.9666L36.3038 4.23805Z", fill: "#FFC2A0" }), jsx("path", { d: "M77.9934 29.7152L57.7732 40.9887L49.2713 34.8406L69.4915 23.5672L77.9934 29.7152Z", fill: "#DC4E45" }), jsx("path", { d: "M57.78 40.9932L62.1454 18.2545L53.6436 12.1064L49.2782 34.8452L57.78 40.9932Z", fill: "#FF6B5B" }), jsx("path", { d: "M93.7821 41.1321L73.5554 52.4008L65.0535 46.2527L85.2803 34.984L93.7821 41.1321Z", fill: "#DC4E45" }), jsx("path", { d: "M73.5622 52.4063L77.9276 29.6676L69.4258 23.5195L65.0604 46.2582L73.5622 52.4063ZM89.3448 63.8193L93.7102 41.0806L85.2084 34.9326L80.843 57.6713L89.3448 63.8193Z", fill: "#FF6B5B" })] }))); }
 });
 
 export { ICONS };

package/es/index.css

@@ -1 +1 @@
-.foxit-checkbox-container{cursor:pointer;display:inline-block;padding-left:25px;position:relative;-webkit-user-select:none;user-select:none}.foxit-checkbox-container input{cursor:pointer;opacity:0;position:absolute}.foxit-checkbox-checkmark{background-color:#fff;border:1px solid #b3b3b3;border-radius:4px;height:20px;left:0;position:absolute;top:0;width:20px}.foxit-checkbox-content{line-height:20px}.foxit-checkbox-container input:checked~.foxit-checkbox-checkmark{background-color:#ff5f00;border:none}.foxit-checkbox-checkmark:after{content:"";display:none;position:absolute}.foxit-checkbox-container input:checked~.foxit-checkbox-checkmark:after{display:block}.foxit-checkbox-container .foxit-checkbox-checkmark:after{border:solid #fff;border-width:0 2px 2px 0;height:10px;left:7px;top:4px;transform:rotate(45deg);width:6px}.foxit-checkbox-container.disabled{color:#00000040;cursor:not-allowed;opacity:.6}.foxit-checkbox-checkmark.disabled{background-color:#f5f5f5;border:1px solid #d9d9d9}.foxit-empty{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:20px;text-align:center}.foxit-empty-image{margin-bottom:16px}.foxit-empty-description{color:#757575;font-size:14px}.foxit-form-item{margin-bottom:16px}.foxit-form-item label{color:#525252;display:block;font-size:14px;font-weight:500;margin-bottom:8px}.foxit-form-error-text{color:#e22727;font-size:12px;margin-top:8px}.foxit-form-warning-text{color:orange;margin-top:8px}.foxit-form-item>.foxit-form-error-component .foxit-checkbox-container,.foxit-form-item>.foxit-form-error-component .foxit-input-wrapper,.foxit-form-item>.foxit-form-error-component .foxit-radio-container,.foxit-form-item>.foxit-form-error-component .foxit-select-wrapper>:nth-child(3){border:1px solid #e22727!important}.foxit-form-item>.foxit-form-warning-component .foxit-checkbox-container,.foxit-form-item>.foxit-form-warning-component .foxit-input-wrapper,.foxit-form-item>.foxit-form-warning-component .foxit-radio-container,.foxit-form-item>.foxit-form-warning-component .foxit-select-wrapper>:nth-child(3){border-color:orange!important}.foxit-input-wrapper{align-items:center;border:1px solid #d9d9d9;border-radius:10px;display:flex;font-size:14px;font-weight:400;padding:11px 16px;transition:border-color .3s}.foxit-input-wrapper:focus-within{border-color:#ff5f00!important}.foxit-input-wrapper:hover{border-color:#757575}.foxit-input-element{border:none;color:#525252;flex:1;line-height:24px;outline:none}.foxit-input-element::placeholder{color:#b3b3b3}.foxit-input-addon{align-items:center;color:#b3b3b3;cursor:pointer;display:flex;padding:0 8px;transition:color .3s}.foxit-input-wrapper:focus-within .foxit-input-addon{color:#ff5f00!important}.foxit-input-wrapper:hover .foxit-input-addon{color:#757575}.foxit-input-wrapper :disabled,.foxit-input-wrapper-disabled{background-color:#f8f8f8}.foxit-input-wrapper-disabled:hover{border-color:#d9d9d9}.foxit-input-wrapper-disabled .foxit-input-element{color:#b3b3b3}.foxit-pagination-container{align-items:center;display:flex;justify-content:center}.foxit-pagination-button,.foxit-pagination-next,.foxit-pagination-prev{background-color:initial;border:none;border-radius:10px;color:#757575;cursor:pointer;font-size:16px;font-weight:500;height:48px;margin:0 4px;min-width:48px;padding:0 12px;transition:background-color .3s ease,color .3s ease}.foxit-pagination-next:hover,.foxit-pagination-prev:hover{color:#ff5f00}.foxit-pagination-button:hover{background-color:#ff5f001a}.foxit-pagination-button:disabled{background-color:#ff5f00;color:#fff;cursor:default}.foxit-radio-container{cursor:pointer;display:inline-block;padding-left:25px;position:relative;-webkit-user-select:none;user-select:none}.foxit-radio-container input{cursor:pointer;opacity:0;position:absolute}.foxit-radio-checkmark{background-color:#fff;border:1px solid #b3b3b3;border-radius:50%;height:20px;left:0;position:absolute;top:0;width:20px}.foxit-radio-content{line-height:20px}.foxit-radio-container input:checked~.foxit-radio-checkmark{background-color:#fff;border:1px solid #ff5f00}.foxit-radio-checkmark:after{content:"";display:none;position:absolute}.foxit-radio-container input:checked~.foxit-radio-checkmark:after{display:block}.foxit-radio-container .foxit-radio-checkmark:after{background:#ff5f00;border-radius:50%;height:10px;left:4px;top:4px;width:10px}.foxit-radio-container.disabled{cursor:not-allowed;opacity:.6}.foxit-table{border:1px solid #ff5f00;border-radius:10px;color:#373737;min-height:200px;overflow:hidden;position:relative}.foxit-table-loading{align-items:center;background-color:#ffffffb3;display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:1}.foxit-table-icon-loading{animation:spin 1s linear infinite;color:#ff5f00}.foxit-table-container{border-collapse:collapse;table-layout:fixed;width:100%}.foxit-table-container td,.foxit-table-container th{word-wrap:break-word;height:70px;min-height:70px;padding:24px;white-space:pre-wrap}.foxit-table-container th{background-color:#fff6f0;font-size:16px;font-weight:700}.foxit-table-container td{font-size:14px;font-weight:400}.foxit-table-container .foxit-even-row{background-color:#fff}.foxit-table-container .foxit-odd-row{background-color:#fff6f0}.foxit-tabs{display:flex;gap:8px}.foxit-tab-item{background-color:#f1f3f4;border:none;border-radius:10px;color:#757575;cursor:pointer;font-weight:600;padding:14px 20px;transition:background-color .3s,color .3s}.foxit-tab-item.active{background-color:#ff5f00;color:#fff}.foxit-tab-item:hover:not(.active){background-color:#e0e0e0}.foxit-tab-content{margin-top:16px}.foxit-tag{border-radius:5px;display:inline-block;font-size:12px;font-weight:600;height:24px;min-height:24px;padding:4px 8px;white-space:nowrap}.foxit-tag-active{background-color:#edfafa;color:#0f8b8d}.foxit-tag-canceled{background-color:#ffecec;color:#e22727}.foxit-tag-pending{background-color:#fbf4d0;color:#9b8827}.foxit-tag-offline{background-color:#edecff;color:#6462c6}.foxit-tag-trial{background-color:#e4f4fe;color:#2288ce}.foxit-tag-expired{background-color:#ececec;color:#757575}.foxit-toast-container{left:50%;pointer-events:none;position:fixed;top:0;transform:translateX(-50%);transition-delay:0s;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:100%;z-index:2000}.foxit-toast-loading{animation:spin 1s linear infinite;color:#ff5f00}.foxit-toast-loading-overlay{background-color:#000;height:100vh;inset:0;opacity:.15;pointer-events:auto;position:fixed;z-index:10}.foxit-toast-item{align-items:center;background-color:#fff;border:none;border-radius:50px;color:#525252;display:flex;flex-direction:row;gap:8px;justify-content:center;margin-bottom:16px;margin-left:auto;margin-right:auto;padding:9px 12px;position:relative;top:102px;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:fit-content;z-index:20}.foxit-toast-item-success{background-color:#ddfae8;color:#1f7f40}.foxit-toast-item-error{background-color:#fae5dd;color:#e22727}.foxit-toast-item-warning{background-color:#fff0e7;color:#525252}.foxit-toast-enter{opacity:0;transform:translateY(-100%)}.foxit-toast-enter-active{transition:all .5s ease-out}.foxit-toast-enter-active,.foxit-toast-exit{opacity:1;transform:translateY(0)}.foxit-toast-exit-active{opacity:0;transform:translateY(-100%);transition:all .5s ease-in}.foxit-tooltip-container{display:inline-block;position:relative;width:auto}.foxit-tooltip-content{background-color:#525252;border-radius:10px;color:#fff;max-width:300px;padding:12px 16px;width:max-content;z-index:1}.foxit-tooltip-arrow,.foxit-tooltip-content{left:50%;position:absolute;transform:translateX(-50%)}.foxit-tooltip-arrow{border-left:5px solid #0000;border-right:5px solid #0000;border-top:5px solid #525252;bottom:-5px;height:0;width:0}.foxit-button{align-items:center;border:0;border-radius:10px;cursor:pointer;display:flex;font-size:14px;font-weight:600;justify-content:center;letter-spacing:.42px}.foxit-button:hover{opacity:.8}.foxit-button-primary{background-color:#ff5f00;color:#fff}.foxit-button-secondary{background-color:#fff;border:2px solid #ff5f00;color:#ff5f00}.foxit-button-small{border-radius:5px;height:38px;padding-left:24px;padding-right:24px}.foxit-button-small svg{height:16px;width:16px}.foxit-button-medium{border-radius:5px;height:44px;padding-left:32px;padding-right:32px}.foxit-button-medium svg{height:20px;width:20px}.foxit-button-large{height:56px;padding-left:32px;padding-right:32px}.foxit-button-loading{animation:spin 1s linear infinite;margin-right:8px}.foxit-button-primary .foxit-button-loading{color:#fff}.foxit-button-secondary .foxit-button-loading{color:#ff5f00}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.foxit-menu{border-radius:10px;box-shadow:0 2px 8px #00000026;font-size:14px;overflow:hidden}.foxit-menu-item-content{align-items:center;cursor:pointer;display:flex;padding:12px 16px}.foxit-menu-item{padding-left:0}.foxit-menu-item.selected{background-color:#fff6f0!important;color:#ff5f00;font-weight:600}.foxit-menu-item:hover{background-color:#f5f6f8}.foxit-menu-submenu-title{align-items:center;cursor:pointer;display:flex;justify-content:space-between;padding:12px 16px}.foxit-menu-submenu-title:hover{background-color:#f5f6f8}.foxit-menu-icon{transition:transform .3s ease-in-out}.foxit-menu-rotated-icon{transform:rotate(180deg)}.foxit-menu-item-label{font-weight:600}.foxit-modal-content-container{background-color:#fff;border-radius:10px;display:flex;flex-direction:column;gap:24px;justify-content:space-between;min-width:320px;padding:24px}.foxit-modal-head{align-items:center;display:flex;justify-content:space-between}.foxit-modal-title{font-size:20px;font-weight:500}.foxit-modal-close-button{align-items:center;cursor:pointer;display:flex;height:16px;justify-content:center;width:16px}.foxit-modal-close-button svg{stroke:#6b7280}.foxit-modal-close-button:hover svg{stroke:#ea580c}.foxit-modal-footer{display:flex;gap:16px;justify-content:flex-end}.foxit-modal-fixed-layout{align-items:center;display:flex;flex-direction:column;inset:0;padding:36px;position:fixed;z-index:50}.foxit-modal-justify-center{justify-content:center}.foxit-modal-justify-top{justify-content:flex-start;padding-top:96px}.foxit-modal-justify-bottom{justify-content:flex-end}.foxit-modal-overlay{cursor:pointer;height:100%;inset:0;position:fixed;width:100%;z-index:50}.foxit-modal-overlay-bg{background-color:#00000026;height:100%;inset:0;position:absolute;width:100%}.foxit-modal-content{align-items:center;display:flex;font-size:16px;font-weight:400;justify-content:center;max-height:100%;width:auto;z-index:50}.foxit-modal-opacity-0{opacity:0}.foxit-modal-opacity-100{opacity:1}.foxit-modal-scale-0{transform:scale(0)}.foxit-modal-scale-100{transform:scale(1)}.foxit-modal-transition{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.foxit-modal-hide-overflow{overflow-y:hidden}.foxit-switch{background-color:#ccc;border-radius:100px;cursor:pointer;display:inline-block;height:22px;line-height:22px;position:relative;transition:background-color .3s;width:40px}.foxit-switch.small{height:14px;line-height:14px;width:24px}.foxit-switch.checked{background-color:#ff5f00}.foxit-switch-handle{background-color:#fff;border-radius:50%;height:18px;position:absolute;top:2px;transform:translateX(1px);transition:transform .3s;width:18px}.foxit-switch.small .foxit-switch-handle{height:12px;top:1px;width:12px}.foxit-switch.checked .foxit-switch-handle{transform:translateX(20px)}.foxit-switch.small.checked .foxit-switch-handle{transform:translateX(11px)}
+.foxit-checkbox-container{cursor:pointer;display:inline-block;padding-left:25px;position:relative;-webkit-user-select:none;user-select:none}.foxit-checkbox-container input{cursor:pointer;opacity:0;position:absolute}.foxit-checkbox-checkmark{background-color:#fff;border:1px solid #b3b3b3;border-radius:4px;height:20px;left:0;position:absolute;top:0;width:20px}.foxit-checkbox-content{line-height:20px}.foxit-checkbox-container input:checked~.foxit-checkbox-checkmark{background-color:#ff5f00;border:none}.foxit-checkbox-checkmark:after{content:"";display:none;position:absolute}.foxit-checkbox-container input:checked~.foxit-checkbox-checkmark:after{display:block}.foxit-checkbox-container .foxit-checkbox-checkmark:after{border:solid #fff;border-width:0 2px 2px 0;height:10px;left:7px;top:4px;transform:rotate(45deg);width:6px}.foxit-checkbox-container.disabled{color:#00000040;cursor:not-allowed;opacity:.6}.foxit-checkbox-checkmark.disabled{background-color:#f5f5f5;border:1px solid #d9d9d9}.foxit-empty{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:20px;text-align:center}.foxit-empty-image{margin-bottom:16px}.foxit-empty-description{color:#757575;font-size:14px}.foxit-form-item{margin-bottom:16px}.foxit-form-item label{color:#525252;display:block;font-size:14px;font-weight:500;margin-bottom:8px}.foxit-form-required{color:#e22727}.foxit-form-error-text{color:#e22727;font-size:12px;margin-top:8px}.foxit-form-warning-text{color:orange;font-size:12px;margin-top:8px}.foxit-form-item>.foxit-form-error-component .foxit-checkbox-container,.foxit-form-item>.foxit-form-error-component .foxit-input-wrapper,.foxit-form-item>.foxit-form-error-component .foxit-radio-container,.foxit-form-item>.foxit-form-error-component .foxit-select-wrapper>:nth-child(3){border:1px solid #e22727!important}.foxit-form-item>.foxit-form-warning-component .foxit-checkbox-container,.foxit-form-item>.foxit-form-warning-component .foxit-input-wrapper,.foxit-form-item>.foxit-form-warning-component .foxit-radio-container,.foxit-form-item>.foxit-form-warning-component .foxit-select-wrapper>:nth-child(3){border-color:orange!important}.foxit-input-wrapper{align-items:center;border:1px solid #d9d9d9;border-radius:10px;display:flex;font-size:14px;font-weight:400;padding:11px 16px;transition:border-color .3s}.foxit-input-wrapper:focus-within{border-color:#ff5f00!important}.foxit-input-wrapper:hover{border-color:#757575}.foxit-input-element{border:none;color:#525252;flex:1;line-height:24px;outline:none!important}.foxit-input-element::placeholder{color:#b3b3b3}.foxit-input-addon{align-items:center;color:#b3b3b3;cursor:pointer;display:flex;padding:0 0 0 8px;transition:color .3s}.foxit-input-wrapper:focus-within .foxit-input-addon{color:#ff5f00!important}.foxit-input-wrapper:hover .foxit-input-addon{color:#757575}.foxit-input-wrapper :disabled,.foxit-input-wrapper-disabled{background-color:#f8f8f8}.foxit-input-wrapper-disabled:hover{border-color:#d9d9d9}.foxit-input-wrapper-disabled .foxit-input-element{color:#b3b3b3}.foxit-pagination-container{align-items:center;display:flex;justify-content:center}.foxit-pagination-button,.foxit-pagination-next,.foxit-pagination-prev{background-color:initial;border:none;border-radius:10px;color:#757575;cursor:pointer;font-size:16px;font-weight:500;height:48px;margin:0 4px;min-width:48px;padding:0 12px;transition:background-color .3s ease,color .3s ease}.foxit-pagination-next:hover,.foxit-pagination-prev:hover{color:#ff5f00}.foxit-pagination-button:hover{background-color:#ff5f001a}.foxit-pagination-button:disabled{background-color:#ff5f00;color:#fff;cursor:default}.foxit-pagination-mobile-container{display:flex;justify-content:center;margin:16px 0}.foxit-pagination-mobile-next,.foxit-pagination-mobile-prev{height:36px;margin:0 8px;min-width:40px}.foxit-pagination-mobile-info{font-size:16px;min-width:48px}.foxit-button,.foxit-pagination-mobile-info{align-items:center;display:flex;justify-content:center}.foxit-button{border:0;border-radius:10px;cursor:pointer;font-size:14px;font-weight:600;letter-spacing:.42px}.foxit-button:disabled{cursor:not-allowed;opacity:.5;pointer-events:none}.foxit-button:hover{opacity:.8}.foxit-button-primary{background-color:#ff5f00;color:#fff}.foxit-button-secondary{background-color:#fff;border:1px solid #ff5f00;color:#ff5f00}.foxit-button-small{border-radius:5px;height:38px;padding-left:24px;padding-right:24px}.foxit-button-small svg{height:16px;width:16px}.foxit-button-medium{border-radius:5px;height:44px;padding-left:32px;padding-right:32px}.foxit-button-medium svg{height:20px;width:20px}.foxit-button-large{height:56px;padding-left:32px;padding-right:32px}.foxit-button-prevent-click{pointer-events:none}.foxit-button-loading{animation:spin 1s linear infinite;margin-right:8px}.foxit-button-primary .foxit-button-loading{color:#fff}.foxit-button-secondary .foxit-button-loading{color:#ff5f00}.foxit-radio-container{cursor:pointer;display:inline-block;padding-left:25px;position:relative;-webkit-user-select:none;user-select:none}.foxit-radio-container input{cursor:pointer;opacity:0;position:absolute}.foxit-radio-checkmark{background-color:#fff;border:1px solid #b3b3b3;border-radius:50%;height:20px;left:0;position:absolute;top:0;width:20px}.foxit-radio-content{line-height:20px}.foxit-radio-container input:checked~.foxit-radio-checkmark{background-color:#fff;border:1px solid #ff5f00}.foxit-radio-checkmark:after{content:"";display:none;position:absolute}.foxit-radio-container input:checked~.foxit-radio-checkmark:after{display:block}.foxit-radio-container .foxit-radio-checkmark:after{background:#ff5f00;border-radius:50%;height:10px;left:4px;top:4px;width:10px}.foxit-radio-container.disabled{cursor:not-allowed;opacity:.6}.foxit-table{border:1px solid #ff5f00;border-radius:10px;color:#373737;min-height:200px;overflow:hidden;position:relative}.foxit-table-loading{align-items:center;background-color:#ffffffb3;display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:1}.foxit-table-icon-loading{animation:spin 1s linear infinite;color:#ff5f00}.foxit-table-container{border-collapse:collapse;min-width:100%;table-layout:fixed;width:auto}.foxit-table-container td,.foxit-table-container th{word-wrap:break-word;height:70px;min-height:70px;padding:24px;white-space:pre-wrap}.foxit-table-container th{background-color:#fff6f0;font-size:16px;font-weight:700}.foxit-table-container td{font-size:14px;font-weight:400}.foxit-table-container .foxit-even-row{background-color:#fff}.foxit-table-container .foxit-odd-row{background-color:#fff6f0}.foxit-table-mobile-list{display:flex;flex-direction:column;gap:16px}.foxit-table-mobile-card{background:#f8f8f8;border-radius:10px;display:flex;flex-direction:column;gap:12px;padding:32px}.foxit-table-mobile-row{align-items:flex-start;display:flex;flex-direction:row;justify-content:space-between}.foxit-table-mobile-row:not(:last-child){border-bottom:1px solid #efefef;padding-bottom:12px}.foxit-table-mobile-label{color:#373737;flex:0 0 auto;font-size:16px;font-weight:700;margin-right:16px}.foxit-table-mobile-value{color:#373737;flex:1 1 0;font-size:14px;font-weight:400;text-align:right;word-break:break-all}.foxit-table-mobile-loading{align-items:center;background:#0000;display:flex;justify-content:center;padding:24px 0;width:100%}.foxit-tabs{display:flex;flex-wrap:wrap;gap:8px}.foxit-tab-item{background-color:#f1f3f4;border:none;border-radius:10px;color:#757575;cursor:pointer;font-size:14px;font-weight:600;padding:14px 20px;transition:background-color .3s,color .3s}.foxit-tab-item.active{background-color:#ff5f00;color:#fff}.foxit-tab-item:hover:not(.active){background-color:#e0e0e0}.foxit-tab-content{margin-top:16px}.foxit-tag{border-radius:5px;display:inline-block;font-size:12px;font-weight:600;min-height:24px;padding:4px 8px}.foxit-tag-active{background-color:#edfafa;color:#0f8b8d}.foxit-tag-canceled{background-color:#ffecec;color:#e22727}.foxit-tag-pending{background-color:#fbf4d0;color:#9b8827}.foxit-tag-offline{background-color:#edecff;color:#6462c6}.foxit-tag-trial{background-color:#e4f4fe;color:#2288ce}.foxit-tag-expired{background-color:#ececec;color:#757575}.foxit-toast-container{left:50%;pointer-events:none;position:fixed;top:0;transform:translateX(-50%);transition-delay:0s;transition-duration:.5s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:100%;z-index:2000}.foxit-toast-loading{animation:spin 1s linear infinite;color:#ff5f00}.foxit-toast-loading-overlay{background-color:#000;height:100vh;inset:0;opacity:.15;pointer-events:auto;position:fixed;z-index:10}.foxit-toast-item{align-items:center;background-color:#fff;border:none;border-radius:50px;color:#525252;display:flex;flex-direction:row;gap:8px;justify-content:center;margin-bottom:16px;margin-left:auto;margin-right:auto;padding:9px 12px;position:relative;top:102px;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:fit-content;z-index:20}.foxit-toast-item-success{background-color:#ddfae8;color:#1f7f40}.foxit-toast-item-error{background-color:#fae5dd;color:#e22727}.foxit-toast-item-warning{background-color:#fff0e7;color:#525252}.foxit-toast-enter{opacity:0;transform:translateY(-100%)}.foxit-toast-enter-active{transition:all .5s ease-out}.foxit-toast-enter-active,.foxit-toast-exit{opacity:1;transform:translateY(0)}.foxit-toast-exit-active{opacity:0;transform:translateY(-100%);transition:all .5s ease-in}.foxit-tooltip-container{display:inline-block;position:relative;width:auto}.foxit-tooltip-content{background-color:#525252;border-radius:10px;color:#fff;max-width:300px;padding:12px 16px;position:absolute;width:max-content;z-index:1}.foxit-tooltip-arrow{border-left:5px solid #0000;border-right:5px solid #0000;border-top:5px solid #525252;bottom:-5px;height:0;left:50%;position:absolute;transform:translateX(-50%);width:0}.foxit-menu{border-radius:10px;font-size:14px;overflow:hidden}.foxit-menu-item-content{align-items:center;cursor:pointer;display:flex;padding:12px 16px}.foxit-menu-item{padding-left:0}.foxit-menu-item.selected{background-color:#fff6f0!important;border-radius:10px;color:#ff5f00;font-weight:600}.foxit-menu-item:hover{background-color:#f5f6f8;border-radius:10px}.foxit-menu-submenu-title{align-items:center;cursor:pointer;display:flex;justify-content:space-between;padding:12px 16px}.foxit-menu-submenu-title:hover{background-color:#f5f6f8;border-radius:10px}.foxit-menu-icon{transition:transform .3s ease-in-out}.foxit-menu-rotated-icon{transform:rotate(180deg)}.foxit-menu-item-label{font-weight:600}.foxit-menu-collapsed{transition:width .2s;width:50px!important}.foxit-menu-item-icon{align-items:center;display:inline-flex;margin-right:8px}.foxit-menu-item-icon-collapsed{font-size:16px;margin-right:0}.foxit-menu-collapsed .foxit-menu-item-content,.foxit-menu-collapsed .foxit-menu-submenu-title{align-items:center;display:flex;justify-content:center;padding:12px}.foxit-menu-collapsed-item{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.foxit-menu-popup{background-color:#fff;border-radius:10px;box-shadow:0 3px 6px #0000001f,0 1px 3px #00000014;min-width:200px;padding:5px 0}.foxit-menu-popup-content{width:100%}.foxit-menu-popup-title{align-items:center;border-bottom:1px solid #f0f0f0;color:#333;display:flex;font-weight:600;padding:8px 16px}.foxit-modal-content-container{background-color:#fff;border-radius:10px;display:flex;flex-direction:column;gap:24px;justify-content:space-between;min-width:320px;padding:36px}.foxit-modal-success{background:linear-gradient(135deg,#fffaf7,#f9ede3,#fffaf7,#f9ede3)}.foxit-modal-head{align-items:center;display:flex;justify-content:space-between}.foxit-modal-children{max-height:60vh;overflow-y:auto}.foxit-modal-title{font-size:20px;font-weight:700}.foxit-modal-success-icon{display:flex;height:94px;margin-top:-50px;width:115px}.foxit-modal-close-button{align-items:center;cursor:pointer;display:flex;height:16px;justify-content:center;width:16px}.foxit-modal-close-button svg{stroke:#6b7280}.foxit-modal-close-button:hover svg{stroke:#ea580c}.foxit-modal-footer{display:flex;gap:16px;justify-content:flex-end}.foxit-modal-fixed-layout{align-items:center;display:flex;flex-direction:column;inset:0;padding:36px;position:fixed;z-index:99}.foxit-modal-justify-center{justify-content:center}.foxit-modal-justify-top{justify-content:flex-start;padding-top:96px}.foxit-modal-justify-bottom{justify-content:flex-end}.foxit-modal-overlay{cursor:pointer;height:100%;inset:0;position:fixed;width:100%;z-index:99}.foxit-modal-overlay-bg{background-color:#00000026;height:100%;inset:0;position:absolute;width:100%}.foxit-modal-content{align-items:center;display:flex;font-size:16px;font-weight:400;justify-content:center;max-height:100%;width:auto;z-index:99}.foxit-modal-opacity-0{opacity:0}.foxit-modal-opacity-100{opacity:1}.foxit-modal-scale-0{transform:scale(0)}.foxit-modal-scale-100{transform:scale(1)}.foxit-modal-transition{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.foxit-modal-hide-overflow{overflow-y:hidden}.foxit-switch{background-color:#ccc;border-radius:100px;cursor:pointer;display:inline-block;height:22px;line-height:22px;position:relative;transition:background-color .3s;width:40px}.foxit-switch.small{height:14px;line-height:14px;width:24px}.foxit-switch.checked{background-color:#ff5f00}.foxit-switch-handle{background-color:#fff;border-radius:50%;height:18px;position:absolute;top:2px;transform:translateX(1px);transition:transform .3s;width:18px}.foxit-switch.small .foxit-switch-handle{height:12px;top:1px;width:12px}.foxit-switch.checked .foxit-switch-handle{transform:translateX(20px)}.foxit-switch.small.checked .foxit-switch-handle{transform:translateX(11px)}.foxit-spin{display:inline-block;pointer-events:none;position:relative;width:100%}.foxit-spin .foxit-spin-container{opacity:.5}.foxit-spin-spinning{animation:spin 1s linear infinite;color:#ff5f00;margin-right:8px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.foxit-spin-icon{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.foxit-spin-small .foxit-spin-icon{font-size:16px}.foxit-spin-default .foxit-spin-icon{font-size:24px}.foxit-spin-large .foxit-spin-icon{font-size:32px}.foxit-alert{align-items:flex-start;border-radius:5px;display:flex;padding:12px}.foxit-alert-icon-container{height:20px;margin-right:8px;width:20px}.foxit-alert-icon{height:20px;width:20px}.foxit-alert-message{font-size:12px}.foxit-alert-success,.foxit-alert-warning{background-color:#f5fff2;border:1px solid #30dc6b}.foxit-alert-error{background-color:#fae5dd;border:1px solid #e22727}.foxit-alert-gradient{background:linear-gradient(135deg,#fffaf7,#f9ede3,#fffaf7,#f9ede3);border:1px solid #ff5f00;display:block}.foxit-quantity,.foxit-quantity-button{align-items:center;display:flex}.foxit-quantity-button{background-color:#ff5f00;border:none;border-radius:4px;color:#fff;cursor:pointer;height:16px;justify-content:center;margin-left:8px;margin-right:8px;width:16px}.foxit-quantity-button:disabled{background-color:#ffc2a0;cursor:not-allowed}.foxit-quantity-button>div{font-size:16px;margin-top:-3px}.foxit-quantity-number{border:1px solid #b3b3b3;border-radius:4px;color:#525252;flex:1;font-size:14px;height:24px;line-height:24px;outline:none!important;text-align:center;width:48px}.foxit-drawer-mask{background-color:#00000026;inset:0;opacity:0;pointer-events:none;position:fixed;transition:opacity .3s;z-index:99}.foxit-drawer-mask-open{opacity:1;pointer-events:auto}.foxit-drawer{background:#fff;box-shadow:-2px 0 8px #00000026;height:100vh;overflow:auto;position:fixed;right:0;top:0;transition:right .3s;z-index:100}.foxit-drawer-content{padding:24px}

package/es/index.d.ts

@@ -1,6 +1,6 @@
 import Checkbox from './Checkbox/Checkbox';
 import Empty from './Empty/Empty';
-import Form, { FormItem } from './Form/Form';
+import Form, { FormItem, useFormWatch } from './Form/Form';
 import Input, { SearchInput, PasswordInput } from './Input/Input';
 import Pagination from './Pagination/Pagination';
 import Radio from './Radio/Radio';
@@ -14,7 +14,7 @@ import Tooltip from './Tooltip/Tooltip';
 export { Button } from './Button/Button';
 export { Checkbox };
 export { Empty };
-export { Form, FormItem };
+export { Form, FormItem, useFormWatch };
 export type { FormRefInstance } from './Form/Form.types';
 export { Icon } from './Icon/index';
 export { Input, SearchInput, PasswordInput };
@@ -31,3 +31,7 @@ export { Tag };
 export { Toast };
 export { Tooltip };
 export { Switch } from './Switch/Switch';
+export { Spin } from './Spin/Spin';
+export { Alert } from './Alert/Alert';
+export { Quantity } from './Quantity/Quantity';
+export { Drawer } from './Drawer/Drawer';

package/es/index.js

@@ -15,4 +15,9 @@ export { Icon } from './Icon/index.js';
 export { Menu, getItem } from './Menu/Menu.js';
 export { Modal } from './Modal/Modal.js';
 export { Switch } from './Switch/Switch.js';
+export { Spin } from './Spin/Spin.js';
+export { Alert } from './Alert/Alert.js';
+export { Quantity } from './Quantity/Quantity.js';
+export { Drawer } from './Drawer/Drawer.js';
 export { default as FormItem } from './Form/FormItem.js';
+export { useFormWatch } from './Form/useFormWatch.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "foxit-component",
-  "version": "0.0.1-alpha.9",
+  "version": "1.0.0-alpha.29",
   "author": {
     "name": "linye",
     "email": "869675630@qq.com"
@@ -44,9 +44,9 @@
     "eslint-plugin-unused-imports": "^4.1.4",
     "react-scripts": "5.0.1",
     "react-select": "^5.10.0",
+    "react-transition-group": "^4.4.5",
     "typescript": "^4.9.5",
-    "web-vitals": "^2.1.4",
-    "react-transition-group": "^4.4.5"
+    "web-vitals": "^2.1.4"
   },
   "eslintConfig": {
     "extends": [