@surveycake/rc 3.0.0-alpha.80 → 3.0.0-alpha.82

package/CHANGELOG.md

@@ -2,6 +2,21 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [3.0.0-alpha.82](https://fox.25sprout.com/surveycake/sdk/rc/compare/v3.0.0-alpha.80...v3.0.0-alpha.82) (2023-05-23)
+
+
+### Features
+
+* add crop icon ([6ade143](https://fox.25sprout.com/surveycake/sdk/rc/commit/6ade143c33e5832267ce5b6aff8ce059e353d3b3))
+* add Popover component ([5fdffea](https://fox.25sprout.com/surveycake/sdk/rc/commit/5fdffead5139095e240ba208fe10c9d667319901))
+
+## [3.0.0-alpha.81](https://fox.25sprout.com/surveycake/sdk/rc/compare/v3.0.0-alpha.80...v3.0.0-alpha.81) (2023-05-18)
+
+
+### Features
+
+* add crop icon ([6ade143](https://fox.25sprout.com/surveycake/sdk/rc/commit/6ade143c33e5832267ce5b6aff8ce059e353d3b3))
+
 ## [3.0.0-alpha.80](https://fox.25sprout.com/surveycake/sdk/rc/compare/v3.0.0-alpha.79...v3.0.0-alpha.80) (2023-04-18)
 
 

package/dist/V2/Icon/index.d.ts

@@ -22,6 +22,7 @@ export declare const Icons: {
     CloudUpload: import("@material-ui/core/OverridableComponent").OverridableComponent<import("@material-ui/core/SvgIcon").SvgIconTypeMap<{}, "svg">>;
     Computer: import("@material-ui/core/OverridableComponent").OverridableComponent<import("@material-ui/core/SvgIcon").SvgIconTypeMap<{}, "svg">>;
     CreditCard: import("@material-ui/core/OverridableComponent").OverridableComponent<import("@material-ui/core/SvgIcon").SvgIconTypeMap<{}, "svg">>;
+    Crop: import("@material-ui/core/OverridableComponent").OverridableComponent<import("@material-ui/core/SvgIcon").SvgIconTypeMap<{}, "svg">>;
     DeleteOutline: import("@material-ui/core/OverridableComponent").OverridableComponent<import("@material-ui/core/SvgIcon").SvgIconTypeMap<{}, "svg">>;
     Description: import("@material-ui/core/OverridableComponent").OverridableComponent<import("@material-ui/core/SvgIcon").SvgIconTypeMap<{}, "svg">>;
     DescriptionOutlined: import("@material-ui/core/OverridableComponent").OverridableComponent<import("@material-ui/core/SvgIcon").SvgIconTypeMap<{}, "svg">>;

package/dist/V2/Popover/Popover.stories.d.ts

@@ -0,0 +1,4 @@
+import { Story, Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Basic: Story;

package/dist/V2/Popover/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { PopoverProps as MUIPopoverProps } from '@material-ui/core/Popover';
+declare const Popover: React.ForwardRefExoticComponent<Pick<MUIPopoverProps, "color" | "transformOrigin" | "transitionDuration" | "hidden" | "style" | "open" | "title" | "classes" | "onEnter" | "onEntering" | "onEntered" | "onExit" | "onExiting" | "onExited" | "children" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "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" | "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" | "css" | "BackdropComponent" | "BackdropProps" | "closeAfterTransition" | "container" | "disableAutoFocus" | "disableBackdropClick" | "disableEnforceFocus" | "disableEscapeKeyDown" | "disablePortal" | "disableRestoreFocus" | "disableScrollLock" | "hideBackdrop" | "keepMounted" | "manager" | "onBackdropClick" | "onClose" | "onEscapeKeyDown" | "onRendered" | "innerRef" | "action" | "anchorEl" | "anchorOrigin" | "anchorPosition" | "anchorReference" | "elevation" | "getContentAnchorEl" | "marginThreshold" | "PaperProps" | "TransitionComponent" | "TransitionProps"> & React.RefAttributes<HTMLButtonElement>>;
+export default Popover;

package/dist/V2/index.d.ts

@@ -63,5 +63,6 @@ export { default as ToggleButtonGroup } from './ToggleButtonGroup';
 export { default as Tooltip } from './Tooltip';
 export { default as Typography } from './Typography';
 export { default as VarSelect } from './VarSelect';
+export { default as Popover } from './Popover';
 export { default as Icon } from './Icon';
 export { exclusiveColor } from './ColorPalette/exclusiveColor';

package/dist/rc.cjs.development.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
 
 var MUICssBaseline = _interopDefault(require('@material-ui/core/CssBaseline'));
-var styles$5 = require('@material-ui/core/styles');
+var styles$6 = require('@material-ui/core/styles');
 var React = require('react');
 var React__default = _interopDefault(React);
 var emotionTheming = require('emotion-theming');
@@ -28,6 +28,7 @@ var Close = _interopDefault(require('@material-ui/icons/Close'));
 var CloudUpload = _interopDefault(require('@material-ui/icons//CloudUpload'));
 var Computer = _interopDefault(require('@material-ui/icons/Computer'));
 var CreditCard = _interopDefault(require('@material-ui/icons/CreditCard'));
+var Crop = _interopDefault(require('@material-ui/icons/Crop'));
 var DeleteOutline = _interopDefault(require('@material-ui/icons/DeleteOutline'));
 var Description = _interopDefault(require('@material-ui/icons/Description'));
 var DescriptionOutlined = _interopDefault(require('@material-ui/icons/DescriptionOutlined'));
@@ -135,6 +136,7 @@ var MUIToggleButton = _interopDefault(require('@material-ui/lab/ToggleButton'));
 var MUIToggleButtonGroup = _interopDefault(require('@material-ui/lab/ToggleButtonGroup'));
 var MUITooltip = _interopDefault(require('@material-ui/core/Tooltip'));
 var MuiListSubheader$1 = _interopDefault(require('@material-ui/core/ListSubheader'));
+var MUIPopover = _interopDefault(require('@material-ui/core/Popover'));
 var polished = require('polished');
 var MuiAvatar = _interopDefault(require('@material-ui/core/Avatar'));
 var colorManipulator = require('@material-ui/core/styles/colorManipulator');
@@ -174,7 +176,7 @@ var DESKTOP_FONT_SIZE;
 
 var core =
 /*#__PURE__*/
-styles$5.createTheme({
+styles$6.createTheme({
   breakpoints: {
     values: {
       xl: 1440,
@@ -512,7 +514,7 @@ var MuiBackdrop = {
   root: {
     backgroundColor:
     /*#__PURE__*/
-    styles$5.alpha(core.palette.common.black, 0.4)
+    styles$6.alpha(core.palette.common.black, 0.4)
   }
 };
 
@@ -929,7 +931,7 @@ var MuiRadio = {
 
 var useMenuStyles =
 /*#__PURE__*/
-styles$5.makeStyles(function (theme) {
+styles$6.makeStyles(function (theme) {
   return {
     root: {
       boxShadow: 'none',
@@ -1252,7 +1254,7 @@ var MuiToggleButton = {
     '&:hover': {
       backgroundColor:
       /*#__PURE__*/
-      styles$5.alpha(core.palette.primary.light, 0.2),
+      styles$6.alpha(core.palette.primary.light, 0.2),
       color: core.palette.primary.main
     },
     '&$selected': {
@@ -1262,7 +1264,7 @@ var MuiToggleButton = {
       '&:hover': {
         backgroundColor:
         /*#__PURE__*/
-        styles$5.alpha(core.palette.primary.main, 0.95),
+        styles$6.alpha(core.palette.primary.main, 0.95),
         color: core.palette.grey[50]
       }
     }
@@ -1326,11 +1328,11 @@ var MuiTypography = {
 };
 
 var useMUITheme = function useMUITheme() {
-  return styles$5.useTheme();
+  return styles$6.useTheme();
 };
 var theme =
 /*#__PURE__*/
-styles$5.createTheme({
+styles$6.createTheme({
   overrides: {
     MuiAccordion: MuiAccordion,
     MuiAccordionDetails: MuiAccordionDetails,
@@ -1382,14 +1384,14 @@ var ThemeProvider = function ThemeProvider(props) {
   var children = props.children;
   return React__default.createElement(emotionTheming.ThemeProvider, {
     theme: theme
-  }, React__default.createElement(styles$5.StylesProvider, {
+  }, React__default.createElement(styles$6.StylesProvider, {
     injectFirst: true
-  }, React__default.createElement(styles$5.ThemeProvider, {
+  }, React__default.createElement(styles$6.ThemeProvider, {
     theme: theme
   }, children)));
 };
 var PureThemeProvider = function PureThemeProvider(props) {
-  return React__default.createElement(styles$5.ThemeProvider, {
+  return React__default.createElement(styles$6.ThemeProvider, {
     theme: theme
   }, props.children);
 };
@@ -2023,6 +2025,7 @@ var Icons = {
   CloudUpload: CloudUpload,
   Computer: Computer,
   CreditCard: CreditCard,
+  Crop: Crop,
   DeleteOutline: DeleteOutline,
   Description: Description,
   DescriptionOutlined: DescriptionOutlined,
@@ -2957,7 +2960,7 @@ ListSubheader.displayName = 'ListSubheader';
 
 var useSelectStyle =
 /*#__PURE__*/
-styles$5.makeStyles(function (theme) {
+styles$6.makeStyles(function (theme) {
   return {
     select: {
       padding: '5px 8px',
@@ -2969,7 +2972,7 @@ styles$5.makeStyles(function (theme) {
 });
 var useCustomOptionStyle =
 /*#__PURE__*/
-styles$5.makeStyles(function (theme) {
+styles$6.makeStyles(function (theme) {
   return {
     container: {
       backgroundColor: theme.palette.common.white,
@@ -3084,6 +3087,25 @@ React.forwardRef(function (props, ref) {
 });
 VarSelect.displayName = 'VarSelect';
 
+var styles = {
+  paper: {
+    'box-shadow': '0px 4px 20px rgba(69, 69, 69, 0.25)',
+    padding: '24px',
+    marginTop: '12px'
+  }
+};
+var StyledPopover =
+/*#__PURE__*/
+styles$6.withStyles(styles)(MUIPopover);
+var Popover =
+/*#__PURE__*/
+React.forwardRef(function (props, ref) {
+  return React__default.createElement(StyledPopover, Object.assign({}, props, {
+    ref: ref
+  }));
+});
+Popover.displayName = 'Popover';
+
 /**
  *  @deprecated since version 3.0.0-alpha.58, please use theme.palette[name] lighter or lightest keywords
  */
@@ -3198,6 +3220,7 @@ var index = {
   Tooltip: Tooltip,
   Typography: Typography,
   VarSelect: VarSelect,
+  Popover: Popover,
   Icon: Icon,
   exclusiveColor: exclusiveColor
 };
@@ -3284,8 +3307,8 @@ AnimateHeight.defaultProps = {
   animateDisabled: false
 };
 
-var styles = function styles(theme) {
-  return styles$5.createStyles({
+var styles$1 = function styles(theme) {
+  return styles$6.createStyles({
     root: function root(props) {
       return _extends({
         display: 'flex',
@@ -3311,7 +3334,7 @@ var styles = function styles(theme) {
 
 var useStyles =
 /*#__PURE__*/
-styles$5.makeStyles(styles);
+styles$6.makeStyles(styles$1);
 var Avatar =
 /*#__PURE__*/
 React.forwardRef(function (_ref, ref) {
@@ -3447,7 +3470,7 @@ var theme$1 = {
 var CustomBoxShadow1 = "\n0 1px 4px 0 rgba(69, 69, 69, 0.2),\n0 1px 2px 0 rgba(69, 69, 69, 0.1)\n";
 var CustomChip =
 /*#__PURE__*/
-styles$5.styled(function (_ref) {
+styles$6.styled(function (_ref) {
   var other = _objectWithoutPropertiesLoose(_ref, ["color", "active"]);
 
   return React__default.createElement(MUIChip, Object.assign({}, other));
@@ -3514,7 +3537,7 @@ React.forwardRef(function (props, ref) {
 
 var useStyles$1 =
 /*#__PURE__*/
-styles$5.makeStyles({
+styles$6.makeStyles({
   root: {
     width: function width(props) {
       return props.width;
@@ -3673,21 +3696,21 @@ styled('section')(
 _templateObject2$3(), theme$1.color.primary["default"]);
 var popOverStyles =
 /*#__PURE__*/
-styles$5.createStyles({
+styles$6.createStyles({
   root: {
     boxShadow: "0 1px 6px 0 rgba(69, 69, 69, 0.2),\n      0 1px 5px 0 rgba(69, 69, 69, 0.1)"
   }
 });
 var inputStyles =
 /*#__PURE__*/
-styles$5.createStyles({
+styles$6.createStyles({
   root: {
     paddingLeft: '30px'
   }
 });
-var styles$1 =
+var styles$2 =
 /*#__PURE__*/
-styles$5.createStyles({
+styles$6.createStyles({
   root: {
     maxWidth: '128px',
     width: '100%',
@@ -3697,13 +3720,13 @@ styles$5.createStyles({
 
 var StyledMuiDatePicker =
 /*#__PURE__*/
-styles$5.withStyles(styles$1)(pickers.DatePicker);
+styles$6.withStyles(styles$2)(pickers.DatePicker);
 var usePopOverStyles =
 /*#__PURE__*/
-styles$5.makeStyles(popOverStyles);
+styles$6.makeStyles(popOverStyles);
 var useInputStyles =
 /*#__PURE__*/
-styles$5.makeStyles(inputStyles);
+styles$6.makeStyles(inputStyles);
 var CommonDatePickerProps = {
   maxDateMessage: null,
   minDateMessage: null,
@@ -3866,14 +3889,14 @@ Typography$1.defaultProps = {
 
 var popOverStyles$1 =
 /*#__PURE__*/
-styles$5.createStyles({
+styles$6.createStyles({
   root: {
     boxShadow: "0 1px 6px 0 rgba(69, 69, 69, 0.2),\n      0 1px 5px 0 rgba(69, 69, 69, 0.1)"
   }
 });
 var keyBoardButtonStyles =
 /*#__PURE__*/
-styles$5.createStyles({
+styles$6.createStyles({
   root: {
     '&:hover': {
       backgroundColor: 'transparent'
@@ -3882,14 +3905,14 @@ styles$5.createStyles({
 });
 var inputAdornmentStyles =
 /*#__PURE__*/
-styles$5.createStyles({
+styles$6.createStyles({
   positionStart: {
     marginRight: '4px'
   }
 });
-var styles$2 =
+var styles$3 =
 /*#__PURE__*/
-styles$5.createStyles({
+styles$6.createStyles({
   root: {
     maxWidth: '128px',
     width: '100%',
@@ -3899,16 +3922,16 @@ styles$5.createStyles({
 
 var StyledMuiKeyBoardDatePicker =
 /*#__PURE__*/
-styles$5.withStyles(styles$2)(pickers.KeyboardDatePicker);
+styles$6.withStyles(styles$3)(pickers.KeyboardDatePicker);
 var usePopOverStyles$1 =
 /*#__PURE__*/
-styles$5.makeStyles(popOverStyles$1);
+styles$6.makeStyles(popOverStyles$1);
 var useKeyboardButtonStyles =
 /*#__PURE__*/
-styles$5.makeStyles(keyBoardButtonStyles);
+styles$6.makeStyles(keyBoardButtonStyles);
 var useInputAdornmentStyles =
 /*#__PURE__*/
-styles$5.makeStyles(inputAdornmentStyles);
+styles$6.makeStyles(inputAdornmentStyles);
 var CommonKeyboardDatePickerProps = {
   keyboardIcon:
   /*#__PURE__*/
@@ -4071,7 +4094,7 @@ React.forwardRef(function (_ref, ref) {
 
 var useStyles$4 =
 /*#__PURE__*/
-styles$5.makeStyles({
+styles$6.makeStyles({
   root: {
     boxSizing: 'border-box',
     width: '100%',
@@ -4111,7 +4134,7 @@ styles$5.makeStyles({
 });
 var itemStyle =
 /*#__PURE__*/
-styles$5.makeStyles({
+styles$6.makeStyles({
   container: {
     transition: '0.2s',
     transitionProperty: 'color, background-color',
@@ -4205,9 +4228,9 @@ var Select$1 = function Select(props) {
   }));
 };
 
-var styles$3 =
+var styles$4 =
 /*#__PURE__*/
-styles$5.createStyles({
+styles$6.createStyles({
   root: {
     boxSizing: 'border-box',
     height: '40px',
@@ -4229,7 +4252,7 @@ styles$5.createStyles({
 });
 var emptyStyles =
 /*#__PURE__*/
-styles$5.createStyles({
+styles$6.createStyles({
   root: {
     paddingLeft: '36px',
     pointerEvents: 'none'
@@ -4237,7 +4260,7 @@ styles$5.createStyles({
 });
 var subheaderStyles =
 /*#__PURE__*/
-styles$5.createStyles({
+styles$6.createStyles({
   root: {
     color: '#989898',
     pointerEvents: 'none'
@@ -4245,7 +4268,7 @@ styles$5.createStyles({
 });
 var useCustomOptionStyle$1 =
 /*#__PURE__*/
-styles$5.makeStyles({
+styles$6.makeStyles({
   container: {
     backgroundColor: '#fff',
     maxWidth: '100%',
@@ -4303,13 +4326,13 @@ styles$5.makeStyles({
 
 var StyledSelect =
 /*#__PURE__*/
-styles$5.withStyles(styles$3)(MuiSelect$1);
+styles$6.withStyles(styles$4)(MuiSelect$1);
 var StyledEmptyLabel =
 /*#__PURE__*/
-styles$5.withStyles(emptyStyles)(MuiListSubheader$1);
+styles$6.withStyles(emptyStyles)(MuiListSubheader$1);
 var StyledSubheader =
 /*#__PURE__*/
-styles$5.withStyles(subheaderStyles)(MuiListSubheader$1);
+styles$6.withStyles(subheaderStyles)(MuiListSubheader$1);
 
 var GroupSelect = function GroupSelect(props) {
   var groups = props.groups,
@@ -4456,14 +4479,14 @@ React.forwardRef(function (_ref, ref) {
 
 var menuListStyles =
 /*#__PURE__*/
-styles$5.createStyles({
+styles$6.createStyles({
   root: {
     padding: '10px 0'
   }
 });
 var paperStyles =
 /*#__PURE__*/
-styles$5.createStyles({
+styles$6.createStyles({
   root: {
     boxShadow: "0 1px 8px 0 rgba(69, 69, 69, 0.2),\n     0 1px 6px 0 rgba(69, 69, 69, 0.1);",
     minWidth: '120px'
@@ -4481,10 +4504,10 @@ function _templateObject$6() {
 }
 var StyledPaper =
 /*#__PURE__*/
-styles$5.withStyles(paperStyles)(MuiPaper);
+styles$6.withStyles(paperStyles)(MuiPaper);
 var StyledMenuList =
 /*#__PURE__*/
-styles$5.withStyles(menuListStyles)(MuiMenuList);
+styles$6.withStyles(menuListStyles)(MuiMenuList);
 
 var MenuList = function MenuList(_ref) {
   var open = _ref.open,
@@ -4520,7 +4543,7 @@ var MenuList = function MenuList(_ref) {
 
 var useStyles$5 =
 /*#__PURE__*/
-styles$5.makeStyles({
+styles$6.makeStyles({
   root: {
     backgroundColor: function backgroundColor(props) {
       return props.backgroundColor;
@@ -4549,7 +4572,7 @@ var MenuItem$1 = function MenuItem(props) {
   }), children);
 };
 
-var styles$4 = function styles(theme) {
+var styles$5 = function styles(theme) {
   return {
     root: {
       borderColor: theme.palette.primary.main,
@@ -4577,7 +4600,7 @@ var styles$4 = function styles(theme) {
 
 var StyledMuiToggleButton =
 /*#__PURE__*/
-styles$5.withStyles(styles$4)(MUIToggleButton);
+styles$6.withStyles(styles$5)(MUIToggleButton);
 
 var ToggleButtonGroup$1 = function ToggleButtonGroup(props) {
   var value = props.value,
@@ -4611,7 +4634,7 @@ var ToggleButtonGroup$1 = function ToggleButtonGroup(props) {
 
 var CustomIconButton =
 /*#__PURE__*/
-styles$5.styled(MUIIconButton)(function (_ref) {
+styles$6.styled(MUIIconButton)(function (_ref) {
   var theme = _ref.theme;
   return {
     fontSize: '1rem',
@@ -4650,7 +4673,7 @@ var KEYCODE$1 = {
 };
 var useTextFieldStyles =
 /*#__PURE__*/
-styles$5.makeStyles(function (theme) {
+styles$6.makeStyles(function (theme) {
   return {
     root: {
       width: theme.spacing(4),
@@ -4789,7 +4812,7 @@ React.memo(Pagination$1);
 
 var useStyles$6 =
 /*#__PURE__*/
-styles$5.makeStyles({
+styles$6.makeStyles({
   scrollButtons: {
     width: '24px'
   },
@@ -4830,8 +4853,8 @@ React.forwardRef(function (_ref, ref) {
 
 var useStyles$7 =
 /*#__PURE__*/
-styles$5.makeStyles(function (theme) {
-  return styles$5.createStyles({
+styles$6.makeStyles(function (theme) {
+  return styles$6.createStyles({
     root: {
       textTransform: 'none',
       minWidth: 56,
@@ -4894,7 +4917,7 @@ React.forwardRef(function (_ref, ref) {
 
 var useStyles$8 =
 /*#__PURE__*/
-styles$5.makeStyles({
+styles$6.makeStyles({
   root: {
     '&:hover': {
       backgroundColor: 'transparent'
@@ -5921,7 +5944,7 @@ var semanticColors = {
 };
 var useStyles$a =
 /*#__PURE__*/
-styles$5.makeStyles({
+styles$6.makeStyles({
   root: {
     backgroundColor: function backgroundColor(props) {
       return props.semantic ? semanticColors[props.semantic] : '#FFFFFF';
@@ -6257,7 +6280,7 @@ React.memo(SlidingSideMenu);
 
 var useStyles$b =
 /*#__PURE__*/
-styles$5.makeStyles({
+styles$6.makeStyles({
   root: {
     margin: function margin(props) {
       var orientation = props.orientation,
@@ -6335,7 +6358,7 @@ function () {
   // Side Effects
   emotion.injectGlobal(_templateObject$c());
   var BASE_FONT_SIZE = 16;
-  return styles$5.createTheme({
+  return styles$6.createTheme({
     typography: {
       fontFamily: ['Helvetica Neue', 'Helvetica', 'Roboto', 'Arial', 'Noto Sans TC', 'Apple LiGothic', '微軟正黑體', 'Microsoft JhengHei', 'sans-serif', 'PingFangTC-Regular'].join(','),
       htmlFontSize: BASE_FONT_SIZE,
@@ -6684,7 +6707,7 @@ function () {
 }();
 var MuiThemeProvider = function MuiThemeProvider(_ref) {
   var children = _ref.children;
-  return React__default.createElement(styles$5.ThemeProvider, {
+  return React__default.createElement(styles$6.ThemeProvider, {
     theme: muiThemeForSurveyCake
   }, children);
 };