@webscopeio/react-console - npm Package Compare versions

Comparing version 1.0.9 to 1.0.10

dist/index.es.js

@@ -96,3 +96,3 @@ import { createElement, Component } from 'react';
 
-var css = "/* add css styles here (optional) */\n\n.styles_wrapper__3KXDn {\n  display: flex;\n  flex-direction: column;\n  background-color: black;\n  color: white;\n  font-family: monospace;\n  font-size: 12px;\n  padding: 10px;\n  height: 300px;\n  overflow-y: auto;\n}\n\n.styles_promptWrapper__2Cy1Y {\n  display: flex;\n}\n\n.styles_line__1lhnu {\n  font-size: 12px;\n  line-height: 12px;\n  font-family: monospace;\n  background: transparent !important; /* we want to make this transparent whatever happens in the app*/\n  padding: 0;\n  color: white;\n}\n\n.styles_prompt__1nRph {\n  display: flex;\n  align-items: center;\n}\n\n.styles_input__15JGo {\n  flex: 1;\n  background: transparent !important; /* we want to make this transparent whatever happens in the app*/\n  border: none;\n  outline: none;\n  color: white;\n  font-family: monospace;\n  font-size: 13px;\n}\n";
+var css = "/* add css styles here (optional) */\n\n.styles_wrapper__3KXDn {\n  display: flex;\n  flex-direction: column;\n  background-color: black;\n  color: white;\n  font-family: monospace;\n  font-size: 12px;\n  padding: 10px;\n  height: 300px;\n}\n\n.styles_promptWrapper__2Cy1Y {\n  display: flex;\n}\n\n.styles_line__1lhnu {\n  font-size: 12px;\n  line-height: 12px;\n  font-family: monospace;\n  background: transparent !important; /* we want to make this transparent whatever happens in the app*/\n  padding: 0;\n  color: white;\n}\n\n.styles_prompt__1nRph {\n  display: flex;\n  align-items: center;\n}\n\n.styles_input__15JGo {\n  flex: 1;\n  background: transparent !important; /* we want to make this transparent whatever happens in the app*/\n  border: none;\n  outline: none;\n  color: white;\n  font-family: monospace;\n  font-size: 13px;\n}\n";
 var styles = {"wrapper":"styles_wrapper__3KXDn","promptWrapper":"styles_promptWrapper__2Cy1Y","line":"styles_line__1lhnu","prompt":"styles_prompt__1nRph","input":"styles_input__15JGo"};
@@ -104,2 +104,4 @@ styleInject(css);
  */
+// @ts-ignore
+var isIE11 = !!window.MSInputMethodContext && !!document.documentMode;
 var ReactConsole = /** @class */ (function (_super) {
@@ -120,3 +122,3 @@ __extends(ReactConsole, _super);
         _this.onSubmit = function (e) { return __awaiter(_this, void 0, void 0, function () {
-            var _a, prompt, inputString, log, _b, cmd, args, command, ret, err_1, cmdNotFound;
+            var _a, prompt, inputString, log, _b, cmd, args, command, ret, cmdNotFound;
             return __generator(this, function (_c) {
@@ -145,24 +147,13 @@ switch (_c.label) {
                         command = this.props.commands[cmd];
-                        return [4 /*yield*/, this.setState({ commandInProgress: true })];
+                        this.setState({ commandInProgress: true });
+                        if (!command) return [3 /*break*/, 2];
+                        return [4 /*yield*/, command.fn.apply(command, args)];
                     case 1:
-                        _c.sent();
-                        if (!command) return [3 /*break*/, 7];
-                        _c.label = 2;
-                    case 2:
-                        _c.trys.push([2, 5, , 6]);
-                        return [4 /*yield*/, command.fn.apply(command, args)];
+                        ret = _c.sent();
+                        this.setState({
+                            output: this.state.output.concat([log, ret])
+                        });
+                        return [3 /*break*/, 4];
+                    case 2: return [4 /*yield*/, (_a = this.props).noCommandFound.apply(_a, [cmd].concat(args))];
                     case 3:
-                        ret = _c.sent();
-                        return [4 /*yield*/, this.setState({
-                                output: this.state.output.concat([log, ret])
-                            })];
-                    case 4:
-                        _c.sent();
-                        return [3 /*break*/, 6];
-                    case 5:
-                        err_1 = _c.sent();
-                        return [3 /*break*/, 6];
-                    case 6: return [3 /*break*/, 9];
-                    case 7: return [4 /*yield*/, (_a = this.props).noCommandFound.apply(_a, [cmd].concat(args))];
-                    case 8:
                         cmdNotFound = _c.sent();
@@ -172,4 +163,4 @@ this.setState({
                         });
-                        _c.label = 9;
-                    case 9:
+                        _c.label = 4;
+                    case 4:
                         this.setState({ commandInProgress: false, input: '' });
@@ -188,3 +179,3 @@ this.inputRef.focus();
             if (_this.inputRef) {
-                if (window.getSelection().type !== "Range") {
+                if (document.getSelection().isCollapsed) {
                     _this.inputRef.focus();
@@ -210,3 +201,5 @@ }
             : styles.prompt;
-        return (createElement("div", { className: styles.wrapper, onClick: this.focusConsole, ref: function (ref) { return _this.wrapperRef = ref; } },
+        return (createElement("div", { className: styles.wrapper, onClick: this.focusConsole, ref: function (ref) { return _this.wrapperRef = ref; }, style: {
+                overflowY: isIE11 ? "scroll" : "auto",
+            } },
             createElement("div", null, this.state.output.map(function (line, key) {
@@ -213,0 +206,0 @@ return createElement("pre", { key: key, className: styles.line, dangerouslySetInnerHTML: { __html: line } });

dist/index.js

@@ -100,3 +100,3 @@ 'use strict';
 
-var css = "/* add css styles here (optional) */\n\n.styles_wrapper__3KXDn {\n  display: flex;\n  flex-direction: column;\n  background-color: black;\n  color: white;\n  font-family: monospace;\n  font-size: 12px;\n  padding: 10px;\n  height: 300px;\n  overflow-y: auto;\n}\n\n.styles_promptWrapper__2Cy1Y {\n  display: flex;\n}\n\n.styles_line__1lhnu {\n  font-size: 12px;\n  line-height: 12px;\n  font-family: monospace;\n  background: transparent !important; /* we want to make this transparent whatever happens in the app*/\n  padding: 0;\n  color: white;\n}\n\n.styles_prompt__1nRph {\n  display: flex;\n  align-items: center;\n}\n\n.styles_input__15JGo {\n  flex: 1;\n  background: transparent !important; /* we want to make this transparent whatever happens in the app*/\n  border: none;\n  outline: none;\n  color: white;\n  font-family: monospace;\n  font-size: 13px;\n}\n";
+var css = "/* add css styles here (optional) */\n\n.styles_wrapper__3KXDn {\n  display: flex;\n  flex-direction: column;\n  background-color: black;\n  color: white;\n  font-family: monospace;\n  font-size: 12px;\n  padding: 10px;\n  height: 300px;\n}\n\n.styles_promptWrapper__2Cy1Y {\n  display: flex;\n}\n\n.styles_line__1lhnu {\n  font-size: 12px;\n  line-height: 12px;\n  font-family: monospace;\n  background: transparent !important; /* we want to make this transparent whatever happens in the app*/\n  padding: 0;\n  color: white;\n}\n\n.styles_prompt__1nRph {\n  display: flex;\n  align-items: center;\n}\n\n.styles_input__15JGo {\n  flex: 1;\n  background: transparent !important; /* we want to make this transparent whatever happens in the app*/\n  border: none;\n  outline: none;\n  color: white;\n  font-family: monospace;\n  font-size: 13px;\n}\n";
 var styles = {"wrapper":"styles_wrapper__3KXDn","promptWrapper":"styles_promptWrapper__2Cy1Y","line":"styles_line__1lhnu","prompt":"styles_prompt__1nRph","input":"styles_input__15JGo"};
@@ -108,2 +108,4 @@ styleInject(css);
  */
+// @ts-ignore
+var isIE11 = !!window.MSInputMethodContext && !!document.documentMode;
 var ReactConsole = /** @class */ (function (_super) {
@@ -124,3 +126,3 @@ __extends(ReactConsole, _super);
         _this.onSubmit = function (e) { return __awaiter(_this, void 0, void 0, function () {
-            var _a, prompt, inputString, log, _b, cmd, args, command, ret, err_1, cmdNotFound;
+            var _a, prompt, inputString, log, _b, cmd, args, command, ret, cmdNotFound;
             return __generator(this, function (_c) {
@@ -149,24 +151,13 @@ switch (_c.label) {
                         command = this.props.commands[cmd];
-                        return [4 /*yield*/, this.setState({ commandInProgress: true })];
+                        this.setState({ commandInProgress: true });
+                        if (!command) return [3 /*break*/, 2];
+                        return [4 /*yield*/, command.fn.apply(command, args)];
                     case 1:
-                        _c.sent();
-                        if (!command) return [3 /*break*/, 7];
-                        _c.label = 2;
-                    case 2:
-                        _c.trys.push([2, 5, , 6]);
-                        return [4 /*yield*/, command.fn.apply(command, args)];
+                        ret = _c.sent();
+                        this.setState({
+                            output: this.state.output.concat([log, ret])
+                        });
+                        return [3 /*break*/, 4];
+                    case 2: return [4 /*yield*/, (_a = this.props).noCommandFound.apply(_a, [cmd].concat(args))];
                     case 3:
-                        ret = _c.sent();
-                        return [4 /*yield*/, this.setState({
-                                output: this.state.output.concat([log, ret])
-                            })];
-                    case 4:
-                        _c.sent();
-                        return [3 /*break*/, 6];
-                    case 5:
-                        err_1 = _c.sent();
-                        return [3 /*break*/, 6];
-                    case 6: return [3 /*break*/, 9];
-                    case 7: return [4 /*yield*/, (_a = this.props).noCommandFound.apply(_a, [cmd].concat(args))];
-                    case 8:
                         cmdNotFound = _c.sent();
@@ -176,4 +167,4 @@ this.setState({
                         });
-                        _c.label = 9;
-                    case 9:
+                        _c.label = 4;
+                    case 4:
                         this.setState({ commandInProgress: false, input: '' });
@@ -192,3 +183,3 @@ this.inputRef.focus();
             if (_this.inputRef) {
-                if (window.getSelection().type !== "Range") {
+                if (document.getSelection().isCollapsed) {
                     _this.inputRef.focus();
@@ -214,3 +205,5 @@ }
             : styles.prompt;
-        return (React.createElement("div", { className: styles.wrapper, onClick: this.focusConsole, ref: function (ref) { return _this.wrapperRef = ref; } },
+        return (React.createElement("div", { className: styles.wrapper, onClick: this.focusConsole, ref: function (ref) { return _this.wrapperRef = ref; }, style: {
+                overflowY: isIE11 ? "scroll" : "auto",
+            } },
             React.createElement("div", null, this.state.output.map(function (line, key) {
@@ -217,0 +210,0 @@ return React.createElement("pre", { key: key, className: styles.line, dangerouslySetInnerHTML: { __html: line } });

package.json

 {
   "name": "@webscopeio/react-console",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "description": "React component that emulates console behaviour",
@@ -5,0 +5,0 @@ "author": "jvorcak",

No alert changes

Worsened metrics

Total package byte prevSize

72399

decreased by-0.32%

Lines of code

452

decreased by-3%

No dependency changes