@canlooks/can-ui 0.0.20 → 0.0.22

package/dist/esm/components/palette/palette.style.d.ts

@@ -1,9 +1,9 @@
 export declare const classes: {
-    mask: string;
     main: string;
     input: string;
     hue: string;
     alpha: string;
+    mask: string;
     handle: string;
     slidersRow: string;
     sliders: string;

package/dist/esm/components/palette/palette.style.js

@@ -100,7 +100,7 @@ export const style = defineCss(({ spacing, borderRadius, background, divider, te
     
                     &:before {
                         content: '';
-                        ${getTranparentBackground(background.body, background.card)}
+                        ${getTranparentBackground(background.body, background.content)}
                         background-size: 9px;
                     }
                 }
@@ -113,7 +113,7 @@ export const style = defineCss(({ spacing, borderRadius, background, divider, te
             border-radius: ${borderRadius}px;
             border: 1px solid ${divider};
             overflow: hidden;
-            ${getTranparentBackground(background.body, background.card)}
+            ${getTranparentBackground(background.body, background.content)}
             background-size: 50% 50%;
             position: relative;
     

package/dist/esm/components/pickerDialog/pickerDialog.d.ts

@@ -3,7 +3,10 @@ import { DialogProps } from '../dialog';
 import { OptionType, SelectionContextBaseProps } from '../selectionContext';
 import { SelectedListProps } from '../selectedList';
 import { Id } from '../../../types';
-export interface PickerDialogProps<O extends OptionType<V>, V extends Id = Id> extends Omit<DialogProps, 'ref' | 'children' | 'onConfirm'>, Omit<SelectionContextBaseProps<O, V>, 'children'> {
+export type PickerDialogRef<V extends Id = Id> = {
+    open(value?: V | V[]): Promise<V | V[]>;
+};
+export interface PickerDialogProps<O extends OptionType<V>, V extends Id = Id> extends Omit<DialogProps, 'ref' | 'children' | 'onConfirm' | 'onToggle'>, Omit<SelectionContextBaseProps<O, V>, 'children'> {
     ref?: Ref<PickerDialogRef<V>>;
     /** 默认的ref已被PickerDialogRef取代，需要dialogRef指向dialog元素 */
     dialogRef?: Ref<HTMLDivElement>;
@@ -12,7 +15,7 @@ export interface PickerDialogProps<O extends OptionType<V>, V extends Id = Id> e
         multiple?: boolean;
     }) => ReactNode);
     showSelectedList?: boolean;
-    /** 已选列表的位置，@default "left" */
+    /** 已选列表的位置，默认为`right` */
     selectedListPlacement?: 'left' | 'right';
     selectedListProps?: SelectedListProps<V>;
     selectedItemProps?: SelectedListProps<V>['itemProps'];
@@ -22,7 +25,4 @@ export interface PickerDialogProps<O extends OptionType<V>, V extends Id = Id> e
     /** @alias {@link options} */
     nodes?: O[];
 }
-export type PickerDialogRef<V extends Id = Id> = {
-    open(value?: V | V[]): Promise<V | V[]>;
-};
 export declare const PickerDialog: <O extends OptionType<V>, V extends Id = Id>(props: PickerDialogProps<O, V>) => ReactElement;

package/dist/esm/components/pickerDialog/pickerDialog.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-import { cloneElement, forwardRef, isValidElement, useImperativeHandle, useRef, useState } from 'react';
+import { cloneElement, isValidElement, useImperativeHandle, useRef, useState } from 'react';
 import { Dialog } from '../dialog';
 import { classnames, toArray, useControlled } from '../../utils';
 import { classes, style } from './pickerDialog.style';
@@ -8,11 +8,11 @@ import { Divider } from '../divider';
 import { SelectedList } from '../selectedList';
 import { Button } from '../button';
 import { DeleteOutlined } from '@ant-design/icons';
-export const PickerDialog = forwardRef(({ dialogRef, multiple, children, showSelectedList = !!multiple, selectedListPlacement = 'left', selectedListProps, selectedItemProps, onConfirm, rows, nodes, 
+export const PickerDialog = (({ ref, dialogRef, multiple, children, showSelectedList = !!multiple, selectedListPlacement = 'right', selectedListProps, selectedItemProps, onConfirm, rows, nodes, 
 // 以下属性从SelectionContextBaseProps继承
-options = rows ?? nodes, primaryKey = 'id', childrenKey = 'children', relation = 'dependent', integration = 'shallowest', disabled, clearable = !!multiple, onToggle, ...props }, ref) => {
-    const resolveFn = useRef();
-    const rejectFn = useRef();
+options = rows ?? nodes, primaryKey = 'id', childrenKey = 'children', relation = 'dependent', integration = 'shallowest', disabled, clearable = !!multiple, onToggle, ...props }) => {
+    const resolveFn = useRef(void 0);
+    const rejectFn = useRef(void 0);
     const [innerValue, _setInnerValue] = useState(multiple ? [] : null);
     const setInnerValue = (value) => {
         _setInnerValue(value);
@@ -70,7 +70,7 @@ options = rows ?? nodes, primaryKey = 'id', childrenKey = 'children', relation =
                 onExited: exitedHanlder,
                 ...props.modalProps
             }, ...showSelectedList && {
-                [selectedListPlacement === 'left' ? 'prefix' : 'sufix']: (_jsxs("div", { className: classes.selectedArea, children: [_jsxs(Divider, { className: classes.count, textAlign: "start", children: [_jsxs("div", { children: ["\u5DF2\u9009\u62E9", _jsx("b", { children: selectedCount }), "\u9879"] }), clearable &&
+                [selectedListPlacement === 'left' ? 'prefix' : 'suffix']: (_jsxs("div", { className: classes.selectedArea, children: [_jsxs(Divider, { className: classes.count, textAlign: "start", children: [_jsxs("div", { children: ["\u5DF2\u9009\u62E9", _jsx("b", { children: selectedCount }), "\u9879"] }), clearable &&
                                     _jsx(Button, { prefix: _jsx(DeleteOutlined, {}), variant: "plain", color: "text", onClick: () => setInnerValue(multiple ? [] : null), children: "\u6E05\u7A7A" })] }), _jsx(SelectedList, { itemProps: selectedItemProps, ...selectedListProps, className: classnames(classes.list, selectedListProps?.className) }), _jsx(Button, { className: classes.confirm, disabled: selectedCount === 0, onClick: () => confirmHandler(), children: "\u786E\u5B9A" })] }))
             }, children: renderChildren() }) }));
 });

package/dist/esm/components/pickerDialog/pickerDialog.style.d.ts

@@ -1,7 +1,7 @@
 export declare const classes: {
     content: string;
-    list: string;
     confirm: string;
+    list: string;
     selectedArea: string;
     count: string;
 } & {

package/dist/esm/components/placeholder/placeholder.d.ts

@@ -17,4 +17,4 @@ export interface PlaceholderProps extends Omit<DIVProps, 'title'> {
     descriptionComponent?: any;
     extra?: ReactNode;
 }
-export declare const Placeholder: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Omit<PlaceholderProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>>;
+export declare const Placeholder: import("react").MemoExoticComponent<({ status, image, title, description, descriptionComponent: DescriptionComponent, extra, ...props }: PlaceholderProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

package/dist/esm/components/placeholder/placeholder.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-import { forwardRef, memo } from 'react';
+import { memo } from 'react';
 import { classes, style } from './placeholder.style';
 import { classnames } from '../../utils';
-import { useTheme } from '../app';
+import { useTheme } from '../theme';
 export const imagePreset = {
     emptyLight: 'data:image/png;base64,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',
     emptyDark: 'data:image/png;base64,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',
@@ -12,18 +12,18 @@ export const imagePreset = {
     info: 'data:image/png;base64,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',
     searching: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAACXBIWXMAAAsTAAALEwEAmpwYAAAF0ElEQVR4nO2dTWgdVRTHn4KI7l2IgriwggsXinbr1o+Fgoppm5jaUgsV0YIBq6ZaN8GFqItGEW3jB4KgCBIapQjFom/O/3/fix8VkhQ/4gdFKVpijSnakWtGiOl7c2fefNyZuffA2eTl3Xvf+Z1z7vdMq+XFixcvXrx48eLFixcvOQrJi4Mg2ADgJpK3krwLwFCZSvIV56AuLi5e1Ol0blBK3VO2wXEugJDkqy1XpN1uX27D0xEPIHQiEkTk6ip4PXoDaDYE7flVMz7OBdDMdKQ72yqlHcQDaF4kkNxo29BIB6A5kaC9v4qpB2YAzYiE2dnZDVUwNAYDUP9I0JOsmgMIax0JJG9rAICwtpFQ1dEP0gOoJwTbBka+AOoHoYEAwlpBaCiAsDYQGgwgrAWEEo05IiJTABYA/BnpAsmD+rOY7y03GkIZxheRXQC+7Wck/Vn0P72+/0NGAFonW1WVMjwfMcZfC6FPJBzKAUB1I6EE759KaiQAB3qUMUby75wgTDoHgOTxFAAW+pTxYU4AqgehhBS0nALAcp8oGgbwZSMhVAkAyT9iUtkwyQ8al47qkILwfxCPkJwmuZjDEHXSBQAHM3bChapt+1dqGCqrud4DqNhEbMhHQD4QhqMUsxCNdrTO67/Z8HyXUtBQldW2/T0A22LbA+EjwL4R4FNQ7kZ4gGRAcpCJkv6OANjt+4DBjb+Uw1LBUhlD08b1AVz1/LwWzdoeQHoAyzkC6Ls45yOgHACnPYD0ESA5Agg8gPThvjuvTlgp9bAHMEC+FZFdugPVOXyQvK89vwzjN3IUhJqpbft7ALbFtgfCR4B9I8CnIPuGgCW1nYF8CrIttj0QPgLsGwE5qYhsITmulHpZRN7TB7n04V4A75LcH50z3dSEFJRlvT80KYDPgiDYnMLw+0h+nLA9vwGY0TDqCiCv9f6wj/FPkNyepC1KqcdIzg1Yz9loxn1FrQDkvN4frlN97nM8SaqJUkzmc6IAfid5d50AFJJ2uKrTCeofBTCbc9TpaNgXhuF5zgIAsARgm6H+EZLHinIAAM/VAUCe6/3hGn0zQeo5WmD0/QdhW6UB5LjeH6750csicp/B+PuLNn7UlhWS11UZQNb1/rCHHo6rLwiCe0meTFHeN9Edgtd0ZEVXnE6k+P5HlQZQtpJ8K6H3HhORPTHlTCS99ioiN3sAWO14dQedwGjT62e5MaMoJijvqAeAf9Pdswk8/8gAUOcNZZ5tt9tXOp+CSB42ADhl6sBjBhN/GSDsdB4ADNebROTtDP3LJwa4U04DILmJ5IrBS8cylP+CoexPnQaglNpqytN6XShDHWOGCDjuNAAR2VHk2dFoPhMH+MfG7wdIzAW9IAhGTRFgeNZQrJLcY2jfnAv7AdsNRjptALh3UAB658wA+Ejj9wOCIDDdhFkwGOlQhgj4wtC+F11Yjp4w1Pm+4fsrOioH+B1Pm9qmlNpSuQe35g0AwBtx9YmI0VAA5lL2BTtJ/mIo90yn07mkco8uLmA/oG2oT6/v/JygnM+T7CWLyEMkv0/SrlZFH96d634AgFMJTkAcSFjeyahjHe1h+B161pwygscLBxC9psrqfgCApwx1jiilfkpR5hmSX+mjKnq5IerIB93AH3f6BQ6IVCmlIcUunhWoxULodrs32jYwkulLlgBo3Vv0i9vurICBhxLoTCMhkLy0DqkIqyOjqRwf3pdWJwp9n0xdICilntEjqMZFQrfbvawu6UhEtgJ4Rz8I3AKEBwuDMD8/f2G73b5eROoSDfcDeF3PiA3bjPrm/YzeZwDwZEYAeqZ8VavoIaquxObrbJEehr4joGe7T+gjKkopvadwu1LqWpIXrP19AB7PCOH5QgG4IMgGoWu7/a5D+M52252GUMqmvUuClBB0R267zc5CAPBrKfsFLgrJR6NbM/2Mr19AdIvtdjZaSN5B8usextcnezfabp8TEobh+dHLrvXVqM2dTuea9f/0D/kpCFxyBQcLAAAAAElFTkSuQmCC'
 };
-export const Placeholder = memo(forwardRef(({ status = 'empty', image, title = status === 'warning' ? '警告'
+export const Placeholder = memo(({ status = 'empty', image, title = status === 'warning' ? '警告'
     : status === 'error' ? '出错啦'
         : status === 'success' ? '成功'
             : void 0, description = status === 'empty' ? '暂无数据'
     : status === 'searching' ? '搜索中...'
-        : void 0, descriptionComponent: DescriptionComponent = 'div', extra, ...props }, ref) => {
+        : void 0, descriptionComponent: DescriptionComponent = 'div', extra, ...props }) => {
     const { mode } = useTheme();
-    return (_jsxs("div", { ...props, ref: ref, css: style, className: classnames(classes.root, props.className), children: [image ??
+    return (_jsxs("div", { ...props, css: style, className: classnames(classes.root, props.className), children: [image ??
                 _jsx("img", { className: classes.image, src: status === 'empty'
                         ? (mode === 'light' ? imagePreset.emptyLight : imagePreset.emptyDark)
-                        : imagePreset[status] }), !!title &&
+                        : imagePreset[status], alt: "" }), !!title &&
                 _jsx("div", { className: classes.title, children: title }), !!description &&
                 _jsx(DescriptionComponent, { className: classes.description, children: description }), !!extra &&
                 _jsx("div", { className: classes.extra, children: extra })] }));
-}));
+});

package/dist/esm/components/popper/popper.d.ts

@@ -5,7 +5,7 @@ export interface PopperProps extends Omit<DIVProps, 'content' | 'children'> {
     popperRef?: Ref<PopperRef | null>;
     /** 若不指定anchorElement，默认使用{@link children}作为目标锚点元素 */
     anchorElement?: DefineElement<HTMLElement>;
-    /** 弹框渲染的容器元素，@default document.body */
+    /** 弹框渲染的容器元素，默认为{@link document.body} */
     container?: DefineElement<HTMLElement>;
     /** 汽泡里的内容 */
     content?: ReactNode;
@@ -16,13 +16,13 @@ export interface PopperProps extends Omit<DIVProps, 'content' | 'children'> {
     variant?: 'zoom' | 'collapse';
     /**
      * 限制弹框的宽度或高度与children的一致
-     * {@link variant}为"zoom"时，@default false
-     * {@link variant}为"collapse"时，@default true
+     * @enum {@link variant}为`zoom`时，默认为`false`
+     * @enum {@link variant}为`collapse`时，默认为`true`
      */
     sizeAdaptable?: boolean;
-    /** trigger{@link trigger}包含"hover"时，鼠标移入移的延迟时间，@default 100 (ms) */
+    /** trigger{@link trigger}包含"hover"时，鼠标移入移的延迟时间，默认为`100(ms)` */
     mouseEnterDelay?: number;
-    /**@default 150 (ms) */
+    /**默认为`150(ms)` */
     mouseLeaveDelay?: number;
     defaultOpen?: boolean;
     open?: boolean;
@@ -32,9 +32,9 @@ export interface PopperProps extends Omit<DIVProps, 'content' | 'children'> {
     /** 点击内部选项是否自动关闭popper */
     autoClose?: boolean;
     /**
-     * 为@enum {true}时，跟随父组件强制渲染；
-     * 为@enum {false}时，只有打开状态渲染，关闭后销毁；
-     * 为@enum {undefined}时，第一次打开时渲染，跟随父组件销毁。
+     * @enum {true} 跟随父组件强制渲染；
+     * @enum {false} 只有打开状态渲染，关闭后销毁；
+     * @enum {undefined} 第一次打开时渲染，跟随父组件销毁。
      */
     forceRender?: boolean;
     children?: ReactElement;
@@ -45,4 +45,4 @@ export interface PopperRef extends HTMLDivElement {
         openAnimation?: boolean;
     }, beforeOpen?: () => void): void;
 }
-export declare const Popper: import("react").ForwardRefExoticComponent<Omit<PopperProps, "ref"> & import("react").RefAttributes<any>>;
+export declare function Popper({ ref, popperRef, anchorElement, container, content, offset, trigger, placement, variant, sizeAdaptable, mouseEnterDelay, mouseLeaveDelay, defaultOpen, open, onOpenChange, onOpenChangeEnd, disabled, autoClose, forceRender, children, ...props }: PopperProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/esm/components/popper/popper.js

@@ -1,11 +1,11 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-import { cloneElement, forwardRef, isValidElement, useCallback, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from 'react';
+import { cloneElement, isValidElement, useCallback, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
 import { classnames, cloneRef, fineParent, isElementVisibleCompletely, toArray, useControlled, useDerivedState, useForceUpdate, useSyncState, useUnmounted } from '../../utils';
 import { ClickAway } from '../clickAway';
 import { classes, style } from './popper.style';
-import { popperContext } from './popperContext';
-import { useTheme } from '../app';
+import { PopperContext } from './popperContext';
+import { useTheme } from '../theme';
 const getAttemptOrder = (placement) => {
     const withoutPlaceB = {
         'top': ['top', 'bottom', 'left', 'right', 'top'],
@@ -20,7 +20,7 @@ const getAttemptOrder = (placement) => {
     common.splice(common.indexOf(placement), 1);
     return [placement, ...common, placement];
 };
-export const Popper = forwardRef(({ popperRef, anchorElement, container = document.body, content, offset, trigger = ['hover', 'focus'], placement = 'top', variant = 'zoom', sizeAdaptable = variant === 'collapse', mouseEnterDelay = 100, mouseLeaveDelay = 150, defaultOpen = false, open, onOpenChange, onOpenChangeEnd, disabled, autoClose = false, forceRender, children, ...props }, ref) => {
+export function Popper({ ref, popperRef, anchorElement, container = document.body, content, offset, trigger = ['hover', 'focus'], placement = 'top', variant = 'zoom', sizeAdaptable = variant === 'collapse', mouseEnterDelay = 100, mouseLeaveDelay = 150, defaultOpen = false, open, onOpenChange, onOpenChangeEnd, disabled, autoClose = false, forceRender, children, ...props }) {
     const { spacing } = useTheme();
     offset ??= spacing[2];
     useImperativeHandle(popperRef, () => {
@@ -45,8 +45,8 @@ export const Popper = forwardRef(({ popperRef, anchorElement, container = docume
         if (openState || !openHolding.current) {
             // 需要openHolding为false时才能关闭
             _setInnerOpen(openState);
+            setContextMenuEvent(contextMenuEvent);
         }
-        setContextMenuEvent(contextMenuEvent);
     };
     const renderedOnce = useRef(!!forceRender);
     if (innerOpen.current) {
@@ -76,8 +76,8 @@ export const Popper = forwardRef(({ popperRef, anchorElement, container = docume
     const [popperPosition, setPopperPosition] = useState();
     const [popperSize, setPopperSize] = useState();
     const [openNextFrame, setOpenNextFrame] = useDerivedState(!innerOpen.current, [innerOpen.current, contextMenuEvent.current]);
-    const placeA = useRef();
-    const placeB = useRef();
+    const placeA = useRef(void 0);
+    const placeB = useRef(void 0);
     const fitPosition = (options, beforeOpen) => {
         const containerRect = containerEl.getBoundingClientRect();
         const popperEl = innerPopperRef.current;
@@ -327,12 +327,13 @@ export const Popper = forwardRef(({ popperRef, anchorElement, container = docume
     }, [trigger]);
     // hover
     const hoverable = triggersSet.has('hover');
-    const enterTimeout = useRef();
-    const leaveTimeout = useRef();
+    const enterTimeout = useRef(void 0);
+    const leaveTimeout = useRef(void 0);
+    const childrenProps = children?.props;
     const onPointerEnter = useCallback((e) => {
-        children?.props.onPointerEnter?.(e);
+        childrenProps?.onPointerEnter?.(e);
         pointerEnterHandler();
-    }, [children?.props.onPointerEnter, mouseEnterDelay]);
+    }, [childrenProps?.onPointerEnter, mouseEnterDelay]);
     const pointerEnterHandler = () => {
         clearTimeout(leaveTimeout.current);
         const fn = () => setInnerOpen(true);
@@ -341,9 +342,9 @@ export const Popper = forwardRef(({ popperRef, anchorElement, container = docume
             : fn();
     };
     const onPointerLeave = useCallback((e) => {
-        children?.props.onPointerLeave?.(e);
+        childrenProps?.onPointerLeave?.(e);
         pointerLeaveHandler();
-    }, [children?.props.onPointerLeave, mouseLeaveDelay]);
+    }, [childrenProps?.onPointerLeave, mouseLeaveDelay]);
     const pointerLeaveHandler = () => {
         clearTimeout(enterTimeout.current);
         const fn = () => setInnerOpen(false);
@@ -353,21 +354,21 @@ export const Popper = forwardRef(({ popperRef, anchorElement, container = docume
     };
     // focus
     const onFocus = useCallback((e) => {
-        children?.props.onFocus?.(e);
+        childrenProps?.onFocus?.(e);
         setInnerOpen(openHolding.current = true);
-    }, [children?.props.onFocus]);
+    }, [childrenProps?.onFocus]);
     const onBlur = useCallback((e) => {
-        children?.props.onBlur?.(e);
+        childrenProps?.onBlur?.(e);
         setInnerOpen(openHolding.current = false);
-    }, [children?.props.onBlur]);
+    }, [childrenProps?.onBlur]);
     // enter
     const onKeyDown = useCallback((e) => {
-        children?.props.onKeyDown?.(e);
+        childrenProps?.onKeyDown?.(e);
         e.key === 'Enter' && setInnerOpen(openHolding.current = true);
-    }, [children?.props.onKeyDown]);
+    }, [childrenProps?.onKeyDown]);
     // click
     const onClick = useCallback((e) => {
-        children?.props.onClick?.(e);
+        childrenProps?.onClick?.(e);
         if (triggersSet.has('click')) {
             setInnerOpen(openHolding.current = true);
         }
@@ -375,19 +376,19 @@ export const Popper = forwardRef(({ popperRef, anchorElement, container = docume
             // trigger中不包含"click"，则无需保持打开状态，否则会与focus冲突
             openHolding.current = false;
         }
-    }, [children?.props.onClick]);
+    }, [childrenProps?.onClick]);
     const onClickAway = () => {
         setInnerOpen(openHolding.current = false);
     };
     // contextMenu
     const onContextMenu = useCallback((e) => {
-        children?.props.onContextMenu?.(e);
+        childrenProps?.onContextMenu?.(e);
         e.preventDefault();
         setInnerOpen(openHolding.current = true, e);
-    }, [children?.props.onContextMenu]);
+    }, [childrenProps?.onContextMenu]);
     /**
      * --------------------------------------------------------------
-     * popperContext
+     * PopperContext
      */
     const beforeOpenCallbacks = useRef(new Set());
     const triggerBeforeOpen = () => {
@@ -398,7 +399,11 @@ export const Popper = forwardRef(({ popperRef, anchorElement, container = docume
     const contextValue = useMemo(() => ({
         autoClose,
         open: innerOpen.current,
-        setOpen: setInnerOpen,
+        setOpen(open) {
+            // 通过context改变的open状态，需要强制将openHolding置为false
+            openHolding.current = false;
+            setInnerOpen(open);
+        },
         beforeOpenCallbacks: beforeOpenCallbacks.current
     }), [innerOpen.current, autoClose]);
     return (_jsxs(_Fragment, { children: [isValidElement(children)
@@ -430,5 +435,5 @@ export const Popper = forwardRef(({ popperRef, anchorElement, container = docume
                     }, onPointerLeave: e => {
                         props.onPointerLeave?.(e);
                         hoverable && pointerLeaveHandler();
-                    }, onTransitionEnd: onTransitionEnd, children: _jsx(popperContext.Provider, { value: contextValue, children: content }) }) }), containerEl)] }));
-});
+                    }, onTransitionEnd: onTransitionEnd, children: _jsx(PopperContext, { value: contextValue, children: content }) }) }), containerEl)] }));
+}

package/dist/esm/components/popper/popper.style.d.ts

@@ -1,4 +1,4 @@
-import { Theme } from '../app';
+import { Theme } from '../theme';
 export declare const classes: {
     popper: string;
 } & {

package/dist/esm/components/popper/popper.style.js

@@ -1,53 +1,56 @@
 import { css } from '@emotion/react';
 import { defineCss, defineClasses } from '../../utils';
-import { spacing, zIndex } from '../app';
-import { style as appStyle } from '../app/app.style';
+import { appStyleCallback } from '../app/app.style';
+import { zIndex } from '../theme';
 export const classes = defineClasses('popper', [
     'popper',
 ]);
-export const style = defineCss(({ fontSize, easing }) => [
-    appStyle,
-    css `
-        font-size: ${fontSize}px;
-        position: absolute;
-        top: 0;
-        left: 0;
-        z-index: ${zIndex.popper};
-        transition-property: transform, opacity;
-        transition-duration: .25s;
-
-        &[data-open=true] {
-            transition-timing-function: ${easing.bounce}, ${easing.easeOut};
-            opacity: 1;
-            transform: scale(1);
-        }
-
-        &:not([data-open=true]) {
-            transition-timing-function: ${easing.easeIn};
-            opacity: 0;
+export const style = defineCss(theme => {
+    const { easing, fontSize } = theme;
+    return [
+        appStyleCallback(theme),
+        css `
+            font-size: ${fontSize}px;
+            position: absolute;
+            top: 0;
+            left: 0;
+            z-index: ${zIndex.popper};
+            transition-property: transform, opacity;
+            transition-duration: .25s;
 
-            &[data-variant=zoom] {
-                transform: scale(0);
+            &[data-open=true] {
+                transition-timing-function: ${easing.bounce}, ${easing.easeOut};
+                opacity: 1;
+                transform: scale(1);
             }
 
-            &[data-variant=collapse] {
-                &[data-place-a=top], &[data-place-a=bottom] {
-                    transform: scaleY(0);
+            &:not([data-open=true]) {
+                transition-timing-function: ${easing.easeIn};
+                opacity: 0;
+
+                &[data-variant=zoom] {
+                    transform: scale(0);
                 }
 
-                &[data-place-a=left], &[data-place-a=right] {
-                    transform: scaleX(0);
+                &[data-variant=collapse] {
+                    &[data-place-a=top], &[data-place-a=bottom] {
+                        transform: scaleY(0);
+                    }
+
+                    &[data-place-a=left], &[data-place-a=right] {
+                        transform: scaleX(0);
+                    }
                 }
             }
-        }
-    `
-]);
+        `
+    ];
+});
 /**
  *  通用弹框箭头样式
  * @param colorValue
  * @param arrowSize
  */
-export const popperArrowStyle = (colorValue, arrowSize = spacing(3.5)) => css `
+export const popperArrowStyle = (colorValue, arrowSize = 10) => css `
     [data-show-arrow=true]:before {
         content: '';
         position: absolute;
@@ -55,7 +58,7 @@ export const popperArrowStyle = (colorValue, arrowSize = spacing(3.5)) => css `
         height: ${arrowSize}px;
         background-color: ${colorValue};
     }
-    
+
     &[data-place-a=top] {
         [data-show-arrow=true]:before {
             clip-path: polygon(50% 50%, 0 0, 100% 0);
@@ -63,7 +66,7 @@ export const popperArrowStyle = (colorValue, arrowSize = spacing(3.5)) => css `
             left: calc(50% - ${arrowSize / 2}px);
         }
     }
-    
+
     &[data-place-a=bottom] {
         [data-show-arrow=true]:before {
             clip-path: polygon(50% 50%, 100% 100%, 0 100%);
@@ -71,7 +74,7 @@ export const popperArrowStyle = (colorValue, arrowSize = spacing(3.5)) => css `
             left: calc(50% - ${arrowSize / 2}px);
         }
     }
-    
+
     &[data-place-a=left] {
         [data-show-arrow=true]:before {
             clip-path: polygon(50% 50%, 0 0, 0 100%);
@@ -79,7 +82,7 @@ export const popperArrowStyle = (colorValue, arrowSize = spacing(3.5)) => css `
             top: calc(50% - ${arrowSize / 2}px);
         }
     }
-    
+
     &[data-place-a=right] {
         [data-show-arrow=true]:before {
             clip-path: polygon(50% 50%, 100% 100%, 100% 0);
@@ -87,26 +90,26 @@ export const popperArrowStyle = (colorValue, arrowSize = spacing(3.5)) => css `
             top: calc(50% - ${arrowSize / 2}px);
         }
     }
-    
+
     &[data-place-b=Left] {
         [data-show-arrow=true]:before {
             left: 9px;
         }
     }
-    
+
     &[data-place-b=Right] {
         [data-show-arrow=true]:before {
             left: auto;
             right: 9px;
         }
     }
-    
+
     &[data-place-b=Top] {
         [data-show-arrow=true]:before {
             top: 9px;
         }
     }
-    
+
     &[data-place-b=Bottom] {
         [data-show-arrow=true]:before {
             top: auto;
@@ -118,7 +121,7 @@ export const popperArrowStyle = (colorValue, arrowSize = spacing(3.5)) => css `
  *  通用弹框样式
  */
 export const popperStyleCallback = ({ background, borderRadius, boxShadow }) => css `
-    background-color: ${background.card};
+    background-color: ${background.content};
     border-radius: ${borderRadius}px;
     box-shadow: ${boxShadow[0]};
     display: flex;

package/dist/esm/components/popper/popperContext.d.ts

@@ -1,5 +1,5 @@
 import { SetStateAction } from 'react';
-export declare const popperContext: import("react").Context<{
+export declare const PopperContext: import("react").Context<{
     autoClose: boolean;
     open: boolean;
     setOpen(open: SetStateAction<boolean>): void;

package/dist/esm/components/popper/popperContext.js

@@ -1,12 +1,12 @@
 import { createContext, useContext, useLayoutEffect, useRef, useCallback } from 'react';
-export const popperContext = createContext({
+export const PopperContext = createContext({
     autoClose: false,
     open: false,
     setOpen(open) { },
     beforeOpenCallbacks: new Set()
 });
 export function usePopperContext() {
-    return useContext(popperContext);
+    return useContext(PopperContext);
 }
 /**
  * 弹框打开之前会触发callback，通常用于scrollIntoView等需要计算弹框尺寸的操作
@@ -25,7 +25,7 @@ export function useBeforeOpen(callback) {
  * 当弹框打开时，滚动至已选项，返回一个ref
  */
 export function useScrollToSelected() {
-    const ref = useRef();
+    const ref = useRef(null);
     const isFirst = useRef(true);
     const isMultiple = useRef(false);
     useBeforeOpen(() => {

package/dist/esm/components/progress/progress.d.ts

@@ -1,22 +1,23 @@
+import React from 'react';
 import { ColorPropsValue, DIVProps } from '../../../types';
 export interface ProgressProps extends DIVProps {
     showInfo?: boolean;
     color?: ColorPropsValue;
     status?: 'default' | 'processing' | 'success' | 'error';
     variant?: 'linear' | 'circular' | 'gauge';
-    /** {@link variant}为"gauge"时有效，下方缺口的角度，@default 90 */
+    /** {@link variant}为`gauge`时有效，下方缺口的角度，默认为`90` */
     gapDegree?: number;
-    /** {@link variant}为"circular"时有效，表示圆圈的大小 */
+    /** {@link variant}为`circular`时有效，表示圆圈的大小 */
     size?: number;
     /**
-     * {@link variant}为"linear"时，表示进度条粗细
-     * {@link variant}为"circular"或"gauge"时，表示圆环的宽度
-     * @default 4
+     * @enum {@link variant}为`linear`时，表示进度条粗细
+     * @enum {@link variant}为`circular`或`gauge`时，表示圆环的宽度
+     * 默认为4
      */
     barWidth?: number;
-    /** 若indeterminate为true，则会一直播放动画，@default false */
+    /** 若为`true`，则会一直播放动画，默认为`false` */
     indeterminate?: boolean;
     strokeLinecap?: React.SVGAttributes<SVGCircleElement>['strokeLinecap'];
     value?: number;
 }
-export declare const Progress: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Omit<ProgressProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>>;
+export declare const Progress: React.MemoExoticComponent<({ showInfo, color, status, variant, gapDegree, size, indeterminate, barWidth, strokeLinecap, value, ...props }: ProgressProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

package/dist/esm/components/progress/progress.js

@@ -1,19 +1,19 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-import { forwardRef, memo, useMemo, useRef } from 'react';
+import { memo, useMemo, useRef } from 'react';
 import { classes, useStyle } from './progress.style';
 import { classnames } from '../../utils';
 import { CheckCircleFilled, CloseCircleFilled } from '@ant-design/icons';
-import { useTheme } from '../app';
+import { useTheme } from '../theme';
 import { css, keyframes } from '@emotion/react';
-export const Progress = memo(forwardRef(({ showInfo = true, color = 'primary', status = 'default', variant = 'linear', gapDegree = 90, size = 60, indeterminate = false, barWidth = 4, strokeLinecap = variant === 'gauge' ? 'butt' : 'round', value = 0, ...props }, ref) => {
+export const Progress = memo(({ showInfo = true, color = 'primary', status = 'default', variant = 'linear', gapDegree = 90, size = 60, indeterminate = false, barWidth = 4, strokeLinecap = variant === 'gauge' ? 'butt' : 'round', value = 0, ...props }) => {
     const { colors: { success, error } } = useTheme();
     const isSucceed = status === 'success' || (status !== 'error' && value === 100 && variant !== 'gauge');
     const renderInfo = () => {
         if (isSucceed) {
-            return _jsx(CheckCircleFilled, { className: classes.icon, style: { color: success } });
+            return _jsx(CheckCircleFilled, { className: classes.icon, style: { color: success.main } });
         }
         if (status === 'error') {
-            return _jsx(CloseCircleFilled, { className: classes.icon, style: { color: error } });
+            return _jsx(CloseCircleFilled, { className: classes.icon, style: { color: error.main } });
         }
         return value + '%';
     };
@@ -47,7 +47,7 @@ export const Progress = memo(forwardRef(({ showInfo = true, color = 'primary', s
         }
         return;
     }, [indeterminate, variant, strokeLinecap, size, barWidth]);
-    return (_jsx("div", { ...props, ref: ref, css: useStyle({ color, variant }), className: classnames(classes.root, props.className), "data-variant": variant, "data-indeterminate": indeterminate, "data-processing": value < 100 && status === 'processing', "data-success": isSucceed, "data-error": status === 'error', children: variant === 'linear'
+    return (_jsx("div", { ...props, css: useStyle({ color, variant }), className: classnames(classes.root, props.className), "data-variant": variant, "data-indeterminate": indeterminate, "data-processing": value < 100 && status === 'processing', "data-success": isSucceed, "data-error": status === 'error', children: variant === 'linear'
             ? _jsxs(_Fragment, { children: [_jsx("div", { className: classes.track, style: {
                             height: barWidth,
                             ...props.style
@@ -63,4 +63,4 @@ export const Progress = memo(forwardRef(({ showInfo = true, color = 'primary', s
                                     ? strokeDasharray * (1 - value / 100)
                                     : strokeDasharray * (1 - Math.max(0, Math.min(100, value)) / 100 * (1 - gapDegree / 360)) })] }), showInfo && !indeterminate &&
                         _jsx("div", { className: classes.info, children: renderInfo() })] }) }));
-}));
+});