@elice/material-exercise 1.230328.0 → 1.230418.0

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

@@ -1,5 +1,8 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var designTokens = require('@elice/design-tokens');
 var monaco = require('monaco-editor/esm/vs/editor/editor.api');
@@ -41,120 +44,109 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var monaco__namespace = /*#__PURE__*/_interopNamespace(monaco);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
+//
 //
 //
 // pre-init monaco editor
-
-index();
-index$1().catch(console.warn); //
+index["default"]();
+index$1["default"]().catch(console.warn);
 //
 //
-
-const StyledMonacoEditorWrapper = styled__default["default"].div.withConfig({
+//
+var StyledMonacoEditorWrapper = styled__default["default"].div.withConfig({
   componentId: "sc-1j3uyex-0"
 })(["width:100%;height:100%;"]);
-const StyledMonacoEditor = styled__default["default"].div.withConfig({
+var StyledMonacoEditor = styled__default["default"].div.withConfig({
   componentId: "sc-1j3uyex-1"
 })(["width:100%;height:100%;background-color:", ";", ""], designTokens.base.color.navy9, styles.cssRemoteMarker);
 /**
  *
  */
-
-const MonacoEditor = React.forwardRef(({
-  defaultValue = '',
-  filename = '/noname.txt',
-  preference = preferences.DEFAULT_MONACO_EDITOR_PREFERENCE,
-  markers = [],
-  width = '100%',
-  height = '100%',
-  noLanguageIntellisense = false,
-  onLoad,
-  onChange,
-  onSave,
-  onCursor,
-  onScroll,
-  onThemeChange
-}, ref) => {
+var MonacoEditor = React.forwardRef(function (_ref, ref) {
+  var _ref$defaultValue = _ref.defaultValue,
+    defaultValue = _ref$defaultValue === void 0 ? '' : _ref$defaultValue,
+    _ref$filename = _ref.filename,
+    filename = _ref$filename === void 0 ? '/noname.txt' : _ref$filename,
+    _ref$preference = _ref.preference,
+    preference = _ref$preference === void 0 ? preferences.DEFAULT_MONACO_EDITOR_PREFERENCE : _ref$preference,
+    _ref$markers = _ref.markers,
+    markers = _ref$markers === void 0 ? [] : _ref$markers,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? '100%' : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? '100%' : _ref$height,
+    _ref$noLanguageIntell = _ref.noLanguageIntellisense,
+    noLanguageIntellisense = _ref$noLanguageIntell === void 0 ? false : _ref$noLanguageIntell,
+    onLoad = _ref.onLoad,
+    onChange = _ref.onChange,
+    onSave = _ref.onSave,
+    onCursor = _ref.onCursor,
+    onScroll = _ref.onScroll,
+    onThemeChange = _ref.onThemeChange;
   /** Ref of element which wraps editor. */
-  const editorElRef = React__default["default"].useRef(null);
+  var editorElRef = React__default["default"].useRef(null);
   /** Ref of editor exposed APIs. */
-
-  const editorApis = React__default["default"].useRef({});
+  var editorApis = React__default["default"].useRef({});
   /** Ref of monaco editor. */
-
-  const editor = React__default["default"].useRef(null);
+  var editor = React__default["default"].useRef(null);
   /** Editor options. */
-
-  const editorOptions = useEditorOptions.useEditorOptions({
-    width,
-    height,
-    preference,
-    noLanguageIntellisense
+  var editorOptions = useEditorOptions.useEditorOptions({
+    width: width,
+    height: height,
+    preference: preference,
+    noLanguageIntellisense: noLanguageIntellisense
   });
   /** Ref for preventing change event. */
-
-  const suppress = React__default["default"].useRef(false);
+  var suppress = React__default["default"].useRef(false);
   /** Is editor ready? */
-
-  const [isReady, setReady] = React__default["default"].useState(false);
+  var _React$useState = React__default["default"].useState(false),
+    _React$useState2 = _rollupPluginBabelHelpers.slicedToArray(_React$useState, 2),
+    isReady = _React$useState2[0],
+    setReady = _React$useState2[1];
   /**
    * Get model of editor.
    */
-
-  const getMonacoModel = () => {
-    const uri = monaco__namespace.Uri.file(filename || '/noname.txt');
+  var getMonacoModel = function getMonacoModel() {
+    var uri = monaco__namespace.Uri.file(filename || '/noname.txt');
     return monaco__namespace.editor.getModel(uri);
   };
   /**
    * Has editor undo/redo history?
    * @public
    */
-
-
-  const hasHistory = () => {
+  var hasHistory = function hasHistory() {
     var _a;
-
     return (((_a = getMonacoModel()) === null || _a === void 0 ? void 0 : _a.getAlternativeVersionId()) || 0) > 1;
   };
   /**
    * Clear editor undo/redo history.
    * @public
    */
-
-
-  const clearHistory = () => {
+  var clearHistory = function clearHistory() {
     getMonacoModel();
   };
   /**
    * Get current value of editor.
    * @public
    */
-
-
-  const getValue = () => {
+  var getValue = function getValue() {
     var _a;
-
     return ((_a = getMonacoModel()) === null || _a === void 0 ? void 0 : _a.getValue()) || '';
   };
   /**
    * Get value in range of editor.
    * @public
    */
-
-
-  const getValueInRange = (from, to) => {
-    const model = getMonacoModel();
-
+  var getValueInRange = function getValueInRange(from, to) {
+    var model = getMonacoModel();
     if (!model) {
       return '';
     }
-
     if (from === to) {
       return '';
     }
-
-    const startPosition = model.getPositionAt(from);
-    const endPosition = model.getPositionAt(to);
+    var startPosition = model.getPositionAt(from);
+    var endPosition = model.getPositionAt(to);
     return model.getValueInRange({
       startLineNumber: startPosition.lineNumber,
       startColumn: startPosition.column,
@@ -166,22 +158,18 @@ const MonacoEditor = React.forwardRef(({
    * Set (overwrite) value to editor.
    * @public
    */
-
-
-  const setValue = newValue => {
+  var setValue = function setValue(newValue) {
     if (!editor.current) {
       return;
-    } // Replace value EOL as LF.
-
-
+    }
+    // Replace value EOL as LF.
     newValue = newValue.replace(/\r\n/g, '\n');
-    const uri = monaco__namespace.Uri.file(filename || '/noname.txt');
-    const model = monaco__namespace.editor.getModel(uri);
-
+    var uri = monaco__namespace.Uri.file(filename || '/noname.txt');
+    var model = monaco__namespace.editor.getModel(uri);
     if (model && !model.isDisposed()) {
       // Override EOL as LF to prevent error at Windows env.
-      model.setEOL(monaco__namespace.editor.EndOfLineSequence.LF); // Overwirte current whole value with new one.
-
+      model.setEOL(monaco__namespace.editor.EndOfLineSequence.LF);
+      // Overwirte current whole value with new one.
       if (typeof newValue === 'string') {
         suppress.current = true;
         editor.current.pushUndoStop();
@@ -189,17 +177,20 @@ const MonacoEditor = React.forwardRef(({
           range: model.getFullModelRange(),
           text: newValue,
           forceMoveMarkers: true
-        }], () => null);
+        }], function () {
+          return null;
+        });
         editor.current.pushUndoStop();
         suppress.current = false;
         editor.current.setModel(model);
         editor.current.focus();
       }
-    } // If model has not created yet for this file,
+    }
+    // If model has not created yet for this file,
     // create new model.
     else {
-      const lang = monacoLanguage.getLanguageFromFilename(filename);
-      const newModel = monaco__namespace.editor.createModel(newValue, lang, uri);
+      var lang = monacoLanguage.getLanguageFromFilename(filename);
+      var newModel = monaco__namespace.editor.createModel(newValue, lang, uri);
       newModel.setEOL(monaco__namespace.editor.EndOfLineSequence.LF);
       editor.current.setModel(newModel);
     }
@@ -208,26 +199,24 @@ const MonacoEditor = React.forwardRef(({
    * Insert value at specific position.
    * @public
    */
-
-
-  const insertValue = (offset, newValue) => {
+  var insertValue = function insertValue(offset, newValue) {
     if (!editor.current) {
       return;
-    } // Replace value EOL as LF.
-
-
+    }
+    // Replace value EOL as LF.
     newValue = newValue.replace(/\r\n/g, '\n');
-    const model = getMonacoModel();
-
+    var model = getMonacoModel();
     if (model) {
-      const position = model.getPositionAt(offset);
+      var position = model.getPositionAt(offset);
       suppress.current = true;
       editor.current.pushUndoStop();
       model.pushEditOperations([], [{
         range: new monaco__namespace.Range(position.lineNumber, position.column, position.lineNumber, position.column),
         text: newValue,
         forceMoveMarkers: true
-      }], () => null);
+      }], function () {
+        return null;
+      });
       editor.current.pushUndoStop();
       suppress.current = false;
     }
@@ -236,25 +225,23 @@ const MonacoEditor = React.forwardRef(({
    * Remove value at specific range.
    * @public
    */
-
-
-  const removeValue = (from, to) => {
+  var removeValue = function removeValue(from, to) {
     if (!editor.current) {
       return;
     }
-
-    const model = getMonacoModel();
-
+    var model = getMonacoModel();
     if (model) {
-      const startPosition = model.getPositionAt(from);
-      const endPosition = model.getPositionAt(to);
+      var startPosition = model.getPositionAt(from);
+      var endPosition = model.getPositionAt(to);
       suppress.current = true;
       editor.current.pushUndoStop();
       model.pushEditOperations([], [{
         range: new monaco__namespace.Range(startPosition.lineNumber, startPosition.column, endPosition.lineNumber, endPosition.column),
         text: '',
         forceMoveMarkers: true
-      }], () => null);
+      }], function () {
+        return null;
+      });
       editor.current.pushUndoStop();
       suppress.current = false;
     }
@@ -263,33 +250,24 @@ const MonacoEditor = React.forwardRef(({
    * Get offset of current cursor position.
    * @public
    */
-
-
-  const getPositionOffset = () => {
+  var getPositionOffset = function getPositionOffset() {
     var _a;
-
-    const model = getMonacoModel();
-
+    var model = getMonacoModel();
     if (!editor.current || !model) {
       return 0;
     }
-
     return model.getOffsetAt((_a = editor.current.getPosition()) !== null && _a !== void 0 ? _a : new monaco__namespace.Position(0, 0));
   };
   /**
    * Set selection of editor with specific range.
    * @public
    */
-
-
-  const setSelection = (from, to) => {
+  var setSelection = function setSelection(from, to) {
     var _a;
-
-    const model = getMonacoModel();
-
+    var model = getMonacoModel();
     if (model) {
-      const markerStartPosition = model.getPositionAt(from);
-      const markerEndPosition = model.getPositionAt(to);
+      var markerStartPosition = model.getPositionAt(from);
+      var markerEndPosition = model.getPositionAt(to);
       (_a = editor.current) === null || _a === void 0 ? void 0 : _a.setSelection(new monaco__namespace.Range(markerStartPosition.lineNumber, markerStartPosition.column, markerEndPosition.lineNumber, markerEndPosition.column));
     }
   };
@@ -297,80 +275,74 @@ const MonacoEditor = React.forwardRef(({
    * Scroll editor to specific `scrollTop`.
    * @public
    */
-
-
-  const scrollTo = scrollTop => {
+  var scrollTo = function scrollTo(scrollTop) {
     var _a;
-
     (_a = editor.current) === null || _a === void 0 ? void 0 : _a.setScrollTop(scrollTop);
-  }; //
+  };
+  //
   // Editor hooks.
   //
-
-
   useMonacoOptions.useMonacoOptions(editor, editorOptions);
   useMonacoTheme.useMonacoTheme(preference.theme, onThemeChange);
   useMonacoEventChange.useMonacoEventChange(editor, onChange, suppress, [isReady]);
   useMonacoEventCursor.useMonacoEventCursor(editor, onCursor, [isReady]);
   useMonacoEventScroll.useMonacoEventScroll(editor, onScroll, [isReady]);
-  const remoteMarker = useMonacoMarkers.useMonacoMarkers(editor, markers); //
+  var remoteMarker = useMonacoMarkers.useMonacoMarkers(editor, markers);
+  //
   // Init and dispose editor.
   //
-
-  React__default["default"].useEffect(() => {
+  React__default["default"].useEffect(function () {
     try {
       if (!editorElRef.current) {
         return;
-      } // create monaco editor instance and render it.
-
-
+      }
+      // create monaco editor instance and render it.
       editor.current = monaco__namespace.editor.create(editorElRef.current, Object.assign(Object.assign({}, editorOptions), {
         value: defaultValue,
         language: monacoLanguage.getLanguageFromFilename(filename)
-      })); // add keyboard shortcut.
-
-      editor.current.addCommand(monaco__namespace.KeyMod.CtrlCmd | monaco__namespace.KeyCode.KeyS, () => {
+      }));
+      // add keyboard shortcut.
+      editor.current.addCommand(monaco__namespace.KeyMod.CtrlCmd | monaco__namespace.KeyCode.KeyS, function () {
         var _a, _b, _c;
-
         (_b = (_a = editor.current) === null || _a === void 0 ? void 0 : _a.getAction('editor.action.formatDocument')) === null || _b === void 0 ? void 0 : _b.run();
-
         if (typeof onSave === 'function') {
-          const content = ((_c = getMonacoModel()) === null || _c === void 0 ? void 0 : _c.getValue()) || '';
+          var content = ((_c = getMonacoModel()) === null || _c === void 0 ? void 0 : _c.getValue()) || '';
           onSave(content);
         }
       });
-      remoteMarker.init(); // emit on load event.
-
+      remoteMarker.init();
+      // emit on load event.
       if (typeof onLoad === 'function') {
         onLoad(editor.current);
       }
-
       setReady(true);
     } catch (_) {
       setReady(false);
     }
-
-    return () => {
+    return function () {
       var _a;
-
-      setReady(false); // dispose remote marker
-
-      remoteMarker.dispose(); // dispose editor
-
+      setReady(false);
+      // dispose remote marker
+      remoteMarker.dispose();
+      // dispose editor
       if (typeof ((_a = editor.current) === null || _a === void 0 ? void 0 : _a.dispose) === 'function') {
         editor.current.dispose();
       }
     };
-  }, // eslint-disable-next-line react-hooks/exhaustive-deps
-  []); //
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  []);
+  //
   // Set value whenevet filename or value changed.
   //
-
-  React__default["default"].useEffect(() => setValue(defaultValue), // eslint-disable-next-line react-hooks/exhaustive-deps
-  [filename, defaultValue]); //
+  React__default["default"].useEffect(function () {
+    return setValue(defaultValue);
+  },
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  [filename, defaultValue]);
+  //
   //
   //
-
   editorApis.current.editor = editor.current;
   editorApis.current.getMonacoModel = getMonacoModel;
   editorApis.current.hasHistory = hasHistory;
@@ -383,17 +355,19 @@ const MonacoEditor = React.forwardRef(({
   editorApis.current.getPositionOffset = getPositionOffset;
   editorApis.current.setSelection = setSelection;
   editorApis.current.scrollTo = scrollTo;
-  React__default["default"].useImperativeHandle(ref, () => editorApis.current, [editorApis]); //
+  React__default["default"].useImperativeHandle(ref, function () {
+    return editorApis.current;
+  }, [editorApis]);
+  //
   //
   //
-
   return React__default["default"].createElement(StyledMonacoEditorWrapper, null, React__default["default"].createElement(StyledMonacoEditor, {
     style: {
-      width,
-      height
+      width: width,
+      height: height
     },
     ref: editorElRef
   }));
 });
 
-module.exports = MonacoEditor;
+exports["default"] = MonacoEditor;

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

@@ -1,5 +1,7 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
 var React = require('react');
 var utils = require('@elice/utils');
 var ExerciseFileShimmer = require('../exercise-shimmer/ExerciseFileShimmer.js');
@@ -10,23 +12,23 @@ require('../exercise-shimmer/ExerciseFileTreeListItemShimmer.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-function _interopNamespaceDefaultOnly (e) { return Object.freeze({ __proto__: null, 'default': e }); }
-
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 //
 //
-
-const AsyncMonacoEditor = React__default["default"].lazy(() => utils.FlutterApp.checkWebview() ? Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespaceDefaultOnly(require('./MonacoEditorMobile.js')); }) : Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespaceDefaultOnly(require('./MonacoEditor.js')); })); //
 //
+var AsyncMonacoEditor = React__default["default"].lazy(function () {
+  return utils.FlutterApp.checkWebview() ? Promise.resolve().then(function () { return require('./MonacoEditorMobile.js'); }) : Promise.resolve().then(function () { return require('./MonacoEditor.js'); });
+});
 //
-
-const MonacoEditorLazy = React.forwardRef((props, ref) => {
+//
+//
+var MonacoEditorLazy = React.forwardRef(function (props, ref) {
   return React__default["default"].createElement(React__default["default"].Suspense, {
-    fallback: React__default["default"].createElement(ExerciseFileShimmer, null)
+    fallback: React__default["default"].createElement(ExerciseFileShimmer["default"], null)
   }, React__default["default"].createElement(AsyncMonacoEditor, Object.assign({}, props, {
     ref: ref
   })));
 });
 
-module.exports = MonacoEditorLazy;
+exports["default"] = MonacoEditorLazy;