@elice/material-exercise 1.231212.0 → 1.231228.0

package/es/components/material-exercise/MaterialExercise.styled.js

@@ -2,10 +2,10 @@ import { base } from '@elice/design-tokens';
 import styled from 'styled-components';
 import { MATERIAL_DIVIDER_BORDER_VALUE } from '../../constants/stylesheets.js';
 
-var EXERCISE_FILE_TREE_MIN_WIDTH = 128;
-var EXERCISE_PREVIEW_MIN_WIDTH = 128;
-var EXERCISE_RUNNER_MIN_HEIGHT = 128;
-var EXERCISE_HORIZONTAL_RATIO = {
+const EXERCISE_FILE_TREE_MIN_WIDTH = 128;
+const EXERCISE_PREVIEW_MIN_WIDTH = 128;
+const EXERCISE_RUNNER_MIN_HEIGHT = 128;
+const EXERCISE_HORIZONTAL_RATIO = {
   FILETREE: 0.15,
   EDITOR: 0.45,
   PREVIEW: 0.4
@@ -17,7 +17,7 @@ var EXERCISE_HORIZONTAL_RATIO = {
  * - File (Editor)
  * - Runner
  */
-var StyledExerciseContainer = styled.div.withConfig({
+const StyledExerciseContainer = styled.div.withConfig({
   componentId: "sc-9joi7g-0"
 })(["flex:1;display:flex;flex-direction:column;height:100%;min-width:0;min-height:0;"]);
 /**
@@ -26,7 +26,7 @@ var StyledExerciseContainer = styled.div.withConfig({
  * - FileTabs
  * - File (Editor)
  */
-var StyledExerciseMain = styled.div.withConfig({
+const StyledExerciseMain = styled.div.withConfig({
   componentId: "sc-9joi7g-1"
 })(["flex:1;display:flex;width:100%;min-width:0;min-height:0;"]);
 /**
@@ -34,31 +34,31 @@ var StyledExerciseMain = styled.div.withConfig({
  * - FileTabs
  * - File (Editor)
  */
-var StyledExerciseFileAndTabWrap = styled.div.withConfig({
+const StyledExerciseFileAndTabWrap = styled.div.withConfig({
   componentId: "sc-9joi7g-2"
 })(["flex:1;display:flex;flex-direction:column;height:100%;min-width:0;min-height:0;background-color:", ";"], base.color.navy9);
-var StyledExerciseFileWrap = styled.div.withConfig({
+const StyledExerciseFileWrap = styled.div.withConfig({
   componentId: "sc-9joi7g-3"
 })(["flex:1;min-height:0;"]);
 // ========== Exercise FileTab ==========
-var StyledExerciseTabBar = styled.div.withConfig({
+const StyledExerciseTabBar = styled.div.withConfig({
   componentId: "sc-9joi7g-4"
 })(["display:flex;border-bottom:", ";"], MATERIAL_DIVIDER_BORDER_VALUE);
-var StyledExerciseTabsWrap = styled.div.withConfig({
+const StyledExerciseTabsWrap = styled.div.withConfig({
   componentId: "sc-9joi7g-5"
 })(["flex:1;min-width:0;"]);
-var StyledExerciseTabMenuWrap = styled.div.withConfig({
+const StyledExerciseTabMenuWrap = styled.div.withConfig({
   componentId: "sc-9joi7g-6"
 })(["display:flex;justify-content:center;align-items:center;padding:0 0.5rem 0 1rem;background-color:", ";"], base.color.navy8);
 // ========== Exercise FileTree ==========
-var StyledExerciseFileTreeWrap = styled.div.withConfig({
+const StyledExerciseFileTreeWrap = styled.div.withConfig({
   componentId: "sc-9joi7g-7"
 })(["flex:1;display:flex;flex-direction:column;min-width:0;height:100%;border-right:", ";"], MATERIAL_DIVIDER_BORDER_VALUE);
-var StyledxerciseFileTreeContaner = styled.div.withConfig({
+const StyledxerciseFileTreeContaner = styled.div.withConfig({
   componentId: "sc-9joi7g-8"
 })(["display:flex;height:100%;max-width:auto;&[aria-hidden='true']{max-width:0;overflow:hidden;}"]);
 // ========== Exercise Runner ==========
-var StyledExerciseRunnerWrap = styled.div.withConfig({
+const StyledExerciseRunnerWrap = styled.div.withConfig({
   componentId: "sc-9joi7g-9"
 })(["width:100%;height:100%;border-top:", ";"], MATERIAL_DIVIDER_BORDER_VALUE);
 

package/es/components/material-exercise/MaterialExerciseMobile.js

@@ -15,12 +15,11 @@ import ExerciseFile from './exercise-file/ExerciseFile.js';
 /**
  * Material exercise.
  */
-var MaterialExerciseMobile = function MaterialExerciseMobile(_ref) {
-  var filename = _ref.filename;
-  var setExerciseActiveFilename = useSetRecoilState(exerciseActiveFilenameState);
-  React.useEffect(function () {
-    return setExerciseActiveFilename(filename);
-  },
+const MaterialExerciseMobile = ({
+  filename
+}) => {
+  const setExerciseActiveFilename = useSetRecoilState(exerciseActiveFilenameState);
+  React.useEffect(() => setExerciseActiveFilename(filename),
   // eslint-disable-next-line react-hooks/exhaustive-deps
   [filename]);
   //
@@ -31,9 +30,7 @@ var MaterialExerciseMobile = function MaterialExerciseMobile(_ref) {
 //
 //
 //
-var MaterialExerciseMobile$1 = withMaterial(function (props) {
-  return React.createElement(ExerciseProvider, Object.assign({}, props), React.createElement(MaterialExerciseMobile, Object.assign({}, props)));
-}, config.init, {
+var MaterialExerciseMobile$1 = withMaterial(props => React.createElement(ExerciseProvider, Object.assign({}, props), React.createElement(MaterialExerciseMobile, Object.assign({}, props))), config.init, {
   overrideRecoilScope: true
 });
 

package/es/components/material-exercise/context/ExerciseIntlProvider.js

@@ -8,10 +8,11 @@ import { ExerciseContext } from './context.js';
 /**
  *
  */
-var withExerciseIntlProvider = function withExerciseIntlProvider(Component, phrases) {
-  return function (props) {
-    var _useContext = useContext(ExerciseContext),
-      locale = _useContext.locale;
+const withExerciseIntlProvider = (Component, phrases) => {
+  return props => {
+    const {
+      locale
+    } = useContext(ExerciseContext);
     return React.createElement(MaterialIntlProvider, {
       children: React.createElement(Component, Object.assign({}, props)),
       locale: locale,
@@ -22,10 +23,11 @@ var withExerciseIntlProvider = function withExerciseIntlProvider(Component, phra
 /**
  *
  */
-var withForwardRefExerciseIntlProvider = function withForwardRefExerciseIntlProvider(Component, phrases) {
-  return forwardRef(function (props, ref) {
-    var _useContext2 = useContext(ExerciseContext),
-      locale = _useContext2.locale;
+const withForwardRefExerciseIntlProvider = (Component, phrases) => {
+  return forwardRef((props, ref) => {
+    const {
+      locale
+    } = useContext(ExerciseContext);
     return React.createElement(MaterialIntlProvider, {
       children: React.createElement(Component, Object.assign({}, props, {
         ref: ref

package/es/components/material-exercise/context/ExerciseProvider.js

@@ -1,4 +1,3 @@
-import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import { __rest } from 'tslib';
 import React from 'react';
 import { useMeasure } from 'react-use';
@@ -11,8 +10,8 @@ import { ExerciseContext } from './context.js';
 import MaterialExerciseNoImage from './ExerciseProviderNoImage.js';
 import { exerciseUserState, exerciseState, exerciseRoomState, exerciseLectureState, exerciseMultilangLanguagesState, exerciseActiveFilenameState, exerciseContainerSizeState, exerciseAibotInfoEnableState } from './recoil.js';
 
-var RECOIL_RESET_DELAY = 10;
-var StyledMaterialExercise = styled.div.withConfig({
+const RECOIL_RESET_DELAY = 10;
+const StyledMaterialExercise = styled.div.withConfig({
   componentId: "sc-pj5yv2-0"
 })(["display:flex;width:100%;height:100%;.eb-resizable{height:inherit;}"]);
 /**
@@ -21,54 +20,55 @@ var StyledMaterialExercise = styled.div.withConfig({
  * - fetching exercise room
  * - fetching exercise room id
  */
-var ExerciseProvider = function ExerciseProvider(_a) {
-  var children = _a.children,
-    materialExerciseId = _a.materialExerciseId,
-    exerciseRoomId = _a.exerciseRoomId,
-    exerciseRoomUserId = _a.exerciseRoomUserId,
-    onDefaultExerciseRoomIdSet = _a.onDefaultExerciseRoomIdSet,
-    exerciseImageEmptyOptions = _a.exerciseImageEmptyOptions,
+const ExerciseProvider = _a => {
+  var {
+      children,
+      materialExerciseId,
+      exerciseRoomId,
+      exerciseRoomUserId,
+      onDefaultExerciseRoomIdSet,
+      exerciseImageEmptyOptions
+    } = _a,
     contextProps = __rest(_a, ["children", "materialExerciseId", "exerciseRoomId", "exerciseRoomUserId", "onDefaultExerciseRoomIdSet", "exerciseImageEmptyOptions"]);
   //
-  var _useMaterialConfig = useMaterialConfig(),
-    orgNameShort = _useMaterialConfig.orgNameShort;
+  const {
+    orgNameShort
+  } = useMaterialConfig();
   // user
-  var user = useRecoilValue(exerciseUserState);
+  const user = useRecoilValue(exerciseUserState);
   // exercise
-  var exercise = useRecoilValue(exerciseState(materialExerciseId));
-  var exerciseRoom = useRecoilValue(exerciseRoomState(exerciseRoomId));
+  const exercise = useRecoilValue(exerciseState(materialExerciseId));
+  const exerciseRoom = useRecoilValue(exerciseRoomState(exerciseRoomId));
   // lecture
-  var lecture = useRecoilValue(exerciseLectureState(exercise === null || exercise === void 0 ? void 0 : exercise._lectureId));
-  var resetLecture = useResetRecoilState(exerciseLectureState(exercise === null || exercise === void 0 ? void 0 : exercise._lectureId));
+  const lecture = useRecoilValue(exerciseLectureState(exercise === null || exercise === void 0 ? void 0 : exercise._lectureId));
+  const resetLecture = useResetRecoilState(exerciseLectureState(exercise === null || exercise === void 0 ? void 0 : exercise._lectureId));
   // multilang languages
-  var exerciseMultilangLanguages = useRecoilValue(exerciseMultilangLanguagesState(exercise === null || exercise === void 0 ? void 0 : exercise.id));
-  var resetExerciseMultilangLanguages = useResetRecoilState(exerciseMultilangLanguagesState(exercise === null || exercise === void 0 ? void 0 : exercise.id));
+  const exerciseMultilangLanguages = useRecoilValue(exerciseMultilangLanguagesState(exercise === null || exercise === void 0 ? void 0 : exercise.id));
+  const resetExerciseMultilangLanguages = useResetRecoilState(exerciseMultilangLanguagesState(exercise === null || exercise === void 0 ? void 0 : exercise.id));
   // etc
-  var activeFilename = useRecoilValue(exerciseActiveFilenameState);
-  var setConatinerSize = useSetRecoilState(exerciseContainerSizeState);
-  var setAibotInfoEnable = useSetRecoilState(exerciseAibotInfoEnableState);
+  const activeFilename = useRecoilValue(exerciseActiveFilenameState);
+  const setConatinerSize = useSetRecoilState(exerciseContainerSizeState);
+  const setAibotInfoEnable = useSetRecoilState(exerciseAibotInfoEnableState);
   // wrap container size
-  var _useMeasure = useMeasure(),
-    _useMeasure2 = _slicedToArray(_useMeasure, 2),
-    wrapElRef = _useMeasure2[0],
-    _useMeasure2$ = _useMeasure2[1],
-    width = _useMeasure2$.width,
-    height = _useMeasure2$.height;
+  const [wrapElRef, {
+    width,
+    height
+  }] = useMeasure();
   //
   // if exercise room id is not specified, fetch it from server
   // NOTICE: should not use `exercise.defaultRoom.id`, since will be removed (confrimed by backend-team)
   //
-  React.useEffect(function () {
+  React.useEffect(() => {
     if (exerciseRoomId) {
       return;
     }
     getOrgMaterialExerciseDefaultRoomGet({
-      materialExerciseId: materialExerciseId
-    }).then(function (res) {
+      materialExerciseId
+    }).then(res => {
       if (typeof onDefaultExerciseRoomIdSet === 'function') {
         onDefaultExerciseRoomIdSet(res.exerciseRoomId);
       }
-    }).catch(function (err) {
+    }).catch(err => {
       if (typeof contextProps.onError === 'function') {
         contextProps.onError(err);
       }
@@ -79,14 +79,12 @@ var ExerciseProvider = function ExerciseProvider(_a) {
   //
   // reset lecture, after `exercise.lectureId` changed
   //
-  React.useEffect(function () {
+  React.useEffect(() => {
     if (!(exercise === null || exercise === void 0 ? void 0 : exercise._lectureId)) {
       return;
     }
-    var timeout = window.setTimeout(function () {
-      return resetLecture();
-    }, RECOIL_RESET_DELAY);
-    return function () {
+    const timeout = window.setTimeout(() => resetLecture(), RECOIL_RESET_DELAY);
+    return () => {
       window.clearTimeout(timeout);
     };
   },
@@ -95,14 +93,12 @@ var ExerciseProvider = function ExerciseProvider(_a) {
   //
   // reset exercise multilang languages, after `exercise.id` changed
   //
-  React.useEffect(function () {
+  React.useEffect(() => {
     if (!(exercise === null || exercise === void 0 ? void 0 : exercise.id)) {
       return;
     }
-    var timeout = window.setTimeout(function () {
-      return resetExerciseMultilangLanguages();
-    }, RECOIL_RESET_DELAY);
-    return function () {
+    const timeout = window.setTimeout(() => resetExerciseMultilangLanguages(), RECOIL_RESET_DELAY);
+    return () => {
       window.clearTimeout(timeout);
     };
   },
@@ -111,11 +107,11 @@ var ExerciseProvider = function ExerciseProvider(_a) {
   //
   // update Provider size
   //
-  React.useEffect(function () {
+  React.useEffect(() => {
     if (width && height) {
       setConatinerSize({
-        width: width,
-        height: height
+        width,
+        height
       });
     }
   },
@@ -124,7 +120,7 @@ var ExerciseProvider = function ExerciseProvider(_a) {
   //
   // update
   //
-  React.useEffect(function () {
+  React.useEffect(() => {
     if (!(lecture === null || lecture === void 0 ? void 0 : lecture.courseId)) {
       return;
     }
@@ -132,11 +128,12 @@ var ExerciseProvider = function ExerciseProvider(_a) {
       organizationNameShort: orgNameShort
     }), getOrgCourseGet({
       courseId: lecture.courseId
-    })]).then(function (_ref) {
-      var _ref2 = _slicedToArray(_ref, 2),
-        organization = _ref2[0].organization,
-        course = _ref2[1].course;
-      var isAibotInfoEnabled = organization.aibotInfo.isEnabled && course.aibotInfo.isEnabled;
+    })]).then(([{
+      organization
+    }, {
+      course
+    }]) => {
+      const isAibotInfoEnabled = organization.aibotInfo.isEnabled && course.aibotInfo.isEnabled;
       setAibotInfoEnable(isAibotInfoEnabled);
     });
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -146,7 +143,7 @@ var ExerciseProvider = function ExerciseProvider(_a) {
   //
   return React.createElement(StyledMaterialExercise, {
     ref: wrapElRef,
-    children: function () {
+    children: (() => {
       var _a;
       // render after measure Provider size
       if (!width || !height) {
@@ -171,13 +168,13 @@ var ExerciseProvider = function ExerciseProvider(_a) {
       return React.createElement(ExerciseContext.Provider, {
         children: children,
         value: Object.assign(Object.assign({}, contextProps), {
-          materialExerciseId: materialExerciseId,
-          exerciseRoomId: exerciseRoomId,
+          materialExerciseId,
+          exerciseRoomId,
           exerciseRoomUserId: exerciseRoomUserId !== null && exerciseRoomUserId !== void 0 ? exerciseRoomUserId : user.id,
           readOnlyActiveFile: !!((_a = exercise === null || exercise === void 0 ? void 0 : exercise.readyExerciseImage) === null || _a === void 0 ? void 0 : _a.readOnlyFilelist.includes(activeFilename || ''))
         })
       });
-    }()
+    })()
   });
 };
 

package/es/components/material-exercise/context/ExerciseProviderNoImage.js

@@ -7,20 +7,20 @@ import styled from 'styled-components';
 import phrasesEn from './locales/noImage.en.json.js';
 import phrasesKo from './locales/noImage.ko.json.js';
 
-var StyledProviderNoImage = styled.div.withConfig({
+const StyledProviderNoImage = styled.div.withConfig({
   componentId: "sc-oaauqc-0"
 })(["display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;background-color:", ";"], base.color.navy9);
-var ExerciseProviderNoImage = function ExerciseProviderNoImage(_ref) {
-  var text = _ref.text,
-    _ref$imageSrc = _ref.imageSrc,
-    imageSrc = _ref$imageSrc === void 0 ? '' : _ref$imageSrc,
-    buttonText = _ref.buttonText,
-    onButtonClick = _ref.onButtonClick;
-  var intl = useIntl();
+const ExerciseProviderNoImage = ({
+  text,
+  imageSrc = '',
+  buttonText,
+  onButtonClick
+}) => {
+  const intl = useIntl();
   /**
    * render action button
    */
-  var renderActionButton = function renderActionButton() {
+  const renderActionButton = () => {
     if (typeof onButtonClick !== 'function') {
       return null;
     }
@@ -52,7 +52,7 @@ var ExerciseProviderNoImage = function ExerciseProviderNoImage(_ref) {
 //
 //
 //
-var MaterialExerciseNoImage = (function (props) {
+var MaterialExerciseNoImage = (props => {
   return React.createElement(MaterialIntlProvider, {
     locale: props.locale,
     phrases: {

package/es/components/material-exercise/context/context.js

@@ -1,5 +1,5 @@
 import React from 'react';
 
-var ExerciseContext = React.createContext(null);
+const ExerciseContext = React.createContext(null);
 
 export { ExerciseContext };