@ringcentral/juno 2.46.0 → 3.0.0-alpha.0

package/components/Buttons/ToggleButtonGroup/ToggleButtonGroup.d.ts

@@ -2,9 +2,7 @@ import React, { ComponentProps } from 'react';
 import MuiToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup';
 import { RcBaseProps } from '../../../foundation';
 import { RcToggleButtonProps } from '../ToggleButton';
-declare type RcToggleButtonGroupProps = {} & Pick<RcToggleButtonProps, 'variant' | 'size'> & RcBaseProps<ComponentProps<typeof MuiToggleButtonGroup>, 'size'>;
-declare const RcToggleButtonGroup: import("styled-components").StyledComponentClass<Pick<RcToggleButtonGroupProps, "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "orientation" | "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" | "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" | "value" | "variant" | "innerRef" | "exclusive"> & React.RefAttributes<any>, import("../../../foundation").RcTheme, Pick<Pick<RcToggleButtonGroupProps, "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "orientation" | "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" | "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" | "value" | "variant" | "innerRef" | "exclusive"> & React.RefAttributes<any>, "ref" | "key" | "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "orientation" | "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" | "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" | "value" | "variant" | "innerRef" | "exclusive"> & {
-    theme?: import("../../../foundation").RcTheme | undefined;
-}>;
+type RcToggleButtonGroupProps = {} & Pick<RcToggleButtonProps, 'variant' | 'size'> & RcBaseProps<ComponentProps<typeof MuiToggleButtonGroup>, 'size'>;
+declare const RcToggleButtonGroup: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<Omit<RcToggleButtonGroupProps, "ref"> & React.RefAttributes<any>>, import("../../../foundation").RcTheme, {}, never>;
 export { RcToggleButtonGroup };
 export type { RcToggleButtonGroupProps };

package/components/Buttons/ToggleButtonGroup/ToggleButtonGroup.js

@@ -1,25 +1,26 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.RcToggleButtonGroup = void 0;
 var tslib_1 = require("tslib");
 var react_1 = tslib_1.__importStar(require("react"));
 var ToggleButtonGroup_1 = tslib_1.__importDefault(require("@material-ui/lab/ToggleButtonGroup"));
 var foundation_1 = require("../../../foundation");
 var styles_1 = require("./styles");
 var utils_1 = require("./utils");
-var _RcToggleButtonGroup = react_1.forwardRef(function (inProps, ref) {
-    var props = foundation_1.useThemeProps({
+var _RcToggleButtonGroup = (0, react_1.forwardRef)(function (inProps, ref) {
+    var props = (0, foundation_1.useThemeProps)({
         props: inProps,
         name: 'RcToggleButtonGroup',
     });
     var classesProp = props.classes, children = props.children, variant = props.variant, size = props.size, rest = tslib_1.__rest(props, ["classes", "children", "variant", "size"]);
-    var classes = react_1.useMemo(function () { return foundation_1.combineClasses(utils_1.RcToggleButtonGroupClasses, classesProp); }, [classesProp]);
+    var classes = (0, react_1.useMemo)(function () { return (0, foundation_1.combineClasses)(utils_1.RcToggleButtonGroupClasses, classesProp); }, [classesProp]);
     return (react_1.default.createElement(ToggleButtonGroup_1.default, tslib_1.__assign({}, rest, { ref: ref, classes: classes }), children.map(function (x, i) {
         // * that key follow mui key logic
         // eslint-disable-next-line react/no-array-index-key
-        return react_1.default.cloneElement(x, { key: "." + i, size: size, variant: variant });
+        return react_1.default.cloneElement(x, { key: ".".concat(i), size: size, variant: variant });
     })));
 });
-var RcToggleButtonGroup = foundation_1.styled(_RcToggleButtonGroup)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), styles_1.ToggleButtonGroupStyle);
+var RcToggleButtonGroup = (0, foundation_1.styled)(_RcToggleButtonGroup)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), styles_1.ToggleButtonGroupStyle);
 exports.RcToggleButtonGroup = RcToggleButtonGroup;
 RcToggleButtonGroup.defaultProps = {
     size: 'medium',

package/components/Buttons/ToggleButtonGroup/styles/ToggleButtonGroupStyle.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.ToggleButtonGroupStyle = void 0;
 var tslib_1 = require("tslib");
 var foundation_1 = require("../../../../foundation");
 var Icon_1 = require("../../../Icon");
@@ -7,14 +8,14 @@ var utils_1 = require("../../ToggleButton/utils");
 var utils_2 = require("../utils");
 var boxStyle_1 = require("./boxStyle");
 var standardStyle_1 = require("./standardStyle");
-var dividerColor = foundation_1.palette2('neutral', 'l02');
-exports.ToggleButtonGroupStyle = function (props) {
+var dividerColor = (0, foundation_1.palette2)('neutral', 'l02');
+var ToggleButtonGroupStyle = function (props) {
     var variant = props.variant, size = props.size, orientation = props.orientation;
     var isHorizontal = orientation !== 'vertical';
     var _a = utils_1.RcToggleButtonSpace[size], area = _a.area, inner = _a.inner;
-    var boxInnerPadding = foundation_1.spacing(area + inner + 0.25);
-    return foundation_1.css(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n    .", "\n      + .", ",\n      .", "\n      + .", " {\n      ", " {\n        &:before {\n          content: '';\n          position: absolute;\n          pointer-events: none;\n          background: ", ";\n          top: 0;\n          left: 0;\n\n          ", ";\n        }\n      }\n    }\n\n    ", ";\n    ", ";\n  "], ["\n    .", "\n      + .", ",\n      .", "\n      + .", " {\n      ", " {\n        &:before {\n          content: '';\n          position: absolute;\n          pointer-events: none;\n          background: ", ";\n          top: 0;\n          left: 0;\n\n          ",
-        ";\n        }\n      }\n    }\n\n    ", ";\n    ", ";\n  "])), utils_2.RcToggleButtonGroupClasses.groupedHorizontal, utils_2.RcToggleButtonGroupClasses.groupedHorizontal, utils_2.RcToggleButtonGroupClasses.groupedVertical, utils_2.RcToggleButtonGroupClasses.groupedVertical, Icon_1.RcIcon, dividerColor, isHorizontal
-        ? foundation_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n                height: 100%;\n                width: 1px;\n                transform: translateX(-", ");\n              "], ["\n                height: 100%;\n                width: 1px;\n                transform: translateX(-", ");\n              "])), boxInnerPadding) : foundation_1.css(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n                height: 1px;\n                width: 100%;\n                transform: translateY(-", ");\n              "], ["\n                height: 1px;\n                width: 100%;\n                transform: translateY(-", ");\n              "])), boxInnerPadding), variant === 'standard' && standardStyle_1.standardStyle, variant === 'box' && boxStyle_1.boxStyle);
+    var boxInnerPadding = (0, foundation_1.spacing)(area + inner + 0.25);
+    return (0, foundation_1.css)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n    .", "\n      + .", ",\n      .", "\n      + .", " {\n      ", " {\n        &:before {\n          content: '';\n          position: absolute;\n          pointer-events: none;\n          background: ", ";\n          top: 0;\n          left: 0;\n\n          ", ";\n        }\n      }\n    }\n\n    ", ";\n    ", ";\n  "], ["\n    .", "\n      + .", ",\n      .", "\n      + .", " {\n      ", " {\n        &:before {\n          content: '';\n          position: absolute;\n          pointer-events: none;\n          background: ", ";\n          top: 0;\n          left: 0;\n\n          ", ";\n        }\n      }\n    }\n\n    ", ";\n    ", ";\n  "])), utils_2.RcToggleButtonGroupClasses.groupedHorizontal, utils_2.RcToggleButtonGroupClasses.groupedHorizontal, utils_2.RcToggleButtonGroupClasses.groupedVertical, utils_2.RcToggleButtonGroupClasses.groupedVertical, Icon_1.RcIcon, dividerColor, isHorizontal
+        ? (0, foundation_1.css)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n                height: 100%;\n                width: 1px;\n                transform: translateX(-", ");\n              "], ["\n                height: 100%;\n                width: 1px;\n                transform: translateX(-", ");\n              "])), boxInnerPadding) : (0, foundation_1.css)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n                height: 1px;\n                width: 100%;\n                transform: translateY(-", ");\n              "], ["\n                height: 1px;\n                width: 100%;\n                transform: translateY(-", ");\n              "])), boxInnerPadding), variant === 'standard' && standardStyle_1.standardStyle, variant === 'box' && boxStyle_1.boxStyle);
 };
+exports.ToggleButtonGroupStyle = ToggleButtonGroupStyle;
 var templateObject_1, templateObject_2, templateObject_3;

package/components/Buttons/ToggleButtonGroup/styles/boxStyle.js

@@ -1,23 +1,22 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.boxStyle = void 0;
 var tslib_1 = require("tslib");
 var foundation_1 = require("../../../../foundation");
 var ToggleButton_1 = require("../../ToggleButton");
 var utils_1 = require("../../ToggleButton/utils");
-exports.boxStyle = function (_a) {
+var boxStyle = function (_a) {
     var size = _a.size, orientation = _a.orientation;
     var _b = utils_1.RcToggleButtonSpace[size], inner = _b.inner, outer = _b.outer, area = _b.area;
     var isHorizontal = orientation !== 'vertical';
-    var radiusValue = foundation_1.radius('round');
-    var startPadding = foundation_1.spacing(area + inner - 0.25);
-    var endPadding = foundation_1.spacing(area + inner);
-    var outerPadding = foundation_1.spacing(area + outer);
-    return foundation_1.css(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["\n    background-color: ", ";\n    box-shadow: ", ";\n    border-radius: ", ";\n\n    ", " {\n      ", ";\n    }\n\n    ", ":first-child {\n      ", ";\n    }\n\n    ", ":last-child {\n      ", ";\n    }\n  "], ["\n    background-color: ", ";\n    box-shadow: ", ";\n    border-radius: ", ";\n\n    ", " {\n      ",
-        ";\n    }\n\n    ", ":first-child {\n      ",
-        ";\n    }\n\n    ", ":last-child {\n      ",
-        ";\n    }\n  "])), foundation_1.palette2('neutral', 'elevation'), foundation_1.shadows('1'), foundation_1.radius('round'), ToggleButton_1.RcToggleButton, isHorizontal
-        ? foundation_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n            padding-left: ", ";\n            margin-left: 1px;\n            padding-right: ", ";\n          "], ["\n            padding-left: ", ";\n            margin-left: 1px;\n            padding-right: ", ";\n          "])), startPadding, endPadding) : foundation_1.css(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n            padding-top: ", ";\n            margin-top: 1px;\n            padding-bottom: ", ";\n          "], ["\n            padding-top: ", ";\n            margin-top: 1px;\n            padding-bottom: ", ";\n          "])), startPadding, endPadding), ToggleButton_1.RcToggleButton, isHorizontal
-        ? foundation_1.css(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n            border-top-left-radius: ", ";\n            border-bottom-left-radius: ", ";\n            padding-left: ", ";\n            margin-left: 0px;\n          "], ["\n            border-top-left-radius: ", ";\n            border-bottom-left-radius: ", ";\n            padding-left: ", ";\n            margin-left: 0px;\n          "])), radiusValue, radiusValue, outerPadding) : foundation_1.css(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n            border-top-left-radius: ", ";\n            border-top-right-radius: ", ";\n            padding-top: ", ";\n            margin-top: 0px;\n          "], ["\n            border-top-left-radius: ", ";\n            border-top-right-radius: ", ";\n            padding-top: ", ";\n            margin-top: 0px;\n          "])), radiusValue, radiusValue, outerPadding), ToggleButton_1.RcToggleButton, isHorizontal
-        ? foundation_1.css(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n            border-top-right-radius: ", ";\n            border-bottom-right-radius: ", ";\n            padding-right: ", ";\n          "], ["\n            border-top-right-radius: ", ";\n            border-bottom-right-radius: ", ";\n            padding-right: ", ";\n          "])), radiusValue, radiusValue, outerPadding) : foundation_1.css(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n            border-bottom-left-radius: ", ";\n            border-bottom-right-radius: ", ";\n            padding-bottom: ", ";\n          "], ["\n            border-bottom-left-radius: ", ";\n            border-bottom-right-radius: ", ";\n            padding-bottom: ", ";\n          "])), radiusValue, radiusValue, outerPadding));
+    var radiusValue = (0, foundation_1.radius)('round');
+    var startPadding = (0, foundation_1.spacing)(area + inner - 0.25);
+    var endPadding = (0, foundation_1.spacing)(area + inner);
+    var outerPadding = (0, foundation_1.spacing)(area + outer);
+    return (0, foundation_1.css)(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["\n    background-color: ", ";\n    box-shadow: ", ";\n    border-radius: ", ";\n\n    ", " {\n      ", ";\n    }\n\n    ", ":first-child {\n      ", ";\n    }\n\n    ", ":last-child {\n      ", ";\n    }\n  "], ["\n    background-color: ", ";\n    box-shadow: ", ";\n    border-radius: ", ";\n\n    ", " {\n      ", ";\n    }\n\n    ", ":first-child {\n      ", ";\n    }\n\n    ", ":last-child {\n      ", ";\n    }\n  "])), (0, foundation_1.palette2)('neutral', 'elevation'), (0, foundation_1.shadows)('1'), (0, foundation_1.radius)('round'), ToggleButton_1.RcToggleButton, isHorizontal
+        ? (0, foundation_1.css)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n            padding-left: ", ";\n            margin-left: 1px;\n            padding-right: ", ";\n          "], ["\n            padding-left: ", ";\n            margin-left: 1px;\n            padding-right: ", ";\n          "])), startPadding, endPadding) : (0, foundation_1.css)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n            padding-top: ", ";\n            margin-top: 1px;\n            padding-bottom: ", ";\n          "], ["\n            padding-top: ", ";\n            margin-top: 1px;\n            padding-bottom: ", ";\n          "])), startPadding, endPadding), ToggleButton_1.RcToggleButton, isHorizontal
+        ? (0, foundation_1.css)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n            border-top-left-radius: ", ";\n            border-bottom-left-radius: ", ";\n            padding-left: ", ";\n            margin-left: 0px;\n          "], ["\n            border-top-left-radius: ", ";\n            border-bottom-left-radius: ", ";\n            padding-left: ", ";\n            margin-left: 0px;\n          "])), radiusValue, radiusValue, outerPadding) : (0, foundation_1.css)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n            border-top-left-radius: ", ";\n            border-top-right-radius: ", ";\n            padding-top: ", ";\n            margin-top: 0px;\n          "], ["\n            border-top-left-radius: ", ";\n            border-top-right-radius: ", ";\n            padding-top: ", ";\n            margin-top: 0px;\n          "])), radiusValue, radiusValue, outerPadding), ToggleButton_1.RcToggleButton, isHorizontal
+        ? (0, foundation_1.css)(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n            border-top-right-radius: ", ";\n            border-bottom-right-radius: ", ";\n            padding-right: ", ";\n          "], ["\n            border-top-right-radius: ", ";\n            border-bottom-right-radius: ", ";\n            padding-right: ", ";\n          "])), radiusValue, radiusValue, outerPadding) : (0, foundation_1.css)(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n            border-bottom-left-radius: ", ";\n            border-bottom-right-radius: ", ";\n            padding-bottom: ", ";\n          "], ["\n            border-bottom-left-radius: ", ";\n            border-bottom-right-radius: ", ";\n            padding-bottom: ", ";\n          "])), radiusValue, radiusValue, outerPadding));
 };
+exports.boxStyle = boxStyle;
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;

package/components/Buttons/ToggleButtonGroup/styles/standardStyle.js

@@ -1,25 +1,23 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.standardStyle = void 0;
 var tslib_1 = require("tslib");
 var foundation_1 = require("../../../../foundation");
 var utils_1 = require("../../ToggleButton/utils");
 var utils_2 = require("../utils");
-exports.standardStyle = function (_a) {
+var standardStyle = function (_a) {
     var orientation = _a.orientation, size = _a.size;
     var isHorizontal = orientation !== 'vertical';
     var _b = utils_1.RcToggleButtonSpace[size], inner = _b.inner, outer = _b.outer, area = _b.area;
     // * add 1px for border
     var margins = isHorizontal
-        ? foundation_1.spacing(inner, inner, inner, inner + 0.25)
-        : foundation_1.spacing(inner, inner, inner + 0.25, inner);
-    var outerSpace = foundation_1.spacing(outer);
-    return foundation_1.css(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["\n    ", " {\n      margin: ", ";\n      padding: ", ";\n      border: none;\n      border-radius: ", ";\n\n      ", ";\n\n      &:first-child {\n        ", ";\n      }\n\n      &:last-child {\n        ", ";\n      }\n    }\n  "], ["\n    ",
-        " {\n      margin: ", ";\n      padding: ", ";\n      border: none;\n      border-radius: ", ";\n\n      ",
-        ";\n\n      &:first-child {\n        ",
-        ";\n      }\n\n      &:last-child {\n        ",
-        ";\n      }\n    }\n  "])), utils_2.toggleButtonBetweenClassName + ",\n  ." + utils_2.RcToggleButtonGroupClasses.groupedHorizontal + ",\n  ." + utils_2.RcToggleButtonGroupClasses.groupedVertical, margins, foundation_1.spacing(area), foundation_1.radius('sm'), isHorizontal
-        ? foundation_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n            margin-top: 0;\n            margin-bottom: 0;\n          "], ["\n            margin-top: 0;\n            margin-bottom: 0;\n          "]))) : foundation_1.css(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n            margin-left: 0;\n            margin-right: 0;\n          "], ["\n            margin-left: 0;\n            margin-right: 0;\n          "]))), isHorizontal
-        ? foundation_1.css(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n              margin-left: ", ";\n            "], ["\n              margin-left: ", ";\n            "])), outerSpace) : foundation_1.css(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n              margin-top: ", ";\n            "], ["\n              margin-top: ", ";\n            "])), outerSpace), isHorizontal
-        ? foundation_1.css(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n              margin-right: ", ";\n            "], ["\n              margin-right: ", ";\n            "])), outerSpace) : foundation_1.css(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n              margin-bottom: ", ";\n            "], ["\n              margin-bottom: ", ";\n            "])), outerSpace));
+        ? (0, foundation_1.spacing)(inner, inner, inner, inner + 0.25)
+        : (0, foundation_1.spacing)(inner, inner, inner + 0.25, inner);
+    var outerSpace = (0, foundation_1.spacing)(outer);
+    return (0, foundation_1.css)(templateObject_7 || (templateObject_7 = tslib_1.__makeTemplateObject(["\n    ", " {\n      margin: ", ";\n      padding: ", ";\n      border: none;\n      border-radius: ", ";\n\n      ", ";\n\n      &:first-child {\n        ", ";\n      }\n\n      &:last-child {\n        ", ";\n      }\n    }\n  "], ["\n    ", " {\n      margin: ", ";\n      padding: ", ";\n      border: none;\n      border-radius: ", ";\n\n      ", ";\n\n      &:first-child {\n        ", ";\n      }\n\n      &:last-child {\n        ", ";\n      }\n    }\n  "])), "".concat(utils_2.toggleButtonBetweenClassName, ",\n  .").concat(utils_2.RcToggleButtonGroupClasses.groupedHorizontal, ",\n  .").concat(utils_2.RcToggleButtonGroupClasses.groupedVertical), margins, (0, foundation_1.spacing)(area), (0, foundation_1.radius)('sm'), isHorizontal
+        ? (0, foundation_1.css)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n            margin-top: 0;\n            margin-bottom: 0;\n          "], ["\n            margin-top: 0;\n            margin-bottom: 0;\n          "]))) : (0, foundation_1.css)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n            margin-left: 0;\n            margin-right: 0;\n          "], ["\n            margin-left: 0;\n            margin-right: 0;\n          "]))), isHorizontal
+        ? (0, foundation_1.css)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n              margin-left: ", ";\n            "], ["\n              margin-left: ", ";\n            "])), outerSpace) : (0, foundation_1.css)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n              margin-top: ", ";\n            "], ["\n              margin-top: ", ";\n            "])), outerSpace), isHorizontal
+        ? (0, foundation_1.css)(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n              margin-right: ", ";\n            "], ["\n              margin-right: ", ";\n            "])), outerSpace) : (0, foundation_1.css)(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n              margin-bottom: ", ";\n            "], ["\n              margin-bottom: ", ";\n            "])), outerSpace));
 };
+exports.standardStyle = standardStyle;
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;

package/components/Buttons/ToggleButtonGroup/utils/ToggleButtonGroupUtils.js

@@ -1,8 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.toggleButtonBetweenClassName = exports.RcToggleButtonGroupClasses = void 0;
 var foundation_1 = require("../../../../foundation");
 var ToggleButton_1 = require("../../ToggleButton");
 var utils_1 = require("../../ToggleButton/utils");
-exports.RcToggleButtonGroupClasses = foundation_1.RcClasses(['groupedHorizontal', 'groupedVertical'], 'RcToggleButtonGroup');
+exports.RcToggleButtonGroupClasses = (0, foundation_1.RcClasses)(['groupedHorizontal', 'groupedVertical'], 'RcToggleButtonGroup');
 // * Mui will set selected + selected margin order, need reset
-exports.toggleButtonBetweenClassName = ToggleButton_1.RcToggleButton + "." + utils_1.RcToggleButtonClasses.selected + " + " + ToggleButton_1.RcToggleButton + "." + utils_1.RcToggleButtonClasses.selected;
+exports.toggleButtonBetweenClassName = "".concat(ToggleButton_1.RcToggleButton, ".").concat(utils_1.RcToggleButtonClasses.selected, " + ").concat(ToggleButton_1.RcToggleButton, ".").concat(utils_1.RcToggleButtonClasses.selected);

package/components/Card/Card/Card.d.ts

@@ -1,15 +1,13 @@
 import React, { ComponentProps } from 'react';
 import MuiCard from '@material-ui/core/Card';
 import { RcBaseProps, RcClassesProps } from '../../../foundation';
-declare type RcCardClassProp = RcClassesProps<'root' | 'selected' | 'focusVisible'>;
-declare type RcCardProps = {
+type RcCardClassProp = RcClassesProps<'root' | 'selected' | 'focusVisible'>;
+type RcCardProps = {
     /** applies the visual style of selection, only applied when variant outline */
     selected?: boolean;
     /** sets the visible style of focus if the focus target is delegated to a child component, only applied when variant outline */
     focusVisible?: boolean;
 } & RcCardClassProp & RcBaseProps<ComponentProps<typeof MuiCard>, 'classes' | 'raised'>;
-declare const RcCard: import("styled-components").StyledComponentClass<Pick<RcCardProps, "square" | "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "elevation" | "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" | "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" | "variant" | "innerRef" | "component" | "focusVisible" | "selected"> & React.RefAttributes<any>, import("../../../foundation").RcTheme, Pick<Pick<RcCardProps, "square" | "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "elevation" | "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" | "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" | "variant" | "innerRef" | "component" | "focusVisible" | "selected"> & React.RefAttributes<any>, "ref" | "key" | "square" | "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "elevation" | "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" | "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" | "variant" | "innerRef" | "component" | "focusVisible" | "selected"> & {
-    theme?: import("../../../foundation").RcTheme | undefined;
-}>;
+declare const RcCard: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<Omit<RcCardProps, "ref"> & React.RefAttributes<any>>, import("../../../foundation").RcTheme, {}, never>;
 export { RcCard };
 export type { RcCardProps };

package/components/Card/Card/Card.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.RcCard = void 0;
 var tslib_1 = require("tslib");
 var react_1 = tslib_1.__importStar(require("react"));
 var clsx_1 = tslib_1.__importDefault(require("clsx"));
@@ -9,22 +10,22 @@ var styled_components_1 = tslib_1.__importDefault(require("../../../foundation/s
 var CardContext_1 = require("./CardContext");
 var styles_1 = require("./styles");
 var utils_1 = require("./utils");
-var _RcCard = react_1.forwardRef(function (inProps, ref) {
+var _RcCard = (0, react_1.forwardRef)(function (inProps, ref) {
     var _a;
-    var props = foundation_1.useThemeProps({ props: inProps, name: 'RcCard' });
+    var props = (0, foundation_1.useThemeProps)({ props: inProps, name: 'RcCard' });
     var classesProp = props.classes, classNameProp = props.className, selected = props.selected, focusVisibleProp = props.focusVisible, rest = tslib_1.__rest(props, ["classes", "className", "selected", "focusVisible"]);
-    var _b = tslib_1.__read(react_1.useState(false), 2), focusVisible = _b[0], setFocusVisible = _b[1];
-    var classes = react_1.useMemo(function () {
-        return foundation_1.combineClasses(foundation_1.omit(utils_1.RcCardClasses, ['selected', 'focusVisible']), classesProp);
+    var _b = tslib_1.__read((0, react_1.useState)(false), 2), focusVisible = _b[0], setFocusVisible = _b[1];
+    var classes = (0, react_1.useMemo)(function () {
+        return (0, foundation_1.combineClasses)((0, foundation_1.omit)(utils_1.RcCardClasses, ['selected', 'focusVisible']), classesProp);
     }, [classesProp]);
-    var className = clsx_1.default(classNameProp, (_a = {},
+    var className = (0, clsx_1.default)(classNameProp, (_a = {},
         _a[utils_1.RcCardClasses.focusVisible] = focusVisibleProp || focusVisible,
         _a[utils_1.RcCardClasses.selected] = selected,
         _a));
     return (react_1.default.createElement(CardContext_1.RcCardContext.Provider, { value: { focusVisible: focusVisible, setFocusVisible: setFocusVisible } },
         react_1.default.createElement(Card_1.default, tslib_1.__assign({}, rest, { className: className, ref: ref, classes: classes }))));
 });
-var RcCard = styled_components_1.default(_RcCard)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), styles_1.CardStyle);
+var RcCard = (0, styled_components_1.default)(_RcCard)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), styles_1.CardStyle);
 exports.RcCard = RcCard;
 RcCard.displayName = 'RcCard';
 RcCard.defaultProps = {};

package/components/Card/Card/CardContext.d.ts

@@ -1,6 +1,5 @@
 /// <reference types="react" />
-/// <reference types="styled-jsx" />
-export declare type RcCardContextType = {
+export type RcCardContextType = {
     /** Card focusVisible state  */
     focusVisible?: boolean;
     /** set Card focusVisible state  */

package/components/Card/Card/CardContext.js

@@ -1,7 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.useRcCardContext = exports.RcCardContext = void 0;
 var react_1 = require("react");
-exports.RcCardContext = react_1.createContext({
+exports.RcCardContext = (0, react_1.createContext)({
     setFocusVisible: function () { },
 });
-exports.useRcCardContext = function () { return react_1.useContext(exports.RcCardContext); };
+var useRcCardContext = function () { return (0, react_1.useContext)(exports.RcCardContext); };
+exports.useRcCardContext = useRcCardContext;

package/components/Card/Card/styles/CardStyles.js

@@ -1,13 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.CardStyle = void 0;
 var tslib_1 = require("tslib");
 var foundation_1 = require("../../../../foundation");
 var utils_1 = require("../../CardHoverActions/utils");
 var utils_2 = require("../utils");
-exports.CardStyle = function (props) {
+var CardStyle = function (props) {
     var variant = props.variant, square = props.square;
     var isOutline = variant === 'outlined';
-    return foundation_1.css(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n    position: relative;\n    background-color: ", ";\n\n    ", "\n  "], ["\n    position: relative;\n    background-color: ", ";\n\n    ",
-        "\n  "])), foundation_1.palette2('neutral', 'elevation'), isOutline && foundation_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n      border: 1px solid ", ";\n      border-radius: ", ";\n\n      &.", ", &.", " {\n        border-color: ", ";\n      }\n\n      &:not(:hover):not(:focus-within) .", " {\n        &:not(.", ") {\n          opacity: ", ";\n        }\n      }\n    "], ["\n      border: 1px solid ", ";\n      border-radius: ", ";\n\n      &.", ", &.", " {\n        border-color: ", ";\n      }\n\n      &:not(:hover):not(:focus-within) .", " {\n        &:not(.", ") {\n          opacity: ", ";\n        }\n      }\n    "])), foundation_1.palette2('neutral', 'l02'), !square && foundation_1.radius('xl'), utils_2.RcCardClasses.focusVisible, utils_2.RcCardClasses.selected, isOutline && foundation_1.palette2('interactive', 'f01'), utils_1.RcCardHoverActionsClasses.root, utils_1.RcCardHoverActionsClasses.visible, isOutline && 0));
+    return (0, foundation_1.css)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n    position: relative;\n    background-color: ", ";\n\n    ", "\n  "], ["\n    position: relative;\n    background-color: ", ";\n\n    ", "\n  "])), (0, foundation_1.palette2)('neutral', 'elevation'), isOutline && (0, foundation_1.css)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n      border: 1px solid ", ";\n      border-radius: ", ";\n\n      &.", ", &.", " {\n        border-color: ", ";\n      }\n\n      &:not(:hover):not(:focus-within) .", " {\n        &:not(.", ") {\n          opacity: ", ";\n        }\n      }\n    "], ["\n      border: 1px solid ", ";\n      border-radius: ", ";\n\n      &.", ", &.", " {\n        border-color: ", ";\n      }\n\n      &:not(:hover):not(:focus-within) .", " {\n        &:not(.", ") {\n          opacity: ", ";\n        }\n      }\n    "])), (0, foundation_1.palette2)('neutral', 'l02'), !square && (0, foundation_1.radius)('xl'), utils_2.RcCardClasses.focusVisible, utils_2.RcCardClasses.selected, isOutline && (0, foundation_1.palette2)('interactive', 'f01'), utils_1.RcCardHoverActionsClasses.root, utils_1.RcCardHoverActionsClasses.visible, isOutline && 0));
 };
+exports.CardStyle = CardStyle;
 var templateObject_1, templateObject_2;

package/components/Card/Card/utils/CardUtils.js

@@ -1,4 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.RcCardClasses = void 0;
 var foundation_1 = require("../../../../foundation");
-exports.RcCardClasses = foundation_1.RcClasses(['focusVisible', 'selected'], 'RcCard');
+exports.RcCardClasses = (0, foundation_1.RcClasses)(['focusVisible', 'selected'], 'RcCard');

package/components/Card/CardActionArea/CardActionArea.d.ts

@@ -1,27 +1,13 @@
 import React, { ComponentProps } from 'react';
 import MuiCardActionArea from '@material-ui/core/CardActionArea';
 import { RcBaseProps, RcClassesProps } from '../../../foundation';
-declare type RcCardActionAreaProps = {} & RcClassesProps<'disableRipple'> & RcBaseProps<ComponentProps<typeof MuiCardActionArea>>;
+type RcCardActionAreaProps = {} & RcClassesProps<'disableRipple'> & RcBaseProps<ComponentProps<typeof MuiCardActionArea>>;
 interface RcCardActionAreaTypeMap<D extends React.ElementType = 'div'> {
     props: RcCardActionAreaProps;
     defaultComponent: D;
 }
-declare const RcCardActionArea: (import("@material-ui/core/OverridableComponent").OverridableComponent<RcCardActionAreaTypeMap<"div"> & {
+declare const RcCardActionArea: import("@material-ui/core/OverridableComponent").OverridableComponent<RcCardActionAreaTypeMap<"div"> & {
     classKey: "";
-}> & string & React.FunctionComponent<RcCardActionAreaProps>) | (import("@material-ui/core/OverridableComponent").OverridableComponent<RcCardActionAreaTypeMap<"div"> & {
-    classKey: "";
-}> & number & React.FunctionComponent<RcCardActionAreaProps>) | (import("@material-ui/core/OverridableComponent").OverridableComponent<RcCardActionAreaTypeMap<"div"> & {
-    classKey: "";
-}> & false & React.FunctionComponent<RcCardActionAreaProps>) | (import("@material-ui/core/OverridableComponent").OverridableComponent<RcCardActionAreaTypeMap<"div"> & {
-    classKey: "";
-}> & import("styled-components").Styles & React.FunctionComponent<RcCardActionAreaProps>) | (import("@material-ui/core/OverridableComponent").OverridableComponent<RcCardActionAreaTypeMap<"div"> & {
-    classKey: "";
-}> & import("styled-components").Keyframes & React.FunctionComponent<RcCardActionAreaProps>) | (import("@material-ui/core/OverridableComponent").OverridableComponent<RcCardActionAreaTypeMap<"div"> & {
-    classKey: "";
-}> & import("styled-components").StyledComponentClass<any, any, any> & React.FunctionComponent<RcCardActionAreaProps>) | (import("@material-ui/core/OverridableComponent").OverridableComponent<RcCardActionAreaTypeMap<"div"> & {
-    classKey: "";
-}> & import("styled-components").InterpolationFunction<import("styled-components").ThemedStyledProps<RcCardActionAreaProps, import("../../../foundation").RcTheme>> & React.FunctionComponent<RcCardActionAreaProps>) | (import("@material-ui/core/OverridableComponent").OverridableComponent<RcCardActionAreaTypeMap<"div"> & {
-    classKey: "";
-}> & readonly (string | number | false | import("styled-components").Styles | import("styled-components").Keyframes | import("styled-components").StyledComponentClass<any, any, any> | import("styled-components").InterpolationFunction<import("styled-components").ThemedStyledProps<RcCardActionAreaProps, import("../../../foundation").RcTheme>> | readonly import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<RcCardActionAreaProps, import("../../../foundation").RcTheme>>[] | null | undefined)[] & React.FunctionComponent<RcCardActionAreaProps>);
+}> & import("../../../foundation").CustomStyledComponentResult<RcCardActionAreaProps>;
 export { RcCardActionArea };
 export type { RcCardActionAreaProps };

package/components/Card/CardActionArea/CardActionArea.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.RcCardActionArea = void 0;
 var tslib_1 = require("tslib");
 var react_1 = tslib_1.__importStar(require("react"));
 var clsx_1 = tslib_1.__importDefault(require("clsx"));
@@ -8,13 +9,13 @@ var foundation_1 = require("../../../foundation");
 var CardContext_1 = require("../Card/CardContext");
 var styles_1 = require("./styles");
 var utils_1 = require("./utils");
-var _RcCardActionArea = react_1.forwardRef(function (inProps, ref) {
+var _RcCardActionArea = (0, react_1.forwardRef)(function (inProps, ref) {
     var _a;
-    var props = foundation_1.useThemeProps({ props: inProps, name: 'RcCardActionArea' });
-    var _b = foundation_1.useThemeProps({ props: props, name: 'MuiButtonBase' }), classNameProp = _b.className, classesProp = _b.classes, TouchRipplePropsProp = _b.TouchRippleProps, onFocusVisible = _b.onFocusVisible, onBlur = _b.onBlur, disableRipple = _b.disableRipple, disableTouchRipple = _b.disableTouchRipple, rest = tslib_1.__rest(_b, ["className", "classes", "TouchRippleProps", "onFocusVisible", "onBlur", "disableRipple", "disableTouchRipple"]);
-    var setFocusVisible = CardContext_1.useRcCardContext().setFocusVisible;
-    var events = react_1.useMemo(function () {
-        return foundation_1.combineProps({
+    var props = (0, foundation_1.useThemeProps)({ props: inProps, name: 'RcCardActionArea' });
+    var _b = (0, foundation_1.useThemeProps)({ props: props, name: 'MuiButtonBase' }), classNameProp = _b.className, classesProp = _b.classes, TouchRipplePropsProp = _b.TouchRippleProps, onFocusVisible = _b.onFocusVisible, onBlur = _b.onBlur, disableRipple = _b.disableRipple, disableTouchRipple = _b.disableTouchRipple, rest = tslib_1.__rest(_b, ["className", "classes", "TouchRippleProps", "onFocusVisible", "onBlur", "disableRipple", "disableTouchRipple"]);
+    var setFocusVisible = (0, CardContext_1.useRcCardContext)().setFocusVisible;
+    var events = (0, react_1.useMemo)(function () {
+        return (0, foundation_1.combineProps)({
             onFocusVisible: function () { return setFocusVisible(true); },
             onBlur: function () { return setFocusVisible(false); },
         }, {
@@ -22,18 +23,18 @@ var _RcCardActionArea = react_1.forwardRef(function (inProps, ref) {
             onBlur: onBlur,
         });
     }, [onBlur, onFocusVisible, setFocusVisible]);
-    var classes = react_1.useMemo(function () {
-        return foundation_1.combineClasses(foundation_1.omit(utils_1.RcCardActionAreaClasses, ['disableRipple']), classesProp);
+    var classes = (0, react_1.useMemo)(function () {
+        return (0, foundation_1.combineClasses)((0, foundation_1.omit)(utils_1.RcCardActionAreaClasses, ['disableRipple']), classesProp);
     }, [classesProp]);
-    var className = clsx_1.default(classNameProp, (_a = {},
+    var className = (0, clsx_1.default)(classNameProp, (_a = {},
         _a[utils_1.RcCardActionAreaClasses.disableRipple] = disableRipple || disableTouchRipple,
         _a));
-    var TouchRippleProps = react_1.useMemo(function () {
-        return foundation_1.combineProps({ classes: utils_1.RcCardActionAreaRippleClasses }, TouchRipplePropsProp);
+    var TouchRippleProps = (0, react_1.useMemo)(function () {
+        return (0, foundation_1.combineProps)({ classes: utils_1.RcCardActionAreaRippleClasses }, TouchRipplePropsProp);
     }, [TouchRipplePropsProp]);
     return (react_1.default.createElement(CardActionArea_1.default, tslib_1.__assign({}, rest, events, { ref: ref, className: className, classes: classes, TouchRippleProps: TouchRippleProps, disableRipple: disableRipple, disableTouchRipple: disableTouchRipple })));
 });
-var RcCardActionArea = foundation_1.overridableStyled(_RcCardActionArea)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), styles_1.CardActionAreaStyle);
+var RcCardActionArea = (0, foundation_1.overridableStyled)(_RcCardActionArea)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), styles_1.CardActionAreaStyle);
 exports.RcCardActionArea = RcCardActionArea;
 RcCardActionArea.defaultProps = {};
 RcCardActionArea.displayName = 'RcCardActionArea';

package/components/Card/CardActionArea/styles/CardActionAreaStyle.js

@@ -1,13 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.CardActionAreaStyle = void 0;
 var tslib_1 = require("tslib");
 var foundation_1 = require("../../../../foundation");
 var utils_1 = require("../utils");
 var rippleAnimation = function (_a) {
     var theme = _a.theme;
-    return foundation_1.keyframes(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  0% {\n    transform: scale(0);\n    opacity: ", ";\n  }\n  100% {\n    transform: scale(1);\n    opacity: ", ";\n  }\n"], ["\n  0% {\n    transform: scale(0);\n    opacity: ", ";\n  }\n  100% {\n    transform: scale(1);\n    opacity: ", ";\n  }\n"])), theme.opacity['08'], theme.opacity['24']);
+    return (0, foundation_1.keyframes)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  0% {\n    transform: scale(0);\n    opacity: ", ";\n  }\n  100% {\n    transform: scale(1);\n    opacity: ", ";\n  }\n"], ["\n  0% {\n    transform: scale(0);\n    opacity: ", ";\n  }\n  100% {\n    transform: scale(1);\n    opacity: ", ";\n  }\n"])), theme.opacity['08'], theme.opacity['24']);
 };
-exports.CardActionAreaStyle = function () {
-    return foundation_1.css(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n      &.", "\n        .", " {\n        opacity: 0;\n      }\n\n      .", " {\n        color: ", ";\n      }\n\n      .", " {\n        opacity: ", ";\n        animation-name: ", ";\n      }\n\n      &.", ":active {\n        background-color: ", ";\n      }\n    "], ["\n      &.", "\n        .", " {\n        opacity: 0;\n      }\n\n      .", " {\n        color: ", ";\n      }\n\n      .", " {\n        opacity: ", ";\n        animation-name: ", ";\n      }\n\n      &.", ":active {\n        background-color: ", ";\n      }\n    "])), utils_1.RcCardActionAreaClasses.focusVisible, utils_1.RcCardActionAreaClasses.focusHighlight, utils_1.RcCardActionAreaRippleClasses.root, foundation_1.palette2('action', 'grayLight'), utils_1.RcCardActionAreaRippleClasses.rippleVisible, foundation_1.opacity('24'), rippleAnimation, utils_1.RcCardActionAreaClasses.disableRipple, foundation_1.palette2('action', 'grayLight', 0.24));
+var CardActionAreaStyle = function () {
+    return (0, foundation_1.css)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n      &.", "\n        .", " {\n        opacity: 0;\n      }\n\n      .", " {\n        color: ", ";\n      }\n\n      .", " {\n        opacity: ", ";\n        animation-name: ", ";\n      }\n\n      &.", ":active {\n        background-color: ", ";\n      }\n    "], ["\n      &.", "\n        .", " {\n        opacity: 0;\n      }\n\n      .", " {\n        color: ", ";\n      }\n\n      .", " {\n        opacity: ", ";\n        animation-name: ", ";\n      }\n\n      &.", ":active {\n        background-color: ", ";\n      }\n    "])), utils_1.RcCardActionAreaClasses.focusVisible, utils_1.RcCardActionAreaClasses.focusHighlight, utils_1.RcCardActionAreaRippleClasses.root, (0, foundation_1.palette2)('action', 'grayLight'), utils_1.RcCardActionAreaRippleClasses.rippleVisible, (0, foundation_1.opacity)('24'), rippleAnimation, utils_1.RcCardActionAreaClasses.disableRipple, (0, foundation_1.palette2)('action', 'grayLight', 0.24));
 };
+exports.CardActionAreaStyle = CardActionAreaStyle;
 var templateObject_1, templateObject_2;

package/components/Card/CardActionArea/utils/CardActionAreaUtils.d.ts

@@ -1,2 +1,2 @@
-export declare const RcCardActionAreaClasses: Partial<import("../../../../foundation").UnitMap<"root" | "disableRipple" | "focusVisible" | "focusHighlight", any>>;
+export declare const RcCardActionAreaClasses: Partial<import("../../../../foundation").UnitMap<"disableRipple" | import("@material-ui/core").CardActionAreaClassKey, any>>;
 export declare const RcCardActionAreaRippleClasses: Partial<import("../../../../foundation").UnitMap<import("@material-ui/core/ButtonBase/TouchRipple").TouchRippleClassKey, any>>;

package/components/Card/CardActionArea/utils/CardActionAreaUtils.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.RcCardActionAreaRippleClasses = exports.RcCardActionAreaClasses = void 0;
 var foundation_1 = require("../../../../foundation");
-exports.RcCardActionAreaClasses = foundation_1.RcClasses(['root', 'focusHighlight', 'focusVisible', 'disableRipple'], 'RcCardActionArea');
-exports.RcCardActionAreaRippleClasses = foundation_1.RcClasses(['root', 'rippleVisible'], 'RcCardActionAreaTouchRipple');
+exports.RcCardActionAreaClasses = (0, foundation_1.RcClasses)(['root', 'focusHighlight', 'focusVisible', 'disableRipple'], 'RcCardActionArea');
+exports.RcCardActionAreaRippleClasses = (0, foundation_1.RcClasses)(['root', 'rippleVisible'], 'RcCardActionAreaTouchRipple');