@uiw/react-codemirror - npm Package Compare versions

Comparing version 1.0.18 to 1.0.19

lib/CodeMirror.js

@@ -1,47 +0,46 @@
-'use strict';
+"use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.default = void 0;
 
-var _regenerator = require('babel-runtime/regenerator');
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 
-var _regenerator2 = _interopRequireDefault(_regenerator);
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 
-var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 
-var _codemirror = require('codemirror');
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 
-var _codemirror2 = _interopRequireDefault(_codemirror);
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 
-require('codemirror/mode/meta');
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 
-var _react = require('react');
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 
-var _react2 = _interopRequireDefault(_react);
+var _codemirror = _interopRequireDefault(require("codemirror"));
 
-var _propTypes = require('prop-types');
+require("codemirror/mode/meta");
 
-var _propTypes2 = _interopRequireDefault(_propTypes);
+var _react = _interopRequireWildcard(require("react"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
-function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { step("next", value); }, function (err) { step("throw", err); }); } } return step("next"); }); }; }
+var ReactCodeMirror =
+/*#__PURE__*/
+function (_Component) {
+  (0, _inherits2.default)(ReactCodeMirror, _Component);
 
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
-var ReactCodeMirror = function (_Component) {
-  _inherits(ReactCodeMirror, _Component);
-
   function ReactCodeMirror(props) {
-    _classCallCheck(this, ReactCodeMirror);
+    var _this;
 
-    var _this = _possibleConstructorReturn(this, (ReactCodeMirror.__proto__ || Object.getPrototypeOf(ReactCodeMirror)).call(this, props));
-
+    (0, _classCallCheck2.default)(this, ReactCodeMirror);
+    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(ReactCodeMirror).call(this, props));
     _this.codemirror = null;
@@ -52,4 +51,4 @@ _this.editor = null;
 
-  _createClass(ReactCodeMirror, [{
-    key: 'componentDidMount',
+  (0, _createClass2.default)(ReactCodeMirror, [{
+    key: "componentDidMount",
     value: function componentDidMount() {
@@ -59,3 +58,3 @@ this.renderCodeMirror();
   }, {
-    key: 'renderCodeMirror',
+    key: "renderCodeMirror",
     value: function renderCodeMirror() {
@@ -65,18 +64,15 @@ var _this2 = this;
       // 生成codemirror实例
-      this.editor = _codemirror2.default.fromTextArea(this.textarea, this.props.options);
-      // 获取CodeMirror用于获取其中的一些常量
-      this.codemirror = _codemirror2.default;
-      // 事件处理映射
+      this.editor = _codemirror.default.fromTextArea(this.textarea, this.props.options); // 获取CodeMirror用于获取其中的一些常量
+
+      this.codemirror = _codemirror.default; // 事件处理映射
+
       var eventDict = this.getEventHandleFromProps();
-
       Object.keys(eventDict).forEach(function (event) {
         _this2.editor.on(eventDict[event], _this2.props[event]);
       });
+      var _this$props = this.props,
+          value = _this$props.value,
+          width = _this$props.width,
+          height = _this$props.height; // 初始化值
 
-      var _props = this.props,
-          value = _props.value,
-          width = _props.width,
-          height = _props.height;
-      // 初始化值
-
       this.editor.setValue(value || '');
@@ -90,50 +86,74 @@
   }, {
-    key: 'componentWillReceiveProps',
-    value: function componentWillReceiveProps(nextProps) {
-      var val = this.editor.getValue();
-      var next = nextProps.value;
-      if (next !== undefined && next !== this.props.value && next !== val) {
-        this.editor.setValue(nextProps.value);
-      }
-      var options = nextProps.options,
-          width = nextProps.width,
-          height = nextProps.height;
+    key: "componentWillReceiveProps",
+    value: function () {
+      var _componentWillReceiveProps = (0, _asyncToGenerator2.default)(
+      /*#__PURE__*/
+      _regenerator.default.mark(function _callee(nextProps) {
+        var val, next, options, width, height;
+        return _regenerator.default.wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                val = this.editor.getValue();
+                next = nextProps.value;
 
-      this.setOptions(options);
-      if (width !== this.props.width || height !== this.props.height) {
-        this.editor.setSize(width, height);
-      }
-    }
-    // http://codemirror.net/doc/manual.html#config
+                if (next !== undefined && next !== this.props.value && next !== val) {
+                  this.editor.setValue(nextProps.value);
+                }
 
+                options = nextProps.options, width = nextProps.width, height = nextProps.height;
+                _context.next = 6;
+                return this.setOptions(options);
+
+              case 6:
+                if (width !== this.props.width || height !== this.props.height) {
+                  this.editor.setSize(width, height);
+                }
+
+              case 7:
+              case "end":
+                return _context.stop();
+            }
+          }
+        }, _callee, this);
+      }));
+
+      return function componentWillReceiveProps(_x) {
+        return _componentWillReceiveProps.apply(this, arguments);
+      };
+    }() // http://codemirror.net/doc/manual.html#config
+
   }, {
-    key: 'setOptions',
+    key: "setOptions",
     value: function () {
-      var _ref = _asyncToGenerator( /*#__PURE__*/_regenerator2.default.mark(function _callee(options) {
+      var _setOptions = (0, _asyncToGenerator2.default)(
+      /*#__PURE__*/
+      _regenerator.default.mark(function _callee2(options) {
         var _this3 = this;
 
         var mode;
-        return _regenerator2.default.wrap(function _callee$(_context) {
+        return _regenerator.default.wrap(function _callee2$(_context2) {
           while (1) {
-            switch (_context.prev = _context.next) {
+            switch (_context2.prev = _context2.next) {
               case 0:
-                if (!((typeof options === 'undefined' ? 'undefined' : _typeof(options)) === 'object')) {
-                  _context.next = 7;
+                if (!((0, _typeof2.default)(options) === 'object')) {
+                  _context2.next = 7;
                   break;
                 }
 
-                mode = _codemirror2.default.findModeByName(options.mode);
+                mode = _codemirror.default.findModeByName(options.mode);
 
                 if (!(mode && mode.mode)) {
-                  _context.next = 5;
+                  _context2.next = 5;
                   break;
                 }
 
-                _context.next = 5;
-                return import('codemirror/mode/' + mode.mode + '/' + mode.mode + '.js');
+                _context2.next = 5;
+                return import("codemirror/mode/".concat(mode.mode, "/").concat(mode.mode, ".js"));
 
               case 5:
-                if (mode.alias && options.mode !== mode.mode) {
-                  options.mode = mode.mode;
+                if (mode) {
+                  options.mode = mode.mime;
                 }
+
                 Object.keys(options).forEach(function (name) {
@@ -146,17 +166,15 @@ if (options[name] && JSON.stringify(options[name])) {
               case 7:
-              case 'end':
-                return _context.stop();
+              case "end":
+                return _context2.stop();
             }
           }
-        }, _callee, this);
+        }, _callee2, this);
       }));
 
-      function setOptions(_x) {
-        return _ref.apply(this, arguments);
-      }
-
-      return setOptions;
+      return function setOptions(_x2) {
+        return _setOptions.apply(this, arguments);
+      };
     }()
   }, {
-    key: 'componentWillUnmount',
+    key: "componentWillUnmount",
     value: function componentWillUnmount() {
@@ -166,15 +184,11 @@ if (this.editor) {
       }
-    }
+    } // 将props中所有的事件处理函数映射并保存
 
-    // 将props中所有的事件处理函数映射并保存
-
   }, {
-    key: 'getEventHandleFromProps',
+    key: "getEventHandleFromProps",
     value: function getEventHandleFromProps() {
       var propNames = Object.keys(this.props);
       var eventHandle = propNames.filter(function (prop) {
-        return (/^on+/.test(prop)
-        );
+        return /^on+/.test(prop);
       });
-
       var eventDict = {};
@@ -186,16 +200,16 @@ eventHandle.forEach(function (ele) {
       });
-
       return eventDict;
     }
   }, {
-    key: 'render',
+    key: "render",
     value: function render() {
       var _this4 = this;
 
-      return _react2.default.createElement('textarea', { ref: function ref(instance) {
+      return _react.default.createElement("textarea", {
+        ref: function ref(instance) {
           _this4.textarea = instance;
-        } });
+        }
+      });
     }
   }]);
-
   return ReactCodeMirror;
@@ -205,4 +219,2 @@ }(_react.Component);
 exports.default = ReactCodeMirror;
-
-
 ReactCodeMirror.defaultProps = {
@@ -214,8 +226,7 @@ value: '',
 };
-
 ReactCodeMirror.propTypes = {
-  value: _propTypes2.default.string,
-  options: _propTypes2.default.object,
-  width: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number]),
-  height: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number])
+  value: _propTypes.default.string,
+  options: _propTypes.default.object,
+  width: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
+  height: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number])
 };

lib/index.js

@@ -1,52 +0,55 @@
-'use strict';
+"use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.default = void 0;
 
-var _regenerator = require('babel-runtime/regenerator');
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
-var _regenerator2 = _interopRequireDefault(_regenerator);
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
-var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 
-var _react = require('react');
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 
-var _react2 = _interopRequireDefault(_react);
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 
-var _propTypes = require('prop-types');
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 
-var _propTypes2 = _interopRequireDefault(_propTypes);
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 
-require('codemirror/lib/codemirror.css');
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 
-var _CodeMirror = require('./CodeMirror');
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
 
-var _CodeMirror2 = _interopRequireDefault(_CodeMirror);
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
-require('./index.css');
+var _react = _interopRequireWildcard(require("react"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
-function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
+require("codemirror/lib/codemirror.css");
 
-function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { step("next", value); }, function (err) { step("throw", err); }); } } return step("next"); }); }; }
+var _CodeMirror = _interopRequireDefault(require("./CodeMirror"));
 
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+require("./index.css");
 
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+var ReactCodeMirror =
+/*#__PURE__*/
+function (_Component) {
+  (0, _inherits2.default)(ReactCodeMirror, _Component);
 
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
-var ReactCodeMirror = function (_Component) {
-  _inherits(ReactCodeMirror, _Component);
-
   function ReactCodeMirror(props) {
-    _classCallCheck(this, ReactCodeMirror);
+    var _this;
 
-    var _this = _possibleConstructorReturn(this, (ReactCodeMirror.__proto__ || Object.getPrototypeOf(ReactCodeMirror)).call(this, props));
-
-    _this.getInstance = function (instance) {
+    (0, _classCallCheck2.default)(this, ReactCodeMirror);
+    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(ReactCodeMirror).call(this, props));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "getInstance", function (instance) {
       if (instance) {
@@ -56,4 +59,3 @@ _this.codemirror = instance.codemirror;
       }
-    };
-
+    });
     _this.state = {
@@ -65,8 +67,10 @@ codeMirrorOptions: {}
 
-  _createClass(ReactCodeMirror, [{
-    key: 'componentDidMount',
+  (0, _createClass2.default)(ReactCodeMirror, [{
+    key: "componentDidMount",
     value: function () {
-      var _ref = _asyncToGenerator( /*#__PURE__*/_regenerator2.default.mark(function _callee() {
+      var _componentDidMount = (0, _asyncToGenerator2.default)(
+      /*#__PURE__*/
+      _regenerator.default.mark(function _callee() {
         var options, codeMirrorOptions;
-        return _regenerator2.default.wrap(function _callee$(_context) {
+        return _regenerator.default.wrap(function _callee$(_context) {
           while (1) {
@@ -76,3 +80,3 @@ switch (_context.prev = _context.next) {
                 options = this.props.options;
-                codeMirrorOptions = _extends({
+                codeMirrorOptions = Object.assign({
                   tabSize: 2,
@@ -86,7 +90,8 @@ autoCloseBrackets: true,
                 }, options);
+                this.setState({
+                  codeMirrorOptions: codeMirrorOptions
+                });
 
-                this.setState({ codeMirrorOptions: codeMirrorOptions });
-
               case 3:
-              case 'end':
+              case "end":
                 return _context.stop();
@@ -98,13 +103,13 @@ }
 
-      function componentDidMount() {
-        return _ref.apply(this, arguments);
-      }
-
-      return componentDidMount;
+      return function componentDidMount() {
+        return _componentDidMount.apply(this, arguments);
+      };
     }()
   }, {
-    key: 'componentWillReceiveProps',
+    key: "componentWillReceiveProps",
     value: function () {
-      var _ref2 = _asyncToGenerator( /*#__PURE__*/_regenerator2.default.mark(function _callee2(nextPros) {
-        return _regenerator2.default.wrap(function _callee2$(_context2) {
+      var _componentWillReceiveProps = (0, _asyncToGenerator2.default)(
+      /*#__PURE__*/
+      _regenerator.default.mark(function _callee2(nextPros) {
+        return _regenerator.default.wrap(function _callee2$(_context2) {
           while (1) {
@@ -115,7 +120,7 @@ switch (_context2.prev = _context2.next) {
                 return this.setState({
-                  codeMirrorOptions: _extends({}, this.state.codeMirrorOptions, nextPros.options)
+                  codeMirrorOptions: Object.assign({}, this.state.codeMirrorOptions, nextPros.options)
                 });
 
               case 2:
-              case 'end':
+              case "end":
                 return _context2.stop();
@@ -127,24 +132,19 @@ }
 
-      function componentWillReceiveProps(_x) {
-        return _ref2.apply(this, arguments);
-      }
-
-      return componentWillReceiveProps;
+      return function componentWillReceiveProps(_x) {
+        return _componentWillReceiveProps.apply(this, arguments);
+      };
     }()
   }, {
-    key: 'render',
+    key: "render",
     value: function render() {
-      var _props = this.props,
-          options = _props.options,
-          otherProps = _objectWithoutProperties(_props, ['options']);
-
+      var _this$props = this.props,
+          options = _this$props.options,
+          otherProps = (0, _objectWithoutProperties2.default)(_this$props, ["options"]);
       var codeMirrorOptions = this.state.codeMirrorOptions;
-
-      return _react2.default.createElement(_CodeMirror2.default, _extends({}, otherProps, {
+      return _react.default.createElement(_CodeMirror.default, (0, _extends2.default)({}, otherProps, {
         ref: this.getInstance,
-        options: _extends({}, codeMirrorOptions)
+        options: Object.assign({}, codeMirrorOptions)
       }));
     }
   }]);
-
   return ReactCodeMirror;
@@ -154,4 +154,2 @@ }(_react.Component);
 exports.default = ReactCodeMirror;
-
-
 ReactCodeMirror.defaultProps = {
@@ -161,6 +159,5 @@ value: '',
 };
-
 ReactCodeMirror.propTypes = {
-  value: _propTypes2.default.string,
-  options: _propTypes2.default.object
+  value: _propTypes.default.string,
+  options: _propTypes.default.object
 };

package.json

 {
   "name": "@uiw/react-codemirror",
-  "version": "1.0.18",
+  "version": "1.0.19",
   "description": "CodeMirror component for React.",
@@ -5,0 +5,0 @@ "homepage": "https://uiw-react.github.io/react-codemirror/",

website/App.js

 import React, { PureComponent } from 'react';
+import modeInfo from './modes';
 import 'codemirror/addon/display/autorefresh';
@@ -99,3 +100,2 @@ import 'codemirror/addon/comment/comment';
 // `;
-const modes = ['json', 'apl', 'asciiarmor', 'asn.1', 'asterisk', 'brainfuck', 'clike', 'clojure', 'cmake', 'cobol', 'coffeescript', 'commonlisp', 'crystal', 'css', 'cypher', 'd', 'dart', 'diff', 'django', 'dockerfile', 'dtd', 'dylan', 'ebnf', 'ecl', 'eiffel', 'elm', 'erlang', 'factor', 'fcl', 'forth', 'fortran', 'gas', 'gfm', 'gherkin', 'go', 'groovy', 'haml', 'handlebars', 'haskell', 'haskell-literate', 'haxe', 'htmlembedded', 'htmlmixed', 'http', 'ini', 'idl', 'javascript', 'jinja2', 'jsx', 'julia', 'livescript', 'lua', 'markdown', 'mathematica', 'mbox', 'meta', 'mirc', 'mllike', 'modelica', 'mscgen', 'mumps', 'nginx', 'nsis', 'ntriples', 'octave', 'oz', 'pascal', 'pegjs', 'perl', 'php', 'pig', 'powershell', 'properties', 'protobuf', 'pug', 'puppet', 'python', 'q', 'r', 'rpm', 'rst', 'ruby', 'rust', 'sas', 'sass', 'scheme', 'shell', 'sieve', 'slim', 'smalltalk', 'smarty', 'solr', 'soy', 'sparql', 'spreadsheet', 'sql', 'stex', 'stylus', 'swift', 'tcl', 'textile', 'tiddlywiki', 'tiki', 'toml', 'tornado', 'troff', 'ttcn', 'ttcn-cfg', 'turtle', 'twig', 'vb', 'vbscript', 'velocity', 'verilog', 'vhdl', 'vue', 'webidl', 'xml', 'xquery', 'yacas', 'yaml', 'yaml-frontmatter', 'z80'];
 
@@ -121,2 +121,19 @@ const themes = ['3024-day', '3024-night', 'abcdef', 'ambiance-mobile', 'ambiance', 'base16-dark', 'base16-light', 'bespin', 'blackboard', 'cobalt', 'colorforth', 'darcula', 'dracula', 'duotone-dark', 'duotone-light', 'eclipse', 'elegant', 'erlang-dark', 'gruvbox-dark', 'hopscotch', 'icecoder', 'idea', 'isotope', 'lesser-dark', 'liquibyte', 'lucario', 'material', 'mbo', 'mdn-like', 'midnight', 'monokai', 'neat', 'neo', 'night', 'oceanic-next', 'panda-syntax', 'paraiso-dark', 'paraiso-light', 'pastel-on-dark', 'railscasts', 'rubyblue', 'seti', 'shadowfox', 'solarized', 'ssms', 'the-matrix', 'tomorrow-night-bright', 'tomorrow-night-eighties', 'ttcn', 'twilight', 'vibrant-ink', 'xq-dark', 'xq-light', 'yeti', 'zenburn'];
 
+const SelectModes = ({ value, options, onChange }) => {
+  const index = modeInfo.findIndex((item) => {
+    if (item.ext) return item.ext.indexOf(value) > -1;
+    else return item.mode === value;
+  });
+  return (
+    <select value={index} onChange={onChange}>
+      {options.map((item, key) => {
+        const optionProps = { key };
+        optionProps.value = key;
+        return (
+          <option {...optionProps}> {item.name} </option>
+        );
+      })}
+    </select>
+  );
+};
 export default class App extends PureComponent {
@@ -168,4 +185,8 @@ constructor() {
   onChange(e) {
-    this.loadCode(e.target.value);
-    this.setState({ mode: e.target.value });
+    const mode = modeInfo[e.target.value];
+    const ext = mode.ext;
+    if (ext) {
+      this.loadCode(ext[0]);
+      this.setState({ mode: ext[0] });
+    }
   }
@@ -198,3 +219,3 @@ onChangeTheme(e) {
           <div className={styles.select}>
-            <Select value={mode} options={modes} onChange={this.onChange.bind(this)} />
+            <SelectModes value={mode} options={modeInfo} onChange={this.onChange.bind(this)} />
             <Select value={theme} options={themes} onChange={this.onChangeTheme.bind(this)} />
@@ -201,0 +222,0 @@ </div>

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

115219

increased by10.44%

Number of package files

15

increased by7.14%

Lines of code

748

increased by35.26%

No dependency changes