@elice/material-exercise 1.230328.0 → 1.230418.0

package/es/components/material-exercise/exercise-file-tabs/ExerciseFileTabsFileTreeButton.js

@@ -1,3 +1,4 @@
+import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import React, { forwardRef } from 'react';
 import { useIntl } from 'react-intl';
 import { useHover } from 'react-use';
@@ -17,64 +18,70 @@ import { withForwardRefExerciseIntlProvider } from '../context/ExerciseIntlProvi
 import phrasesEn from './locales/fileTreeButton.en.json.js';
 import phrasesKo from './locales/fileTreeButton.ko.json.js';
 
-const ICON_BUTTON_SIZE = '2.25rem';
-const StyledFileTreeButton = styled(IconButton).withConfig({
+var ICON_BUTTON_SIZE = '2.25rem';
+var StyledFileTreeButton = styled(IconButton).withConfig({
   componentId: "sc-ohtsjn-0"
-})(["width:", " !important;height:", " !important;border-right:1px solid ", " !important;background-color:", " !important;&:hover{background-color:", " !important;}"], ICON_BUTTON_SIZE, ICON_BUTTON_SIZE, base.color.navy7, props => props.active ? base.color.navy8 : base.color.navy8, base.color.navy9);
-const ExerciseFileTabsFileTreeButton = forwardRef((_, ref) => {
-  const intl = useIntl();
-  const {
-    materialExerciseId
-  } = React.useContext(ExerciseContext);
-  const exercise = useRecoilValue(exerciseState(materialExerciseId));
-  const [exerciseFileTreeOpened, setExerciseFileTreeOpened] = useRecoilState(exerciseFileTreeOpenedState);
+})(["width:", " !important;height:", " !important;border-right:1px solid ", " !important;background-color:", " !important;&:hover{background-color:", " !important;}"], ICON_BUTTON_SIZE, ICON_BUTTON_SIZE, base.color.navy7, function (props) {
+  return props.active ? base.color.navy8 : base.color.navy8;
+}, base.color.navy9);
+var ExerciseFileTabsFileTreeButton = forwardRef(function (_, ref) {
+  var intl = useIntl();
+  var _React$useContext = React.useContext(ExerciseContext),
+    materialExerciseId = _React$useContext.materialExerciseId;
+  var exercise = useRecoilValue(exerciseState(materialExerciseId));
+  var _useRecoilState = useRecoilState(exerciseFileTreeOpenedState),
+    _useRecoilState2 = _slicedToArray(_useRecoilState, 2),
+    exerciseFileTreeOpened = _useRecoilState2[0],
+    setExerciseFileTreeOpened = _useRecoilState2[1];
   /**
    * Handle click.
    */
-
-  const handleClick = () => {
-    setExerciseFileTreeOpened(prev => !prev);
-  }; //
+  var handleClick = function handleClick() {
+    setExerciseFileTreeOpened(function (prev) {
+      return !prev;
+    });
+  };
+  //
   // apply default file tree opened state.
   //
-
-
-  React.useEffect(() => {
+  React.useEffect(function () {
     var _a;
-
-    const exerciseUiConfig = eliceApiUiConfigNormalizeHelper('materialExercise', (_a = exercise === null || exercise === void 0 ? void 0 : exercise.uiConfig) !== null && _a !== void 0 ? _a : {});
+    var exerciseUiConfig = eliceApiUiConfigNormalizeHelper('materialExercise', (_a = exercise === null || exercise === void 0 ? void 0 : exercise.uiConfig) !== null && _a !== void 0 ? _a : {});
     setExerciseFileTreeOpened(exerciseUiConfig.editorFileTreeDefaultStatus === enums.ExerciseUiConfigEditorFileTreeDefaultStatus.Open);
-  }, // eslint-disable-next-line react-hooks/exhaustive-deps
-  [exercise]); //
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  [exercise]);
   //
   //
-
-  const [el] = useHover(isHovering => {
-    return React.createElement("div", null, React.createElement(Tooltip, {
-      title: exerciseFileTreeOpened ? intl.formatMessage({
-        id: 'exerciseFileTab.fileTreeButton.tooltip.close'
-      }) : intl.formatMessage({
-        id: 'exerciseFileTab.fileTreeButton.tooltip.open'
-      }),
-      placement: "bottom-start"
-    }, React.createElement(StyledFileTreeButton, {
-      icon: isHovering ? eilArrowRightwardsDouble : eilFolder,
-      iconRotate: !isHovering ? 0 : exerciseFileTreeOpened ? 180 : 0,
-      role: "gray3",
-      size: "tiny",
-      transparent: true,
-      border: false,
-      hasBorderRadius: false,
-      active: exerciseFileTreeOpened,
-      onClick: handleClick,
-      ref: ref
-    })));
-  });
+  //
+  var _useHover = useHover(function (isHovering) {
+      return React.createElement("div", null, React.createElement(Tooltip, {
+        title: exerciseFileTreeOpened ? intl.formatMessage({
+          id: 'exerciseFileTab.fileTreeButton.tooltip.close'
+        }) : intl.formatMessage({
+          id: 'exerciseFileTab.fileTreeButton.tooltip.open'
+        }),
+        placement: "bottom-start"
+      }, React.createElement(StyledFileTreeButton, {
+        icon: isHovering ? eilArrowRightwardsDouble : eilFolder,
+        iconRotate: !isHovering ? 0 : exerciseFileTreeOpened ? 180 : 0,
+        role: "gray3",
+        size: "tiny",
+        transparent: true,
+        border: false,
+        hasBorderRadius: false,
+        active: exerciseFileTreeOpened,
+        onClick: handleClick,
+        ref: ref
+      })));
+    }),
+    _useHover2 = _slicedToArray(_useHover, 1),
+    el = _useHover2[0];
   return (exercise === null || exercise === void 0 ? void 0 : exercise.uiConfig.editorFileTreeDefaultStatus) === enums.ExerciseUiConfigEditorFileTreeDefaultStatus.Hide ? null : el;
-}); //
+});
+//
 //
 //
-
 var ExerciseFileTabsFileTreeButton$1 = withForwardRefExerciseIntlProvider(ExerciseFileTabsFileTreeButton, {
   en: phrasesEn,
   ko: phrasesKo

package/es/components/material-exercise/exercise-file-tabs/ExerciseFileTabsLazy.js

@@ -6,7 +6,7 @@ import '../../shared/exercise-shimmer/ExerciseFileTreeListShimmer.js';
 import '../../shared/exercise-shimmer/ExerciseFileTreeListItemShimmer.js';
 import ExerciseFileTabs from './ExerciseFileTabs.js';
 
-const ExerciseFileTabsLazy = () => {
+var ExerciseFileTabsLazy = function ExerciseFileTabsLazy() {
   return React.createElement(React.Suspense, {
     fallback: React.createElement(ExerciseFileTabsShimmer, null)
   }, React.createElement(ExerciseFileTabs, null));