@canlooks/can-ui 0.0.20 → 0.0.22

package/dist/cjs/components/popper/popper.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Popper = void 0;
+exports.Popper = Popper;
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const react_1 = require("react");
 const react_dom_1 = require("react-dom");
@@ -8,7 +8,7 @@ const utils_1 = require("../../utils");
 const clickAway_1 = require("../clickAway");
 const popper_style_1 = require("./popper.style");
 const popperContext_1 = require("./popperContext");
-const app_1 = require("../app");
+const theme_1 = require("../theme");
 const getAttemptOrder = (placement) => {
     const withoutPlaceB = {
         'top': ['top', 'bottom', 'left', 'right', 'top'],
@@ -23,8 +23,8 @@ const getAttemptOrder = (placement) => {
     common.splice(common.indexOf(placement), 1);
     return [placement, ...common, placement];
 };
-exports.Popper = (0, react_1.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) => {
-    const { spacing } = (0, app_1.useTheme)();
+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 } = (0, theme_1.useTheme)();
     offset ??= spacing[2];
     (0, react_1.useImperativeHandle)(popperRef, () => {
         if (innerPopperRef.current) {
@@ -48,8 +48,8 @@ exports.Popper = (0, react_1.forwardRef)(({ popperRef, anchorElement, container
         if (openState || !openHolding.current) {
             // 需要openHolding为false时才能关闭
             _setInnerOpen(openState);
+            setContextMenuEvent(contextMenuEvent);
         }
-        setContextMenuEvent(contextMenuEvent);
     };
     const renderedOnce = (0, react_1.useRef)(!!forceRender);
     if (innerOpen.current) {
@@ -79,8 +79,8 @@ exports.Popper = (0, react_1.forwardRef)(({ popperRef, anchorElement, container
     const [popperPosition, setPopperPosition] = (0, react_1.useState)();
     const [popperSize, setPopperSize] = (0, react_1.useState)();
     const [openNextFrame, setOpenNextFrame] = (0, utils_1.useDerivedState)(!innerOpen.current, [innerOpen.current, contextMenuEvent.current]);
-    const placeA = (0, react_1.useRef)();
-    const placeB = (0, react_1.useRef)();
+    const placeA = (0, react_1.useRef)(void 0);
+    const placeB = (0, react_1.useRef)(void 0);
     const fitPosition = (options, beforeOpen) => {
         const containerRect = containerEl.getBoundingClientRect();
         const popperEl = innerPopperRef.current;
@@ -330,12 +330,13 @@ exports.Popper = (0, react_1.forwardRef)(({ popperRef, anchorElement, container
     }, [trigger]);
     // hover
     const hoverable = triggersSet.has('hover');
-    const enterTimeout = (0, react_1.useRef)();
-    const leaveTimeout = (0, react_1.useRef)();
+    const enterTimeout = (0, react_1.useRef)(void 0);
+    const leaveTimeout = (0, react_1.useRef)(void 0);
+    const childrenProps = children?.props;
     const onPointerEnter = (0, react_1.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);
@@ -344,9 +345,9 @@ exports.Popper = (0, react_1.forwardRef)(({ popperRef, anchorElement, container
             : fn();
     };
     const onPointerLeave = (0, react_1.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);
@@ -356,21 +357,21 @@ exports.Popper = (0, react_1.forwardRef)(({ popperRef, anchorElement, container
     };
     // focus
     const onFocus = (0, react_1.useCallback)((e) => {
-        children?.props.onFocus?.(e);
+        childrenProps?.onFocus?.(e);
         setInnerOpen(openHolding.current = true);
-    }, [children?.props.onFocus]);
+    }, [childrenProps?.onFocus]);
     const onBlur = (0, react_1.useCallback)((e) => {
-        children?.props.onBlur?.(e);
+        childrenProps?.onBlur?.(e);
         setInnerOpen(openHolding.current = false);
-    }, [children?.props.onBlur]);
+    }, [childrenProps?.onBlur]);
     // enter
     const onKeyDown = (0, react_1.useCallback)((e) => {
-        children?.props.onKeyDown?.(e);
+        childrenProps?.onKeyDown?.(e);
         e.key === 'Enter' && setInnerOpen(openHolding.current = true);
-    }, [children?.props.onKeyDown]);
+    }, [childrenProps?.onKeyDown]);
     // click
     const onClick = (0, react_1.useCallback)((e) => {
-        children?.props.onClick?.(e);
+        childrenProps?.onClick?.(e);
         if (triggersSet.has('click')) {
             setInnerOpen(openHolding.current = true);
         }
@@ -378,19 +379,19 @@ exports.Popper = (0, react_1.forwardRef)(({ popperRef, anchorElement, container
             // trigger中不包含"click"，则无需保持打开状态，否则会与focus冲突
             openHolding.current = false;
         }
-    }, [children?.props.onClick]);
+    }, [childrenProps?.onClick]);
     const onClickAway = () => {
         setInnerOpen(openHolding.current = false);
     };
     // contextMenu
     const onContextMenu = (0, react_1.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 = (0, react_1.useRef)(new Set());
     const triggerBeforeOpen = () => {
@@ -401,7 +402,11 @@ exports.Popper = (0, react_1.forwardRef)(({ popperRef, anchorElement, container
     const contextValue = (0, react_1.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 ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, react_1.isValidElement)(children)
@@ -433,5 +438,5 @@ exports.Popper = (0, react_1.forwardRef)(({ popperRef, anchorElement, container
                     }, onPointerLeave: e => {
                         props.onPointerLeave?.(e);
                         hoverable && pointerLeaveHandler();
-                    }, onTransitionEnd: onTransitionEnd, children: (0, jsx_runtime_1.jsx)(popperContext_1.popperContext.Provider, { value: contextValue, children: content }) }) }), containerEl)] }));
-});
+                    }, onTransitionEnd: onTransitionEnd, children: (0, jsx_runtime_1.jsx)(popperContext_1.PopperContext, { value: contextValue, children: content }) }) }), containerEl)] }));
+}

package/dist/cjs/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/cjs/components/popper/popper.style.js

@@ -3,54 +3,57 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.popperStyle = exports.popperStyleCallback = exports.popperArrowStyle = exports.style = exports.classes = void 0;
 const react_1 = require("@emotion/react");
 const utils_1 = require("../../utils");
-const app_1 = require("../app");
 const app_style_1 = require("../app/app.style");
+const theme_1 = require("../theme");
 exports.classes = (0, utils_1.defineClasses)('popper', [
     'popper',
 ]);
-exports.style = (0, utils_1.defineCss)(({ fontSize, easing }) => [
-    app_style_1.style,
-    (0, react_1.css) `
-        font-size: ${fontSize}px;
-        position: absolute;
-        top: 0;
-        left: 0;
-        z-index: ${app_1.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;
+exports.style = (0, utils_1.defineCss)(theme => {
+    const { easing, fontSize } = theme;
+    return [
+        (0, app_style_1.appStyleCallback)(theme),
+        (0, react_1.css) `
+            font-size: ${fontSize}px;
+            position: absolute;
+            top: 0;
+            left: 0;
+            z-index: ${theme_1.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
  */
-const popperArrowStyle = (colorValue, arrowSize = (0, app_1.spacing)(3.5)) => (0, react_1.css) `
+const popperArrowStyle = (colorValue, arrowSize = 10) => (0, react_1.css) `
     [data-show-arrow=true]:before {
         content: '';
         position: absolute;
@@ -58,7 +61,7 @@ const popperArrowStyle = (colorValue, arrowSize = (0, app_1.spacing)(3.5)) => (0
         height: ${arrowSize}px;
         background-color: ${colorValue};
     }
-    
+
     &[data-place-a=top] {
         [data-show-arrow=true]:before {
             clip-path: polygon(50% 50%, 0 0, 100% 0);
@@ -66,7 +69,7 @@ const popperArrowStyle = (colorValue, arrowSize = (0, app_1.spacing)(3.5)) => (0
             left: calc(50% - ${arrowSize / 2}px);
         }
     }
-    
+
     &[data-place-a=bottom] {
         [data-show-arrow=true]:before {
             clip-path: polygon(50% 50%, 100% 100%, 0 100%);
@@ -74,7 +77,7 @@ const popperArrowStyle = (colorValue, arrowSize = (0, app_1.spacing)(3.5)) => (0
             left: calc(50% - ${arrowSize / 2}px);
         }
     }
-    
+
     &[data-place-a=left] {
         [data-show-arrow=true]:before {
             clip-path: polygon(50% 50%, 0 0, 0 100%);
@@ -82,7 +85,7 @@ const popperArrowStyle = (colorValue, arrowSize = (0, app_1.spacing)(3.5)) => (0
             top: calc(50% - ${arrowSize / 2}px);
         }
     }
-    
+
     &[data-place-a=right] {
         [data-show-arrow=true]:before {
             clip-path: polygon(50% 50%, 100% 100%, 100% 0);
@@ -90,26 +93,26 @@ const popperArrowStyle = (colorValue, arrowSize = (0, app_1.spacing)(3.5)) => (0
             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;
@@ -122,7 +125,7 @@ exports.popperArrowStyle = popperArrowStyle;
  *  通用弹框样式
  */
 const popperStyleCallback = ({ background, borderRadius, boxShadow }) => (0, react_1.css) `
-    background-color: ${background.card};
+    background-color: ${background.content};
     border-radius: ${borderRadius}px;
     box-shadow: ${boxShadow[0]};
     display: flex;

package/dist/cjs/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/cjs/components/popper/popperContext.js

@@ -1,18 +1,18 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.popperContext = void 0;
+exports.PopperContext = void 0;
 exports.usePopperContext = usePopperContext;
 exports.useBeforeOpen = useBeforeOpen;
 exports.useScrollToSelected = useScrollToSelected;
 const react_1 = require("react");
-exports.popperContext = (0, react_1.createContext)({
+exports.PopperContext = (0, react_1.createContext)({
     autoClose: false,
     open: false,
     setOpen(open) { },
     beforeOpenCallbacks: new Set()
 });
 function usePopperContext() {
-    return (0, react_1.useContext)(exports.popperContext);
+    return (0, react_1.useContext)(exports.PopperContext);
 }
 /**
  * 弹框打开之前会触发callback，通常用于scrollIntoView等需要计算弹框尺寸的操作
@@ -31,7 +31,7 @@ function useBeforeOpen(callback) {
  * 当弹框打开时，滚动至已选项，返回一个ref
  */
 function useScrollToSelected() {
-    const ref = (0, react_1.useRef)();
+    const ref = (0, react_1.useRef)(null);
     const isFirst = (0, react_1.useRef)(true);
     const isMultiple = (0, react_1.useRef)(false);
     useBeforeOpen(() => {

package/dist/cjs/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/cjs/components/progress/progress.js

@@ -6,17 +6,17 @@ const react_1 = require("react");
 const progress_style_1 = require("./progress.style");
 const utils_1 = require("../../utils");
 const icons_1 = require("@ant-design/icons");
-const app_1 = require("../app");
+const theme_1 = require("../theme");
 const react_2 = require("@emotion/react");
-exports.Progress = (0, react_1.memo)((0, react_1.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) => {
-    const { colors: { success, error } } = (0, app_1.useTheme)();
+exports.Progress = (0, react_1.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 } } = (0, theme_1.useTheme)();
     const isSucceed = status === 'success' || (status !== 'error' && value === 100 && variant !== 'gauge');
     const renderInfo = () => {
         if (isSucceed) {
-            return (0, jsx_runtime_1.jsx)(icons_1.CheckCircleFilled, { className: progress_style_1.classes.icon, style: { color: success } });
+            return (0, jsx_runtime_1.jsx)(icons_1.CheckCircleFilled, { className: progress_style_1.classes.icon, style: { color: success.main } });
         }
         if (status === 'error') {
-            return (0, jsx_runtime_1.jsx)(icons_1.CloseCircleFilled, { className: progress_style_1.classes.icon, style: { color: error } });
+            return (0, jsx_runtime_1.jsx)(icons_1.CloseCircleFilled, { className: progress_style_1.classes.icon, style: { color: error.main } });
         }
         return value + '%';
     };
@@ -50,7 +50,7 @@ exports.Progress = (0, react_1.memo)((0, react_1.forwardRef)(({ showInfo = true,
         }
         return;
     }, [indeterminate, variant, strokeLinecap, size, barWidth]);
-    return ((0, jsx_runtime_1.jsx)("div", { ...props, ref: ref, css: (0, progress_style_1.useStyle)({ color, variant }), className: (0, utils_1.classnames)(progress_style_1.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 ((0, jsx_runtime_1.jsx)("div", { ...props, css: (0, progress_style_1.useStyle)({ color, variant }), className: (0, utils_1.classnames)(progress_style_1.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'
             ? (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: progress_style_1.classes.track, style: {
                             height: barWidth,
                             ...props.style
@@ -66,4 +66,4 @@ exports.Progress = (0, react_1.memo)((0, react_1.forwardRef)(({ showInfo = true,
                                     ? strokeDasharray * (1 - value / 100)
                                     : strokeDasharray * (1 - Math.max(0, Math.min(100, value)) / 100 * (1 - gapDegree / 360)) })] }), showInfo && !indeterminate &&
                         (0, jsx_runtime_1.jsx)("div", { className: progress_style_1.classes.info, children: renderInfo() })] }) }));
-}));
+});

package/dist/cjs/components/progress/progress.style.d.ts

@@ -1,10 +1,10 @@
 import { ProgressProps } from './progress';
 export declare const classes: {
     info: string;
-    track: string;
-    svg: string;
     icon: string;
+    track: string;
     bar: string;
+    svg: string;
 } & {
     root: string;
 };

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

@@ -67,13 +67,13 @@ function useStyle({ color, variant }) {
 
                 &[data-success=true] {
                     .${exports.classes.bar} {
-                        background-color: ${colors.success};
+                        background-color: ${colors.success.main};
                     }
                 }
 
                 &[data-error=true] {
                     .${exports.classes.bar} {
-                        background-color: ${colors.error};
+                        background-color: ${colors.error.main};
                     }
                 }
 
@@ -112,13 +112,13 @@ function useStyle({ color, variant }) {
 
                 &[data-success=true] {
                     .${exports.classes.bar} {
-                        stroke: ${colors.success};
+                        stroke: ${colors.success.main};
                     }
                 }
 
                 &[data-error=true] {
                     .${exports.classes.bar} {
-                        stroke: ${colors.error};
+                        stroke: ${colors.error.main};
                     }
                 }
 

package/dist/cjs/components/radio/radio.d.ts

@@ -1,13 +1,13 @@
 import { ReactElement } from 'react';
 import { CheckboxBaseProps } from '../checkboxBase';
-import { CheckboxBaseGroupSingleProps, ItemType } from '../checkboxBaseGroup';
-import { Id } from '../../../types';
+import { CheckboxBaseGroupCommonProps, ItemType } from '../checkboxBaseGroup';
+import { Id, SelectableSingleProps } from '../../../types';
 export interface RadioProps extends Omit<CheckboxBaseProps, '_type' | 'indeterminate'> {
 }
 export declare const Radio: {
     (props: RadioProps): ReactElement;
     Group: typeof RadioGroup;
 };
-export interface RadioGroupProps<I extends ItemType, V extends Id = Id> extends Omit<CheckboxBaseGroupSingleProps<I, V>, 'multiple'> {
+export interface RadioGroupProps<I extends ItemType, V extends Id = Id> extends CheckboxBaseGroupCommonProps<I>, Omit<SelectableSingleProps<V>, 'multiple'> {
 }
-export declare const RadioGroup: import("react").ForwardRefExoticComponent<Omit<RadioGroupProps<ItemType, Id>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const RadioGroup: <I extends ItemType, V extends Id = Id>(props: RadioGroupProps<I, V>) => ReactElement;

package/dist/cjs/components/radio/radio.js

@@ -2,12 +2,11 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RadioGroup = exports.Radio = void 0;
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
-const react_1 = require("react");
 const checkboxBase_1 = require("../checkboxBase");
 const checkboxBaseGroup_1 = require("../checkboxBaseGroup");
-exports.Radio = (0, react_1.forwardRef)((props, ref) => {
-    return (0, jsx_runtime_1.jsx)(checkboxBase_1.CheckboxBase, { ...props, ref: ref, _type: "radio" });
+exports.Radio = ((props) => {
+    return (0, jsx_runtime_1.jsx)(checkboxBase_1.CheckboxBase, { ...props, _type: "radio" });
 });
-exports.RadioGroup = (0, react_1.forwardRef)((props, ref) => {
-    return (0, jsx_runtime_1.jsx)(checkboxBaseGroup_1.CheckboxBaseGroup, { ...props, ref: ref });
+exports.RadioGroup = ((props) => {
+    return (0, jsx_runtime_1.jsx)(checkboxBaseGroup_1.CheckboxBaseGroup, { ...props });
 });

package/dist/cjs/components/rating/rating.d.ts

@@ -8,12 +8,12 @@ export type CharacterProps = {
 export interface RatingProps extends Omit<DIVProps, 'defaultValue' | 'onChange'> {
     color?: ColorPropsValue;
     size?: Size;
-    /** 星星的数量，@default 5 */
+    /** 星星的数量，默认为`5` */
     count?: number;
     renderStar?: ReactNode | ((characterProps: CharacterProps) => ReactNode);
     /** 允许选中半颗星 */
     allowHalf?: boolean;
-    /** 为true时只高亮选中的星星，否则从第一颗开始高亮至选中，@default false */
+    /** 为true时只高亮选中的星星，否则从第一颗开始高亮至选中，默认为`false` */
     highlightSelectedOnly?: boolean;
     defaultValue?: number;
     value?: number;
@@ -21,4 +21,4 @@ export interface RatingProps extends Omit<DIVProps, 'defaultValue' | 'onChange'>
     readOnly?: boolean;
     disabled?: boolean;
 }
-export declare const Rating: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Omit<RatingProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>>;
+export declare const Rating: import("react").MemoExoticComponent<({ color, size, count, renderStar, allowHalf, highlightSelectedOnly, defaultValue, value, onChange, readOnly, disabled, ...props }: RatingProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

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 icons_1 = require("@ant-design/icons");
-const app_1 = require("../app");
-exports.Rating = (0, react_1.memo)((0, react_1.forwardRef)(({ color = '#FFCC00', size, count = 5, renderStar = (0, jsx_runtime_1.jsx)(icons_1.StarFilled, {}), allowHalf, highlightSelectedOnly, defaultValue = 0, value, onChange, readOnly, disabled, ...props }, ref) => {
-    const theme = (0, app_1.useTheme)();
+const theme_1 = require("../theme");
+exports.Rating = (0, react_1.memo)(({ color = '#FFCC00', size, count = 5, renderStar = (0, jsx_runtime_1.jsx)(icons_1.StarFilled, {}), allowHalf, highlightSelectedOnly, 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);
     const [hovering, setHovering] = (0, react_1.useState)(0);
@@ -59,5 +59,5 @@ exports.Rating = (0, react_1.memo)((0, react_1.forwardRef)(({ color = '#FFCC00',
                             : renderStar), (0, jsx_runtime_1.jsx)("div", { className: rating_style_1.classes.starBefore, onPointerEnter: () => enterHandler(index, true), onClick: () => clickHandler(index, true) }), (0, jsx_runtime_1.jsx)("div", { className: rating_style_1.classes.starAfter, onPointerEnter: () => enterHandler(index, false), onClick: () => clickHandler(index, false) })] }, index));
         });
     };
-    return ((0, jsx_runtime_1.jsx)("div", { ...props, ref: ref, css: (0, rating_style_1.useStyle)({ color }), className: (0, utils_1.classnames)(rating_style_1.classes.root, props.className), "data-size": size, "data-read-only": readOnly, "data-disabled": disabled, onPointerLeave: leaveHandler, children: renderStarFn() }));
-}));
+    return ((0, jsx_runtime_1.jsx)("div", { ...props, css: (0, rating_style_1.useStyle)({ color }), className: (0, utils_1.classnames)(rating_style_1.classes.root, props.className), "data-size": size, "data-read-only": readOnly, "data-disabled": disabled, onPointerLeave: leaveHandler, children: renderStarFn() }));
+});

package/dist/cjs/components/resizable/resizable.d.ts

@@ -1,25 +1,38 @@
+import { CSSProperties } from 'react';
 import { ColorPropsValue, DIVProps, Placement } from '../../../types';
 import { DraggableOptions } from '../../utils';
-export type Handle = Placement | 't' | 'r' | 'b' | 'l' | 'tl' | 'tr' | 'br' | 'bl' | 'lt' | 'rt' | 'lb' | 'rb';
+type HandleAbbr = 't' | 'r' | 'b' | 'l' | 'tl' | 'tr' | 'br' | 'bl' | 'lt' | 'rt' | 'lb' | 'rb';
+export type Handle = Placement | HandleAbbr;
 export interface ResizableProps extends Omit<DIVProps, 'onResize'> {
-    /** @default "mouse" */
+    /** 默认为`mouse` */
     variant?: 'mouse' | 'touch';
     /** 使用的拖拽把手，默认全部生效。注意：使用“角把手”会同时渲染对应的两个“边把手”。 */
     handles?: Handle | Handle[];
     /**
      * 拖拽把手的尺寸
-     * {@link variant}为"mouse"时，@default 8
-     * {@link variant}为"touch"时，@default 12
+     * @enum {@link variant}为`mouse`时，默认为`8`
+     * @enum {@link variant}为`touch`时，默认为`12`
      */
     handleSize?: number;
-    /** 拖拽把手颜色，@default "secondary" */
+    /** 拖拽把手颜色，默认为`secondary` */
     handleColor?: ColorPropsValue;
-    /** {@link variant}为"touch"时生效，@default "outside" */
+    /** {@link variant}为`touch`时生效，默认为`outside` */
     handlePosition?: 'outside' | 'inside';
-    /** 是否固定长宽比例，@default false */
+    /** 是否固定长宽比例，默认为`false` */
     fixedRatio?: boolean;
     onResize?(width: number, height: number): void;
     onResizeEnd?(width: number, height: number): void;
     draggableOptions?: DraggableOptions<HTMLDivElement>;
+    /** 受控的尺寸 */
+    defaultWidth?: CSSProperties['width'];
+    defaultHeight?: CSSProperties['height'];
+    width?: CSSProperties['width'];
+    height?: CSSProperties['height'];
+    /** 设定尺寸限制 */
+    minWidth?: CSSProperties['minWidth'];
+    minHeight?: CSSProperties['minHeight'];
+    maxWidth?: CSSProperties['maxWidth'];
+    maxHeight?: CSSProperties['maxHeight'];
 }
-export declare const Resizable: import("react").ForwardRefExoticComponent<Omit<ResizableProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare function Resizable({ ref, variant, handles, handleSize, handleColor, handlePosition, fixedRatio, onResize, onResizeEnd, draggableOptions, defaultWidth, defaultHeight, width, height, minWidth, minHeight, maxWidth, maxHeight, ...props }: ResizableProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};