@ringcentral/juno 2.46.0 → 3.0.0-alpha.1

package/components/Buttons/IconButton/IconButton.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.RcIconButton = void 0;
 var tslib_1 = require("tslib");
 var react_1 = tslib_1.__importStar(require("react"));
 var clsx_1 = tslib_1.__importDefault(require("clsx"));
@@ -10,21 +11,21 @@ var ButtonBase_1 = require("../ButtonBase");
 var IconButtonProps_1 = require("./deprecated/IconButtonProps");
 var styles_1 = require("./styles");
 var utils_1 = require("./utils");
-var _RcIconButton = react_1.memo(react_1.forwardRef(function (props, ref) {
+var _RcIconButton = (0, react_1.memo)((0, react_1.forwardRef)(function (props, ref) {
     var _a;
     if (process.env.NODE_ENV !== 'production') {
         // eslint-disable-next-line react-hooks/rules-of-hooks
-        foundation_1.useDeprecatedCheck(RcIconButton, props, IconButtonProps_1.rcIconButtonWarning);
+        (0, foundation_1.useDeprecatedCheck)(RcIconButton, props, IconButtonProps_1.rcIconButtonWarning);
     }
     var _b = props.buttonRef, buttonRef = _b === void 0 ? ref : _b, _c = props.IconProps, IconProps = _c === void 0 ? {} : _c, className = props.className, classesProp = props.classes, children = props.children, title = props.title, disabledFakeBorder = props.disabledFakeBorder, symbol = props.symbol, disabled = props.disabled, invisible = props.invisible, type = props.type, loading = props.loading, TouchRippleProps = props.TouchRippleProps, variant = props.variant, CircularProgressProps = props.CircularProgressProps, color = props.color, shouldPersistBg = props.shouldPersistBg, stretchIcon = props.stretchIcon, iconColor = props.iconColor, iconSize = props.iconSize, disableTouchRipple = props.disableTouchRipple, useColorWhenDisabled = props.useColorWhenDisabled, size = props.size, radius = props.radius, elevation = props.elevation, activeElevation = props.activeElevation, aRef = props.aRef, tooltipTitle = props.tooltipTitle, tooltipForceHide = props.tooltipForceHide, disableToolTip = props.disableToolTip, alwaysEnableTooltip = props.alwaysEnableTooltip, tooltipPlacement = props.tooltipPlacement, ariaLabel = props.ariaLabel, popperProps = props.popperProps, externalLink = props.externalLink, download = props.download, href = props.href, focusVariant = props.focusVariant, rest = tslib_1.__rest(props, ["buttonRef", "IconProps", "className", "classes", "children", "title", "disabledFakeBorder", "symbol", "disabled", "invisible", "type", "loading", "TouchRippleProps", "variant", "CircularProgressProps", "color", "shouldPersistBg", "stretchIcon", "iconColor", "iconSize", "disableTouchRipple", "useColorWhenDisabled", "size", "radius", "elevation", "activeElevation", "aRef", "tooltipTitle", "tooltipForceHide", "disableToolTip", "alwaysEnableTooltip", "tooltipPlacement", "ariaLabel", "popperProps", "externalLink", "download", "href", "focusVariant"]);
-    var theme = foundation_1.useTheme();
+    var theme = (0, foundation_1.useTheme)();
     var isOutline = variant === 'outline';
     var isContained = variant === 'contained';
     var isInverse = variant === 'inverse';
     var isPlain = variant === 'plain';
     var isRound = variant === 'round';
-    var classes = react_1.useMemo(function () { return foundation_1.combineClasses(utils_1.RcIconButtonClasses, classesProp); }, [classesProp]);
-    var IconClassName = clsx_1.default(className, classes.root, (_a = {},
+    var classes = (0, react_1.useMemo)(function () { return (0, foundation_1.combineClasses)(utils_1.RcIconButtonClasses, classesProp); }, [classesProp]);
+    var IconClassName = (0, clsx_1.default)(className, classes.root, (_a = {},
         _a[classes.disabled] = disabled,
         _a[classes.invisible] = invisible,
         _a[classes.outline] = isOutline,
@@ -38,7 +39,7 @@ var _RcIconButton = react_1.memo(react_1.forwardRef(function (props, ref) {
         // eslint-disable-next-line @typescript-eslint/no-shadow
         var color = IconProps.color, IconPropsWithoutColor = tslib_1.__rest(IconProps, ["color"]);
         var icon = react_1.default.isValidElement(children) || children === '' ? children : (react_1.default.createElement(Icon_1.RcIcon, tslib_1.__assign({ symbol: symbol, className: classes.icon, loading: loading, size: "inherit", CircularProgressProps: CircularProgressProps }, IconPropsWithoutColor), children));
-        var iconButton = (react_1.default.createElement(ButtonBase_1.RcButtonBase, tslib_1.__assign({ ref: buttonRef, disableRipple: ((_b = (_a = theme.props) === null || _a === void 0 ? void 0 : _a.MuiButtonBase) === null || _b === void 0 ? void 0 : _b.disableRipple) || isPlain, type: type, disabled: disabled, "aria-label": ariaLabel || tooltipTitle || title, title: title, "aria-disabled": disabled, className: IconClassName, TouchRippleProps: foundation_1.combineProps({
+        var iconButton = (react_1.default.createElement(ButtonBase_1.RcButtonBase, tslib_1.__assign({ ref: buttonRef, disableRipple: ((_b = (_a = theme.props) === null || _a === void 0 ? void 0 : _a.MuiButtonBase) === null || _b === void 0 ? void 0 : _b.disableRipple) || isPlain, type: type, disabled: disabled, "aria-label": ariaLabel || tooltipTitle || title, title: title, "aria-disabled": disabled, className: IconClassName, TouchRippleProps: (0, foundation_1.combineProps)({
                 classes: utils_1.RcIconButtonTouchRippleClasses,
             }, TouchRippleProps) }, rest), icon));
         if (download && href) {
@@ -55,21 +56,13 @@ var _RcIconButton = react_1.memo(react_1.forwardRef(function (props, ref) {
     }
     return iconButton;
 }));
-var RcIconButton = foundation_1.styled(Tooltip_1.withTooltip(_RcIconButton)).attrs(function (inProps) {
-    var _a = foundation_1.useThemeProps({ props: inProps, name: 'RcIconButton' }), 
+var RcIconButton = (0, foundation_1.styled)((0, Tooltip_1.withTooltip)(_RcIconButton)).attrs(function (inProps) {
+    var _a = (0, foundation_1.useThemeProps)({ props: inProps, name: 'RcIconButton' }), 
     // @ts-ignore
     theme = _a.theme, 
     // Omit className, prevent duplicate className
     className = _a.className, _b = _a.variant, variant = _b === void 0 ? 'round' : _b, _c = _a.color, color = _c === void 0 ? 'neutral.f04' : _c, _d = _a.size, size = _d === void 0 ? 'medium' : _d, _e = _a.type, type = _e === void 0 ? 'button' : _e, _f = _a.focusRipple, focusRipple = _f === void 0 ? true : _f, _g = _a.disableTouchRipple, disableTouchRipple = _g === void 0 ? true : _g, _h = _a.classes, classes = _h === void 0 ? {} : _h, _j = _a.useRcTooltip, useRcTooltip = _j === void 0 ? true : _j, _k = _a.focusVariant, focusVariant = _k === void 0 ? 'highlight' : _k, rest = tslib_1.__rest(_a, ["theme", "className", "variant", "color", "size", "type", "focusRipple", "disableTouchRipple", "classes", "useRcTooltip", "focusVariant"]);
-    return tslib_1.__assign({ variant: variant,
-        color: color,
-        size: size,
-        type: type,
-        focusRipple: focusRipple,
-        disableTouchRipple: disableTouchRipple,
-        classes: classes,
-        useRcTooltip: useRcTooltip,
-        focusVariant: focusVariant }, rest);
+    return tslib_1.__assign({ variant: variant, color: color, size: size, type: type, focusRipple: focusRipple, disableTouchRipple: disableTouchRipple, classes: classes, useRcTooltip: useRcTooltip, focusVariant: focusVariant }, rest);
 })(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), styles_1.iconButtonStyle);
 exports.RcIconButton = RcIconButton;
 RcIconButton.displayName = 'RcIconButton';

package/components/Buttons/IconButton/deprecated/IconButtonProps.d.ts

@@ -4,14 +4,14 @@ import { PopperProps as MuiPopperProps } from '@material-ui/core/Popper';
 import { TooltipProps as MuiTooltipProps } from '@material-ui/core/Tooltip';
 import { RcBaseProps, RcBaseSize, RcPaletteProp } from '../../../../foundation';
 import { RcIconProps } from '../../../Icon';
-declare type RcIconButtonVariant = 'round' | 'plain' | 'inverse' | 'outline';
-declare type RcIconButtonSize = RcBaseSize<'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'xxxlarge'>
+type RcIconButtonVariant = 'round' | 'plain' | 'inverse' | 'outline';
+type RcIconButtonSize = RcBaseSize<'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'xxxlarge'>
 /** @deprecated please use xsmall */
  | 'tiny';
-declare type RcIconButtonClassKey = 'root' | 'ripple' | 'disabled' | 'invisible' | 'outline';
+type RcIconButtonClassKey = 'root' | 'ripple' | 'disabled' | 'invisible' | 'outline';
 interface RcIconButtonBaseProps extends MuiStandardProps<React.ButtonHTMLAttributes<HTMLButtonElement>, RcIconButtonClassKey> {
 }
-declare type RcIconButtonProps = RcIconButtonBaseProps & {
+type RcIconButtonProps = RcIconButtonBaseProps & {
     classes?: {
         /** define class for the button */
         root?: string;
@@ -44,7 +44,7 @@ declare type RcIconButtonProps = RcIconButtonBaseProps & {
     type?: 'button' | 'reset' | 'submit';
     as?: ElementType | keyof JSX.IntrinsicElements;
 } & RcIconButtonDeprecatedProps & RcBaseProps<RcIconProps, 'color' | 'children' | 'size'>;
-declare type RcIconButtonDeprecatedProps = {
+type RcIconButtonDeprecatedProps = {
     /**
      * @deprecated
      * enable tooltip even button is disabled. default with false

package/components/Buttons/IconButton/deprecated/IconButtonProps.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.rcIconButtonWarning = void 0;
 var rcIconButtonWarning = [
     {
         prop: 'autoFocus',

package/components/Buttons/IconButton/styles/StyledIconButton.d.ts

@@ -1,9 +1,9 @@
 import { RcTheme, RcThemedStyled } from '../../../../foundation';
 import { RcIconButtonProps } from '../IconButton';
 export declare const getFocusVisibleInsetSize: RcThemedStyled<RcIconButtonProps, any>;
-declare type PlainIconButtonFocusStyleOption = {
+type PlainIconButtonFocusStyleOption = {
     radius?: keyof RcTheme['radius'];
 };
-export declare const plainIconButtonFocusStyle: ({ radius: radiusProp, }?: PlainIconButtonFocusStyleOption) => import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<RcIconButtonProps, RcTheme>>[];
+export declare const plainIconButtonFocusStyle: ({ radius: radiusProp, }?: PlainIconButtonFocusStyleOption) => import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<RcTheme>>;
 export declare const iconButtonStyle: RcThemedStyled<RcIconButtonProps, any>;
 export {};

package/components/Buttons/IconButton/styles/StyledIconButton.js

@@ -1,24 +1,27 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.iconButtonStyle = exports.plainIconButtonFocusStyle = exports.getFocusVisibleInsetSize = void 0;
 var tslib_1 = require("tslib");
 var foundation_1 = require("../../../../foundation");
 var utils_1 = require("../utils");
-exports.getFocusVisibleInsetSize = function (_a) {
+var getFocusVisibleInsetSize = function (_a) {
     var size = _a.size;
     var inset = utils_1.RcIconButtonFocusVisibleInsetSize[size];
-    return foundation_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n      top: -", "px;\n      right: -", "px;\n      bottom: -", "px;\n      left: -", "px;\n    "], ["\n      top: -", "px;\n      right: -", "px;\n      bottom: -", "px;\n      left: -", "px;\n    "])), inset, inset, inset, inset);
+    return (0, foundation_1.css)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n      top: -", "px;\n      right: -", "px;\n      bottom: -", "px;\n      left: -", "px;\n    "], ["\n      top: -", "px;\n      right: -", "px;\n      bottom: -", "px;\n      left: -", "px;\n    "])), inset, inset, inset, inset);
 };
+exports.getFocusVisibleInsetSize = getFocusVisibleInsetSize;
 var containedVariantTransitions = function (_a) {
     var theme = _a.theme;
     return theme.transitions.create(['background-color', 'box-shadow', 'border'], {
         duration: theme.transitions.duration.short,
     });
 };
-exports.plainIconButtonFocusStyle = function (_a) {
-    var _b = (_a === void 0 ? {} : _a).radius, radiusProp = _b === void 0 ? 'circle' : _b;
-    return foundation_1.css(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  &:after {\n    content: '';\n    position: absolute;\n    ", ";\n    box-shadow: 0 0 0 2px ", ";\n    border-radius: ", ";\n    pointer-events: none;\n    z-index: 1;\n  }\n"], ["\n  &:after {\n    content: '';\n    position: absolute;\n    ", ";\n    box-shadow: 0 0 0 2px ", ";\n    border-radius: ", ";\n    pointer-events: none;\n    z-index: 1;\n  }\n"])), exports.getFocusVisibleInsetSize, foundation_1.focusVisibleColor, foundation_1.radius(radiusProp));
+var plainIconButtonFocusStyle = function (_a) {
+    var _b = _a === void 0 ? {} : _a, _c = _b.radius, radiusProp = _c === void 0 ? 'circle' : _c;
+    return (0, foundation_1.css)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  &:after {\n    content: '';\n    position: absolute;\n    ", ";\n    box-shadow: 0 0 0 2px ", ";\n    border-radius: ", ";\n    pointer-events: none;\n    z-index: 1;\n  }\n"], ["\n  &:after {\n    content: '';\n    position: absolute;\n    ", ";\n    box-shadow: 0 0 0 2px ", ";\n    border-radius: ", ";\n    pointer-events: none;\n    z-index: 1;\n  }\n"])), exports.getFocusVisibleInsetSize, foundation_1.focusVisibleColor, (0, foundation_1.radius)(radiusProp));
 };
-exports.iconButtonStyle = function (_a) {
+exports.plainIconButtonFocusStyle = plainIconButtonFocusStyle;
+var iconButtonStyle = function (_a) {
     var variant = _a.variant, size = _a.size, stretchIcon = _a.stretchIcon, color = _a.color, disabled = _a.disabled, useColorWhenDisabled = _a.useColorWhenDisabled, shouldPersistBg = _a.shouldPersistBg, radiusProp = _a.radius, disableRipple = _a.disableRipple, elevation = _a.elevation, disabledFakeBorder = _a.disabledFakeBorder, activeElevation = _a.activeElevation, _b = _a.IconProps, IconProps = _b === void 0 ? {} : _b, focusVariant = _a.focusVariant;
     var iconColor = IconProps.color;
     var useFocusRing = focusVariant === 'focusRing';
@@ -29,45 +32,35 @@ exports.iconButtonStyle = function (_a) {
     var isOutline = variant === 'outline';
     var isContained = variant === 'contained';
     var isRound = variant === 'round';
-    var containerSize = foundation_1.px(isPlain ? iconSize : iconSize * 2);
-    var mainColor = foundation_1.getParsePaletteColor(color);
+    var containerSize = (0, foundation_1.px)(isPlain ? iconSize : iconSize * 2);
+    var mainColor = (0, foundation_1.getParsePaletteColor)(color);
     var containedColor = iconColor
-        ? foundation_1.getParsePaletteColor(iconColor)
-        : foundation_1.paletteContrastText(mainColor);
+        ? (0, foundation_1.getParsePaletteColor)(iconColor)
+        : (0, foundation_1.paletteContrastText)(mainColor);
     var currRadius = radiusProp || (isOutline ? 'lg' : isCircle ? 'circle' : 'zero');
-    var persistBgColor = foundation_1.setOpacity(mainColor, isInverse ? '16' : '12');
-    var defaultShadow = isContained ? foundation_1.shadows('1') : undefined;
-    var nowShadow = elevation !== undefined ? foundation_1.shadows(elevation) : defaultShadow;
-    var radiusValue = foundation_1.radius(currRadius);
+    var persistBgColor = (0, foundation_1.setOpacity)(mainColor, isInverse ? '16' : '12');
+    var defaultShadow = isContained ? (0, foundation_1.shadows)('1') : undefined;
+    var nowShadow = elevation !== undefined ? (0, foundation_1.shadows)(elevation) : defaultShadow;
+    var radiusValue = (0, foundation_1.radius)(currRadius);
     var contrastColorBorder = !disabledFakeBorder &&
-        foundation_1.fakeBorder({
-            color: foundation_1.palette2('highContrast'),
+        (0, foundation_1.fakeBorder)({
+            color: (0, foundation_1.palette2)('highContrast'),
             radius: currRadius,
             pseudo: true,
         });
-    return foundation_1.css(templateObject_8 || (templateObject_8 = tslib_1.__makeTemplateObject(["\n    display: inline-flex;\n    justify-content: center;\n    align-items: center;\n\n    width: ", ";\n    height: ", ";\n    color: ", ";\n    border-radius: ", ";\n    transition: ", ";\n    cursor: ", ";\n    background-color: ", ";\n    box-shadow: ", ";\n\n    ", ";\n\n    font-size: ", ";\n\n    ", " {\n      &:hover {\n        background-color: ", ";\n\n        color: ", ";\n      }\n    }\n\n    &:active {\n      color: ", ";\n    }\n\n    ", " {\n      background-color: ", ";\n\n      ", "\n\n      &:active {\n        color: ", ";\n      }\n\n      ", ";\n    }\n\n    &.", " {\n      background-color: ", ";\n    }\n\n    &.", " {\n      color: ", ";\n\n      background-color: ", ";\n    }\n\n    &.", " {\n      opacity: 0;\n      visibility: hidden;\n      width: 0;\n      height: 0;\n    }\n\n    &.", " {\n      border: 1px solid ", ";\n    }\n\n    &.", " {\n      color: ", ";\n      background-color: ", ";\n\n      &.", " {\n        ", "\n      }\n\n      &:before {\n        content: '';\n        left: 0;\n        right: 0;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n        border-radius: ", ";\n        position: absolute;\n      }\n\n      ", ";\n\n      ", " {\n        &:hover {\n          &:before {\n            background-color: ", ";\n          }\n\n          color: ", ";\n        }\n      }\n\n      ", " {\n        &:before {\n          background-color: ", ";\n        }\n\n        color: ", ";\n      }\n\n      &:active {\n        ", "\n\n        color: ", ";\n      }\n    }\n\n    &.", " {\n      ", ";\n    }\n\n    .", " {\n      border-radius: 0;\n      animation-name: none;\n      opacity: 0;\n    }\n\n    ", "\n  "], ["\n    display: inline-flex;\n    justify-content: center;\n    align-items: center;\n\n    width: ", ";\n    height: ", ";\n    color: ", ";\n    border-radius: ", ";\n    transition: ", ";\n    cursor: ", ";\n    background-color: ", ";\n    box-shadow: ", ";\n\n    ",
-        ";\n\n    font-size: ",
-        ";\n\n    ", " {\n      &:hover {\n        background-color: ",
-        ";\n\n        color: ", ";\n      }\n    }\n\n    &:active {\n      color: ", ";\n    }\n\n    ", " {\n      background-color: ",
-        ";\n\n      ",
-        "\n\n      &:active {\n        color: ", ";\n      }\n\n      ", ";\n    }\n\n    &.", " {\n      background-color: ", ";\n    }\n\n    &.", " {\n      color: ",
-        ";\n\n      background-color: ", ";\n    }\n\n    &.", " {\n      opacity: 0;\n      visibility: hidden;\n      width: 0;\n      height: 0;\n    }\n\n    &.", " {\n      border: 1px solid ", ";\n    }\n\n    &.", " {\n      color: ", ";\n      background-color: ", ";\n\n      &.", " {\n        ",
-        "\n      }\n\n      &:before {\n        content: '';\n        left: 0;\n        right: 0;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n        border-radius: ", ";\n        position: absolute;\n      }\n\n      ", ";\n\n      ", " {\n        &:hover {\n          &:before {\n            background-color: ", ";\n          }\n\n          color: ", ";\n        }\n      }\n\n      ", " {\n        &:before {\n          background-color: ", ";\n        }\n\n        color: ", ";\n      }\n\n      &:active {\n        ",
-        "\n\n        color: ", ";\n      }\n    }\n\n    &.", " {\n      ", ";\n    }\n\n    .", " {\n      border-radius: 0;\n      animation-name: none;\n      opacity: 0;\n    }\n\n    "
+    return (0, foundation_1.css)(templateObject_8 || (templateObject_8 = tslib_1.__makeTemplateObject(["\n    display: inline-flex;\n    justify-content: center;\n    align-items: center;\n\n    width: ", ";\n    height: ", ";\n    color: ", ";\n    border-radius: ", ";\n    transition: ", ";\n    cursor: ", ";\n    background-color: ", ";\n    box-shadow: ", ";\n\n    ", ";\n\n    font-size: ", ";\n\n    ", " {\n      &:hover {\n        background-color: ", ";\n\n        color: ", ";\n      }\n    }\n\n    &:active {\n      color: ", ";\n    }\n\n    ", " {\n      background-color: ", ";\n\n      ", "\n\n      &:active {\n        color: ", ";\n      }\n\n      ", ";\n    }\n\n    &.", " {\n      background-color: ", ";\n    }\n\n    &.", " {\n      color: ", ";\n\n      background-color: ", ";\n    }\n\n    &.", " {\n      opacity: 0;\n      visibility: hidden;\n      width: 0;\n      height: 0;\n    }\n\n    &.", " {\n      border: 1px solid ", ";\n    }\n\n    &.", " {\n      color: ", ";\n      background-color: ", ";\n\n      &.", " {\n        ", "\n      }\n\n      &:before {\n        content: '';\n        left: 0;\n        right: 0;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n        border-radius: ", ";\n        position: absolute;\n      }\n\n      ", ";\n\n      ", " {\n        &:hover {\n          &:before {\n            background-color: ", ";\n          }\n\n          color: ", ";\n        }\n      }\n\n      ", " {\n        &:before {\n          background-color: ", ";\n        }\n\n        color: ", ";\n      }\n\n      &:active {\n        ", "\n\n        color: ", ";\n      }\n    }\n\n    &.", " {\n      ", ";\n    }\n\n    .", " {\n      border-radius: 0;\n      animation-name: none;\n      opacity: 0;\n    }\n\n    ", "\n  "], ["\n    display: inline-flex;\n    justify-content: center;\n    align-items: center;\n\n    width: ", ";\n    height: ", ";\n    color: ", ";\n    border-radius: ", ";\n    transition: ", ";\n    cursor: ", ";\n    background-color: ", ";\n    box-shadow: ", ";\n\n    ", ";\n\n    font-size: ", ";\n\n    ", " {\n      &:hover {\n        background-color: ", ";\n\n        color: ", ";\n      }\n    }\n\n    &:active {\n      color: ", ";\n    }\n\n    ", " {\n      background-color: ", ";\n\n      ", "\n\n      &:active {\n        color: ", ";\n      }\n\n      ", ";\n    }\n\n    &.", " {\n      background-color: ", ";\n    }\n\n    &.", " {\n      color: ", ";\n\n      background-color: ", ";\n    }\n\n    &.", " {\n      opacity: 0;\n      visibility: hidden;\n      width: 0;\n      height: 0;\n    }\n\n    &.", " {\n      border: 1px solid ", ";\n    }\n\n    &.", " {\n      color: ", ";\n      background-color: ", ";\n\n      &.", " {\n        ", "\n      }\n\n      &:before {\n        content: '';\n        left: 0;\n        right: 0;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n        border-radius: ", ";\n        position: absolute;\n      }\n\n      ", ";\n\n      ", " {\n        &:hover {\n          &:before {\n            background-color: ", ";\n          }\n\n          color: ", ";\n        }\n      }\n\n      ", " {\n        &:before {\n          background-color: ", ";\n        }\n\n        color: ", ";\n      }\n\n      &:active {\n        ", "\n\n        color: ", ";\n      }\n    }\n\n    &.", " {\n      ", ";\n    }\n\n    .", " {\n      border-radius: 0;\n      animation-name: none;\n      opacity: 0;\n    }\n\n    "
         /**
          * that is equilateral triangle, the third Side length is
          * Math.sqrt(2) = 1.414213562373095, so we scale that
          * to make that full with this square
          */
-        ,
-        "\n  "])), containerSize, containerSize, mainColor, radiusValue, foundation_1.backgroundTransition, disabled ? 'default' : 'pointer', (shouldPersistBg || isInverse) && persistBgColor, nowShadow, nowShadow && foundation_1.css(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n      transition: ", ";\n\n      &:active {\n        box-shadow: ", ";\n      }\n    "], ["\n      transition: ", ";\n\n      &:active {\n        box-shadow: ",
-        ";\n      }\n    "])), containedVariantTransitions, foundation_1.shadows(activeElevation !== null && activeElevation !== void 0 ? activeElevation : (elevation ? Math.min(+elevation + 11, 24) : '12'))), stretchIcon
+        , "\n  "])), containerSize, containerSize, mainColor, radiusValue, foundation_1.backgroundTransition, disabled ? 'default' : 'pointer', (shouldPersistBg || isInverse) && persistBgColor, nowShadow, nowShadow && (0, foundation_1.css)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n      transition: ", ";\n\n      &:active {\n        box-shadow: ", ";\n      }\n    "], ["\n      transition: ", ";\n\n      &:active {\n        box-shadow: ", ";\n      }\n    "])), containedVariantTransitions, (0, foundation_1.shadows)(activeElevation !== null && activeElevation !== void 0 ? activeElevation : (elevation ? Math.min(+elevation + 11, 24) : '12'))), stretchIcon
         ? containerSize
-        : foundation_1.px(isOutline
+        : (0, foundation_1.px)(isOutline
             ? iconSize * 1.2 // keep size same as before
             : iconSize), foundation_1.nonTouchHoverMedia, isPlain
         ? 'transparent'
-        : foundation_1.setOpacity(mainColor, isInverse ? '24' : '08'), foundation_1.setOpacity(mainColor, '88'), mainColor, foundation_1.focusVisible, function () {
+        : (0, foundation_1.setOpacity)(mainColor, isInverse ? '24' : '08'), (0, foundation_1.setOpacity)(mainColor, '88'), mainColor, foundation_1.focusVisible, function () {
         if (useFocusRing) {
             if (isRound)
                 return 'transparent';
@@ -77,23 +70,24 @@ exports.iconButtonStyle = function (_a) {
         if (isPlain)
             return 'transparent';
         if (isInverse)
-            return foundation_1.setOpacity(mainColor, '32');
-        return foundation_1.setOpacity(mainColor, '16');
+            return (0, foundation_1.setOpacity)(mainColor, '32');
+        return (0, foundation_1.setOpacity)(mainColor, '16');
     }, useFocusRing &&
         (isRound || isInverse) &&
-        foundation_1.focusRing('inset', { borderRadius: currRadius }), foundation_1.setOpacity(mainColor, '88'), isPlain && exports.plainIconButtonFocusStyle({ radius: currRadius }), utils_1.RcIconButtonClasses.persistBg, persistBgColor, utils_1.RcIconButtonClasses.disabled, useColorWhenDisabled
-        ? foundation_1.setOpacity(mainColor, '32')
-        : foundation_1.palette2('disabled', 'f02'), isInverse && foundation_1.setOpacity(mainColor, '12'), utils_1.RcIconButtonClasses.invisible, utils_1.RcIconButtonClasses.outline, foundation_1.palette2('neutral', 'l03'), utils_1.RcIconButtonClasses.contained, containedColor, mainColor, utils_1.RcIconButtonClasses.disabled, function () {
+        (0, foundation_1.focusRing)('inset', { borderRadius: currRadius }), (0, foundation_1.setOpacity)(mainColor, '88'), isPlain && (0, exports.plainIconButtonFocusStyle)({ radius: currRadius }), utils_1.RcIconButtonClasses.persistBg, persistBgColor, utils_1.RcIconButtonClasses.disabled, useColorWhenDisabled
+        ? (0, foundation_1.setOpacity)(mainColor, '32')
+        : (0, foundation_1.palette2)('disabled', 'f02'), isInverse && (0, foundation_1.setOpacity)(mainColor, '12'), utils_1.RcIconButtonClasses.invisible, utils_1.RcIconButtonClasses.outline, (0, foundation_1.palette2)('neutral', 'l03'), utils_1.RcIconButtonClasses.contained, containedColor, mainColor, utils_1.RcIconButtonClasses.disabled, function () {
         if (useColorWhenDisabled)
-            return foundation_1.css(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n              color: ", ";\n              background-color: ", ";\n              opacity: ", ";\n            "], ["\n              color: ", ";\n              background-color: ", ";\n              opacity: ", ";\n            "])), containedColor, mainColor, foundation_1.opacity('32'));
-        return foundation_1.css(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n            background-color: ", ";\n            color: ", ";\n          "], ["\n            background-color: ", ";\n            color: ", ";\n          "])), foundation_1.palette2('disabled', 'b01'), foundation_1.palette2('disabled', 'f01'));
-    }, radiusValue, contrastColorBorder, foundation_1.nonTouchHoverMedia, foundation_1.setOpacity(containedColor, '08'), containedColor, foundation_1.focusVisible, foundation_1.setOpacity(containedColor, '16'), containedColor, disableRipple && foundation_1.css(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n          &:before {\n            background-color: ", ";\n          }\n        "], ["\n          &:before {\n            background-color: ", ";\n          }\n        "])), foundation_1.setOpacity(containedColor, '24')), containedColor, utils_1.RcIconButtonClasses.inverse, contrastColorBorder, utils_1.RcIconButtonTouchRippleClasses.ripplePulsate, 
+            return (0, foundation_1.css)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n              color: ", ";\n              background-color: ", ";\n              opacity: ", ";\n            "], ["\n              color: ", ";\n              background-color: ", ";\n              opacity: ", ";\n            "])), containedColor, mainColor, (0, foundation_1.opacity)('32'));
+        return (0, foundation_1.css)(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n            background-color: ", ";\n            color: ", ";\n          "], ["\n            background-color: ", ";\n            color: ", ";\n          "])), (0, foundation_1.palette2)('disabled', 'b01'), (0, foundation_1.palette2)('disabled', 'f01'));
+    }, radiusValue, contrastColorBorder, foundation_1.nonTouchHoverMedia, (0, foundation_1.setOpacity)(containedColor, '08'), containedColor, foundation_1.focusVisible, (0, foundation_1.setOpacity)(containedColor, '16'), containedColor, disableRipple && (0, foundation_1.css)(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n          &:before {\n            background-color: ", ";\n          }\n        "], ["\n          &:before {\n            background-color: ", ";\n          }\n        "])), (0, foundation_1.setOpacity)(containedColor, '24')), containedColor, utils_1.RcIconButtonClasses.inverse, contrastColorBorder, utils_1.RcIconButtonTouchRippleClasses.ripplePulsate, 
     /**
      * that is equilateral triangle, the third Side length is
      * Math.sqrt(2) = 1.414213562373095, so we scale that
      * to make that full with this square
      */
     !isPlain &&
-        !['circle', 'round'].includes(currRadius) && foundation_1.css(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["\n        .", " {\n          transform: scale(1.41421357);\n        }\n      "], ["\n        .", " {\n          transform: scale(1.41421357);\n        }\n      "])), utils_1.RcIconButtonTouchRippleClasses.child));
+        !['circle', 'round'].includes(currRadius) && (0, foundation_1.css)(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["\n        .", " {\n          transform: scale(1.41421357);\n        }\n      "], ["\n        .", " {\n          transform: scale(1.41421357);\n        }\n      "])), utils_1.RcIconButtonTouchRippleClasses.child));
 };
+exports.iconButtonStyle = iconButtonStyle;
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;

package/components/Buttons/IconButton/utils/IconButtonUtils.d.ts

@@ -1,6 +1,6 @@
 import { UnitMap } from '../../../../foundation';
 import { RcIconButtonSize } from '../IconButton';
-export declare const RcIconButtonClasses: Partial<UnitMap<"round" | "root" | "disabled" | "focusVisible" | "invisible" | "outline" | "contained" | "inverse" | "icon" | "persistBg", any>>;
+export declare const RcIconButtonClasses: Partial<UnitMap<"icon" | import("@material-ui/core").ButtonBaseClassKey | "round" | "inverse" | "outline" | "invisible" | "contained" | "persistBg", any>>;
 export declare const RcIconButtonTouchRippleClasses: Partial<UnitMap<import("@material-ui/core/ButtonBase/TouchRipple").TouchRippleClassKey, any>>;
-export declare const RcIconButtonSizes: Record<"small" | "xsmall" | "medium" | "large" | "xlarge" | "xxlarge" | "xxxlarge", number>;
+export declare const RcIconButtonSizes: Record<NonNullable<RcIconButtonSize | undefined>, number>;
 export declare const RcIconButtonFocusVisibleInsetSize: UnitMap<RcIconButtonSize, number>;

package/components/Buttons/IconButton/utils/IconButtonUtils.js

@@ -1,8 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.RcIconButtonFocusVisibleInsetSize = exports.RcIconButtonSizes = exports.RcIconButtonTouchRippleClasses = exports.RcIconButtonClasses = void 0;
 var foundation_1 = require("../../../../foundation");
 var utils_1 = require("../../../Icon/utils");
-exports.RcIconButtonClasses = foundation_1.RcClasses([
+exports.RcIconButtonClasses = (0, foundation_1.RcClasses)([
     'root',
     'disabled',
     'invisible',
@@ -12,8 +13,8 @@ exports.RcIconButtonClasses = foundation_1.RcClasses([
     'round',
     'persistBg',
 ], 'RcIconButton');
-exports.RcIconButtonTouchRippleClasses = foundation_1.RcClasses(['ripplePulsate', 'child'], 'RcIconButtonTouchRipple');
-exports.RcIconButtonSizes = foundation_1.omit(utils_1.RcIconSizes, ['inherit']);
+exports.RcIconButtonTouchRippleClasses = (0, foundation_1.RcClasses)(['ripplePulsate', 'child'], 'RcIconButtonTouchRipple');
+exports.RcIconButtonSizes = (0, foundation_1.omit)(utils_1.RcIconSizes, ['inherit']);
 exports.RcIconButtonFocusVisibleInsetSize = {
     xxxlarge: 6,
     xxlarge: 5,

package/components/Buttons/IconButtonGroup/IconButtonGroup.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { RcBaseDirection, RcTheme } from '../../../foundation';
-declare type RcIconButtonGroupProps = {
+type RcIconButtonGroupProps = {
     /** radius token for `border-radius` */
     radius?: keyof RcTheme['radius'];
     /** Define the padding size of that group wrapper. */
@@ -17,8 +17,6 @@ declare type RcIconButtonGroupProps = {
 /**
  * provide IconButton group with wrapper
  */
-declare const RcIconButtonGroup: import("styled-components").StyledComponentClass<Pick<RcIconButtonGroupProps, "key" | "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "direction" | "radius" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "slot" | "title" | "translate" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "component" | "gap" | "space" | "isStopPropagation"> & React.RefAttributes<any>, RcTheme, Pick<Pick<RcIconButtonGroupProps, "key" | "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "direction" | "radius" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "slot" | "title" | "translate" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "component" | "gap" | "space" | "isStopPropagation"> & React.RefAttributes<any>, "ref" | "key" | "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "direction" | "radius" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "slot" | "title" | "translate" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "component" | "gap" | "space" | "isStopPropagation"> & {
-    theme?: RcTheme | undefined;
-}>;
+declare const RcIconButtonGroup: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<Omit<RcIconButtonGroupProps, "ref"> & React.RefAttributes<any>>, RcTheme, {}, never>;
 export { RcIconButtonGroup };
 export type { RcIconButtonGroupProps };

package/components/Buttons/IconButtonGroup/IconButtonGroup.js

@@ -1,21 +1,22 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.RcIconButtonGroup = void 0;
 var tslib_1 = require("tslib");
 var react_1 = tslib_1.__importStar(require("react"));
 var foundation_1 = require("../../../foundation");
 var styles_1 = require("./styles");
-var _RcIconButtonGroup = react_1.forwardRef(function (inProps, ref) {
-    var props = foundation_1.useThemeProps({ props: inProps, name: 'RcIconButtonGroup' });
+var _RcIconButtonGroup = (0, react_1.forwardRef)(function (inProps, ref) {
+    var props = (0, foundation_1.useThemeProps)({ props: inProps, name: 'RcIconButtonGroup' });
     var children = props.children, isStopPropagation = props.isStopPropagation, onClick = props.onClick, onKeyUp = props.onKeyUp, gap = props.gap, space = props.space, radius = props.radius, _a = props.component, Component = _a === void 0 ? 'div' : _a, rest = tslib_1.__rest(props, ["children", "isStopPropagation", "onClick", "onKeyUp", "gap", "space", "radius", "component"]);
-    var clickHandler = foundation_1.useEventCallback(function (event) {
+    var clickHandler = (0, foundation_1.useEventCallback)(function (event) {
         onClick === null || onClick === void 0 ? void 0 : onClick(event);
         isStopPropagation && event.stopPropagation();
     });
-    var handleOnKeyUp = foundation_1.useA11yKeyEvent(clickHandler, {
+    var handleOnKeyUp = (0, foundation_1.useA11yKeyEvent)(clickHandler, {
         preventDefault: false,
     });
     /** that button bar just for put buttons inside, and can stop below all events from this bar layer. */
-    var keyUpHandler = foundation_1.useEventCallback(function (event) {
+    var keyUpHandler = (0, foundation_1.useEventCallback)(function (event) {
         onKeyUp === null || onKeyUp === void 0 ? void 0 : onKeyUp(event);
         isStopPropagation && event.stopPropagation();
         handleOnKeyUp(event);
@@ -25,7 +26,7 @@ var _RcIconButtonGroup = react_1.forwardRef(function (inProps, ref) {
 /**
  * provide IconButton group with wrapper
  */
-var RcIconButtonGroup = foundation_1.styled(_RcIconButtonGroup)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), styles_1.IconButtonGroupStyle);
+var RcIconButtonGroup = (0, foundation_1.styled)(_RcIconButtonGroup)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), styles_1.IconButtonGroupStyle);
 exports.RcIconButtonGroup = RcIconButtonGroup;
 RcIconButtonGroup.defaultProps = {
     gap: 0,

package/components/Buttons/IconButtonGroup/styles/IconButtonGroupStyle.js

@@ -1,15 +1,16 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.IconButtonGroupStyle = void 0;
 var tslib_1 = require("tslib");
 var foundation_1 = require("../../../../foundation");
-exports.IconButtonGroupStyle = function (props) {
+var IconButtonGroupStyle = function (props) {
     var direction = props.direction, gap = props.gap, spaceProp = props.space, radiusProp = props.radius;
-    var gapSpace = gap && foundation_1.spacing(gap);
+    var gapSpace = gap && (0, foundation_1.spacing)(gap);
     var paddingValue = spaceProp &&
-        (spaceProp instanceof Array ? foundation_1.spacing.apply(void 0, tslib_1.__spread(spaceProp)) : foundation_1.spacing(spaceProp));
+        (spaceProp instanceof Array ? foundation_1.spacing.apply(void 0, tslib_1.__spreadArray([], tslib_1.__read(spaceProp), false)) : (0, foundation_1.spacing)(spaceProp));
     var isVertical = direction === 'vertical';
-    return foundation_1.css(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n      border-radius: ", ";\n      display: inline-flex;\n      flex-direction: ", ";\n      white-space: nowrap;\n      flex-wrap: nowrap;\n      flex-shrink: 0;\n      align-items: center;\n      padding: ", ";\n\n      > * + * {\n        ", ";\n      }\n    "], ["\n      border-radius: ", ";\n      display: inline-flex;\n      flex-direction: ", ";\n      white-space: nowrap;\n      flex-wrap: nowrap;\n      flex-shrink: 0;\n      align-items: center;\n      padding: ", ";\n\n      > * + * {\n        ",
-        ";\n      }\n    "])), radiusProp && foundation_1.radius(radiusProp), isVertical ? 'column' : 'row', paddingValue, isVertical
-        ? foundation_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n              margin-top: ", ";\n            "], ["\n              margin-top: ", ";\n            "])), gapSpace) : foundation_1.css(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n              margin-left: ", ";\n            "], ["\n              margin-left: ", ";\n            "])), gapSpace));
+    return (0, foundation_1.css)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n      border-radius: ", ";\n      display: inline-flex;\n      flex-direction: ", ";\n      white-space: nowrap;\n      flex-wrap: nowrap;\n      flex-shrink: 0;\n      align-items: center;\n      padding: ", ";\n\n      > * + * {\n        ", ";\n      }\n    "], ["\n      border-radius: ", ";\n      display: inline-flex;\n      flex-direction: ", ";\n      white-space: nowrap;\n      flex-wrap: nowrap;\n      flex-shrink: 0;\n      align-items: center;\n      padding: ", ";\n\n      > * + * {\n        ", ";\n      }\n    "])), radiusProp && (0, foundation_1.radius)(radiusProp), isVertical ? 'column' : 'row', paddingValue, isVertical
+        ? (0, foundation_1.css)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n              margin-top: ", ";\n            "], ["\n              margin-top: ", ";\n            "])), gapSpace) : (0, foundation_1.css)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n              margin-left: ", ";\n            "], ["\n              margin-left: ", ";\n            "])), gapSpace));
 };
+exports.IconButtonGroupStyle = IconButtonGroupStyle;
 var templateObject_1, templateObject_2, templateObject_3;

package/components/Buttons/SplitButton/SplitButton.d.ts

@@ -6,14 +6,14 @@ import { WithTooltipProps } from '../../Tooltip';
 import { RcButtonProps } from '../Button';
 import { RcButtonGroupProps } from '../ButtonGroup';
 import { RcIconButtonProps } from '../IconButton';
-declare type RcSplitButtonChildrenProps = {
+type RcSplitButtonChildrenProps = {
     onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
     children: ReactNode;
 } & WithTooltipProps;
-declare type CustomButtonProps = Partial<RcButtonProps & WithTooltipProps>;
-declare type RcSplitRoundButtonSpacingSize = UnionOmit<RcIconSize, 'inherit'>;
-declare type RcSplitButtonVariant = 'round' | 'plainIcon' | RcButtonProps['variant'];
-declare type RcSplitButtonProps = {
+type CustomButtonProps = Partial<RcButtonProps & WithTooltipProps>;
+type RcSplitRoundButtonSpacingSize = UnionOmit<RcIconSize, 'inherit'>;
+type RcSplitButtonVariant = 'round' | 'plainIcon' | RcButtonProps['variant'];
+type RcSplitButtonProps = {
     /** type of variant, default is `contained` */
     variant?: RcSplitButtonVariant;
     /** left Action button (`RcButton`) props */
@@ -29,8 +29,6 @@ declare type RcSplitButtonProps = {
     /** loading state */
     loading?: boolean;
 } & Pick<RcMenuProps, 'onClose'> & Pick<RcButtonProps, 'type' | 'color' | 'disabled'> & RcBaseProps<RcButtonGroupProps, 'onChange' | 'onClick' | 'orientation' | 'fullWidth'> & RcClassesProps<'actionButton' | 'controlButton' | 'menuOpen'> & Pick<RcIconButtonProps, 'size'>;
-declare const RcSplitButton: import("styled-components").StyledComponentClass<Pick<RcSplitButtonProps, "key" | "className" | "color" | "id" | "lang" | "style" | "type" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "slot" | "title" | "translate" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "size" | "variant" | "innerRef" | "disabled" | "disableRipple" | "loading" | "onClose" | "disableElevation" | "disableFocusRipple" | "onOpen" | "MenuProps" | "ActionButtonProps" | "ControlButtonProps"> & React.RefAttributes<any>, import("../../../foundation").RcTheme, Pick<Pick<RcSplitButtonProps, "key" | "className" | "color" | "id" | "lang" | "style" | "type" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "slot" | "title" | "translate" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "size" | "variant" | "innerRef" | "disabled" | "disableRipple" | "loading" | "onClose" | "disableElevation" | "disableFocusRipple" | "onOpen" | "MenuProps" | "ActionButtonProps" | "ControlButtonProps"> & React.RefAttributes<any>, "ref" | "key" | "className" | "color" | "id" | "lang" | "style" | "type" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "slot" | "title" | "translate" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "size" | "variant" | "innerRef" | "disabled" | "disableRipple" | "loading" | "onClose" | "disableElevation" | "disableFocusRipple" | "onOpen" | "MenuProps" | "ActionButtonProps" | "ControlButtonProps"> & {
-    theme?: import("../../../foundation").RcTheme | undefined;
-}>;
+declare const RcSplitButton: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<Omit<RcSplitButtonProps, "ref"> & React.RefAttributes<any>>, import("../../../foundation").RcTheme, {}, never>;
 export { RcSplitButton };
 export type { RcSplitButtonChildrenProps, RcSplitButtonProps, RcSplitButtonVariant, RcSplitRoundButtonSpacingSize, };