@elice/material-exercise 1.231212.0 → 1.231228.0

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

@@ -9,9 +9,9 @@ import '../context/recoilTypes.js';
 import '../context/subjects.js';
 import '../context/ExerciseProvider.js';
 
-var ExerciseMenuArduinoAgentModalButton = function ExerciseMenuArduinoAgentModalButton() {
-  var setOpen = useSetRecoilState(exerciseArduinoAgentModalState);
-  var handleClick = function handleClick() {
+const ExerciseMenuArduinoAgentModalButton = () => {
+  const setOpen = useSetRecoilState(exerciseArduinoAgentModalState);
+  const handleClick = () => {
     setOpen(true);
   };
   return React.createElement(Button, {

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

@@ -1,4 +1,3 @@
-import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React from 'react';
 import { useIntl, FormattedMessage } from 'react-intl';
 import { Popover, Text, Flex, IconButton } from '@elice/blocks';
@@ -14,24 +13,18 @@ import '../context/subjects.js';
 import '../context/ExerciseProvider.js';
 import { StyledFilePopoverContent, StyledFilePopoverHeader, StyledFilePopoverBody, StyledFilePopoverBodyList, StyledPreferenceBodyItem, StyledSelect } from './ExerciseMenuStdioFileBrowser.styled.js';
 
-var ExerciseMenuArduinoSettings = function ExerciseMenuArduinoSettings() {
-  var intl = useIntl();
-  var _React$useState = React.useState(false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    open = _React$useState2[0],
-    setOpen = _React$useState2[1];
-  var anchorRef = React.useRef(null);
-  var ports = useRecoilValue(exerciseArduinoPortsState);
-  var _useRecoilState = useRecoilState(exerciseArduinoPreferenceState),
-    _useRecoilState2 = _slicedToArray(_useRecoilState, 2),
-    preference = _useRecoilState2[0],
-    setPreference = _useRecoilState2[1];
-  var openedPort = useRecoilValue(exerciseArduinoOpenedPortNameState);
-  var onSelectPort = useRecoilValue(exerciseArduinoOnSelectPortState);
+const ExerciseMenuArduinoSettings = () => {
+  const intl = useIntl();
+  const [open, setOpen] = React.useState(false);
+  const anchorRef = React.useRef(null);
+  const ports = useRecoilValue(exerciseArduinoPortsState);
+  const [preference, setPreference] = useRecoilState(exerciseArduinoPreferenceState);
+  const openedPort = useRecoilValue(exerciseArduinoOpenedPortNameState);
+  const onSelectPort = useRecoilValue(exerciseArduinoOnSelectPortState);
   /**
    * List of stdio files.
    */
-  var renderStdioFileList = function renderStdioFileList() {
+  const renderStdioFileList = () => {
     return React.createElement(StyledFilePopoverBodyList, null, React.createElement(StyledPreferenceBodyItem, null, React.createElement(Text, {
       role: "gray3",
       block: true,
@@ -42,17 +35,15 @@ var ExerciseMenuArduinoSettings = function ExerciseMenuArduinoSettings() {
       value: preference.baudRate,
       size: "small",
       width: "xsmall",
-      onChange: function onChange(value) {
+      onChange: value => {
         setPreference(Object.assign(Object.assign({}, preference), {
           baudRate: value
         }));
       }
-    }, ARDUINO_BAUD_RATES.map(function (baudRate) {
-      return React.createElement("option", {
-        key: baudRate,
-        value: baudRate
-      }, baudRate);
-    }))), React.createElement(StyledPreferenceBodyItem, null, React.createElement(Text, {
+    }, ARDUINO_BAUD_RATES.map(baudRate => React.createElement("option", {
+      key: baudRate,
+      value: baudRate
+    }, baudRate)))), React.createElement(StyledPreferenceBodyItem, null, React.createElement(Text, {
       role: "gray3",
       block: true,
       size: "small"
@@ -62,7 +53,7 @@ var ExerciseMenuArduinoSettings = function ExerciseMenuArduinoSettings() {
       value: openedPort !== null && openedPort !== void 0 ? openedPort : '',
       size: "small",
       width: "xsmall",
-      onChange: function onChange(value) {
+      onChange: value => {
         onSelectPort(value);
       }
     }, ports.length === 0 ? React.createElement("option", {
@@ -75,17 +66,15 @@ var ExerciseMenuArduinoSettings = function ExerciseMenuArduinoSettings() {
       disabled: true
     }, React.createElement(FormattedMessage, {
       id: "exerciseMenu.arduino.setting.selectDevice"
-    })), ports.map(function (port) {
-      return React.createElement("option", {
-        key: port.Name,
-        value: port.Name
-      }, "".concat(getDisplayName(port), "@").concat(port.Name));
-    }))));
+    })), ports.map(port => React.createElement("option", {
+      key: port.Name,
+      value: port.Name
+    }, `${getDisplayName(port)}@${port.Name}`)))));
   };
   /**
    * Popover header.
    */
-  var renderStdioFilePopoverHeader = function renderStdioFilePopoverHeader() {
+  const renderStdioFilePopoverHeader = () => {
     return React.createElement(StyledFilePopoverHeader, null, React.createElement(Text, {
       role: "white",
       bold: true
@@ -99,15 +88,13 @@ var ExerciseMenuArduinoSettings = function ExerciseMenuArduinoSettings() {
       size: "micro",
       border: false,
       transparent: true,
-      onClick: function onClick() {
-        return setOpen(false);
-      }
+      onClick: () => setOpen(false)
     }));
   };
   /**
    * Popover body.
    */
-  var renderStdioFilePopoverBody = function renderStdioFilePopoverBody() {
+  const renderStdioFilePopoverBody = () => {
     return React.createElement(StyledFilePopoverBody, {
       children: renderStdioFileList()
     });
@@ -115,7 +102,7 @@ var ExerciseMenuArduinoSettings = function ExerciseMenuArduinoSettings() {
   /**
    * Popover.
    */
-  var renderStdioFilePopover = function renderStdioFilePopover() {
+  const renderStdioFilePopover = () => {
     return React.createElement(Popover, {
       open: open,
       anchorEl: anchorRef.current,
@@ -128,18 +115,14 @@ var ExerciseMenuArduinoSettings = function ExerciseMenuArduinoSettings() {
   /**
    * Popover toggle button.
    */
-  var renderStdioFilePopoverToggleButton = function renderStdioFilePopoverToggleButton() {
+  const renderStdioFilePopoverToggleButton = () => {
     return React.createElement(ExerciseMenuButton, {
       icon: eilMaterialTypeArduino,
       title: intl.formatMessage({
         id: 'exerciseMenu.arduino.setting'
       }),
       active: open,
-      onClick: function onClick() {
-        return setOpen(function (prev) {
-          return !prev;
-        });
-      },
+      onClick: () => setOpen(prev => !prev),
       ref: anchorRef
     });
   };

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

@@ -1,4 +1,3 @@
-import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React from 'react';
 import { useIntl } from 'react-intl';
 import { ButtonMenu } from '@elice/blocks';
@@ -15,53 +14,41 @@ import ExerciseCodeHistory from '../exercise-code-history/ExerciseCodeHistory.js
 import ExerciseRoom from '../exercise-room/ExerciseRoom.js';
 import ExerciseSubmitHistory from '../exercise-submit-history/ExerciseSubmitHistory.js';
 
-var ExerciseMenuDropdown = function ExerciseMenuDropdown() {
-  var intl = useIntl();
-  var _React$useContext = React.useContext(ExerciseContext),
-    materialExerciseId = _React$useContext.materialExerciseId;
-  var user = useRecoilValue(exerciseUserState);
-  var exercise = useRecoilValue(exerciseState(materialExerciseId));
-  var lecture = useRecoilValue(exerciseLectureState(exercise === null || exercise === void 0 ? void 0 : exercise._lectureId));
-  var activeFilename = useRecoilValue(exerciseActiveFilenameState);
-  var setRightpaneActiveState = useSetRecoilState(exerciseRightpaneActiveState);
-  var _React$useState = React.useState(false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    isSubmitHistoryModalOpen = _React$useState2[0],
-    setIsSubmitHistoryModalOpen = _React$useState2[1];
-  var _React$useState3 = React.useState(false),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    isCodeHistoryModalOpen = _React$useState4[0],
-    setIsCodeHistoryModalOpen = _React$useState4[1];
-  var _React$useState5 = React.useState(false),
-    _React$useState6 = _slicedToArray(_React$useState5, 2),
-    isExerciseRoomModalOpen = _React$useState6[0],
-    setIsExerciseRoomModalOpen = _React$useState6[1];
-  var isLectureTestInProgress = typeof (lecture === null || lecture === void 0 ? void 0 : lecture.testAdmissionStatus) !== 'undefined' && lecture.testAdmissionStatus === enums.TestAdmissionStatus.InProgress;
+const ExerciseMenuDropdown = () => {
+  const intl = useIntl();
+  const {
+    materialExerciseId
+  } = React.useContext(ExerciseContext);
+  const user = useRecoilValue(exerciseUserState);
+  const exercise = useRecoilValue(exerciseState(materialExerciseId));
+  const lecture = useRecoilValue(exerciseLectureState(exercise === null || exercise === void 0 ? void 0 : exercise._lectureId));
+  const activeFilename = useRecoilValue(exerciseActiveFilenameState);
+  const setRightpaneActiveState = useSetRecoilState(exerciseRightpaneActiveState);
+  const [isSubmitHistoryModalOpen, setIsSubmitHistoryModalOpen] = React.useState(false);
+  const [isCodeHistoryModalOpen, setIsCodeHistoryModalOpen] = React.useState(false);
+  const [isExerciseRoomModalOpen, setIsExerciseRoomModalOpen] = React.useState(false);
+  const isLectureTestInProgress = typeof (lecture === null || lecture === void 0 ? void 0 : lecture.testAdmissionStatus) !== 'undefined' && lecture.testAdmissionStatus === enums.TestAdmissionStatus.InProgress;
   /**
    *
    */
-  var renderSumbitHistoryModal = function renderSumbitHistoryModal() {
+  const renderSumbitHistoryModal = () => {
     if (!isSubmitHistoryModalOpen) {
       return null;
     }
     return React.createElement(ExerciseSubmitHistory, {
-      onHide: function onHide() {
-        return setIsSubmitHistoryModalOpen(false);
-      }
+      onHide: () => setIsSubmitHistoryModalOpen(false)
     });
   };
   /**
    *
    */
-  var renderCodeHistoryModal = function renderCodeHistoryModal() {
+  const renderCodeHistoryModal = () => {
     if (!isCodeHistoryModalOpen) {
       return null;
     }
     return React.createElement(ExerciseCodeHistory, {
-      onHide: function onHide() {
-        return setIsCodeHistoryModalOpen(false);
-      },
-      onLoadVersionButtonClick: function onLoadVersionButtonClick(content) {
+      onHide: () => setIsCodeHistoryModalOpen(false),
+      onLoadVersionButtonClick: content => {
         exerciseFileEditorContentChange$.next(content);
         setIsCodeHistoryModalOpen(false);
       }
@@ -70,14 +57,12 @@ var ExerciseMenuDropdown = function ExerciseMenuDropdown() {
   /**
    *
    */
-  var renderExerciseRoomModal = function renderExerciseRoomModal() {
+  const renderExerciseRoomModal = () => {
     if (!isExerciseRoomModalOpen) {
       return null;
     }
     return React.createElement(ExerciseRoom, {
-      onHide: function onHide() {
-        return setIsExerciseRoomModalOpen(false);
-      }
+      onHide: () => setIsExerciseRoomModalOpen(false)
     });
   };
   //
@@ -88,40 +73,30 @@ var ExerciseMenuDropdown = function ExerciseMenuDropdown() {
       label: intl.formatMessage({
         id: 'exerciseMenu.dropdown.item.environment'
       }),
-      onClick: function onClick() {
-        return setRightpaneActiveState('environment');
-      }
+      onClick: () => setRightpaneActiveState('environment')
     }, {
       label: intl.formatMessage({
         id: 'exerciseMenu.dropdown.item.preference'
       }),
-      onClick: function onClick() {
-        return setRightpaneActiveState('preference');
-      }
+      onClick: () => setRightpaneActiveState('preference')
     }, {
       label: intl.formatMessage({
         id: 'exerciseMenu.dropdown.item.codeHistory'
       }),
       disabled: !user,
-      onClick: function onClick() {
-        return setIsCodeHistoryModalOpen(true);
-      }
+      onClick: () => setIsCodeHistoryModalOpen(true)
     }, {
       label: intl.formatMessage({
         id: 'exerciseMenu.dropdown.item.submitHistory'
       }),
       disabled: !user || !activeFilename,
-      onClick: function onClick() {
-        return setIsSubmitHistoryModalOpen(true);
-      }
+      onClick: () => setIsSubmitHistoryModalOpen(true)
     }, {
       label: intl.formatMessage({
         id: 'exerciseMenu.dropdown.item.room'
       }),
       disabled: isLectureTestInProgress,
-      onClick: function onClick() {
-        return setIsExerciseRoomModalOpen(true);
-      }
+      onClick: () => setIsExerciseRoomModalOpen(true)
     }],
     size: "xsmall",
     placement: "bottom-end",

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

@@ -1,4 +1,3 @@
-import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React, { useState } from 'react';
 import { useIntl, FormattedMessage } from 'react-intl';
 import { Dialog } from '@elice/blocks';
@@ -23,25 +22,22 @@ import 'lodash/debounce';
 import 'random-words';
 import 'unicount';
 
-var ExerciseMenuReset = function ExerciseMenuReset() {
-  var intl = useIntl();
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    isDialogOpen = _useState2[0],
-    setDialogOpen = _useState2[1];
-  var activeFilename = useRecoilValue(exerciseActiveFilenameState);
-  var isFileResettable = useExerciseFileResettable(activeFilename);
+const ExerciseMenuReset = () => {
+  const intl = useIntl();
+  const [isDialogOpen, setDialogOpen] = useState(false);
+  const activeFilename = useRecoilValue(exerciseActiveFilenameState);
+  const isFileResettable = useExerciseFileResettable(activeFilename);
   /**
    * Reset the active file.
    */
-  var handleReset = function handleReset() {
+  const handleReset = () => {
     exerciseFileEditorContentChange$.next(null);
     setDialogOpen(false);
   };
   /**
    * Reset button.
    */
-  var renderResetButton = function renderResetButton() {
+  const renderResetButton = () => {
     return React.createElement(ExerciseMenuButton, {
       icon: eilReset,
       active: isDialogOpen,
@@ -51,17 +47,13 @@ var ExerciseMenuReset = function ExerciseMenuReset() {
         id: 'exerciseMenu.reset.button.tooltip.disabled'
       }),
       disabled: !isFileResettable,
-      onClick: function onClick() {
-        return setDialogOpen(function (isOpen) {
-          return !isOpen;
-        });
-      }
+      onClick: () => setDialogOpen(isOpen => !isOpen)
     });
   };
   /**
    * Reset confirm dialog.
    */
-  var renderResetConfirmDialog = function renderResetConfirmDialog() {
+  const renderResetConfirmDialog = () => {
     if (!isDialogOpen) {
       return null;
     }
@@ -73,13 +65,9 @@ var ExerciseMenuReset = function ExerciseMenuReset() {
       body: intl.formatMessage({
         id: 'exerciseMenu.reset.confirmDialog.body'
       }),
-      onHide: function onHide() {
-        return setDialogOpen(false);
-      }
+      onHide: () => setDialogOpen(false)
     }, React.createElement(Dialog.CloseButton, {
-      onClick: function onClick() {
-        return setDialogOpen(false);
-      }
+      onClick: () => setDialogOpen(false)
     }, React.createElement(FormattedMessage, {
       id: "exerciseMenu.reset.confirmDialog.cancel"
     })), React.createElement(Dialog.ActionButton, {

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

@@ -1,4 +1,3 @@
-import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React from 'react';
 import { useIntl, FormattedMessage } from 'react-intl';
 import { Popover, Flex, Text, Hspace, NotificationCount, IconButton, Icon, Vspace } from '@elice/blocks';
@@ -14,18 +13,15 @@ import '../context/subjects.js';
 import '../context/ExerciseProvider.js';
 import { StyledFilePopoverContent, StyledMenuButtonFileCount, StyledFilePopoverHeader, StyledFilePopoverBody, StyledFilePopoverBodyList, StyledFilePopoverBodyListItem, StyledFilePopoverBodyListItemContentImageWrap, StyledFilePopoverBodyListItemContentImage, StyledFilePopoverBodyListItemDownloadButton, StyledFilePopoverBodyListItemContentFile } from './ExerciseMenuStdioFileBrowser.styled.js';
 
-var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
-  var intl = useIntl();
-  var _React$useState = React.useState(false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    open = _React$useState2[0],
-    setOpen = _React$useState2[1];
-  var anchorRef = React.useRef(null);
-  var stdioFiles = useRecoilValue(exerciseRunnerStdioFilesState);
+const ExerciseMenuStdioFileBrowser = () => {
+  const intl = useIntl();
+  const [open, setOpen] = React.useState(false);
+  const anchorRef = React.useRef(null);
+  const stdioFiles = useRecoilValue(exerciseRunnerStdioFilesState);
   //
   // Open stdio file browser, on file changes.
   //
-  React.useEffect(function () {
+  React.useEffect(() => {
     if (stdioFiles && stdioFiles.length > 0) {
       setOpen(true);
     }
@@ -35,10 +31,10 @@ var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
   /**
    * Image type stdio file.
    */
-  var renderStdioFileListItemImage = function renderStdioFileListItemImage(key, f) {
+  const renderStdioFileListItemImage = (key, f) => {
     var _a;
-    var ext = (_a = f.mime) === null || _a === void 0 ? void 0 : _a.split('/').pop();
-    var filename = ext ? "image_output.".concat(ext) : 'image_output';
+    const ext = (_a = f.mime) === null || _a === void 0 ? void 0 : _a.split('/').pop();
+    const filename = ext ? `image_output.${ext}` : 'image_output';
     return React.createElement(StyledFilePopoverBodyListItem, {
       key: key
     }, React.createElement(StyledFilePopoverBodyListItemContentImageWrap, null, React.createElement(ImageViewer, null, React.createElement(StyledFilePopoverBodyListItemContentImage, {
@@ -54,8 +50,8 @@ var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
   /**
    * File type stdio file.
    */
-  var renderStdioFileListFile = function renderStdioFileListFile(key, f) {
-    var size = (f.data.length / 1024).toFixed(2);
+  const renderStdioFileListFile = (key, f) => {
+    const size = (f.data.length / 1024).toFixed(2);
     return React.createElement(StyledFilePopoverBodyListItem, {
       key: key
     }, React.createElement(StyledFilePopoverBodyListItemContentFile, null, React.createElement(Text, {
@@ -63,7 +59,7 @@ var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
       role: "white",
       size: "small"
     }), React.createElement(Text, {
-      children: "".concat(size, " KB"),
+      children: `${size} KB`,
       role: "gray4",
       size: "tiny"
     })), React.createElement(StyledFilePopoverBodyListItemDownloadButton, {
@@ -76,7 +72,7 @@ var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
   /**
    * Empty list of stdio files.
    */
-  var renderStdioFileListEmpty = function renderStdioFileListEmpty() {
+  const renderStdioFileListEmpty = () => {
     return React.createElement(Flex, {
       column: true,
       align: "center",
@@ -100,11 +96,11 @@ var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
   /**
    * List of stdio files.
    */
-  var renderStdioFileList = function renderStdioFileList() {
+  const renderStdioFileList = () => {
     if (!stdioFiles || !stdioFiles.length) {
       return renderStdioFileListEmpty();
     }
-    return React.createElement(StyledFilePopoverBodyList, null, stdioFiles.map(function (f, index) {
+    return React.createElement(StyledFilePopoverBodyList, null, stdioFiles.map((f, index) => {
       switch (f.type) {
         case 'image':
           return renderStdioFileListItemImage(index, f);
@@ -118,7 +114,7 @@ var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
   /**
    * Popover header.
    */
-  var renderStdioFilePopoverHeader = function renderStdioFilePopoverHeader() {
+  const renderStdioFilePopoverHeader = () => {
     return React.createElement(StyledFilePopoverHeader, null, React.createElement(Flex, {
       align: "center"
     }, React.createElement(Text, {
@@ -138,15 +134,13 @@ var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
       size: "micro",
       border: false,
       transparent: true,
-      onClick: function onClick() {
-        return setOpen(false);
-      }
+      onClick: () => setOpen(false)
     }));
   };
   /**
    * Popover body.
    */
-  var renderStdioFilePopoverBody = function renderStdioFilePopoverBody() {
+  const renderStdioFilePopoverBody = () => {
     return React.createElement(StyledFilePopoverBody, {
       children: renderStdioFileList()
     });
@@ -154,7 +148,7 @@ var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
   /**
    * Popover.
    */
-  var renderStdioFilePopover = function renderStdioFilePopover() {
+  const renderStdioFilePopover = () => {
     return React.createElement(Popover, {
       open: open,
       anchorEl: anchorRef.current,
@@ -167,18 +161,14 @@ var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
   /**
    * Popover toggle button.
    */
-  var renderStdioFilePopoverToggleButton = function renderStdioFilePopoverToggleButton() {
+  const renderStdioFilePopoverToggleButton = () => {
     return React.createElement(ExerciseMenuButton, {
       icon: eilAttachment,
       active: open,
       title: intl.formatMessage({
         id: 'exerciseMenu.stdioFileBrowser.button.tooltip'
       }),
-      onClick: function onClick() {
-        return setOpen(function (prev) {
-          return !prev;
-        });
-      },
+      onClick: () => setOpen(prev => !prev),
       ref: anchorRef
     }, React.createElement(StyledMenuButtonFileCount, {
       role: "white",

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

@@ -2,40 +2,40 @@ import { NotificationCount, Select } from '@elice/blocks';
 import { base } from '@elice/design-tokens';
 import styled from 'styled-components';
 
-var StyledMenuButtonFileCount = styled(NotificationCount).withConfig({
+const StyledMenuButtonFileCount = styled(NotificationCount).withConfig({
   componentId: "sc-9mtuee-0"
 })(["position:absolute;top:0.2rem;right:0.2rem;padding:0;min-width:0.625rem;height:0.625rem;font-size:0.5rem;"]);
-var StyledFilePopoverContent = styled.div.withConfig({
+const StyledFilePopoverContent = styled.div.withConfig({
   componentId: "sc-9mtuee-1"
 })(["display:flex;flex-direction:column;padding:0;width:252px;min-height:178px;max-height:383px;border-radius:8px;background-color:", ";overflow:hidden;"], base.color.navy6);
-var StyledFilePopoverHeader = styled.div.withConfig({
+const StyledFilePopoverHeader = styled.div.withConfig({
   componentId: "sc-9mtuee-2"
 })(["flex:0 0 2.5rem;display:flex;justify-content:space-between;align-items:center;padding:0 1rem;color:white;background-color:", ";"], base.color.navy7);
-var StyledFilePopoverBody = styled.div.withConfig({
+const StyledFilePopoverBody = styled.div.withConfig({
   componentId: "sc-9mtuee-3"
 })(["flex:1;overflow-x:hidden;overflow-y:auto;"]);
-var StyledFilePopoverBodyList = styled.ul.withConfig({
+const StyledFilePopoverBodyList = styled.ul.withConfig({
   componentId: "sc-9mtuee-4"
 })(["margin:0;padding:0.5rem;width:100%;height:100%;"]);
-var StyledFilePopoverBodyListItem = styled.li.withConfig({
+const StyledFilePopoverBodyListItem = styled.li.withConfig({
   componentId: "sc-9mtuee-5"
 })(["display:flex;margin-bottom:0.5rem;border-radius:0.5rem;background-color:", ";overflow:hidden;&:last-of-type{margin-bottom:0;}"], base.color.navy5);
-var StyledFilePopoverBodyListItemDownloadButton = styled.a.withConfig({
+const StyledFilePopoverBodyListItemDownloadButton = styled.a.withConfig({
   componentId: "sc-9mtuee-6"
 })(["display:flex;align-items:center;justify-content:center;padding:0.75rem;color:", ";font-size:1rem;background-color:", ";"], base.color.white, base.color.primary5);
-var StyledFilePopoverBodyListItemContentFile = styled.div.withConfig({
+const StyledFilePopoverBodyListItemContentFile = styled.div.withConfig({
   componentId: "sc-9mtuee-7"
 })(["flex:1;display:flex;align-items:center;justify-content:space-between;padding:0 0.5rem;"]);
-var StyledFilePopoverBodyListItemContentImageWrap = styled.div.withConfig({
+const StyledFilePopoverBodyListItemContentImageWrap = styled.div.withConfig({
   componentId: "sc-9mtuee-8"
 })(["display:flex;padding:0.5rem;flex:1 1 0;background:", ";"], base.color.white);
-var StyledFilePopoverBodyListItemContentImage = styled.img.withConfig({
+const StyledFilePopoverBodyListItemContentImage = styled.img.withConfig({
   componentId: "sc-9mtuee-9"
 })(["width:100%;max-height:128px;object-fit:contain;cursor:zoom-in;"]);
-var StyledPreferenceBodyItem = styled.div.withConfig({
+const StyledPreferenceBodyItem = styled.div.withConfig({
   componentId: "sc-9mtuee-10"
 })(["display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;min-height:2rem;color:white;&:last-child{margin-bottom:0;}"]);
-var StyledSelect = styled(Select).withConfig({
+const StyledSelect = styled(Select).withConfig({
   componentId: "sc-9mtuee-11"
 })(["> div{background:", " !important;border-color:", " !important;}select{padding:0 !important;height:2rem !important;color:#fff !important;> option{background:", " !important;}}"], base.color.navy8, base.color.navy7, base.color.navy8);
 

package/es/components/material-exercise/exercise-multilang-dropdown/ExerciseMultilangDropdown.js

@@ -1,4 +1,3 @@
-import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React from 'react';
 import { useDebounce } from 'react-use';
 import { Dropdown } from '@elice/blocks';
@@ -9,23 +8,21 @@ import '../context/recoilTypes.js';
 import '../context/subjects.js';
 import '../context/ExerciseProvider.js';
 
-var ExerciseMultilangDropdown = function ExerciseMultilangDropdown() {
-  var _React$useContext = React.useContext(ExerciseContext),
-    materialExerciseId = _React$useContext.materialExerciseId,
-    exerciseRoomId = _React$useContext.exerciseRoomId,
-    onMultiLangLanguageChange = _React$useContext.onMultiLangLanguageChange;
-  var multilangLanguages = useRecoilValue(exerciseMultilangLanguagesState(materialExerciseId));
-  var _useRecoilState = useRecoilState(exerciseMultilangEnvironmentState({
-      materialExerciseId: materialExerciseId,
-      exerciseRoomId: exerciseRoomId
-    })),
-    _useRecoilState2 = _slicedToArray(_useRecoilState, 2),
-    multilangEnvironment = _useRecoilState2[0],
-    setMultilangEnvironment = _useRecoilState2[1];
+const ExerciseMultilangDropdown = () => {
+  const {
+    materialExerciseId,
+    exerciseRoomId,
+    onMultiLangLanguageChange
+  } = React.useContext(ExerciseContext);
+  const multilangLanguages = useRecoilValue(exerciseMultilangLanguagesState(materialExerciseId));
+  const [multilangEnvironment, setMultilangEnvironment] = useRecoilState(exerciseMultilangEnvironmentState({
+    materialExerciseId,
+    exerciseRoomId
+  }));
   //
   // emit `onMultiLangLanguageChange` when language changed
   //
-  useDebounce(function () {
+  useDebounce(() => {
     if (multilangEnvironment && typeof onMultiLangLanguageChange === 'function') {
       onMultiLangLanguageChange(multilangEnvironment.language);
     }
@@ -42,17 +39,13 @@ var ExerciseMultilangDropdown = function ExerciseMultilangDropdown() {
     border: true,
     placement: "bottom-end",
     value: multilangEnvironment.language,
-    onChange: function onChange(language) {
-      return setMultilangEnvironment({
-        language: language
-      });
-    }
-  }, Object.keys(multilangLanguages).map(function (lang) {
-    return React.createElement("option", {
-      key: lang,
-      value: lang
-    }, multilangLanguages[lang].label);
-  }));
+    onChange: language => setMultilangEnvironment({
+      language
+    })
+  }, Object.keys(multilangLanguages).map(lang => React.createElement("option", {
+    key: lang,
+    value: lang
+  }, multilangLanguages[lang].label)));
 };
 
 export { ExerciseMultilangDropdown as default };

package/es/components/material-exercise/exercise-multilang-dropdown/ExerciseMultilangDropdownLazy.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import ExerciseMultilangDropdown from './ExerciseMultilangDropdown.js';
 
-var ExerciseMultilangDropdownLazy = function ExerciseMultilangDropdownLazy() {
+const ExerciseMultilangDropdownLazy = () => {
   return React.createElement(React.Suspense, {
     fallback: null
   }, React.createElement(ExerciseMultilangDropdown, null));