@elice/material-exercise 1.221228.0 → 1.230111.0-mobexercise.1

package/cjs/components/material-exercise/MaterialExerciseMobile.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { MaterialExerciseCommonProps } from './context';
+declare type PickedMaterialExerciseCommonProps = Pick<MaterialExerciseCommonProps, 'materialExerciseId' | 'exerciseRoomId' | 'readOnlyEditor' | 'onExerciseRoomIdChange' | 'onDefaultExerciseRoomIdSet' | 'onError'>;
+export interface MaterialExerciseMobileProps extends PickedMaterialExerciseCommonProps {
+    filename: string;
+}
+declare const _default: React.VFC<MaterialExerciseMobileProps & import("@elice/material-shared-utils").MaterialCommponentCommonProps>;
+export default _default;

package/cjs/components/material-exercise/MaterialExerciseMobile.js

@@ -0,0 +1,44 @@
+'use strict';
+
+var React = require('react');
+var apiClient = require('@elice/api-client');
+var materialSharedUtils = require('@elice/material-shared-utils');
+var recoil = require('recoil');
+var recoil$1 = require('./context/recoil.js');
+require('./context/context.js');
+require('./context/recoilTypes.js');
+require('./context/subjects.js');
+var ExerciseProvider = require('./context/ExerciseProvider.js');
+var ExerciseFile = require('./exercise-file/ExerciseFile.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+//
+//
+
+/**
+ * Material exercise.
+ */
+
+const MaterialExerciseMobile = ({
+  filename
+}) => {
+  const setExerciseActiveFilename = recoil.useSetRecoilState(recoil$1.exerciseActiveFilenameState);
+  React__default["default"].useEffect(() => setExerciseActiveFilename(filename), // eslint-disable-next-line react-hooks/exhaustive-deps
+  [filename]); //
+  //
+  //
+
+  return React__default["default"].createElement(ExerciseFile, null);
+}; //
+//
+//
+
+
+var MaterialExerciseMobile$1 = materialSharedUtils.withMaterial(props => React__default["default"].createElement(ExerciseProvider, Object.assign({}, props), React__default["default"].createElement(MaterialExerciseMobile, Object.assign({}, props))), apiClient.config.init, {
+  overrideRecoilScope: true
+});
+
+module.exports = MaterialExerciseMobile$1;

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

@@ -1,3 +1,5 @@
 export { default as MaterialExercise } from './MaterialExercise';
 export type { MaterialExerciseProps, MaterialExerciseApis, } from './MaterialExercise';
+export { default as MaterialExerciseMobile } from './MaterialExerciseMobile';
+export type { MaterialExerciseMobileProps } from './MaterialExerciseMobile';
 export type { MaterialExerciseCommonApis, MaterialExerciseCommonApiSendTextToTerminal, MaterialExerciseCommonProps, MaterialExerciseCommonPropExerciseImageEmptyOptions, MaterialExerciseCommonPropOnCodeHelpRequest, MaterialExerciseCommonPropOnDefaultExerciseRoomIdSet, MaterialExerciseCommonPropOnExerciseRoomIdChange, MaterialExerciseCommonPropOnRunningDone, MaterialExerciseCommonPropOnSubmit, MaterialExerciseCommonPropOnError, } from './context/types';

package/cjs/components/shared/monaco-editor/MonacoEditor.d.ts

@@ -15,9 +15,11 @@ declare type MonacoEditorApiGetValueInRange = (from: number, to: number) => stri
 /** Set (overwrite) value to editor. */
 declare type MonacoEditorApiSetValue = (value: string) => void;
 /** Insert value at specific position. */
-declare type MonacoEditorApiInsertValue = (index: number, value: string) => void;
+declare type MonacoEditorApiInsertValue = (offset: number, value: string) => void;
 /** Remove value at specific range. */
 declare type MonacoEditorApiRemoveValue = (from: number, to: number) => void;
+/** Get offset of current cursor position. */
+declare type MonacoEditorApiGetPositionOffset = () => number;
 /** Set selection of editor with specific range. */
 declare type MonacoEditorApiSetSelection = (from: number, to: number) => void;
 /** Scroll editor to specific `scrollTop`. */
@@ -33,6 +35,7 @@ export interface MonacoEditorApis {
     setValue: MonacoEditorApiSetValue;
     insertValue: MonacoEditorApiInsertValue;
     removeValue: MonacoEditorApiRemoveValue;
+    getPositionOffset: MonacoEditorApiGetPositionOffset;
     setSelection: MonacoEditorApiSetSelection;
     scrollTo: MonacoEditorApiScrollTo;
 }

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

@@ -210,7 +210,7 @@ const MonacoEditor = React.forwardRef(({
    */
 
 
-  const insertValue = (index, newValue) => {
+  const insertValue = (offset, newValue) => {
     if (!editor.current) {
       return;
     } // Replace value EOL as LF.
@@ -220,7 +220,7 @@ const MonacoEditor = React.forwardRef(({
     const model = getMonacoModel();
 
     if (model) {
-      const position = model.getPositionAt(index);
+      const position = model.getPositionAt(offset);
       suppress.current = true;
       editor.current.pushUndoStop();
       model.pushEditOperations([], [{
@@ -259,6 +259,23 @@ const MonacoEditor = React.forwardRef(({
       suppress.current = false;
     }
   };
+  /**
+   * Get offset of current cursor position.
+   * @public
+   */
+
+
+  const getPositionOffset = () => {
+    var _a;
+
+    const 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
@@ -363,6 +380,7 @@ const MonacoEditor = React.forwardRef(({
   editorApis.current.setValue = setValue;
   editorApis.current.insertValue = insertValue;
   editorApis.current.removeValue = removeValue;
+  editorApis.current.getPositionOffset = getPositionOffset;
   editorApis.current.setSelection = setSelection;
   editorApis.current.scrollTo = scrollTo;
   React__default["default"].useImperativeHandle(ref, () => editorApis.current, [editorApis]); //

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

@@ -1,6 +1,7 @@
 'use strict';
 
 var React = require('react');
+var utils = require('@elice/utils');
 var ExerciseFileShimmer = require('../exercise-shimmer/ExerciseFileShimmer.js');
 require('../exercise-shimmer/ExerciseFileTabsShimmer.js');
 require('../exercise-shimmer/ExerciseFileTabShimmer.js');
@@ -13,7 +14,13 @@ function _interopNamespaceDefaultOnly (e) { return Object.freeze({ __proto__: nu
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const AsyncMonacoEditor = React__default["default"].lazy(() => Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespaceDefaultOnly(require('./MonacoEditor.js')); }));
+//
+//
+
+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')); })); //
+//
+//
+
 const MonacoEditorLazy = React.forwardRef((props, ref) => {
   return React__default["default"].createElement(React__default["default"].Suspense, {
     fallback: React__default["default"].createElement(ExerciseFileShimmer, null)

package/cjs/components/shared/monaco-editor/MonacoEditorMobile.d.ts

@@ -0,0 +1,3 @@
+import MonacoEditor from './MonacoEditor';
+declare const MonacoEditorMobile: typeof MonacoEditor;
+export default MonacoEditorMobile;

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

@@ -0,0 +1,169 @@
+'use strict';
+
+var React = require('react');
+var reactUse = require('react-use');
+var utils = require('@elice/utils');
+var monaco = require('monaco-editor/esm/vs/editor/editor.api');
+var MonacoEditor = require('./MonacoEditor.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+function _interopNamespace(e) {
+    if (e && e.__esModule) return e;
+    var n = Object.create(null);
+    if (e) {
+        Object.keys(e).forEach(function (k) {
+            if (k !== 'default') {
+                var d = Object.getOwnPropertyDescriptor(e, k);
+                Object.defineProperty(n, k, d.get ? d : {
+                    enumerable: true,
+                    get: function () { return e[k]; }
+                });
+            }
+        });
+    }
+    n["default"] = e;
+    return Object.freeze(n);
+}
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var monaco__namespace = /*#__PURE__*/_interopNamespace(monaco);
+
+//
+//
+
+const MOBILE_EDITOR_PREFERENCE = Object.freeze({
+  autoClosingBrackets: 'always',
+  cursorSmoothCaretAnimation: false,
+  detectIndentation: true,
+  fontSize: 16,
+  minimap: {
+    enabled: false
+  },
+  renderWhitespace: 'all',
+  tabSize: 4,
+  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; //
+//
+//
+
+const MonacoEditorMobile = React.forwardRef((props, ref) => {
+  const editorApiRef = reactUse.useEnsuredForwardedRef(ref);
+  const [preference, setPreference] = React__default["default"].useState(MOBILE_EDITOR_PREFERENCE);
+  /**
+   * Add a button to show keyboard on non-Apple devices.
+   */
+
+  const addKeyboardButtonOverlayWidget = editor => {
+    if (IS_IOS) {
+      return;
+    }
+
+    editor.addOverlayWidget({
+      getId: () => {
+        return 'editor.contrib.ShowKeyboardWidget';
+      },
+      getDomNode: () => {
+        const domNode = document.createElement('textarea');
+        domNode.className = 'iPadShowKeyboard';
+        domNode.addEventListener('touchstart', () => editor.focus());
+        domNode.addEventListener('focus', () => editor.focus());
+        return domNode;
+      },
+      getPosition: () => {
+        return {
+          preference: monaco__namespace.editor.OverlayWidgetPositionPreference.BOTTOM_RIGHT_CORNER
+        };
+      }
+    });
+  };
+  /**
+   * Export window-level event functions for mobile app.
+   */
+
+
+  const exposeWindowGlobalEvents = editor => {
+    const editorApi = editorApiRef.current;
+
+    if (!editorApi) {
+      return;
+    }
+
+    window.cursorCharLeft = () => {
+      var _a;
+
+      const 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 = () => {
+      var _a;
+
+      const 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 = () => {
+      var _a;
+
+      const 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 = () => {
+      var _a;
+
+      const 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.dispatchChangeInsert = insert => {
+      editorApi.insertValue(editorApi.getPositionOffset(), insert);
+    };
+
+    window.insertTab = () => {
+      const model = editorApi.getMonacoModel();
+
+      if (model) {
+        const modelOptions = model.getOptions();
+        editorApi.insertValue(editorApi.getPositionOffset(), modelOptions.insertSpaces ? ' '.repeat(modelOptions.tabSize) : '\t');
+      }
+    };
+  };
+  /**
+   *
+   */
+
+
+  const handleLoad = editor => {
+    if (typeof props.onLoad === 'function') {
+      props.onLoad(editor);
+    }
+
+    addKeyboardButtonOverlayWidget(editor);
+    exposeWindowGlobalEvents(editor);
+    editor.onDidChangeModelContent(() => {
+      utils.FlutterApp.onDidChangeContent();
+    });
+  }; //
+  //
+  //
+
+
+  return React__default["default"].createElement(MonacoEditor, Object.assign({}, props, {
+    noLanguageIntellisense: true,
+    preference: preference,
+    onLoad: handleLoad,
+    ref: editorApiRef
+  }));
+});
+
+module.exports = MonacoEditorMobile;

package/cjs/index.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var MaterialExercise = require('./components/material-exercise/MaterialExercise.js');
+var MaterialExerciseMobile = require('./components/material-exercise/MaterialExerciseMobile.js');
 var MonacoEditorLazy = require('./components/shared/monaco-editor/MonacoEditorLazy.js');
 var MonacoEditorPerferenceForm = require('./components/shared/monaco-editor/MonacoEditorPerferenceForm.js');
 var monacoLanguage = require('./components/shared/monaco-editor/utils/monacoLanguage.js');
@@ -13,6 +14,7 @@ var preferences = require('./components/shared/monaco-editor/constants/monaco/pr
 
 
 exports.MaterialExercise = MaterialExercise;
+exports.MaterialExerciseMobile = MaterialExerciseMobile;
 exports.MonacoEditorLazy = MonacoEditorLazy;
 exports.MonacoEditorPerference = MonacoEditorPerferenceForm;
 exports.getLanguageFromFilename = monacoLanguage.getLanguageFromFilename;

package/es/components/material-exercise/MaterialExerciseMobile.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { MaterialExerciseCommonProps } from './context';
+declare type PickedMaterialExerciseCommonProps = Pick<MaterialExerciseCommonProps, 'materialExerciseId' | 'exerciseRoomId' | 'readOnlyEditor' | 'onExerciseRoomIdChange' | 'onDefaultExerciseRoomIdSet' | 'onError'>;
+export interface MaterialExerciseMobileProps extends PickedMaterialExerciseCommonProps {
+    filename: string;
+}
+declare const _default: React.VFC<MaterialExerciseMobileProps & import("@elice/material-shared-utils").MaterialCommponentCommonProps>;
+export default _default;

package/es/components/material-exercise/MaterialExerciseMobile.js

@@ -0,0 +1,38 @@
+import React from 'react';
+import { config } from '@elice/api-client';
+import { withMaterial } from '@elice/material-shared-utils';
+import { useSetRecoilState } from 'recoil';
+import { exerciseActiveFilenameState } from './context/recoil.js';
+import './context/context.js';
+import './context/recoilTypes.js';
+import './context/subjects.js';
+import ExerciseProvider from './context/ExerciseProvider.js';
+import ExerciseFile from './exercise-file/ExerciseFile.js';
+
+//
+//
+
+/**
+ * Material exercise.
+ */
+
+const MaterialExerciseMobile = ({
+  filename
+}) => {
+  const setExerciseActiveFilename = useSetRecoilState(exerciseActiveFilenameState);
+  React.useEffect(() => setExerciseActiveFilename(filename), // eslint-disable-next-line react-hooks/exhaustive-deps
+  [filename]); //
+  //
+  //
+
+  return React.createElement(ExerciseFile, null);
+}; //
+//
+//
+
+
+var MaterialExerciseMobile$1 = withMaterial(props => React.createElement(ExerciseProvider, Object.assign({}, props), React.createElement(MaterialExerciseMobile, Object.assign({}, props))), config.init, {
+  overrideRecoilScope: true
+});
+
+export { MaterialExerciseMobile$1 as default };

package/es/components/material-exercise/index.d.ts

@@ -1,3 +1,5 @@
 export { default as MaterialExercise } from './MaterialExercise';
 export type { MaterialExerciseProps, MaterialExerciseApis, } from './MaterialExercise';
+export { default as MaterialExerciseMobile } from './MaterialExerciseMobile';
+export type { MaterialExerciseMobileProps } from './MaterialExerciseMobile';
 export type { MaterialExerciseCommonApis, MaterialExerciseCommonApiSendTextToTerminal, MaterialExerciseCommonProps, MaterialExerciseCommonPropExerciseImageEmptyOptions, MaterialExerciseCommonPropOnCodeHelpRequest, MaterialExerciseCommonPropOnDefaultExerciseRoomIdSet, MaterialExerciseCommonPropOnExerciseRoomIdChange, MaterialExerciseCommonPropOnRunningDone, MaterialExerciseCommonPropOnSubmit, MaterialExerciseCommonPropOnError, } from './context/types';

package/es/components/shared/monaco-editor/MonacoEditor.d.ts

@@ -15,9 +15,11 @@ declare type MonacoEditorApiGetValueInRange = (from: number, to: number) => stri
 /** Set (overwrite) value to editor. */
 declare type MonacoEditorApiSetValue = (value: string) => void;
 /** Insert value at specific position. */
-declare type MonacoEditorApiInsertValue = (index: number, value: string) => void;
+declare type MonacoEditorApiInsertValue = (offset: number, value: string) => void;
 /** Remove value at specific range. */
 declare type MonacoEditorApiRemoveValue = (from: number, to: number) => void;
+/** Get offset of current cursor position. */
+declare type MonacoEditorApiGetPositionOffset = () => number;
 /** Set selection of editor with specific range. */
 declare type MonacoEditorApiSetSelection = (from: number, to: number) => void;
 /** Scroll editor to specific `scrollTop`. */
@@ -33,6 +35,7 @@ export interface MonacoEditorApis {
     setValue: MonacoEditorApiSetValue;
     insertValue: MonacoEditorApiInsertValue;
     removeValue: MonacoEditorApiRemoveValue;
+    getPositionOffset: MonacoEditorApiGetPositionOffset;
     setSelection: MonacoEditorApiSetSelection;
     scrollTo: MonacoEditorApiScrollTo;
 }

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

@@ -184,7 +184,7 @@ const MonacoEditor = forwardRef(({
    */
 
 
-  const insertValue = (index, newValue) => {
+  const insertValue = (offset, newValue) => {
     if (!editor.current) {
       return;
     } // Replace value EOL as LF.
@@ -194,7 +194,7 @@ const MonacoEditor = forwardRef(({
     const model = getMonacoModel();
 
     if (model) {
-      const position = model.getPositionAt(index);
+      const position = model.getPositionAt(offset);
       suppress.current = true;
       editor.current.pushUndoStop();
       model.pushEditOperations([], [{
@@ -233,6 +233,23 @@ const MonacoEditor = forwardRef(({
       suppress.current = false;
     }
   };
+  /**
+   * Get offset of current cursor position.
+   * @public
+   */
+
+
+  const getPositionOffset = () => {
+    var _a;
+
+    const model = getMonacoModel();
+
+    if (!editor.current || !model) {
+      return 0;
+    }
+
+    return model.getOffsetAt((_a = editor.current.getPosition()) !== null && _a !== void 0 ? _a : new monaco.Position(0, 0));
+  };
   /**
    * Set selection of editor with specific range.
    * @public
@@ -337,6 +354,7 @@ const MonacoEditor = forwardRef(({
   editorApis.current.setValue = setValue;
   editorApis.current.insertValue = insertValue;
   editorApis.current.removeValue = removeValue;
+  editorApis.current.getPositionOffset = getPositionOffset;
   editorApis.current.setSelection = setSelection;
   editorApis.current.scrollTo = scrollTo;
   React.useImperativeHandle(ref, () => editorApis.current, [editorApis]); //

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

@@ -1,11 +1,18 @@
 import React, { forwardRef } from 'react';
+import { FlutterApp } from '@elice/utils';
 import ExerciseFileShimmer from '../exercise-shimmer/ExerciseFileShimmer.js';
 import '../exercise-shimmer/ExerciseFileTabsShimmer.js';
 import '../exercise-shimmer/ExerciseFileTabShimmer.js';
 import '../exercise-shimmer/ExerciseFileTreeListShimmer.js';
 import '../exercise-shimmer/ExerciseFileTreeListItemShimmer.js';
 
-const AsyncMonacoEditor = React.lazy(() => import('./MonacoEditor.js'));
+//
+//
+
+const AsyncMonacoEditor = React.lazy(() => FlutterApp.checkWebview() ? import('./MonacoEditorMobile.js') : import('./MonacoEditor.js')); //
+//
+//
+
 const MonacoEditorLazy = forwardRef((props, ref) => {
   return React.createElement(React.Suspense, {
     fallback: React.createElement(ExerciseFileShimmer, null)

package/es/components/shared/monaco-editor/MonacoEditorMobile.d.ts

@@ -0,0 +1,3 @@
+import MonacoEditor from './MonacoEditor';
+declare const MonacoEditorMobile: typeof MonacoEditor;
+export default MonacoEditorMobile;

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

@@ -0,0 +1,144 @@
+import React, { forwardRef } from 'react';
+import { useEnsuredForwardedRef } from 'react-use';
+import { FlutterApp } from '@elice/utils';
+import * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
+import MonacoEditor from './MonacoEditor.js';
+
+//
+//
+
+const MOBILE_EDITOR_PREFERENCE = Object.freeze({
+  autoClosingBrackets: 'always',
+  cursorSmoothCaretAnimation: false,
+  detectIndentation: true,
+  fontSize: 16,
+  minimap: {
+    enabled: false
+  },
+  renderWhitespace: 'all',
+  tabSize: 4,
+  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; //
+//
+//
+
+const MonacoEditorMobile = forwardRef((props, ref) => {
+  const editorApiRef = useEnsuredForwardedRef(ref);
+  const [preference, setPreference] = React.useState(MOBILE_EDITOR_PREFERENCE);
+  /**
+   * Add a button to show keyboard on non-Apple devices.
+   */
+
+  const addKeyboardButtonOverlayWidget = editor => {
+    if (IS_IOS) {
+      return;
+    }
+
+    editor.addOverlayWidget({
+      getId: () => {
+        return 'editor.contrib.ShowKeyboardWidget';
+      },
+      getDomNode: () => {
+        const domNode = document.createElement('textarea');
+        domNode.className = 'iPadShowKeyboard';
+        domNode.addEventListener('touchstart', () => editor.focus());
+        domNode.addEventListener('focus', () => editor.focus());
+        return domNode;
+      },
+      getPosition: () => {
+        return {
+          preference: monaco.editor.OverlayWidgetPositionPreference.BOTTOM_RIGHT_CORNER
+        };
+      }
+    });
+  };
+  /**
+   * Export window-level event functions for mobile app.
+   */
+
+
+  const exposeWindowGlobalEvents = editor => {
+    const editorApi = editorApiRef.current;
+
+    if (!editorApi) {
+      return;
+    }
+
+    window.cursorCharLeft = () => {
+      var _a;
+
+      const pos = (_a = editor.getPosition()) !== null && _a !== void 0 ? _a : new monaco.Position(0, 0);
+      editor.setPosition(new monaco.Position(pos.lineNumber, pos.column - 1));
+    };
+
+    window.cursorCharRight = () => {
+      var _a;
+
+      const pos = (_a = editor.getPosition()) !== null && _a !== void 0 ? _a : new monaco.Position(0, 0);
+      editor.setPosition(new monaco.Position(pos.lineNumber, pos.column + 1));
+    };
+
+    window.cursorLineUp = () => {
+      var _a;
+
+      const pos = (_a = editor.getPosition()) !== null && _a !== void 0 ? _a : new monaco.Position(0, 0);
+      editor.setPosition(new monaco.Position(pos.lineNumber - 1, pos.column));
+    };
+
+    window.cursorLineDown = () => {
+      var _a;
+
+      const pos = (_a = editor.getPosition()) !== null && _a !== void 0 ? _a : new monaco.Position(0, 0);
+      editor.setPosition(new monaco.Position(pos.lineNumber + 1, pos.column));
+    };
+
+    window.dispatchReconfigureFontSize = fontSize => {
+      setPreference(prev => Object.assign(Object.assign({}, prev), {
+        fontSize
+      }));
+    };
+
+    window.dispatchChangeInsert = insert => {
+      editorApi.insertValue(editorApi.getPositionOffset(), insert);
+    };
+
+    window.insertTab = () => {
+      const model = editorApi.getMonacoModel();
+
+      if (model) {
+        const modelOptions = model.getOptions();
+        editorApi.insertValue(editorApi.getPositionOffset(), modelOptions.insertSpaces ? ' '.repeat(modelOptions.tabSize) : '\t');
+      }
+    };
+  };
+  /**
+   *
+   */
+
+
+  const handleLoad = editor => {
+    if (typeof props.onLoad === 'function') {
+      props.onLoad(editor);
+    }
+
+    addKeyboardButtonOverlayWidget(editor);
+    exposeWindowGlobalEvents(editor);
+    editor.onDidChangeModelContent(() => {
+      FlutterApp.onDidChangeContent();
+    });
+  }; //
+  //
+  //
+
+
+  return React.createElement(MonacoEditor, Object.assign({}, props, {
+    noLanguageIntellisense: true,
+    preference: preference,
+    onLoad: handleLoad,
+    ref: editorApiRef
+  }));
+});
+
+export { MonacoEditorMobile as default };

package/es/index.js

@@ -1,4 +1,5 @@
 export { default as MaterialExercise } from './components/material-exercise/MaterialExercise.js';
+export { default as MaterialExerciseMobile } from './components/material-exercise/MaterialExerciseMobile.js';
 export { default as MonacoEditorLazy } from './components/shared/monaco-editor/MonacoEditorLazy.js';
 export { default as MonacoEditorPerference } from './components/shared/monaco-editor/MonacoEditorPerferenceForm.js';
 export { getLanguageFromFilename } from './components/shared/monaco-editor/utils/monacoLanguage.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elice/material-exercise",
-  "version": "1.221228.0",
+  "version": "1.230111.0-mobexercise.1",
   "description": "User view and editing components of Elice material exercise",
   "repository": "https://git.elicer.io/elice/frontend/library/elice-material",
   "license": "UNLICENSED",
@@ -46,25 +46,6 @@
     "recoil": "^0.6.1",
     "styled-components": "^5.2.0"
   },
-  "optionalDependencies": {
-    "@codemirror/basic-setup": "^0.19.1",
-    "@codemirror/commands": "^0.19.8",
-    "@codemirror/highlight": "^0.19.7",
-    "@codemirror/lang-cpp": "^0.19.1",
-    "@codemirror/lang-css": "^0.19.3",
-    "@codemirror/lang-html": "^0.19.4",
-    "@codemirror/lang-java": "^0.19.1",
-    "@codemirror/lang-javascript": "^0.19.7",
-    "@codemirror/lang-json": "^0.19.2",
-    "@codemirror/lang-markdown": "^0.19.6",
-    "@codemirror/lang-python": "^0.19.4",
-    "@codemirror/lang-rust": "^0.19.2",
-    "@codemirror/lang-sql": "^0.19.4",
-    "@codemirror/lang-xml": "^0.19.2",
-    "@codemirror/state": "^0.19.9",
-    "@codemirror/text": "^0.19.6",
-    "@codemirror/view": "^0.19.47"
-  },
   "dependencies": {
     "@novnc/novnc": "^1.3.0",
     "@nteract/notebook-preview": "^11.0.4-alpha.0",
@@ -93,30 +74,13 @@
     "xterm-addon-fit": "^0.5.0"
   },
   "devDependencies": {
-    "@codemirror/basic-setup": "^0.19.1",
-    "@codemirror/commands": "^0.19.8",
-    "@codemirror/highlight": "^0.19.7",
-    "@codemirror/lang-cpp": "^0.19.1",
-    "@codemirror/lang-css": "^0.19.3",
-    "@codemirror/lang-html": "^0.19.4",
-    "@codemirror/lang-java": "^0.19.1",
-    "@codemirror/lang-javascript": "^0.19.7",
-    "@codemirror/lang-json": "^0.19.2",
-    "@codemirror/lang-markdown": "^0.19.6",
-    "@codemirror/lang-python": "^0.19.4",
-    "@codemirror/lang-rust": "^0.19.2",
-    "@codemirror/lang-sql": "^0.19.4",
-    "@codemirror/lang-xml": "^0.19.2",
-    "@codemirror/state": "^0.19.9",
-    "@codemirror/text": "^0.19.6",
-    "@codemirror/view": "^0.19.47",
     "@elice/api-client": "1.221217.0",
     "@elice/blocks": "^1.220803.0",
     "@elice/design-tokens": "^1.220803.0",
     "@elice/icons": "^1.220803.0",
     "@elice/markdown": "^1.220803.0",
-    "@elice/material-shared-types": "1.221228.0",
-    "@elice/material-shared-utils": "1.221228.0",
+    "@elice/material-shared-types": "1.230111.0-mobexercise.1",
+    "@elice/material-shared-utils": "1.230111.0-mobexercise.1",
     "@elice/types": "1.221217.0",
     "@elice/websocket": "^1.220803.0",
     "@types/classnames": "^2.3.1",
@@ -138,5 +102,5 @@
     "recoil": "^0.6.1",
     "styled-components": "^5.2.0"
   },
-  "gitHead": "53eaff58a939c390104c7e96f0bc3eb8738a3ee7"
+  "gitHead": "8d7bcbe80aecd631228336b1ab73bfc4d2c751cb"
 }

package/cjs/components/material-exercise/exercise-file-editor/ExerciseMobileFileEditor.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-export interface ExerciseMobileFileEditorProps {
-    exerciseImageId: number;
-    exerciseRoomId: number;
-    filename: string;
-}
-declare const ExerciseMobileFileEditor: React.FC<ExerciseMobileFileEditorProps>;
-export default ExerciseMobileFileEditor;

package/es/components/material-exercise/exercise-file-editor/ExerciseMobileFileEditor.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-export interface ExerciseMobileFileEditorProps {
-    exerciseImageId: number;
-    exerciseRoomId: number;
-    filename: string;
-}
-declare const ExerciseMobileFileEditor: React.FC<ExerciseMobileFileEditorProps>;
-export default ExerciseMobileFileEditor;