@elice/material-exercise 1.240401.0 → 1.240508.0-globalization.0

package/cjs/components/material-exercise/exercise-file-tree/ExerciseFileTree.js

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var reactIntl = require('react-intl');
 var apiClient = require('@elice/api-client');
 var blocks = require('@elice/blocks');
+var intl = require('@elice/intl');
 var types = require('@elice/types');
 var humps = require('humps');
 var recoil = require('recoil');
@@ -21,9 +21,9 @@ var context = require('../context/context.js');
 require('../context/recoilTypes.js');
 require('../context/subjects.js');
 require('../context/ExerciseProvider.js');
-var ExerciseIntlProvider = require('../context/ExerciseIntlProvider.js');
 var en = require('./locales/en.json.js');
 var ko = require('./locales/ko.json.js');
+var th = require('./locales/th.json.js');
 
 const AsyncFileTree = React.lazy(() => Promise.resolve().then(function () { return require('../../shared/file-tree/FileTree.js'); }));
 const AsyncFileTreeList = React.lazy(() => Promise.resolve().then(function () { return require('../../shared/file-tree/FileTreeList.js'); }));
@@ -44,9 +44,10 @@ var MaterialExerciseFileError;
   MaterialExerciseFileError["UsableSizeExceed"] = "usable_size_exceed";
   MaterialExerciseFileError["SubFileOrPathExist"] = "sub_file_or_path_exist";
 })(MaterialExerciseFileError || (MaterialExerciseFileError = {}));
-const ExerciseFileTree = () => {
+const ExerciseFileTree = ({
+  __intl
+}) => {
   var _a, _b, _c, _d;
-  const intl = reactIntl.useIntl();
   const {
     exerciseRoomId,
     materialExerciseId,
@@ -120,7 +121,7 @@ const ExerciseFileTree = () => {
       setExerciseRoom(exerciseRoom);
     } catch (error) {
       console.error(error);
-      blocks.Notification.error(intl.formatMessage({
+      blocks.Notification.error(__intl.formatMessage({
         id: 'materialExercise.exerciseFileTree.fetchRoom.failure'
       }));
     }
@@ -147,7 +148,7 @@ const ExerciseFileTree = () => {
         message = ((_b = error.detail) === null || _b === void 0 ? void 0 : _b.failCode) ? error.detail.failCode : `materialExercise.exerciseFileTree.errorCode.unknown`;
         failMessage = (_c = error.detail) === null || _c === void 0 ? void 0 : _c.failMessage;
     }
-    blocks.Notification.error(intl.formatMessage({
+    blocks.Notification.error(__intl.formatMessage({
       id: message
     }) + `${failMessage ? ` (${failMessage})` : ''}`);
     if (typeof onError === 'function') {
@@ -330,9 +331,6 @@ const ExerciseFileTree = () => {
     locale: locale
   }, React.createElement(AsyncFileTreeToolbar, null), React.createElement(StyledFileTreeDivider, null), React.createElement(AsyncFileTreeList, null))));
 };
-var ExerciseFileTree$1 = ExerciseIntlProvider.withExerciseIntlProvider(ExerciseFileTree, {
-  en: en.default,
-  ko: ko.default
-});
+var ExerciseFileTree$1 = new intl.IntlComponentBuilder(ExerciseFileTree).add('en', en.default).add('ko', ko.default).add('th', th.default).build();
 
 exports.default = ExerciseFileTree$1;

package/cjs/components/material-exercise/exercise-file-tree/locales/en.json.js

@@ -2,6 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var phrasesEn = {"exerciseFileTree.errorCode.insufficientPermission":"[Error] Insufficient Permission","exerciseFileTree.errorCode.invalidParameter":"[Error] Invalid Parameter","exerciseFileTree.errorCode.invalidParameterCombination":"[Error] Invalid Parameter Combination","exerciseFileTree.errorCode.notFoundCurrentFilename":"[Error] Not Found Current Filename","exerciseFileTree.errorCode.notFoundExerciseRoom":"[Error] Not Found ExerciseRoom","exerciseFileTree.errorCode.notFoundPath":"[Error] Not Found Path","exerciseFileTree.errorCode.overwriteExistingOne":"[Error] Overwrite Existing One","exerciseFileTree.errorCode.resultingFilenameUnderCurrentFilename":"[Error] Resulting Filename Under Current Filename","exerciseFileTree.errorCode.subFileOrPathExist":"[Error] Sub File Or Path Exist","exerciseFileTree.errorCode.unknown":"[Error] An unkown error has occurred.","exerciseFileTree.errorCode.usableSizeExceed":"[Error] Usable Size Exceed","exerciseFileTree.fetchRoom.failure":"Failed to fetch exercise room."};
+var messageEn = {"exerciseFileTree.errorCode.insufficientPermission":"[Error] Insufficient Permission","exerciseFileTree.errorCode.invalidParameter":"[Error] Invalid Parameter","exerciseFileTree.errorCode.invalidParameterCombination":"[Error] Invalid Parameter Combination","exerciseFileTree.errorCode.notFoundCurrentFilename":"[Error] Not Found Current Filename","exerciseFileTree.errorCode.notFoundExerciseRoom":"[Error] Not Found ExerciseRoom","exerciseFileTree.errorCode.notFoundPath":"[Error] Not Found Path","exerciseFileTree.errorCode.overwriteExistingOne":"[Error] Overwrite Existing One","exerciseFileTree.errorCode.resultingFilenameUnderCurrentFilename":"[Error] Resulting Filename Under Current Filename","exerciseFileTree.errorCode.subFileOrPathExist":"[Error] Sub File Or Path Exist","exerciseFileTree.errorCode.unknown":"[Error] An unkown error has occurred.","exerciseFileTree.errorCode.usableSizeExceed":"[Error] Usable Size Exceed","exerciseFileTree.fetchRoom.failure":"Failed to fetch exercise room."};
 
-exports.default = phrasesEn;
+exports.default = messageEn;

package/cjs/components/material-exercise/exercise-file-tree/locales/index.d.ts

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

package/cjs/components/material-exercise/exercise-file-tree/locales/ko.json.js

@@ -2,6 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var phrasesKo = {"exerciseFileTree.errorCode.insufficientPermission":"[Error] 권한이 없습니다.","exerciseFileTree.errorCode.invalidParameter":"[Error] 파라미터가 올바르지 않습니다.","exerciseFileTree.errorCode.invalidParameterCombination":"[Error] 파라미터 조합이 올바르지 않습니다.","exerciseFileTree.errorCode.notFoundCurrentFilename":"[Error] 파일을 찾을 수 없습니다.","exerciseFileTree.errorCode.notFoundExerciseRoom":"[Error] 실습방을 찾을 수 없습니다.","exerciseFileTree.errorCode.notFoundPath":"[Error] 해당 경로를 찾을 수 없습니다.","exerciseFileTree.errorCode.overwriteExistingOne":"[Error] 덮어쓰기가 불가능합니다.","exerciseFileTree.errorCode.resultingFilenameUnderCurrentFilename":"[Error] 같은 경로에 디렉토리를 옮길 수 없습니다.","exerciseFileTree.errorCode.subFileOrPathExist":"[Error] 디렉토리를 삭제하지 못했습니다. 디렉토리가 비어있어야 삭제할 수 있습니다.","exerciseFileTree.errorCode.unknown":"[Error] 알수 없는 에러가 발생하였습니다.","exerciseFileTree.errorCode.usableSizeExceed":"[Error] 허용된 용량을 초과하였습니다.","exerciseFileTree.fetchRoom.failure":"실습을 가져오는데 실패했습니다."};
+var messageKo = {"exerciseFileTree.errorCode.insufficientPermission":"[Error] 권한이 없습니다.","exerciseFileTree.errorCode.invalidParameter":"[Error] 파라미터가 올바르지 않습니다.","exerciseFileTree.errorCode.invalidParameterCombination":"[Error] 파라미터 조합이 올바르지 않습니다.","exerciseFileTree.errorCode.notFoundCurrentFilename":"[Error] 파일을 찾을 수 없습니다.","exerciseFileTree.errorCode.notFoundExerciseRoom":"[Error] 실습방을 찾을 수 없습니다.","exerciseFileTree.errorCode.notFoundPath":"[Error] 해당 경로를 찾을 수 없습니다.","exerciseFileTree.errorCode.overwriteExistingOne":"[Error] 덮어쓰기가 불가능합니다.","exerciseFileTree.errorCode.resultingFilenameUnderCurrentFilename":"[Error] 같은 경로에 디렉토리를 옮길 수 없습니다.","exerciseFileTree.errorCode.subFileOrPathExist":"[Error] 디렉토리를 삭제하지 못했습니다. 디렉토리가 비어있어야 삭제할 수 있습니다.","exerciseFileTree.errorCode.unknown":"[Error] 알수 없는 에러가 발생하였습니다.","exerciseFileTree.errorCode.usableSizeExceed":"[Error] 허용된 용량을 초과하였습니다.","exerciseFileTree.fetchRoom.failure":"실습을 가져오는데 실패했습니다."};
 
-exports.default = phrasesKo;
+exports.default = messageKo;

package/cjs/components/material-exercise/exercise-file-tree/locales/th.json.js

@@ -0,0 +1,7 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var messageTh = {"exerciseFileTree.errorCode.insufficientPermission":"[ข้อผิดพลาด] ไม่มีสิทธิ์.","exerciseFileTree.errorCode.invalidParameter":"[ข้อผิดพลาด] พารามิเตอร์ไม่ถูกต้อง","exerciseFileTree.errorCode.invalidParameterCombination":"[ข้อผิดพลาด] การรวมพารามิเตอร์ไม่ถูกต้อง.","exerciseFileTree.errorCode.notFoundCurrentFilename":"[ข้อผิดพลาด] ไม่พบไฟล์","exerciseFileTree.errorCode.notFoundExerciseRoom":"[ข้อผิดพลาด] ไม่พบห้องปฏิบัติการ.","exerciseFileTree.errorCode.notFoundPath":"[ข้อผิดพลาด] ไม่สามารถหาเส้นทางที่ระบุ","exerciseFileTree.errorCode.overwriteExistingOne":"[ข้อผิดพลาด] ไม่สามารถเขียนทับได้.","exerciseFileTree.errorCode.resultingFilenameUnderCurrentFilename":"[ข้อผิดพลาด] ไม่สามารถย้ายไดเรกทอรีไปยังตำแหน่งเดียวกันได้ ค่ะ.","exerciseFileTree.errorCode.subFileOrPathExist":"[ข้อผิดพลาด] ไม่สามารถลบไดเรกทอรี ไดเร็กทอรีต้องว่างเปล่าก่อนจึงจะสามารถลบได้","exerciseFileTree.errorCode.unknown":"[ข้อผิดพลาด] เกิดข้อผิดพลาดที่ไม่สามารถระบุได้.","exerciseFileTree.errorCode.usableSizeExceed":"[ข้อผิดพลาด] คุณเกินพื้นที่ที่อนุญาตแล้วค่ะ.","exerciseFileTree.fetchRoom.failure":"การเรียนปฏิบัติล้มเหลว "};
+
+exports.default = messageTh;

package/cjs/components/material-exercise/exercise-menu/ExerciseMenu.d.ts

@@ -1,3 +1,4 @@
 import React from 'react';
-declare const _default: React.VFC<{}>;
+import type { WithIntlComponentBuilderProps as EliceIntlProps } from '@elice/intl';
+declare const _default: React.ForwardRefExoticComponent<Omit<import("@elice/intl").IntlComponentExtraProps & Omit<EliceIntlProps, keyof import("@elice/intl").IntlComponentExtraProps | "__intl">, "ref"> & React.RefAttributes<any>>;
 export default _default;

package/cjs/components/material-exercise/exercise-menu/ExerciseMenu.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var designTokens = require('@elice/design-tokens');
+var intl = require('@elice/intl');
 var types = require('@elice/types');
 var recoil = require('recoil');
 var styled = require('styled-components');
@@ -12,19 +13,21 @@ var context = require('../context/context.js');
 require('../context/recoilTypes.js');
 require('../context/subjects.js');
 require('../context/ExerciseProvider.js');
-var ExerciseIntlProvider = require('../context/ExerciseIntlProvider.js');
-var en = require('./locales/en.json.js');
-var ko = require('./locales/ko.json.js');
 var ExerciseMenuArduinoAgentModalButton = require('./ExerciseMenuArduinoAgentModalButton.js');
 var ExerciseMenuArduinoSettings = require('./ExerciseMenuArduinoSettings.js');
 var ExerciseMenuDropdown = require('./ExerciseMenuDropdown.js');
 var ExerciseMenuReset = require('./ExerciseMenuReset.js');
 var ExerciseMenuStdioFileBrowser = require('./ExerciseMenuStdioFileBrowser.js');
+var en = require('./locales/en.json.js');
+var ko = require('./locales/ko.json.js');
+var th = require('./locales/th.json.js');
 
 const StyledExerciseMenuWrapper = styled.div.withConfig({
   componentId: "sc-1gf6m87-0"
 })(["display:flex;justify-content:center;align-items:center;padding:0 0.5rem 0 1rem;height:2.25rem;gap:0.5rem;background-color:", ";"], designTokens.base.color.navy8);
-const ExerciseMenu = () => {
+const ExerciseMenu = ({
+  __intl
+}) => {
   const {
     materialExerciseId
   } = React.useContext(context.ExerciseContext);
@@ -33,11 +36,12 @@ const ExerciseMenu = () => {
   //
   //
   //
-  return React.createElement(StyledExerciseMenuWrapper, null, isArduinoExercise ? React.createElement(React.Fragment, null, React.createElement(ExerciseMenuArduinoAgentModalButton.default, null), React.createElement(ExerciseMenuArduinoSettings.default, null)) : React.createElement(ExerciseMenuStdioFileBrowser.default, null), React.createElement(ExerciseMenuReset.default, null), React.createElement(ExerciseMenuDropdown.default, null));
+  return React.createElement(intl.RawEliceIntlProvider, {
+    value: {
+      intl: __intl
+    }
+  }, React.createElement(StyledExerciseMenuWrapper, null, isArduinoExercise ? React.createElement(React.Fragment, null, React.createElement(ExerciseMenuArduinoAgentModalButton.default, null), React.createElement(ExerciseMenuArduinoSettings.default, null)) : React.createElement(ExerciseMenuStdioFileBrowser.default, null), React.createElement(ExerciseMenuReset.default, null), React.createElement(ExerciseMenuDropdown.default, null)));
 };
-var ExerciseMenu$1 = ExerciseIntlProvider.withExerciseIntlProvider(ExerciseMenu, {
-  en: en.default,
-  ko: ko.default
-});
+var ExerciseMenu$1 = new intl.IntlComponentBuilder(ExerciseMenu).add('en', en.default).add('ko', ko.default).add('th', th.default).build();
 
 exports.default = ExerciseMenu$1;

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

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var reactIntl = require('react-intl');
 var blocks = require('@elice/blocks');
 var icons = require('@elice/icons');
+var intl = require('@elice/intl');
 var recoil = require('recoil');
 var recoil$1 = require('../context/recoil.js');
 require('../context/context.js');
@@ -15,6 +15,9 @@ require('../context/ExerciseProvider.js');
 
 const ExerciseMenuArduinoAgentModalButton = () => {
   const setOpen = recoil.useSetRecoilState(recoil$1.exerciseArduinoAgentModalState);
+  const {
+    intl: intl$1
+  } = intl.useRawEliceIntl();
   const handleClick = () => {
     setOpen(true);
   };
@@ -27,8 +30,8 @@ const ExerciseMenuArduinoAgentModalButton = () => {
     iconAlign: "left",
     border: false,
     onClick: handleClick
-  }, React.createElement(reactIntl.FormattedMessage, {
-    id: "exerciseMenu.arduino.agent.button"
+  }, intl$1.formatMessage({
+    id: 'exerciseMenu.arduino.agent.button'
   }));
 };
 

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

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var reactIntl = require('react-intl');
 var blocks = require('@elice/blocks');
 var icons = require('@elice/icons');
+var intl = require('@elice/intl');
 var recoil = require('recoil');
 var ExerciseMenuButton = require('../../shared/exercise-menu-button/ExerciseMenuButton.js');
 var arduino = require('../../../constants/arduino.js');
@@ -18,7 +18,9 @@ require('../context/ExerciseProvider.js');
 var ExerciseMenuStdioFileBrowser_styled = require('./ExerciseMenuStdioFileBrowser.styled.js');
 
 const ExerciseMenuArduinoSettings = () => {
-  const intl = reactIntl.useIntl();
+  const {
+    intl: intl$1
+  } = intl.useRawEliceIntl();
   const [open, setOpen] = React.useState(false);
   const anchorRef = React.useRef(null);
   const ports = recoil.useRecoilValue(recoil$1.exerciseArduinoPortsState);
@@ -33,8 +35,8 @@ const ExerciseMenuArduinoSettings = () => {
       role: "gray3",
       block: true,
       size: "small"
-    }, React.createElement(reactIntl.FormattedMessage, {
-      id: "exerciseMenu.arduino.transferSpeed"
+    }, intl$1.formatMessage({
+      id: 'exerciseMenu.arduino.transferSpeed'
     })), React.createElement(ExerciseMenuStdioFileBrowser_styled.StyledSelect, {
       value: preference.baudRate,
       size: "small",
@@ -51,8 +53,8 @@ const ExerciseMenuArduinoSettings = () => {
       role: "gray3",
       block: true,
       size: "small"
-    }, React.createElement(reactIntl.FormattedMessage, {
-      id: "exerciseMenu.arduino.setting.device"
+    }, intl$1.formatMessage({
+      id: 'exerciseMenu.arduino.setting.device'
     })), React.createElement(ExerciseMenuStdioFileBrowser_styled.StyledSelect, {
       value: openedPort !== null && openedPort !== void 0 ? openedPort : '',
       size: "small",
@@ -63,13 +65,13 @@ const ExerciseMenuArduinoSettings = () => {
     }, ports.length === 0 ? React.createElement("option", {
       value: "",
       disabled: true
-    }, React.createElement(reactIntl.FormattedMessage, {
-      id: "exerciseMenu.arduino.setting.noDevice"
+    }, intl$1.formatMessage({
+      id: 'exerciseMenu.arduino.setting.noDevice'
     })) : React.createElement("option", {
       value: "",
       disabled: true
-    }, React.createElement(reactIntl.FormattedMessage, {
-      id: "exerciseMenu.arduino.setting.selectDevice"
+    }, intl$1.formatMessage({
+      id: 'exerciseMenu.arduino.setting.selectDevice'
     })), ports.map(port => React.createElement("option", {
       key: port.Name,
       value: port.Name
@@ -84,8 +86,8 @@ const ExerciseMenuArduinoSettings = () => {
       bold: true
     }, React.createElement(blocks.Flex, {
       align: "center"
-    }, React.createElement(reactIntl.FormattedMessage, {
-      id: "exerciseMenu.arduino.setting"
+    }, intl$1.formatMessage({
+      id: 'exerciseMenu.arduino.setting'
     }))), React.createElement(blocks.IconButton, {
       icon: icons.eilMathsignMultiplyBasic,
       role: "white",
@@ -122,7 +124,7 @@ const ExerciseMenuArduinoSettings = () => {
   const renderStdioFilePopoverToggleButton = () => {
     return React.createElement(ExerciseMenuButton.default, {
       icon: icons.eilMaterialTypeArduino,
-      title: intl.formatMessage({
+      title: intl$1.formatMessage({
         id: 'exerciseMenu.arduino.setting'
       }),
       active: open,

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

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var reactIntl = require('react-intl');
 var blocks = require('@elice/blocks');
 var icons = require('@elice/icons');
+var intl = require('@elice/intl');
 var types = require('@elice/types');
 var recoil = require('recoil');
 var ExerciseMenuButton = require('../../shared/exercise-menu-button/ExerciseMenuButton.js');
@@ -19,7 +19,9 @@ var ExerciseRoom = require('../exercise-room/ExerciseRoom.js');
 var ExerciseSubmitHistory = require('../exercise-submit-history/ExerciseSubmitHistory.js');
 
 const ExerciseMenuDropdown = () => {
-  const intl = reactIntl.useIntl();
+  const {
+    intl: intl$1
+  } = intl.useRawEliceIntl();
   const {
     materialExerciseId
   } = React.useContext(context.ExerciseContext);
@@ -74,29 +76,29 @@ const ExerciseMenuDropdown = () => {
   //
   return React.createElement(React.Fragment, null, React.createElement(blocks.ButtonMenu, {
     menuItemProps: [{
-      label: intl.formatMessage({
+      label: intl$1.formatMessage({
         id: 'exerciseMenu.dropdown.item.environment'
       }),
       onClick: () => setRightpaneActiveState('environment')
     }, {
-      label: intl.formatMessage({
+      label: intl$1.formatMessage({
         id: 'exerciseMenu.dropdown.item.preference'
       }),
       onClick: () => setRightpaneActiveState('preference')
     }, {
-      label: intl.formatMessage({
+      label: intl$1.formatMessage({
         id: 'exerciseMenu.dropdown.item.codeHistory'
       }),
       disabled: !user,
       onClick: () => setIsCodeHistoryModalOpen(true)
     }, {
-      label: intl.formatMessage({
+      label: intl$1.formatMessage({
         id: 'exerciseMenu.dropdown.item.submitHistory'
       }),
       disabled: !user || !activeFilename,
       onClick: () => setIsSubmitHistoryModalOpen(true)
     }, {
-      label: intl.formatMessage({
+      label: intl$1.formatMessage({
         id: 'exerciseMenu.dropdown.item.room'
       }),
       disabled: isLectureTestInProgress,
@@ -108,7 +110,7 @@ const ExerciseMenuDropdown = () => {
     shadow: true
   }, React.createElement(ExerciseMenuButton.default, {
     icon: icons.eilMoreVertical,
-    title: intl.formatMessage({
+    title: intl$1.formatMessage({
       id: 'exerciseMenu.dropdown.button.tooltip'
     })
   })), renderSumbitHistoryModal(), renderCodeHistoryModal(), renderExerciseRoomModal());

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

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var reactIntl = require('react-intl');
 var blocks = require('@elice/blocks');
 var icons = require('@elice/icons');
+var intl = require('@elice/intl');
 var recoil = require('recoil');
 var ExerciseMenuButton = require('../../shared/exercise-menu-button/ExerciseMenuButton.js');
 require('react-use');
@@ -27,7 +27,9 @@ require('random-words');
 require('unicount');
 
 const ExerciseMenuReset = () => {
-  const intl = reactIntl.useIntl();
+  const {
+    intl: intl$1
+  } = intl.useRawEliceIntl();
   const [isDialogOpen, setDialogOpen] = React.useState(false);
   const activeFilename = recoil.useRecoilValue(recoil$1.exerciseActiveFilenameState);
   const isFileResettable = useExerciseFile.useExerciseFileResettable(activeFilename);
@@ -45,9 +47,9 @@ const ExerciseMenuReset = () => {
     return React.createElement(ExerciseMenuButton.default, {
       icon: icons.eilReset,
       active: isDialogOpen,
-      title: isFileResettable ? intl.formatMessage({
+      title: isFileResettable ? intl$1.formatMessage({
         id: 'exerciseMenu.reset.button.tooltip.enabled'
-      }) : intl.formatMessage({
+      }) : intl$1.formatMessage({
         id: 'exerciseMenu.reset.button.tooltip.disabled'
       }),
       disabled: !isFileResettable,
@@ -63,21 +65,21 @@ const ExerciseMenuReset = () => {
     }
     return React.createElement(blocks.Dialog, {
       type: "warning",
-      title: intl.formatMessage({
+      title: intl$1.formatMessage({
         id: 'exerciseMenu.reset.confirmDialog.title'
       }),
-      body: intl.formatMessage({
+      body: intl$1.formatMessage({
         id: 'exerciseMenu.reset.confirmDialog.body'
       }),
       onHide: () => setDialogOpen(false)
     }, React.createElement(blocks.Dialog.CloseButton, {
       onClick: () => setDialogOpen(false)
-    }, React.createElement(reactIntl.FormattedMessage, {
-      id: "exerciseMenu.reset.confirmDialog.cancel"
+    }, intl$1.formatMessage({
+      id: 'exerciseMenu.reset.confirmDialog.cancel'
     })), React.createElement(blocks.Dialog.ActionButton, {
       onClick: handleReset
-    }, React.createElement(reactIntl.FormattedMessage, {
-      id: "exerciseMenu.reset.confirmDialog.confirm"
+    }, intl$1.formatMessage({
+      id: 'exerciseMenu.reset.confirmDialog.confirm'
     })));
   };
   //

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

@@ -3,10 +3,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var reactIntl = require('react-intl');
 var blocks = require('@elice/blocks');
 var designTokens = require('@elice/design-tokens');
 var icons = require('@elice/icons');
+var intl = require('@elice/intl');
 var muiElements = require('@elice/mui-elements');
 var recoil = require('recoil');
 var ExerciseMenuButton = require('../../shared/exercise-menu-button/ExerciseMenuButton.js');
@@ -18,7 +18,9 @@ require('../context/ExerciseProvider.js');
 var ExerciseMenuStdioFileBrowser_styled = require('./ExerciseMenuStdioFileBrowser.styled.js');
 
 const ExerciseMenuStdioFileBrowser = () => {
-  const intl = reactIntl.useIntl();
+  const {
+    intl: intl$1
+  } = intl.useRawEliceIntl();
   const [open, setOpen] = React.useState(false);
   const anchorRef = React.useRef(null);
   const stdioFiles = recoil.useRecoilValue(recoil$1.exerciseRunnerStdioFilesState);
@@ -93,8 +95,8 @@ const ExerciseMenuStdioFileBrowser = () => {
       size: "small",
       textAlign: "center",
       preWrap: true
-    }, React.createElement(reactIntl.FormattedMessage, {
-      id: "exerciseMenu.stdioFileBrowser.popover.body.placeholder"
+    }, intl$1.formatMessage({
+      id: 'exerciseMenu.stdioFileBrowser.popover.body.placeholder'
     })));
   };
   /**
@@ -125,8 +127,8 @@ const ExerciseMenuStdioFileBrowser = () => {
       role: "white",
       size: "small",
       bold: true
-    }, React.createElement(reactIntl.FormattedMessage, {
-      id: "exerciseMenu.stdioFileBrowser.popover.header"
+    }, intl$1.formatMessage({
+      id: 'exerciseMenu.stdioFileBrowser.popover.header'
     })), React.createElement(blocks.Hspace, {
       width: 0.5
     }), React.createElement(blocks.NotificationCount, {
@@ -169,7 +171,7 @@ const ExerciseMenuStdioFileBrowser = () => {
     return React.createElement(ExerciseMenuButton.default, {
       icon: icons.eilAttachment,
       active: open,
-      title: intl.formatMessage({
+      title: intl$1.formatMessage({
         id: 'exerciseMenu.stdioFileBrowser.button.tooltip'
       }),
       onClick: () => setOpen(prev => !prev),

package/cjs/components/material-exercise/exercise-menu/locales/en.json.js

@@ -2,6 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var phrasesEn = {"exerciseMenu.dropdown.button.tooltip":"More","exerciseMenu.dropdown.item.codeHistory":"Submit History","exerciseMenu.dropdown.item.environment":"Environment","exerciseMenu.dropdown.item.preference":"Editor Preferences","exerciseMenu.dropdown.item.room":"Code Sharing","exerciseMenu.dropdown.item.submitHistory":"Code History","exerciseMenu.arduino.agent.button":"Having problem with connecting to Arduino?","exerciseMenu.arduino.setting":"Arduino Setting","exerciseMenu.arduino.setting.device":"Device","exerciseMenu.arduino.setting.noDevice":"No device","exerciseMenu.arduino.setting.selectDevice":"Select device","exerciseMenu.arduino.transferSpeed":"Transfer speed","exerciseMenu.reset.button.tooltip.disabled":"The file cannot be reset","exerciseMenu.reset.button.tooltip.enabled":"Reset the file","exerciseMenu.reset.confirmDialog.body":"Are you sure you want to clear all the code you wrote at current file and reset it?","exerciseMenu.reset.confirmDialog.cancel":"Cencel","exerciseMenu.reset.confirmDialog.confirm":"Confirm","exerciseMenu.reset.confirmDialog.title":"Reset the file","exerciseMenu.stdioFileBrowser.button.tooltip":"File","exerciseMenu.stdioFileBrowser.popover.body.placeholder":"Files sent from your code\nappear here.","exerciseMenu.stdioFileBrowser.popover.header":"File"};
+var messageEn = {"exerciseMenu.dropdown.button.tooltip":"More","exerciseMenu.dropdown.item.codeHistory":"Submit History","exerciseMenu.dropdown.item.environment":"Environment","exerciseMenu.dropdown.item.preference":"Editor Preferences","exerciseMenu.dropdown.item.room":"Code Sharing","exerciseMenu.dropdown.item.submitHistory":"Code History","exerciseMenu.arduino.agent.button":"Having problem with connecting to Arduino?","exerciseMenu.arduino.setting":"Arduino Setting","exerciseMenu.arduino.setting.device":"Device","exerciseMenu.arduino.setting.noDevice":"No device","exerciseMenu.arduino.setting.selectDevice":"Select device","exerciseMenu.arduino.transferSpeed":"Transfer speed","exerciseMenu.reset.button.tooltip.disabled":"The file cannot be reset","exerciseMenu.reset.button.tooltip.enabled":"Reset the file","exerciseMenu.reset.confirmDialog.body":"Are you sure you want to clear all the code you wrote at current file and reset it?","exerciseMenu.reset.confirmDialog.cancel":"Cencel","exerciseMenu.reset.confirmDialog.confirm":"Confirm","exerciseMenu.reset.confirmDialog.title":"Reset the file","exerciseMenu.stdioFileBrowser.button.tooltip":"File","exerciseMenu.stdioFileBrowser.popover.body.placeholder":"Files sent from your code\nappear here.","exerciseMenu.stdioFileBrowser.popover.header":"File"};
 
-exports.default = phrasesEn;
+exports.default = messageEn;

package/cjs/components/material-exercise/exercise-menu/locales/index.d.ts

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

package/cjs/components/material-exercise/exercise-menu/locales/ko.json.js

@@ -2,6 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var phrasesKo = {"exerciseMenu.dropdown.button.tooltip":"더 보기","exerciseMenu.dropdown.item.codeHistory":"코드 수정 이력","exerciseMenu.dropdown.item.environment":"실습 환경","exerciseMenu.dropdown.item.preference":"에디터 설정","exerciseMenu.dropdown.item.room":"코드 공유","exerciseMenu.dropdown.item.submitHistory":"실행/제출 이력","exerciseMenu.arduino.agent.button":"아두이노 연결 중 문제가 발생했나요?","exerciseMenu.arduino.setting":"아두이노 세팅","exerciseMenu.arduino.setting.device":"장치","exerciseMenu.arduino.setting.noDevice":"장치 없음","exerciseMenu.arduino.setting.selectDevice":"장치 선택","exerciseMenu.arduino.transferSpeed":"전송 속도","exerciseMenu.reset.button.tooltip.disabled":"해당 파일은 초기화를 할 수 없습니다","exerciseMenu.reset.button.tooltip.enabled":"코드 초기화","exerciseMenu.reset.confirmDialog.body":"작성한 코드를 모두 지우고 초기화하시겠습니까?","exerciseMenu.reset.confirmDialog.cancel":"취소","exerciseMenu.reset.confirmDialog.confirm":"확인","exerciseMenu.reset.confirmDialog.title":"코드 초기화","exerciseMenu.stdioFileBrowser.button.tooltip":"파일","exerciseMenu.stdioFileBrowser.popover.body.placeholder":"코드에서 전송한 파일이\n여기에 표시됩니다.","exerciseMenu.stdioFileBrowser.popover.header":"파일"};
+var messageKo = {"exerciseMenu.dropdown.button.tooltip":"더 보기","exerciseMenu.dropdown.item.codeHistory":"코드 수정 이력","exerciseMenu.dropdown.item.environment":"실습 환경","exerciseMenu.dropdown.item.preference":"에디터 설정","exerciseMenu.dropdown.item.room":"코드 공유","exerciseMenu.dropdown.item.submitHistory":"실행/제출 이력","exerciseMenu.arduino.agent.button":"아두이노 연결 중 문제가 발생했나요?","exerciseMenu.arduino.setting":"아두이노 세팅","exerciseMenu.arduino.setting.device":"장치","exerciseMenu.arduino.setting.noDevice":"장치 없음","exerciseMenu.arduino.setting.selectDevice":"장치 선택","exerciseMenu.arduino.transferSpeed":"전송 속도","exerciseMenu.reset.button.tooltip.disabled":"해당 파일은 초기화를 할 수 없습니다","exerciseMenu.reset.button.tooltip.enabled":"코드 초기화","exerciseMenu.reset.confirmDialog.body":"작성한 코드를 모두 지우고 초기화하시겠습니까?","exerciseMenu.reset.confirmDialog.cancel":"취소","exerciseMenu.reset.confirmDialog.confirm":"확인","exerciseMenu.reset.confirmDialog.title":"코드 초기화","exerciseMenu.stdioFileBrowser.button.tooltip":"파일","exerciseMenu.stdioFileBrowser.popover.body.placeholder":"코드에서 전송한 파일이\n여기에 표시됩니다.","exerciseMenu.stdioFileBrowser.popover.header":"파일"};
 
-exports.default = phrasesKo;
+exports.default = messageKo;

package/cjs/components/material-exercise/exercise-menu/locales/th.json.js

@@ -0,0 +1,7 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var messageTh = {"exerciseMenu.dropdown.button.tooltip":"ดูเพิ่มเติม","exerciseMenu.dropdown.item.codeHistory":"ประวัติการแก้ไขโค้ด","exerciseMenu.dropdown.item.environment":"สมบัติทดลอง","exerciseMenu.dropdown.item.preference":"การตั้งค่าเอ็ดิเตอร์","exerciseMenu.dropdown.item.room":"แชร์โค้ด","exerciseMenu.dropdown.item.submitHistory":"ประวัติการดำเนินการ/ส่งผลลัพธ์","exerciseMenu.arduino.agent.button":"มีปัญหาในการเชื่อมต่ออาดูยโนหรือไม่?","exerciseMenu.arduino.setting":"Arduino การตั้งค่า","exerciseMenu.arduino.setting.device":"อุปกรณ์","exerciseMenu.arduino.setting.noDevice":"ไม่มีอุปกรณ์","exerciseMenu.arduino.setting.selectDevice":"เลือกอุปกรณ์","exerciseMenu.arduino.transferSpeed":"ความเร็วในการส่งถ่าย","exerciseMenu.reset.button.tooltip.disabled":"ไฟล์ที่ระบุไม่สามารถทำการเริ่มต้นใหม่ได้","exerciseMenu.reset.button.tooltip.enabled":"รีเซ็ตโค้ด","exerciseMenu.reset.confirmDialog.body":"คุณต้องการลบโค้ดทั้งหมดและรีเซ็ตใช่ไหม?","exerciseMenu.reset.confirmDialog.cancel":"ยกเลิก","exerciseMenu.reset.confirmDialog.confirm":"ตรวจสอบ","exerciseMenu.reset.confirmDialog.title":"รีเซ็ตโค้ด","exerciseMenu.stdioFileBrowser.button.tooltip":"ไฟล์","exerciseMenu.stdioFileBrowser.popover.body.placeholder":"ไฟล์ที่ถูกส่งจากโค้ดจะแสดงที่นี่.","exerciseMenu.stdioFileBrowser.popover.header":"ไฟล์"};
+
+exports.default = messageTh;

package/cjs/components/material-exercise/exercise-preview/ExercisePreview.d.ts

@@ -1,3 +1,4 @@
 import React from 'react';
-declare const _default: React.VFC<{}>;
+import type { WithIntlComponentBuilderProps as EliceIntlProps } from '@elice/intl';
+declare const _default: React.ForwardRefExoticComponent<Omit<import("@elice/intl").IntlComponentExtraProps & Omit<EliceIntlProps, keyof import("@elice/intl").IntlComponentExtraProps | "__intl">, "ref"> & React.RefAttributes<any>>;
 export default _default;

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

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var designTokens = require('@elice/design-tokens');
+var intl = require('@elice/intl');
 var recoil = require('recoil');
 var styled = require('styled-components');
 var NoVncLazy = require('../../shared/no-vnc/NoVncLazy.js');
@@ -13,10 +14,10 @@ var context = require('../context/context.js');
 var recoilTypes = require('../context/recoilTypes.js');
 require('../context/subjects.js');
 require('../context/ExerciseProvider.js');
-var ExerciseIntlProvider = require('../context/ExerciseIntlProvider.js');
+var ExercisePreviewDisplayModeButton = require('./ExercisePreviewDisplayModeButton.js');
 var en = require('./locales/en.json.js');
 var ko = require('./locales/ko.json.js');
-var ExercisePreviewDisplayModeButton = require('./ExercisePreviewDisplayModeButton.js');
+var th = require('./locales/th.json.js');
 
 const StyledExercisePreview = styled.div.withConfig({
   componentId: "sc-i6d1i5-0"
@@ -26,7 +27,9 @@ const StyledExercisePreview = styled.div.withConfig({
  * - NoVnc
  * - Web browser
  */
-const ExercisePreview = () => {
+const ExercisePreview = ({
+  __intl
+}) => {
   const {
     materialExerciseId
   } = React.useContext(context.ExerciseContext);
@@ -93,11 +96,12 @@ const ExercisePreview = () => {
   //
   //
   //
-  return React.createElement(StyledExercisePreview, null, renderNoVnc(), renderWebBrowser());
+  return React.createElement(intl.RawEliceIntlProvider, {
+    value: {
+      intl: __intl
+    }
+  }, React.createElement(StyledExercisePreview, null, renderNoVnc(), renderWebBrowser()));
 };
-var ExercisePreview$1 = ExerciseIntlProvider.withExerciseIntlProvider(ExercisePreview, {
-  en: en.default,
-  ko: ko.default
-});
+var ExercisePreview$1 = new intl.IntlComponentBuilder(ExercisePreview).add('en', en.default).add('ko', ko.default).add('th', th.default).build();
 
 exports.default = ExercisePreview$1;

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

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var reactIntl = require('react-intl');
 var icons = require('@elice/icons');
+var intl = require('@elice/intl');
 var recoil = require('recoil');
 var ExerciseMenuButton = require('../../shared/exercise-menu-button/ExerciseMenuButton.js');
 var recoil$1 = require('../context/recoil.js');
@@ -15,7 +15,9 @@ require('../context/ExerciseProvider.js');
 
 const ExercisePreviewDisplayModeButton = React.forwardRef((props, ref) => {
   var _a;
-  const intl = reactIntl.useIntl();
+  const {
+    intl: intl$1
+  } = intl.useRawEliceIntl();
   const [exercisePreviewDisplayMode, setExercisePreviewDisplayMode] = recoil.useRecoilState(recoil$1.exercisePreviewDisplayModeState);
   /**
    * Handle click.
@@ -28,9 +30,9 @@ const ExercisePreviewDisplayModeButton = React.forwardRef((props, ref) => {
   //
   return React.createElement(ExerciseMenuButton.default, Object.assign({}, props, {
     icon: exercisePreviewDisplayMode === recoilTypes.ExercisePreviewDisplayMode.Mini ? icons.eilScreenHalf : icons.eilPanelRight,
-    title: ((_a = props.title) !== null && _a !== void 0 ? _a : exercisePreviewDisplayMode === recoilTypes.ExercisePreviewDisplayMode.Mini) ? intl.formatMessage({
+    title: ((_a = props.title) !== null && _a !== void 0 ? _a : exercisePreviewDisplayMode === recoilTypes.ExercisePreviewDisplayMode.Mini) ? intl$1.formatMessage({
       id: 'exercisePreview.displayModeButton.sideBySide'
-    }) : intl.formatMessage({
+    }) : intl$1.formatMessage({
       id: 'exercisePreview.displayModeButton.mini'
     }),
     placement: "bottom-end",

package/cjs/components/material-exercise/exercise-preview/locales/en.json.js

@@ -2,6 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var phrasesEn = {"exercisePreview.displayModeButton.mini":"Toggle to Mini mode","exercisePreview.displayModeButton.sideBySide":"Toggle to Side-by-side mode"};
+var messageEn = {"exercisePreview.displayModeButton.mini":"Toggle to Mini mode","exercisePreview.displayModeButton.sideBySide":"Toggle to Side-by-side mode"};
 
-exports.default = phrasesEn;
+exports.default = messageEn;

package/cjs/components/material-exercise/exercise-preview/locales/index.d.ts

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

package/cjs/components/material-exercise/exercise-preview/locales/ko.json.js

@@ -2,6 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var phrasesKo = {"exercisePreview.displayModeButton.mini":"간소화 뷰로 전환","exercisePreview.displayModeButton.sideBySide":"사이드 뷰로 전환"};
+var messageKo = {"exercisePreview.displayModeButton.mini":"간소화 뷰로 전환","exercisePreview.displayModeButton.sideBySide":"사이드 뷰로 전환"};
 
-exports.default = phrasesKo;
+exports.default = messageKo;

package/cjs/components/material-exercise/exercise-preview/locales/th.json.js

@@ -0,0 +1,7 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var messageTh = {"exercisePreview.displayModeButton.mini":"เปลี่ยนเป็นมุมมองที่เรียบง่าย","exercisePreview.displayModeButton.sideBySide":"เปลี่ยนมุมมองเป็นด้านข้าง"};
+
+exports.default = messageTh;