npm - @ringcentral/juno - Versions diffs - 2.22.1 → 2.23.1 - Mend

@ringcentral/juno 2.22.1 → 2.23.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (15) hide show

package/components/Forms/Picker/DatePicker/Calendar.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import React from 'react';
-import moment from 'moment';
+import dayjs from 'dayjs';
 import { MaterialUiPickersDate as MuiPickersDate } from '@material-ui/pickers/typings/date';
 import { RcClassesProps } from '../../../../foundation';
 import { DatePickerHeaderProps } from './DatePickerHeader';
@@ -44,9 +44,9 @@ declare const Calendar: React.ForwardRefExoticComponent<{
     /** DateRange for setting */
     dateRange: {
         /**  Min date @DateIOType */
-        min?: moment.Moment | null | undefined;
+        min?: dayjs.Dayjs | null | undefined;
         /**  Max date @DateIOType */
-        max?: moment.Moment | null | undefined;
+        max?: dayjs.Dayjs | null | undefined;
     };
     /** Disable past dates */
     disablePast?: boolean | undefined;
@@ -66,7 +66,7 @@ declare const Calendar: React.ForwardRefExoticComponent<{
     loadingIndicator?: JSX.Element | undefined;
     date: MuiPickersDate;
     handleDaySelect: (day: MuiPickersDate, fromUserSelect?: boolean | undefined) => void;
-    getInvalidateDateInRange: (day: MuiPickersDate) => false | moment.Moment | null;
+    getInvalidateDateInRange: (day: MuiPickersDate) => false | dayjs.Dayjs | null;
 } & Pick<DayProps, "size"> & RcClassesProps<"footer" | "progress" | "calendarSlider"> & Pick<DatePickerHeaderProps, "classes"> & React.RefAttributes<any>>;
 export { Calendar };
 export type { CalendarProps };

package/components/Forms/Picker/DatePicker/Calendar.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var react_1 = tslib_1.__importStar(require("react"));
-var moment_1 = tslib_1.__importDefault(require("moment"));
+var dayjs_1 = tslib_1.__importDefault(require("dayjs"));
 var CircularProgress_1 = tslib_1.__importDefault(require("@material-ui/core/CircularProgress"));
 var pickers_1 = require("@material-ui/pickers");
 var useKeyDown_1 = require("@material-ui/pickers/_shared/hooks/useKeyDown");
@@ -22,7 +22,7 @@ var Calendar = react_1.forwardRef(function (_a, ref) {
     var previousView = foundation_1.usePrevious(function () { return view; });
     var weeks = react_1.useRef([]);
     // * `getWeekdays` not set locale, need set locale before get
-    moment_1.default.locale(utils.locale);
+    dayjs_1.default.locale(utils.locale);
     var weekdays = foundation_1.useResultRef(function () { return utils.getWeekdays(); }).current;
     var _b = react_1.useMemo(function () {
         var nowDate = utils.date();

package/components/Forms/Picker/DatePicker/DatePicker.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import React from 'react';
-import moment from 'moment';
+import dayjs from 'dayjs';
 import { MaterialUiPickersDate as MuiPickersDate } from '@material-ui/pickers/typings/date';
 import { RcBaseProps, RcBaseSize, RcClassesProps } from '../../../../foundation';
 import { RcPopoverProps } from '../../../Popover';
@@ -62,15 +62,15 @@ declare const RcDatePicker: import("styled-components").StyledComponentClass<{
     /** when hover on the textField, if show the clearBtn. With default is true. */
     clearBtn?: boolean | undefined;
     /** Min date */
-    min?: Date | moment.Moment | null | undefined;
+    min?: Date | dayjs.Dayjs | null | undefined;
     /** Max date */
-    max?: Date | moment.Moment | null | undefined;
+    max?: Date | dayjs.Dayjs | null | undefined;
     /** Text label for Today button */
     todayButtonText?: string | undefined;
     /** @deprecated Min date @DateIOType, using min instead */
-    minDate?: moment.Moment | null | undefined;
+    minDate?: dayjs.Dayjs | null | undefined;
     /** @deprecated Max date @DateIOType, using max instead */
-    maxDate?: moment.Moment | null | undefined;
+    maxDate?: dayjs.Dayjs | null | undefined;
     /** @deprecated please use value to replace that */
     date?: Date | null | undefined;
 } & Pick<Partial<CalendarProps>, "classes" | "size" | "disablePast" | "disableFuture" | "todayButtonText" | "formatString" | "renderDay" | "shouldDisableDate" | "onMonthChange" | "loadingIndicator"> & Pick<PickerTextFieldProps, "className" | "id" | "radius" | "onFocus" | "onBlur" | "onKeyDown" | "onClick" | "label" | "placeholder" | "size" | "variant" | "disabled" | "action" | "autoFocus" | "fullWidth" | "error" | "inputProps" | "inputRef" | "required" | "InputProps" | "helperText" | "gutterBottom" | "onClear" | "clearBtn" | "clearButtonProps" | "validate" | "PopoverProps" | "ActionSymbol"> & Pick<Pick<import("@material-ui/core").PopoverProps, "ref" | "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" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "innerRef" | "TransitionComponent" | "TransitionProps" | "action" | "disablePortal" | "onClose" | "onEnter" | "onEntering" | "onEntered" | "onExit" | "onExiting" | "onExited" | "open" | "transitionDuration" | "anchorOrigin" | "BackdropComponent" | "BackdropProps" | "closeAfterTransition" | "container" | "disableAutoFocus" | "disableBackdropClick" | "disableEnforceFocus" | "disableEscapeKeyDown" | "disableRestoreFocus" | "disableScrollLock" | "hideBackdrop" | "keepMounted" | "manager" | "onBackdropClick" | "onEscapeKeyDown" | "onRendered" | "anchorEl" | "anchorPosition" | "anchorReference" | "getContentAnchorEl" | "marginThreshold" | "PaperProps" | "transformOrigin">, "onClose"> & RcClassesProps<"popover" | "popoverPaper"> & React.RefAttributes<any>, import("../../../../foundation").RcTheme, Pick<{
@@ -94,15 +94,15 @@ declare const RcDatePicker: import("styled-components").StyledComponentClass<{
     /** when hover on the textField, if show the clearBtn. With default is true. */
     clearBtn?: boolean | undefined;
     /** Min date */
-    min?: Date | moment.Moment | null | undefined;
+    min?: Date | dayjs.Dayjs | null | undefined;
     /** Max date */
-    max?: Date | moment.Moment | null | undefined;
+    max?: Date | dayjs.Dayjs | null | undefined;
     /** Text label for Today button */
     todayButtonText?: string | undefined;
     /** @deprecated Min date @DateIOType, using min instead */
-    minDate?: moment.Moment | null | undefined;
+    minDate?: dayjs.Dayjs | null | undefined;
     /** @deprecated Max date @DateIOType, using max instead */
-    maxDate?: moment.Moment | null | undefined;
+    maxDate?: dayjs.Dayjs | null | undefined;
     /** @deprecated please use value to replace that */
     date?: Date | null | undefined;
 } & Pick<Partial<CalendarProps>, "classes" | "size" | "disablePast" | "disableFuture" | "todayButtonText" | "formatString" | "renderDay" | "shouldDisableDate" | "onMonthChange" | "loadingIndicator"> & Pick<PickerTextFieldProps, "className" | "id" | "radius" | "onFocus" | "onBlur" | "onKeyDown" | "onClick" | "label" | "placeholder" | "size" | "variant" | "disabled" | "action" | "autoFocus" | "fullWidth" | "error" | "inputProps" | "inputRef" | "required" | "InputProps" | "helperText" | "gutterBottom" | "onClear" | "clearBtn" | "clearButtonProps" | "validate" | "PopoverProps" | "ActionSymbol"> & Pick<Pick<import("@material-ui/core").PopoverProps, "ref" | "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" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "innerRef" | "TransitionComponent" | "TransitionProps" | "action" | "disablePortal" | "onClose" | "onEnter" | "onEntering" | "onEntered" | "onExit" | "onExiting" | "onExited" | "open" | "transitionDuration" | "anchorOrigin" | "BackdropComponent" | "BackdropProps" | "closeAfterTransition" | "container" | "disableAutoFocus" | "disableBackdropClick" | "disableEnforceFocus" | "disableEscapeKeyDown" | "disableRestoreFocus" | "disableScrollLock" | "hideBackdrop" | "keepMounted" | "manager" | "onBackdropClick" | "onEscapeKeyDown" | "onRendered" | "anchorEl" | "anchorPosition" | "anchorReference" | "getContentAnchorEl" | "marginThreshold" | "PaperProps" | "transformOrigin">, "onClose"> & RcClassesProps<"popover" | "popoverPaper"> & React.RefAttributes<any>, "ref" | "key" | "className" | "id" | "max" | "min" | "radius" | "onFocus" | "onBlur" | "onChange" | "onKeyDown" | "onClick" | "date" | "label" | "classes" | "placeholder" | "size" | "value" | "variant" | "disabled" | "action" | "autoFocus" | "onClose" | "fullWidth" | "error" | "inputProps" | "inputRef" | "required" | "InputProps" | "helperText" | "gutterBottom" | "onClear" | "clearBtn" | "clearButtonProps" | "validate" | "disablePast" | "disableFuture" | "todayButtonText" | "formatString" | "renderDay" | "shouldDisableDate" | "onMonthChange" | "loadingIndicator" | "PopoverProps" | "ActionSymbol" | "locale" | "screenReaderProps" | "minDate" | "maxDate"> & {

package/components/Forms/Picker/DatePicker/DatePicker.js CHANGED Viewed

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var react_1 = tslib_1.__importStar(require("react"));
-var moment_1 = tslib_1.__importDefault(require("moment"));
-var moment_2 = tslib_1.__importDefault(require("@date-io/moment"));
+var dayjs_1 = tslib_1.__importDefault(require("dayjs"));
+var dayjs_2 = tslib_1.__importDefault(require("@date-io/dayjs"));
 var pickers_1 = require("@material-ui/pickers");
 var date_utils_1 = require("@material-ui/pickers/_helpers/date-utils");
 var juno_icon_1 = require("@ringcentral/juno-icon");
@@ -30,8 +30,8 @@ var InnerRcDatePicker = react_1.forwardRef(function (props, ref) {
     var minDate = maxDateProp || min;
     var actionRef = react_1.useRef(null);
     var dateRange = react_1.useMemo(function () { return ({
-        min: moment_1.default(minDate || defaultMinDate),
-        max: moment_1.default(maxDate || defaultMaxDate),
+        min: dayjs_1.default(minDate || defaultMinDate),
+        max: dayjs_1.default(maxDate || defaultMaxDate),
     }); }, [minDate, maxDate]);
     var getInvalidateDateInRange = foundation_1.useEventCallback(function (day) {
         return utils_2.invalidateDateInRange(day, { dateRange: dateRange, now: utils.date(), disableFuture: disableFuture, disablePast: disablePast }, utils);
@@ -59,11 +59,11 @@ var InnerRcDatePicker = react_1.forwardRef(function (props, ref) {
         utils,
     ]);
     var initDate = react_1.useMemo(function () {
-        return getClosestEnableDate(moment_1.default(utils.date()));
+        return getClosestEnableDate(dayjs_1.default(utils.date()));
     }, [getClosestEnableDate, utils]);
-    var momentValue = react_1.useMemo(function () { return (controlledValue ? moment_1.default(controlledValue) : null); }, [controlledValue]);
-    var nowDate = momentValue || initDate;
-    var textFiledValue = react_1.useMemo(function () { return (momentValue ? utils.format(momentValue, formatString) : ''); }, [momentValue, utils, formatString]);
+    var dayjsValue = react_1.useMemo(function () { return (controlledValue ? dayjs_1.default(controlledValue) : null); }, [controlledValue]);
+    var nowDate = dayjsValue || initDate;
+    var textFiledValue = react_1.useMemo(function () { return (dayjsValue ? utils.format(dayjsValue, formatString) : ''); }, [dayjsValue, utils, formatString]);
     var PopoverProps = react_1.useMemo(function () {
         return foundation_1.combineProps({
             classes: foundation_1.combineClasses({
@@ -99,10 +99,10 @@ var InnerRcDatePicker = react_1.forwardRef(function (props, ref) {
     react_1.useEffect(function () {
         if (
         // only when inner value change need check again is that value is valid
-        momentValue &&
+        dayjsValue &&
             value !== emitValueRef.current &&
-            shouldDisableDate(momentValue)) {
-            var closestEnabledDate = getClosestEnableDate(momentValue);
+            shouldDisableDate(dayjsValue)) {
+            var closestEnabledDate = getClosestEnableDate(dayjsValue);
             handleDaySelect(closestEnabledDate, false);
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -133,7 +133,7 @@ var _RcDatePicker = react_1.forwardRef(function (inProps, ref) {
             },
         ]);
     }
-    return (react_1.default.createElement(pickers_1.MuiPickersUtilsProvider, { utils: moment_2.default, locale: props.locale, libInstance: moment_1.default },
+    return (react_1.default.createElement(pickers_1.MuiPickersUtilsProvider, { utils: dayjs_2.default, locale: props.locale, libInstance: dayjs_1.default },
         react_1.default.createElement(InnerRcDatePicker, tslib_1.__assign({ ref: ref }, props))));
 });
 var RcDatePicker = foundation_1.styled(_RcDatePicker)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject([""], [""])));

package/components/Forms/Picker/DatePicker/Years.d.ts CHANGED Viewed

@@ -22,9 +22,9 @@ declare const Years: React.ForwardRefExoticComponent<{
     /** the selected date. */
     date: MuiPickersDate;
     /** min Date of the displayed years range. */
-    minDate: import("moment").Moment;
+    minDate: import("dayjs").Dayjs;
     /** max Date of the displayed years range. */
-    maxDate: import("moment").Moment;
+    maxDate: import("dayjs").Dayjs;
     /** is disable the past years. */
     disablePast?: boolean | undefined;
     /** is disable the future years. */

package/components/Forms/Picker/DatePicker/utils/DatePickerUtils.d.ts CHANGED Viewed

@@ -22,5 +22,5 @@ export declare const onTransitionEnd: (event: any) => void;
 declare type ValidateDateInRange = {
     now: MuiPickersDate;
 } & Pick<CalendarProps, 'dateRange' | 'disableFuture' | 'disablePast'>;
-export declare const invalidateDateInRange: (day: MuiPickersDate, { dateRange: { min, max }, disableFuture, disablePast, now, }: ValidateDateInRange, utils: import("@date-io/core/IUtils").IUtils<MuiPickersDate>) => false | import("moment").Moment | null;
+export declare const invalidateDateInRange: (day: MuiPickersDate, { dateRange: { min, max }, disableFuture, disablePast, now, }: ValidateDateInRange, utils: import("@date-io/core/IUtils").IUtils<MuiPickersDate>) => false | import("dayjs").Dayjs | null;
 export {};

package/components/Forms/Switch/Switch.js CHANGED Viewed

@@ -11,10 +11,21 @@ var styles_1 = require("./styles");
 var utils_1 = require("./utils");
 var _RcSwitch = react_1.forwardRef(function (inProps, ref) {
     var props = foundation_1.useThemeProps({ props: inProps, name: 'RcSwitch' });
-    var label = props.label, _a = props.formControlLabelProps, formControlLabelProps = _a === void 0 ? {} : _a, focusVisibleClassNameProp = props.focusVisibleClassName, classesProp = props.classes, color = props.color, trackColor = props.trackColor, rest = tslib_1.__rest(props, ["label", "formControlLabelProps", "focusVisibleClassName", "classes", "color", "trackColor"]);
+    var label = props.label, _a = props.formControlLabelProps, formControlLabelProps = _a === void 0 ? {} : _a, focusVisibleClassNameProp = props.focusVisibleClassName, classesProp = props.classes, color = props.color, trackColor = props.trackColor, _b = props.inputRef, inputRefProp = _b === void 0 ? null : _b, onFocus = props.onFocus, onBlur = props.onBlur, rest = tslib_1.__rest(props, ["label", "formControlLabelProps", "focusVisibleClassName", "classes", "color", "trackColor", "inputRef", "onFocus", "onBlur"]);
     var classes = react_1.useMemo(function () { return foundation_1.combineClasses(foundation_1.omit(utils_1.RcSwitchClasses, ['focusVisible']), classesProp); }, [classesProp]);
     var focusVisibleClassName = react_1.useMemo(function () { return clsx_1.default(utils_1.RcSwitchClasses.focusVisible, focusVisibleClassNameProp); }, [focusVisibleClassNameProp]);
-    var Switch = (react_1.default.createElement(Switch_1.default, tslib_1.__assign({ ref: ref, focusVisibleClassName: focusVisibleClassName, classes: classes }, rest, { color: "default", size: "medium", disableRipple: true, disableTouchRipple: true })));
+    var inputRef = react_1.useRef(null);
+    var handleInputRef = foundation_1.useForkRef(inputRef, inputRefProp);
+    var Switch = (react_1.default.createElement(Switch_1.default, tslib_1.__assign({ ref: ref, inputRef: handleInputRef, focusVisibleClassName: focusVisibleClassName, classes: classes }, rest, { color: "default", size: "medium", disableRipple: true, disableTouchRipple: true, onFocus: function (e) {
+            var _a;
+            if ((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.matches('[data-focus-visible-added]')) {
+                e.currentTarget.parentElement.setAttribute('data-focus-visible-within', '');
+            }
+            onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
+        }, onBlur: function (e) {
+            e.currentTarget.parentElement.removeAttribute('data-focus-visible-within');
+            onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
+        } })));
     if (label) {
         return (react_1.default.createElement(FormControlLabel_1.RcFormControlLabel, tslib_1.__assign({}, formControlLabelProps, { label: label, control: Switch })));
     }

package/components/Forms/Switch/styles/SwitchStyle.js CHANGED Viewed

@@ -14,6 +14,6 @@ exports.SwitchStyle = function (_a) {
     var colorProp = _a.color, trackColorProp = _a.trackColor;
     var checkedColor = foundation_1.getParsePaletteColor(colorProp);
     var trackColor = foundation_1.getParsePaletteColor(trackColorProp, defaultTrackColorArray);
-    return foundation_1.css(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n    &.", " {\n      /* make sure focus ring can show correctly */\n      overflow: visible;\n      padding: 0px;\n      ", ";\n      ", ";\n\n      .", " {\n        ", ";\n        ", ";\n        padding: 0;\n        background-color: transparent;\n        transform: translateX(", ");\n\n        &.", " {\n          transform: translateX(", ");\n        }\n      }\n\n      .", " {\n        ", ";\n        background-color: ", ";\n        box-shadow: none;\n      }\n\n      .", " {\n        ", ";\n        opacity: 1;\n        margin: 0;\n        border-radius: ", ";\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        ", "\n      }\n\n      ", " {\n        &:hover {\n          ", ";\n        }\n      }\n\n      &:active {\n        ", ";\n      }\n    }\n  "], ["\n    &.", " {\n      /* make sure focus ring can show correctly */\n      overflow: visible;\n      padding: 0px;\n      ", ";\n      ", ";\n\n      .", " {\n        ", ";\n        ", ";\n        padding: 0;\n        background-color: transparent;\n        transform: translateX(", ");\n\n        &.", " {\n          transform: translateX(", ");\n        }\n      }\n\n      .", " {\n        ", ";\n        background-color: ", ";\n        box-shadow: none;\n      }\n\n      .", " {\n        ", ";\n        opacity: 1;\n        margin: 0;\n        border-radius: ", ";\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        ", "\n      }\n\n      ", " {\n        &:hover {\n          ", ";\n        }\n      }\n\n      &:active {\n        ", ";\n      }\n    }\n  "])), utils_1.RcSwitchClasses.root, widthCss, heightCss, utils_1.RcSwitchClasses.switchBase, widthCss, heightCss, foundation_1.spacing(-2), utils_1.RcSwitchClasses.checked, foundation_1.spacing(2), utils_1.RcSwitchClasses.thumb, thumbSize, thumbColor, utils_1.RcSwitchClasses.track, heightCss, foundation_1.radius('round'), trackColor, utils_1.RcSwitchClasses.checked, utils_1.RcSwitchClasses.track, checkedColor, utils_1.RcSwitchClasses.disabled, utils_1.RcSwitchClasses.track, disabledColor, utils_1.RcSwitchClasses.focusVisible, utils_1.RcSwitchClasses.track, foundation_1.focusRing('normal'), foundation_1.nonTouchHoverMedia, notDisabledSwitchBase('08', checkedColor, trackColor), notDisabledSwitchBase('24', checkedColor, trackColor));
+    return foundation_1.css(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n    &.", " {\n      padding: 0px;\n      ", ";\n      ", ";\n\n      &[data-focus-visible-within] {\n        border-radius: 100vw;\n        ", "\n      }\n\n      .", " {\n        ", ";\n        ", ";\n        padding: 0;\n        background-color: transparent;\n        transform: translateX(", ");\n\n        &.", " {\n          transform: translateX(", ");\n        }\n      }\n\n      .", " {\n        ", ";\n        background-color: ", ";\n        box-shadow: none;\n      }\n\n      .", " {\n        ", ";\n        opacity: 1;\n        margin: 0;\n        border-radius: ", ";\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      ", " {\n        &:hover {\n          ", ";\n        }\n      }\n\n      &:active {\n        ", ";\n      }\n    }\n  "], ["\n    &.", " {\n      padding: 0px;\n      ", ";\n      ", ";\n\n      &[data-focus-visible-within] {\n        border-radius: 100vw;\n        ", "\n      }\n\n      .", " {\n        ", ";\n        ", ";\n        padding: 0;\n        background-color: transparent;\n        transform: translateX(", ");\n\n        &.", " {\n          transform: translateX(", ");\n        }\n      }\n\n      .", " {\n        ", ";\n        background-color: ", ";\n        box-shadow: none;\n      }\n\n      .", " {\n        ", ";\n        opacity: 1;\n        margin: 0;\n        border-radius: ", ";\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      ", " {\n        &:hover {\n          ", ";\n        }\n      }\n\n      &:active {\n        ", ";\n      }\n    }\n  "])), utils_1.RcSwitchClasses.root, widthCss, heightCss, foundation_1.focusRing('normal'), utils_1.RcSwitchClasses.switchBase, widthCss, heightCss, foundation_1.spacing(-2), utils_1.RcSwitchClasses.checked, foundation_1.spacing(2), utils_1.RcSwitchClasses.thumb, thumbSize, thumbColor, utils_1.RcSwitchClasses.track, heightCss, foundation_1.radius('round'), trackColor, utils_1.RcSwitchClasses.checked, utils_1.RcSwitchClasses.track, checkedColor, utils_1.RcSwitchClasses.disabled, utils_1.RcSwitchClasses.track, disabledColor, foundation_1.nonTouchHoverMedia, notDisabledSwitchBase('08', checkedColor, trackColor), notDisabledSwitchBase('24', checkedColor, trackColor));
 };
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;

package/components/Forms/Switch/utils/SwitchUtils.js CHANGED Viewed

@@ -1,12 +1,4 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var foundation_1 = require("../../../../foundation");
-exports.RcSwitchClasses = foundation_1.RcClasses([
-    'root',
-    'switchBase',
-    'thumb',
-    'track',
-    'checked',
-    'disabled',
-    'focusVisible',
-], 'RcSwitch');
+exports.RcSwitchClasses = foundation_1.RcClasses(['root', 'switchBase', 'thumb', 'track', 'checked', 'disabled'], 'RcSwitch');

package/es6/components/Forms/Picker/DatePicker/Calendar.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { __read } from "tslib";
 import React, { forwardRef, useLayoutEffect, useMemo, useRef, useState, } from 'react';
-import moment from 'moment';
+import dayjs from 'dayjs';
 import MuiCircularProgress from '@material-ui/core/CircularProgress';
 import { useUtils as useMuiUtils } from '@material-ui/pickers';
 import { runKeyHandler } from '@material-ui/pickers/_shared/hooks/useKeyDown';
@@ -20,7 +20,7 @@ var Calendar = forwardRef(function (_a, ref) {
     var previousView = usePrevious(function () { return view; });
     var weeks = useRef([]);
     // * `getWeekdays` not set locale, need set locale before get
-    moment.locale(utils.locale);
+    dayjs.locale(utils.locale);
     var weekdays = useResultRef(function () { return utils.getWeekdays(); }).current;
     var _b = useMemo(function () {
         var nowDate = utils.date();

package/es6/components/Forms/Picker/DatePicker/DatePicker.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { __assign, __makeTemplateObject, __read, __rest } from "tslib";
 import React, { forwardRef, useCallback, useEffect, useMemo, useRef, } from 'react';
-import moment from 'moment';
-import MomentUtils from '@date-io/moment';
+import dayjs from 'dayjs';
+import DayjsUtils from '@date-io/dayjs';
 import { MuiPickersUtilsProvider, useUtils as useMuiUtils, } from '@material-ui/pickers';
 import { findClosestEnabledDate as MuiFindClosestEnabledDate } from '@material-ui/pickers/_helpers/date-utils';
 import { DateBorder } from '@ringcentral/juno-icon';
@@ -26,8 +26,8 @@ var InnerRcDatePicker = forwardRef(function (props, ref) {
     var minDate = maxDateProp || min;
     var actionRef = useRef(null);
     var dateRange = useMemo(function () { return ({
-        min: moment(minDate || defaultMinDate),
-        max: moment(maxDate || defaultMaxDate),
+        min: dayjs(minDate || defaultMinDate),
+        max: dayjs(maxDate || defaultMaxDate),
     }); }, [minDate, maxDate]);
     var getInvalidateDateInRange = useEventCallback(function (day) {
         return invalidateDateInRange(day, { dateRange: dateRange, now: utils.date(), disableFuture: disableFuture, disablePast: disablePast }, utils);
@@ -55,11 +55,11 @@ var InnerRcDatePicker = forwardRef(function (props, ref) {
         utils,
     ]);
     var initDate = useMemo(function () {
-        return getClosestEnableDate(moment(utils.date()));
+        return getClosestEnableDate(dayjs(utils.date()));
     }, [getClosestEnableDate, utils]);
-    var momentValue = useMemo(function () { return (controlledValue ? moment(controlledValue) : null); }, [controlledValue]);
-    var nowDate = momentValue || initDate;
-    var textFiledValue = useMemo(function () { return (momentValue ? utils.format(momentValue, formatString) : ''); }, [momentValue, utils, formatString]);
+    var dayjsValue = useMemo(function () { return (controlledValue ? dayjs(controlledValue) : null); }, [controlledValue]);
+    var nowDate = dayjsValue || initDate;
+    var textFiledValue = useMemo(function () { return (dayjsValue ? utils.format(dayjsValue, formatString) : ''); }, [dayjsValue, utils, formatString]);
     var PopoverProps = useMemo(function () {
         return combineProps({
             classes: combineClasses({
@@ -95,10 +95,10 @@ var InnerRcDatePicker = forwardRef(function (props, ref) {
     useEffect(function () {
         if (
         // only when inner value change need check again is that value is valid
-        momentValue &&
+        dayjsValue &&
             value !== emitValueRef.current &&
-            shouldDisableDate(momentValue)) {
-            var closestEnabledDate = getClosestEnableDate(momentValue);
+            shouldDisableDate(dayjsValue)) {
+            var closestEnabledDate = getClosestEnableDate(dayjsValue);
             handleDaySelect(closestEnabledDate, false);
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -129,7 +129,7 @@ var _RcDatePicker = forwardRef(function (inProps, ref) {
             },
         ]);
     }
-    return (React.createElement(MuiPickersUtilsProvider, { utils: MomentUtils, locale: props.locale, libInstance: moment },
+    return (React.createElement(MuiPickersUtilsProvider, { utils: DayjsUtils, locale: props.locale, libInstance: dayjs },
         React.createElement(InnerRcDatePicker, __assign({ ref: ref }, props))));
 });
 var RcDatePicker = styled(_RcDatePicker)(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));

package/es6/components/Forms/Switch/Switch.js CHANGED Viewed

@@ -1,18 +1,29 @@
 import { __assign, __makeTemplateObject, __rest } from "tslib";
-import React, { forwardRef, useMemo } from 'react';
+import React, { forwardRef, useMemo, useRef } from 'react';
 import clsx from 'clsx';
 import MuiSwitch from '@material-ui/core/Switch';
-import { combineClasses, omit, useThemeProps, } from '../../../foundation';
+import { combineClasses, omit, useThemeProps, useForkRef, } from '../../../foundation';
 import styled from '../../../foundation/styled-components';
 import { RcFormControlLabel } from '../FormControlLabel';
 import { SwitchStyle } from './styles';
 import { RcSwitchClasses } from './utils';
 var _RcSwitch = forwardRef(function (inProps, ref) {
     var props = useThemeProps({ props: inProps, name: 'RcSwitch' });
-    var label = props.label, _a = props.formControlLabelProps, formControlLabelProps = _a === void 0 ? {} : _a, focusVisibleClassNameProp = props.focusVisibleClassName, classesProp = props.classes, color = props.color, trackColor = props.trackColor, rest = __rest(props, ["label", "formControlLabelProps", "focusVisibleClassName", "classes", "color", "trackColor"]);
+    var label = props.label, _a = props.formControlLabelProps, formControlLabelProps = _a === void 0 ? {} : _a, focusVisibleClassNameProp = props.focusVisibleClassName, classesProp = props.classes, color = props.color, trackColor = props.trackColor, _b = props.inputRef, inputRefProp = _b === void 0 ? null : _b, onFocus = props.onFocus, onBlur = props.onBlur, rest = __rest(props, ["label", "formControlLabelProps", "focusVisibleClassName", "classes", "color", "trackColor", "inputRef", "onFocus", "onBlur"]);
     var classes = useMemo(function () { return combineClasses(omit(RcSwitchClasses, ['focusVisible']), classesProp); }, [classesProp]);
     var focusVisibleClassName = useMemo(function () { return clsx(RcSwitchClasses.focusVisible, focusVisibleClassNameProp); }, [focusVisibleClassNameProp]);
-    var Switch = (React.createElement(MuiSwitch, __assign({ ref: ref, focusVisibleClassName: focusVisibleClassName, classes: classes }, rest, { color: "default", size: "medium", disableRipple: true, disableTouchRipple: true })));
+    var inputRef = useRef(null);
+    var handleInputRef = useForkRef(inputRef, inputRefProp);
+    var Switch = (React.createElement(MuiSwitch, __assign({ ref: ref, inputRef: handleInputRef, focusVisibleClassName: focusVisibleClassName, classes: classes }, rest, { color: "default", size: "medium", disableRipple: true, disableTouchRipple: true, onFocus: function (e) {
+            var _a;
+            if ((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.matches('[data-focus-visible-added]')) {
+                e.currentTarget.parentElement.setAttribute('data-focus-visible-within', '');
+            }
+            onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
+        }, onBlur: function (e) {
+            e.currentTarget.parentElement.removeAttribute('data-focus-visible-within');
+            onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
+        } })));
     if (label) {
         return (React.createElement(RcFormControlLabel, __assign({}, formControlLabelProps, { label: label, control: Switch })));
     }

package/es6/components/Forms/Switch/styles/SwitchStyle.js CHANGED Viewed

@@ -12,6 +12,6 @@ export var SwitchStyle = function (_a) {
     var colorProp = _a.color, trackColorProp = _a.trackColor;
     var checkedColor = getParsePaletteColor(colorProp);
     var trackColor = getParsePaletteColor(trackColorProp, defaultTrackColorArray);
-    return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n    &.", " {\n      /* make sure focus ring can show correctly */\n      overflow: visible;\n      padding: 0px;\n      ", ";\n      ", ";\n\n      .", " {\n        ", ";\n        ", ";\n        padding: 0;\n        background-color: transparent;\n        transform: translateX(", ");\n\n        &.", " {\n          transform: translateX(", ");\n        }\n      }\n\n      .", " {\n        ", ";\n        background-color: ", ";\n        box-shadow: none;\n      }\n\n      .", " {\n        ", ";\n        opacity: 1;\n        margin: 0;\n        border-radius: ", ";\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        ", "\n      }\n\n      ", " {\n        &:hover {\n          ", ";\n        }\n      }\n\n      &:active {\n        ", ";\n      }\n    }\n  "], ["\n    &.", " {\n      /* make sure focus ring can show correctly */\n      overflow: visible;\n      padding: 0px;\n      ", ";\n      ", ";\n\n      .", " {\n        ", ";\n        ", ";\n        padding: 0;\n        background-color: transparent;\n        transform: translateX(", ");\n\n        &.", " {\n          transform: translateX(", ");\n        }\n      }\n\n      .", " {\n        ", ";\n        background-color: ", ";\n        box-shadow: none;\n      }\n\n      .", " {\n        ", ";\n        opacity: 1;\n        margin: 0;\n        border-radius: ", ";\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        ", "\n      }\n\n      ", " {\n        &:hover {\n          ", ";\n        }\n      }\n\n      &:active {\n        ", ";\n      }\n    }\n  "])), RcSwitchClasses.root, widthCss, heightCss, RcSwitchClasses.switchBase, widthCss, heightCss, spacing(-2), RcSwitchClasses.checked, spacing(2), RcSwitchClasses.thumb, thumbSize, thumbColor, RcSwitchClasses.track, heightCss, radius('round'), trackColor, RcSwitchClasses.checked, RcSwitchClasses.track, checkedColor, RcSwitchClasses.disabled, RcSwitchClasses.track, disabledColor, RcSwitchClasses.focusVisible, RcSwitchClasses.track, focusRing('normal'), nonTouchHoverMedia, notDisabledSwitchBase('08', checkedColor, trackColor), notDisabledSwitchBase('24', checkedColor, trackColor));
+    return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n    &.", " {\n      padding: 0px;\n      ", ";\n      ", ";\n\n      &[data-focus-visible-within] {\n        border-radius: 100vw;\n        ", "\n      }\n\n      .", " {\n        ", ";\n        ", ";\n        padding: 0;\n        background-color: transparent;\n        transform: translateX(", ");\n\n        &.", " {\n          transform: translateX(", ");\n        }\n      }\n\n      .", " {\n        ", ";\n        background-color: ", ";\n        box-shadow: none;\n      }\n\n      .", " {\n        ", ";\n        opacity: 1;\n        margin: 0;\n        border-radius: ", ";\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      ", " {\n        &:hover {\n          ", ";\n        }\n      }\n\n      &:active {\n        ", ";\n      }\n    }\n  "], ["\n    &.", " {\n      padding: 0px;\n      ", ";\n      ", ";\n\n      &[data-focus-visible-within] {\n        border-radius: 100vw;\n        ", "\n      }\n\n      .", " {\n        ", ";\n        ", ";\n        padding: 0;\n        background-color: transparent;\n        transform: translateX(", ");\n\n        &.", " {\n          transform: translateX(", ");\n        }\n      }\n\n      .", " {\n        ", ";\n        background-color: ", ";\n        box-shadow: none;\n      }\n\n      .", " {\n        ", ";\n        opacity: 1;\n        margin: 0;\n        border-radius: ", ";\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      .", " + .", " {\n        background-color: ", ";\n      }\n\n      ", " {\n        &:hover {\n          ", ";\n        }\n      }\n\n      &:active {\n        ", ";\n      }\n    }\n  "])), RcSwitchClasses.root, widthCss, heightCss, focusRing('normal'), RcSwitchClasses.switchBase, widthCss, heightCss, spacing(-2), RcSwitchClasses.checked, spacing(2), RcSwitchClasses.thumb, thumbSize, thumbColor, RcSwitchClasses.track, heightCss, radius('round'), trackColor, RcSwitchClasses.checked, RcSwitchClasses.track, checkedColor, RcSwitchClasses.disabled, RcSwitchClasses.track, disabledColor, nonTouchHoverMedia, notDisabledSwitchBase('08', checkedColor, trackColor), notDisabledSwitchBase('24', checkedColor, trackColor));
 };
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;

package/es6/components/Forms/Switch/utils/SwitchUtils.js CHANGED Viewed

@@ -1,10 +1,2 @@
 import { RcClasses } from '../../../../foundation';
-export var RcSwitchClasses = RcClasses([
-    'root',
-    'switchBase',
-    'thumb',
-    'track',
-    'checked',
-    'disabled',
-    'focusVisible',
-], 'RcSwitch');
+export var RcSwitchClasses = RcClasses(['root', 'switchBase', 'thumb', 'track', 'checked', 'disabled'], 'RcSwitch');

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@ringcentral/juno",
-  "version": "2.22.1",
+  "version": "2.23.1",
   "author": "RingCentral",
   "license": "MIT",
   "main": "./index.js",
@@ -15,7 +15,7 @@
     "url": "https://github.com/ringcentral/juno.git"
   },
   "dependencies": {
-    "@date-io/moment": "^1.3.11",
+    "@date-io/dayjs": "^1.3.13",
     "@material-ui/core": "^4.12.3",
     "@material-ui/lab": "^4.0.0-alpha.60",
     "@material-ui/pickers": "^3.3.10",
@@ -35,7 +35,7 @@
   },
   "peerDependencies": {
     "@ringcentral/juno-icon": ">=1.0.0 <2.0.0",
-    "moment": "^2.29.1",
+    "dayjs": "^1.11.6",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "styled-components": "^5.3.3"