@elice/material-exercise 1.240718.0-trasncript.2 → 1.240718.1

package/es/components/material-exercise/exercise-preview/ExercisePreview.js

@@ -1,4 +1,3 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
 import React from 'react';
 import { base } from '@elice/design-tokens';
 import { IntlComponentBuilder, RawEliceIntlProvider } from '@elice/intl';
@@ -15,7 +14,7 @@ import ExercisePreviewDisplayModeButton from './ExercisePreviewDisplayModeButton
 import messageEn from './locales/en.json.js';
 import messageKo from './locales/ko.json.js';
 
-var StyledExercisePreview = styled.div.withConfig({
+const StyledExercisePreview = styled.div.withConfig({
   componentId: "sc-i6d1i5-0"
 })(["width:100%;height:100%;background-color:", ";"], base.color.navy7);
 /**
@@ -23,23 +22,25 @@ var StyledExercisePreview = styled.div.withConfig({
  * - NoVnc
  * - Web browser
  */
-var ExercisePreview = function ExercisePreview(_ref) {
-  var __intl = _ref.__intl;
-  var _React$useContext = React.useContext(ExerciseContext),
-    materialExerciseId = _React$useContext.materialExerciseId;
-  var exercise = useRecoilValue(exerciseState(materialExerciseId));
-  var exercisePreviewType = useRecoilValue(exercisePreviewTypeState(materialExerciseId));
+const ExercisePreview = ({
+  __intl
+}) => {
+  const {
+    materialExerciseId
+  } = React.useContext(ExerciseContext);
+  const exercise = useRecoilValue(exerciseState(materialExerciseId));
+  const exercisePreviewType = useRecoilValue(exercisePreviewTypeState(materialExerciseId));
   // runner states
-  var isSubmitting = useRecoilValue(exerciseRunnerSubmittingState);
-  var isRunning = useRecoilValue(exerciseRunnerRunningState);
-  var exerciseRunnerRoomConnectionInfo = useRecoilValue(exerciseRunnerRoomConnectionInfoState);
+  const isSubmitting = useRecoilValue(exerciseRunnerSubmittingState);
+  const isRunning = useRecoilValue(exerciseRunnerRunningState);
+  const exerciseRunnerRoomConnectionInfo = useRecoilValue(exerciseRunnerRoomConnectionInfoState);
   // preview refs
-  var noVnc = React.useRef(null);
-  var webBrowser = React.useRef(null);
+  const noVnc = React.useRef(null);
+  const webBrowser = React.useRef(null);
   //
   // Action when exercise submitted.
   //
-  React.useEffect(function () {
+  React.useEffect(() => {
     var _a, _b;
     if (!isSubmitting) {
       return;
@@ -58,44 +59,41 @@ var ExercisePreview = function ExercisePreview(_ref) {
   /**
    * NoVnc
    */
-  var renderNoVnc = function renderNoVnc() {
+  const renderNoVnc = () => {
     if (exercisePreviewType !== ExercisePreviewType.NoVnc) {
       return null;
     }
     if (!(exercise === null || exercise === void 0 ? void 0 : exercise.readyExerciseImage) || !exerciseRunnerRoomConnectionInfo) {
       return null;
     }
-    return jsx(NoVncLazy, Object.assign({}, exerciseRunnerRoomConnectionInfo, {
+    return React.createElement(NoVncLazy, Object.assign({}, exerciseRunnerRoomConnectionInfo, {
       isRunning: isRunning,
       readyExerciseImage: exercise.readyExerciseImage,
-      exercisePreviewDisplayModeButton: jsx(ExercisePreviewDisplayModeButton, {}),
+      exercisePreviewDisplayModeButton: React.createElement(ExercisePreviewDisplayModeButton, null),
       ref: noVnc
     }));
   };
   /**
    * Web browser
    */
-  var renderWebBrowser = function renderWebBrowser() {
+  const renderWebBrowser = () => {
     if (exercisePreviewType !== ExercisePreviewType.WebBrowser) {
       return null;
     }
     if (!exerciseRunnerRoomConnectionInfo) {
       return null;
     }
-    return jsx(WebBrowser, Object.assign({}, exerciseRunnerRoomConnectionInfo, {
-      menuButtons: jsx(ExercisePreviewDisplayModeButton, {}),
+    return React.createElement(WebBrowser, Object.assign({}, exerciseRunnerRoomConnectionInfo, {
+      menuButtons: React.createElement(ExercisePreviewDisplayModeButton, null),
       ref: webBrowser
     }));
   };
   //
   //
   //
-  return jsx(RawEliceIntlProvider, {
-    value: __intl,
-    children: jsxs(StyledExercisePreview, {
-      children: [renderNoVnc(), renderWebBrowser()]
-    })
-  });
+  return React.createElement(RawEliceIntlProvider, {
+    value: __intl
+  }, React.createElement(StyledExercisePreview, null, renderNoVnc(), renderWebBrowser()));
 };
 var ExercisePreview$1 = new IntlComponentBuilder(ExercisePreview).add('en', messageEn).add('ko', messageKo).addAsync('th', import('./locales/th.json.js')).addAsync('ja', import('./locales/ja.json.js')).build();
 

package/es/components/material-exercise/exercise-preview/ExercisePreviewDisplayModeButton.js

@@ -1,6 +1,4 @@
-import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
-import { forwardRef } from 'react';
+import React, { forwardRef } from 'react';
 import { eilScreenHalf, eilPanelRight } from '@elice/icons';
 import { useRawEliceIntl } from '@elice/intl';
 import { useRecoilState } from 'recoil';
@@ -11,25 +9,20 @@ import { ExercisePreviewDisplayMode } from '../context/recoilTypes.js';
 import '../context/subjects.js';
 import '../context/ExerciseProvider.js';
 
-var ExercisePreviewDisplayModeButton = forwardRef(function (props, ref) {
+const ExercisePreviewDisplayModeButton = forwardRef((props, ref) => {
   var _a;
-  var intl = useRawEliceIntl();
-  var _useRecoilState = useRecoilState(exercisePreviewDisplayModeState),
-    _useRecoilState2 = _slicedToArray(_useRecoilState, 2),
-    exercisePreviewDisplayMode = _useRecoilState2[0],
-    setExercisePreviewDisplayMode = _useRecoilState2[1];
+  const intl = useRawEliceIntl();
+  const [exercisePreviewDisplayMode, setExercisePreviewDisplayMode] = useRecoilState(exercisePreviewDisplayModeState);
   /**
    * Handle click.
    */
-  var handleClick = function handleClick() {
-    setExercisePreviewDisplayMode(function (prevDisplayMode) {
-      return prevDisplayMode === ExercisePreviewDisplayMode.Mini ? ExercisePreviewDisplayMode.SideBySide : ExercisePreviewDisplayMode.Mini;
-    });
+  const handleClick = () => {
+    setExercisePreviewDisplayMode(prevDisplayMode => prevDisplayMode === ExercisePreviewDisplayMode.Mini ? ExercisePreviewDisplayMode.SideBySide : ExercisePreviewDisplayMode.Mini);
   };
   //
   //
   //
-  return jsx(ExerciseMenuButton, Object.assign({}, props, {
+  return React.createElement(ExerciseMenuButton, Object.assign({}, props, {
     icon: exercisePreviewDisplayMode === ExercisePreviewDisplayMode.Mini ? eilScreenHalf : eilPanelRight,
     title: ((_a = props.title) !== null && _a !== void 0 ? _a : exercisePreviewDisplayMode === ExercisePreviewDisplayMode.Mini) ? intl.formatMessage({
       id: 'exercisePreview.displayModeButton.sideBySide'

package/es/components/material-exercise/exercise-rightpane/ExerciseRightpane.js

@@ -1,5 +1,4 @@
-import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
+import React from 'react';
 import { IconButton, Hr, Flex, Text } from '@elice/blocks';
 import { base } from '@elice/design-tokens';
 import { eilMathsignMultiplyBasic } from '@elice/icons';
@@ -17,38 +16,36 @@ import ExerciseRightpaneEnvironment from './ExerciseRightpaneEnvironment.js';
 import messageEn from './locales/en.json.js';
 import messageKo from './locales/ko.json.js';
 
-var HEADER_CLOSE_BUTTON_SIZE = '1.75rem';
-var StyledRightpaneWrap = styled.div.withConfig({
+const HEADER_CLOSE_BUTTON_SIZE = '1.75rem';
+const StyledRightpaneWrap = styled.div.withConfig({
   componentId: "sc-1tj3x49-0"
 })(["position:relative;display:flex;flex-direction:column;width:20rem;border-left:", ";color:white;background-color:", ";"], MATERIAL_DIVIDER_BORDER_VALUE, base.color.navy9);
-var StyledPreferenceHeader = styled.div.withConfig({
+const StyledPreferenceHeader = styled.div.withConfig({
   componentId: "sc-1tj3x49-1"
 })(["display:flex;flex-direction:column;padding:0.25rem 1rem;"]);
-var StyledPreferenceHeaderCloseButton = styled(IconButton).withConfig({
+const StyledPreferenceHeaderCloseButton = styled(IconButton).withConfig({
   componentId: "sc-1tj3x49-2"
 })(["flex:0 0 ", ";height:", " !important;"], HEADER_CLOSE_BUTTON_SIZE, HEADER_CLOSE_BUTTON_SIZE);
-var StyledRightpaneBodyWrap = styled.div.withConfig({
+const StyledRightpaneBodyWrap = styled.div.withConfig({
   componentId: "sc-1tj3x49-3"
 })(["flex:1;padding:1rem;overflow-x:hidden;overflow-y:auto;", ""], getMaterialScrollBarCss({
   width: '0.375rem',
   borderRadius: '2px'
 }));
-var ExerciseRightpane = function ExerciseRightpane(_ref) {
-  var __intl = _ref.__intl;
-  var _useRecoilState = useRecoilState(exerciseRightpaneActiveState),
-    _useRecoilState2 = _slicedToArray(_useRecoilState, 2),
-    activeState = _useRecoilState2[0],
-    setActiveState = _useRecoilState2[1];
+const ExerciseRightpane = ({
+  __intl
+}) => {
+  const [activeState, setActiveState] = useRecoilState(exerciseRightpaneActiveState);
   /**
    *
    */
-  var handleClose = function handleClose() {
+  const handleClose = () => {
     setActiveState(null);
   };
   /**
    * Title of pane header.
    */
-  var renderRightpaneHeaderTitle = function renderRightpaneHeaderTitle() {
+  const renderRightpaneHeaderTitle = () => {
     switch (activeState) {
       case 'environment':
         return __intl.formatMessage({
@@ -65,33 +62,29 @@ var ExerciseRightpane = function ExerciseRightpane(_ref) {
   /**
    * Pane header.
    */
-  var renderRightpaneHeader = function renderRightpaneHeader() {
-    return jsx(StyledPreferenceHeader, {
-      children: jsxs(Flex, {
-        align: "center",
-        children: [jsx(Text, {
-          role: "white",
-          bold: true,
-          block: true,
-          children: renderRightpaneHeaderTitle()
-        }), jsx(StyledPreferenceHeaderCloseButton, {
-          icon: eilMathsignMultiplyBasic,
-          size: "tight",
-          role: "white",
-          onClick: handleClose
-        })]
-      })
-    });
+  const renderRightpaneHeader = () => {
+    return React.createElement(StyledPreferenceHeader, null, React.createElement(Flex, {
+      align: "center"
+    }, React.createElement(Text, {
+      role: "white",
+      bold: true,
+      block: true
+    }, renderRightpaneHeaderTitle()), React.createElement(StyledPreferenceHeaderCloseButton, {
+      icon: eilMathsignMultiplyBasic,
+      size: "tight",
+      role: "white",
+      onClick: handleClose
+    })));
   };
   /**
    * Pane content.
    */
-  var renderRightpaneBodyContent = function renderRightpaneBodyContent() {
+  const renderRightpaneBodyContent = () => {
     switch (activeState) {
       case 'environment':
-        return jsx(ExerciseRightpaneEnvironment, {});
+        return React.createElement(ExerciseRightpaneEnvironment, null);
       case 'preference':
-        return jsx(ExerciseRightpaneEditorPerference, {});
+        return React.createElement(ExerciseRightpaneEditorPerference, null);
       default:
         return null;
     }
@@ -102,18 +95,13 @@ var ExerciseRightpane = function ExerciseRightpane(_ref) {
   if (!activeState) {
     return null;
   }
-  return jsx(RawEliceIntlProvider, {
-    value: __intl,
-    children: jsxs(StyledRightpaneWrap, {
-      children: [renderRightpaneHeader(), jsx(Hr, {
-        marginStart: 0,
-        marginEnd: 0,
-        color: base.color.navy6
-      }), jsx(StyledRightpaneBodyWrap, {
-        children: renderRightpaneBodyContent()
-      })]
-    })
-  });
+  return React.createElement(RawEliceIntlProvider, {
+    value: __intl
+  }, React.createElement(StyledRightpaneWrap, null, renderRightpaneHeader(), React.createElement(Hr, {
+    marginStart: 0,
+    marginEnd: 0,
+    color: base.color.navy6
+  }), React.createElement(StyledRightpaneBodyWrap, null, renderRightpaneBodyContent())));
 };
 var ExerciseRightpane$1 = new IntlComponentBuilder(ExerciseRightpane).add('en', messageEn).add('ko', messageKo).addAsync('th', import('./locales/th.json.js')).addAsync('ja', import('./locales/ja.json.js')).build();
 

package/es/components/material-exercise/exercise-rightpane/ExerciseRightpaneEditorPerference.js

@@ -1,5 +1,3 @@
-import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
 import React from 'react';
 import { useRecoilState } from 'recoil';
 import '../../shared/monaco-editor/MonacoEditorLazy.js';
@@ -11,14 +9,12 @@ import '../context/recoilTypes.js';
 import '../context/subjects.js';
 import '../context/ExerciseProvider.js';
 
-var ExerciseRightpaneEditorPerference = function ExerciseRightpaneEditorPerference() {
-  var _React$useContext = React.useContext(ExerciseContext),
-    locale = _React$useContext.locale;
-  var _useRecoilState = useRecoilState(exerciseEditorPreferenceState),
-    _useRecoilState2 = _slicedToArray(_useRecoilState, 2),
-    preference = _useRecoilState2[0],
-    setPreference = _useRecoilState2[1];
-  return jsx(MonacoEditorPerference, {
+const ExerciseRightpaneEditorPerference = () => {
+  const {
+    locale
+  } = React.useContext(ExerciseContext);
+  const [preference, setPreference] = useRecoilState(exerciseEditorPreferenceState);
+  return React.createElement(MonacoEditorPerference, {
     value: preference,
     locale: locale,
     onChange: setPreference

package/es/components/material-exercise/exercise-rightpane/ExerciseRightpaneEnvironment.js

@@ -1,4 +1,3 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
 import React from 'react';
 import { Text, Vspace } from '@elice/blocks';
 import { useRawEliceIntl } from '@elice/intl';
@@ -10,101 +9,95 @@ import '../context/recoilTypes.js';
 import '../context/subjects.js';
 import '../context/ExerciseProvider.js';
 
-var StyledEnvironmentList = styled.ul.withConfig({
+const StyledEnvironmentList = styled.ul.withConfig({
   componentId: "sc-208wkr-0"
 })(["margin:0;padding:0;list-style:none;> li{margin-bottom:2rem;&:last-of-type{margin-bottom:0;}}"]);
-var ExerciseRightpaneEnvironment = function ExerciseRightpaneEnvironment() {
-  var intl = useRawEliceIntl();
-  var _React$useContext = React.useContext(ExerciseContext),
-    materialExerciseId = _React$useContext.materialExerciseId;
-  var materialExercise = useRecoilValue(exerciseState(materialExerciseId));
-  var readyExerciseImage = materialExercise === null || materialExercise === void 0 ? void 0 : materialExercise.readyExerciseImage;
+const ExerciseRightpaneEnvironment = () => {
+  const intl = useRawEliceIntl();
+  const {
+    materialExerciseId
+  } = React.useContext(ExerciseContext);
+  const materialExercise = useRecoilValue(exerciseState(materialExerciseId));
+  const readyExerciseImage = materialExercise === null || materialExercise === void 0 ? void 0 : materialExercise.readyExerciseImage;
   /**
    *
    */
-  var exerciseEnvironment = React.useMemo(function () {
-    return readyExerciseImage ? [{
-      name: intl.formatMessage({
-        id: 'exerciseRightpane.environment.item.cpuLimit.name'
-      }),
-      value: intl.formatMessage({
-        id: 'exerciseRightpane.environment.item.cpuLimit.value'
-      })
-    }, {
-      name: intl.formatMessage({
-        id: 'exerciseRightpane.environment.item.timeLimit.name'
-      }),
-      value: intl.formatNumber(readyExerciseImage.timeLimit / 1000, {
-        style: 'unit',
-        unit: 'second',
-        unitDisplay: 'short'
-      })
-    }, {
-      name: intl.formatMessage({
-        id: 'exerciseRightpane.environment.item.memoryLimit.name'
-      }),
-      value: intl.formatNumber(readyExerciseImage.memoryLimit / 1024 / 1024, {
-        style: 'unit',
-        unit: 'megabyte',
-        unitDisplay: 'short'
-      })
-    }, {
-      name: intl.formatMessage({
-        id: 'exerciseRightpane.environment.item.isVnc.name'
-      }),
-      value: readyExerciseImage.isVnc ? intl.formatMessage({
-        id: 'exerciseRightpane.environment.item.common.value.true'
-      }) : intl.formatMessage({
-        id: 'exerciseRightpane.environment.item.common.value.false'
-      })
-    }, {
-      name: intl.formatMessage({
-        id: 'exerciseRightpane.environment.item.httpPort.name'
-      }),
-      value: readyExerciseImage.httpPort ? intl.formatMessage({
-        id: 'exerciseRightpane.environment.item.httpPort.value.true'
-      }) : intl.formatMessage({
-        id: 'exerciseRightpane.environment.item.httpPort.value.false'
-      })
-    }, {
-      name: intl.formatMessage({
-        id: 'exerciseRightpane.environment.item.isGpu.name'
-      }),
-      value: readyExerciseImage.isGpu ? intl.formatMessage({
-        id: 'exerciseRightpane.environment.item.common.value.true'
-      }) : intl.formatMessage({
-        id: 'exerciseRightpane.environment.item.common.value.false'
-      })
-    }] : null;
-  }, [readyExerciseImage, intl]);
+  const exerciseEnvironment = React.useMemo(() => readyExerciseImage ? [{
+    name: intl.formatMessage({
+      id: 'exerciseRightpane.environment.item.cpuLimit.name'
+    }),
+    value: intl.formatMessage({
+      id: 'exerciseRightpane.environment.item.cpuLimit.value'
+    })
+  }, {
+    name: intl.formatMessage({
+      id: 'exerciseRightpane.environment.item.timeLimit.name'
+    }),
+    value: intl.formatNumber(readyExerciseImage.timeLimit / 1000, {
+      style: 'unit',
+      unit: 'second',
+      unitDisplay: 'short'
+    })
+  }, {
+    name: intl.formatMessage({
+      id: 'exerciseRightpane.environment.item.memoryLimit.name'
+    }),
+    value: intl.formatNumber(readyExerciseImage.memoryLimit / 1024 / 1024, {
+      style: 'unit',
+      unit: 'megabyte',
+      unitDisplay: 'short'
+    })
+  }, {
+    name: intl.formatMessage({
+      id: 'exerciseRightpane.environment.item.isVnc.name'
+    }),
+    value: readyExerciseImage.isVnc ? intl.formatMessage({
+      id: 'exerciseRightpane.environment.item.common.value.true'
+    }) : intl.formatMessage({
+      id: 'exerciseRightpane.environment.item.common.value.false'
+    })
+  }, {
+    name: intl.formatMessage({
+      id: 'exerciseRightpane.environment.item.httpPort.name'
+    }),
+    value: readyExerciseImage.httpPort ? intl.formatMessage({
+      id: 'exerciseRightpane.environment.item.httpPort.value.true'
+    }) : intl.formatMessage({
+      id: 'exerciseRightpane.environment.item.httpPort.value.false'
+    })
+  }, {
+    name: intl.formatMessage({
+      id: 'exerciseRightpane.environment.item.isGpu.name'
+    }),
+    value: readyExerciseImage.isGpu ? intl.formatMessage({
+      id: 'exerciseRightpane.environment.item.common.value.true'
+    }) : intl.formatMessage({
+      id: 'exerciseRightpane.environment.item.common.value.false'
+    })
+  }] : null, [readyExerciseImage, intl]);
   //
   //
   //
   if (!exerciseEnvironment) {
     return null;
   }
-  return jsx(StyledEnvironmentList, {
-    children: exerciseEnvironment.map(function (_ref) {
-      var name = _ref.name,
-        value = _ref.value;
-      return jsxs("li", {
-        children: [jsx(Text, {
-          role: "navy",
-          block: true,
-          size: "small",
-          children: name
-        }), jsx(Vspace, {
-          height: 0.5
-        }), jsx(Text, {
-          role: "white",
-          bold: true,
-          block: true,
-          size: "small",
-          children: value
-        })]
-      }, name);
-    })
-  });
+  return React.createElement(StyledEnvironmentList, null, exerciseEnvironment.map(({
+    name,
+    value
+  }) => React.createElement("li", {
+    key: name
+  }, React.createElement(Text, {
+    role: "navy",
+    block: true,
+    size: "small"
+  }, name), React.createElement(Vspace, {
+    height: 0.5
+  }), React.createElement(Text, {
+    role: "white",
+    bold: true,
+    block: true,
+    size: "small"
+  }, value))));
 };
 
 export { ExerciseRightpaneEnvironment as default };

package/es/components/material-exercise/exercise-room/ExerciseRoom.js

@@ -1,5 +1,3 @@
-import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
-import { jsx } from 'react/jsx-runtime';
 import React from 'react';
 import { IntlComponentBuilder, RawEliceIntlProvider } from '@elice/intl';
 import MaterialExerciseExerciseRoomDetail from './ExerciseRoomDetail.js';
@@ -7,29 +5,22 @@ import MaterialExerciseExerciseRoomList from './ExerciseRoomList.js';
 import messageEn from './locales/en.json.js';
 import messageKo from './locales/ko.json.js';
 
-var ExerciseRoom = function ExerciseRoom(_ref) {
-  var onHide = _ref.onHide,
-    __intl = _ref.__intl;
-  var _React$useState = React.useState(),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    selectedExerciseRoomId = _React$useState2[0],
-    setSelectedExerciseRoomId = _React$useState2[1];
-  var ExerciseRoomContent = selectedExerciseRoomId ? jsx(MaterialExerciseExerciseRoomDetail, {
+const ExerciseRoom = ({
+  onHide,
+  __intl
+}) => {
+  const [selectedExerciseRoomId, setSelectedExerciseRoomId] = React.useState();
+  const ExerciseRoomContent = selectedExerciseRoomId ? React.createElement(MaterialExerciseExerciseRoomDetail, {
     selectedExerciseRoomId: selectedExerciseRoomId,
-    goToList: function goToList() {
-      return setSelectedExerciseRoomId(undefined);
-    },
+    goToList: () => setSelectedExerciseRoomId(undefined),
     onHide: onHide
-  }) : jsx(MaterialExerciseExerciseRoomList, {
-    onExerciseRoomClick: function onExerciseRoomClick(id) {
-      return setSelectedExerciseRoomId(id);
-    },
+  }) : React.createElement(MaterialExerciseExerciseRoomList, {
+    onExerciseRoomClick: id => setSelectedExerciseRoomId(id),
     onHide: onHide
   });
-  return jsx(RawEliceIntlProvider, {
-    value: __intl,
-    children: ExerciseRoomContent
-  });
+  return React.createElement(RawEliceIntlProvider, {
+    value: __intl
+  }, ExerciseRoomContent);
 };
 var ExerciseRoom$1 = new IntlComponentBuilder(ExerciseRoom).add('en', messageEn).add('ko', messageKo).addAsync('th', import('./locales/th.json.js')).addAsync('ja', import('./locales/ja.json.js')).build();
 

package/es/components/material-exercise/exercise-room/ExerciseRoom.styled.js

@@ -1,31 +1,29 @@
 import { base } from '@elice/design-tokens';
 import styled from 'styled-components';
 
-var StyledExerciseRoomTableWrapper = styled.div.withConfig({
+const StyledExerciseRoomTableWrapper = styled.div.withConfig({
   componentId: "sc-r4oydl-0"
 })(["overflow-y:auto;max-height:25rem;border-radius:4px;background-color:", ";height:18.75rem;"], base.color.navy7);
-var StyledExerciseRoomTable = styled.table.withConfig({
+const StyledExerciseRoomTable = styled.table.withConfig({
   componentId: "sc-r4oydl-1"
 })(["width:100%;color:", ";border-collapse:collapse;"], base.color.navy2);
-var StyledExerciseRoomThead = styled.thead.withConfig({
+const StyledExerciseRoomThead = styled.thead.withConfig({
   componentId: "sc-r4oydl-2"
 })(["& th{position:sticky;top:0;background-color:", ";z-index:100;border-bottom:1px solid ", ";}"], base.color.navy7, base.color.navy6);
-var StyledExerciseRoomTd = styled.td.withConfig({
+const StyledExerciseRoomTd = styled.td.withConfig({
   componentId: "sc-r4oydl-3"
 })(["padding:0.875rem 1rem;"]);
-var StyledExerciseRoomTr = styled.tr.withConfig({
+const StyledExerciseRoomTr = styled.tr.withConfig({
   componentId: "sc-r4oydl-4"
 })([""]);
-var StyledExerciseRoomTbody = styled.tbody.withConfig({
+const StyledExerciseRoomTbody = styled.tbody.withConfig({
   componentId: "sc-r4oydl-5"
-})(["", "{border-bottom:1px solid ", ";}", ":hover{background-color:", ";cursor:", ";}", "{height:3.25rem;}"], StyledExerciseRoomTr, base.color.navy6, StyledExerciseRoomTr, function (_ref) {
-  var hoverable = _ref.hoverable;
-  return hoverable ? base.color.navy5 : '';
-}, function (_ref2) {
-  var hoverable = _ref2.hoverable;
-  return hoverable ? 'pointer' : 'auto';
-}, StyledExerciseRoomTd);
-var StyledExerciseRoomTh = styled.th.withConfig({
+})(["", "{border-bottom:1px solid ", ";}", ":hover{background-color:", ";cursor:", ";}", "{height:3.25rem;}"], StyledExerciseRoomTr, base.color.navy6, StyledExerciseRoomTr, ({
+  hoverable
+}) => hoverable ? base.color.navy5 : '', ({
+  hoverable
+}) => hoverable ? 'pointer' : 'auto', StyledExerciseRoomTd);
+const StyledExerciseRoomTh = styled.th.withConfig({
   componentId: "sc-r4oydl-6"
 })(["font-weight:bold;font-size:", ";padding:0.875rem 1rem;text-align:left;"], base.size.body1);