@canlooks/can-ui 0.0.68 → 0.0.69

package/dist/cjs/components/palette/palette.js

@@ -11,7 +11,7 @@ const slider_1 = require("../slider");
 const color_1 = tslib_1.__importDefault(require("color"));
 const button_1 = require("../button");
 const colorValueInput_1 = require("./colorValueInput");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faChevronDown_1 = require("@fortawesome/free-solid-svg-icons/faChevronDown");
 const sliderProps = {
     railSize: 9,
@@ -114,5 +114,5 @@ exports.Palette = (0, react_1.memo)(({ defaultValue, value, onChange, gestureOpt
                         }, ...draggableHandles })] }), (0, jsx_runtime_1.jsxs)("div", { className: palette_style_1.classes.slidersRow, children: [(0, jsx_runtime_1.jsxs)("div", { className: palette_style_1.classes.sliders, children: [(0, jsx_runtime_1.jsx)(slider_1.Slider, { ...sliderProps, className: palette_style_1.classes.hue, value: colorObject.hue / 359 * 100, onChange: hueChangeHandler }), (0, jsx_runtime_1.jsx)(slider_1.Slider, { ...sliderProps, className: palette_style_1.classes.alpha, renderRail: (_, railProps) => (0, jsx_runtime_1.jsxs)("div", { ...railProps, children: [railProps.children, (0, jsx_runtime_1.jsx)("div", { className: palette_style_1.classes.alphaMask, style: { backgroundImage: `linear-gradient(90deg, transparent, ${colorObject.saturated})` } })] }), value: colorObject.alpha * 100, onChange: alphaChangeHandler })] }), (0, jsx_runtime_1.jsx)("div", { className: palette_style_1.classes.preview, children: (0, jsx_runtime_1.jsx)("div", { className: palette_style_1.classes.previewColor, style: {
                                 backgroundColor: colorObject.hex,
                                 opacity: colorObject.alpha
-                            } }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: palette_style_1.classes.inputRow, children: [(0, jsx_runtime_1.jsx)(button_1.Button, { variant: "plain", color: "text.secondary", suffix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faChevronDown_1.faChevronDown }), onClick: formatChangeHandler, children: availableFormat[activeFormat] }), renderInputs()] })] }));
+                            } }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: palette_style_1.classes.inputRow, children: [(0, jsx_runtime_1.jsx)(button_1.Button, { variant: "plain", color: "text.secondary", suffix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faChevronDown_1.faChevronDown }), onClick: formatChangeHandler, children: availableFormat[activeFormat] }), renderInputs()] })] }));
 });

package/dist/cjs/components/pickerDialog/pickerDialog.js

@@ -10,7 +10,7 @@ const selectionContext_1 = require("../selectionContext");
 const divider_1 = require("../divider");
 const selectedList_1 = require("../selectedList");
 const button_1 = require("../button");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faTrashCan_1 = require("@fortawesome/free-regular-svg-icons/faTrashCan");
 exports.PickerDialog = (({ ref, dialogRef, multiple, children, showSelectedList = !!multiple, selectedListPlacement = 'right', selectedListProps, selectedItemProps, onConfirm, rows, nodes, 
 // 以下属性从SelectionContextBaseProps继承
@@ -70,6 +70,6 @@ options = rows ?? nodes, primaryKey = 'id', childrenKey = 'children', relation =
                 ...props.modalProps
             }, ...showSelectedList && {
                 [selectedListPlacement === 'left' ? 'prefix' : 'suffix']: ((0, jsx_runtime_1.jsxs)("div", { className: pickerDialog_style_1.classes.selectedArea, children: [(0, jsx_runtime_1.jsxs)(divider_1.Divider, { className: pickerDialog_style_1.classes.count, textAlign: "start", children: [(0, jsx_runtime_1.jsxs)("div", { children: ["\u5DF2\u9009\u62E9", (0, jsx_runtime_1.jsx)("b", { children: selectedCount }), "\u9879"] }), clearable &&
-                                    (0, jsx_runtime_1.jsx)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faTrashCan_1.faTrashCan }), variant: "plain", color: "text.secondary", onClick: () => setInnerValue(multiple ? [] : null), children: "\u6E05\u7A7A" })] }), (0, jsx_runtime_1.jsx)(selectedList_1.SelectedList, { itemProps: selectedItemProps, ...selectedListProps, className: (0, utils_1.clsx)(pickerDialog_style_1.classes.list, selectedListProps?.className) }), (0, jsx_runtime_1.jsx)(button_1.Button, { className: pickerDialog_style_1.classes.confirm, disabled: selectedCount === 0, onClick: () => confirmHandler(), children: "\u786E\u5B9A" })] }))
+                                    (0, jsx_runtime_1.jsx)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faTrashCan_1.faTrashCan }), variant: "plain", color: "text.secondary", onClick: () => setInnerValue(multiple ? [] : null), children: "\u6E05\u7A7A" })] }), (0, jsx_runtime_1.jsx)(selectedList_1.SelectedList, { itemProps: selectedItemProps, ...selectedListProps, className: (0, utils_1.clsx)(pickerDialog_style_1.classes.list, selectedListProps?.className) }), (0, jsx_runtime_1.jsx)(button_1.Button, { className: pickerDialog_style_1.classes.confirm, disabled: selectedCount === 0, onClick: () => confirmHandler(), children: "\u786E\u5B9A" })] }))
             }, children: renderChildren() }) }));
 });

package/dist/cjs/components/pinchable/pinchable.js

@@ -143,6 +143,12 @@ exports.Pinchable = (({ component: Component = 'div', ref, gestureOptions, defau
             resetZoom();
         }
     };
+    const wheelHandler = (e) => {
+        childrenProps.onMouseWheel?.(e);
+        e.deltaY > 0
+            ? zoomFn(innerScale.current * .8, e.clientX, e.clientY)
+            : zoomFn(innerScale.current * 1.2, e.clientX, e.clientY);
+    };
     return ((0, jsx_runtime_1.jsx)(Component, { ...props, ref: wrapperRef, css: pinchable_style_1.style, className: (0, utils_1.clsx)(pinchable_style_1.classes.root, props.className), ...pinchableHandles, children: (0, react_1.cloneElement)(children, {
             ref: (0, utils_1.cloneRef)(contentRef, childrenProps.ref),
             className: (0, utils_1.clsx)(pinchable_style_1.classes.content, childrenProps.className),
@@ -155,6 +161,7 @@ exports.Pinchable = (({ component: Component = 'div', ref, gestureOptions, defau
             },
             ...draggableHandles,
             onDoubleClick: doubleClickHandler,
+            onWheel: wheelHandler,
             onTransitionEnd: e => e.currentTarget.dataset.transition = 'false'
         }) }));
 });

package/dist/cjs/components/progress/progress.js

@@ -7,7 +7,7 @@ const progress_style_1 = require("./progress.style");
 const utils_1 = require("../../utils");
 const theme_1 = require("../theme");
 const react_2 = require("@emotion/react");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faCircleCheck_1 = require("@fortawesome/free-solid-svg-icons/faCircleCheck");
 const faCircleXmark_1 = require("@fortawesome/free-solid-svg-icons/faCircleXmark");
 exports.Progress = (0, react_1.memo)(({ showInfo = true, renderInfo, color, status = 'default', variant = 'linear', gapDegree = 90, size = 60, indeterminate = false, barWidth = 4, strokeLinecap = variant === 'gauge' ? 'butt' : 'round', value = 0, ...props }) => {
@@ -20,10 +20,10 @@ exports.Progress = (0, react_1.memo)(({ showInfo = true, renderInfo, color, stat
             return renderInfo(value);
         }
         if (isSucceed) {
-            return (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCircleCheck_1.faCircleCheck, className: progress_style_1.classes.icon, style: { color: success.main } });
+            return (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCircleCheck_1.faCircleCheck, className: progress_style_1.classes.icon, style: { color: success.main } });
         }
         if (status === 'error') {
-            return (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCircleXmark_1.faCircleXmark, className: progress_style_1.classes.icon, style: { color: error.main } });
+            return (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCircleXmark_1.faCircleXmark, className: progress_style_1.classes.icon, style: { color: error.main } });
         }
         return value + '%';
     };

package/dist/cjs/components/rating/rating.js

@@ -6,9 +6,9 @@ const react_1 = require("react");
 const utils_1 = require("../../utils");
 const rating_style_1 = require("./rating.style");
 const theme_1 = require("../theme");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faStar_1 = require("@fortawesome/free-solid-svg-icons/faStar");
-exports.Rating = (0, react_1.memo)(({ color = '#FFCC00', size, count = 5, renderStar = (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faStar_1.faStar }), allowHalf, highlightSelectedOnly = false, defaultValue = 0, value, onChange, readOnly, disabled, ...props }) => {
+exports.Rating = (0, react_1.memo)(({ color = '#FFCC00', size, count = 5, renderStar = (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faStar_1.faStar }), allowHalf, highlightSelectedOnly = false, defaultValue = 0, value, onChange, readOnly, disabled, ...props }) => {
     const theme = (0, theme_1.useTheme)();
     size ??= theme.size;
     const [innerValue, setInnerValue] = (0, utils_1.useControlled)(defaultValue, value, onChange);

package/dist/cjs/components/select/select.js

@@ -14,7 +14,7 @@ const input_1 = require("../input");
 const loadingIndicator_1 = require("../loadingIndicator");
 const popper_style_1 = require("../popper/popper.style");
 const selectionContext_1 = require("../selectionContext");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faChevronDown_1 = require("@fortawesome/free-solid-svg-icons/faChevronDown");
 const faMagnifyingGlass_1 = require("@fortawesome/free-solid-svg-icons/faMagnifyingGlass");
 exports.Select = (0, react_1.memo)(({ inputProps, popperProps, popperRef, defaultOpen = false, open, onOpenChange, sizeAdaptable = true, children, multiple, defaultValue, value, onChange, renderBackfill, searchable, defaultSearchValue = '', searchValue, onSearchChange, searchInputProps, 
@@ -82,7 +82,7 @@ showCheckbox = !!multiple, loading, options, labelKey = 'label', primaryKey = 'v
         return ((0, jsx_runtime_1.jsx)("div", { className: select_style_1.classes.backfillWrap, children: optionsMap.get(innerValue)?.[labelKey] ?? innerValue }));
     };
     return ((0, jsx_runtime_1.jsx)(popper_1.Popper, { css: popper_style_1.popperStyle, open: innerOpen.current, onOpenChange: openChangeHandler, onOpenChangeEnd: openChangeEnd, placement: "bottom", variant: "collapse", trigger: ['click', 'enter'], disabled: props.disabled || props.readOnly, sizeAdaptable: sizeAdaptable, content: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [searchable &&
-                    (0, jsx_runtime_1.jsx)(input_1.Input, { inputProps: { ref: searchInputRef }, prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faMagnifyingGlass_1.faMagnifyingGlass }), placeholder: "\u641C\u7D22", value: innerSearchValue.current, ...searchInputProps, onChange: e => {
+                    (0, jsx_runtime_1.jsx)(input_1.Input, { inputProps: { ref: searchInputRef }, prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faMagnifyingGlass_1.faMagnifyingGlass }), placeholder: "\u641C\u7D22", value: innerSearchValue.current, ...searchInputProps, onChange: e => {
                             searchInputProps?.onChange?.(e);
                             setInnerSearchValue?.(e.target.value);
                         }, onBlur: e => {
@@ -95,6 +95,6 @@ showCheckbox = !!multiple, loading, options, labelKey = 'label', primaryKey = 'v
                         ? (0, jsx_runtime_1.jsx)("div", { className: select_style_1.classes.placeholder, children: props.placeholder ?? '请选择' })
                         : (0, jsx_runtime_1.jsx)("div", { className: select_style_1.classes.backfill, children: renderBackfillFn() }), (0, jsx_runtime_1.jsx)("input", { size: 1, ...inputBaseProps, ...inputProps, "data-hidden": "true" }), (0, jsx_runtime_1.jsx)("div", { className: select_style_1.classes.arrow, "data-open": innerOpen.current, children: loading
                             ? (0, jsx_runtime_1.jsx)(loadingIndicator_1.LoadingIndicator, {})
-                            : (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faChevronDown_1.faChevronDown }) })] }) }) }));
+                            : (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faChevronDown_1.faChevronDown }) })] }) }) }));
 });
 exports.Option = exports.Select.Option = menuItem_1.MenuItem;

package/dist/cjs/components/snackbarBase/snackbarBase.js

@@ -11,7 +11,7 @@ const react_transition_group_1 = require("react-transition-group");
 const status_1 = require("../status");
 const button_1 = require("../button");
 const react_dom_1 = require("react-dom");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faXmark_1 = require("@fortawesome/free-solid-svg-icons/faXmark");
 class SnackbarBaseMethods {
     async info(_) {
@@ -115,7 +115,7 @@ exports.SnackbarBaseItem = (0, react_2.memo)(({ id, type, useTo, resolve, varian
     const colorValue = (0, utils_1.useColor)(color);
     const renderedIcon = icon ?? (variant === 'outlined'
         ? (0, jsx_runtime_1.jsx)(status_1.StatusIcon, { status: type })
-        : (0, jsx_runtime_1.jsx)(__1.Icon, { icon: status_1.statusMapToIconDefinition[type] }));
+        : (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: status_1.statusMapToIconDefinition[type] }));
     const closeHandler = (e) => {
         e.stopPropagation();
         onCloseButtonClick?.(e);
@@ -128,5 +128,5 @@ exports.SnackbarBaseItem = (0, react_2.memo)(({ id, type, useTo, resolve, varian
                     (0, jsx_runtime_1.jsxs)("div", { className: snackbarBase_style_1.classes.text, children: [!!title &&
                                 (0, jsx_runtime_1.jsx)("div", { className: snackbarBase_style_1.classes.title, children: title }), !!content &&
                                 (0, jsx_runtime_1.jsx)("div", { className: snackbarBase_style_1.classes.content, children: content })] }), showClose &&
-                    (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "text", shape: "circular", color: "text.disabled", size: "small", className: snackbarBase_style_1.classes.close, onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faXmark_1.faXmark }) })] }) }));
+                    (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "text", shape: "circular", color: "text.disabled", size: "small", className: snackbarBase_style_1.classes.close, onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faXmark_1.faXmark }) })] }) }));
 });

package/dist/cjs/components/stepper/step.js

@@ -7,7 +7,7 @@ const utils_1 = require("../../utils");
 const step_style_1 = require("./step.style");
 const stepper_1 = require("./stepper");
 const theme_1 = require("../theme");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faCheck_1 = require("@fortawesome/free-solid-svg-icons/faCheck");
 const faCircleInfo_1 = require("@fortawesome/free-solid-svg-icons/faCircleInfo");
 const faXmark_1 = require("@fortawesome/free-solid-svg-icons/faXmark");
@@ -37,13 +37,13 @@ size, gap, color, variant, labelPlacement, clickable, status = 'waiting', ...pro
                                 case 'processing':
                                     return step + 1;
                                 case 'finished':
-                                    return (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCheck_1.faCheck });
+                                    return (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCheck_1.faCheck });
                                 case 'warning':
-                                    return (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCircleInfo_1.faCircleInfo });
+                                    return (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCircleInfo_1.faCircleInfo });
                                 case 'error':
-                                    return (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faXmark_1.faXmark });
+                                    return (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faXmark_1.faXmark });
                                 case 'skipped':
-                                    return (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faMinus_1.faMinus });
+                                    return (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faMinus_1.faMinus });
                             }
                         })() }) }), (0, jsx_runtime_1.jsxs)("div", { className: step_style_1.classes.label, children: [(0, jsx_runtime_1.jsx)("div", { className: step_style_1.classes.title, children: (0, jsx_runtime_1.jsx)("div", { className: step_style_1.classes.titleText, children: renderInner(title) }) }), (0, jsx_runtime_1.jsx)("div", { className: step_style_1.classes.description, children: renderInner(description) })] })] }));
 });

package/dist/cjs/components/tabs/tabsEllipsis.js

@@ -7,7 +7,7 @@ const tabs_style_1 = require("./tabs.style");
 const popper_1 = require("../popper");
 const tabsEllipsis_style_1 = require("./tabsEllipsis.style");
 const optionsBase_1 = require("../optionsBase");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faEllipsis_1 = require("@fortawesome/free-solid-svg-icons/faEllipsis");
 exports.TabsEllipsis = (0, react_1.memo)(({ tabs, children, labelKey = 'label', primaryKey = 'value', value, onToggleSelected }) => {
     const [open, setOpen] = (0, react_1.useState)(false);
@@ -26,5 +26,5 @@ exports.TabsEllipsis = (0, react_1.memo)(({ tabs, children, labelKey = 'label',
         onToggleSelected(value);
         setOpen(false);
     };
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(popper_1.Popper, { css: tabsEllipsis_style_1.tabsEllipsisPopperStyle, placement: "bottomRight", trigger: "hover", open: open, onOpenChange: setOpen, content: (0, jsx_runtime_1.jsx)(optionsBase_1.OptionsBase, { options: getOptions(), selectedValue: value, onToggleSelected: _onToggleSelected }), children: (0, jsx_runtime_1.jsx)("div", { className: tabs_style_1.classes.ellipsis, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faEllipsis_1.faEllipsis }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(popper_1.Popper, { css: tabsEllipsis_style_1.tabsEllipsisPopperStyle, placement: "bottomRight", trigger: "hover", open: open, onOpenChange: setOpen, content: (0, jsx_runtime_1.jsx)(optionsBase_1.OptionsBase, { options: getOptions(), selectedValue: value, onToggleSelected: _onToggleSelected }), children: (0, jsx_runtime_1.jsx)("div", { className: tabs_style_1.classes.ellipsis, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faEllipsis_1.faEllipsis }) }) }) }));
 });

package/dist/cjs/components/tag/tag.js

@@ -5,7 +5,7 @@ const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const react_1 = require("react");
 const tag_style_1 = require("./tag.style");
 const utils_1 = require("../../utils");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faXmark_1 = require("@fortawesome/free-solid-svg-icons/faXmark");
 exports.Tag = (0, react_1.memo)(({ variant = 'outlined', color = 'text.secondary', shape = 'square', size = 'small', prefix, suffix, clickable, closable, onClose, ...props }) => {
     const closeHandler = (e) => {
@@ -16,5 +16,5 @@ exports.Tag = (0, react_1.memo)(({ variant = 'outlined', color = 'text.secondary
     return ((0, jsx_runtime_1.jsxs)("div", { ...props, css: (0, tag_style_1.useStyle)({ color: color || 'text.secondary' }), className: (0, utils_1.clsx)(tag_style_1.classes.root, props.className), "data-variant": variant, "data-size": size, "data-shape": shape, "data-clickable": clickable, children: [!!prefix &&
                 (0, jsx_runtime_1.jsx)("div", { className: tag_style_1.classes.prefix, children: prefix }), (0, jsx_runtime_1.jsx)("div", { className: tag_style_1.classes.content, children: props.children }), !!suffix &&
                 (0, jsx_runtime_1.jsx)("div", { className: tag_style_1.classes.suffix, children: suffix }), closable &&
-                (0, jsx_runtime_1.jsx)("div", { className: tag_style_1.classes.close, onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faXmark_1.faXmark }) })] }));
+                (0, jsx_runtime_1.jsx)("div", { className: tag_style_1.classes.close, onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faXmark_1.faXmark }) })] }));
 });

package/dist/cjs/components/transfer/transfer.js

@@ -8,7 +8,7 @@ const transfer_style_1 = require("./transfer.style");
 const utils_1 = require("../../utils");
 const button_1 = require("../button");
 const transferPanel_1 = require("./transferPanel");
-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");
 const TransferContext = (0, react_1.createContext)({});
@@ -34,12 +34,12 @@ exports.Transfer = (0, react_1.memo)(({ options, primaryKey = 'value', fullWidth
             {
                 disabled: !leftSelected.length,
                 onClick: toRight,
-                children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAngleRight_1.faAngleRight })
+                children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faAngleRight_1.faAngleRight })
             },
             {
                 disabled: !rightSelected.length,
                 onClick: toLeft,
-                children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAngleLeft_1.faAngleLeft })
+                children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faAngleLeft_1.faAngleLeft })
             }
         ];
         if (renderButtons) {

package/dist/cjs/components/tree/tree.js

@@ -12,7 +12,7 @@ const utils_1 = require("../../utils");
 const highlight_1 = require("../highlight");
 const placeholder_1 = require("../placeholder");
 const treeNode_1 = require("./treeNode");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faMagnifyingGlass_1 = require("@fortawesome/free-solid-svg-icons/faMagnifyingGlass");
 const TreeContext = (0, react_2.createContext)({});
 function useTreeContext() {
@@ -57,7 +57,7 @@ primaryKey = 'value', childrenKey = 'children', relation = 'dependent', integrat
         defaultSearchValue, searchValue, onSearchChange
     });
     return ((0, jsx_runtime_1.jsxs)("div", { ...props, css: tree_style_1.style, className: (0, utils_1.clsx)(tree_style_1.classes.root, props.className), "data-show-line": showLine, children: [searchable &&
-                (0, jsx_runtime_1.jsx)(input_1.Input, { className: tree_style_1.classes.search, prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faMagnifyingGlass_1.faMagnifyingGlass }), placeholder: "\u641C\u7D22", value: innerSearchValue.current, ...searchInputProps, onChange: e => {
+                (0, jsx_runtime_1.jsx)(input_1.Input, { className: tree_style_1.classes.search, prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faMagnifyingGlass_1.faMagnifyingGlass }), placeholder: "\u641C\u7D22", value: innerSearchValue.current, ...searchInputProps, onChange: e => {
                         searchInputProps?.onChange?.(e);
                         setInnerSearchValue(e.target.value);
                     } }), (0, jsx_runtime_1.jsx)(selectionContext_1.SelectionContext, { ...selectionContextProps, children: (0, jsx_runtime_1.jsx)(TreeContext, { value: (0, react_2.useMemo)(() => ({

package/dist/cjs/components/tree/treeNode.js

@@ -10,7 +10,7 @@ const button_1 = require("../button");
 const checkbox_1 = require("../checkbox");
 const tree_1 = require("./tree");
 const selectionContext_1 = require("../selectionContext");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faChevronRight_1 = require("@fortawesome/free-solid-svg-icons/faChevronRight");
 exports.TreeNode = (0, react_1.memo)(({ value, label, prefix, suffix, disabled, _level = 0, ...props }) => {
     const { expandedSet = new Set(), toggleExpanded, indent, renderExpandIcon, showCheckbox, readOnly, clickLabelToExpand, ...context } = (0, tree_1.useTreeContext)();
@@ -29,7 +29,7 @@ exports.TreeNode = (0, react_1.memo)(({ value, label, prefix, suffix, disabled,
                         }, children: renderExpandIcon
                             ? renderExpandIcon(value, !!currentExpanded, [...expandedSet])
                             : hasChildren &&
-                                (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faChevronRight_1.faChevronRight, className: tree_style_1.classes.icon, style: {
+                                (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faChevronRight_1.faChevronRight, className: tree_style_1.classes.icon, style: {
                                         rotate: currentExpanded ? '90deg' : '0deg'
                                     } }) }), showCheckbox &&
                         (0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { className: tree_style_1.classes.checkbox, checked: status === 2, indeterminate: status === 1, onClick: e => {

package/dist/cjs/components/treeSelect/treeSelect.js

@@ -12,7 +12,7 @@ const popper_style_1 = require("../popper/popper.style");
 const tag_1 = require("../tag");
 const treeSelect_style_1 = require("./treeSelect.style");
 const selectionContext_1 = require("../selectionContext");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faChevronDown_1 = require("@fortawesome/free-solid-svg-icons/faChevronDown");
 exports.TreeSelect = (0, react_1.memo)(({ inputProps, popperProps, popperRef, nodes, options, defaultValue, value, onChange, sizeAdaptable, loading, defaultOpen, open, onOpenChange, renderBackfill, 
 // 以下属性转发至<InputBase/>
@@ -78,6 +78,6 @@ placeholder = '请选择', autoFocus, clearable, onClear, ...props }) => {
                         ? (0, jsx_runtime_1.jsx)("div", { className: treeSelect_style_1.classes.placeholder, children: placeholder })
                         : (0, jsx_runtime_1.jsx)("div", { className: treeSelect_style_1.classes.backfill, children: renderBackfillFn() }), (0, jsx_runtime_1.jsx)("input", { size: 1, ...rest, ...inputProps, ref: (0, utils_1.cloneRef)(ref, inputProps?.ref), "data-hidden": "true" }), (0, jsx_runtime_1.jsx)("div", { className: treeSelect_style_1.classes.arrow, "data-open": open, children: loading
                             ? (0, jsx_runtime_1.jsx)(loadingIndicator_1.LoadingIndicator, {})
-                            : (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faChevronDown_1.faChevronDown }) })] }) }) }));
+                            : (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faChevronDown_1.faChevronDown }) })] }) }) }));
 });
 exports.TreeSelect.Option = exports.TreeSelect.Node = tree_1.TreeNode;

package/dist/cjs/components/typography/typography.js

@@ -9,7 +9,7 @@ const button_1 = require("../button");
 const tooltip_1 = require("../tooltip");
 const input_1 = require("../input");
 const textarea_1 = require("../textarea");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faCheck_1 = require("@fortawesome/free-solid-svg-icons/faCheck");
 const faCopy_1 = require("@fortawesome/free-regular-svg-icons/faCopy");
 const faPenToSquare_1 = require("@fortawesome/free-regular-svg-icons/faPenToSquare");
@@ -76,9 +76,9 @@ exports.Typography = (0, react_1.memo)(({ component: Component = 'p', color = 't
                         }, children: props.children })
                     : props.children, !expanded && expandable && ellipsisRows > 0 &&
                     (0, jsx_runtime_1.jsx)(button_1.Button, { ...expandButtonProps, className: (0, utils_1.clsx)(typography_style_1.classes.expand, typography_style_1.classes.action, expandButtonProps?.className), variant: "plain", onClick: () => setExpanded(true), children: "\u5C55\u5F00" }), editable &&
-                    (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u7F16\u8F91", children: (0, jsx_runtime_1.jsx)(button_1.Button, { className: typography_style_1.classes.action, variant: "plain", onClick: editHandler, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faPenToSquare_1.faPenToSquare }) }) }), copyable && (copied
-                    ? (0, jsx_runtime_1.jsx)("div", { className: typography_style_1.classes.copied, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCheck_1.faCheck }) })
-                    : (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u590D\u5236", children: (0, jsx_runtime_1.jsx)(button_1.Button, { className: typography_style_1.classes.action, variant: "plain", onClick: copyHandler, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCopy_1.faCopy }) }) }))] });
+                    (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u7F16\u8F91", children: (0, jsx_runtime_1.jsx)(button_1.Button, { className: typography_style_1.classes.action, variant: "plain", onClick: editHandler, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faPenToSquare_1.faPenToSquare }) }) }), copyable && (copied
+                    ? (0, jsx_runtime_1.jsx)("div", { className: typography_style_1.classes.copied, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCheck_1.faCheck }) })
+                    : (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u590D\u5236", children: (0, jsx_runtime_1.jsx)(button_1.Button, { className: typography_style_1.classes.action, variant: "plain", onClick: copyHandler, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCopy_1.faCopy }) }) }))] });
 });
 exports.Typography.div = (0, react_1.memo)((props) => (0, jsx_runtime_1.jsx)(exports.Typography, { ...props, component: "div" }));
 exports.Typography.h1 = (0, react_1.memo)((props) => (0, jsx_runtime_1.jsx)(exports.Typography, { ...props, component: "h1" }));

package/dist/cjs/components/upload/dropArea.js

@@ -5,7 +5,7 @@ const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const react_1 = require("react");
 const dropArea_style_1 = require("./dropArea.style");
 const utils_1 = require("../../utils");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faInbox_1 = require("@fortawesome/free-solid-svg-icons/faInbox");
 exports.DropArea = (0, react_1.memo)(({ description = '点击选择文件，或将文件拖拽到这里', onDrop, ...props }) => {
     const [draggingOver, setDraggingOver] = (0, react_1.useState)(false);
@@ -33,5 +33,5 @@ exports.DropArea = (0, react_1.memo)(({ description = '点击选择文件，或
         }, onDragLeave: e => {
             props.onDragLeave?.(e);
             setDraggingOver(false);
-        }, onDrop: dropHandler, children: [(0, jsx_runtime_1.jsx)(__1.Icon, { icon: faInbox_1.faInbox, className: dropArea_style_1.classes.icon }), (0, jsx_runtime_1.jsx)("div", { className: dropArea_style_1.classes.description, children: description })] }));
+        }, onDrop: dropHandler, children: [(0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faInbox_1.faInbox, className: dropArea_style_1.classes.icon }), (0, jsx_runtime_1.jsx)("div", { className: dropArea_style_1.classes.description, children: description })] }));
 });

package/dist/cjs/components/upload/fileItem.js

@@ -9,7 +9,7 @@ const button_1 = require("../button");
 const progress_1 = require("../progress");
 const theme_1 = require("../theme");
 const itemStatus_1 = require("./itemStatus");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faCircleCheck_1 = require("@fortawesome/free-solid-svg-icons/faCircleCheck");
 const faCircleXmark_1 = require("@fortawesome/free-solid-svg-icons/faCircleXmark");
 const faXmark_1 = require("@fortawesome/free-solid-svg-icons/faXmark");
@@ -18,11 +18,11 @@ exports.FileItem = (0, react_1.memo)((props) => {
     const { status, progress } = (0, itemStatus_1.useItemStatus)(props);
     const { colors } = (0, theme_1.useTheme)();
     const statusToIcon = {
-        'default': (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faPaperclip_1.faPaperclip }),
+        'default': (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faPaperclip_1.faPaperclip }),
         uploading: (0, jsx_runtime_1.jsx)(loadingIndicator_1.LoadingIndicator, {}),
-        success: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCircleCheck_1.faCircleCheck, style: { color: colors.success.main } }),
-        error: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCircleXmark_1.faCircleXmark, style: { color: colors.error.main } })
+        success: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCircleCheck_1.faCircleCheck, style: { color: colors.success.main } }),
+        error: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faCircleXmark_1.faCircleXmark, style: { color: colors.error.main } })
     };
     return ((0, jsx_runtime_1.jsxs)("div", { className: upload_style_1.classes.file, "data-status": status, children: [(0, jsx_runtime_1.jsx)("div", { className: upload_style_1.classes.icon, children: statusToIcon[status] }), (0, jsx_runtime_1.jsxs)("div", { className: upload_style_1.classes.info, children: [(0, jsx_runtime_1.jsx)("div", { className: upload_style_1.classes.name, children: props.file.name }), status !== 'default' &&
-                        (0, jsx_runtime_1.jsx)(progress_1.Progress, { className: upload_style_1.classes.progress, barWidth: 2, showInfo: false, value: progress, status: status === 'uploading' ? 'processing' : status })] }), (0, jsx_runtime_1.jsx)("div", { className: upload_style_1.classes.control, children: (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "plain", color: "error", onClick: props.onRemove, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faXmark_1.faXmark }) }) })] }));
+                        (0, jsx_runtime_1.jsx)(progress_1.Progress, { className: upload_style_1.classes.progress, barWidth: 2, showInfo: false, value: progress, status: status === 'uploading' ? 'processing' : status })] }), (0, jsx_runtime_1.jsx)("div", { className: upload_style_1.classes.control, children: (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "plain", color: "error", onClick: props.onRemove, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faXmark_1.faXmark }) }) })] }));
 });

package/dist/cjs/components/upload/imageItem.js

@@ -9,7 +9,7 @@ const image_1 = require("../image");
 const button_1 = require("../button");
 const progress_1 = require("../progress");
 const utils_1 = require("../../utils");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faTrashCan_1 = require("@fortawesome/free-regular-svg-icons/faTrashCan");
 const faEye_1 = require("@fortawesome/free-regular-svg-icons/faEye");
 exports.ImageItem = (0, react_1.memo)((props) => {
@@ -19,8 +19,8 @@ exports.ImageItem = (0, react_1.memo)((props) => {
                 open: previewOpen,
                 onOpenChange: setPreviewOpen
             }, actions: [
-                (0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", variant: "text", shape: "circular", color: "text.secondary", onClick: () => setPreviewOpen(true), children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faEye_1.faEye }) }, "preview"),
-                (0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", variant: "text", shape: "circular", color: "error", onClick: props.onRemove, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faTrashCan_1.faTrashCan }) }, "delete")
+                (0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", variant: "text", shape: "circular", color: "text.secondary", onClick: () => setPreviewOpen(true), children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faEye_1.faEye }) }, "preview"),
+                (0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", variant: "text", shape: "circular", color: "error", onClick: props.onRemove, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faTrashCan_1.faTrashCan }) }, "delete")
             ], children: status !== 'default' &&
                 (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.clsx)(upload_style_1.classes.progress), children: (0, jsx_runtime_1.jsx)(progress_1.Progress, { variant: "circular", showInfo: status !== 'uploading', value: progress, status: status === 'uploading' ? 'processing' : status }) }) }) }));
 });

package/dist/cjs/components/upload/upload.js

@@ -14,7 +14,7 @@ const core_1 = require("@dnd-kit/core");
 const sortable_1 = require("@dnd-kit/sortable");
 const sortableItem_1 = require("../sortableItem");
 const dropArea_1 = require("./dropArea");
-const __1 = require("../..");
+const icon_1 = require("../icon");
 const faPlus_1 = require("@fortawesome/free-solid-svg-icons/faPlus");
 const faUpload_1 = require("@fortawesome/free-solid-svg-icons/faUpload");
 const markFileId = (files) => {
@@ -99,12 +99,12 @@ exports.Upload = (0, react_1.memo)(({ inputProps, type = 'file', accept = type =
                         ? (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [droppable
                                     ? (0, jsx_runtime_1.jsx)(dropArea_1.DropArea, { onClick: () => innerInputRef.current.click(), onDrop: changeFn })
                                     : showButton &&
-                                        (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outlined", prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faUpload_1.faUpload }), ...buttonProps, onClick: buttonClick, children: buttonText }), (0, jsx_runtime_1.jsx)(react_transition_group_1.TransitionGroup, { className: upload_style_1.classes.files, children: innerValue.current.map(file => (0, jsx_runtime_1.jsx)(sortableItem_1.SortableItem, { component: transitionBase_1.Collapse, className: upload_style_1.classes.sortable, id: file.id, children: (0, jsx_runtime_1.jsx)(fileItem_1.FileItem, { ref: r => {
+                                        (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outlined", prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faUpload_1.faUpload }), ...buttonProps, onClick: buttonClick, children: buttonText }), (0, jsx_runtime_1.jsx)(react_transition_group_1.TransitionGroup, { className: upload_style_1.classes.files, children: innerValue.current.map(file => (0, jsx_runtime_1.jsx)(sortableItem_1.SortableItem, { component: transitionBase_1.Collapse, className: upload_style_1.classes.sortable, id: file.id, children: (0, jsx_runtime_1.jsx)(fileItem_1.FileItem, { ref: r => {
                                                 r
                                                     ? itemRefs.current.set(file.id, r)
                                                     : itemRefs.current.delete(file.id);
                                             }, file: file, onRemove: () => removeHandler(file.id), onUpload: onUpload }) }, file.id)) })] })
-                        : (0, jsx_runtime_1.jsxs)(react_transition_group_1.TransitionGroup, { className: upload_style_1.classes.images, children: [(0, jsx_runtime_1.jsx)(transitionBase_1.Grow, { children: (0, jsx_runtime_1.jsx)("div", { className: upload_style_1.classes.imageWrap, "data-clickable": "true", children: (0, jsx_runtime_1.jsx)("div", { className: upload_style_1.classes.image, onClick: () => innerInputRef.current.click(), children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faPlus_1.faPlus }) }) }) }), innerValue.current.map(file => (0, jsx_runtime_1.jsx)(sortableItem_1.SortableItem, { component: transitionBase_1.Collapse, className: upload_style_1.classes.sortable, id: file.id, orientation: "horizontal", children: (0, jsx_runtime_1.jsx)(imageItem_1.ImageItem, { ref: r => {
+                        : (0, jsx_runtime_1.jsxs)(react_transition_group_1.TransitionGroup, { className: upload_style_1.classes.images, children: [(0, jsx_runtime_1.jsx)(transitionBase_1.Grow, { children: (0, jsx_runtime_1.jsx)("div", { className: upload_style_1.classes.imageWrap, "data-clickable": "true", children: (0, jsx_runtime_1.jsx)("div", { className: upload_style_1.classes.image, onClick: () => innerInputRef.current.click(), children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faPlus_1.faPlus }) }) }) }), innerValue.current.map(file => (0, jsx_runtime_1.jsx)(sortableItem_1.SortableItem, { component: transitionBase_1.Collapse, className: upload_style_1.classes.sortable, id: file.id, orientation: "horizontal", children: (0, jsx_runtime_1.jsx)(imageItem_1.ImageItem, { ref: r => {
                                             r
                                                 ? itemRefs.current.set(file.id, r)
                                                 : itemRefs.current.delete(file.id);

package/dist/cjs/extensions/documentViewer/documentViewer.js

@@ -13,7 +13,8 @@ const button_1 = require("../../components/button");
 const documentViewer_style_1 = require("./documentViewer.style");
 const utils_1 = require("../../utils");
 const pdfViewer_1 = require("./pdfViewer");
-const __1 = require("../..");
+const icon_1 = require("../../components/icon");
+const gallery_1 = require("../../components/gallery");
 const faDownload_1 = require("@fortawesome/free-solid-svg-icons/faDownload");
 exports.DocumentViewer = (0, react_1.memo)(({ src, filename, onError, type, extension, setDocumentTitle = true }) => {
     const mimeType = (0, react_1.useMemo)(() => {
@@ -40,7 +41,7 @@ exports.DocumentViewer = (0, react_1.memo)(({ src, filename, onError, type, exte
             a.click();
         }
     };
-    const empty = ((0, jsx_runtime_1.jsx)(placeholder_1.Placeholder, { description: "\u8BE5\u6587\u4EF6\u6682\u4E0D\u652F\u6301\u9884\u89C8", extra: (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outlined", prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faDownload_1.faDownload }), onClick: downloadHandler, children: "\u4E0B\u8F7D" }) }));
+    const empty = ((0, jsx_runtime_1.jsx)(placeholder_1.Placeholder, { description: "\u8BE5\u6587\u4EF6\u6682\u4E0D\u652F\u6301\u9884\u89C8", extra: (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outlined", prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faDownload_1.faDownload }), onClick: downloadHandler, children: "\u4E0B\u8F7D" }) }));
     if (!mimeType) {
         return empty;
     }
@@ -64,7 +65,7 @@ exports.DocumentViewer = (0, react_1.memo)(({ src, filename, onError, type, exte
     }
     // image
     if (mimeType.includes('image/')) {
-        return (0, jsx_runtime_1.jsx)(__1.Gallery, { src: src, open: true, showClose: false });
+        return (0, jsx_runtime_1.jsx)(gallery_1.Gallery, { src: src, open: true, showClose: false });
     }
     return empty;
 });

package/dist/cjs/extensions/documentViewer/documentViewer.style.js

@@ -64,7 +64,7 @@ exports.svgStyle = (0, utils_1.defineCss)(({ spacing, background, divider, text,
         background-color: ${background.body};
         overflow: hidden;
     }
-
+    
     .${exports.classes.svgContent}, .${exports.classes.object} {
         width: 100%;
         height: 100%;
@@ -72,6 +72,7 @@ exports.svgStyle = (0, utils_1.defineCss)(({ spacing, background, divider, text,
 
     .${exports.classes.object} {
         pointer-events: none;
+        user-select: none;
         transition: rotate .4s ${easing.easeOut};
     }
 `);

package/dist/cjs/extensions/documentViewer/svgViewer.d.ts

@@ -1,13 +1,13 @@
-import { ReactZoomPanPinchProps } from 'react-zoom-pan-pinch';
 import { Theme } from '../../components/theme';
 import { LoadingProps } from '../../components/loading';
 import { DocumentViewerBaseProps } from './documentViewer';
+import { PinchableProps } from '../../components/pinchable';
 export interface SvgViewerProps extends DocumentViewerBaseProps, Omit<LoadingProps, 'onError'> {
     /** 是否显示下载按钮，默认为true */
     showDownload?: boolean;
     /** 是否可切换主题，默认为true */
     themeSwitchable?: boolean;
     onThemeChange?(mode: Theme['mode']): void;
-    transformWrapperProps?: ReactZoomPanPinchProps;
+    pinchableProps?: PinchableProps;
 }
 export declare const SvgViewer: import("react").MemoExoticComponent<(props: SvgViewerProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

package/dist/cjs/extensions/documentViewer/svgViewer.js

@@ -4,7 +4,6 @@ exports.SvgViewer = void 0;
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const react_1 = require("react");
 const documentViewer_style_1 = require("./documentViewer.style");
-const react_zoom_pan_pinch_1 = require("react-zoom-pan-pinch");
 const utils_1 = require("../../utils");
 const button_1 = require("../../components/button");
 const tooltip_1 = require("../../components/tooltip");
@@ -13,7 +12,7 @@ const switch_1 = require("../../components/switch");
 const theme_1 = require("../../components/theme");
 const loading_1 = require("../../components/loading");
 const documentViewer_1 = require("./documentViewer");
-const __1 = require("../..");
+const icon_1 = require("../../components/icon");
 const faDiagramProject_1 = require("@fortawesome/free-solid-svg-icons/faDiagramProject");
 const faDownload_1 = require("@fortawesome/free-solid-svg-icons/faDownload");
 const faExpand_1 = require("@fortawesome/free-solid-svg-icons/faExpand");
@@ -23,6 +22,7 @@ const faRotateLeft_1 = require("@fortawesome/free-solid-svg-icons/faRotateLeft")
 const faRotateRight_1 = require("@fortawesome/free-solid-svg-icons/faRotateRight");
 const faMagnifyingGlassMinus_1 = require("@fortawesome/free-solid-svg-icons/faMagnifyingGlassMinus");
 const faMagnifyingGlassPlus_1 = require("@fortawesome/free-solid-svg-icons/faMagnifyingGlassPlus");
+const pinchable_1 = require("../../components/pinchable");
 const commonButtonProps = {
     variant: 'text',
     shape: 'circular'
@@ -30,7 +30,7 @@ const commonButtonProps = {
 exports.SvgViewer = (0, react_1.memo)((props) => {
     return ((0, jsx_runtime_1.jsx)(theme_1.ThemeProvider, { children: (0, jsx_runtime_1.jsx)(SvgViewerContent, { ...props }) }));
 });
-function SvgViewerContent({ showDownload = true, themeSwitchable = true, onThemeChange, transformWrapperProps, 
+function SvgViewerContent({ showDownload = true, themeSwitchable = true, onThemeChange, pinchableProps, 
 // 从DocumentViewerBaseProps继承来的属性
 src, filename, onError, setDocumentTitle, ...props }) {
     /**
@@ -60,13 +60,17 @@ src, filename, onError, setDocumentTitle, ...props }) {
             return URL.createObjectURL(file);
         }
         return;
-    }, [blob]);
+    }, [blob, filename]);
     /**
      * ---------------------------------------------------------------
      * 工具栏
      */
-    const transformWrapperRef = (0, react_1.useRef)(null);
+    const pinchableRef = (0, react_1.useRef)(null);
     const [rotate, setRotate] = (0, react_1.useState)(0);
+    const resetHandler = () => {
+        pinchableRef.current.reset();
+        setRotate(0);
+    };
     const downloadHandler = () => {
         if (src) {
             const a = document.createElement('a');
@@ -76,9 +80,9 @@ src, filename, onError, setDocumentTitle, ...props }) {
         }
     };
     const objectOnLoad = () => {
-        transformWrapperRef.current.centerView();
+        // transformWrapperRef.current!.centerView()
     };
-    return ((0, jsx_runtime_1.jsxs)(loading_1.Loading, { ...props, css: documentViewer_style_1.svgStyle, className: (0, utils_1.clsx)(documentViewer_style_1.classes.svgViewer, props.className), open: loading, children: [(0, jsx_runtime_1.jsxs)("div", { className: documentViewer_style_1.classes.svgToolbar, children: [(0, jsx_runtime_1.jsxs)("div", { className: documentViewer_style_1.classes.svgTitle, children: [(0, jsx_runtime_1.jsx)(__1.Icon, { icon: faDiagramProject_1.faDiagramProject, className: documentViewer_style_1.classes.svgIcon }), (0, jsx_runtime_1.jsx)("div", { children: filename })] }), (0, jsx_runtime_1.jsxs)("div", { className: documentViewer_style_1.classes.svgToolbarRight, children: [(0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u65CB\u8F6C-90\u00B0", children: (0, jsx_runtime_1.jsx)(button_1.Button, { ...commonButtonProps, onClick: () => setRotate(rotate - 90), children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faRotateLeft_1.faRotateLeft }) }) }), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u65CB\u8F6C90\u00B0", children: (0, jsx_runtime_1.jsx)(button_1.Button, { ...commonButtonProps, onClick: () => setRotate(rotate + 90), children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faRotateRight_1.faRotateRight }) }) }), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u7F29\u5C0F", children: (0, jsx_runtime_1.jsx)(button_1.Button, { ...commonButtonProps, onClick: () => transformWrapperRef.current.zoomOut(), children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faMagnifyingGlassMinus_1.faMagnifyingGlassMinus }) }) }), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u653E\u5927", children: (0, jsx_runtime_1.jsx)(button_1.Button, { ...commonButtonProps, onClick: () => transformWrapperRef.current.zoomIn(), children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faMagnifyingGlassPlus_1.faMagnifyingGlassPlus }) }) }), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u9002\u5E94\u5C4F\u5E55", children: (0, jsx_runtime_1.jsx)(button_1.Button, { ...commonButtonProps, onClick: () => transformWrapperRef.current.resetTransform(), children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faExpand_1.faExpand }) }) }), themeSwitchable &&
-                                (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(divider_1.Divider, { className: documentViewer_style_1.classes.svgDivider, orientation: "vertical" }), (0, jsx_runtime_1.jsx)(switch_1.Switch, { checkedLabel: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faSun_1.faSun }), unCheckedLabel: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faMoon_1.faMoon }), checked: mode === 'light', onChange: themeChangeHandler })] }), showDownload &&
-                                (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(divider_1.Divider, { className: documentViewer_style_1.classes.svgDivider, orientation: "vertical" }), (0, jsx_runtime_1.jsx)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faDownload_1.faDownload }), onClick: downloadHandler, children: "\u4E0B\u8F7D" })] })] })] }), (0, jsx_runtime_1.jsx)(react_zoom_pan_pinch_1.TransformWrapper, { smooth: false, ...transformWrapperProps, ref: transformWrapperRef, minScale: .2, children: (0, jsx_runtime_1.jsx)(react_zoom_pan_pinch_1.TransformComponent, { wrapperClass: documentViewer_style_1.classes.svgContainer, contentClass: documentViewer_style_1.classes.svgContent, children: (0, jsx_runtime_1.jsx)("object", { className: documentViewer_style_1.classes.object, data: data, style: { rotate: `${rotate}deg` }, onLoad: objectOnLoad, onError: onError }) }) })] }));
+    return ((0, jsx_runtime_1.jsxs)(loading_1.Loading, { ...props, css: documentViewer_style_1.svgStyle, className: (0, utils_1.clsx)(documentViewer_style_1.classes.svgViewer, props.className), open: loading, children: [(0, jsx_runtime_1.jsxs)("div", { className: documentViewer_style_1.classes.svgToolbar, children: [(0, jsx_runtime_1.jsxs)("div", { className: documentViewer_style_1.classes.svgTitle, children: [(0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faDiagramProject_1.faDiagramProject, className: documentViewer_style_1.classes.svgIcon }), (0, jsx_runtime_1.jsx)("div", { children: filename })] }), (0, jsx_runtime_1.jsxs)("div", { className: documentViewer_style_1.classes.svgToolbarRight, children: [(0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u65CB\u8F6C-90\u00B0", children: (0, jsx_runtime_1.jsx)(button_1.Button, { ...commonButtonProps, onClick: () => setRotate(rotate - 90), children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faRotateLeft_1.faRotateLeft }) }) }), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u65CB\u8F6C90\u00B0", children: (0, jsx_runtime_1.jsx)(button_1.Button, { ...commonButtonProps, onClick: () => setRotate(rotate + 90), children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faRotateRight_1.faRotateRight }) }) }), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u7F29\u5C0F", children: (0, jsx_runtime_1.jsx)(button_1.Button, { ...commonButtonProps, onClick: () => pinchableRef.current.zoomOut(), children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faMagnifyingGlassMinus_1.faMagnifyingGlassMinus }) }) }), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u653E\u5927", children: (0, jsx_runtime_1.jsx)(button_1.Button, { ...commonButtonProps, onClick: () => pinchableRef.current.zoomIn(), children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faMagnifyingGlassPlus_1.faMagnifyingGlassPlus }) }) }), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u9002\u5E94\u5C4F\u5E55", children: (0, jsx_runtime_1.jsx)(button_1.Button, { ...commonButtonProps, onClick: resetHandler, children: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faExpand_1.faExpand }) }) }), themeSwitchable &&
+                                (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(divider_1.Divider, { className: documentViewer_style_1.classes.svgDivider, orientation: "vertical" }), (0, jsx_runtime_1.jsx)(switch_1.Switch, { checkedLabel: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faSun_1.faSun }), unCheckedLabel: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faMoon_1.faMoon }), checked: mode === 'light', onChange: themeChangeHandler })] }), showDownload &&
+                                (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(divider_1.Divider, { className: documentViewer_style_1.classes.svgDivider, orientation: "vertical" }), (0, jsx_runtime_1.jsx)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faDownload_1.faDownload }), onClick: downloadHandler, children: "\u4E0B\u8F7D" })] })] })] }), (0, jsx_runtime_1.jsx)(pinchable_1.Pinchable, { ...pinchableProps, ref: pinchableRef, className: (0, utils_1.clsx)(documentViewer_style_1.classes.svgContainer, pinchableProps?.className), children: (0, jsx_runtime_1.jsx)("div", { className: documentViewer_style_1.classes.svgContent, children: (0, jsx_runtime_1.jsx)("object", { className: documentViewer_style_1.classes.object, data: data, style: { rotate: `${rotate}deg` }, onLoad: objectOnLoad, onError: onError }) }) })] }));
 }

package/dist/esm/components/accordion/accordion.js

@@ -3,7 +3,7 @@ import { classes, style } from './accordion.style';
 import { clsx, useControlled } from '../../utils';
 import { useTheme } from '../theme';
 import { Collapse } from '../transitionBase';
-import { Icon } from '../..';
+import { Icon } from '../icon';
 import { faCaretRight } from '@fortawesome/free-solid-svg-icons/faCaretRight';
 export function Accordion({ size, title, prefix, suffix, expandIcon, defaultExpanded = false, expanded, onExpandedChange, readOnly, disabled, ...props }) {
     const theme = useTheme();

package/dist/esm/components/alert/alert.js

@@ -5,7 +5,8 @@ import { classes, useStyle } from './alert.style';
 import { Button } from '../button';
 import { Skeleton } from '../skeleton';
 import { faXmark } from '@fortawesome/free-solid-svg-icons/faXmark';
-import { Icon, statusMapToIconDefinition } from '../..';
+import { Icon } from '../icon';
+import { statusMapToIconDefinition } from '../status';
 export const Alert = memo(({ variant = 'standard', status = 'error', color = status, showIcon = true, icon, title, description, prefix, suffix, closable, onClose, loading, ...props }) => {
     return (_jsxs("div", { ...props, css: useStyle({ color: color || 'error' }), className: clsx(classes.root, props.className), "data-variant": variant, children: [showIcon &&
                 _jsx("div", { className: classes.icon, children: loading

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

@@ -4,7 +4,7 @@ import { clsx } from '../../utils';
 import { classes, style } from './errorBoundary.style';
 import { Placeholder } from '../placeholder';
 import { Button } from '../button';
-import { Icon } from '../..';
+import { Icon } from '../icon';
 import { faRotateRight } from '@fortawesome/free-solid-svg-icons/faRotateRight';
 const placeholderSlots = {
     description: 'pre'