From b3ce273cddb8d25eff1be6d21e2aba6d58e813ae Mon Sep 17 00:00:00 2001
From: Nathan Hunzaker <nate.hunzaker@gmail.com>
Date: Thu, 6 Sep 2018 08:00:30 -0700
Subject: [PATCH] Replace buble with babel, react-live with codemirror

---
 fixtures/dom/package.json                     |   4 +-
 fixtures/dom/public/renderer.html             |   1 +
 fixtures/dom/public/renderer.js               |  12 +-
 .../src/components/fixtures/hydration/Code.js |  43 +----
 .../fixtures/hydration/code-transformer.js    |  17 ++
 .../hydration/codemirror-gruvbox-dark.css     |  34 ++++
 .../fixtures/hydration/hydration.css          |  20 +-
 .../components/fixtures/hydration/index.js    | 100 +++++-----
 fixtures/dom/src/polyfills.js                 |   1 +
 fixtures/dom/yarn.lock                        | 182 +++++-------------
 10 files changed, 183 insertions(+), 231 deletions(-)
 create mode 100644 fixtures/dom/src/components/fixtures/hydration/code-transformer.js
 create mode 100644 fixtures/dom/src/components/fixtures/hydration/codemirror-gruvbox-dark.css

diff --git a/fixtures/dom/package.json b/fixtures/dom/package.json
index 00f63e9b68c3f..7d3c5e0e17830 100644
--- a/fixtures/dom/package.json
+++ b/fixtures/dom/package.json
@@ -6,14 +6,14 @@
     "react-scripts": "^1.0.11"
   },
   "dependencies": {
-    "buble": "^0.19.3",
+    "@babel/standalone": "^7.0.0",
     "classnames": "^2.2.5",
     "core-js": "^2.4.1",
     "prop-types": "^15.6.0",
     "query-string": "^4.2.3",
     "react": "^15.4.1",
+    "react-codemirror": "^1.0.0",
     "react-dom": "^15.4.1",
-    "react-live": "^1.11.0",
     "semver": "^5.5.0"
   },
   "scripts": {
diff --git a/fixtures/dom/public/renderer.html b/fixtures/dom/public/renderer.html
index acefa6c3a2a90..f0e7a8f9234c1 100644
--- a/fixtures/dom/public/renderer.html
+++ b/fixtures/dom/public/renderer.html
@@ -79,6 +79,7 @@
 
     <div id="output"></div>
 
+    <script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>
     <script src="renderer.js"></script>
   </body>
 </html>
diff --git a/fixtures/dom/public/renderer.js b/fixtures/dom/public/renderer.js
index b198ee2037b5c..5e3a541cb6443 100644
--- a/fixtures/dom/public/renderer.js
+++ b/fixtures/dom/public/renderer.js
@@ -125,16 +125,20 @@
       }
 
       window.addEventListener('message', function(event) {
-        switch (event.data.type) {
+        var data = JSON.parse(event.data);
+
+        switch (data.type) {
           case 'code':
-            reloadFixture(event.data.payload);
+            reloadFixture(data.payload);
             break;
           default:
-            throw new Error('Unrecognized message: ' + event.data.type);
+            throw new Error(
+              'Renderer Error: Unrecognized message "' + data.type + '"'
+            );
         }
       });
 
-      window.parent.postMessage({type: 'ready'}, '*');
+      window.parent.postMessage(JSON.stringify({type: 'ready'}), '*');
     })
     .catch(handleError);
 })();
diff --git a/fixtures/dom/src/components/fixtures/hydration/Code.js b/fixtures/dom/src/components/fixtures/hydration/Code.js
index f4ee73a63ab95..9a3e97cd7a3bd 100644
--- a/fixtures/dom/src/components/fixtures/hydration/Code.js
+++ b/fixtures/dom/src/components/fixtures/hydration/Code.js
@@ -1,50 +1,27 @@
-/**
- * react-live does not support React 14. For this version, just return
- * a textarea.
- *
- * TODO: Could we just get rid of react-live? It only adds syntax highlighting
- */
+import 'codemirror/lib/codemirror.css';
+import './codemirror-gruvbox-dark.css';
+import 'codemirror/mode/jsx/jsx';
 
-import semver from 'semver';
-import {LiveProvider, LiveEditor, LiveError} from 'react-live';
+import CodeMirror from 'react-codemirror';
 
 const React = window.React;
-const supportsReactLive = semver(React.version).major > 1; // React 15 or higher
 
-export class CodeProvider extends React.Component {
-  render() {
-    const {code, children} = this.props;
-
-    if (supportsReactLive) {
-      return <LiveProvider code={code} children={children} />;
-    }
-
-    return <div>{children}</div>;
-  }
-}
+const options = {
+  lineNumbers: true,
+  mode: 'jsx',
+  theme: 'gruvbox-dark',
+};
 
 export class CodeEditor extends React.Component {
   render() {
     const {code, onChange} = this.props;
-
-    if (supportsReactLive) {
-      return <LiveEditor onChange={onChange} />;
-    }
-
-    return (
-      <textarea value={code} onChange={event => onChange(event.target.value)} />
-    );
+    return <CodeMirror value={code} options={options} onChange={onChange} />;
   }
 }
 
 export class CodeError extends React.Component {
   render() {
     let {error, className} = this.props;
-
-    if (supportsReactLive) {
-      return <LiveError className={className} />;
-    }
-
     return error ? <div className={className}>{error.message}</div> : null;
   }
 }
diff --git a/fixtures/dom/src/components/fixtures/hydration/code-transformer.js b/fixtures/dom/src/components/fixtures/hydration/code-transformer.js
new file mode 100644
index 0000000000000..d990bf16603dd
--- /dev/null
+++ b/fixtures/dom/src/components/fixtures/hydration/code-transformer.js
@@ -0,0 +1,17 @@
+/**
+ * Babel works across all browsers, however it requires many polyfills.
+ */
+
+import 'core-js/es6/weak-map';
+import 'core-js/es6/weak-set';
+import 'core-js/es6/number';
+import 'core-js/es6/string';
+import 'core-js/es6/array';
+
+import {transform} from '@babel/standalone';
+
+const presets = ['es2015', 'stage-3', 'react'];
+
+export function compile(raw) {
+  return transform(raw, {presets}).code;
+}
diff --git a/fixtures/dom/src/components/fixtures/hydration/codemirror-gruvbox-dark.css b/fixtures/dom/src/components/fixtures/hydration/codemirror-gruvbox-dark.css
new file mode 100644
index 0000000000000..01ca7bb72490c
--- /dev/null
+++ b/fixtures/dom/src/components/fixtures/hydration/codemirror-gruvbox-dark.css
@@ -0,0 +1,34 @@
+/*
+
+    Name:       gruvbox-dark
+    Author:     kRkk (https://github.com/krkk)
+
+    Original gruvbox color scheme by Pavel Pertsev (https://github.com/morhetz/gruvbox)
+
+*/
+
+.cm-s-gruvbox-dark.CodeMirror, .cm-s-gruvbox-dark .CodeMirror-gutters { background-color: #282828; color: #bdae93; }
+.cm-s-gruvbox-dark .CodeMirror-gutters {background: #282828; border-right: 0px;}
+.cm-s-gruvbox-dark .CodeMirror-linenumber {color: #7c6f64;}
+.cm-s-gruvbox-dark .CodeMirror-cursor { border-left: 1px solid #ebdbb2; }
+.cm-s-gruvbox-dark div.CodeMirror-selected { background: #928374; }
+.cm-s-gruvbox-dark span.cm-meta { color: #808000; }
+
+.cm-s-gruvbox-dark span.cm-comment { color: #928374; }
+.cm-s-gruvbox-dark span.cm-number, span.cm-atom { color: #d3869b; }
+.cm-s-gruvbox-dark span.cm-keyword { color: #f84934; }
+
+.cm-s-gruvbox-dark span.cm-variable { color: #ebdbb2; }
+.cm-s-gruvbox-dark span.cm-variable-2 { color: #ebdbb2; }
+.cm-s-gruvbox-dark span.cm-variable-3, .cm-s-gruvbox-dark span.cm-type { color: black; }
+.cm-s-gruvbox-dark span.cm-operator { color: #ebdbb2; }
+.cm-s-gruvbox-dark span.cm-def { color: #ebdbb2; }
+.cm-s-gruvbox-dark span.cm-string { color: #b8bb26; }
+.cm-s-gruvbox-dark span.cm-string-2 { color: #8ec07c; }
+.cm-s-gruvbox-dark span.cm-qualifier { color: #555; }
+.cm-s-gruvbox-dark span.cm-attribute { color: #8ec07c; }
+
+.cm-s-gruvbox-dark .CodeMirror-activeline-background { background: #3c3836; }
+.cm-s-gruvbox-dark .CodeMirror-matchingbracket { background: #928374; color:#282828 !important; }
+
+.cm-s-gruvbox-dark span.cm-builtin { color: #fe8019; }
diff --git a/fixtures/dom/src/components/fixtures/hydration/hydration.css b/fixtures/dom/src/components/fixtures/hydration/hydration.css
index ba0380c65e82b..98dd2064725a6 100644
--- a/fixtures/dom/src/components/fixtures/hydration/hydration.css
+++ b/fixtures/dom/src/components/fixtures/hydration/hydration.css
@@ -40,19 +40,13 @@
   width: 100%;
 }
 
-.hydration-code textarea {
-  background: transparent;
-  border: 0;
-  bottom: 0;
-  color: #efefef;
-  font-family: monospace;
-  font-size: 12px;
-  left: 0;
-  line-height: 1.5;
-  padding: 16px;
-  position: absolute;
-  top: 0;
-  width: 100%;
+.hydration-code .ReactCodeMirror {
+  height: 100%;
+  position: relative;
+}
+
+.hydration-code .CodeMirror {
+  height: 100%;
 }
 
 .hydration-frame {
diff --git a/fixtures/dom/src/components/fixtures/hydration/index.js b/fixtures/dom/src/components/fixtures/hydration/index.js
index b3e3dbf16b1e1..ce284b731e47d 100644
--- a/fixtures/dom/src/components/fixtures/hydration/index.js
+++ b/fixtures/dom/src/components/fixtures/hydration/index.js
@@ -1,7 +1,7 @@
 import './hydration.css';
 import {SAMPLE_CODE} from './data';
-import {CodeProvider, CodeEditor, CodeError} from './Code';
-import * as buble from 'buble';
+import {CodeEditor, CodeError} from './Code';
+import {compile} from './code-transformer';
 import {reactPaths} from '../../../react-loader';
 import qs from 'query-string';
 
@@ -24,40 +24,44 @@ class Hydration extends React.Component {
     window.removeEventListener('message', this.handleMessage);
   }
 
+  handleMessage = event => {
+    var data = JSON.parse(event.data);
+
+    switch (data.type) {
+      case 'ready':
+        this.ready = true;
+        this.injectCode();
+        break;
+      default:
+        throw new Error(
+          'Editor Error: Unrecognized message "' + data.type + '"'
+        );
+    }
+  };
+
   injectCode = () => {
     try {
       this.send({
         type: 'code',
-        payload: buble.transform(this.state.code).code,
+        payload: compile(this.state.code),
       });
+
       this.setState({error: null});
     } catch (error) {
       this.setState({error});
     }
   };
 
-  setFrame = frame => {
-    this.frame = frame;
-  };
-
-  handleMessage = event => {
-    switch (event.data.type) {
-      case 'ready':
-        this.ready = true;
-        this.injectCode();
-        break;
-      default:
-        throw new Error('Unrecognized message: ' + event.data.type);
-      // do nothing
-    }
-  };
-
   send = message => {
     if (this.ready) {
-      this.frame.contentWindow.postMessage(message, '*');
+      this.frame.contentWindow.postMessage(JSON.stringify(message), '*');
     }
   };
 
+  setFrame = frame => {
+    this.frame = frame;
+  };
+
   setCode = code => {
     this.setState({code}, this.injectCode);
   };
@@ -73,35 +77,33 @@ class Hydration extends React.Component {
     const src = '/renderer.html?' + qs.stringify({hydrate, ...reactPaths()});
 
     return (
-      <CodeProvider code={code}>
-        <div className="hydration">
-          <section className="hydration-editor">
-            <header className="hydration-options">
-              <label htmlFor="hydrate">
-                <input
-                  id="hydrate"
-                  name="hydrate"
-                  type="checkbox"
-                  checked={hydrate}
-                  onChange={this.setCheckbox}
-                />
-                Hydrate
-              </label>
-            </header>
-
-            <div className="hydration-code">
-              <CodeEditor code={code} onChange={this.setCode} />
-            </div>
-          </section>
-          <iframe
-            ref={this.setFrame}
-            className="hydration-frame"
-            title="Hydration Preview"
-            src={src}
-          />
-          <CodeError error={error} className="hydration-code-error" />
-        </div>
-      </CodeProvider>
+      <div className="hydration">
+        <section className="hydration-editor">
+          <header className="hydration-options">
+            <label htmlFor="hydrate">
+              <input
+                id="hydrate"
+                name="hydrate"
+                type="checkbox"
+                checked={hydrate}
+                onChange={this.setCheckbox}
+              />
+              Hydrate
+            </label>
+          </header>
+
+          <div className="hydration-code">
+            <CodeEditor code={code} onChange={this.setCode} />
+          </div>
+        </section>
+        <iframe
+          ref={this.setFrame}
+          className="hydration-frame"
+          title="Hydration Preview"
+          src={src}
+        />
+        <CodeError error={error} className="hydration-code-error" />
+      </div>
     );
   }
 }
diff --git a/fixtures/dom/src/polyfills.js b/fixtures/dom/src/polyfills.js
index 756a6d615867b..ed6e08f59beb5 100644
--- a/fixtures/dom/src/polyfills.js
+++ b/fixtures/dom/src/polyfills.js
@@ -1,3 +1,4 @@
+import 'core-js/es6/symbol';
 import 'core-js/es6/promise';
 import 'core-js/es6/set';
 import 'core-js/es6/map';
diff --git a/fixtures/dom/yarn.lock b/fixtures/dom/yarn.lock
index 9fb0c198d8d00..9589ec308bd30 100644
--- a/fixtures/dom/yarn.lock
+++ b/fixtures/dom/yarn.lock
@@ -2,6 +2,10 @@
 # yarn lockfile v1
 
 
+"@babel/standalone@^7.0.0":
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/@babel/standalone/-/standalone-7.0.0.tgz#856446641620c1c5f0ca775621d478324ebd1f52"
+
 abab@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/abab/-/abab-1.0.3.tgz#b81de5f7274ec4e756d797cd834f303642724e5d"
@@ -23,12 +27,6 @@ acorn-dynamic-import@^2.0.0:
   dependencies:
     acorn "^4.0.3"
 
-acorn-dynamic-import@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/acorn-dynamic-import/-/acorn-dynamic-import-3.0.0.tgz#901ceee4c7faaef7e07ad2a47e890675da50a278"
-  dependencies:
-    acorn "^5.0.0"
-
 acorn-globals@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/acorn-globals/-/acorn-globals-3.1.0.tgz#fd8270f71fbb4996b004fa880ee5d46573a731bf"
@@ -41,12 +39,6 @@ acorn-jsx@^3.0.0:
   dependencies:
     acorn "^3.0.4"
 
-acorn-jsx@^4.1.1:
-  version "4.1.1"
-  resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-4.1.1.tgz#e8e41e48ea2fe0c896740610ab6a4ffd8add225e"
-  dependencies:
-    acorn "^5.0.3"
-
 acorn@^3.0.4:
   version "3.3.0"
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-3.3.0.tgz#45e37fb39e8da3f25baee3ff5369e2bb5f22017a"
@@ -63,10 +55,6 @@ acorn@^5.0.0, acorn@^5.1.1:
   version "5.1.1"
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-5.1.1.tgz#53fe161111f912ab999ee887a90a0bc52822fd75"
 
-acorn@^5.0.3, acorn@^5.4.1:
-  version "5.7.1"
-  resolved "https://registry.yarnpkg.com/acorn/-/acorn-5.7.1.tgz#f095829297706a7c9776958c0afc8930a9b9d9d8"
-
 address@1.0.2, address@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/address/-/address-1.0.2.tgz#480081e82b587ba319459fef512f516fe03d58af"
@@ -162,12 +150,6 @@ ansi-styles@^3.0.0, ansi-styles@^3.1.0:
   dependencies:
     color-convert "^1.9.0"
 
-ansi-styles@^3.2.1:
-  version "3.2.1"
-  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-3.2.1.tgz#41fbb20243e50b12be0f04b8dedbf07520ce841d"
-  dependencies:
-    color-convert "^1.9.0"
-
 anymatch@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-1.3.0.tgz#a3e52fa39168c825ff57b0248126ce5a8ff95507"
@@ -1359,19 +1341,6 @@ bser@^2.0.0:
   dependencies:
     node-int64 "^0.4.0"
 
-buble@^0.19.3:
-  version "0.19.3"
-  resolved "https://registry.yarnpkg.com/buble/-/buble-0.19.3.tgz#01e9412062cff1da6f20342b6ecd72e7bf699d02"
-  dependencies:
-    acorn "^5.4.1"
-    acorn-dynamic-import "^3.0.0"
-    acorn-jsx "^4.1.1"
-    chalk "^2.3.1"
-    magic-string "^0.22.4"
-    minimist "^1.2.0"
-    os-homedir "^1.0.1"
-    vlq "^1.0.0"
-
 buffer-indexof@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/buffer-indexof/-/buffer-indexof-1.1.0.tgz#f54f647c4f4e25228baa656a2e57e43d5f270982"
@@ -1497,14 +1466,6 @@ chalk@^2.0.0, chalk@^2.1.0:
     escape-string-regexp "^1.0.5"
     supports-color "^4.0.0"
 
-chalk@^2.3.1:
-  version "2.4.1"
-  resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.1.tgz#18c49ab16a037b6eb0152cc83e3471338215b66e"
-  dependencies:
-    ansi-styles "^3.2.1"
-    escape-string-regexp "^1.0.5"
-    supports-color "^5.3.0"
-
 chokidar@^1.6.0, chokidar@^1.7.0:
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-1.7.0.tgz#798e689778151c8076b4b360e5edd28cda2bb468"
@@ -1565,14 +1526,6 @@ cli-width@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/cli-width/-/cli-width-2.1.0.tgz#b234ca209b29ef66fc518d9b98d5847b00edf00a"
 
-clipboard@^1.5.5:
-  version "1.7.1"
-  resolved "https://registry.yarnpkg.com/clipboard/-/clipboard-1.7.1.tgz#360d6d6946e99a7a1fef395e42ba92b5e9b5a16b"
-  dependencies:
-    good-listener "^1.2.2"
-    select "^1.1.2"
-    tiny-emitter "^2.0.0"
-
 cliui@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/cliui/-/cliui-2.1.0.tgz#4b475760ff80264c762c3a1719032e91c7fea0d1"
@@ -1607,6 +1560,10 @@ code-point-at@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/code-point-at/-/code-point-at-1.1.0.tgz#0d070b4d043a5bea33a2f1a40e2edb3d9a4ccf77"
 
+codemirror@^5.18.2:
+  version "5.40.0"
+  resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-5.40.0.tgz#2f5ed47366e514f41349ba0fe34daaa39be4e257"
+
 color-convert@^1.3.0:
   version "1.8.2"
   resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.8.2.tgz#be868184d7c8631766d54e7078e2672d7c7e3339"
@@ -1669,14 +1626,6 @@ commondir@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/commondir/-/commondir-1.0.1.tgz#ddd800da0c66127393cca5950ea968a3aaf1253b"
 
-component-props@1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/component-props/-/component-props-1.1.1.tgz#f9b7df9b9927b6e6d97c9bd272aa867670f34944"
-
-component-xor@0.0.4:
-  version "0.0.4"
-  resolved "https://registry.yarnpkg.com/component-xor/-/component-xor-0.0.4.tgz#c55d83ccc1b94cd5089a4e93fa7891c7263e59aa"
-
 compressible@~2.0.8:
   version "2.0.9"
   resolved "https://registry.yarnpkg.com/compressible/-/compressible-2.0.9.tgz#6daab4e2b599c2770dd9e21e7a891b1c5a755425"
@@ -1826,6 +1775,14 @@ create-hmac@^1.1.0, create-hmac@^1.1.2, create-hmac@^1.1.4:
     safe-buffer "^5.0.1"
     sha.js "^2.4.8"
 
+create-react-class@^15.5.1:
+  version "15.6.3"
+  resolved "https://registry.yarnpkg.com/create-react-class/-/create-react-class-15.6.3.tgz#2d73237fb3f970ae6ebe011a9e66f46dbca80036"
+  dependencies:
+    fbjs "^0.8.9"
+    loose-envify "^1.3.1"
+    object-assign "^4.1.1"
+
 cross-spawn@5.1.0, cross-spawn@^5.0.1, cross-spawn@^5.1.0:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-5.1.0.tgz#e8bd0efee58fcff6f8f94510a0a554bbfa235449"
@@ -2073,10 +2030,6 @@ delayed-stream@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619"
 
-delegate@^3.1.2:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/delegate/-/delegate-3.2.0.tgz#b66b71c3158522e8ab5744f720d8ca0c2af59166"
-
 delegates@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/delegates/-/delegates-1.0.0.tgz#84c6e159b81904fdca59a0ef44cd870d31250f9a"
@@ -2162,13 +2115,6 @@ dom-converter@~0.1:
   dependencies:
     utila "~0.3"
 
-dom-iterator@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/dom-iterator/-/dom-iterator-1.0.0.tgz#9c09899846ec41c2d257adc4d6015e4759ef05ad"
-  dependencies:
-    component-props "1.1.1"
-    component-xor "0.0.4"
-
 dom-serializer@0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.1.0.tgz#073c697546ce0780ce23be4a28e293e40bc30c82"
@@ -2754,6 +2700,18 @@ fbjs@^0.8.16:
     setimmediate "^1.0.5"
     ua-parser-js "^0.7.9"
 
+fbjs@^0.8.9:
+  version "0.8.17"
+  resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd"
+  dependencies:
+    core-js "^1.0.0"
+    isomorphic-fetch "^2.1.1"
+    loose-envify "^1.0.0"
+    object-assign "^4.1.0"
+    promise "^7.1.1"
+    setimmediate "^1.0.5"
+    ua-parser-js "^0.7.18"
+
 figures@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/figures/-/figures-2.0.0.tgz#3ab1a2d2a62c8bfb431a0c94cb797a2fce27c962"
@@ -3095,12 +3053,6 @@ globby@^6.1.0:
     pify "^2.0.0"
     pinkie-promise "^2.0.0"
 
-good-listener@^1.2.2:
-  version "1.2.2"
-  resolved "https://registry.yarnpkg.com/good-listener/-/good-listener-1.2.2.tgz#d53b30cdf9313dffb7dc9a0d477096aa6d145c50"
-  dependencies:
-    delegate "^3.1.2"
-
 got@^5.0.0:
   version "5.7.1"
   resolved "https://registry.yarnpkg.com/got/-/got-5.7.1.tgz#5f81635a61e4a6589f180569ea4e381680a51f35"
@@ -3187,10 +3139,6 @@ has-flag@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-2.0.0.tgz#e8207af1cc7b30d446cc70b734b5e8be18f88d51"
 
-has-flag@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
-
 has-unicode@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/has-unicode/-/has-unicode-2.0.1.tgz#e0e6fe6a28cf51138855e086d1691e771de2a8b9"
@@ -4244,6 +4192,10 @@ lodash.cond@^4.3.0:
   version "4.5.2"
   resolved "https://registry.yarnpkg.com/lodash.cond/-/lodash.cond-4.5.2.tgz#f471a1da486be60f6ab955d17115523dd1d255d5"
 
+lodash.debounce@^4.0.8:
+  version "4.0.8"
+  resolved "https://registry.yarnpkg.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af"
+
 lodash.defaults@^4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/lodash.defaults/-/lodash.defaults-4.2.0.tgz#d09178716ffea4dde9e5fb7b37f6f0802274580c"
@@ -4252,6 +4204,10 @@ lodash.indexof@^4.0.5:
   version "4.0.5"
   resolved "https://registry.yarnpkg.com/lodash.indexof/-/lodash.indexof-4.0.5.tgz#53714adc2cddd6ed87638f893aa9b6c24e31ef3c"
 
+lodash.isequal@^4.5.0:
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/lodash.isequal/-/lodash.isequal-4.5.0.tgz#415c4478f2bcc30120c22ce10ed3226f7d3e18e0"
+
 lodash.template@^4.4.0:
   version "4.4.0"
   resolved "https://registry.yarnpkg.com/lodash.template/-/lodash.template-4.4.0.tgz#e73a0385c8355591746e020b99679c690e68fba0"
@@ -4315,12 +4271,6 @@ macaddress@^0.2.8:
   version "0.2.8"
   resolved "https://registry.yarnpkg.com/macaddress/-/macaddress-0.2.8.tgz#5904dc537c39ec6dbefeae902327135fa8511f12"
 
-magic-string@^0.22.4:
-  version "0.22.5"
-  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.22.5.tgz#8e9cf5afddf44385c1da5bc2a6a0dbd10b03657e"
-  dependencies:
-    vlq "^0.2.2"
-
 make-dir@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-1.0.0.tgz#97a011751e91dd87cfadef58832ebb04936de978"
@@ -5321,12 +5271,6 @@ pretty-format@^20.0.3:
     ansi-regex "^2.1.1"
     ansi-styles "^3.0.0"
 
-prismjs@1.6:
-  version "1.6.0"
-  resolved "https://registry.yarnpkg.com/prismjs/-/prismjs-1.6.0.tgz#118d95fb7a66dba2272e343b345f5236659db365"
-  optionalDependencies:
-    clipboard "^1.5.5"
-
 private@^0.1.6:
   version "0.1.6"
   resolved "https://registry.yarnpkg.com/private/-/private-0.1.6.tgz#55c6a976d0f9bafb9924851350fe47b9b5fbb7c1"
@@ -5355,7 +5299,7 @@ promise@^7.1.1:
   dependencies:
     asap "~2.0.3"
 
-prop-types@^15.5.8:
+prop-types@^15.5.4:
   version "15.6.2"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.2.tgz#05d5ca77b4453e985d60fc7ff8c859094a497102"
   dependencies:
@@ -5477,6 +5421,17 @@ rc@~1.1.6:
     minimist "^1.2.0"
     strip-json-comments "~1.0.4"
 
+react-codemirror@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/react-codemirror/-/react-codemirror-1.0.0.tgz#91467b53b1f5d80d916a2fd0b4c7adb85a9001ba"
+  dependencies:
+    classnames "^2.2.5"
+    codemirror "^5.18.2"
+    create-react-class "^15.5.1"
+    lodash.debounce "^4.0.8"
+    lodash.isequal "^4.5.0"
+    prop-types "^15.5.4"
+
 react-dev-utils@^3.1.0:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-3.1.1.tgz#09ae7209a81384248db56547e718e65bd3b20eb5"
@@ -5520,17 +5475,6 @@ react-error-overlay@^1.0.10:
     settle-promise "1.0.0"
     source-map "0.5.6"
 
-react-live@^1.11.0:
-  version "1.11.0"
-  resolved "https://registry.yarnpkg.com/react-live/-/react-live-1.11.0.tgz#257b54abb64df250bc40b0572c21acd600ecdd5c"
-  dependencies:
-    buble "^0.19.3"
-    core-js "^2.4.1"
-    dom-iterator "^1.0.0"
-    prismjs "1.6"
-    prop-types "^15.5.8"
-    unescape "^0.2.0"
-
 react-scripts@^1.0.11:
   version "1.0.11"
   resolved "https://registry.yarnpkg.com/react-scripts/-/react-scripts-1.0.11.tgz#483d49e27f417ec981ae415a4456120a2a2bc8c1"
@@ -5968,10 +5912,6 @@ select-hose@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/select-hose/-/select-hose-2.0.0.tgz#625d8658f865af43ec962bfc376a37359a4994ca"
 
-select@^1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/select/-/select-1.1.2.tgz#0e7350acdec80b1108528786ec1d4418d11b396d"
-
 selfsigned@^1.9.1:
   version "1.10.1"
   resolved "https://registry.yarnpkg.com/selfsigned/-/selfsigned-1.10.1.tgz#bf8cb7b83256c4551e31347c6311778db99eec52"
@@ -6354,12 +6294,6 @@ supports-color@^4.0.0, supports-color@^4.2.1:
   dependencies:
     has-flag "^2.0.0"
 
-supports-color@^5.3.0:
-  version "5.4.0"
-  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.4.0.tgz#1c6b337402c2137605efe19f10fec390f6faab54"
-  dependencies:
-    has-flag "^3.0.0"
-
 svgo@^0.7.0:
   version "0.7.1"
   resolved "https://registry.yarnpkg.com/svgo/-/svgo-0.7.1.tgz#287320fed972cb097e72c2bb1685f96fe08f8034"
@@ -6495,10 +6429,6 @@ timers-browserify@^2.0.2:
   dependencies:
     setimmediate "^1.0.4"
 
-tiny-emitter@^2.0.0:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/tiny-emitter/-/tiny-emitter-2.0.2.tgz#82d27468aca5ade8e5fd1e6d22b57dd43ebdfb7c"
-
 tmp@^0.0.31:
   version "0.0.31"
   resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.0.31.tgz#8f38ab9438e17315e5dbd8b3657e8bfb277ae4a7"
@@ -6578,6 +6508,10 @@ typedarray@^0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
 
+ua-parser-js@^0.7.18:
+  version "0.7.18"
+  resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.18.tgz#a7bfd92f56edfb117083b69e31d2aa8882d4b1ed"
+
 ua-parser-js@^0.7.9:
   version "0.7.12"
   resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.12.tgz#04c81a99bdd5dc52263ea29d24c6bf8d4818a4bb"
@@ -6623,10 +6557,6 @@ uid-number@^0.0.6, uid-number@~0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/uid-number/-/uid-number-0.0.6.tgz#0ea10e8035e8eb5b8e4449f06da1c730663baa81"
 
-unescape@^0.2.0:
-  version "0.2.0"
-  resolved "https://registry.yarnpkg.com/unescape/-/unescape-0.2.0.tgz#b78b9b60c86f1629df181bf53eee3bc8d6367ddf"
-
 uniq@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/uniq/-/uniq-1.0.1.tgz#b31c5ae8254844a3a8281541ce2b04b865a734ff"
@@ -6759,14 +6689,6 @@ verror@1.3.6:
   dependencies:
     extsprintf "1.0.2"
 
-vlq@^0.2.2:
-  version "0.2.3"
-  resolved "https://registry.yarnpkg.com/vlq/-/vlq-0.2.3.tgz#8f3e4328cf63b1540c0d67e1b2778386f8975b26"
-
-vlq@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/vlq/-/vlq-1.0.0.tgz#8101be90843422954c2b13eb27f2f3122bdcc806"
-
 vm-browserify@0.0.4:
   version "0.0.4"
   resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-0.0.4.tgz#5d7ea45bbef9e4a6ff65f95438e0a87c357d5a73"