@canlooks/can-ui 0.0.67 → 0.0.69

package/dist/cjs/components/accordion/accordion.js

@@ -6,7 +6,7 @@ const accordion_style_1 = require("./accordion.style");
 const utils_1 = require("../../utils");
 const theme_1 = require("../theme");
 const transitionBase_1 = require("../transitionBase");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faCaretRight_1 = require("@fortawesome/free-solid-svg-icons/faCaretRight");
 function Accordion({ size, title, prefix, suffix, expandIcon, defaultExpanded = false, expanded, onExpandedChange, readOnly, disabled, ...props }) {
     const theme = (0, theme_1.useTheme)();
@@ -17,7 +17,7 @@ function Accordion({ size, title, prefix, suffix, expandIcon, defaultExpanded =
     };
     const renderExpandIcon = () => {
         if (!expandIcon) {
-            return (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCaretRight_1.faCaretRight, className: accordion_style_1.classes.expandIcon });
+            return (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCaretRight_1.faCaretRight, className: accordion_style_1.classes.expandIcon });
         }
         if (typeof expandIcon === 'function') {
             return expandIcon(innerExpanded.current);

package/dist/cjs/components/alert/alert.js

@@ -8,12 +8,13 @@ const alert_style_1 = require("./alert.style");
 const button_1 = require("../button");
 const skeleton_1 = require("../skeleton");
 const faXmark_1 = require("@fortawesome/free-solid-svg-icons/faXmark");
-const __1 = require("../..");
+const icon_1 = require("../icon");
+const status_1 = require("../status");
 exports.Alert = (0, react_1.memo)(({ variant = 'standard', status = 'error', color = status, showIcon = true, icon, title, description, prefix, suffix, closable, onClose, loading, ...props }) => {
     return ((0, jsx_runtime_1.jsxs)("div", { ...props, css: (0, alert_style_1.useStyle)({ color: color || 'error' }), className: (0, utils_1.clsx)(alert_style_1.classes.root, props.className), "data-variant": variant, children: [showIcon &&
                 (0, jsx_runtime_1.jsx)("div", { className: alert_style_1.classes.icon, children: loading
                         ? (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { variant: "circular" })
-                        : icon ?? (0, jsx_runtime_1.jsx)(__1.Icon, { icon: __1.statusMapToIconDefinition[status] }) }), !loading && !!prefix &&
+                        : icon ?? (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: status_1.statusMapToIconDefinition[status] }) }), !loading && !!prefix &&
                 (0, jsx_runtime_1.jsx)("div", { className: alert_style_1.classes.prefix, children: prefix }), (0, jsx_runtime_1.jsxs)("div", { className: alert_style_1.classes.content, children: [!!(loading || title) &&
                         (0, jsx_runtime_1.jsx)("div", { className: alert_style_1.classes.title, children: loading
                                 ? (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { width: "40%" })
@@ -22,5 +23,5 @@ exports.Alert = (0, react_1.memo)(({ variant = 'standard', status = 'error', col
                                 ? (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, {})
                                 : description })] }), !loading && !!suffix &&
                 (0, jsx_runtime_1.jsx)("div", { className: alert_style_1.classes.suffix, children: suffix }), closable &&
-                (0, jsx_runtime_1.jsx)(button_1.Button, { className: alert_style_1.classes.close, variant: "text", shape: "circular", color: variant === 'filled' ? '#fff' : 'text.secondary', onClick: onClose, disabled: loading, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faXmark_1.faXmark }) })] }));
+                (0, jsx_runtime_1.jsx)(button_1.Button, { className: alert_style_1.classes.close, variant: "text", shape: "circular", color: variant === 'filled' ? '#fff' : 'text.secondary', onClick: onClose, disabled: loading, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faXmark_1.faXmark }) })] }));
 });

package/dist/cjs/components/anchorList/anchorList.js

@@ -21,10 +21,11 @@ exports.AnchorList = (0, react_1.memo)(({ anchors, renderAnchorItem, indent = 24
     });
     const scrollToId = (id) => {
         const targetEl = document.getElementById(id);
-        if (!targetEl) {
+        const scrollerEl = getScroller();
+        if (!targetEl || !scrollerEl) {
             return false;
         }
-        getScroller().scrollTo({
+        scrollerEl.scrollTo({
             top: targetEl.offsetTop - offset,
             // 初始化之前无需平滑滚动
             behavior: initialized.current ? scrollBehavior : 'instant'
@@ -53,29 +54,34 @@ exports.AnchorList = (0, react_1.memo)(({ anchors, renderAnchorItem, indent = 24
      * 监听滚动设置高亮
      */
     const getScroller = () => {
-        return (typeof scroller === 'function' ? scroller() : scroller) || document.documentElement;
+        if (scroller) {
+            return typeof scroller === 'function' ? scroller() : scroller;
+        }
+        return document.documentElement;
     };
     const [activeId, setActiveId] = (0, utils_1.useSyncState)();
     (0, react_1.useEffect)(() => {
         const scrollerEl = getScroller();
-        const scroll = () => {
-            let nearest;
-            let minDistance = Infinity;
-            const targets = anchors?.map(item => document.getElementById(item.id));
-            targets?.forEach(target => {
-                const top = target?.getBoundingClientRect().top;
-                if (typeof top === 'number') {
-                    const distance = Math.abs(top - offset);
-                    if (distance < minDistance) {
-                        minDistance = distance;
-                        nearest = target;
+        if (scrollerEl) {
+            const scroll = () => {
+                let nearest;
+                let minDistance = Infinity;
+                const targets = anchors?.map(item => document.getElementById(item.id));
+                targets?.forEach(target => {
+                    const top = target?.getBoundingClientRect().top;
+                    if (typeof top === 'number') {
+                        const distance = Math.abs(top - offset);
+                        if (distance < minDistance) {
+                            minDistance = distance;
+                            nearest = target;
+                        }
                     }
-                }
-            });
-            nearest && setActiveId(nearest.id);
-        };
-        !activeId.current && scroll();
-        return (0, utils_1.listenAllPredecessorsScroll)(scrollerEl === document.documentElement ? document : scrollerEl, scroll);
+                });
+                nearest && setActiveId(nearest.id);
+            };
+            !activeId.current && scroll();
+            return (0, utils_1.listenAllPredecessorsScroll)(scrollerEl === document.documentElement ? document : scrollerEl, scroll);
+        }
     }, [anchors, scroller, offset]);
     const [animating, setAnimating] = (0, utils_1.useDerivedState)(prev => typeof prev !== 'undefined', [activeId.current]);
     return ((0, jsx_runtime_1.jsxs)(flex_1.Flex, { direction: "column", alignItems: "flex-start", ...props, css: anchorList_style_1.style, className: (0, utils_1.clsx)(anchorList_style_1.classes.root, props.className), "data-animating": animating.current, children: [anchors?.map(item => {

package/dist/cjs/components/boundary/errorBoundary.js

@@ -7,7 +7,7 @@ const utils_1 = require("../../utils");
 const errorBoundary_style_1 = require("./errorBoundary.style");
 const placeholder_1 = require("../placeholder");
 const button_1 = require("../button");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faRotateRight_1 = require("@fortawesome/free-solid-svg-icons/faRotateRight");
 const placeholderSlots = {
     description: 'pre'
@@ -25,5 +25,5 @@ exports.ErrorBoundary = (0, react_1.memo)(({ error, reload, reloadable, ...props
         }
     };
     return ((0, jsx_runtime_1.jsx)(placeholder_1.Placeholder, { status: "error", description: renderDescriptions(), slots: placeholderSlots, extra: reloadable &&
-            (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outlined", color: "text.secondary", prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faRotateRight_1.faRotateRight }), onClick: reload, children: "\u91CD\u65B0\u52A0\u8F7D" }), ...props, css: errorBoundary_style_1.style, className: (0, utils_1.clsx)(errorBoundary_style_1.classes.root, props.className) }));
+            (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outlined", color: "text.secondary", prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faRotateRight_1.faRotateRight }), onClick: reload, children: "\u91CD\u65B0\u52A0\u8F7D" }), ...props, css: errorBoundary_style_1.style, className: (0, utils_1.clsx)(errorBoundary_style_1.classes.root, props.className) }));
 });

package/dist/cjs/components/bubbleConfirm/bubbleConfirm.js

@@ -7,9 +7,9 @@ const bubbleConfirm_style_1 = require("./bubbleConfirm.style");
 const utils_1 = require("../../utils");
 const button_1 = require("../button");
 const theme_1 = require("../theme");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faCircleQuestion_1 = require("@fortawesome/free-solid-svg-icons/faCircleQuestion");
-function BubbleConfirm({ icon = (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCircleQuestion_1.faCircleQuestion }), title, footer, showArrow = true, offset, loading = false, onConfirm, defaultOpen = false, open, onOpenChange, ...props }) {
+function BubbleConfirm({ icon = (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCircleQuestion_1.faCircleQuestion }), title, footer, showArrow = true, offset, loading = false, onConfirm, defaultOpen = false, open, onOpenChange, ...props }) {
     const { spacing } = (0, theme_1.useTheme)();
     offset ??= showArrow ? spacing[3] : spacing[2];
     const [innerOpen, _setInnerOpen] = (0, utils_1.useControlled)(defaultOpen, open, onOpenChange);

package/dist/cjs/components/calendar/panelYear.js

@@ -6,7 +6,7 @@ const react_1 = require("react");
 const calendar_style_1 = require("./calendar.style");
 const button_1 = require("../button");
 const tooltip_1 = require("../tooltip");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faAngleLeft_1 = require("@fortawesome/free-solid-svg-icons/faAngleLeft");
 const faAngleRight_1 = require("@fortawesome/free-solid-svg-icons/faAngleRight");
 exports.PanelYear = (0, react_1.memo)(({ innerD, setInnerD, onSelected, min, max }) => {
@@ -32,5 +32,5 @@ exports.PanelYear = (0, react_1.memo)(({ innerD, setInnerD, onSelected, min, max
         }
         return ret;
     };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.head, children: [(0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.headSide, children: renderHeadControl((0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAngleLeft_1.faAngleLeft }), '上一页', () => setPage(p => p - 1)) }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.headSide, children: renderHeadControl((0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAngleRight_1.faAngleRight }), '下一页', () => setPage(p => p + 1)) }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.headCenter, children: "\u5E74\u4EFD" })] }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.body, "data-view-type": "year", children: renderButtons() })] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: calendar_style_1.classes.head, children: [(0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.headSide, children: renderHeadControl((0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faAngleLeft_1.faAngleLeft }), '上一页', () => setPage(p => p - 1)) }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.headSide, children: renderHeadControl((0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faAngleRight_1.faAngleRight }), '下一页', () => setPage(p => p + 1)) }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.headCenter, children: "\u5E74\u4EFD" })] }), (0, jsx_runtime_1.jsx)("div", { className: calendar_style_1.classes.body, "data-view-type": "year", children: renderButtons() })] }));
 });

package/dist/cjs/components/cascade/cascade.js

@@ -13,14 +13,14 @@ const cascade_style_1 = require("./cascade.style");
 const cascadePanel_1 = require("./cascadePanel");
 const searchResult_1 = require("./searchResult");
 const selectionContext_1 = require("../selectionContext");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faMagnifyingGlass_1 = require("@fortawesome/free-solid-svg-icons/faMagnifyingGlass");
 const faCaretDown_1 = require("@fortawesome/free-solid-svg-icons/faCaretDown");
 const CascadeContext = (0, react_1.createContext)({});
 function useCascadeContext() {
     return (0, react_1.useContext)(CascadeContext);
 }
-exports.Cascade = (0, react_1.memo)(({ inputProps, defaultOpen = false, open, onOpenChange, children, loadOptions, multiple = false, showCheckbox = !!multiple, defaultValue = [], value, onChange, renderBackfill, searchable, defaultSearchValue = '', searchValue, onSearchChange, searchInputProps, popperProps, popperRef, clearable = !!multiple, integration = 'deepest', 
+exports.Cascade = (0, react_1.memo)(({ inputProps, defaultOpen = false, open, onOpenChange, children, loadOptions, multiple = false, showCheckbox = !!multiple, defaultValue, value, onChange, renderBackfill, searchable, defaultSearchValue = '', searchValue, onSearchChange, searchInputProps, popperProps, popperRef, clearable = !!multiple, integration = 'deepest', 
 // 共享属性，从OptionsBaseSharedProps继承
 loading, options, labelKey = 'label', primaryKey = 'value', childrenKey = 'children', searchTokenKey = 'searchToken', ...props }) => {
     /**
@@ -79,7 +79,7 @@ loading, options, labelKey = 'label', primaryKey = 'value', childrenKey = 'child
      * --------------------------------------------------------------------
      * 控制选中状态
      */
-    const [pathifiedValue, setPathifiedValue] = (0, utils_1.useControlled)(defaultValue, value, onChange);
+    const [pathifiedValue, setPathifiedValue] = (0, utils_1.useControlled)(defaultValue || [], value, onChange);
     // 路径转单一键
     const toStandardValue = (path) => {
         if (!path) {
@@ -196,7 +196,7 @@ loading, options, labelKey = 'label', primaryKey = 'value', childrenKey = 'child
         }
     };
     return ((0, jsx_runtime_1.jsx)(popper_1.Popper, { css: cascade_style_1.cascadePopperStyle, open: innerOpen.current, placement: "bottomLeft", trigger: ['click', 'enter'], disabled: props.disabled, content: (0, jsx_runtime_1.jsxs)("div", { children: [searchable &&
-                    (0, jsx_runtime_1.jsx)(input_1.Input, { prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faMagnifyingGlass_1.faMagnifyingGlass }), placeholder: "\u641C\u7D22", value: innerSearchValue.current, ...searchInputProps, className: (0, utils_1.clsx)(cascade_style_1.classes.searchInput, searchInputProps?.className), onChange: e => {
+                    (0, jsx_runtime_1.jsx)(input_1.Input, { prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faMagnifyingGlass_1.faMagnifyingGlass }), placeholder: "\u641C\u7D22", value: innerSearchValue.current, ...searchInputProps, className: (0, utils_1.clsx)(cascade_style_1.classes.searchInput, searchInputProps?.className), onChange: e => {
                             searchInputProps?.onChange?.(e);
                             setInnerSearchValue(e.target.value);
                         } }), deferredSearchValue
@@ -209,5 +209,5 @@ loading, options, labelKey = 'label', primaryKey = 'value', childrenKey = 'child
                                 verticalIndex: verticalIndex.current, setVerticalIndex, horizontalIndex: horizontalIndex.current
                             }, children: (0, jsx_runtime_1.jsx)(cascadePanel_1.CascadePanel, { options: actualOptions }) }) })] }), ...popperProps, popperRef: popperRef, onOpenChange: openChangeHandler, onOpenChangeEnd: onOpenChangeEnd, children: (0, jsx_runtime_1.jsx)(inputBase_1.InputBase, { ...props, css: cascade_style_1.style, className: (0, utils_1.clsx)(cascade_style_1.classes.root, props.className), onClear: clearHandler, clearable: clearable, value: pathifiedValue.current, "data-focused": innerOpen.current, loading: innerLoading.current, children: ({ ref, ...rest }) => (0, jsx_runtime_1.jsxs)("div", { className: cascade_style_1.classes.contentWrap, children: [!pathifiedValue.current?.length
                         ? (0, jsx_runtime_1.jsx)("div", { className: cascade_style_1.classes.placeholder, children: props.placeholder })
-                        : (0, jsx_runtime_1.jsx)("div", { className: cascade_style_1.classes.backfill, children: renderBackfillFn() }), (0, jsx_runtime_1.jsx)("input", { ...rest, ...inputProps, ref: (0, utils_1.cloneRef)(ref, inputProps?.ref), "data-hidden": "true" }), (0, jsx_runtime_1.jsx)("div", { className: cascade_style_1.classes.arrow, "data-open": innerOpen.current, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCaretDown_1.faCaretDown }) })] }) }) }));
+                        : (0, jsx_runtime_1.jsx)("div", { className: cascade_style_1.classes.backfill, children: renderBackfillFn() }), (0, jsx_runtime_1.jsx)("input", { ...rest, ...inputProps, ref: (0, utils_1.cloneRef)(ref, inputProps?.ref), "data-hidden": "true" }), (0, jsx_runtime_1.jsx)("div", { className: cascade_style_1.classes.arrow, "data-open": innerOpen.current, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCaretDown_1.faCaretDown }) })] }) }) }));
 });

package/dist/cjs/components/cascade/cascadePanel.js

@@ -10,7 +10,7 @@ const cascade_style_1 = require("./cascade.style");
 const transitionBase_1 = require("../transitionBase");
 const cascade_1 = require("./cascade");
 const utils_1 = require("../../utils");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faChevronRight_1 = require("@fortawesome/free-solid-svg-icons/faChevronRight");
 function CascadePanel({ options, index = 0 }) {
     const { innerLoading, loadingOption, multiple, showCheckbox, primaryKey, labelKey, childrenKey, pathifiedValue, selectionStatus, optionsMap, openedPanels, onOptionClick, onCheckboxClick, verticalIndex, setVerticalIndex, horizontalIndex } = (0, cascade_1.useCascadeContext)();
@@ -52,7 +52,7 @@ function CascadePanel({ options, index = 0 }) {
                     }
                 }, selected: isSelected(optVal) || (opened && hasChildren), focused: horizontalIndex === index && verticalIndex === i, label: opt[labelKey], onClick: () => onOptionClick(opt, index), onPointerEnter: onPointerEnter, suffix: innerLoading && loadingOption === optVal
                     ? (0, jsx_runtime_1.jsx)(loadingIndicator_1.LoadingIndicator, {})
-                    : hasChildren && (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faChevronRight_1.faChevronRight }), children: null }, optVal));
+                    : hasChildren && (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faChevronRight_1.faChevronRight }), children: null }, optVal));
         });
     };
     const nextOptions = optionsMap.get(openedPanels[index])?.[childrenKey];

package/dist/cjs/components/checkboxBase/checkboxBase.js

@@ -6,7 +6,7 @@ const react_1 = require("react");
 const utils_1 = require("../../utils");
 const checkboxBase_style_1 = require("./checkboxBase.style");
 const checkboxBaseGroup_1 = require("../checkboxBaseGroup");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faCheck_1 = require("@fortawesome/free-solid-svg-icons/faCheck");
 exports.CheckboxBase = (0, react_1.memo)(({ inputProps, _type, size, color, label, value, indeterminate, disabled, readOnly, defaultChecked = false, checked, onChange, ...props }) => {
     const context = (0, checkboxBaseGroup_1.useCheckboxBaseGroupContext)();
@@ -39,7 +39,7 @@ exports.CheckboxBase = (0, react_1.memo)(({ inputProps, _type, size, color, labe
                 ? (0, jsx_runtime_1.jsx)("div", { ref: checkboxRef, className: checkboxBase_style_1.classes.checkbox, children: indeterminate
                         ? (0, jsx_runtime_1.jsx)("div", { className: checkboxBase_style_1.classes.indeterminate })
                         : innerChecked.current
-                            ? (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCheck_1.faCheck, className: checkboxBase_style_1.classes.icon })
+                            ? (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCheck_1.faCheck, className: checkboxBase_style_1.classes.icon })
                             : null })
                 : (0, jsx_runtime_1.jsx)("div", { ref: checkboxRef, className: `${checkboxBase_style_1.classes.checkbox} ${checkboxBase_style_1.classes.radio}`, children: innerChecked.current
                         ? (0, jsx_runtime_1.jsx)("div", { className: checkboxBase_style_1.classes.radioChecked })

package/dist/cjs/components/counter/counter.js

@@ -8,7 +8,7 @@ const utils_1 = require("../../utils");
 const button_1 = require("../button");
 const input_1 = require("../input");
 const flex_1 = require("../flex");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faMinus_1 = require("@fortawesome/free-solid-svg-icons/faMinus");
 const faPlus_1 = require("@fortawesome/free-solid-svg-icons/faPlus");
 exports.Counter = (0, react_1.memo)(({ size, min = -Infinity, max = Infinity, step = 1, precision = 0, defaultValue = 0, value, onChange, decreaseProps, increaseProps, inputProps, ...props }) => {
@@ -24,11 +24,11 @@ exports.Counter = (0, react_1.memo)(({ size, min = -Infinity, max = Infinity, st
     return ((0, jsx_runtime_1.jsxs)(flex_1.Flex, { compact: true, ...props, css: counter_style_1.style, className: (0, utils_1.clsx)(counter_style_1.classes.root, props.className), children: [(0, jsx_runtime_1.jsx)(button_1.Button, { disabled: innerValue.current <= min, ...commonButtonProps, ...decreaseProps, onClick: e => {
                     decreaseProps?.onClick?.(e);
                     clickHandler(-1);
-                }, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faMinus_1.faMinus }) }), (0, jsx_runtime_1.jsx)(input_1.Input, { type: "number", widthAdaptable: true, size: size, min: min, max: max, step: step, precision: precision, ...inputProps, className: (0, utils_1.clsx)(counter_style_1.classes.input, inputProps?.className), value: innerValue.current, onChange: e => {
+                }, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faMinus_1.faMinus }) }), (0, jsx_runtime_1.jsx)(input_1.Input, { type: "number", widthAdaptable: true, size: size, min: min, max: max, step: step, precision: precision, ...inputProps, className: (0, utils_1.clsx)(counter_style_1.classes.input, inputProps?.className), value: innerValue.current, onChange: e => {
                     inputProps?.onChange?.(e);
                     setInnerValue(+e.target.value);
                 } }), (0, jsx_runtime_1.jsx)(button_1.Button, { disabled: innerValue.current >= max, ...commonButtonProps, ...increaseProps, onClick: e => {
                     increaseProps?.onClick?.(e);
                     clickHandler(1);
-                }, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faPlus_1.faPlus }) })] }));
+                }, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faPlus_1.faPlus }) })] }));
 });

package/dist/cjs/components/curd/curd.js

@@ -17,7 +17,7 @@ const curdDialog_1 = require("./curdDialog");
 const app_1 = require("../app");
 const bubbleConfirm_1 = require("../bubbleConfirm");
 const selectionContext_1 = require("../selectionContext");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faTrashCan_1 = require("@fortawesome/free-regular-svg-icons/faTrashCan");
 const faPenToSquare_1 = require("@fortawesome/free-regular-svg-icons/faPenToSquare");
 const faPlus_1 = require("@fortawesome/free-solid-svg-icons/faPlus");
@@ -78,11 +78,11 @@ exports.Curd = (0, react_1.memo)((props) => {
                 const _updateProps = _updatable ? (typeof updateButtonProps === 'function' ? updateButtonProps(row) : updateButtonProps) : void 0;
                 const _deleteProps = _deletable ? (typeof deleteButtonProps === 'function' ? deleteButtonProps(row) : deleteButtonProps) : void 0;
                 return ((0, jsx_runtime_1.jsxs)("div", { className: curd_style_1.classes.control, children: [renderExtraControl?.(row), _updatable &&
-                            (0, jsx_runtime_1.jsx)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faPenToSquare_1.faPenToSquare }), variant: "plain", ..._updateProps, onClick: e => {
+                            (0, jsx_runtime_1.jsx)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faPenToSquare_1.faPenToSquare }), variant: "plain", ..._updateProps, onClick: e => {
                                     _updateProps?.onClick?.(e);
                                     updateHandler(row);
                                 }, children: "\u7F16\u8F91" }), _deletable &&
-                            (0, jsx_runtime_1.jsx)(bubbleConfirm_1.BubbleConfirm, { title: `删除${dataName}`, content: `删除后不可恢复，确定要删除该${dataName || '数据'}吗？`, ...deleteConfirmProps, onConfirm: e => deleteHandler(row, e), children: (0, jsx_runtime_1.jsx)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faTrashCan_1.faTrashCan }), variant: "plain", color: "error", ..._deleteProps, children: "\u5220\u9664" }) })] }));
+                            (0, jsx_runtime_1.jsx)(bubbleConfirm_1.BubbleConfirm, { title: `删除${dataName}`, content: `删除后不可恢复，确定要删除该${dataName || '数据'}吗？`, ...deleteConfirmProps, onConfirm: e => deleteHandler(row, e), children: (0, jsx_runtime_1.jsx)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faTrashCan_1.faTrashCan }), variant: "plain", color: "error", ..._deleteProps, children: "\u5220\u9664" }) })] }));
             }
         };
         return [...columns || [], controlColumn];
@@ -190,9 +190,9 @@ exports.Curd = (0, react_1.memo)((props) => {
     };
     return ((0, jsx_runtime_1.jsxs)("div", { ...wrapperProps, ref: wrapperRef, css: curd_style_1.style, className: (0, utils_1.clsx)(curd_style_1.classes.root, wrapperProps?.className), "data-variant": variant, children: [renderFilterFn(), (creatable || toolbarLeft || toolbarRight || reloadable || resizable || columnConfigurable) &&
                 (0, jsx_runtime_1.jsxs)("div", { className: curd_style_1.classes.toolbar, children: [(0, jsx_runtime_1.jsxs)("div", { className: curd_style_1.classes.toolbarLeft, children: [creatable &&
-                                    (0, jsx_runtime_1.jsxs)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faPlus_1.faPlus }), ...createButtonProps, onClick: createHandler, children: [createName, dataName] }), toolbarLeft] }), (0, jsx_runtime_1.jsxs)("div", { className: curd_style_1.classes.toolbarRight, children: [!!toolbarRight &&
+                                    (0, jsx_runtime_1.jsxs)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faPlus_1.faPlus }), ...createButtonProps, onClick: createHandler, children: [createName, dataName] }), toolbarLeft] }), (0, jsx_runtime_1.jsxs)("div", { className: curd_style_1.classes.toolbarRight, children: [!!toolbarRight &&
                                     (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [toolbarRight, (0, jsx_runtime_1.jsx)(divider_1.Divider, { className: curd_style_1.classes.divider, orientation: "vertical" })] }), reloadable &&
-                                    (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u5237\u65B0", children: (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faRotateRight_1.faRotateRight }), loading: innerLoading.current, onClick: reloadHandler }) }), resizable &&
+                                    (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u5237\u65B0", children: (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faRotateRight_1.faRotateRight }), loading: innerLoading.current, onClick: reloadHandler }) }), resizable &&
                                     (0, jsx_runtime_1.jsx)(curdResizable_1.CurdResizable, { innerSize: innerSize.current, setInnerSize: setInnerSize }), columnConfigurable &&
                                     (0, jsx_runtime_1.jsx)(curdColumnConfig_1.CurdColumnConfig, { columns: orderedColumns, innerVisible: innerVisible.current, setInnerVisible: setInnerVisible, setInnerOrder: setInnerOrder })] })] }), (0, jsx_runtime_1.jsx)("div", { className: curd_style_1.classes.card, children: (0, jsx_runtime_1.jsx)(dataGrid_1.DataGrid, { ...dataGridProps, columns: actualColumns, tableProps: {
                         ...props.tableProps,

package/dist/cjs/components/curd/curd.style.js

@@ -4,6 +4,7 @@ exports.dialogStyle = exports.style = exports.classes = void 0;
 const react_1 = require("@emotion/react");
 const utils_1 = require("../../utils");
 const button_style_1 = require("../button/button.style");
+const loading_style_1 = require("../loading/loading.style");
 exports.classes = (0, utils_1.defineInnerClasses)('curd', [
     'filter',
     'filterGridContainer',
@@ -76,6 +77,10 @@ exports.style = (0, utils_1.defineCss)(({ spacing, text, background, borderRadiu
     .${exports.classes.card} {
         min-height: 0;
         border-radius: ${borderRadius}px;
+
+        .${loading_style_1.classes.container} {
+            height: 100%;
+        }
     }
 
     &[data-variant=standard] {

package/dist/cjs/components/curd/curdColumnConfig.js

@@ -12,9 +12,10 @@ const sortableItem_1 = require("../sortableItem");
 const core_1 = require("@dnd-kit/core");
 const sortable_1 = require("@dnd-kit/sortable");
 const utils_1 = require("../../utils");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faGear_1 = require("@fortawesome/free-solid-svg-icons/faGear");
-exports.CurdColumnConfig = (0, react_1.memo)(({ columns = [], innerVisible, setInnerVisible, setInnerOrder, }) => {
+exports.CurdColumnConfig = (0, react_1.memo)(({ columns, innerVisible, setInnerVisible, setInnerOrder, }) => {
+    columns ||= [];
     const dragEndHandler = (e) => {
         const newColumns = (0, utils_1.onDndDragEnd)(e, columns, '_key');
         newColumns && setInnerOrder(newColumns.flatMap(col => col._key ?? []));
@@ -27,5 +28,5 @@ exports.CurdColumnConfig = (0, react_1.memo)(({ columns = [], innerVisible, setI
             ? [...o, key]
             : o.filter(k => k !== key));
     };
-    return ((0, jsx_runtime_1.jsx)(bubble_1.Bubble, { css: curdColumnConfig_style_1.style, placement: "bottomRight", content: (0, jsx_runtime_1.jsx)(core_1.DndContext, { sensors: (0, utils_1.useDndSensors)(), onDragEnd: dragEndHandler, children: (0, jsx_runtime_1.jsx)(sortable_1.SortableContext, { items: columns?.map((col, i) => col._key ?? i), children: (0, jsx_runtime_1.jsxs)("div", { className: curdColumnConfig_style_1.classes.content, children: [(0, jsx_runtime_1.jsx)("div", { className: curdColumnConfig_style_1.classes.title, children: "\u5217\u8BBE\u7F6E" }), columns?.map((col, i) => (0, jsx_runtime_1.jsx)(sortableItem_1.SortableItem, { id: col._key ?? i, component: menuItem_1.MenuItem, className: curdColumnConfig_style_1.classes.item, prefix: (0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { className: curdColumnConfig_style_1.classes.checkbox, checked: !(0, utils_1.isUnset)(col._key) && visibleSet.has(col._key), onChange: e => !(0, utils_1.isUnset)(col._key) && toggleVisible(col._key, e.target.checked) }), label: col.title }, col._key ?? i))] }) }) }), autoClose: false, children: (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faGear_1.faGear }) }) }));
+    return ((0, jsx_runtime_1.jsx)(bubble_1.Bubble, { css: curdColumnConfig_style_1.style, placement: "bottomRight", content: (0, jsx_runtime_1.jsx)(core_1.DndContext, { sensors: (0, utils_1.useDndSensors)(), onDragEnd: dragEndHandler, children: (0, jsx_runtime_1.jsx)(sortable_1.SortableContext, { items: columns?.map((col, i) => col._key ?? i), children: (0, jsx_runtime_1.jsxs)("div", { className: curdColumnConfig_style_1.classes.content, children: [(0, jsx_runtime_1.jsx)("div", { className: curdColumnConfig_style_1.classes.title, children: "\u5217\u8BBE\u7F6E" }), columns?.map((col, i) => (0, jsx_runtime_1.jsx)(sortableItem_1.SortableItem, { id: col._key ?? i, component: menuItem_1.MenuItem, className: curdColumnConfig_style_1.classes.item, prefix: (0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { className: curdColumnConfig_style_1.classes.checkbox, checked: !(0, utils_1.isUnset)(col._key) && visibleSet.has(col._key), onChange: e => !(0, utils_1.isUnset)(col._key) && toggleVisible(col._key, e.target.checked) }), label: col.title }, col._key ?? i))] }) }) }), autoClose: false, children: (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faGear_1.faGear }) }) }));
 });

package/dist/cjs/components/curd/curdDialog.js

@@ -12,7 +12,7 @@ const loading_1 = require("../loading");
 const button_1 = require("../button");
 const curd_style_1 = require("./curd.style");
 const pickerDialog_1 = require("../pickerDialog");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faCopy_1 = require("@fortawesome/free-regular-svg-icons/faCopy");
 exports.CurdDialog = (0, react_2.memo)(({ ref, onFinish, curdProps, ...props }) => {
     const { columns, rowToForm, copyable, titleKey, formProps, formRef, dataName = '', createName = '添加', updateName = '编辑' } = curdProps;
@@ -131,6 +131,6 @@ exports.CurdDialog = (0, react_2.memo)(({ ref, onFinish, curdProps, ...props })
     return ((0, jsx_runtime_1.jsxs)(dialog_1.Dialog, { css: curd_style_1.dialogStyle, width: 600, title: activeRow
             ? `${updateName}${dataName}${rowTitle ? ' - ' + rowTitle : ''}`
             : (0, jsx_runtime_1.jsxs)("div", { className: curd_style_1.classes.dialogTitle, children: [(0, jsx_runtime_1.jsxs)("span", { children: [createName, dataName] }), copyable &&
-                        (0, jsx_runtime_1.jsxs)(button_1.Button, { variant: "plain", prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCopy_1.faCopy }), onClick: onCopyButtonClick, children: ["\u4ECE\u5DF2\u6709", dataName || '数据', "\u590D\u5236"] })] }), ...props, open: innerOpen.current, onClose: closeHandler, onConfirm: confirmHandler, confirmLoading: innerLoading.current, children: [(0, jsx_runtime_1.jsx)(loading_1.Loading, { open: transforming.current, children: (0, jsx_runtime_1.jsx)(form_1.Form, { labelWidth: "20%", ...formProps, ref: (0, utils_1.cloneRef)(formRef, innerFormRef), onFinish: finishHandler, children: renderedFormItems }) }), copyable &&
+                        (0, jsx_runtime_1.jsxs)(button_1.Button, { variant: "plain", prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCopy_1.faCopy }), onClick: onCopyButtonClick, children: ["\u4ECE\u5DF2\u6709", dataName || '数据', "\u590D\u5236"] })] }), ...props, open: innerOpen.current, onClose: closeHandler, onConfirm: confirmHandler, confirmLoading: innerLoading.current, children: [(0, jsx_runtime_1.jsx)(loading_1.Loading, { open: transforming.current, children: (0, jsx_runtime_1.jsx)(form_1.Form, { labelWidth: "20%", ...formProps, ref: (0, utils_1.cloneRef)(formRef, innerFormRef), onFinish: finishHandler, children: renderedFormItems }) }), copyable &&
                 (0, jsx_runtime_1.jsx)(pickerDialog_1.PickerDialog, { ref: pickerDialogRef, multiple: selectMode === 'multiple', onToggle: toggleHandler, children: (0, jsx_runtime_1.jsx)(curd_1.Curd, { ...curdProps, variant: "embeded", copyable: false, creatable: false, updatable: false, deletable: false }) })] }));
 });

package/dist/cjs/components/curd/curdFilter.js

@@ -11,7 +11,7 @@ const grid_1 = require("../grid");
 const button_1 = require("../button");
 const transitionBase_1 = require("../transitionBase");
 const theme_1 = require("../theme");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faChevronDown_1 = require("@fortawesome/free-solid-svg-icons/faChevronDown");
 const faFilter_1 = require("@fortawesome/free-solid-svg-icons/faFilter");
 exports.CurdFilter = (0, react_2.memo)(({ ref, columns, expandable, showButton, renderConditions, buttonProps, onFilter, ...props }) => {
@@ -56,7 +56,7 @@ exports.CurdFilter = (0, react_2.memo)(({ ref, columns, expandable, showButton,
                                 ? (0, jsx_runtime_1.jsx)(transitionBase_1.Collapse, { className: curd_style_1.classes.filterGridContainer, in: expanded, collapsedSize: () => firstItemRef.current?.offsetHeight || 56, appear: false, children: renderedGrid })
                                 : renderedGrid, (expandable || showButton) &&
                                 (0, jsx_runtime_1.jsxs)("div", { className: curd_style_1.classes.filterControl, children: [expandable &&
-                                            (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "text", suffix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faChevronDown_1.faChevronDown, style: { rotate: expanded ? '180deg' : void 0 } }), onClick: () => setExpanded(o => !o), children: expanded ? '收起' : '展开' }), showButton &&
-                                            (0, jsx_runtime_1.jsx)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faFilter_1.faFilter }), variant: "outlined", ...buttonProps, onClick: clickHandler, children: buttonProps?.children ?? '筛选' })] })] }) }), !!renderConditions &&
+                                            (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "text", suffix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faChevronDown_1.faChevronDown, style: { rotate: expanded ? '180deg' : void 0 } }), onClick: () => setExpanded(o => !o), children: expanded ? '收起' : '展开' }), showButton &&
+                                            (0, jsx_runtime_1.jsx)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faFilter_1.faFilter }), variant: "outlined", ...buttonProps, onClick: clickHandler, children: buttonProps?.children ?? '筛选' })] })] }) }), !!renderConditions &&
                 (0, jsx_runtime_1.jsxs)("div", { className: curd_style_1.classes.filtered, children: [(0, jsx_runtime_1.jsx)("div", { className: curd_style_1.classes.filteredTitle, children: "\u5DF2\u7B5B\u9009\uFF1A" }), renderConditions(filteredConditions, formRef.current)] })] }));
 });

package/dist/cjs/components/curd/curdResizable.js

@@ -7,8 +7,8 @@ const tooltip_1 = require("../tooltip");
 const bubble_1 = require("../bubble");
 const menuItem_1 = require("../menuItem");
 const button_1 = require("../button");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faArrowsUpDown_1 = require("@fortawesome/free-solid-svg-icons/faArrowsUpDown");
 exports.CurdResizable = (0, react_1.memo)(({ innerSize, setInnerSize }) => {
-    return ((0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u8868\u683C\u5C3A\u5BF8", children: (0, jsx_runtime_1.jsx)(bubble_1.Bubble, { placement: "bottom", content: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(menuItem_1.MenuItem, { value: "small", label: "\u5C0F", selected: innerSize === 'small', onClick: () => setInnerSize('small') }), (0, jsx_runtime_1.jsx)(menuItem_1.MenuItem, { value: "medium", label: "\u4E2D", selected: innerSize === 'medium', onClick: () => setInnerSize('medium') }), (0, jsx_runtime_1.jsx)(menuItem_1.MenuItem, { value: "large", label: "\u5927", selected: innerSize === 'large', onClick: () => setInnerSize('large') })] }), children: (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faArrowsUpDown_1.faArrowsUpDown }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u8868\u683C\u5C3A\u5BF8", children: (0, jsx_runtime_1.jsx)(bubble_1.Bubble, { placement: "bottom", content: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(menuItem_1.MenuItem, { value: "small", label: "\u5C0F", selected: innerSize === 'small', onClick: () => setInnerSize('small') }), (0, jsx_runtime_1.jsx)(menuItem_1.MenuItem, { value: "medium", label: "\u4E2D", selected: innerSize === 'medium', onClick: () => setInnerSize('medium') }), (0, jsx_runtime_1.jsx)(menuItem_1.MenuItem, { value: "large", label: "\u5927", selected: innerSize === 'large', onClick: () => setInnerSize('large') })] }), children: (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faArrowsUpDown_1.faArrowsUpDown }) }) }) }));
 });

package/dist/cjs/components/dataGrid/dataGrid.js

@@ -18,7 +18,7 @@ const DataGridContext = (0, react_1.createContext)({});
 function useDataGridContext() {
     return (0, react_1.useContext)(DataGridContext);
 }
-exports.DataGrid = (0, react_1.memo)(({ columns, rows, rowProps, primaryKey = 'id', childrenKey = null, defaultOrderColumn, orderColumn, defaultOrderType = 'descend', orderType, onOrderChange, selectable, relation = 'dependent', integration = 'shallowest', allowSelectAll = true, clickRowToSelect = true, selectorProps, indent = 24, renderExpandIcon, defaultExpanded = [], expanded, onExpandedChange, paginatable = true, paginationProps = {}, renderPagination, loading, emptyPlaceholder, columnResizable = false, size, bordered, striped, tableProps, multiple, defaultValue, value, onChange, ...props }) => {
+exports.DataGrid = (0, react_1.memo)(({ columns, rows, rowProps, primaryKey = 'id', childrenKey = null, defaultOrderColumn, orderColumn, defaultOrderType = 'descend', orderType, onOrderChange, selectable, relation = 'dependent', integration = 'shallowest', allowSelectAll = true, clickRowToSelect = true, selectorProps, indent = 24, renderExpandIcon, defaultExpanded, expanded, onExpandedChange, paginatable = true, paginationProps, renderPagination, loading, emptyPlaceholder, columnResizable = false, size, bordered, striped, tableProps, multiple, defaultValue, value, onChange, ...props }) => {
     /**
      * ---------------------------------------------------------------
      * 选择行
@@ -65,7 +65,7 @@ exports.DataGrid = (0, react_1.memo)(({ columns, rows, rowProps, primaryKey = 'i
      * ---------------------------------------------------------------
      * 展开行
      */
-    const [innerExpanded, setInnerExpanded] = (0, utils_1.useControlled)(defaultExpanded, expanded);
+    const [innerExpanded, setInnerExpanded] = (0, utils_1.useControlled)(defaultExpanded || [], expanded);
     const expandedSet = (0, react_1.useMemo)(() => {
         return new Set(innerExpanded.current);
     }, [innerExpanded.current]);
@@ -83,6 +83,7 @@ exports.DataGrid = (0, react_1.memo)(({ columns, rows, rowProps, primaryKey = 'i
      * ---------------------------------------------------------------
      * 分页
      */
+    paginationProps ||= {};
     const [innerPage, setInnerPage] = (0, utils_1.useControlled)(paginationProps.defaultPage ?? 1, paginationProps.page, paginationProps.onPageChange);
     const [innerPageSize, setInnerPageSize] = (0, utils_1.useControlled)(paginationProps.defaultPageSize ?? 10, paginationProps.pageSize, paginationProps.onPageSizeChange);
     const pageChangeHandler = (page, pageSize) => {

package/dist/cjs/components/dataGrid/dataGridHead.js

@@ -9,7 +9,7 @@ const dataGrid_1 = require("./dataGrid");
 const columnResize_1 = require("./columnResize");
 const checkbox_1 = require("../checkbox");
 const utils_1 = require("../../utils");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const selectionContext_1 = require("../selectionContext");
 const tooltip_1 = require("../tooltip");
 const faCaretDown_1 = require("@fortawesome/free-solid-svg-icons/faCaretDown");
@@ -84,7 +84,7 @@ exports.DataGridHead = (0, react_2.memo)(({ flattedColumns, completedColumns, ro
                             onOrderChange?.(_key, currentOrderType === 'descend' ? 'ascend' : 'descend');
                         }
                     } }, sorter
-                    ? (0, jsx_runtime_1.jsxs)("div", { className: dataGrid_style_1.classes.sorter, children: [(0, jsx_runtime_1.jsx)("div", { className: dataGrid_style_1.classes.title, children: title }), (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCaretDown_1.faCaretDown, className: dataGrid_style_1.classes.icon })] })
+                    ? (0, jsx_runtime_1.jsxs)("div", { className: dataGrid_style_1.classes.sorter, children: [(0, jsx_runtime_1.jsx)("div", { className: dataGrid_style_1.classes.title, children: title }), (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCaretDown_1.faCaretDown, className: dataGrid_style_1.classes.icon })] })
                     : title));
                 return [
                     sortable

package/dist/cjs/components/dataGrid/dataGridRows.js

@@ -12,7 +12,7 @@ const radio_1 = require("../radio");
 const table_1 = require("../table");
 const button_1 = require("../button");
 const transitionBase_1 = require("../transitionBase");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faMinusSquare_1 = require("@fortawesome/free-regular-svg-icons/faMinusSquare");
 const faPlusSquare_1 = require("@fortawesome/free-regular-svg-icons/faPlusSquare");
 const dataGrid_style_1 = require("./dataGrid.style");
@@ -61,8 +61,8 @@ exports.DataGridRows = (0, react_2.memo)(({ rows, _level = 0 }) => {
                     ? (0, jsx_runtime_1.jsxs)("div", { className: dataGrid_style_1.classes.expandableWrap, style: { paddingLeft: _level * indent }, children: [(0, jsx_runtime_1.jsx)(button_1.Button, { variant: "text", shape: "circular", color: "text.disabled", onClick: () => toggleExpanded(trKey), style: expandable ? void 0 : { visibility: 'hidden' }, children: renderExpandIcon
                                     ? renderExpandIcon(trKey, currentExpanded, [...expandedSet])
                                     : currentExpanded
-                                        ? (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faMinusSquare_1.faMinusSquare })
-                                        : (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faPlusSquare_1.faPlusSquare }) }), renderedContent] })
+                                        ? (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faMinusSquare_1.faMinusSquare })
+                                        : (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faPlusSquare_1.faPlusSquare }) }), renderedContent] })
                     : renderedContent));
             }))
         ];

package/dist/cjs/components/dateTimePicker/dateTimePicker.js

@@ -13,7 +13,7 @@ const dayjs_1 = tslib_1.__importDefault(require("dayjs"));
 const customParseFormat_1 = tslib_1.__importDefault(require("dayjs/plugin/customParseFormat"));
 const calendar_1 = require("../calendar");
 const timer_1 = require("./timer");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faCalendar_1 = require("@fortawesome/free-regular-svg-icons/faCalendar");
 const faClock_1 = require("@fortawesome/free-regular-svg-icons/faClock");
 dayjs_1.default.extend(customParseFormat_1.default);
@@ -222,6 +222,6 @@ exports.DateTimePicker = (0, react_1.memo)(({ inputProps, popperProps, min, max,
             popperProps?.onPointerDown?.(e);
             e.preventDefault();
         }, children: (0, jsx_runtime_1.jsx)(inputBase_1.InputBase, { ...props, css: dateTimePicker_style_1.style, className: (0, utils_1.clsx)(dateTimePicker_style_1.classes.root, props.className), "data-focused": innerOpen.current, value: dateValue.current, onClear: clearHandler, onSelect: selectHandler, onFocus: focusHandler, onBlur: blurHandler, onKeyDown: keydownHandler, children: ({ ref, value, onChange, ...rest }) => (0, jsx_runtime_1.jsxs)("div", { className: dateTimePicker_style_1.classes.container, children: [(0, jsx_runtime_1.jsx)("input", { ...rest, ...inputProps, ref: (0, utils_1.cloneRef)(ref, inputProps?.ref, innerInputRef), className: (0, utils_1.clsx)(dateTimePicker_style_1.classes.input, inputProps?.className) }), (0, jsx_runtime_1.jsx)("div", { className: dateTimePicker_style_1.classes.dateTimeIcon, children: showTimer && !showCalendar
-                            ? (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faClock_1.faClock })
-                            : (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCalendar_1.faCalendar }) })] }) }) }));
+                            ? (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faClock_1.faClock })
+                            : (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCalendar_1.faCalendar }) })] }) }) }));
 });

package/dist/cjs/components/dialog/dialog.js

@@ -8,7 +8,7 @@ const dialog_style_1 = require("./dialog.style");
 const utils_1 = require("../../utils");
 const button_1 = require("../button");
 const draggable_1 = require("../draggable");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faXmark_1 = require("@fortawesome/free-solid-svg-icons/faXmark");
 function Dialog({ ref, icon, title, footer, prefix, suffix, width = 420, minWidth, maxWidth = '100%', showClose = true, closeProps, showConfirm = true, confirmText = '确 定', confirmProps, onConfirm, confirmLoading = false, showCancel = true, cancelText = '取 消', cancelProps, onCancel, draggable = true, maskClosable = true, escapeClosable = true, defaultOpen = false, open, onClose, ...props }) {
     const [innerOpen, _setInnerOpen] = (0, utils_1.useControlled)(defaultOpen, open);
@@ -84,7 +84,7 @@ function Dialog({ ref, icon, title, footer, prefix, suffix, width = 420, minWidt
     return ((0, jsx_runtime_1.jsx)(modal_1.Modal, { ...props, ref: (0, utils_1.cloneRef)(ref, overlayRef), css: dialog_style_1.style, className: (0, utils_1.clsx)(dialog_style_1.classes.root, props.className), open: innerOpen.current, onMaskClick: onMaskClick, "data-draggable": draggable, children: (0, jsx_runtime_1.jsx)(draggable_1.Draggable, { container: () => overlayRef.current, children: (targetProps, handleProps) => (0, jsx_runtime_1.jsxs)("div", { className: dialog_style_1.classes.card, ...targetProps, style: { width, minWidth, maxWidth, ...targetProps.style }, children: [!!icon &&
                         (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.icon, children: icon }), (0, jsx_runtime_1.jsxs)("div", { className: dialog_style_1.classes.content, children: [!!(title || showClose) &&
                                 (0, jsx_runtime_1.jsxs)("div", { className: dialog_style_1.classes.titleRow, ...handleProps, children: [(0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.title, children: title }), showClose &&
-                                            (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", ...closeProps, className: (0, utils_1.clsx)(dialog_style_1.classes.close, closeProps?.className), onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faXmark_1.faXmark }) })] }), (0, jsx_runtime_1.jsxs)("div", { ref: bodyRef, className: dialog_style_1.classes.body, onScroll: onScroll, children: [!!prefix &&
+                                            (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", ...closeProps, className: (0, utils_1.clsx)(dialog_style_1.classes.close, closeProps?.className), onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faXmark_1.faXmark }) })] }), (0, jsx_runtime_1.jsxs)("div", { ref: bodyRef, className: dialog_style_1.classes.body, onScroll: onScroll, children: [!!prefix &&
                                         (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.prefix, children: prefix }), (0, jsx_runtime_1.jsx)("div", { ref: bodyWrapRef, className: dialog_style_1.classes.bodyWrap, children: props.children }), !!suffix &&
                                         (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.suffix, children: suffix })] }), (typeof footer === 'undefined' || !!footer) &&
                                 (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.footer, children: renderFooter() })] })] }) }) }));

package/dist/cjs/components/drawer/drawer.js

@@ -8,7 +8,7 @@ const utils_1 = require("../../utils");
 const overlayBase_1 = require("../overlayBase");
 const button_1 = require("../button");
 const transitionBase_1 = require("../transitionBase");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faAnglesRight_1 = require("@fortawesome/free-solid-svg-icons/faAnglesRight");
 const placementToDirection = {
     left: 'right',
@@ -51,7 +51,7 @@ function Drawer({ title, footer, showClose = true, size = { xs: '100%', sm: '75%
     }, [innerOpen.current]);
     return ((0, jsx_runtime_1.jsx)(overlayBase_1.OverlayBase, { ...props, css: (0, drawer_style_1.useStyle)({ size: typeof size === 'object' ? size : { xs: size } }), className: (0, utils_1.clsx)(drawer_style_1.classes.root, props.className), open: innerOpen.current, onMaskClick: onMaskClick, "data-placement": placement, children: (0, jsx_runtime_1.jsx)(transitionBase_1.Slide, { direction: placementToDirection[placement], ...slideProps, in: innerOpen.current, className: (0, utils_1.clsx)(drawer_style_1.classes.drawer, slideProps?.className), children: (0, jsx_runtime_1.jsxs)("div", { className: drawer_style_1.classes.drawerWrap, children: [!!(title || showClose) &&
                         (0, jsx_runtime_1.jsxs)("div", { className: drawer_style_1.classes.titleRow, children: [(0, jsx_runtime_1.jsx)("div", { className: drawer_style_1.classes.title, children: title }), showClose &&
-                                    (0, jsx_runtime_1.jsx)(button_1.Button, { className: drawer_style_1.classes.close, shape: "circular", variant: "text", color: "text.secondary", onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAnglesRight_1.faAnglesRight, style: {
+                                    (0, jsx_runtime_1.jsx)(button_1.Button, { className: drawer_style_1.classes.close, shape: "circular", variant: "text", color: "text.secondary", onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faAnglesRight_1.faAnglesRight, style: {
                                                 rotate: {
                                                     left: '180deg',
                                                     right: '0',