@elice/material-exercise 1.230328.0 → 1.230418.0

package/cjs/components/shared/monaco-editor/MonacoEditorMobile.js

@@ -1,5 +1,8 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var reactUse = require('react-use');
 var monaco = require('monaco-editor/esm/vs/editor/editor.api');
@@ -30,8 +33,8 @@ var monaco__namespace = /*#__PURE__*/_interopNamespace(monaco);
 
 //
 //
-
-const MOBILE_EDITOR_PREFERENCE = Object.freeze({
+//
+var MOBILE_EDITOR_PREFERENCE = Object.freeze({
   autoClosingBrackets: 'always',
   cursorSmoothCaretAnimation: false,
   detectIndentation: true,
@@ -44,34 +47,39 @@ const MOBILE_EDITOR_PREFERENCE = Object.freeze({
   theme: 'elice',
   wordWrap: 'on'
 });
-const IS_IOS = ['iPad Simulator', 'iPhone Simulator', 'iPod Simulator', 'iPad', 'iPhone', 'iPod'].includes(navigator.platform) || navigator.userAgent.includes('Mac') && 'ontouchend' in document; //
+var IS_IOS = ['iPad Simulator', 'iPhone Simulator', 'iPod Simulator', 'iPad', 'iPhone', 'iPod'].includes(navigator.platform) || navigator.userAgent.includes('Mac') && 'ontouchend' in document;
 //
 //
-
-const MonacoEditorMobile = React.forwardRef((props, ref) => {
-  const editorApiRef = reactUse.useEnsuredForwardedRef(ref);
-  const [preference, setPreference] = React__default["default"].useState(MOBILE_EDITOR_PREFERENCE);
+//
+var MonacoEditorMobile = React.forwardRef(function (props, ref) {
+  var editorApiRef = reactUse.useEnsuredForwardedRef(ref);
+  var _React$useState = React__default["default"].useState(MOBILE_EDITOR_PREFERENCE),
+    _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
+    preference = _React$useState2[0],
+    setPreference = _React$useState2[1];
   /**
    * Add a button to show keyboard on non-Apple devices.
    */
-
-  const addKeyboardButtonOverlayWidget = editor => {
+  var addKeyboardButtonOverlayWidget = function addKeyboardButtonOverlayWidget(editor) {
     if (IS_IOS) {
       return;
     }
-
     editor.addOverlayWidget({
-      getId: () => {
+      getId: function getId() {
         return 'editor.contrib.ShowKeyboardWidget';
       },
-      getDomNode: () => {
-        const domNode = document.createElement('textarea');
+      getDomNode: function getDomNode() {
+        var domNode = document.createElement('textarea');
         domNode.className = 'iPadShowKeyboard';
-        domNode.addEventListener('touchstart', () => editor.focus());
-        domNode.addEventListener('focus', () => editor.focus());
+        domNode.addEventListener('touchstart', function () {
+          return editor.focus();
+        });
+        domNode.addEventListener('focus', function () {
+          return editor.focus();
+        });
         return domNode;
       },
-      getPosition: () => {
+      getPosition: function getPosition() {
         return {
           preference: monaco__namespace.editor.OverlayWidgetPositionPreference.BOTTOM_RIGHT_CORNER
         };
@@ -81,58 +89,45 @@ const MonacoEditorMobile = React.forwardRef((props, ref) => {
   /**
    * Export window-level event functions for mobile app.
    */
-
-
-  const exposeWindowGlobalEvents = editor => {
-    const editorApi = editorApiRef.current;
-
+  var exposeWindowGlobalEvents = function exposeWindowGlobalEvents(editor) {
+    var editorApi = editorApiRef.current;
     if (!editorApi) {
       return;
     }
-
-    window.cursorCharLeft = () => {
+    window.cursorCharLeft = function () {
       var _a;
-
-      const pos = (_a = editor.getPosition()) !== null && _a !== void 0 ? _a : new monaco__namespace.Position(0, 0);
+      var pos = (_a = editor.getPosition()) !== null && _a !== void 0 ? _a : new monaco__namespace.Position(0, 0);
       editor.setPosition(new monaco__namespace.Position(pos.lineNumber, pos.column - 1));
     };
-
-    window.cursorCharRight = () => {
+    window.cursorCharRight = function () {
       var _a;
-
-      const pos = (_a = editor.getPosition()) !== null && _a !== void 0 ? _a : new monaco__namespace.Position(0, 0);
+      var pos = (_a = editor.getPosition()) !== null && _a !== void 0 ? _a : new monaco__namespace.Position(0, 0);
       editor.setPosition(new monaco__namespace.Position(pos.lineNumber, pos.column + 1));
     };
-
-    window.cursorLineUp = () => {
+    window.cursorLineUp = function () {
       var _a;
-
-      const pos = (_a = editor.getPosition()) !== null && _a !== void 0 ? _a : new monaco__namespace.Position(0, 0);
+      var pos = (_a = editor.getPosition()) !== null && _a !== void 0 ? _a : new monaco__namespace.Position(0, 0);
       editor.setPosition(new monaco__namespace.Position(pos.lineNumber - 1, pos.column));
     };
-
-    window.cursorLineDown = () => {
+    window.cursorLineDown = function () {
       var _a;
-
-      const pos = (_a = editor.getPosition()) !== null && _a !== void 0 ? _a : new monaco__namespace.Position(0, 0);
+      var pos = (_a = editor.getPosition()) !== null && _a !== void 0 ? _a : new monaco__namespace.Position(0, 0);
       editor.setPosition(new monaco__namespace.Position(pos.lineNumber + 1, pos.column));
     };
-
-    window.dispatchReconfigureFontSize = fontSize => {
-      setPreference(prev => Object.assign(Object.assign({}, prev), {
-        fontSize
-      }));
+    window.dispatchReconfigureFontSize = function (fontSize) {
+      setPreference(function (prev) {
+        return Object.assign(Object.assign({}, prev), {
+          fontSize: fontSize
+        });
+      });
     };
-
-    window.dispatchChangeInsert = insert => {
+    window.dispatchChangeInsert = function (insert) {
       editorApi.insertValue(editorApi.getPositionOffset(), insert);
     };
-
-    window.insertTab = () => {
-      const model = editorApi.getMonacoModel();
-
+    window.insertTab = function () {
+      var model = editorApi.getMonacoModel();
       if (model) {
-        const modelOptions = model.getOptions();
+        var modelOptions = model.getOptions();
         editorApi.insertValue(editorApi.getPositionOffset(), modelOptions.insertSpaces ? ' '.repeat(modelOptions.tabSize) : '\t');
       }
     };
@@ -140,21 +135,17 @@ const MonacoEditorMobile = React.forwardRef((props, ref) => {
   /**
    *
    */
-
-
-  const handleLoad = editor => {
+  var handleLoad = function handleLoad(editor) {
     if (typeof props.onLoad === 'function') {
       props.onLoad(editor);
     }
-
     addKeyboardButtonOverlayWidget(editor);
     exposeWindowGlobalEvents(editor);
-  }; //
+  };
   //
   //
-
-
-  return React__default["default"].createElement(MonacoEditor, Object.assign({}, props, {
+  //
+  return React__default["default"].createElement(MonacoEditor["default"], Object.assign({}, props, {
     noLanguageIntellisense: true,
     preference: preference,
     onLoad: handleLoad,
@@ -162,4 +153,4 @@ const MonacoEditorMobile = React.forwardRef((props, ref) => {
   }));
 });
 
-module.exports = MonacoEditorMobile;
+exports["default"] = MonacoEditorMobile;

package/cjs/components/shared/monaco-editor/MonacoEditorPerferenceForm.js

@@ -1,5 +1,8 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var reactIntl = require('react-intl');
 var reactUse = require('react-use');
@@ -19,35 +22,38 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-const StyledPreferenceBodyItem = styled__default["default"].div.withConfig({
+var StyledPreferenceBodyItem = styled__default["default"].div.withConfig({
   componentId: "sc-1bwf6gs-0"
 })(["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__default["default"](blocks.Select).withConfig({
+var StyledSelect = styled__default["default"](blocks.Select).withConfig({
   componentId: "sc-1bwf6gs-1"
 })(["> div{background:", " !important;border-color:", " !important;}select{padding:0 !important;height:2rem !important;color:#fff !important;> option{background:", " !important;}}"], designTokens.base.color.navy8, designTokens.base.color.navy7, designTokens.base.color.navy8);
-
-const MonacoEditorPerferenceForm = ({
-  value,
-  onChange
-}) => {
-  const intl = reactIntl.useIntl();
-  const [preference, setPreference] = React__default["default"].useState(monacoPreference.normalizeMonacoPreference(value));
+var MonacoEditorPerferenceForm = function MonacoEditorPerferenceForm(_ref) {
+  var value = _ref.value,
+    onChange = _ref.onChange;
+  var intl = reactIntl.useIntl();
+  var _React$useState = React__default["default"].useState(monacoPreference.normalizeMonacoPreference(value)),
+    _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
+    preference = _React$useState2[0],
+    setPreference = _React$useState2[1];
   /**
    * Update preference from form.
    */
-
-  const updatePreference = newPreference => {
-    setPreference(prev => monacoPreference.normalizeMonacoPreference(Object.assign(Object.assign({}, prev), newPreference)));
-  }; //
+  var updatePreference = function updatePreference(newPreference) {
+    setPreference(function (prev) {
+      return monacoPreference.normalizeMonacoPreference(Object.assign(Object.assign({}, prev), newPreference));
+    });
+  };
+  //
   // Update state from value.
   //
-
-
-  reactUse.useDeepCompareEffect(() => setPreference(monacoPreference.normalizeMonacoPreference(value)), [value]); //
+  reactUse.useDeepCompareEffect(function () {
+    return setPreference(monacoPreference.normalizeMonacoPreference(value));
+  }, [value]);
+  //
   // Emit change event.
   //
-
-  reactUse.useDeepCompareEffect(() => {
+  reactUse.useDeepCompareEffect(function () {
     if (typeof onChange === 'function') {
       onChange(preference);
     }
@@ -55,8 +61,7 @@ const MonacoEditorPerferenceForm = ({
   /**
    * appearance > theme
    */
-
-  const renderPreferenceItemTheme = () => {
+  var renderPreferenceItemTheme = function renderPreferenceItemTheme() {
     return React__default["default"].createElement(StyledPreferenceBodyItem, null, React__default["default"].createElement(blocks.Text, {
       role: "navy",
       size: "tiny",
@@ -67,25 +72,24 @@ const MonacoEditorPerferenceForm = ({
       value: preference.theme,
       size: "small",
       width: "xsmall",
-      onChange: value => {
+      onChange: function onChange(value) {
         updatePreference({
           theme: value
         });
       }
-    }, index.VSCODE_THEMES.map(({
-      id,
-      name
-    }) => React__default["default"].createElement("option", {
-      key: id,
-      value: id
-    }, name))));
+    }, index.VSCODE_THEMES.map(function (_ref2) {
+      var id = _ref2.id,
+        name = _ref2.name;
+      return React__default["default"].createElement("option", {
+        key: id,
+        value: id
+      }, name);
+    })));
   };
   /**
    * appearance > font size
    */
-
-
-  const renderPreferenceItemFontSize = () => {
+  var renderPreferenceItemFontSize = function renderPreferenceItemFontSize() {
     return React__default["default"].createElement(StyledPreferenceBodyItem, null, React__default["default"].createElement(blocks.Text, {
       role: "navy",
       size: "tiny",
@@ -96,22 +100,22 @@ const MonacoEditorPerferenceForm = ({
       value: preference.fontSize,
       size: "small",
       width: "xsmall",
-      onChange: value => {
+      onChange: function onChange(value) {
         updatePreference({
           fontSize: Number(value)
         });
       }
-    }, preferences.MONACO_EDITOR_PREFERENCE_OPTIONS_FONT_SIZES.map(size => React__default["default"].createElement("option", {
-      key: size,
-      value: size
-    }, size))));
+    }, preferences.MONACO_EDITOR_PREFERENCE_OPTIONS_FONT_SIZES.map(function (size) {
+      return React__default["default"].createElement("option", {
+        key: size,
+        value: size
+      }, size);
+    })));
   };
   /**
    * appearance > word wrap
    */
-
-
-  const renderPreferenceItemWordWrap = () => {
+  var renderPreferenceItemWordWrap = function renderPreferenceItemWordWrap() {
     return React__default["default"].createElement(StyledPreferenceBodyItem, null, React__default["default"].createElement(blocks.Text, {
       role: "navy",
       size: "tiny",
@@ -120,7 +124,7 @@ const MonacoEditorPerferenceForm = ({
       id: "monacoEditorPerferenceForm.displaying.item.wordWrap.name"
     })), React__default["default"].createElement(blocks.AntSwitch, {
       checked: preference.wordWrap === 'on',
-      onChange: value => {
+      onChange: function onChange(value) {
         updatePreference({
           wordWrap: value ? 'on' : 'off'
         });
@@ -130,9 +134,7 @@ const MonacoEditorPerferenceForm = ({
   /**
    * appearance > white space
    */
-
-
-  const renderPreferenceItemWhiteSpace = () => {
+  var renderPreferenceItemWhiteSpace = function renderPreferenceItemWhiteSpace() {
     return React__default["default"].createElement(StyledPreferenceBodyItem, null, React__default["default"].createElement(blocks.Text, {
       role: "navy",
       size: "tiny",
@@ -143,26 +145,25 @@ const MonacoEditorPerferenceForm = ({
       value: preference.renderWhitespace,
       size: "small",
       width: "xsmall",
-      onChange: value => {
+      onChange: function onChange(value) {
         updatePreference({
           renderWhitespace: value
         });
       }
-    }, preferences.MONACO_EDITOR_RENDER_WHITESPACE_OPTIONS.map(option => React__default["default"].createElement("option", {
-      key: option,
-      value: option
-    }, intl.formatMessage({
-      id: `monacoEditorPerferenceForm.displaying.item.renderWhiteSpace.value.${option}`
-    })))));
+    }, preferences.MONACO_EDITOR_RENDER_WHITESPACE_OPTIONS.map(function (option) {
+      return React__default["default"].createElement("option", {
+        key: option,
+        value: option
+      }, intl.formatMessage({
+        id: "monacoEditorPerferenceForm.displaying.item.renderWhiteSpace.value.".concat(option)
+      }));
+    })));
   };
   /**
    * appearance > minimap
    */
-
-
-  const renderPreferenceItemMinimap = () => {
+  var renderPreferenceItemMinimap = function renderPreferenceItemMinimap() {
     var _a;
-
     return React__default["default"].createElement(StyledPreferenceBodyItem, null, React__default["default"].createElement(blocks.Text, {
       role: "navy",
       size: "tiny",
@@ -171,7 +172,7 @@ const MonacoEditorPerferenceForm = ({
       id: "monacoEditorPerferenceForm.displaying.item.minimap.name"
     })), React__default["default"].createElement(blocks.AntSwitch, {
       checked: (_a = preference.minimap) === null || _a === void 0 ? void 0 : _a.enabled,
-      onChange: value => {
+      onChange: function onChange(value) {
         updatePreference({
           minimap: {
             enabled: value
@@ -183,9 +184,7 @@ const MonacoEditorPerferenceForm = ({
   /**
    * appearance > cursor smooth caret animation
    */
-
-
-  const renderPreferenceItemCursorSmoothCaretAnimation = () => {
+  var renderPreferenceItemCursorSmoothCaretAnimation = function renderPreferenceItemCursorSmoothCaretAnimation() {
     return React__default["default"].createElement(StyledPreferenceBodyItem, null, React__default["default"].createElement(blocks.Text, {
       role: "navy",
       size: "tiny",
@@ -194,7 +193,7 @@ const MonacoEditorPerferenceForm = ({
       id: "monacoEditorPerferenceForm.displaying.item.cursorSmoothCaretAnimation.name"
     })), React__default["default"].createElement(blocks.AntSwitch, {
       checked: preference.cursorSmoothCaretAnimation,
-      onChange: value => {
+      onChange: function onChange(value) {
         updatePreference({
           cursorSmoothCaretAnimation: value
         });
@@ -204,9 +203,7 @@ const MonacoEditorPerferenceForm = ({
   /**
    * text editing > auto closing brackets
    */
-
-
-  const renderPreferenceItemAutoClosingBrackets = () => {
+  var renderPreferenceItemAutoClosingBrackets = function renderPreferenceItemAutoClosingBrackets() {
     return React__default["default"].createElement(StyledPreferenceBodyItem, null, React__default["default"].createElement(blocks.Text, {
       role: "navy",
       size: "tiny",
@@ -215,7 +212,7 @@ const MonacoEditorPerferenceForm = ({
       id: "monacoEditorPerferenceForm.textEditing.item.autoClosingBrackets.name"
     })), React__default["default"].createElement(blocks.AntSwitch, {
       checked: preference.autoClosingBrackets === 'always',
-      onChange: value => {
+      onChange: function onChange(value) {
         updatePreference({
           autoClosingBrackets: value ? 'always' : 'never'
         });
@@ -225,9 +222,7 @@ const MonacoEditorPerferenceForm = ({
   /**
    * text editing > detect indentation
    */
-
-
-  const renderPreferenceItemDetectIndentation = () => {
+  var renderPreferenceItemDetectIndentation = function renderPreferenceItemDetectIndentation() {
     return React__default["default"].createElement(StyledPreferenceBodyItem, null, React__default["default"].createElement(blocks.Text, {
       role: "navy",
       size: "tiny",
@@ -236,7 +231,7 @@ const MonacoEditorPerferenceForm = ({
       id: "monacoEditorPerferenceForm.textEditing.item.detectIndentation.name"
     })), React__default["default"].createElement(blocks.AntSwitch, {
       checked: preference.detectIndentation,
-      onChange: value => {
+      onChange: function onChange(value) {
         updatePreference({
           detectIndentation: value
         });
@@ -246,9 +241,7 @@ const MonacoEditorPerferenceForm = ({
   /**
    * text editing > tab size
    */
-
-
-  const renderPreferenceItemTabSize = () => {
+  var renderPreferenceItemTabSize = function renderPreferenceItemTabSize() {
     return React__default["default"].createElement(StyledPreferenceBodyItem, null, React__default["default"].createElement(blocks.Text, {
       role: preference.detectIndentation ? 'grey6' : 'info',
       block: true,
@@ -260,20 +253,21 @@ const MonacoEditorPerferenceForm = ({
       size: "small",
       width: "xsmall",
       disabled: preference.detectIndentation,
-      onChange: value => {
+      onChange: function onChange(value) {
         updatePreference({
           tabSize: Number(value)
         });
       }
-    }, preferences.MONACO_EDITOR_PREFERENCE_OPTIONS_TAB_SIZES.map(size => React__default["default"].createElement("option", {
-      key: size,
-      value: size
-    }, size))));
-  }; //
+    }, preferences.MONACO_EDITOR_PREFERENCE_OPTIONS_TAB_SIZES.map(function (size) {
+      return React__default["default"].createElement("option", {
+        key: size,
+        value: size
+      }, size);
+    })));
+  };
+  //
   //
   //
-
-
   return React__default["default"].createElement(React__default["default"].Fragment, null, React__default["default"].createElement(blocks.Text, {
     role: "lightgrey",
     size: "small",
@@ -293,19 +287,18 @@ const MonacoEditorPerferenceForm = ({
   })), React__default["default"].createElement(blocks.Vspace, {
     height: 1
   }), renderPreferenceItemAutoClosingBrackets(), renderPreferenceItemDetectIndentation(), renderPreferenceItemTabSize());
-}; //
+};
 //
 //
-
-
-var MonacoEditorPerference = (props => {
+//
+var MonacoEditorPerference = (function (props) {
   return React__default["default"].createElement(materialSharedUtils.MaterialIntlProvider, {
     locale: props.locale,
     phrases: {
-      en: en,
-      ko: ko
+      en: en["default"],
+      ko: ko["default"]
     }
   }, React__default["default"].createElement(MonacoEditorPerferenceForm, Object.assign({}, props)));
 });
 
-module.exports = MonacoEditorPerference;
+exports["default"] = MonacoEditorPerference;