@elice/material-exercise 1.260915.0-edsmigration.0 → 1.260921.0

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoControllerActionCompile.js

@@ -5,8 +5,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _rollupPluginBabelHelpers = require('../../../../_virtual/_rollupPluginBabelHelpers.js');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
-var edsMaterial = require('@elice/eds-material');
 var intl = require('@elice/intl');
+var muiSystem = require('@elice/mui-system');
+var lab = require('@mui/lab');
 var _context = require('./_context.js');
 var useControllerActionRun = require('../action/useControllerActionRun.js');
 var useExericseShortcut = require('../../../../hooks/useExericseShortcut.js');
@@ -62,7 +63,7 @@ var ArduinoControllerActionCompile = function ArduinoControllerActionCompile() {
   if (isHidden) {
     return null;
   }
-  return jsxRuntime.jsx(edsMaterial.Button, {
+  return jsxRuntime.jsx(lab.LoadingButton, {
     size: "small",
     variant: "contained",
     color: "primary",
@@ -70,11 +71,11 @@ var ArduinoControllerActionCompile = function ArduinoControllerActionCompile() {
     disabled: isCompileDisabled,
     sx: {
       color: function color(theme) {
-        return theme.palette.getContrastText(edsMaterial.colors.elicepurple[500]);
+        return theme.palette.getContrastText(muiSystem.colors.elicepurple[500]);
       },
-      bgcolor: edsMaterial.colors.elicepurple[500],
+      bgcolor: muiSystem.colors.elicepurple[500],
       '&:hover, &:active': {
-        bgcolor: edsMaterial.colors.elicepurple[600]
+        bgcolor: muiSystem.colors.elicepurple[600]
       }
     },
     onClick: compile,

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoControllerActionUpload.js

@@ -5,9 +5,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _rollupPluginBabelHelpers = require('../../../../_virtual/_rollupPluginBabelHelpers.js');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
-var edsMaterial = require('@elice/eds-material');
 var intl = require('@elice/intl');
 var mcuBridge = require('@elice/mcu-bridge');
+var muiSystem = require('@elice/mui-system');
+var lab = require('@mui/lab');
 var _context = require('./_context.js');
 var useControllerActionRun = require('../action/useControllerActionRun.js');
 
@@ -76,18 +77,18 @@ var ArduinoControllerActionUpload = function ArduinoControllerActionUpload() {
   if (isHidden) {
     return null;
   }
-  return jsxRuntime.jsx(edsMaterial.Button, {
+  return jsxRuntime.jsx(lab.LoadingButton, {
     size: "small",
     variant: "contained",
     loading: isUploadLoading,
     disabled: isUploadDisabled,
     sx: {
       color: function color(theme) {
-        return theme.palette.getContrastText(edsMaterial.colors.elicepurple[700]);
+        return theme.palette.getContrastText(muiSystem.colors.elicepurple[700]);
       },
-      bgcolor: edsMaterial.colors.elicepurple[700],
+      bgcolor: muiSystem.colors.elicepurple[700],
       '&:hover, &:active': {
-        bgcolor: edsMaterial.colors.elicepurple[800]
+        bgcolor: muiSystem.colors.elicepurple[800]
       }
     },
     onClick: upload,

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoControllerButtonGroup.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
-var edsMaterial = require('@elice/eds-material');
+var material = require('@mui/material');
 var ArduinoControllerActionCompile = require('./ArduinoControllerActionCompile.js');
 var ArduinoControllerActionUpload = require('./ArduinoControllerActionUpload.js');
 var ControllerActionGrade = require('../action/ControllerActionGrade.js');
@@ -13,12 +13,10 @@ var ControllerActionCancel = require('../action/ControllerActionCancel.js');
 //
 //
 var ArduinoControllerButtonGroup = function ArduinoControllerButtonGroup() {
-  return jsxRuntime.jsxs(edsMaterial.Stack, {
+  return jsxRuntime.jsxs(material.Stack, {
     direction: "row",
-    sx: {
-      alignItems: 'center',
-      gap: '0.5rem'
-    },
+    alignItems: "center",
+    gap: "0.5rem",
     children: [jsxRuntime.jsx(ArduinoControllerActionCompile.default, {}), jsxRuntime.jsx(ArduinoControllerActionUpload.default, {}), jsxRuntime.jsx(ControllerActionGrade.default, {}), jsxRuntime.jsx(ControllerActionCancel.default, {})]
   });
 };

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoControllerStatusMessage.js

@@ -5,9 +5,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _rollupPluginBabelHelpers = require('../../../../_virtual/_rollupPluginBabelHelpers.js');
 var jsxRuntime = require('react/jsx-runtime');
 var blocks = require('@elice/blocks');
-var edsMaterial = require('@elice/eds-material');
 var intl = require('@elice/intl');
 var mcuBridge = require('@elice/mcu-bridge');
+var lab = require('@mui/lab');
+var material = require('@mui/material');
 var ExerciseRunnerControllerStatusMessage = require('../ExerciseRunnerControllerStatusMessage.js');
 var _context = require('./_context.js');
 var ArduinoHelpDialogButton = require('./ArduinoHelpDialogButton.js');
@@ -118,12 +119,12 @@ var ArduinoControllerStatusMessage = function ArduinoControllerStatusMessage() {
     }
     return jsxRuntime.jsx(mcuBridge.BaudRateSelect, {
       size: "small",
-      sx: _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, ".".concat(edsMaterial.inputLabelClasses.root), {
+      sx: _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, ".".concat(material.inputLabelClasses.root), {
         display: 'none'
-      }), ".".concat(edsMaterial.inputBaseClasses.root), {
+      }), ".".concat(material.inputBaseClasses.root), {
         width: '10rem',
         minHeight: '1rem'
-      }), ".".concat(edsMaterial.inputBaseClasses.input), {
+      }), ".".concat(material.inputBaseClasses.input), {
         paddingTop: '0.25rem',
         paddingBottom: '0.25rem'
       })
@@ -133,13 +134,11 @@ var ArduinoControllerStatusMessage = function ArduinoControllerStatusMessage() {
    *
    */
   var renderArduinoStatus = function renderArduinoStatus() {
-    return jsxRuntime.jsxs(edsMaterial.Stack, {
+    return jsxRuntime.jsxs(material.Stack, {
       direction: "row",
-      sx: {
-        alignItems: 'center',
-        gap: '0.5rem'
-      },
-      children: [jsxRuntime.jsx(edsMaterial.Box, {
+      alignItems: "center",
+      gap: "0.5rem",
+      children: [jsxRuntime.jsx(material.Box, {
         sx: {
           width: '6px',
           height: '6px',
@@ -158,13 +157,11 @@ var ArduinoControllerStatusMessage = function ArduinoControllerStatusMessage() {
    *
    */
   var renderArduinoConnectButton = function renderArduinoConnectButton() {
-    return jsxRuntime.jsxs(edsMaterial.Stack, {
+    return jsxRuntime.jsxs(material.Stack, {
       direction: "row",
-      sx: {
-        alignItems: 'center',
-        gap: '0.5rem'
-      },
-      children: [jsxRuntime.jsx(edsMaterial.Button, {
+      alignItems: "center",
+      gap: "0.5rem",
+      children: [jsxRuntime.jsx(lab.LoadingButton, {
         color: isConnected ? 'error' : 'success',
         size: "small",
         disabled: !isBrowserSupported || isTransitioning || isFlashing,
@@ -181,16 +178,12 @@ var ArduinoControllerStatusMessage = function ArduinoControllerStatusMessage() {
   //
   //
   //
-  return jsxRuntime.jsxs(edsMaterial.Stack, {
+  return jsxRuntime.jsxs(material.Stack, {
     direction: "row",
-    sx: {
-      alignItems: 'center',
-      gap: '1rem'
-    },
-    children: [renderArduinoBaudRate(), jsxRuntime.jsxs(edsMaterial.Stack, {
-      sx: {
-        alignItems: 'flex-end'
-      },
+    alignItems: "center",
+    gap: "1rem",
+    children: [renderArduinoBaudRate(), jsxRuntime.jsxs(material.Stack, {
+      alignItems: "flex-end",
       children: [jsxRuntime.jsx(ExerciseRunnerControllerStatusMessage.default, {}), renderArduinoStatus()]
     }), renderArduinoConnectButton()]
   });

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoErrorDialog.js

@@ -4,9 +4,23 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../../../_virtual/_rollupPluginBabelHelpers.js');
 var jsxRuntime = require('react/jsx-runtime');
-var edsMaterial = require('@elice/eds-material');
 var intl = require('@elice/intl');
 var mcuBridge = require('@elice/mcu-bridge');
+var Button = require('@mui/material/Button');
+var Dialog = require('@mui/material/Dialog');
+var DialogActions = require('@mui/material/DialogActions');
+var DialogContent = require('@mui/material/DialogContent');
+var DialogTitle = require('@mui/material/DialogTitle');
+var Stack = require('@mui/material/Stack');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var Button__default = /*#__PURE__*/_interopDefaultCompat(Button);
+var Dialog__default = /*#__PURE__*/_interopDefaultCompat(Dialog);
+var DialogActions__default = /*#__PURE__*/_interopDefaultCompat(DialogActions);
+var DialogContent__default = /*#__PURE__*/_interopDefaultCompat(DialogContent);
+var DialogTitle__default = /*#__PURE__*/_interopDefaultCompat(DialogTitle);
+var Stack__default = /*#__PURE__*/_interopDefaultCompat(Stack);
 
 //
 //
@@ -59,7 +73,7 @@ var ArduinoErrorDialog = function ArduinoErrorDialog() {
    *
    */
   var renderErrorDialogTitle = function renderErrorDialogTitle() {
-    return jsxRuntime.jsx(edsMaterial.DialogTitle, {
+    return jsxRuntime.jsx(DialogTitle__default.default, {
       children: intl$1.formatMessage({
         id: 'exerciseRunner.arduino.error.title'
       })
@@ -69,8 +83,8 @@ var ArduinoErrorDialog = function ArduinoErrorDialog() {
    *
    */
   var renderErrorDialogContent = function renderErrorDialogContent() {
-    return jsxRuntime.jsx(edsMaterial.DialogContent, {
-      children: jsxRuntime.jsxs(edsMaterial.Stack, {
+    return jsxRuntime.jsx(DialogContent__default.default, {
+      children: jsxRuntime.jsxs(Stack__default.default, {
         spacing: 1.5,
         children: [permissionPhase === 'denied' ? jsxRuntime.jsx(mcuBridge.PermissionAlert, {
           onRetry: handleRetry
@@ -86,8 +100,8 @@ var ArduinoErrorDialog = function ArduinoErrorDialog() {
    *
    */
   var renderErrorDialogActions = function renderErrorDialogActions() {
-    return jsxRuntime.jsx(edsMaterial.DialogActions, {
-      children: jsxRuntime.jsx(edsMaterial.Button, {
+    return jsxRuntime.jsx(DialogActions__default.default, {
+      children: jsxRuntime.jsx(Button__default.default, {
         color: "inherit",
         onClick: handleClose,
         children: intl$1.formatMessage({
@@ -99,7 +113,7 @@ var ArduinoErrorDialog = function ArduinoErrorDialog() {
   //
   //
   //
-  return jsxRuntime.jsxs(edsMaterial.Dialog, {
+  return jsxRuntime.jsxs(Dialog__default.default, {
     fullWidth: true,
     open: isErrorDialogOpen,
     maxWidth: "sm",

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoHelpDialog.js

@@ -5,16 +5,36 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _rollupPluginBabelHelpers = require('../../../../_virtual/_rollupPluginBabelHelpers.js');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
-var edsKit = require('@elice/eds-kit');
-var edsMaterial = require('@elice/eds-material');
 var intl = require('@elice/intl');
+var muiElements = require('@elice/mui-elements');
 var proRegularSvgIcons = require('@fortawesome/pro-regular-svg-icons');
+var material = require('@mui/material');
+var Box = require('@mui/material/Box');
+var Button = require('@mui/material/Button');
+var Checkbox = require('@mui/material/Checkbox');
+var Dialog = require('@mui/material/Dialog');
+var DialogActions = require('@mui/material/DialogActions');
+var DialogContent = require('@mui/material/DialogContent');
+var DialogTitle = require('@mui/material/DialogTitle');
+var FormControlLabel = require('@mui/material/FormControlLabel');
+var Stack = require('@mui/material/Stack');
+var Typography = require('@mui/material/Typography');
 var _context = require('./_context.js');
 var ArduinoHelpDialogChecklist = require('./ArduinoHelpDialogChecklist.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var Box__default = /*#__PURE__*/_interopDefaultCompat(Box);
+var Button__default = /*#__PURE__*/_interopDefaultCompat(Button);
+var Checkbox__default = /*#__PURE__*/_interopDefaultCompat(Checkbox);
+var Dialog__default = /*#__PURE__*/_interopDefaultCompat(Dialog);
+var DialogActions__default = /*#__PURE__*/_interopDefaultCompat(DialogActions);
+var DialogContent__default = /*#__PURE__*/_interopDefaultCompat(DialogContent);
+var DialogTitle__default = /*#__PURE__*/_interopDefaultCompat(DialogTitle);
+var FormControlLabel__default = /*#__PURE__*/_interopDefaultCompat(FormControlLabel);
+var Stack__default = /*#__PURE__*/_interopDefaultCompat(Stack);
+var Typography__default = /*#__PURE__*/_interopDefaultCompat(Typography);
 
 //
 //
@@ -66,9 +86,9 @@ var ArduinoHelpDialog = function ArduinoHelpDialog() {
    *
    */
   var renderDialogManual = function renderDialogManual() {
-    return jsxRuntime.jsx(edsMaterial.Card, {
+    return jsxRuntime.jsx(material.Card, {
       variant: "outlined",
-      children: jsxRuntime.jsx(edsMaterial.CardActionArea, {
+      children: jsxRuntime.jsx(material.CardActionArea, {
         component: "a",
         href: ARDUINO_FAQ_URL,
         target: "_blank",
@@ -76,37 +96,31 @@ var ArduinoHelpDialog = function ArduinoHelpDialog() {
         sx: {
           p: 1.5
         },
-        children: jsxRuntime.jsxs(edsMaterial.Stack, {
+        children: jsxRuntime.jsxs(Stack__default.default, {
           direction: "row",
           spacing: 1.5,
-          sx: {
-            alignItems: 'center'
-          },
-          children: [jsxRuntime.jsx(edsKit.FaIcon, {
+          alignItems: "center",
+          children: [jsxRuntime.jsx(muiElements.EliceIcon, {
             icon: proRegularSvgIcons.faBookAlt
-          }), jsxRuntime.jsxs(edsMaterial.Box, {
+          }), jsxRuntime.jsxs(Box__default.default, {
             sx: {
               flex: 1,
               minWidth: 0
             },
-            children: [jsxRuntime.jsx(edsMaterial.Typography, {
+            children: [jsxRuntime.jsx(Typography__default.default, {
               variant: "body2",
-              sx: {
-                fontWeight: 700
-              },
+              fontWeight: 700,
               children: intl$1.formatMessage({
                 id: 'exerciseRunner.arduino.help.manual.title'
               })
-            }), jsxRuntime.jsx(edsMaterial.Typography, {
+            }), jsxRuntime.jsx(Typography__default.default, {
               variant: "caption",
-              sx: {
-                color: 'text.secondary'
-              },
+              color: "text.secondary",
               children: intl$1.formatMessage({
                 id: 'exerciseRunner.arduino.help.manual.detail'
               })
             })]
-          }), jsxRuntime.jsx(edsKit.FaIcon, {
+          }), jsxRuntime.jsx(muiElements.EliceIcon, {
             icon: proRegularSvgIcons.faArrowRight
           })]
         })
@@ -116,34 +130,32 @@ var ArduinoHelpDialog = function ArduinoHelpDialog() {
   //
   //
   //
-  return jsxRuntime.jsxs(edsMaterial.Dialog, {
+  return jsxRuntime.jsxs(Dialog__default.default, {
     fullWidth: true,
     open: isHelpDialogOpen,
     maxWidth: "sm",
     onClose: handleClose,
-    children: [jsxRuntime.jsx(edsMaterial.DialogTitle, {
+    children: [jsxRuntime.jsx(DialogTitle__default.default, {
       children: intl$1.formatMessage({
         id: 'exerciseRunner.arduino.help.title'
       })
-    }), jsxRuntime.jsx(edsMaterial.DialogContent, {
-      children: jsxRuntime.jsxs(edsMaterial.Stack, {
+    }), jsxRuntime.jsx(DialogContent__default.default, {
+      children: jsxRuntime.jsxs(Stack__default.default, {
         spacing: 2.5,
-        children: [jsxRuntime.jsx(edsMaterial.Typography, {
+        children: [jsxRuntime.jsx(Typography__default.default, {
           variant: "body2",
-          sx: {
-            color: 'text.secondary'
-          },
+          color: "text.secondary",
           children: intl$1.formatMessage({
             id: 'exerciseRunner.arduino.help.greeting'
           })
         }), jsxRuntime.jsx(ArduinoHelpDialogChecklist.default, {}), renderDialogManual()]
       })
-    }), jsxRuntime.jsxs(edsMaterial.DialogActions, {
+    }), jsxRuntime.jsxs(DialogActions__default.default, {
       sx: {
         justifyContent: 'space-between'
       },
-      children: [wasAutoOpened ? jsxRuntime.jsx(edsMaterial.FormControlLabel, {
-        control: jsxRuntime.jsx(edsMaterial.Checkbox, {
+      children: [wasAutoOpened ? jsxRuntime.jsx(FormControlLabel__default.default, {
+        control: jsxRuntime.jsx(Checkbox__default.default, {
           size: "small",
           checked: dontShowAgain,
           onChange: function onChange(e) {
@@ -153,7 +165,7 @@ var ArduinoHelpDialog = function ArduinoHelpDialog() {
         label: intl$1.formatMessage({
           id: 'exerciseRunner.arduino.help.dontShowAgain'
         })
-      }) : jsxRuntime.jsx(edsMaterial.Box, {}), jsxRuntime.jsx(edsMaterial.Button, {
+      }) : jsxRuntime.jsx(Box__default.default, {}), jsxRuntime.jsx(Button__default.default, {
         color: "inherit",
         onClick: handleClose,
         children: intl$1.formatMessage({

package/cjs/components/material-exercise/exercise-runner/arduino/ArduinoHelpDialogChecklist.js

@@ -3,8 +3,16 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
-var edsMaterial = require('@elice/eds-material');
 var intl = require('@elice/intl');
+var Box = require('@mui/material/Box');
+var Stack = require('@mui/material/Stack');
+var Typography = require('@mui/material/Typography');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var Box__default = /*#__PURE__*/_interopDefaultCompat(Box);
+var Stack__default = /*#__PURE__*/_interopDefaultCompat(Stack);
+var Typography__default = /*#__PURE__*/_interopDefaultCompat(Typography);
 
 //
 //
@@ -19,7 +27,7 @@ var ArduinoHelpDialogChecklist = function ArduinoHelpDialogChecklist() {
    *
    */
   var renderStepBadge = function renderStepBadge(step) {
-    return jsxRuntime.jsx(edsMaterial.Box, {
+    return jsxRuntime.jsx(Box__default.default, {
       "aria-hidden": "true",
       sx: {
         width: 24,
@@ -47,27 +55,23 @@ var ArduinoHelpDialogChecklist = function ArduinoHelpDialogChecklist() {
     var body = intl$1.formatMessage({
       id: "exerciseRunner.arduino.help.checklist.".concat(step, ".body")
     });
-    return jsxRuntime.jsxs(edsMaterial.Stack, {
+    return jsxRuntime.jsxs(Stack__default.default, {
       direction: "row",
       spacing: 1.5,
-      sx: {
-        alignItems: 'flex-start'
-      },
-      children: [renderStepBadge(step), jsxRuntime.jsxs(edsMaterial.Box, {
+      alignItems: "flex-start",
+      children: [renderStepBadge(step), jsxRuntime.jsxs(Box__default.default, {
         sx: {
           flex: 1,
           pt: 0.25
         },
-        children: [jsxRuntime.jsx(edsMaterial.Typography, {
+        children: [jsxRuntime.jsx(Typography__default.default, {
           variant: "body2",
-          sx: {
-            fontWeight: 700
-          },
+          fontWeight: 700,
           children: title
-        }), jsxRuntime.jsx(edsMaterial.Typography, {
+        }), jsxRuntime.jsx(Typography__default.default, {
           variant: "caption",
+          color: "text.secondary",
           sx: {
-            color: 'text.secondary',
             display: 'block',
             mt: 0.25
           },
@@ -79,7 +83,7 @@ var ArduinoHelpDialogChecklist = function ArduinoHelpDialogChecklist() {
   //
   //
   //
-  return jsxRuntime.jsx(edsMaterial.Stack, {
+  return jsxRuntime.jsx(Stack__default.default, {
     spacing: 1.5,
     children: CHECKLIST_STEPS.map(function (step) {
       return renderItem(step);

package/cjs/components/material-exercise/exercise-submit-history/ExerciseSubmitHistory.js

@@ -7,9 +7,9 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var apiClient = require('@elice/api-client');
 var blocks = require('@elice/blocks');
-var edsMaterial = require('@elice/eds-material');
 var intl = require('@elice/intl');
 var types = require('@elice/types');
+var material = require('@mui/material');
 var dayjs = require('dayjs');
 var humps = require('humps');
 var recoil = require('recoil');
@@ -446,30 +446,24 @@ var ExerciseSubmitHistory = function ExerciseSubmitHistory(_ref) {
    *
    */
   var renderEmptySubmitHistoryView = function renderEmptySubmitHistoryView() {
-    return jsxRuntime.jsxs(edsMaterial.Stack, {
+    return jsxRuntime.jsxs(material.Stack, {
+      width: "100%",
+      height: "100%",
+      overflow: "hidden",
+      justifyContent: "center",
+      alignItems: "center",
       direction: "column",
-      sx: {
-        width: '100%',
-        height: '100%',
-        overflow: 'hidden',
-        justifyContent: 'center',
-        alignItems: 'center',
-        gap: '1rem'
-      },
-      children: [jsxRuntime.jsx(edsMaterial.Box, {
+      gap: "1rem",
+      children: [jsxRuntime.jsx(material.Box, {
         component: "img",
+        width: "9.375rem",
+        height: "9.375rem",
         src: empty.default,
-        alt: "emptyImage",
-        sx: {
-          width: '9.375rem',
-          height: '9.375rem'
-        }
-      }), jsxRuntime.jsx(edsMaterial.Typography, {
+        alt: "emptyImage"
+      }), jsxRuntime.jsx(material.Typography, {
         variant: "body1",
-        sx: {
-          color: function color(theme) {
-            return theme.palette.primary.contrastText;
-          }
+        color: function color(theme) {
+          return theme.palette.primary.contrastText;
         },
         children: __intl.formatMessage({
           id: 'exerciseSubmitHistory.empty'
@@ -481,27 +475,21 @@ var ExerciseSubmitHistory = function ExerciseSubmitHistory(_ref) {
    *
    */
   var renderSubmitHistory = function renderSubmitHistory() {
-    return jsxRuntime.jsxs(edsMaterial.Stack, {
+    return jsxRuntime.jsxs(material.Stack, {
+      width: "100%",
+      height: "100%",
+      overflow: "hidden",
       direction: "row",
-      sx: {
-        width: '100%',
-        height: '100%',
-        overflow: 'hidden'
-      },
-      children: [jsxRuntime.jsx(edsMaterial.Box, {
-        sx: {
-          maxWidth: '15rem',
-          width: '100%',
-          height: '100%',
-          overflow: 'hidden'
-        },
+      children: [jsxRuntime.jsx(material.Box, {
+        maxWidth: "15rem",
+        width: "100%",
+        height: "100%",
+        overflow: "hidden",
         children: renderRunningVersionList()
-      }), jsxRuntime.jsxs(edsMaterial.Stack, {
-        sx: {
-          height: '100%',
-          overflow: 'hidden',
-          width: '100%'
-        },
+      }), jsxRuntime.jsxs(material.Stack, {
+        height: "100%",
+        overflow: "hidden",
+        width: "100%",
         children: [renderRunningContent(), renderRunningOutput()]
       })]
     });

package/es/_virtual/_rollupPluginBabelHelpers.js

@@ -251,13 +251,6 @@ function _regeneratorDefine(e, r, n, t) {
 function _slicedToArray(r, e) {
   return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest();
 }
-function _taggedTemplateLiteral(e, t) {
-  return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, {
-    raw: {
-      value: Object.freeze(t)
-    }
-  }));
-}
 function _toConsumableArray(r) {
   return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread();
 }
@@ -292,4 +285,4 @@ function _unsupportedIterableToArray(r, a) {
   }
 }
 
-export { _arrayLikeToArray as arrayLikeToArray, _arrayWithHoles as arrayWithHoles, _arrayWithoutHoles as arrayWithoutHoles, _asyncToGenerator as asyncToGenerator, _classCallCheck as classCallCheck, _createClass as createClass, _createForOfIteratorHelper as createForOfIteratorHelper, _defineProperty as defineProperty, _iterableToArray as iterableToArray, _iterableToArrayLimit as iterableToArrayLimit, _nonIterableRest as nonIterableRest, _nonIterableSpread as nonIterableSpread, _regenerator as regenerator, _regeneratorDefine as regeneratorDefine, _slicedToArray as slicedToArray, _taggedTemplateLiteral as taggedTemplateLiteral, _toConsumableArray as toConsumableArray, _toPrimitive as toPrimitive, _toPropertyKey as toPropertyKey, _typeof as typeof, _unsupportedIterableToArray as unsupportedIterableToArray };
+export { _arrayLikeToArray as arrayLikeToArray, _arrayWithHoles as arrayWithHoles, _arrayWithoutHoles as arrayWithoutHoles, _asyncToGenerator as asyncToGenerator, _classCallCheck as classCallCheck, _createClass as createClass, _createForOfIteratorHelper as createForOfIteratorHelper, _defineProperty as defineProperty, _iterableToArray as iterableToArray, _iterableToArrayLimit as iterableToArrayLimit, _nonIterableRest as nonIterableRest, _nonIterableSpread as nonIterableSpread, _regenerator as regenerator, _regeneratorDefine as regeneratorDefine, _slicedToArray as slicedToArray, _toConsumableArray as toConsumableArray, _toPrimitive as toPrimitive, _toPropertyKey as toPropertyKey, _typeof as typeof, _unsupportedIterableToArray as unsupportedIterableToArray };

package/es/components/material-exercise/exercise-menu/ExerciseMenuStdioFileBrowser.js

@@ -3,15 +3,15 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import React from 'react';
 import { Flex, Text, Hspace, NotificationCount, IconButton, Icon, Vspace } from '@elice/blocks';
 import { base } from '@elice/design-tokens';
-import { Stack, Typography } from '@elice/eds-material';
 import { eilAttachment, eilMathsignMultiplyBasic, eilFolder, eilDownload } from '@elice/icons';
 import { useRawEliceIntl } from '@elice/intl';
+import { ImageViewer } from '@elice/mui-elements';
+import { Stack, Typography } from '@mui/material';
 import { useRecoilValue } from 'recoil';
 import { DARK_TEXT_SECONDARY_COLOR } from '../../../constants/color.js';
 import { StyledMenuButtonFileCount, StyledFilePopoverContent, StyledFilePopoverHeader, StyledFilePopoverBody, StyledFilePopoverBodyList, StyledFilePopoverBodyListItem, StyledFilePopoverBodyListItemContentFile, StyledFilePopoverBodyListItemDownloadButton, StyledFilePopoverBodyListItemContentImageWrap, StyledFilePopoverBodyListItemContentImage } from './ExerciseMenuStdioFileBrowser.styled.js';
 import { exerciseRunnerStdioFilesState } from '../context/recoil.js';
 import ExerciseMenuButton from '../../shared/exercise-menu-button/ExerciseMenuButton.js';
-import ImageViewer from '../../shared/image-viewer/ImageViewer.js';
 
 var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
   var intl = useRawEliceIntl();
@@ -95,9 +95,9 @@ var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
         height: 0.5
       }), jsx(Typography, {
         variant: "body2",
+        textAlign: "center",
         color: DARK_TEXT_SECONDARY_COLOR,
         sx: {
-          textAlign: 'center',
           whiteSpace: 'pre-wrap'
         },
         children: intl.formatMessage({
@@ -181,9 +181,7 @@ var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
   //
   //
   return jsxs(Stack, {
-    sx: {
-      position: 'relative'
-    },
+    position: "relative",
     children: [jsx(ExerciseMenuButton, {
       icon: eilAttachment,
       active: open,

package/es/components/material-exercise/exercise-runner/ExerciseRunnerControllerButtonGroup.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { Stack } from '@elice/eds-material';
+import { Stack } from '@mui/material';
 import ControllerActionRun from './action/ControllerActionRun.js';
 import ControllerActionGrade from './action/ControllerActionGrade.js';
 import ControllerActionCancel from './action/ControllerActionCancel.js';
@@ -11,10 +11,8 @@ import ControllerActionSyncRequest from './action/ControllerActionSyncRequest.js
 var ExerciseRunnerControllerButtonGroup = function ExerciseRunnerControllerButtonGroup() {
   return jsxs(Stack, {
     direction: "row",
-    sx: {
-      alignItems: 'center',
-      gap: '0.5rem'
-    },
+    alignItems: "center",
+    gap: "0.5rem",
     children: [jsx(ControllerActionRun, {}), jsx(ControllerActionGrade, {}), jsx(ControllerActionCancel, {}), jsx(ControllerActionSyncRequest, {})]
   });
 };