@elice/material-exercise 1.251120.1 → 1.260128.0-rc.0

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

@@ -1,4 +1,5 @@
 import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import _styled from '@emotion/styled/base';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useState, useEffect } from 'react';
 import { Flex, Tooltip, Text } from '@elice/blocks';
@@ -6,17 +7,20 @@ import { useRawEliceIntl } from '@elice/intl';
 import { EliceWebSocket } from '@elice/websocket';
 import { useTheme } from '@emotion/react';
 import { useRecoilValue } from 'recoil';
-import styled from 'styled-components';
-import { exerciseWebSocketTotalStatusQuery } from '../context/recoil.js';
-import '../context/context.js';
-import '../context/recoilTypes.js';
-import '../context/subjects.js';
-import '../context/ExerciseProvider.js';
 import ExerciseRunnerControllerStatusIndicator from './ExerciseRunnerControllerStatusIndicator.js';
+import { exerciseWebSocketTotalStatusQuery } from '../context/recoil.js';
 
-var StyledMessageWrapper = styled(Flex).withConfig({
-  componentId: "sc-1yqi8o2-0"
-})(["height:1rem;"]);
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var StyledMessageWrapper = /*#__PURE__*/_styled(Flex, {
+  target: "e1khqna70"
+})("production" === "production" ? {
+  name: "1f87p0t",
+  styles: "height:1rem"
+} : {
+  name: "1f87p0t",
+  styles: "height:1rem",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
 var ExerciseRunnerControllerStatusMessage = function ExerciseRunnerControllerStatusMessage() {
   var theme = useTheme();
   var intl = useRawEliceIntl();
@@ -68,9 +72,9 @@ var ExerciseRunnerControllerStatusMessage = function ExerciseRunnerControllerSta
       children: [jsx(ExerciseRunnerControllerStatusIndicator, {
         status: websocketStatus === EliceWebSocket.OPEN ? 'success' : websocketStatus === EliceWebSocket.CLOSED ? 'error' : 'warning'
       }), jsx(Text, {
+        bold: true,
         role: "gray3",
         size: "tiny",
-        bold: true,
         children: getWebsocketStateMessage()
       })]
     })

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

@@ -1,20 +1,17 @@
 import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import _styled from '@emotion/styled/base';
 import { jsx } from 'react/jsx-runtime';
 import React from 'react';
 import { Text } from '@elice/blocks';
 import { base } from '@elice/design-tokens';
 import { useRawEliceIntl } from '@elice/intl';
 import { useRecoilValue } from 'recoil';
-import styled from 'styled-components';
-import { exerciseState, exerciseRunnerRunningState } from '../context/recoil.js';
 import { ExerciseContext } from '../context/context.js';
-import '../context/recoilTypes.js';
-import '../context/subjects.js';
-import '../context/ExerciseProvider.js';
+import { exerciseState, exerciseRunnerRunningState } from '../context/recoil.js';
 
-var StyledControllerTimerText = styled(Text).withConfig({
-  componentId: "sc-1ez8ns0-0"
-})(["margin-top:-3px;color:", ";"], base.color.secondary4);
+var StyledControllerTimerText = /*#__PURE__*/_styled(Text, {
+  target: "e4q8u940"
+})("margin-top:-3px;color:", base.color.secondary4, ";");
 var ExerciseRunnerControllerTimer = function ExerciseRunnerControllerTimer() {
   var intl = useRawEliceIntl();
   var _React$useContext = React.useContext(ExerciseContext),

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

@@ -1,4 +1,4 @@
-import { slicedToArray as _slicedToArray, asyncToGenerator as _asyncToGenerator, regeneratorRuntime as _regeneratorRuntime, toConsumableArray as _toConsumableArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { slicedToArray as _slicedToArray, asyncToGenerator as _asyncToGenerator, regenerator as _regenerator, toConsumableArray as _toConsumableArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import React, { useState, useEffect } from 'react';
 import { getOrgMaterialExerciseExerciseRunningList, getOrgMaterialExerciseExerciseRoomUserFileGet, getOrgMaterialExerciseExerciseImageExerciseFileGet, getOrgMaterialExerciseExerciseRunningGet, getOrgMaterialExerciseUsercodeGet } from '@elice/api-client';
@@ -9,25 +9,20 @@ import { Stack, Box, Typography } from '@mui/material';
 import dayjs from 'dayjs';
 import { camelizeKeys } from 'humps';
 import { useRecoilValue } from 'recoil';
-import ExerciseVersionList from '../../shared/exercise-version-list/ExerciseVersionList.js';
-import ExerciseVersionListItem from '../../shared/exercise-version-list/ExerciseVersionListItem.js';
-import MaterialModal from '../../shared/material-modal/MaterialModal.js';
-import MonacoEditorLazy from '../../shared/monaco-editor/MonacoEditorLazy.js';
-import '../../shared/monaco-editor/MonacoEditorPerferenceForm.js';
-import 'monaco-editor/esm/vs/editor/editor.api';
 import { MATERIAL_RESIZABLE_COMMON_PROPS } from '../../../constants/stylesheets.js';
 import { useMaterialExerciseFileUrl } from '../../../hooks/useMaterialExerciseFileUrl.js';
-import { exerciseState, exerciseEditorPreferenceState } from '../context/recoil.js';
-import { ExerciseContext } from '../context/context.js';
-import '../context/recoilTypes.js';
-import '../context/subjects.js';
-import '../context/ExerciseProvider.js';
 import ExerciseSubmitHistoryOutput from './ExerciseSubmitHistoryOutput.js';
-import messageEn from './locales/en.json.js';
-import messageKo from './locales/ko.json.js';
 import { StyledExerciseVersionRunType, StyledExerciseVersionDatetime, StyledExerciseVersionScore } from '../../shared/exercise-version-list/ExerciseVersionListItem.styled.js';
 import { StyledFileTreeWrapper, StyledExerciseSubmitHistoryNotChanged, StyledExerciseSubmitHistoryEditorWrapper, StyledExerciseSubmitHistoryEditorLoadingScreen } from './ExerciseSubmitHistory.styled.js';
 import img from '../../../assets/empty.png.js';
+import messageEn from './locales/en.json.js';
+import messageKo from './locales/ko.json.js';
+import MaterialModal from '../../shared/material-modal/MaterialModal.js';
+import ExerciseVersionList from '../../shared/exercise-version-list/ExerciseVersionList.js';
+import ExerciseVersionListItem from '../../shared/exercise-version-list/ExerciseVersionListItem.js';
+import MonacoEditorLazy from '../../shared/monaco-editor/MonacoEditorLazy.js';
+import { ExerciseContext } from '../context/context.js';
+import { exerciseState, exerciseEditorPreferenceState } from '../context/recoil.js';
 
 var AsyncFileTree = React.lazy(function () {
   return import('../../shared/file-tree/FileTree.js');
@@ -65,29 +60,29 @@ var ExerciseSubmitHistory = function ExerciseSubmitHistory(_ref) {
     offset = _useState8[0],
     setOffset = _useState8[1];
   var _useState9 = useState([]),
-    _useState10 = _slicedToArray(_useState9, 2),
-    fileList = _useState10[0],
-    setFileList = _useState10[1];
+    _useState0 = _slicedToArray(_useState9, 2),
+    fileList = _useState0[0],
+    setFileList = _useState0[1];
+  var _useState1 = useState(null),
+    _useState10 = _slicedToArray(_useState1, 2),
+    selectedFile = _useState10[0],
+    setSelectedFile = _useState10[1];
   var _useState11 = useState(null),
     _useState12 = _slicedToArray(_useState11, 2),
-    selectedFile = _useState12[0],
-    setSelectedFile = _useState12[1];
-  var _useState13 = useState(null),
+    usercodeContent = _useState12[0],
+    setUsercodeContent = _useState12[1];
+  var _useState13 = useState(false),
     _useState14 = _slicedToArray(_useState13, 2),
-    usercodeContent = _useState14[0],
-    setUsercodeContent = _useState14[1];
+    isUserChanged = _useState14[0],
+    setIsUserChanged = _useState14[1];
   var _useState15 = useState(false),
     _useState16 = _slicedToArray(_useState15, 2),
-    isUserChanged = _useState16[0],
-    setIsUserChanged = _useState16[1];
+    isFile = _useState16[0],
+    setIsFile = _useState16[1];
   var _useState17 = useState(false),
     _useState18 = _slicedToArray(_useState17, 2),
-    isFile = _useState18[0],
-    setIsFile = _useState18[1];
-  var _useState19 = useState(false),
-    _useState20 = _slicedToArray(_useState19, 2),
-    isFileReady = _useState20[0],
-    setIsFileReady = _useState20[1];
+    isFileReady = _useState18[0],
+    setIsFileReady = _useState18[1];
   var selectedFileUrl = useMaterialExerciseFileUrl({
     filename: selectedFile,
     exercise: exercise,
@@ -98,21 +93,21 @@ var ExerciseSubmitHistory = function ExerciseSubmitHistory(_ref) {
   //
   //
   useEffect(function () {
-    void _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+    void _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
       var _yield$getOrgMaterial, exerciseRunnings;
-      return _regeneratorRuntime().wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
+      return _regenerator().w(function (_context) {
+        while (1) switch (_context.p = _context.n) {
           case 0:
-            _context.prev = 0;
-            _context.next = 3;
+            _context.p = 0;
+            _context.n = 1;
             return getOrgMaterialExerciseExerciseRunningList({
               materialExerciseId: materialExerciseId,
               userId: exerciseRoomUserId,
               offset: offset,
               count: COUNT
             });
-          case 3:
-            _yield$getOrgMaterial = _context.sent;
+          case 1:
+            _yield$getOrgMaterial = _context.v;
             exerciseRunnings = _yield$getOrgMaterial.exerciseRunnings;
             setRunningList(function (runningList) {
               if (runningList.length === 0 && exerciseRunnings[0]) {
@@ -121,16 +116,15 @@ var ExerciseSubmitHistory = function ExerciseSubmitHistory(_ref) {
               return [].concat(_toConsumableArray(runningList), _toConsumableArray(exerciseRunnings));
             });
             setMoreRunning(exerciseRunnings.length === COUNT);
-            _context.next = 11;
+            _context.n = 3;
             break;
-          case 9:
-            _context.prev = 9;
-            _context.t0 = _context["catch"](0);
-          case 11:
-          case "end":
-            return _context.stop();
+          case 2:
+            _context.p = 2;
+            _context.v;
+          case 3:
+            return _context.a(2);
         }
-      }, _callee, null, [[0, 9]]);
+      }, _callee, null, [[0, 2]]);
     }))();
   }, [materialExerciseId, exerciseRoomUserId, offset]);
   //
@@ -138,26 +132,26 @@ var ExerciseSubmitHistory = function ExerciseSubmitHistory(_ref) {
   // Get exercise running data and filelist.
   //
   useEffect(function () {
-    void _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
-      var _a, _b, _c, _d, _yield$getOrgMaterial2, exerciseRunning, exerciseFileList, exerciseImageTaskFilelist, languages, environment, languagesResponse, response, rootDir, initialOpenFilelist;
-      return _regeneratorRuntime().wrap(function _callee2$(_context2) {
-        while (1) switch (_context2.prev = _context2.next) {
+    void _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2() {
+      var _a, _b, _c, _d, _yield$getOrgMaterial2, exerciseRunning, exerciseFileList, exerciseImageTaskFilelist, languages, environment, languagesResponse, response, rootDir, initialOpenFilelist, _t2, _t4;
+      return _regenerator().w(function (_context2) {
+        while (1) switch (_context2.p = _context2.n) {
           case 0:
             if (selectedRunning) {
-              _context2.next = 2;
+              _context2.n = 1;
               break;
             }
-            return _context2.abrupt("return");
-          case 2:
-            _context2.prev = 2;
-            _context2.next = 5;
+            return _context2.a(2);
+          case 1:
+            _context2.p = 1;
+            _context2.n = 2;
             return getOrgMaterialExerciseExerciseRunningGet({
               exerciseRunningId: selectedRunning.id,
               returnFilelist: true,
               returnUsercodeFilelist: true
             });
-          case 5:
-            _yield$getOrgMaterial2 = _context2.sent;
+          case 2:
+            _yield$getOrgMaterial2 = _context2.v;
             exerciseRunning = _yield$getOrgMaterial2.exerciseRunning;
             setSelectedRunning(exerciseRunning);
             exerciseFileList = [].concat(_toConsumableArray((_a = exerciseRunning.exerciseImage.filelist) !== null && _a !== void 0 ? _a : []), _toConsumableArray((_b = exerciseRunning.exerciseRoom.filelist) !== null && _b !== void 0 ? _b : [])).filter(function (item) {
@@ -167,47 +161,47 @@ var ExerciseSubmitHistory = function ExerciseSubmitHistory(_ref) {
               return !exerciseRunning.exerciseImage.hiddenFilelist.includes(item);
             });
             if (!((exercise === null || exercise === void 0 ? void 0 : exercise.envType) === enums.ExerciseEnvType.MultiLanguage)) {
-              _context2.next = 37;
+              _context2.n = 10;
               break;
             }
-            _context2.prev = 11;
-            _context2.next = 14;
+            _context2.p = 3;
+            _context2.n = 4;
             return getOrgMaterialExerciseExerciseImageExerciseFileGet({
               exerciseImageId: exerciseRunning.exerciseImage.id,
               filename: '.languages.json'
             });
-          case 14:
-            languagesResponse = _context2.sent;
+          case 4:
+            languagesResponse = _context2.v;
             languages = camelizeKeys(JSON.parse(languagesResponse.exerciseFile.content));
-            _context2.next = 21;
+            _context2.n = 6;
             break;
-          case 18:
-            _context2.prev = 18;
-            _context2.t0 = _context2["catch"](11);
-            console.error(_context2.t0);
-          case 21:
-            _context2.prev = 21;
-            _context2.next = 24;
+          case 5:
+            _context2.p = 5;
+            _t2 = _context2.v;
+            console.error(_t2);
+          case 6:
+            _context2.p = 6;
+            _context2.n = 7;
             return getOrgMaterialExerciseExerciseRoomUserFileGet({
               filename: '.environment.json',
               exerciseRoomId: exerciseRoomId,
               targetDatetime: exerciseRunning.createdDatetime
             });
-          case 24:
-            response = _context2.sent;
+          case 7:
+            response = _context2.v;
             environment = camelizeKeys(JSON.parse(response.userFile.content));
-            _context2.next = 31;
+            _context2.n = 9;
             break;
-          case 28:
-            _context2.prev = 28;
-            _context2.t1 = _context2["catch"](21);
+          case 8:
+            _context2.p = 8;
+            _context2.v;
             // API returns error when the user hasn't changed the language
             if (languages && Object.keys(languages).length > 0) {
               environment = {
                 language: Object.keys(languages)[0]
               };
             }
-          case 31:
+          case 9:
             rootDir = languages[environment.language].rootDir;
             initialOpenFilelist = (_d = languages === null || languages === void 0 ? void 0 : languages[environment === null || environment === void 0 ? void 0 : environment.language]) === null || _d === void 0 ? void 0 : _d.initialOpenFilelist;
             setFileList(exerciseFileList.filter(function (filepath) {
@@ -216,73 +210,73 @@ var ExerciseSubmitHistory = function ExerciseSubmitHistory(_ref) {
             if ((initialOpenFilelist === null || initialOpenFilelist === void 0 ? void 0 : initialOpenFilelist.length) > 0) {
               setSelectedFile(initialOpenFilelist[0]);
             }
-            _context2.next = 39;
+            _context2.n = 11;
             break;
-          case 37:
+          case 10:
             setFileList(exerciseFileList);
             if (exerciseImageTaskFilelist && exerciseImageTaskFilelist.length > 0) {
               setSelectedFile(exerciseImageTaskFilelist[0]);
             }
-          case 39:
-            _context2.next = 44;
+          case 11:
+            _context2.n = 13;
             break;
-          case 41:
-            _context2.prev = 41;
-            _context2.t2 = _context2["catch"](2);
-            console.error(_context2.t2);
-          case 44:
-          case "end":
-            return _context2.stop();
+          case 12:
+            _context2.p = 12;
+            _t4 = _context2.v;
+            console.error(_t4);
+          case 13:
+            return _context2.a(2);
         }
-      }, _callee2, null, [[2, 41], [11, 18], [21, 28]]);
+      }, _callee2, null, [[6, 8], [3, 5], [1, 12]]);
     }))();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [selectedRunning === null || selectedRunning === void 0 ? void 0 : selectedRunning.id]);
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  [selectedRunning === null || selectedRunning === void 0 ? void 0 : selectedRunning.id]);
   //
   // When selectedFile or selectedRunning is updated,
   // Get usercode of selected file.
   //
   useEffect(function () {
-    void _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
+    void _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3() {
       var _yield$getOrgMaterial3, usercode, _yield$getOrgMaterial4, exerciseFile;
-      return _regeneratorRuntime().wrap(function _callee3$(_context3) {
-        while (1) switch (_context3.prev = _context3.next) {
+      return _regenerator().w(function (_context3) {
+        while (1) switch (_context3.p = _context3.n) {
           case 0:
             setIsFileReady(false);
             if (!(!(selectedRunning === null || selectedRunning === void 0 ? void 0 : selectedRunning.exerciseImage) || !selectedFile || !exerciseRoomId)) {
-              _context3.next = 3;
+              _context3.n = 1;
               break;
             }
-            return _context3.abrupt("return");
-          case 3:
-            _context3.next = 5;
+            return _context3.a(2);
+          case 1:
+            _context3.n = 2;
             return getOrgMaterialExerciseUsercodeGet({
               filename: selectedFile,
               exerciseRoomId: selectedRunning.exerciseRoom.id,
               targetDatetime: selectedRunning.createdDatetime
             });
-          case 5:
-            _yield$getOrgMaterial3 = _context3.sent;
+          case 2:
+            _yield$getOrgMaterial3 = _context3.v;
             usercode = _yield$getOrgMaterial3.usercode;
             if (!((usercode === null || usercode === void 0 ? void 0 : usercode.content) !== null && (usercode === null || usercode === void 0 ? void 0 : usercode.content) !== undefined)) {
-              _context3.next = 14;
+              _context3.n = 3;
               break;
             }
             setIsUserChanged(true);
             setIsFile(false);
             setUsercodeContent(usercode.content);
             setIsFileReady(true);
-            _context3.next = 27;
+            _context3.n = 6;
             break;
-          case 14:
-            _context3.prev = 14;
-            _context3.next = 17;
+          case 3:
+            _context3.p = 3;
+            _context3.n = 4;
             return getOrgMaterialExerciseExerciseImageExerciseFileGet({
               exerciseImageId: selectedRunning.exerciseImage.id,
               filename: selectedFile
             });
-          case 17:
-            _yield$getOrgMaterial4 = _context3.sent;
+          case 4:
+            _yield$getOrgMaterial4 = _context3.v;
             exerciseFile = _yield$getOrgMaterial4.exerciseFile;
             if ((exerciseFile === null || exerciseFile === void 0 ? void 0 : exerciseFile.content) !== null && (exerciseFile === null || exerciseFile === void 0 ? void 0 : exerciseFile.content) !== undefined) {
               setIsUserChanged(false);
@@ -294,19 +288,18 @@ var ExerciseSubmitHistory = function ExerciseSubmitHistory(_ref) {
               setIsFile(true);
               setIsFileReady(true);
             }
-            _context3.next = 27;
+            _context3.n = 6;
             break;
-          case 22:
-            _context3.prev = 22;
-            _context3.t0 = _context3["catch"](14);
+          case 5:
+            _context3.p = 5;
+            _context3.v;
             setIsUserChanged(false);
             setIsFile(true);
             setIsFileReady(true);
-          case 27:
-          case "end":
-            return _context3.stop();
+          case 6:
+            return _context3.a(2);
         }
-      }, _callee3, null, [[14, 22]]);
+      }, _callee3, null, [[3, 5]]);
     }))();
   }, [selectedFile, exerciseRoomId, selectedRunning]);
   /**
@@ -381,8 +374,8 @@ var ExerciseSubmitHistory = function ExerciseSubmitHistory(_ref) {
     var uniqueFilePath = "submit-history/".concat(exerciseRoomId, "/r").concat(runningId);
     var editorFilename = "".concat(uniqueFilePath, "/").concat(selectedFile);
     return jsxs(Flex, {
-      width: "100%",
       auto: true,
+      width: "100%",
       overflow: "hidden",
       children: [jsx(ResizableNext, Object.assign({}, MATERIAL_RESIZABLE_COMMON_PROPS, {
         initialWidth: 240,

package/es/components/material-exercise/exercise-submit-history/ExerciseSubmitHistory.styled.d.ts

@@ -1,9 +1,30 @@
-/// <reference types="react" />
-export declare const StyledFileTreeWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const StyledExerciseSubmitHistoryEditorWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elice/blocks").FlexProps & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
-export declare const StyledExerciseSubmitHistoryNotChanged: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const StyledExerciseSubmitHistoryEditorLoadingScreen: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elice/blocks").FlexProps & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
-export declare const StyledExerciseSubmitHistoryOutputText: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const StyledExerciseSubmitHistoryOutput: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const StyledExerciseSubmitHistoryOutputImageLink: import("styled-components").StyledComponent<"a", any, {}, never>;
-export declare const StyledExerciseSubmitHistoryOutputImage: import("styled-components").StyledComponent<"img", any, {}, never>;
+export declare const StyledFileTreeWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledExerciseSubmitHistoryEditorWrapper: import("@emotion/styled").StyledComponent<import("@elice/blocks").FlexProps & import("react").RefAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;
+export declare const StyledExerciseSubmitHistoryNotChanged: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledExerciseSubmitHistoryEditorLoadingScreen: import("@emotion/styled").StyledComponent<import("@elice/blocks").FlexProps & import("react").RefAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme;
+}, {}, {}>;
+export declare const StyledExerciseSubmitHistoryOutputText: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const StyledExerciseSubmitHistoryOutput: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledExerciseSubmitHistoryOutputImageLink: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, {}>;
+export declare const StyledExerciseSubmitHistoryOutputImage: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;

package/es/components/material-exercise/exercise-submit-history/ExerciseSubmitHistory.styled.js

@@ -1,30 +1,59 @@
+import _styled from '@emotion/styled/base';
 import { Flex } from '@elice/blocks';
 import { base } from '@elice/design-tokens';
-import styled from 'styled-components';
 
-var StyledFileTreeWrapper = styled.div.withConfig({
-  componentId: "sc-uooiby-0"
-})(["overflow:auto;width:100%;height:100%;background-color:", ";"], base.color.navy9);
-var StyledExerciseSubmitHistoryEditorWrapper = styled(Flex).withConfig({
-  componentId: "sc-uooiby-1"
-})(["position:relative;flex-direction:column;flex:1 1 0%;width:100%;overflow:hidden;"]);
-var StyledExerciseSubmitHistoryNotChanged = styled.div.withConfig({
-  componentId: "sc-uooiby-2"
-})(["background-color:", ";padding:0.5rem;"], base.color.navy7);
-var StyledExerciseSubmitHistoryEditorLoadingScreen = styled(Flex).withConfig({
-  componentId: "sc-uooiby-3"
-})(["position:absolute;top:0;left:0;right:0;bottom:0;background-color:", ";align-items:center;justify-content:center;"], base.color.navy9);
-var StyledExerciseSubmitHistoryOutputText = styled.span.withConfig({
-  componentId: "sc-uooiby-4"
-})(["white-space:pre-wrap;color:", ";font-size:0.875rem;line-height:1.5rem;&.grader{color:", ";}&.info{color:", ";display:block;}&.file{display:block;color:", ";cursor:pointer;&:hover{color:", ";}}"], base.color.white, base.color.secondary4, base.color.red8, base.color.secondary4, base.color.white);
-var StyledExerciseSubmitHistoryOutput = styled.div.withConfig({
-  componentId: "sc-uooiby-5"
-})(["width:100%;height:100%;overflow:scroll;background-color:black;padding:0.5rem;font-size:14px;font-family:Elice Digital Coding;"]);
-var StyledExerciseSubmitHistoryOutputImageLink = styled.a.withConfig({
-  componentId: "sc-uooiby-6"
-})(["display:block;margin:9.8px 0;padding:0;width:100%;max-width:400px;"]);
-var StyledExerciseSubmitHistoryOutputImage = styled.img.withConfig({
-  componentId: "sc-uooiby-7"
-})(["display:block;width:100%;"]);
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+var StyledFileTreeWrapper = /*#__PURE__*/_styled("div", {
+  target: "e170irza7"
+})("overflow:auto;width:100%;height:100%;background-color:", base.color.navy9, ";");
+var StyledExerciseSubmitHistoryEditorWrapper = /*#__PURE__*/_styled(Flex, {
+  target: "e170irza6"
+})("production" === "production" ? {
+  name: "mfy1lq",
+  styles: "position:relative;flex-direction:column;flex:1 1 0%;width:100%;overflow:hidden"
+} : {
+  name: "mfy1lq",
+  styles: "position:relative;flex-direction:column;flex:1 1 0%;width:100%;overflow:hidden",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+var StyledExerciseSubmitHistoryNotChanged = /*#__PURE__*/_styled("div", {
+  target: "e170irza5"
+})("background-color:", base.color.navy7, ";padding:0.5rem;");
+var StyledExerciseSubmitHistoryEditorLoadingScreen = /*#__PURE__*/_styled(Flex, {
+  target: "e170irza4"
+})("position:absolute;top:0;left:0;right:0;bottom:0;background-color:", base.color.navy9, ";align-items:center;justify-content:center;");
+var StyledExerciseSubmitHistoryOutputText = /*#__PURE__*/_styled("span", {
+  target: "e170irza3"
+})("white-space:pre-wrap;color:", base.color.white, ";font-size:0.875rem;line-height:1.5rem;&.grader{color:", base.color.secondary4, ";}&.info{color:", base.color.red8, ";display:block;}&.file{display:block;color:", base.color.secondary4, ";cursor:pointer;&:hover{color:", base.color.white, ";}}");
+var StyledExerciseSubmitHistoryOutput = /*#__PURE__*/_styled("div", {
+  target: "e170irza2"
+})("production" === "production" ? {
+  name: "1bwheg5",
+  styles: "width:100%;height:100%;overflow:scroll;background-color:black;padding:0.5rem;font-size:14px;font-family:Elice Digital Coding"
+} : {
+  name: "1bwheg5",
+  styles: "width:100%;height:100%;overflow:scroll;background-color:black;padding:0.5rem;font-size:14px;font-family:Elice Digital Coding",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+var StyledExerciseSubmitHistoryOutputImageLink = /*#__PURE__*/_styled("a", {
+  target: "e170irza1"
+})("production" === "production" ? {
+  name: "1s8rrkm",
+  styles: "display:block;margin:9.8px 0;padding:0;width:100%;max-width:400px"
+} : {
+  name: "1s8rrkm",
+  styles: "display:block;margin:9.8px 0;padding:0;width:100%;max-width:400px",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+var StyledExerciseSubmitHistoryOutputImage = /*#__PURE__*/_styled("img", {
+  target: "e170irza0"
+})("production" === "production" ? {
+  name: "1082qq3",
+  styles: "display:block;width:100%"
+} : {
+  name: "1082qq3",
+  styles: "display:block;width:100%",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
 
 export { StyledExerciseSubmitHistoryEditorLoadingScreen, StyledExerciseSubmitHistoryEditorWrapper, StyledExerciseSubmitHistoryNotChanged, StyledExerciseSubmitHistoryOutput, StyledExerciseSubmitHistoryOutputImage, StyledExerciseSubmitHistoryOutputImageLink, StyledExerciseSubmitHistoryOutputText, StyledFileTreeWrapper };

package/es/components/material-exercise/exercise-submit-history/ExerciseSubmitHistoryOutput.js

@@ -20,7 +20,7 @@ var ExerciseSubmitHistoryOutput = function ExerciseSubmitHistoryOutput(_ref) {
       }).then(function (_ref2) {
         var output = _ref2.output;
         setRunningOutput(output);
-      }).catch(console.error);
+      })["catch"](console.error);
     }
   }, [exerciseRunningId]);
   var downloadFile = function downloadFile(fileContent, fileName) {
@@ -77,22 +77,26 @@ var ExerciseSubmitHistoryOutput = function ExerciseSubmitHistoryOutput(_ref) {
             })
           });
         case 'file':
-          var fileName = output.data.split(';')[0];
-          // const fileContent = output.data.substring(fileName.length + 1);
-          var fileContent = 'asdf';
-          return jsx(StyledExerciseSubmitHistoryOutputText, {
-            className: "file",
-            onClick: function onClick() {
-              return downloadFile(fileContent, fileName);
-            },
-            children: "Download ".concat(fileName)
-          });
+          {
+            var fileName = output.data.split(';')[0];
+            // const fileContent = output.data.substring(fileName.length + 1);
+            var fileContent = 'asdf';
+            return jsx(StyledExerciseSubmitHistoryOutputText, {
+              className: "file",
+              onClick: function onClick() {
+                return downloadFile(fileContent, fileName);
+              },
+              children: "Download ".concat(fileName)
+            });
+          }
         case 'html':
-          var encodedData = encodeURI(output.data);
-          return jsx("iframe", {
-            title: "mat-exec-output",
-            src: "data:text/html;charset=utf-8,".concat(encodedData)
-          });
+          {
+            var encodedData = encodeURI(output.data);
+            return jsx("iframe", {
+              title: "mat-exec-output",
+              src: "data:text/html;charset=utf-8,".concat(encodedData)
+            });
+          }
         case 'screen':
         case 'score':
         case 'web_ready':