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

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

@@ -1,4 +1,6 @@
-import React, { useState } from 'react';
+import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
 import { Dialog } from '@elice/blocks';
 import { eilReset } from '@elice/icons';
 import { useRawEliceIntl } from '@elice/intl';
@@ -22,23 +24,26 @@ import 'lodash/debounce';
 import 'random-words';
 import 'unicount';
 
-const ExerciseMenuReset = () => {
-  const intl = useRawEliceIntl();
-  const [isDialogOpen, setDialogOpen] = useState(false);
-  const activeFilename = useRecoilValue(exerciseActiveFilenameState);
-  const isFileResettable = useExerciseFileResettable(activeFilename);
+var ExerciseMenuReset = function ExerciseMenuReset() {
+  var intl = useRawEliceIntl();
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isDialogOpen = _useState2[0],
+    setDialogOpen = _useState2[1];
+  var activeFilename = useRecoilValue(exerciseActiveFilenameState);
+  var isFileResettable = useExerciseFileResettable(activeFilename);
   /**
    * Reset the active file.
    */
-  const handleReset = () => {
+  var handleReset = function handleReset() {
     exerciseFileEditorContentChange$.next(null);
     setDialogOpen(false);
   };
   /**
    * Reset button.
    */
-  const renderResetButton = () => {
-    return React.createElement(ExerciseMenuButton, {
+  var renderResetButton = function renderResetButton() {
+    return jsx(ExerciseMenuButton, {
       icon: eilReset,
       active: isDialogOpen,
       title: isFileResettable ? intl.formatMessage({
@@ -47,17 +52,21 @@ const ExerciseMenuReset = () => {
         id: 'exerciseMenu.reset.button.tooltip.disabled'
       }),
       disabled: !isFileResettable,
-      onClick: () => setDialogOpen(isOpen => !isOpen)
+      onClick: function onClick() {
+        return setDialogOpen(function (isOpen) {
+          return !isOpen;
+        });
+      }
     });
   };
   /**
    * Reset confirm dialog.
    */
-  const renderResetConfirmDialog = () => {
+  var renderResetConfirmDialog = function renderResetConfirmDialog() {
     if (!isDialogOpen) {
       return null;
     }
-    return React.createElement(Dialog, {
+    return jsxs(Dialog, {
       type: "warning",
       title: intl.formatMessage({
         id: 'exerciseMenu.reset.confirmDialog.title'
@@ -65,21 +74,30 @@ const ExerciseMenuReset = () => {
       body: intl.formatMessage({
         id: 'exerciseMenu.reset.confirmDialog.body'
       }),
-      onHide: () => setDialogOpen(false)
-    }, React.createElement(Dialog.CloseButton, {
-      onClick: () => setDialogOpen(false)
-    }, intl.formatMessage({
-      id: 'exerciseMenu.reset.confirmDialog.cancel'
-    })), React.createElement(Dialog.ActionButton, {
-      onClick: handleReset
-    }, intl.formatMessage({
-      id: 'exerciseMenu.reset.confirmDialog.confirm'
-    })));
+      onHide: function onHide() {
+        return setDialogOpen(false);
+      },
+      children: [jsx(Dialog.CloseButton, {
+        onClick: function onClick() {
+          return setDialogOpen(false);
+        },
+        children: intl.formatMessage({
+          id: 'exerciseMenu.reset.confirmDialog.cancel'
+        })
+      }), jsx(Dialog.ActionButton, {
+        onClick: handleReset,
+        children: intl.formatMessage({
+          id: 'exerciseMenu.reset.confirmDialog.confirm'
+        })
+      })]
+    });
   };
   //
   //
   //
-  return React.createElement(React.Fragment, null, renderResetButton(), renderResetConfirmDialog());
+  return jsxs(Fragment, {
+    children: [renderResetButton(), renderResetConfirmDialog()]
+  });
 };
 
 export { ExerciseMenuReset as default };

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

@@ -1,10 +1,12 @@
+import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import React from 'react';
-import { Popover, Flex, Text, Hspace, NotificationCount, IconButton, Icon, Vspace } from '@elice/blocks';
+import { Flex, Text, Hspace, NotificationCount, IconButton, Icon, Vspace } from '@elice/blocks';
 import { base } from '@elice/design-tokens';
 import { eilAttachment, eilMathsignMultiplyBasic, eilDownload, eilFolder } from '@elice/icons';
 import { useRawEliceIntl } from '@elice/intl';
 import { ImageViewer } from '@elice/mui-elements';
-import { Typography } from '@mui/material';
+import { Stack, Typography } from '@mui/material';
 import { useRecoilValue } from 'recoil';
 import ExerciseMenuButton from '../../shared/exercise-menu-button/ExerciseMenuButton.js';
 import { DARK_TEXT_SECONDARY_COLOR } from '../../../constants/color.js';
@@ -13,17 +15,20 @@ import '../context/context.js';
 import '../context/recoilTypes.js';
 import '../context/subjects.js';
 import '../context/ExerciseProvider.js';
-import { StyledFilePopoverContent, StyledMenuButtonFileCount, StyledFilePopoverHeader, StyledFilePopoverBody, StyledFilePopoverBodyList, StyledFilePopoverBodyListItem, StyledFilePopoverBodyListItemContentImageWrap, StyledFilePopoverBodyListItemContentImage, StyledFilePopoverBodyListItemDownloadButton, StyledFilePopoverBodyListItemContentFile } from './ExerciseMenuStdioFileBrowser.styled.js';
+import { StyledMenuButtonFileCount, StyledFilePopoverContent, StyledFilePopoverHeader, StyledFilePopoverBody, StyledFilePopoverBodyList, StyledFilePopoverBodyListItem, StyledFilePopoverBodyListItemContentImageWrap, StyledFilePopoverBodyListItemContentImage, StyledFilePopoverBodyListItemDownloadButton, StyledFilePopoverBodyListItemContentFile } from './ExerciseMenuStdioFileBrowser.styled.js';
 
-const ExerciseMenuStdioFileBrowser = () => {
-  const intl = useRawEliceIntl();
-  const [open, setOpen] = React.useState(false);
-  const anchorRef = React.useRef(null);
-  const stdioFiles = useRecoilValue(exerciseRunnerStdioFilesState);
+var ExerciseMenuStdioFileBrowser = function ExerciseMenuStdioFileBrowser() {
+  var intl = useRawEliceIntl();
+  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);
   //
   // Open stdio file browser, on file changes.
   //
-  React.useEffect(() => {
+  React.useEffect(function () {
     if (stdioFiles && stdioFiles.length > 0) {
       setOpen(true);
     }
@@ -33,158 +38,174 @@ const ExerciseMenuStdioFileBrowser = () => {
   /**
    * Image type stdio file.
    */
-  const renderStdioFileListItemImage = (key, f) => {
+  var renderStdioFileListItemImage = function renderStdioFileListItemImage(key, f) {
     var _a;
-    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, {
-      src: f.data,
-      alt: filename
-    }))), React.createElement(StyledFilePopoverBodyListItemDownloadButton, {
-      href: f.data,
-      download: filename
-    }, React.createElement(Icon, {
-      icon: eilDownload
-    })));
+    var ext = (_a = f.mime) === null || _a === void 0 ? void 0 : _a.split('/').pop();
+    var filename = ext ? "image_output.".concat(ext) : 'image_output';
+    return jsxs(StyledFilePopoverBodyListItem, {
+      children: [jsx(StyledFilePopoverBodyListItemContentImageWrap, {
+        children: jsx(ImageViewer, {
+          children: jsx(StyledFilePopoverBodyListItemContentImage, {
+            src: f.data,
+            alt: filename
+          })
+        })
+      }), jsx(StyledFilePopoverBodyListItemDownloadButton, {
+        href: f.data,
+        download: filename,
+        children: jsx(Icon, {
+          icon: eilDownload
+        })
+      })]
+    }, key);
   };
   /**
    * File type stdio file.
    */
-  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, {
-      children: f.filename,
-      role: "white",
-      size: "small"
-    }), React.createElement(Text, {
-      children: `${size} KB`,
-      role: "gray4",
-      size: "tiny"
-    })), React.createElement(StyledFilePopoverBodyListItemDownloadButton, {
-      href: f.data,
-      download: f.filename
-    }, React.createElement(Icon, {
-      icon: eilDownload
-    })));
+  var renderStdioFileListFile = function renderStdioFileListFile(key, f) {
+    var size = (f.data.length / 1024).toFixed(2);
+    return jsxs(StyledFilePopoverBodyListItem, {
+      children: [jsxs(StyledFilePopoverBodyListItemContentFile, {
+        children: [jsx(Text, {
+          children: f.filename,
+          role: "white",
+          size: "small"
+        }), jsx(Text, {
+          children: "".concat(size, " KB"),
+          role: "gray4",
+          size: "tiny"
+        })]
+      }), jsx(StyledFilePopoverBodyListItemDownloadButton, {
+        href: f.data,
+        download: f.filename,
+        children: jsx(Icon, {
+          icon: eilDownload
+        })
+      })]
+    }, key);
   };
   /**
    * Empty list of stdio files.
    */
-  const renderStdioFileListEmpty = () => {
-    return React.createElement(Flex, {
+  var renderStdioFileListEmpty = function renderStdioFileListEmpty() {
+    return jsxs(Flex, {
       column: true,
       align: "center",
       width: "100%",
-      paddingy: "1.5rem"
-    }, React.createElement(Icon, {
-      icon: eilFolder,
-      size: "jumbo",
-      color: base.color.navy3
-    }), React.createElement(Vspace, {
-      height: 0.5
-    }), React.createElement(Typography, {
-      variant: "body2",
-      textAlign: "center",
-      color: DARK_TEXT_SECONDARY_COLOR,
-      sx: {
-        whiteSpace: 'pre-wrap'
-      }
-    }, intl.formatMessage({
-      id: 'exerciseMenu.stdioFileBrowser.popover.body.placeholder'
-    })));
+      paddingy: "1.5rem",
+      children: [jsx(Icon, {
+        icon: eilFolder,
+        size: "jumbo",
+        color: base.color.navy3
+      }), jsx(Vspace, {
+        height: 0.5
+      }), jsx(Typography, {
+        variant: "body2",
+        textAlign: "center",
+        color: DARK_TEXT_SECONDARY_COLOR,
+        sx: {
+          whiteSpace: 'pre-wrap'
+        },
+        children: intl.formatMessage({
+          id: 'exerciseMenu.stdioFileBrowser.popover.body.placeholder'
+        })
+      })]
+    });
   };
   /**
    * List of stdio files.
    */
-  const renderStdioFileList = () => {
+  var renderStdioFileList = function renderStdioFileList() {
     if (!stdioFiles || !stdioFiles.length) {
       return renderStdioFileListEmpty();
     }
-    return React.createElement(StyledFilePopoverBodyList, null, stdioFiles.map((f, index) => {
-      switch (f.type) {
-        case 'image':
-          return renderStdioFileListItemImage(index, f);
-        case 'file':
-          return renderStdioFileListFile(index, f);
-        default:
-          return null;
-      }
-    }));
+    return jsx(StyledFilePopoverBodyList, {
+      children: stdioFiles.map(function (f, index) {
+        switch (f.type) {
+          case 'image':
+            return renderStdioFileListItemImage(index, f);
+          case 'file':
+            return renderStdioFileListFile(index, f);
+          default:
+            return null;
+        }
+      })
+    });
   };
   /**
    * Popover header.
    */
-  const renderStdioFilePopoverHeader = () => {
-    return React.createElement(StyledFilePopoverHeader, null, React.createElement(Flex, {
-      align: "center"
-    }, React.createElement(Text, {
-      role: "white",
-      size: "small",
-      bold: true
-    }, intl.formatMessage({
-      id: 'exerciseMenu.stdioFileBrowser.popover.header'
-    })), React.createElement(Hspace, {
-      width: 0.5
-    }), React.createElement(NotificationCount, {
-      role: "white",
-      value: stdioFiles.length
-    })), React.createElement(IconButton, {
-      icon: eilMathsignMultiplyBasic,
-      role: "white",
-      size: "micro",
-      border: false,
-      transparent: true,
-      onClick: () => setOpen(false)
-    }));
+  var renderStdioFilePopoverHeader = function renderStdioFilePopoverHeader() {
+    return jsxs(StyledFilePopoverHeader, {
+      children: [jsxs(Flex, {
+        align: "center",
+        children: [jsx(Text, {
+          role: "white",
+          size: "small",
+          bold: true,
+          children: intl.formatMessage({
+            id: 'exerciseMenu.stdioFileBrowser.popover.header'
+          })
+        }), jsx(Hspace, {
+          width: 0.5
+        }), jsx(NotificationCount, {
+          role: "white",
+          value: stdioFiles.length
+        })]
+      }), jsx(IconButton, {
+        icon: eilMathsignMultiplyBasic,
+        role: "white",
+        size: "micro",
+        border: false,
+        transparent: true,
+        onClick: function onClick() {
+          return setOpen(false);
+        }
+      })]
+    });
   };
   /**
    * Popover body.
    */
-  const renderStdioFilePopoverBody = () => {
-    return React.createElement(StyledFilePopoverBody, {
+  var renderStdioFilePopoverBody = function renderStdioFilePopoverBody() {
+    return jsx(StyledFilePopoverBody, {
       children: renderStdioFileList()
     });
   };
   /**
    * Popover.
    */
-  const renderStdioFilePopover = () => {
-    return React.createElement(Popover, {
-      open: open,
-      anchorEl: anchorRef.current,
-      placement: "bottom-end",
-      // lower than community floating button
-      // - ref : https://elicer.atlassian.net/browse/IP-2987
-      style: {
-        zIndex: 9
-      }
-    }, React.createElement(StyledFilePopoverContent, null, renderStdioFilePopoverHeader(), renderStdioFilePopoverBody()));
+  var renderStdioFilePopover = function renderStdioFilePopover() {
+    if (open) {
+      return jsxs(StyledFilePopoverContent, {
+        children: [renderStdioFilePopoverHeader(), renderStdioFilePopoverBody()]
+      });
+    }
+    return null;
   };
-  /**
-   * Popover toggle button.
-   */
-  const renderStdioFilePopoverToggleButton = () => {
-    return React.createElement(ExerciseMenuButton, {
+  //
+  //
+  //
+  return jsxs(Stack, {
+    position: "relative",
+    children: [jsx(ExerciseMenuButton, {
       icon: eilAttachment,
       active: open,
       title: intl.formatMessage({
         id: 'exerciseMenu.stdioFileBrowser.button.tooltip'
       }),
-      onClick: () => setOpen(prev => !prev),
-      ref: anchorRef
-    }, React.createElement(StyledMenuButtonFileCount, {
-      role: "white",
-      value: stdioFiles.length
-    }));
-  };
-  //
-  //
-  //
-  return React.createElement(React.Fragment, null, renderStdioFilePopover(), renderStdioFilePopoverToggleButton());
+      onClick: function onClick() {
+        return setOpen(function (prev) {
+          return !prev;
+        });
+      },
+      ref: anchorRef,
+      children: jsx(StyledMenuButtonFileCount, {
+        role: "white",
+        value: stdioFiles.length
+      })
+    }), renderStdioFilePopover()]
+  });
 };
 
 export { ExerciseMenuStdioFileBrowser as default };

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';
 
-const StyledMenuButtonFileCount = styled(NotificationCount).withConfig({
+var 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;"]);
-const StyledFilePopoverContent = styled.div.withConfig({
+var 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);
-const StyledFilePopoverHeader = styled.div.withConfig({
+})(["display:flex;flex-direction:column;padding:0;width:252px;min-height:178px;max-height:383px;border-radius:8px;background-color:", ";overflow:hidden;position:absolute;top:2.125rem;right:0;z-index:1;"], base.color.navy6);
+var 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);
-const StyledFilePopoverBody = styled.div.withConfig({
+var StyledFilePopoverBody = styled.div.withConfig({
   componentId: "sc-9mtuee-3"
 })(["flex:1;overflow-x:hidden;overflow-y:auto;"]);
-const StyledFilePopoverBodyList = styled.ul.withConfig({
+var StyledFilePopoverBodyList = styled.ul.withConfig({
   componentId: "sc-9mtuee-4"
 })(["margin:0;padding:0.5rem;width:100%;height:100%;"]);
-const StyledFilePopoverBodyListItem = styled.li.withConfig({
+var 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);
-const StyledFilePopoverBodyListItemDownloadButton = styled.a.withConfig({
+var 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);
-const StyledFilePopoverBodyListItemContentFile = styled.div.withConfig({
+var StyledFilePopoverBodyListItemContentFile = styled.div.withConfig({
   componentId: "sc-9mtuee-7"
 })(["flex:1;display:flex;align-items:center;justify-content:space-between;padding:0 0.5rem;"]);
-const StyledFilePopoverBodyListItemContentImageWrap = styled.div.withConfig({
+var StyledFilePopoverBodyListItemContentImageWrap = styled.div.withConfig({
   componentId: "sc-9mtuee-8"
 })(["display:flex;padding:0.5rem;flex:1 1 0;background:", ";"], base.color.white);
-const StyledFilePopoverBodyListItemContentImage = styled.img.withConfig({
+var StyledFilePopoverBodyListItemContentImage = styled.img.withConfig({
   componentId: "sc-9mtuee-9"
 })(["width:100%;max-height:128px;object-fit:contain;cursor:zoom-in;"]);
-const StyledPreferenceBodyItem = styled.div.withConfig({
+var 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;}"]);
-const StyledSelect = styled(Select).withConfig({
+var 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-menu/index.js

@@ -0,0 +1 @@
+export { default as ExerciseMenu } from './ExerciseMenu.js';

package/es/components/material-exercise/exercise-menu/locales/index.js

@@ -0,0 +1,4 @@
+export { default as messageEn } from './en.json.js';
+export { default as messageKo } from './ko.json.js';
+export { default as messageTh } from './th.json.js';
+export { default as messageJa } from './ja.json.js';

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

@@ -1,3 +1,5 @@
+import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { jsx } from 'react/jsx-runtime';
 import React from 'react';
 import { useDebounce } from 'react-use';
 import { Dropdown } from '@elice/blocks';
@@ -8,21 +10,23 @@ import '../context/recoilTypes.js';
 import '../context/subjects.js';
 import '../context/ExerciseProvider.js';
 
-const ExerciseMultilangDropdown = () => {
-  const {
-    materialExerciseId,
-    exerciseRoomId,
-    onMultiLangLanguageChange
-  } = React.useContext(ExerciseContext);
-  const multilangLanguages = useRecoilValue(exerciseMultilangLanguagesState(materialExerciseId));
-  const [multilangEnvironment, setMultilangEnvironment] = useRecoilState(exerciseMultilangEnvironmentState({
-    materialExerciseId,
-    exerciseRoomId
-  }));
+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];
   //
   // emit `onMultiLangLanguageChange` when language changed
   //
-  useDebounce(() => {
+  useDebounce(function () {
     if (multilangEnvironment && typeof onMultiLangLanguageChange === 'function') {
       onMultiLangLanguageChange(multilangEnvironment.language);
     }
@@ -33,19 +37,24 @@ const ExerciseMultilangDropdown = () => {
   if (!multilangLanguages || !Object.keys(multilangLanguages !== null && multilangLanguages !== void 0 ? multilangLanguages : {}).length || !multilangEnvironment) {
     return null;
   }
-  return React.createElement(Dropdown, {
+  return jsx(Dropdown, {
     type: "dark",
     size: "tiny",
     border: true,
     placement: "bottom-end",
     value: multilangEnvironment.language,
-    onChange: language => setMultilangEnvironment({
-      language
+    onChange: function onChange(language) {
+      return setMultilangEnvironment({
+        language: language
+      });
+    },
+    children: Object.keys(multilangLanguages).map(function (lang) {
+      return jsx("option", {
+        value: lang,
+        children: multilangLanguages[lang].label
+      }, lang);
     })
-  }, 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.d.ts

@@ -1,3 +1,2 @@
-import React from 'react';
-declare const ExerciseMultilangDropdownLazy: () => React.JSX.Element;
+declare const ExerciseMultilangDropdownLazy: () => JSX.Element;
 export default ExerciseMultilangDropdownLazy;

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

@@ -1,10 +1,12 @@
+import { jsx } from 'react/jsx-runtime';
 import React from 'react';
 import ExerciseMultilangDropdown from './ExerciseMultilangDropdown.js';
 
-const ExerciseMultilangDropdownLazy = () => {
-  return React.createElement(React.Suspense, {
-    fallback: null
-  }, React.createElement(ExerciseMultilangDropdown, null));
+var ExerciseMultilangDropdownLazy = function ExerciseMultilangDropdownLazy() {
+  return jsx(React.Suspense, {
+    fallback: null,
+    children: jsx(ExerciseMultilangDropdown, {})
+  });
 };
 
 export { ExerciseMultilangDropdownLazy as default };

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

@@ -0,0 +1,2 @@
+export { default as ExerciseMultilangDropdown } from './ExerciseMultilangDropdown.js';
+export { default as ExerciseMultilangDropdownLazy } from './ExerciseMultilangDropdownLazy.js';