diff --git a/.env.example b/.env.example
index 8876ce5502..eade709c69 100644
--- a/.env.example
+++ b/.env.example
@@ -22,6 +22,9 @@ ML5_LIBRARY_PASS=helloml5
 MOBILE_ENABLED=true
 MONGO_URL=mongodb://localhost:27017/p5js-web-editor
 PORT=8000
+PREVIEW_PORT=8002
+EDITOR_URL=http://localhost:8000
+PREVIEW_URL=http://localhost:8002
 S3_BUCKET=<your-s3-bucket>
 S3_BUCKET_URL_BASE=<alt-for-s3-url>
 SESSION_SECRET=whatever_you_want_this_to_be_it_only_matters_for_production
diff --git a/client/index.integration.test.jsx b/client/index.integration.test.jsx
index d3750bb94a..1fcc1b5982 100644
--- a/client/index.integration.test.jsx
+++ b/client/index.integration.test.jsx
@@ -139,7 +139,7 @@ describe('index.jsx integration', () => {
     expect(
       screen.getByRole('heading', { name: /preview/i })
     ).toBeInTheDocument();
-    const preview = screen.getByRole('main', { name: /sketch output/i });
+    const preview = screen.getByTitle(/sketch preview/i);
     expect(preview).toBeInTheDocument();
   });
 
@@ -152,24 +152,27 @@ describe('index.jsx integration', () => {
     expect(screen.getByText('Sketch Files')).toBeInTheDocument();
   });
 
-  it('clicking on play updates the preview iframe with a srcdoc, stop clears it', () => {
-    const playButton = screen.getByRole('button', {
-      name: /play only visual sketch/i
-    });
-    const preview = screen.getByRole('main', { name: /sketch output/i });
-    expect(preview.getAttribute('srcdoc')).toBeFalsy();
-    act(() => {
-      fireEvent.click(playButton);
-    });
-
-    expect(preview.getAttribute('srcdoc')).toBeTruthy();
-
-    const stopButton = screen.getByRole('button', {
-      name: /stop sketch/i
-    });
-    act(() => {
-      fireEvent.click(stopButton);
-    });
-    expect(preview.getAttribute('srcdoc')).toMatch(/(^|")\s*($|")/);
-  });
+  // this test doesn't make sense anymore :/
+  // how to fix it? could check if sketch gets sent to iframe
+  // via postmessage or something
+  // it('clicking on play updates the preview iframe with a srcdoc, stop clears it', () => {
+  //   const playButton = screen.getByRole('button', {
+  //     name: /play only visual sketch/i
+  //   });
+  //   const preview = screen.getByRole('main', { name: /sketch preview/i });
+  //   expect(preview.getAttribute('srcdoc')).toBeFalsy();
+  //   act(() => {
+  //     fireEvent.click(playButton);
+  //   });
+
+  //   expect(preview.getAttribute('srcdoc')).toBeTruthy();
+
+  //   const stopButton = screen.getByRole('button', {
+  //     name: /stop sketch/i
+  //   });
+  //   act(() => {
+  //     fireEvent.click(stopButton);
+  //   });
+  //   expect(preview.getAttribute('srcdoc')).toMatch(/(^|")\s*($|")/);
+  // });
 });
diff --git a/client/modules/IDE/actions/ide.js b/client/modules/IDE/actions/ide.js
index 030d801e3b..80a43443bc 100644
--- a/client/modules/IDE/actions/ide.js
+++ b/client/modules/IDE/actions/ide.js
@@ -1,5 +1,6 @@
 import * as ActionTypes from '../../../constants';
 import { clearConsole } from './console';
+import { dispatchMessage, MessageTypes } from '../../../utils/dispatcher';
 
 export function startVisualSketch() {
   return {
@@ -248,9 +249,23 @@ export function showRuntimeErrorWarning() {
 }
 
 export function startSketch() {
-  return (dispatch) => {
+  return (dispatch, getState) => {
     dispatch(clearConsole());
-    dispatch(startSketchAndRefresh());
+    dispatch(startVisualSketch());
+    dispatch(showRuntimeErrorWarning());
+    const state = getState();
+    dispatchMessage({
+      type: MessageTypes.SKETCH,
+      payload: {
+        files: state.files,
+        basePath: window.location.pathname,
+        gridOutput: state.preferences.gridOutput,
+        textOutput: state.preferences.textOutput
+      }
+    });
+    dispatchMessage({
+      type: MessageTypes.START
+    });
   };
 }
 
@@ -264,6 +279,9 @@ export function startAccessibleSketch() {
 
 export function stopSketch() {
   return (dispatch) => {
+    dispatchMessage({
+      type: MessageTypes.STOP
+    });
     dispatch(stopAccessibleOutput());
     dispatch(stopVisualSketch());
   };
diff --git a/client/modules/IDE/actions/preferences.js b/client/modules/IDE/actions/preferences.js
index 68a4a23111..919a8c94f7 100644
--- a/client/modules/IDE/actions/preferences.js
+++ b/client/modules/IDE/actions/preferences.js
@@ -159,24 +159,6 @@ export function setGridOutput(value) {
   };
 }
 
-export function setSoundOutput(value) {
-  return (dispatch, getState) => {
-    dispatch({
-      type: ActionTypes.SET_SOUND_OUTPUT,
-      value
-    });
-    const state = getState();
-    if (state.user.authenticated) {
-      const formParams = {
-        preferences: {
-          soundOutput: value
-        }
-      };
-      updatePreferences(formParams, dispatch);
-    }
-  };
-}
-
 export function setTheme(value) {
   // return {
   //   type: ActionTypes.SET_THEME,
@@ -225,7 +207,6 @@ export function setAllAccessibleOutput(value) {
   return (dispatch) => {
     dispatch(setTextOutput(value));
     dispatch(setGridOutput(value));
-    dispatch(setSoundOutput(value));
   };
 }
 
diff --git a/client/modules/IDE/actions/project.js b/client/modules/IDE/actions/project.js
index e2931f3ff4..9a528a34f6 100644
--- a/client/modules/IDE/actions/project.js
+++ b/client/modules/IDE/actions/project.js
@@ -54,7 +54,7 @@ export function setNewProject(project) {
 export function getProject(id, username) {
   return (dispatch, getState) => {
     dispatch(justOpenedProject());
-    apiClient
+    return apiClient
       .get(`/${username}/projects/${id}`)
       .then((response) => {
         dispatch(setProject(response.data));
diff --git a/client/modules/IDE/components/ConsoleInput.jsx b/client/modules/IDE/components/ConsoleInput.jsx
index d70fcec087..759ccdd10d 100644
--- a/client/modules/IDE/components/ConsoleInput.jsx
+++ b/client/modules/IDE/components/ConsoleInput.jsx
@@ -4,7 +4,7 @@ import CodeMirror from 'codemirror';
 import { Encode } from 'console-feed';
 
 import RightArrowIcon from '../../../images/right-arrow.svg';
-import { dispatch } from '../../../utils/dispatcher';
+import { dispatchMessage, MessageTypes } from '../../../utils/dispatcher';
 
 // heavily inspired by
 // https://github.com/codesandbox/codesandbox-client/blob/92a1131f4ded6f7d9c16945dc7c18aa97c8ada27/packages/app/src/app/components/Preview/DevTools/Console/Input/index.tsx
@@ -19,7 +19,8 @@ class ConsoleInput extends React.Component {
   }
 
   componentDidMount() {
-    this._cm = CodeMirror(this.codemirrorContainer, { // eslint-disable-line
+    this._cm = CodeMirror(this.codemirrorContainer, {
+      // eslint-disable-line
       theme: `p5-${this.props.theme}`,
       scrollbarStyle: null,
       keymap: 'sublime',
@@ -39,9 +40,12 @@ class ConsoleInput extends React.Component {
           { log: Encode({ method: 'command', data: [value] }) }
         ];
         const consoleEvent = [{ method: 'command', data: [value] }];
-        dispatch({
-          source: 'console',
-          messages
+        dispatchMessage({
+          type: MessageTypes.EXECUTE,
+          payload: {
+            source: 'console',
+            messages
+          }
         });
         this.props.dispatchConsoleEvent(consoleEvent);
         cm.setValue('');
diff --git a/client/modules/IDE/components/Editor.jsx b/client/modules/IDE/components/Editor.jsx
index 3aace17d7e..e7e82fa8ae 100644
--- a/client/modules/IDE/components/Editor.jsx
+++ b/client/modules/IDE/components/Editor.jsx
@@ -7,6 +7,7 @@ import babelParser from 'prettier/parser-babel';
 import htmlParser from 'prettier/parser-html';
 import cssParser from 'prettier/parser-postcss';
 import { withTranslation } from 'react-i18next';
+import StackTrace from 'stacktrace-js';
 import 'codemirror/mode/css/css';
 import 'codemirror/addon/selection/active-line';
 import 'codemirror/addon/lint/lint';
@@ -115,7 +116,6 @@ class Editor extends React.Component {
       styleSelectedText: true,
       lint: {
         onUpdateLinting: (annotations) => {
-          this.props.hideRuntimeErrorWarning();
           this.updateLintingMessageAccessibility(annotations);
         },
         options: {
@@ -159,10 +159,11 @@ class Editor extends React.Component {
       'change',
       debounce(() => {
         this.props.setUnsavedChanges(true);
+        this.props.hideRuntimeErrorWarning();
         this.props.updateFileContent(this.props.file.id, this._cm.getValue());
         if (this.props.autorefresh && this.props.isPlaying) {
           this.props.clearConsole();
-          this.props.startRefreshSketch();
+          this.props.startSketch();
         }
       }, 1000)
     );
@@ -246,41 +247,45 @@ class Editor extends React.Component {
       );
     }
 
-    if (prevProps.consoleEvents !== this.props.consoleEvents) {
-      this.props.showRuntimeErrorWarning();
-    }
-    for (let i = 0; i < this._cm.lineCount(); i += 1) {
-      this._cm.removeLineClass(i, 'background', 'line-runtime-error');
-    }
     if (this.props.runtimeErrorWarningVisible) {
-      this.props.consoleEvents.forEach((consoleEvent) => {
-        if (consoleEvent.method === 'error') {
-          if (
-            consoleEvent.data &&
-            consoleEvent.data[0] &&
-            consoleEvent.data[0].indexOf &&
-            consoleEvent.data[0].indexOf(')') > -1
-          ) {
-            const n = consoleEvent.data[0].replace(')', '').split(' ');
-            const lineNumber = parseInt(n[n.length - 1], 10) - 1;
-            const { source } = consoleEvent;
-            const fileName = this.props.file.name;
-            const errorFromJavaScriptFile = `${source}.js` === fileName;
-            const errorFromIndexHTML =
-              source === fileName && fileName === 'index.html';
-            if (
-              !Number.isNaN(lineNumber) &&
-              (errorFromJavaScriptFile || errorFromIndexHTML)
-            ) {
+      if (this.props.consoleEvents.length !== prevProps.consoleEvents.length) {
+        this.props.consoleEvents.forEach((consoleEvent) => {
+          if (consoleEvent.method === 'error') {
+            // It doesn't work if you create a new Error, but this works
+            // LOL
+            const errorObj = { stack: consoleEvent.data[0].toString() };
+            StackTrace.fromError(errorObj).then((stackLines) => {
+              this.props.expandConsole();
+              const line = stackLines.find(
+                (l) => l.fileName && l.fileName.startsWith('/')
+              );
+              if (!line) return;
+              const fileNameArray = line.fileName.split('/');
+              const fileName = fileNameArray.slice(-1)[0];
+              const filePath = fileNameArray.slice(0, -1).join('/');
+              const fileWithError = this.props.files.find(
+                (f) => f.name === fileName && f.filePath === filePath
+              );
+              this.props.setSelectedFile(fileWithError.id);
               this._cm.addLineClass(
-                lineNumber,
+                line.lineNumber - 1,
                 'background',
                 'line-runtime-error'
               );
-            }
+            });
           }
+        });
+      } else {
+        for (let i = 0; i < this._cm.lineCount(); i += 1) {
+          this._cm.removeLineClass(i, 'background', 'line-runtime-error');
         }
-      });
+      }
+    }
+
+    if (this.props.file.id !== prevProps.file.id) {
+      for (let i = 0; i < this._cm.lineCount(); i += 1) {
+        this._cm.removeLineClass(i, 'background', 'line-runtime-error');
+      }
     }
   }
 
@@ -440,7 +445,7 @@ Editor.propTypes = {
       method: PropTypes.string.isRequired,
       args: PropTypes.arrayOf(PropTypes.string)
     })
-  ),
+  ).isRequired,
   updateLintMessage: PropTypes.func.isRequired,
   clearLintMessage: PropTypes.func.isRequired,
   updateFileContent: PropTypes.func.isRequired,
@@ -453,7 +458,7 @@ Editor.propTypes = {
     url: PropTypes.string
   }).isRequired,
   setUnsavedChanges: PropTypes.func.isRequired,
-  startRefreshSketch: PropTypes.func.isRequired,
+  startSketch: PropTypes.func.isRequired,
   autorefresh: PropTypes.bool.isRequired,
   isPlaying: PropTypes.bool.isRequired,
   theme: PropTypes.string.isRequired,
@@ -471,15 +476,13 @@ Editor.propTypes = {
   expandSidebar: PropTypes.func.isRequired,
   isUserOwner: PropTypes.bool.isRequired,
   clearConsole: PropTypes.func.isRequired,
-  showRuntimeErrorWarning: PropTypes.func.isRequired,
+  // showRuntimeErrorWarning: PropTypes.func.isRequired,
   hideRuntimeErrorWarning: PropTypes.func.isRequired,
   runtimeErrorWarningVisible: PropTypes.bool.isRequired,
   provideController: PropTypes.func.isRequired,
-  t: PropTypes.func.isRequired
-};
-
-Editor.defaultProps = {
-  consoleEvents: []
+  t: PropTypes.func.isRequired,
+  setSelectedFile: PropTypes.func.isRequired,
+  expandConsole: PropTypes.func.isRequired
 };
 
 function mapStateToProps(state) {
@@ -496,7 +499,7 @@ function mapStateToProps(state) {
     user: state.user,
     project: state.project,
     toast: state.toast,
-    console: state.console,
+    consoleEvents: state.console,
 
     ...state.preferences,
     ...state.ide,
diff --git a/client/modules/IDE/components/Preferences/index.jsx b/client/modules/IDE/components/Preferences/index.jsx
index a6729add15..69b2cb43c5 100644
--- a/client/modules/IDE/components/Preferences/index.jsx
+++ b/client/modules/IDE/components/Preferences/index.jsx
@@ -437,23 +437,6 @@ class Preferences extends React.Component {
                 >
                   {this.props.t('Preferences.TableText')}
                 </label>
-                <input
-                  type="checkbox"
-                  onChange={(event) => {
-                    this.props.setSoundOutput(event.target.checked);
-                  }}
-                  aria-label={this.props.t('Preferences.SoundOutputARIA')}
-                  name="sound output"
-                  id="sound-output-on"
-                  value="On"
-                  checked={this.props.soundOutput}
-                />
-                <label
-                  htmlFor="sound-output-on"
-                  className="preference__option preference__canvas"
-                >
-                  {this.props.t('Preferences.Sound')}
-                </label>
               </div>
             </div>
           </TabPanel>
@@ -474,10 +457,8 @@ Preferences.propTypes = {
   setLinewrap: PropTypes.func.isRequired,
   textOutput: PropTypes.bool.isRequired,
   gridOutput: PropTypes.bool.isRequired,
-  soundOutput: PropTypes.bool.isRequired,
   setTextOutput: PropTypes.func.isRequired,
   setGridOutput: PropTypes.func.isRequired,
-  setSoundOutput: PropTypes.func.isRequired,
   lintWarning: PropTypes.bool.isRequired,
   setLintWarning: PropTypes.func.isRequired,
   theme: PropTypes.string.isRequired,
diff --git a/client/modules/IDE/components/PreviewFrame.jsx b/client/modules/IDE/components/PreviewFrame.jsx
index ea5cee18b0..2a23cbd4ec 100644
--- a/client/modules/IDE/components/PreviewFrame.jsx
+++ b/client/modules/IDE/components/PreviewFrame.jsx
@@ -1,452 +1,54 @@
+import React, { useRef, useEffect } from 'react';
 import PropTypes from 'prop-types';
-import React from 'react';
-import ReactDOM from 'react-dom';
-// import escapeStringRegexp from 'escape-string-regexp';
-import srcDoc from 'srcdoc-polyfill';
-import loopProtect from 'loop-protect';
-import { JSHINT } from 'jshint';
-import decomment from 'decomment';
-import classNames from 'classnames';
-import { connect } from 'react-redux';
-import { getBlobUrl } from '../actions/files';
-import { resolvePathToFile } from '../../../../server/utils/filePath';
-import {
-  MEDIA_FILE_REGEX,
-  MEDIA_FILE_QUOTED_REGEX,
-  STRING_REGEX,
-  PLAINTEXT_FILE_REGEX,
-  EXTERNAL_LINK_REGEX,
-  NOT_EXTERNAL_LINK_REGEX
-} from '../../../../server/utils/fileUtils';
-import {
-  hijackConsoleErrorsScript,
-  startTag,
-  getAllScriptOffsets
-} from '../../../utils/consoleUtils';
-import { registerFrame } from '../../../utils/dispatcher';
-
-import { getHTMLFile } from '../reducers/files';
-
-import { stopSketch, expandConsole, endSketchRefresh } from '../actions/ide';
-import {
-  setTextOutput,
-  setGridOutput,
-  setSoundOutput
-} from '../actions/preferences';
-import { setBlobUrl } from '../actions/files';
-import { clearConsole, dispatchConsoleEvent } from '../actions/console';
+import styled from 'styled-components';
 import getConfig from '../../../utils/getConfig';
+import { registerFrame } from '../../../utils/dispatcher';
 
-const shouldRenderSketch = (props, prevProps = undefined) => {
-  const { isPlaying, previewIsRefreshing, fullView } = props;
-
-  // if the user explicitly clicks on the play button
-  if (isPlaying && previewIsRefreshing) return true;
-
-  if (!prevProps) return false;
+const Frame = styled.iframe`
+  min-height: 100%;
+  min-width: 100%;
+  position: ${(props) => (props.fullView ? 'relative' : 'absolute')};
+  border-width: 0;
+`;
+
+function PreviewFrame({ fullView }) {
+  const iframe = useRef();
+  const previewUrl = getConfig('PREVIEW_URL');
+  useEffect(() => {
+    const unsubscribe = registerFrame(iframe.current.contentWindow, previewUrl);
+    return () => {
+      unsubscribe();
+    };
+  });
 
+  const frameUrl = previewUrl;
+  const sandboxAttributes = `allow-forms allow-modals allow-pointer-lock allow-popups 
+    allow-same-origin allow-scripts allow-top-navigation-by-user-activation`;
+  const allow =
+    'accelerometer; autoplay; camera; encrypted-media; geolocation; gyroscope; microphone; magnetometer; midi; vr;';
   return (
-    props.isPlaying !== prevProps.isPlaying || // if sketch starts or stops playing, want to rerender
-    props.isAccessibleOutputPlaying !== prevProps.isAccessibleOutputPlaying || // if user switches textoutput preferences
-    props.textOutput !== prevProps.textOutput ||
-    props.gridOutput !== prevProps.gridOutput ||
-    props.soundOutput !== prevProps.soundOutput ||
-    (fullView && props.files[0].id !== prevProps.files[0].id)
+    <Frame
+      title="sketch preview"
+      src={frameUrl}
+      sandbox={sandboxAttributes}
+      allow={allow}
+      scrolling="auto"
+      allowtransparency
+      allowpaymentrequest
+      allowFullScreen
+      frameBorder="0"
+      ref={iframe}
+      fullView={fullView}
+    />
   );
-};
-
-class PreviewFrame extends React.Component {
-  constructor(props) {
-    super(props);
-
-    this.iframe = React.createRef();
-  }
-
-  componentDidMount() {
-    const props = {
-      ...this.props,
-      previewIsRefreshing: this.props.previewIsRefreshing,
-      isAccessibleOutputPlaying: this.props.isAccessibleOutputPlaying
-    };
-    if (shouldRenderSketch(props)) this.renderSketch();
-    registerFrame(this.iframe.current.contentWindow);
-  }
-
-  componentDidUpdate(prevProps) {
-    if (shouldRenderSketch(this.props, prevProps)) this.renderSketch();
-    // small bug - if autorefresh is on, and the usr changes files
-    // in the sketch, preview will reload
-  }
-
-  componentWillUnmount() {
-    const iframeBody = this.iframe.current.contentDocument.body;
-    if (iframeBody) {
-      ReactDOM.unmountComponentAtNode(iframeBody);
-    }
-  }
-
-  addLoopProtect(sketchDoc) {
-    const scriptsInHTML = sketchDoc.getElementsByTagName('script');
-    const scriptsInHTMLArray = Array.prototype.slice.call(scriptsInHTML);
-    scriptsInHTMLArray.forEach((script) => {
-      script.innerHTML = this.jsPreprocess(script.innerHTML); // eslint-disable-line
-    });
-  }
-
-  jsPreprocess(jsText) {
-    let newContent = jsText;
-    // check the code for js errors before sending it to strip comments
-    // or loops.
-    JSHINT(newContent);
-
-    if (JSHINT.errors.length === 0) {
-      newContent = decomment(newContent, {
-        ignore: /\/\/\s*noprotect/g,
-        space: true
-      });
-      newContent = loopProtect(newContent);
-    }
-    return newContent;
-  }
-
-  mergeLocalFilesAndEditorActiveFile() {
-    const files = this.props.files.slice();
-    if (this.props.cmController.getContent) {
-      const activeFileInEditor = this.props.cmController.getContent();
-      files.find((file) => file.id === activeFileInEditor.id).content =
-        activeFileInEditor.content;
-    }
-    return files;
-  }
-
-  injectLocalFiles() {
-    const htmlFile = this.props.htmlFile.content;
-    let scriptOffs = [];
-    const files = this.mergeLocalFilesAndEditorActiveFile();
-    const resolvedFiles = this.resolveJSAndCSSLinks(files);
-    const parser = new DOMParser();
-    const sketchDoc = parser.parseFromString(htmlFile, 'text/html');
-
-    const base = sketchDoc.createElement('base');
-    base.href = `${window.location.href}/`;
-    sketchDoc.head.appendChild(base);
-
-    this.resolvePathsForElementsWithAttribute('src', sketchDoc, resolvedFiles);
-    this.resolvePathsForElementsWithAttribute('href', sketchDoc, resolvedFiles);
-    // should also include background, data, poster, but these are used way less often
-
-    this.resolveScripts(sketchDoc, resolvedFiles);
-    this.resolveStyles(sketchDoc, resolvedFiles);
-
-    const accessiblelib = sketchDoc.createElement('script');
-    accessiblelib.setAttribute(
-      'src',
-      'https://cdn.rawgit.com/processing/p5.accessibility/v0.1.1/dist/p5-accessibility.js'
-    );
-    const accessibleOutputs = sketchDoc.createElement('section');
-    accessibleOutputs.setAttribute('id', 'accessible-outputs');
-    accessibleOutputs.setAttribute('aria-label', 'accessible-output');
-    if (this.props.textOutput) {
-      sketchDoc.body.appendChild(accessibleOutputs);
-      sketchDoc.body.appendChild(accessiblelib);
-      const textSection = sketchDoc.createElement('section');
-      textSection.setAttribute('id', 'textOutput-content');
-      sketchDoc.getElementById('accessible-outputs').appendChild(textSection);
-    }
-    if (this.props.gridOutput) {
-      sketchDoc.body.appendChild(accessibleOutputs);
-      sketchDoc.body.appendChild(accessiblelib);
-      const gridSection = sketchDoc.createElement('section');
-      gridSection.setAttribute('id', 'tableOutput-content');
-      sketchDoc.getElementById('accessible-outputs').appendChild(gridSection);
-    }
-    if (this.props.soundOutput) {
-      sketchDoc.body.appendChild(accessibleOutputs);
-      sketchDoc.body.appendChild(accessiblelib);
-      const soundSection = sketchDoc.createElement('section');
-      soundSection.setAttribute('id', 'soundOutput-content');
-      sketchDoc.getElementById('accessible-outputs').appendChild(soundSection);
-    }
-
-    const previewScripts = sketchDoc.createElement('script');
-    previewScripts.src = getConfig('PREVIEW_SCRIPTS_URL');
-    sketchDoc.head.appendChild(previewScripts);
-
-    const sketchDocString = `<!DOCTYPE HTML>\n${sketchDoc.documentElement.outerHTML}`;
-    scriptOffs = getAllScriptOffsets(sketchDocString);
-    const consoleErrorsScript = sketchDoc.createElement('script');
-    consoleErrorsScript.innerHTML = hijackConsoleErrorsScript(
-      JSON.stringify(scriptOffs)
-    );
-    this.addLoopProtect(sketchDoc);
-    sketchDoc.head.insertBefore(
-      consoleErrorsScript,
-      sketchDoc.head.firstElement
-    );
-
-    return `<!DOCTYPE HTML>\n${sketchDoc.documentElement.outerHTML}`;
-  }
-
-  resolvePathsForElementsWithAttribute(attr, sketchDoc, files) {
-    const elements = sketchDoc.querySelectorAll(`[${attr}]`);
-    const elementsArray = Array.prototype.slice.call(elements);
-    elementsArray.forEach((element) => {
-      if (element.getAttribute(attr).match(MEDIA_FILE_REGEX)) {
-        const resolvedFile = resolvePathToFile(
-          element.getAttribute(attr),
-          files
-        );
-        if (resolvedFile && resolvedFile.url) {
-          element.setAttribute(attr, resolvedFile.url);
-        }
-      }
-    });
-  }
-
-  resolveJSAndCSSLinks(files) {
-    const newFiles = [];
-    files.forEach((file) => {
-      const newFile = { ...file };
-      if (file.name.match(/.*\.js$/i)) {
-        newFile.content = this.resolveJSLinksInString(newFile.content, files);
-      } else if (file.name.match(/.*\.css$/i)) {
-        newFile.content = this.resolveCSSLinksInString(newFile.content, files);
-      }
-      newFiles.push(newFile);
-    });
-    return newFiles;
-  }
-
-  resolveJSLinksInString(content, files) {
-    let newContent = content;
-    let jsFileStrings = content.match(STRING_REGEX);
-    jsFileStrings = jsFileStrings || [];
-    jsFileStrings.forEach((jsFileString) => {
-      if (jsFileString.match(MEDIA_FILE_QUOTED_REGEX)) {
-        const filePath = jsFileString.substr(1, jsFileString.length - 2);
-        const quoteCharacter = jsFileString.substr(0, 1);
-        const resolvedFile = resolvePathToFile(filePath, files);
-
-        if (resolvedFile) {
-          if (resolvedFile.url) {
-            newContent = newContent.replace(
-              jsFileString,
-              quoteCharacter + resolvedFile.url + quoteCharacter
-            );
-          } else if (resolvedFile.name.match(PLAINTEXT_FILE_REGEX)) {
-            // could also pull file from API instead of using bloburl
-            const blobURL = getBlobUrl(resolvedFile);
-            this.props.setBlobUrl(resolvedFile, blobURL);
-
-            newContent = newContent.replace(
-              jsFileString,
-              quoteCharacter + blobURL + quoteCharacter
-            );
-          }
-        }
-      }
-    });
-
-    return this.jsPreprocess(newContent);
-  }
-
-  resolveCSSLinksInString(content, files) {
-    let newContent = content;
-    let cssFileStrings = content.match(STRING_REGEX);
-    cssFileStrings = cssFileStrings || [];
-    cssFileStrings.forEach((cssFileString) => {
-      if (cssFileString.match(MEDIA_FILE_QUOTED_REGEX)) {
-        const filePath = cssFileString.substr(1, cssFileString.length - 2);
-        const quoteCharacter = cssFileString.substr(0, 1);
-        const resolvedFile = resolvePathToFile(filePath, files);
-        if (resolvedFile) {
-          if (resolvedFile.url) {
-            newContent = newContent.replace(
-              cssFileString,
-              quoteCharacter + resolvedFile.url + quoteCharacter
-            );
-          }
-        }
-      }
-    });
-    return newContent;
-  }
-
-  resolveScripts(sketchDoc, files) {
-    const scriptsInHTML = sketchDoc.getElementsByTagName('script');
-    const scriptsInHTMLArray = Array.prototype.slice.call(scriptsInHTML);
-    scriptsInHTMLArray.forEach((script) => {
-      if (
-        script.getAttribute('src') &&
-        script.getAttribute('src').match(NOT_EXTERNAL_LINK_REGEX) !== null
-      ) {
-        const resolvedFile = resolvePathToFile(
-          script.getAttribute('src'),
-          files
-        );
-        if (resolvedFile) {
-          if (resolvedFile.url) {
-            script.setAttribute('src', resolvedFile.url);
-          } else {
-            script.setAttribute('data-tag', `${startTag}${resolvedFile.name}`);
-            script.removeAttribute('src');
-            script.innerHTML = resolvedFile.content; // eslint-disable-line
-          }
-        }
-      } else if (
-        !(
-          script.getAttribute('src') &&
-          script.getAttribute('src').match(EXTERNAL_LINK_REGEX)
-        ) !== null
-      ) {
-        script.setAttribute('crossorigin', '');
-        script.innerHTML = this.resolveJSLinksInString(script.innerHTML, files); // eslint-disable-line
-      }
-    });
-  }
-
-  resolveStyles(sketchDoc, files) {
-    const inlineCSSInHTML = sketchDoc.getElementsByTagName('style');
-    const inlineCSSInHTMLArray = Array.prototype.slice.call(inlineCSSInHTML);
-    inlineCSSInHTMLArray.forEach((style) => {
-      style.innerHTML = this.resolveCSSLinksInString(style.innerHTML, files); // eslint-disable-line
-    });
-
-    const cssLinksInHTML = sketchDoc.querySelectorAll('link[rel="stylesheet"]');
-    const cssLinksInHTMLArray = Array.prototype.slice.call(cssLinksInHTML);
-    cssLinksInHTMLArray.forEach((css) => {
-      if (
-        css.getAttribute('href') &&
-        css.getAttribute('href').match(NOT_EXTERNAL_LINK_REGEX) !== null
-      ) {
-        const resolvedFile = resolvePathToFile(css.getAttribute('href'), files);
-        if (resolvedFile) {
-          if (resolvedFile.url) {
-            css.href = resolvedFile.url; // eslint-disable-line
-          } else {
-            const style = sketchDoc.createElement('style');
-            style.innerHTML = `\n${resolvedFile.content}`;
-            sketchDoc.head.appendChild(style);
-            css.parentElement.removeChild(css);
-          }
-        }
-      }
-    });
-  }
-
-  renderSketch() {
-    const doc = this.iframe.current;
-    const localFiles = this.injectLocalFiles();
-    if (this.props.isPlaying) {
-      this.props.clearConsole();
-      srcDoc.set(doc, localFiles);
-      if (this.props.endSketchRefresh) {
-        this.props.endSketchRefresh();
-      }
-    } else {
-      doc.srcdoc = '';
-      srcDoc.set(doc, '  ');
-    }
-  }
-
-  render() {
-    const iframeClass = classNames({
-      'preview-frame': true,
-      'preview-frame--full-view': this.props.fullView
-    });
-    const sandboxAttributes =
-      'allow-scripts allow-pointer-lock allow-same-origin allow-popups allow-forms allow-modals allow-downloads';
-    return (
-      <iframe
-        id="canvas_frame"
-        className={iframeClass}
-        aria-label="sketch output"
-        role="main"
-        frameBorder="0"
-        title="sketch preview"
-        ref={this.iframe}
-        sandbox={sandboxAttributes}
-      />
-    );
-  }
 }
 
 PreviewFrame.propTypes = {
-  isPlaying: PropTypes.bool.isRequired,
-  isAccessibleOutputPlaying: PropTypes.bool.isRequired,
-  textOutput: PropTypes.bool.isRequired,
-  gridOutput: PropTypes.bool.isRequired,
-  soundOutput: PropTypes.bool.isRequired,
-  htmlFile: PropTypes.shape({
-    content: PropTypes.string.isRequired
-  }).isRequired,
-  files: PropTypes.arrayOf(
-    PropTypes.shape({
-      content: PropTypes.string.isRequired,
-      name: PropTypes.string.isRequired,
-      url: PropTypes.string,
-      id: PropTypes.string.isRequired
-    })
-  ).isRequired,
-  endSketchRefresh: PropTypes.func.isRequired,
-  previewIsRefreshing: PropTypes.bool.isRequired,
-  fullView: PropTypes.bool,
-  setBlobUrl: PropTypes.func.isRequired,
-  clearConsole: PropTypes.func.isRequired,
-  cmController: PropTypes.shape({
-    getContent: PropTypes.func
-  })
+  fullView: PropTypes.bool
 };
 
 PreviewFrame.defaultProps = {
-  fullView: false,
-  cmController: {}
-};
-
-function mapStateToProps(state, ownProps) {
-  if (ownProps.fullView) {
-    return {
-      files: state.files,
-      htmlFile: getHTMLFile(state.files),
-      isPlaying: true,
-      isAccessibleOutputPlaying: false,
-      textOutput: false,
-      gridOutput: false,
-      soundOutput: false,
-      language: state.preferences.language,
-      autorefresh: false,
-      previewIsRefreshing: false
-    };
-  }
-  return {
-    files: state.files,
-    htmlFile: getHTMLFile(state.files),
-    content: (
-      state.files.find((file) => file.isSelectedFile) ||
-      state.files.find((file) => file.name === 'sketch.js') ||
-      state.files.find((file) => file.name !== 'root')
-    ).content,
-    isPlaying: state.ide.isPlaying,
-    isAccessibleOutputPlaying: state.ide.isAccessibleOutputPlaying,
-    previewIsRefreshing: state.ide.previewIsRefreshing,
-    textOutput: state.preferences.textOutput,
-    gridOutput: state.preferences.gridOutput,
-    soundOutput: state.preferences.soundOutput,
-    language: state.preferences.language,
-    autorefresh: state.preferences.autorefresh
-  };
-}
-
-const mapDispatchToProps = {
-  stopSketch,
-  expandConsole,
-  endSketchRefresh,
-  setTextOutput,
-  setGridOutput,
-  setSoundOutput,
-  setBlobUrl,
-  clearConsole,
-  dispatchConsoleEvent
+  fullView: false
 };
 
-export default connect(mapStateToProps, mapDispatchToProps)(PreviewFrame);
+export default PreviewFrame;
diff --git a/client/modules/IDE/components/ShareModal.jsx b/client/modules/IDE/components/ShareModal.jsx
index ea947e88ad..6f029437b0 100644
--- a/client/modules/IDE/components/ShareModal.jsx
+++ b/client/modules/IDE/components/ShareModal.jsx
@@ -2,22 +2,24 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import { withTranslation } from 'react-i18next';
 import CopyableInput from './CopyableInput';
+import getConfig from '../../../utils/getConfig';
 
 class ShareModal extends React.PureComponent {
   render() {
     const { projectId, ownerUsername, projectName } = this.props;
     const hostname = window.location.origin;
+    const previewUrl = getConfig('PREVIEW_URL');
     return (
       <div className="share-modal">
         <h3 className="share-modal__project-name">{projectName}</h3>
         <CopyableInput
           label={this.props.t('ShareModal.Embed')}
-          value={`<iframe src="${hostname}/${ownerUsername}/embed/${projectId}"></iframe>`}
+          value={`<iframe src="${previewUrl}/${ownerUsername}/embed/${projectId}"></iframe>`}
         />
         <CopyableInput
           label={this.props.t('ShareModal.Present')}
           hasPreviewLink
-          value={`${hostname}/${ownerUsername}/present/${projectId}`}
+          value={`${previewUrl}/${ownerUsername}/present/${projectId}`}
         />
         <CopyableInput
           label={this.props.t('ShareModal.Fullscreen')}
diff --git a/client/modules/IDE/components/Toolbar.jsx b/client/modules/IDE/components/Toolbar.jsx
index f87d80bf34..ed3acd650b 100644
--- a/client/modules/IDE/components/Toolbar.jsx
+++ b/client/modules/IDE/components/Toolbar.jsx
@@ -87,6 +87,7 @@ class Toolbar extends React.Component {
         <button
           className="toolbar__play-sketch-button"
           onClick={() => {
+            this.props.syncFileContent();
             this.props.startAccessibleSketch();
             this.props.setTextOutput(true);
             this.props.setGridOutput(true);
@@ -98,7 +99,10 @@ class Toolbar extends React.Component {
         </button>
         <button
           className={playButtonClass}
-          onClick={this.props.startSketch}
+          onClick={() => {
+            this.props.syncFileContent();
+            this.props.startSketch();
+          }}
           aria-label={this.props.t('Toolbar.PlayOnlyVisualSketchARIA')}
           disabled={this.props.infiniteLoop}
         >
@@ -159,7 +163,7 @@ class Toolbar extends React.Component {
             onBlur={this.handleProjectNameSave}
             onKeyPress={this.handleKeyPress}
           />
-          {(() => { // eslint-disable-line
+          {(() => {
             if (this.props.owner) {
               return (
                 <p className="toolbar__project-owner">
@@ -170,6 +174,7 @@ class Toolbar extends React.Component {
                 </p>
               );
             }
+            return null;
           })()}
         </div>
         <button
@@ -209,7 +214,8 @@ Toolbar.propTypes = {
   startAccessibleSketch: PropTypes.func.isRequired,
   saveProject: PropTypes.func.isRequired,
   currentUser: PropTypes.string,
-  t: PropTypes.func.isRequired
+  t: PropTypes.func.isRequired,
+  syncFileContent: PropTypes.func.isRequired
 };
 
 Toolbar.defaultProps = {
diff --git a/client/modules/IDE/hooks/useInterval.js b/client/modules/IDE/hooks/useInterval.js
new file mode 100644
index 0000000000..63ddaf5503
--- /dev/null
+++ b/client/modules/IDE/hooks/useInterval.js
@@ -0,0 +1,26 @@
+// https://overreacted.io/making-setinterval-declarative-with-react-hooks/
+import { useState, useEffect, useRef } from 'react';
+
+export default function useInterval(callback, delay) {
+  const savedCallback = useRef();
+  const [intervalId, setIntervalId] = useState();
+
+  // Remember the latest callback.
+  useEffect(() => {
+    savedCallback.current = callback;
+  }, [callback]);
+
+  // Set up the interval.
+  useEffect(() => {
+    function tick() {
+      savedCallback.current();
+    }
+    if (delay !== null) {
+      const id = setInterval(tick, delay);
+      setIntervalId(id);
+      return () => clearInterval(id);
+    }
+    return null;
+  }, [delay]);
+  return () => clearInterval(intervalId);
+}
diff --git a/client/modules/IDE/pages/FullView.jsx b/client/modules/IDE/pages/FullView.jsx
index d635124dc0..dcbd44edd7 100644
--- a/client/modules/IDE/pages/FullView.jsx
+++ b/client/modules/IDE/pages/FullView.jsx
@@ -1,67 +1,75 @@
 import PropTypes from 'prop-types';
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import Helmet from 'react-helmet';
-import { bindActionCreators } from 'redux';
-import { connect } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
 import PreviewFrame from '../components/PreviewFrame';
 import PreviewNav from '../../../components/PreviewNav';
-import * as ProjectActions from '../actions/project';
+import { getProject } from '../actions/project';
+import { startSketch } from '../actions/ide';
+import {
+  listen,
+  dispatchMessage,
+  MessageTypes
+} from '../../../utils/dispatcher';
+import useInterval from '../hooks/useInterval';
 
-class FullView extends React.Component {
-  componentDidMount() {
-    this.props.getProject(
-      this.props.params.project_id,
-      this.props.params.username
-    );
+function FullView(props) {
+  const dispatch = useDispatch();
+  const project = useSelector((state) => state.project);
+
+  useEffect(() => {
+    dispatch(getProject(props.params.project_id, props.params.username));
+  }, []);
+
+  // send register event until iframe is loaded and sends a message back.
+  const [isRendered, setIsRendered] = useState(false);
+  const clearInterval = useInterval(() => {
+    dispatchMessage({ type: MessageTypes.REGISTER });
+  }, 100);
+  if (isRendered) {
+    clearInterval();
   }
 
-  render() {
-    return (
-      <div className="fullscreen-preview">
-        <Helmet>
-          <title>{this.props.project.name}</title>
-        </Helmet>
-        <PreviewNav
-          owner={{
-            username: this.props.project.owner
-              ? `${this.props.project.owner.username}`
-              : ''
-          }}
-          project={{
-            name: this.props.project.name,
-            id: this.props.params.project_id
-          }}
-        />
-        <main className="preview-frame-holder">
-          <PreviewFrame fullView />
-        </main>
-      </div>
-    );
+  function handleMessageEvent(message) {
+    if (message.type === MessageTypes.REGISTER) {
+      if (!isRendered) {
+        setIsRendered(true);
+        dispatch(startSketch());
+      }
+    }
   }
+  useEffect(() => {
+    const unsubscribe = listen(handleMessageEvent);
+    return function cleanup() {
+      unsubscribe();
+    };
+  }, []);
+  return (
+    <div className="fullscreen-preview">
+      <Helmet>
+        <title>{project.name}</title>
+      </Helmet>
+      <PreviewNav
+        owner={{
+          username: project.owner ? `${project.owner.username}` : ''
+        }}
+        project={{
+          name: project.name,
+          id: props.params.project_id
+        }}
+      />
+      <main className="preview-frame-holder">
+        <PreviewFrame fullView />
+      </main>
+    </div>
+  );
 }
 
 FullView.propTypes = {
   params: PropTypes.shape({
     project_id: PropTypes.string,
     username: PropTypes.string
-  }).isRequired,
-  project: PropTypes.shape({
-    name: PropTypes.string,
-    owner: PropTypes.shape({
-      username: PropTypes.string
-    })
-  }).isRequired,
-  getProject: PropTypes.func.isRequired
+  }).isRequired
 };
 
-function mapStateToProps(state) {
-  return {
-    project: state.project
-  };
-}
-
-function mapDispatchToProps(dispatch) {
-  return bindActionCreators(ProjectActions, dispatch);
-}
-
-export default connect(mapStateToProps, mapDispatchToProps)(FullView);
+export default FullView;
diff --git a/client/modules/IDE/pages/IDEView.jsx b/client/modules/IDE/pages/IDEView.jsx
index a3b40d3b72..c7891c3697 100644
--- a/client/modules/IDE/pages/IDEView.jsx
+++ b/client/modules/IDE/pages/IDEView.jsx
@@ -185,6 +185,7 @@ class IDEView extends React.Component {
     ) {
       e.preventDefault();
       e.stopPropagation();
+      this.syncFileContent();
       this.props.startSketch();
       // 50 === 2
     } else if (
@@ -242,6 +243,11 @@ class IDEView extends React.Component {
     return null;
   };
 
+  syncFileContent = () => {
+    const file = this.cmController.getContent();
+    this.props.updateFileContent(file.id, file.content);
+  };
+
   render() {
     return (
       <div className="ide">
@@ -253,7 +259,10 @@ class IDEView extends React.Component {
           warnIfUnsavedChanges={this.handleUnsavedChanges}
           cmController={this.cmController}
         />
-        <Toolbar key={this.props.project.id} />
+        <Toolbar
+          syncFileContent={this.syncFileContent}
+          key={this.props.project.id}
+        />
         {this.props.ide.preferencesIsVisible && (
           <Overlay
             title={this.props.t('Preferences.Settings')}
@@ -273,10 +282,8 @@ class IDEView extends React.Component {
               setLintWarning={this.props.setLintWarning}
               textOutput={this.props.preferences.textOutput}
               gridOutput={this.props.preferences.gridOutput}
-              soundOutput={this.props.preferences.soundOutput}
               setTextOutput={this.props.setTextOutput}
               setGridOutput={this.props.setGridOutput}
-              setSoundOutput={this.props.setSoundOutput}
               theme={this.props.preferences.theme}
               setTheme={this.props.setTheme}
               autocloseBracketsQuotes={
@@ -360,8 +367,7 @@ class IDEView extends React.Component {
                   />
                   <div>
                     {((this.props.preferences.textOutput ||
-                      this.props.preferences.gridOutput ||
-                      this.props.preferences.soundOutput) &&
+                      this.props.preferences.gridOutput) &&
                       this.props.ide.isPlaying) ||
                       this.props.ide.isAccessibleOutputPlaying}
                   </div>
@@ -505,7 +511,6 @@ IDEView.propTypes = {
     lintWarning: PropTypes.bool.isRequired,
     textOutput: PropTypes.bool.isRequired,
     gridOutput: PropTypes.bool.isRequired,
-    soundOutput: PropTypes.bool.isRequired,
     theme: PropTypes.string.isRequired,
     autorefresh: PropTypes.bool.isRequired,
     language: PropTypes.string.isRequired,
@@ -520,7 +525,6 @@ IDEView.propTypes = {
   setLintWarning: PropTypes.func.isRequired,
   setTextOutput: PropTypes.func.isRequired,
   setGridOutput: PropTypes.func.isRequired,
-  setSoundOutput: PropTypes.func.isRequired,
   setAllAccessibleOutput: PropTypes.func.isRequired,
   files: PropTypes.arrayOf(
     PropTypes.shape({
@@ -548,6 +552,7 @@ IDEView.propTypes = {
   collapseConsole: PropTypes.func.isRequired,
   deleteFile: PropTypes.func.isRequired,
   updateFileName: PropTypes.func.isRequired,
+  updateFileContent: PropTypes.func.isRequired,
   openProjectOptions: PropTypes.func.isRequired,
   closeProjectOptions: PropTypes.func.isRequired,
   newFolder: PropTypes.func.isRequired,
diff --git a/client/modules/IDE/reducers/files.js b/client/modules/IDE/reducers/files.js
index 90bd1fc429..b0ce897483 100644
--- a/client/modules/IDE/reducers/files.js
+++ b/client/modules/IDE/reducers/files.js
@@ -12,8 +12,8 @@ function draw() {
 const defaultHTML = `<!DOCTYPE html>
 <html lang="en">
   <head>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.3.1/p5.js"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.10.2/addons/p5.sound.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/addons/p5.sound.min.js"></script>
     <link rel="stylesheet" type="text/css" href="style.css">
     <meta charset="utf-8" />
 
@@ -54,7 +54,8 @@ const initialState = () => {
       _id: a,
       isSelectedFile: true,
       fileType: 'file',
-      children: []
+      children: [],
+      filePath: ''
     },
     {
       name: 'index.html',
@@ -62,7 +63,8 @@ const initialState = () => {
       id: b,
       _id: b,
       fileType: 'file',
-      children: []
+      children: [],
+      filePath: ''
     },
     {
       name: 'style.css',
@@ -70,7 +72,8 @@ const initialState = () => {
       id: c,
       _id: c,
       fileType: 'file',
-      children: []
+      children: [],
+      filePath: ''
     }
   ];
 };
@@ -141,6 +144,27 @@ function renameFile(state, action) {
   });
 }
 
+function setFilePath(files, fileId, path) {
+  const file = files.find((f) => f.id === fileId);
+  file.filePath = path;
+  // const newPath = `${path}${path.length > 0 ? '/' : ''}${file.name}`;
+  const newPath = `${path}/${file.name}`;
+  if (file.children.length === 0) return;
+  file.children.forEach((childFileId) => {
+    setFilePath(files, childFileId, newPath);
+  });
+}
+
+function setFilePaths(files) {
+  const updatedFiles = [...files];
+  const rootPath = '';
+  const rootFile = files.find((f) => f.name === 'root');
+  rootFile.children.forEach((fileId) => {
+    setFilePath(updatedFiles, fileId, rootPath);
+  });
+  return updatedFiles;
+}
+
 const files = (state, action) => {
   if (state === undefined) {
     state = initialState(); // eslint-disable-line
@@ -162,12 +186,22 @@ const files = (state, action) => {
         return Object.assign({}, file, { blobURL: action.blobURL });
       });
     case ActionTypes.NEW_PROJECT:
-      return [...action.files];
+      return setFilePaths(action.files);
     case ActionTypes.SET_PROJECT:
-      return [...action.files];
+      return setFilePaths(action.files);
     case ActionTypes.RESET_PROJECT:
       return initialState();
     case ActionTypes.CREATE_FILE: {
+      const parentFile = state.find((file) => file.id === action.parentId);
+      // const filePath =
+      //   parentFile.name === 'root'
+      //     ? ''
+      //     : `${parentFile.filePath}${parentFile.filePath.length > 0 ? '/' : ''}
+      //     ${parentFile.name}`;
+      const filePath =
+        parentFile.name === 'root'
+          ? ''
+          : `${parentFile.filePath}/${parentFile.name}`;
       const newState = [
         ...updateParent(state, action),
         {
@@ -177,7 +211,8 @@ const files = (state, action) => {
           content: action.content,
           url: action.url,
           children: action.children,
-          fileType: action.fileType || 'file'
+          fileType: action.fileType || 'file',
+          filePath
         }
       ];
       return newState.map((file) => {
@@ -189,6 +224,13 @@ const files = (state, action) => {
     }
     case ActionTypes.UPDATE_FILE_NAME: {
       const newState = renameFile(state, action);
+      const updatedFile = newState.find((file) => file.id === action.id);
+      // const childPath = `${updatedFile.filePath}
+      // ${updatedFile.filePath.length > 0 ? '/' : ''}${updatedFile.name}`;
+      const childPath = `${updatedFile.filePath}/${updatedFile.name}`;
+      updatedFile.children.forEach((childId) => {
+        setFilePath(newState, action.id, childPath);
+      });
       return newState.map((file) => {
         if (file.children.includes(action.id)) {
           file.children = sortedChildrenId(newState, file.children);
diff --git a/client/modules/IDE/reducers/ide.js b/client/modules/IDE/reducers/ide.js
index 997f69b8a0..8d45b8b50a 100644
--- a/client/modules/IDE/reducers/ide.js
+++ b/client/modules/IDE/reducers/ide.js
@@ -22,7 +22,7 @@ const initialState = {
   justOpenedProject: false,
   previousPath: '/',
   errorType: undefined,
-  runtimeErrorWarningVisible: true,
+  runtimeErrorWarningVisible: false,
   parentId: undefined
 };
 
diff --git a/client/modules/IDE/reducers/preferences.js b/client/modules/IDE/reducers/preferences.js
index af760ea8f6..f308ffe524 100644
--- a/client/modules/IDE/reducers/preferences.js
+++ b/client/modules/IDE/reducers/preferences.js
@@ -8,7 +8,6 @@ const initialState = {
   lintWarning: false,
   textOutput: false,
   gridOutput: false,
-  soundOutput: false,
   theme: 'light',
   autorefresh: false,
   language: 'en-US',
@@ -29,8 +28,6 @@ const preferences = (state = initialState, action) => {
       return Object.assign({}, state, { textOutput: action.value });
     case ActionTypes.SET_GRID_OUTPUT:
       return Object.assign({}, state, { gridOutput: action.value });
-    case ActionTypes.SET_SOUND_OUTPUT:
-      return Object.assign({}, state, { soundOutput: action.value });
     case ActionTypes.SET_PREFERENCES:
       return action.preferences;
     case ActionTypes.SET_THEME:
diff --git a/client/modules/Mobile/MobilePreferences.jsx b/client/modules/Mobile/MobilePreferences.jsx
index 63fa2483a6..307145f3a2 100644
--- a/client/modules/Mobile/MobilePreferences.jsx
+++ b/client/modules/Mobile/MobilePreferences.jsx
@@ -42,7 +42,6 @@ const MobilePreferences = () => {
     linewrap,
     textOutput,
     gridOutput,
-    soundOutput,
     lineNumbers,
     lintWarning
   } = useSelector((state) => state.preferences);
@@ -54,7 +53,6 @@ const MobilePreferences = () => {
     setLinewrap,
     setTextOutput,
     setGridOutput,
-    setSoundOutput,
     setLineNumbers,
     setLintWarning
   } = bindActionCreators(
@@ -102,12 +100,6 @@ const MobilePreferences = () => {
       gridOutput,
       setGridOutput,
       'table output'
-    ),
-    preferenceOnOff(
-      t('MobilePreferences.Sound'),
-      soundOutput,
-      setSoundOutput,
-      'sound output'
     )
   ];
 
diff --git a/client/modules/Mobile/MobileSketchView.jsx b/client/modules/Mobile/MobileSketchView.jsx
index fee5eb647b..dc69550f6f 100644
--- a/client/modules/Mobile/MobileSketchView.jsx
+++ b/client/modules/Mobile/MobileSketchView.jsx
@@ -33,7 +33,6 @@ const MobileSketchView = () => {
   const {
     setTextOutput,
     setGridOutput,
-    setSoundOutput,
     dispatchConsoleEvent,
     endSketchRefresh,
     stopSketch,
@@ -76,11 +75,9 @@ const MobileSketchView = () => {
           previewIsRefreshing={ide.previewIsRefreshing}
           textOutput={preferences.textOutput}
           gridOutput={preferences.gridOutput}
-          soundOutput={preferences.soundOutput}
           autorefresh={preferences.autorefresh}
           setTextOutput={setTextOutput}
           setGridOutput={setGridOutput}
-          setSoundOutput={setSoundOutput}
           dispatchConsoleEvent={dispatchConsoleEvent}
           endSketchRefresh={endSketchRefresh}
           stopSketch={stopSketch}
diff --git a/client/modules/Preview/EmbedFrame.jsx b/client/modules/Preview/EmbedFrame.jsx
new file mode 100644
index 0000000000..c5f7afb6f5
--- /dev/null
+++ b/client/modules/Preview/EmbedFrame.jsx
@@ -0,0 +1,337 @@
+import PropTypes from 'prop-types';
+import React, { useRef, useEffect, useMemo } from 'react';
+import styled from 'styled-components';
+import loopProtect from 'loop-protect';
+import { JSHINT } from 'jshint';
+import decomment from 'decomment';
+import { resolvePathToFile } from '../../../server/utils/filePath';
+import getConfig from '../../utils/getConfig';
+import {
+  MEDIA_FILE_REGEX,
+  MEDIA_FILE_QUOTED_REGEX,
+  STRING_REGEX,
+  PLAINTEXT_FILE_REGEX,
+  EXTERNAL_LINK_REGEX,
+  NOT_EXTERNAL_LINK_REGEX
+} from '../../../server/utils/fileUtils';
+import { getAllScriptOffsets } from '../../utils/consoleUtils';
+import { registerFrame } from '../../utils/dispatcher';
+import { createBlobUrl } from './filesReducer';
+
+let objectUrls = {};
+let objectPaths = {};
+
+const Frame = styled.iframe`
+  min-height: 100%;
+  min-width: 100%;
+  position: absolute;
+  border-width: 0;
+  ${({ fullView }) =>
+    fullView &&
+    `
+    position: relative;
+  `}
+`;
+
+function resolvePathsForElementsWithAttribute(attr, sketchDoc, files) {
+  const elements = sketchDoc.querySelectorAll(`[${attr}]`);
+  const elementsArray = Array.prototype.slice.call(elements);
+  elementsArray.forEach((element) => {
+    if (element.getAttribute(attr).match(MEDIA_FILE_REGEX)) {
+      const resolvedFile = resolvePathToFile(element.getAttribute(attr), files);
+      if (resolvedFile && resolvedFile.url) {
+        element.setAttribute(attr, resolvedFile.url);
+      }
+    }
+  });
+}
+
+function resolveCSSLinksInString(content, files) {
+  let newContent = content;
+  let cssFileStrings = content.match(STRING_REGEX);
+  cssFileStrings = cssFileStrings || [];
+  cssFileStrings.forEach((cssFileString) => {
+    if (cssFileString.match(MEDIA_FILE_QUOTED_REGEX)) {
+      const filePath = cssFileString.substr(1, cssFileString.length - 2);
+      const quoteCharacter = cssFileString.substr(0, 1);
+      const resolvedFile = resolvePathToFile(filePath, files);
+      if (resolvedFile) {
+        if (resolvedFile.url) {
+          newContent = newContent.replace(
+            cssFileString,
+            quoteCharacter + resolvedFile.url + quoteCharacter
+          );
+        }
+      }
+    }
+  });
+  return newContent;
+}
+
+function jsPreprocess(jsText) {
+  let newContent = jsText;
+  // check the code for js errors before sending it to strip comments
+  // or loops.
+  JSHINT(newContent);
+
+  if (JSHINT.errors.length === 0) {
+    newContent = decomment(newContent, {
+      ignore: /\/\/\s*noprotect/g,
+      space: true
+    });
+    newContent = loopProtect(newContent);
+  }
+  return newContent;
+}
+
+function resolveJSLinksInString(content, files) {
+  let newContent = content;
+  let jsFileStrings = content.match(STRING_REGEX);
+  jsFileStrings = jsFileStrings || [];
+  jsFileStrings.forEach((jsFileString) => {
+    if (jsFileString.match(MEDIA_FILE_QUOTED_REGEX)) {
+      const filePath = jsFileString.substr(1, jsFileString.length - 2);
+      const quoteCharacter = jsFileString.substr(0, 1);
+      const resolvedFile = resolvePathToFile(filePath, files);
+
+      if (resolvedFile) {
+        if (resolvedFile.url) {
+          newContent = newContent.replace(
+            jsFileString,
+            quoteCharacter + resolvedFile.url + quoteCharacter
+          );
+        } else if (resolvedFile.name.match(PLAINTEXT_FILE_REGEX)) {
+          newContent = newContent.replace(
+            jsFileString,
+            quoteCharacter + resolvedFile.blobUrl + quoteCharacter
+          );
+        }
+      }
+    }
+  });
+
+  return jsPreprocess(newContent);
+}
+
+function resolveScripts(sketchDoc, files) {
+  const scriptsInHTML = sketchDoc.getElementsByTagName('script');
+  const scriptsInHTMLArray = Array.prototype.slice.call(scriptsInHTML);
+  scriptsInHTMLArray.forEach((script) => {
+    if (
+      script.getAttribute('src') &&
+      script.getAttribute('src').match(NOT_EXTERNAL_LINK_REGEX) !== null
+    ) {
+      const resolvedFile = resolvePathToFile(script.getAttribute('src'), files);
+      if (resolvedFile) {
+        if (resolvedFile.url) {
+          script.setAttribute('src', resolvedFile.url);
+        } else {
+          // in the future, when using y.js, could remake the blob for only the file(s)
+          // that changed
+          const blobUrl = createBlobUrl(resolvedFile);
+          script.setAttribute('src', blobUrl);
+          const blobPath = blobUrl.split('/').pop();
+          // objectUrls[blobUrl] = `${resolvedFile.filePath}${
+          //   resolvedFile.filePath.length > 0 ? '/' : ''
+          // }${resolvedFile.name}`;
+          objectUrls[blobUrl] = `${resolvedFile.filePath}/${resolvedFile.name}`;
+          objectPaths[blobPath] = resolvedFile.name;
+          // script.setAttribute('data-tag', `${startTag}${resolvedFile.name}`);
+          // script.removeAttribute('src');
+          // script.innerHTML = resolvedFile.content; // eslint-disable-line
+        }
+      }
+    } else if (
+      !(
+        script.getAttribute('src') &&
+        script.getAttribute('src').match(EXTERNAL_LINK_REGEX)
+      ) !== null
+    ) {
+      script.setAttribute('crossorigin', '');
+      script.innerHTML = resolveJSLinksInString(script.innerHTML, files); // eslint-disable-line
+    }
+  });
+}
+
+function resolveStyles(sketchDoc, files) {
+  const inlineCSSInHTML = sketchDoc.getElementsByTagName('style');
+  const inlineCSSInHTMLArray = Array.prototype.slice.call(inlineCSSInHTML);
+  inlineCSSInHTMLArray.forEach((style) => {
+    style.innerHTML = resolveCSSLinksInString(style.innerHTML, files); // eslint-disable-line
+  });
+
+  const cssLinksInHTML = sketchDoc.querySelectorAll('link[rel="stylesheet"]');
+  const cssLinksInHTMLArray = Array.prototype.slice.call(cssLinksInHTML);
+  cssLinksInHTMLArray.forEach((css) => {
+    if (
+      css.getAttribute('href') &&
+      css.getAttribute('href').match(NOT_EXTERNAL_LINK_REGEX) !== null
+    ) {
+      const resolvedFile = resolvePathToFile(css.getAttribute('href'), files);
+      if (resolvedFile) {
+        if (resolvedFile.url) {
+          css.href = resolvedFile.url; // eslint-disable-line
+        } else {
+          const style = sketchDoc.createElement('style');
+          style.innerHTML = `\n${resolvedFile.content}`;
+          sketchDoc.head.appendChild(style);
+          css.parentElement.removeChild(css);
+        }
+      }
+    }
+  });
+}
+
+function resolveJSAndCSSLinks(files) {
+  const newFiles = [];
+  files.forEach((file) => {
+    const newFile = { ...file };
+    if (file.name.match(/.*\.js$/i)) {
+      newFile.content = resolveJSLinksInString(newFile.content, files);
+    } else if (file.name.match(/.*\.css$/i)) {
+      newFile.content = resolveCSSLinksInString(newFile.content, files);
+    }
+    newFiles.push(newFile);
+  });
+  return newFiles;
+}
+
+function addLoopProtect(sketchDoc) {
+  const scriptsInHTML = sketchDoc.getElementsByTagName('script');
+  const scriptsInHTMLArray = Array.prototype.slice.call(scriptsInHTML);
+  scriptsInHTMLArray.forEach((script) => {
+    script.innerHTML = jsPreprocess(script.innerHTML); // eslint-disable-line
+  });
+}
+
+function injectLocalFiles(files, htmlFile, options) {
+  const { basePath, gridOutput, textOutput } = options;
+  let scriptOffs = [];
+  objectUrls = {};
+  objectPaths = {};
+  const resolvedFiles = resolveJSAndCSSLinks(files);
+  const parser = new DOMParser();
+  const sketchDoc = parser.parseFromString(htmlFile.content, 'text/html');
+
+  const base = sketchDoc.createElement('base');
+  base.href = `${window.origin}${basePath}${basePath.length > 1 && '/'}`;
+  sketchDoc.head.appendChild(base);
+
+  resolvePathsForElementsWithAttribute('src', sketchDoc, resolvedFiles);
+  resolvePathsForElementsWithAttribute('href', sketchDoc, resolvedFiles);
+  // should also include background, data, poster, but these are used way less often
+
+  resolveScripts(sketchDoc, resolvedFiles);
+  resolveStyles(sketchDoc, resolvedFiles);
+
+  const accessiblelib = sketchDoc.createElement('script');
+  accessiblelib.setAttribute(
+    'src',
+    'https://cdn.jsdelivr.net/gh/processing/p5.accessibility@v0.1.1/dist/p5.accessibility.js'
+  );
+  const accessibleOutputs = sketchDoc.createElement('section');
+  accessibleOutputs.setAttribute('id', 'accessible-outputs');
+  accessibleOutputs.setAttribute('aria-label', 'accessible-output');
+  if (textOutput || gridOutput) {
+    sketchDoc.body.appendChild(accessibleOutputs);
+    sketchDoc.body.appendChild(accessiblelib);
+    if (textOutput) {
+      const textSection = sketchDoc.createElement('section');
+      textSection.setAttribute('id', 'textOutput-content');
+      sketchDoc.getElementById('accessible-outputs').appendChild(textSection);
+    }
+    if (gridOutput) {
+      const gridSection = sketchDoc.createElement('section');
+      gridSection.setAttribute('id', 'tableOutput-content');
+      sketchDoc.getElementById('accessible-outputs').appendChild(gridSection);
+    }
+  }
+
+  const previewScripts = sketchDoc.createElement('script');
+  previewScripts.src = `${window.location.origin}${getConfig(
+    'PREVIEW_SCRIPTS_URL'
+  )}`;
+  previewScripts.setAttribute('crossorigin', '');
+  sketchDoc.head.appendChild(previewScripts);
+
+  const sketchDocString = `<!DOCTYPE HTML>\n${sketchDoc.documentElement.outerHTML}`;
+  scriptOffs = getAllScriptOffsets(sketchDocString);
+  const consoleErrorsScript = sketchDoc.createElement('script');
+  consoleErrorsScript.innerHTML = `
+    window.offs = ${JSON.stringify(scriptOffs)};
+    window.objectUrls = ${JSON.stringify(objectUrls)};
+    window.objectPaths = ${JSON.stringify(objectPaths)};
+    window.editorOrigin = '${getConfig('EDITOR_URL')}';
+  `;
+  addLoopProtect(sketchDoc);
+  sketchDoc.head.prepend(consoleErrorsScript);
+
+  return `<!DOCTYPE HTML>\n${sketchDoc.documentElement.outerHTML}`;
+}
+
+function getHtmlFile(files) {
+  return files.filter((file) => file.name.match(/.*\.html$/i))[0];
+}
+
+function EmbedFrame({ files, isPlaying, basePath, gridOutput, textOutput }) {
+  const iframe = useRef();
+  const htmlFile = useMemo(() => getHtmlFile(files), [files]);
+
+  useEffect(() => {
+    const unsubscribe = registerFrame(
+      iframe.current.contentWindow,
+      window.origin
+    );
+    return () => {
+      unsubscribe();
+    };
+  });
+
+  function renderSketch() {
+    const doc = iframe.current;
+    if (isPlaying) {
+      const htmlDoc = injectLocalFiles(files, htmlFile, {
+        basePath,
+        gridOutput,
+        textOutput
+      });
+      const generatedHtmlFile = {
+        name: 'index.html',
+        content: htmlDoc
+      };
+      const htmlUrl = createBlobUrl(generatedHtmlFile);
+      // BRO FOR SOME REASON YOU HAVE TO DO THIS TO GET IT TO WORK ON SAFARI
+      setTimeout(() => {
+        doc.src = htmlUrl;
+      }, 0);
+    } else {
+      doc.src = '';
+    }
+  }
+
+  useEffect(renderSketch, [files, isPlaying]);
+  return (
+    <Frame
+      aria-label="Sketch Preview"
+      role="main"
+      frameBorder="0"
+      ref={iframe}
+    />
+  );
+}
+
+EmbedFrame.propTypes = {
+  files: PropTypes.arrayOf(
+    PropTypes.shape({
+      id: PropTypes.string.isRequired,
+      name: PropTypes.string.isRequired,
+      content: PropTypes.string.isRequired
+    })
+  ).isRequired,
+  isPlaying: PropTypes.bool.isRequired,
+  basePath: PropTypes.string.isRequired,
+  gridOutput: PropTypes.bool.isRequired,
+  textOutput: PropTypes.bool.isRequired
+};
+
+export default EmbedFrame;
diff --git a/client/modules/Preview/filesReducer.js b/client/modules/Preview/filesReducer.js
new file mode 100644
index 0000000000..657200956f
--- /dev/null
+++ b/client/modules/Preview/filesReducer.js
@@ -0,0 +1,139 @@
+import { useMemo } from 'react';
+import objectID from 'bson-objectid';
+import blobUtil from 'blob-util';
+import mime from 'mime-types';
+import { PLAINTEXT_FILE_REGEX } from '../../../server/utils/fileUtils';
+
+const defaultSketch = `function setup() {
+  createCanvas(400, 400);
+}
+
+function draw() {
+  background(220);
+}`;
+
+const defaultHTML = `<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.2.0/p5.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.2.0/addons/p5.sound.min.js"></script>
+    <link rel="stylesheet" type="text/css" href="style.css">
+    <meta charset="utf-8" />
+
+  </head>
+  <body>
+    <script src="sketch.js"></script>
+  </body>
+</html>
+`;
+
+const defaultCSS = `html, body {
+  margin: 0;
+  padding: 0;
+}
+canvas {
+  display: block;
+}
+`;
+
+// https://gist.github.com/fnky/7d044b94070a35e552f3c139cdf80213
+export function useSelectors(state, mapStateToSelectors) {
+  const selectors = useMemo(() => mapStateToSelectors(state), [state]);
+  return selectors;
+}
+
+export function getFileSelectors(state) {
+  return {
+    getHTMLFile: () => state.filter((file) => file.name.match(/.*\.html$/i))[0],
+    getJSFiles: () => state.filter((file) => file.name.match(/.*\.js$/i)),
+    getCSSFiles: () => state.filter((file) => file.name.match(/.*\.css$/i))
+  };
+}
+
+export function initialState() {
+  const a = objectID().toHexString();
+  const b = objectID().toHexString();
+  const c = objectID().toHexString();
+  const r = objectID().toHexString();
+  return [
+    {
+      name: 'root',
+      id: r,
+      _id: r,
+      children: [b, a, c],
+      fileType: 'folder',
+      content: ''
+    },
+    {
+      name: 'sketch.js',
+      content: defaultSketch,
+      id: a,
+      _id: a,
+      isSelectedFile: true,
+      fileType: 'file',
+      children: []
+    },
+    {
+      name: 'index.html',
+      content: defaultHTML,
+      id: b,
+      _id: b,
+      fileType: 'file',
+      children: []
+    },
+    {
+      name: 'style.css',
+      content: defaultCSS,
+      id: c,
+      _id: c,
+      fileType: 'file',
+      children: []
+    }
+  ];
+}
+
+function sortedChildrenId(state, children) {
+  const childrenArray = state.filter((file) => children.includes(file.id));
+  childrenArray.sort((a, b) => (a.name > b.name ? 1 : -1));
+  return childrenArray.map((child) => child.id);
+}
+
+export function setFiles(files) {
+  return {
+    type: 'SET_FILES',
+    files
+  };
+}
+
+export function createBlobUrl(file) {
+  if (file.blobUrl) {
+    blobUtil.revokeObjectURL(file.blobUrl);
+  }
+
+  const mimeType = mime.lookup(file.name);
+  const fileBlob = blobUtil.createBlob([file.content], { type: mimeType });
+  const blobURL = blobUtil.createObjectURL(fileBlob);
+  return blobURL;
+}
+
+export function createBlobUrls(state) {
+  return state.map((file) => {
+    if (file.name.match(PLAINTEXT_FILE_REGEX)) {
+      const blobUrl = createBlobUrl(file);
+      return { ...file, blobUrl };
+    }
+    return file;
+  });
+}
+
+export function filesReducer(state, action) {
+  switch (action.type) {
+    case 'SET_FILES':
+      return createBlobUrls(action.files);
+    default:
+      return state.map((file) => {
+        file.children = sortedChildrenId(state, file.children);
+        return file;
+      });
+  }
+}
diff --git a/client/modules/Preview/previewIndex.jsx b/client/modules/Preview/previewIndex.jsx
new file mode 100644
index 0000000000..5f89a688ce
--- /dev/null
+++ b/client/modules/Preview/previewIndex.jsx
@@ -0,0 +1,77 @@
+import React, { useReducer, useState, useEffect } from 'react';
+import { render } from 'react-dom';
+import { hot } from 'react-hot-loader/root';
+import { createGlobalStyle } from 'styled-components';
+import {
+  registerFrame,
+  listen,
+  MessageTypes,
+  dispatchMessage
+} from '../../utils/dispatcher';
+import { filesReducer, initialState, setFiles } from './filesReducer';
+import EmbedFrame from './EmbedFrame';
+import getConfig from '../../utils/getConfig';
+
+const GlobalStyle = createGlobalStyle`
+  body {
+    margin: 0;
+  }
+`;
+
+const App = () => {
+  const [state, dispatch] = useReducer(filesReducer, [], initialState);
+  const [isPlaying, setIsPlaying] = useState(false);
+  const [basePath, setBasePath] = useState('');
+  const [textOutput, setTextOutput] = useState(false);
+  const [gridOutput, setGridOutput] = useState(false);
+  registerFrame(window.parent, getConfig('EDITOR_URL'));
+
+  function handleMessageEvent(message) {
+    const { type, payload } = message;
+    switch (type) {
+      case MessageTypes.SKETCH:
+        dispatch(setFiles(payload.files));
+        setBasePath(payload.basePath);
+        setTextOutput(payload.textOutput);
+        setGridOutput(payload.gridOutput);
+        break;
+      case MessageTypes.START:
+        setIsPlaying(true);
+        break;
+      case MessageTypes.STOP:
+        setIsPlaying(false);
+        break;
+      case MessageTypes.REGISTER:
+        dispatchMessage({ type: MessageTypes.REGISTER });
+        break;
+      case MessageTypes.EXECUTE:
+        dispatchMessage(payload);
+        break;
+      default:
+        break;
+    }
+  }
+
+  useEffect(() => {
+    const unsubscribe = listen(handleMessageEvent);
+    return function cleanup() {
+      unsubscribe();
+    };
+  });
+  return (
+    <React.Fragment>
+      <GlobalStyle />
+      <EmbedFrame
+        files={state}
+        isPlaying={isPlaying}
+        basePath={basePath}
+        gridOutput={gridOutput}
+        textOutput={textOutput}
+      />
+    </React.Fragment>
+  );
+};
+
+const HotApp = hot(App);
+
+render(<HotApp />, document.getElementById('root'));
diff --git a/client/styles/components/_preview-frame.scss b/client/styles/components/_preview-frame.scss
index 04443267db..9de4ec7d8c 100644
--- a/client/styles/components/_preview-frame.scss
+++ b/client/styles/components/_preview-frame.scss
@@ -1,14 +1,3 @@
-.preview-frame {
-  min-height: 100%;
-  min-width: 100%;
-  position: absolute;
-  border-width: 0;
-}
-
-.preview-frame--full-view {
-  position: relative;
-}
-
 .preview-frame-holder {
   display: flex;
   flex-direction: column;
diff --git a/client/testData/testReduxStore.js b/client/testData/testReduxStore.js
index 9f17e253ec..b379674fad 100644
--- a/client/testData/testReduxStore.js
+++ b/client/testData/testReduxStore.js
@@ -68,7 +68,7 @@ const initialTestState = {
     },
     {
       name: 'index.html',
-      content: `<!DOCTYPE html> <html lang="en"> <head> <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.3.1/p5.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.10.2/addons/p5.sound.min.js"></script> <link rel="stylesheet" type="text/css" href="style.css"> <meta charset="utf-8" /> </head> <body> <script src="sketch.js"></script> </body> </html>`,
+      content: `<!DOCTYPE html> <html lang="en"> <head> <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/addons/p5.sound.min.js"></script> <link rel="stylesheet" type="text/css" href="style.css"> <meta charset="utf-8" /> </head> <body> <script src="sketch.js"></script> </body> </html>`,
       id: '606fc1c46045e19ca2ee2646',
       _id: '606fc1c46045e19ca2ee2646',
       fileType: 'file',
@@ -92,7 +92,6 @@ const initialTestState = {
     lintWarning: false,
     textOutput: false,
     gridOutput: false,
-    soundOutput: false,
     theme: 'light',
     autorefresh: false,
     language: 'en-US',
diff --git a/client/testData/testServerResponses.js b/client/testData/testServerResponses.js
index 1f06adee9e..e6c0f875f1 100644
--- a/client/testData/testServerResponses.js
+++ b/client/testData/testServerResponses.js
@@ -15,7 +15,6 @@ export const userResponse = {
     lintWarning: false,
     textOutput: false,
     gridOutput: false,
-    soundOutput: false,
     theme: 'light',
     autorefresh: false,
     language: 'en-US',
diff --git a/client/utils/consoleUtils.js b/client/utils/consoleUtils.js
index 0794b2da90..1f15fc2b6b 100644
--- a/client/utils/consoleUtils.js
+++ b/client/utils/consoleUtils.js
@@ -1,82 +1,8 @@
-import { EXTERNAL_LINK_REGEX } from '../../server/utils/fileUtils';
-
-export const hijackConsoleErrorsScript = (offs) => {
-  const s = `
-    function getScriptOff(line) {
-      var offs = ${offs};
-      var l = 0;
-      var file = '';
-      for (var i=0; i<offs.length; i++) {
-        var n = offs[i][0];
-        if (n < line && n > l) {
-          l = n;
-          file = offs[i][1];
-        }
-      }
-      return [line - l, file];
-    }
-    // catch reference errors, via http://stackoverflow.com/a/12747364/2994108
-    window.onerror = function (msg, url, lineNumber, columnNo, error) {
-        var string = msg.toLowerCase();
-        var substring = "script error";
-        var data = {};
-        if (url.match(${EXTERNAL_LINK_REGEX}) !== null && error.stack){
-          var errorNum = error.stack.split('about:srcdoc:')[1].split(':')[0];
-          var fileInfo = getScriptOff(errorNum);
-          data = msg + ' (' + fileInfo[1] + ': line ' + fileInfo[0] + ')';
-        } else {
-          var fileInfo = getScriptOff(lineNumber);
-          data = msg + ' (' + fileInfo[1] + ': line ' + fileInfo[0] + ')';
-        }
-        window.parent.postMessage(
-          {
-            source: fileInfo[1],
-            messages: [
-              {
-                log: [
-                  {
-                    method: 'error',
-                    data: [data],
-                    id: Date.now().toString()
-                  }
-                ]
-              }
-            ]
-          }, '*');
-      return false;
-    };
-    // catch rejected promises
-    window.onunhandledrejection = function (event) {
-      if (event.reason && event.reason.message && event.reason.stack){
-        var errorNum = event.reason.stack.split('about:srcdoc:')[1].split(':')[0];
-        var fileInfo = getScriptOff(errorNum);
-        var data = event.reason.message + ' (' + fileInfo[1] + ': line ' + fileInfo[0] + ')';
-        window.parent.postMessage(
-          {
-            source: fileInfo[1],
-            messages: [
-              {
-                log: [
-                  {
-                    method: 'error',
-                    data: [data],
-                    id: Date.now().toString()
-                  }
-                ]
-              }
-            ]
-          }, '*');
-      }
-    };
-  `;
-  return s;
-};
-
 export const startTag = '@fs-';
 
 export const getAllScriptOffsets = (htmlFile) => {
   const offs = [];
-  const hijackConsoleErrorsScriptLength = 66;
+  const hijackConsoleErrorsScriptLength = 2;
   const embeddedJSStart = 'script crossorigin=""';
   let foundJSScript = true;
   let foundEmbeddedJS = true;
diff --git a/client/utils/dispatcher.js b/client/utils/dispatcher.js
index 6745840999..49393121ac 100644
--- a/client/utils/dispatcher.js
+++ b/client/utils/dispatcher.js
@@ -1,30 +1,49 @@
 // Inspired by
 // https://github.com/codesandbox/codesandbox-client/blob/master/packages/codesandbox-api/src/dispatcher/index.ts
 
-let frame = null;
+const frames = {};
+let frameIndex = 1;
 let listener = null;
-const { origin } = window;
 
-export function registerFrame(newFrame) {
-  frame = newFrame;
+export const MessageTypes = {
+  START: 'START',
+  STOP: 'STOP',
+  FILES: 'FILES',
+  SKETCH: 'SKETCH',
+  REGISTER: 'REGISTER',
+  EXECUTE: 'EXECUTE'
+};
+
+export function registerFrame(newFrame, newOrigin) {
+  const frameId = frameIndex;
+  frameIndex += 1;
+  frames[frameId] = { frame: newFrame, origin: newOrigin };
+  return () => {
+    delete frames[frameId];
+  };
 }
 
 function notifyListener(message) {
   if (listener) listener(message);
 }
 
-function notifyFrame(message) {
+function notifyFrames(message) {
   const rawMessage = JSON.parse(JSON.stringify(message));
-  if (frame && frame.postMessage) {
-    frame.postMessage(rawMessage, origin);
-  }
+  Object.keys(frames).forEach((frameId) => {
+    const { frame, origin } = frames[frameId];
+    if (frame && frame.postMessage) {
+      frame.postMessage(rawMessage, origin);
+    }
+  });
 }
 
-export function dispatch(message) {
+export function dispatchMessage(message) {
   if (!message) return;
 
-  notifyListener(message);
-  notifyFrame(message);
+  // maybe one day i will understand why in the codesandbox
+  // code they leave notifyListeners in here?
+  // notifyListener(message);
+  notifyFrames(message);
 }
 
 /**
@@ -40,7 +59,9 @@ export function listen(callback) {
 function eventListener(e) {
   const { data } = e;
 
-  if (data && e.origin === origin) {
+  // should also store origin of parent? idk
+  // if (data && e.origin === origin) {
+  if (data) {
     notifyListener(data);
   }
 }
diff --git a/client/utils/previewEntry.js b/client/utils/previewEntry.js
index 4d560d9e20..d69f73c5f2 100644
--- a/client/utils/previewEntry.js
+++ b/client/utils/previewEntry.js
@@ -1,7 +1,20 @@
 import loopProtect from 'loop-protect';
 import { Hook, Decode, Encode } from 'console-feed';
+import StackTrace from 'stacktrace-js';
 import evaluateExpression from './evaluateExpression';
 
+// should postMessage user the dispatcher? does the parent window need to
+// be registered as a frame? or a just a listener?
+
+// could maybe send these as a message idk
+// const { editor } = window;
+const editor = window.parent.parent;
+const { editorOrigin } = window;
+const htmlOffset = 12;
+window.objectUrls[window.location.href] = '/index.html';
+const blobPath = window.location.href.split('/').pop();
+window.objectPaths[blobPath] = 'index.html';
+
 window.loopProtect = loopProtect;
 
 const consoleBuffer = [];
@@ -17,12 +30,13 @@ setInterval(() => {
       messages: consoleBuffer,
       source: 'sketch'
     };
-    window.parent.postMessage(message, window.origin);
+    editor.postMessage(message, editorOrigin);
     consoleBuffer.length = 0;
   }
 }, LOGWAIT);
 
 function handleMessageEvent(e) {
+  // maybe don't need this?? idk!
   if (window.origin !== e.origin) return;
   const { data } = e;
   const { source, messages } = data;
@@ -34,15 +48,131 @@ function handleMessageEvent(e) {
       const resultMessages = [
         { log: Encode({ method: error ? 'error' : 'result', data: [result] }) }
       ];
-      window.parent.postMessage(
+      editor.postMessage(
         {
           messages: resultMessages,
           source: 'sketch'
         },
-        window.origin
+        editorOrigin
       );
     });
   }
 }
 
 window.addEventListener('message', handleMessageEvent);
+
+// catch reference errors, via http://stackoverflow.com/a/12747364/2994108
+window.onerror = async function onError(
+  msg,
+  source,
+  lineNumber,
+  columnNo,
+  error
+) {
+  // maybe i can use error.stack sometime but i'm having a hard time triggering
+  // this function
+  let data;
+  if (!error) {
+    data = msg;
+  } else {
+    data = `${error.name}: ${error.message}`;
+    const resolvedFileName = window.objectUrls[source];
+    let resolvedLineNo = lineNumber;
+    if (window.objectUrls[source] === 'index.html') {
+      resolvedLineNo = lineNumber - htmlOffset;
+    }
+    const line = `\n    at ${resolvedFileName}:${resolvedLineNo}:${columnNo}`;
+    data = data.concat(line);
+  }
+  editor.postMessage(
+    {
+      source: 'sketch',
+      messages: [
+        {
+          log: [
+            {
+              method: 'error',
+              data: [data],
+              id: Date.now().toString()
+            }
+          ]
+        }
+      ]
+    },
+    editorOrigin
+  );
+  return false;
+};
+// catch rejected promises
+window.onunhandledrejection = async function onUnhandledRejection(event) {
+  if (event.reason && event.reason.message) {
+    let stackLines = [];
+    if (event.reason.stack) {
+      stackLines = await StackTrace.fromError(event.reason);
+    }
+    let data = `${event.reason.name}: ${event.reason.message}`;
+    stackLines.forEach((stackLine) => {
+      const { fileName, functionName, lineNumber, columnNumber } = stackLine;
+      const resolvedFileName = window.objectUrls[fileName] || fileName;
+      const resolvedFuncName = functionName || '(anonymous function)';
+      let line;
+      if (lineNumber && columnNumber) {
+        let resolvedLineNumber = lineNumber;
+        if (resolvedFileName === 'index.html') {
+          resolvedLineNumber = lineNumber - htmlOffset;
+        }
+        line = `\n    at ${resolvedFuncName} (${resolvedFileName}:${resolvedLineNumber}:${columnNumber})`;
+      } else {
+        line = `\n    at ${resolvedFuncName} (${resolvedFileName})`;
+      }
+      data = data.concat(line);
+    });
+    editor.postMessage(
+      {
+        source: 'sketch',
+        messages: [
+          {
+            log: [
+              {
+                method: 'error',
+                data: [data],
+                id: Date.now().toString()
+              }
+            ]
+          }
+        ]
+      },
+      editorOrigin
+    );
+  }
+};
+
+// Monkeypatch p5._friendlyError
+const { _report } = window.p5;
+window.p5._report = function resolvedReport(message, method, color) {
+  const urls = Object.keys(window.objectUrls);
+  const paths = Object.keys(window.objectPaths);
+  let newMessage = message;
+  urls.forEach((url) => {
+    newMessage = newMessage.replaceAll(url, window.objectUrls[url]);
+    if (newMessage.match('index.html')) {
+      const onLineRegex = /on line (?<lineNo>.\d) in/gm;
+      const lineNoRegex = /index\.html:(?<lineNo>.\d):/gm;
+      const match = onLineRegex.exec(newMessage);
+      const line = match.groups.lineNo;
+      const resolvedLine = parseInt(line, 10) - htmlOffset;
+      newMessage = newMessage.replace(
+        onLineRegex,
+        `on line ${resolvedLine} in`
+      );
+      newMessage = newMessage.replace(
+        lineNoRegex,
+        `index.html:${resolvedLine}:`
+      );
+    }
+  });
+  paths.forEach((path) => {
+    newMessage = newMessage.replaceAll(path, window.objectPaths[path]);
+  });
+  _report.apply(window.p5, [newMessage, method, color]);
+};
diff --git a/docker-compose-development.yml b/docker-compose-development.yml
index a60cf6a625..09429e795e 100644
--- a/docker-compose-development.yml
+++ b/docker-compose-development.yml
@@ -16,6 +16,7 @@ services:
       - /usr/src/app/node_modules
     ports:
       - '8000:8000'
+      - '8002:8002'
     depends_on:
       - mongo
 volumes:
diff --git a/docker-compose.yml b/docker-compose.yml
index c88dd224ea..b6acdb2312 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -13,37 +13,42 @@ services:
     # image: index.docker.io/catarak/p5.js-web-editor:latest
     # uncomment the following lines if you don't want export all of the variables
     # defined in your .env file for testing
-    # env_file:
+    env_file:
     #   - "$PWD/.env.production"
-    environment:
-      - API_URL
-      - MONGO_URL
-      - PORT
-      - SESSION_SECRET
-      - AWS_ACCESS_KEY
-      - AWS_SECRET_KEY
-      - S3_BUCKET
-      - AWS_REGION
-      - GITHUB_ID
-      - GITHUB_SECRET
-      - MAILGUN_DOMAIN
-      - MAILGUN_KEY
-      - EMAIL_SENDER
-      - EMAIL_VERIFY_SECRET_TOKEN
-      - S3_BUCKET_URL_BASE
-      - GG_EXAMPLES_USERNAME
-      - GG_EXAMPLES_PASS
-      - GG_EXAMPLES_EMAIL
-      - GOOGLE_ID
-      - GOOGLE_SECRET
-      - EXAMPLE_USER_EMAIL
-      - EXAMPLE_USER_PASSWORD
-      - ML5_EXAMPLES_USERNAME
-      - ML5_EXAMPLES_PASS
-      - ML5_EXAMPLES_EMAIL
-      - UI_ACCESS_TOKEN_ENABLED
-      - UPLOAD_LIMIT
-      - TRANSLATIONS_ENABLED
+      - "$PWD/.env"
+    # environment:
+    #   - API_URL
+    #   - AWS_ACCESS_KEY
+    #   - AWS_REGION
+    #   - AWS_SECRET_KEY
+    #   - EMAIL_SENDER
+    #   - EMAIL_VERIFY_SECRET_TOKEN
+    #   - EXAMPLE_USER_EMAIL
+    #   - EXAMPLE_USER_PASSWORD
+    #   - GG_EXAMPLES_USERNAME
+    #   - GG_EXAMPLES_EMAIL
+    #   - GG_EXAMPLES_PASS
+    #   - GITHUB_ID
+    #   - GITHUB_SECRET
+    #   - GOOGLE_ID
+    #   - GOOGLE_SECRET
+    #   - MAILGUN_DOMAIN
+    #   - MAILGUN_KEY
+    #   - ML5_EXAMPLES_USERNAME
+    #   - ML5_EXAMPLES_EMAIL
+    #   - ML5_EXAMPLES_PASS
+    #   - MOBILE_EMABLED
+    #   - MONGO_URL
+    #   - PORT
+    #   - PREVIEW_PORT
+    #   - EDITOR_URL
+    #   - PREVIEW_URL
+    #   - S3_BUCKET
+    #   - S3_BUCKET_URL_BASE
+    #   - SESSION_SECRET
+    #   - TRANSLATIONS_ENABLED
+    #   - UI_ACCESS_TOKEN_ENABLED
+    #   - UPLOAD_LIMIT
       # you can either set this in your .env or as an environment variables
       # or here YOU CHOOSE
       # - MONGO_URL=mongodb://mongo:27017/p5js-web-editor
@@ -52,6 +57,7 @@ services:
       - /opt/node/app/node_modules
     ports:
       - '8000:8000'
+      - '8002:8002'
     depends_on:
       - mongo
 volumes:
diff --git a/index.js b/index.js
index b00b72278a..2a9edba223 100644
--- a/index.js
+++ b/index.js
@@ -1,6 +1,7 @@
 if (process.env.NODE_ENV === 'production') {
   process.env.webpackAssets = JSON.stringify(require('./dist/static/manifest.json'));
   require('./dist/server.bundle.js');
+  require('./dist/previewServer.bundle.js');
 } else {
   let parsed = require('dotenv').config();
   require('@babel/register')({
@@ -15,4 +16,5 @@ if (process.env.NODE_ENV === 'production') {
   //   }
   // }
   require('./server/server');
+  require('./server/previewServer');
 }
diff --git a/kubernetes_app.yml b/kubernetes_app.yml
index a9f83c7116..30d44f1732 100644
--- a/kubernetes_app.yml
+++ b/kubernetes_app.yml
@@ -8,6 +8,20 @@ spec:
   backend:
     serviceName: web-editor-node
     servicePort: 8000
+## TODO uncomment from prod
+## adding this in just to make a new commit
+# ---
+# apiVersion: extensions/v1beta1
+# kind: Ingress
+# metadata:
+#   name: preview-editor-ingress
+#   annotations:
+#     # need to make another global static ip
+#     kubernetes.io/ingress.global-static-ip-name: "preview-editor-ip"
+# spec:
+#   backend:
+#     serviceName: web-editor-node
+#     servicePort: 8002
 ---
 apiVersion: v1
 kind: Service
@@ -23,6 +37,9 @@ spec:
   ports:
   - port: 8000
     targetPort: 8000
+  ## TODO uncommment for prod
+  # - port: 8002
+  #   targetPort: 8002
   selector:
     app: web-editor
 ---
@@ -138,6 +155,18 @@ spec:
     serviceName: web-editor-node
     servicePort: 8001
 ---
+apiVersion: extensions/v1beta1
+kind: Ingress
+metadata:
+  name: staging-editor-ingress-with-auth
+  namespace: staging
+  annotations:
+    kubernetes.io/ingress.global-static-ip-name: "preview-staging-ip"
+spec:
+  backend:
+    serviceName: web-editor-node
+    servicePort: 8003
+---
 apiVersion: v1
 kind: Service
 metadata:
@@ -153,6 +182,8 @@ spec:
   ports:
   - port: 8001
     targetPort: 8000
+  - port: 8003
+    targetPort: 8002
   selector:
     app: web-editor
 ---
diff --git a/package-lock.json b/package-lock.json
index 776480afee..9ebaded1c7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -126,38 +126,43 @@
       },
       "dependencies": {
         "browserslist": {
-          "version": "4.8.7",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.8.7.tgz",
-          "integrity": "sha512-gFOnZNYBHrEyUML0xr5NJ6edFaaKbTFX9S9kQHlYfCP0Rit/boRIz4G+Avq6/4haEKJXdGGUnoolx+5MWW2BoA==",
+          "version": "4.16.6",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.16.6.tgz",
+          "integrity": "sha512-Wspk/PqO+4W9qp5iUTJsa1B/QrYn1keNCcEP5OvP7WBwT4KaDly0uONYmC6Xa3Z5IqnUgS0KcgLYu1l74x0ZXQ==",
           "dev": true,
           "requires": {
-            "caniuse-lite": "^1.0.30001027",
-            "electron-to-chromium": "^1.3.349",
-            "node-releases": "^1.1.49"
+            "caniuse-lite": "^1.0.30001219",
+            "colorette": "^1.2.2",
+            "electron-to-chromium": "^1.3.723",
+            "escalade": "^3.1.1",
+            "node-releases": "^1.1.71"
+          },
+          "dependencies": {
+            "caniuse-lite": {
+              "version": "1.0.30001236",
+              "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001236.tgz",
+              "integrity": "sha512-o0PRQSrSCGJKCPZcgMzl5fUaj5xHe8qA2m4QRvnyY4e1lITqoNkr7q/Oh1NcpGSy0Th97UZ35yoKcINPoq7YOQ==",
+              "dev": true
+            }
           }
         },
+        "colorette": {
+          "version": "1.2.2",
+          "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
+          "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
+          "dev": true
+        },
         "electron-to-chromium": {
-          "version": "1.3.360",
-          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.360.tgz",
-          "integrity": "sha512-RE1pv2sjQiDRRN1nI0fJ0eQHZ9le4oobu16OArnwEUV5ycAU5SNjFyvzjZ1gPUAqBa2Ud1XagtW8j3ZXfHuQHA==",
+          "version": "1.3.750",
+          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.750.tgz",
+          "integrity": "sha512-Eqy9eHNepZxJXT+Pc5++zvEi5nQ6AGikwFYDCYwXUFBr+ynJ6pDG7MzZmwGYCIuXShLJM0n4bq+aoKDmvSGJ8A==",
           "dev": true
         },
         "node-releases": {
-          "version": "1.1.50",
-          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.50.tgz",
-          "integrity": "sha512-lgAmPv9eYZ0bGwUYAKlr8MG6K4CvWliWqnkcT2P8mMAgVrH3lqfBPorFlxiG1pHQnqmavJZ9vbMXUTNyMLbrgQ==",
-          "dev": true,
-          "requires": {
-            "semver": "^6.3.0"
-          },
-          "dependencies": {
-            "semver": {
-              "version": "6.3.0",
-              "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-              "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
-              "dev": true
-            }
-          }
+          "version": "1.1.73",
+          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.73.tgz",
+          "integrity": "sha512-uW7fodD6pyW2FZNZnp/Z3hvWKeEW1Y8R1+1CnErE8cXFXzl5blBOoVB41CvMer6P6Q0S5FXDwcHgFd1Wj0U9zg==",
+          "dev": true
         }
       }
     },
@@ -492,38 +497,43 @@
       },
       "dependencies": {
         "browserslist": {
-          "version": "4.8.7",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.8.7.tgz",
-          "integrity": "sha512-gFOnZNYBHrEyUML0xr5NJ6edFaaKbTFX9S9kQHlYfCP0Rit/boRIz4G+Avq6/4haEKJXdGGUnoolx+5MWW2BoA==",
+          "version": "4.16.6",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.16.6.tgz",
+          "integrity": "sha512-Wspk/PqO+4W9qp5iUTJsa1B/QrYn1keNCcEP5OvP7WBwT4KaDly0uONYmC6Xa3Z5IqnUgS0KcgLYu1l74x0ZXQ==",
           "dev": true,
           "requires": {
-            "caniuse-lite": "^1.0.30001027",
-            "electron-to-chromium": "^1.3.349",
-            "node-releases": "^1.1.49"
+            "caniuse-lite": "^1.0.30001219",
+            "colorette": "^1.2.2",
+            "electron-to-chromium": "^1.3.723",
+            "escalade": "^3.1.1",
+            "node-releases": "^1.1.71"
+          },
+          "dependencies": {
+            "caniuse-lite": {
+              "version": "1.0.30001236",
+              "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001236.tgz",
+              "integrity": "sha512-o0PRQSrSCGJKCPZcgMzl5fUaj5xHe8qA2m4QRvnyY4e1lITqoNkr7q/Oh1NcpGSy0Th97UZ35yoKcINPoq7YOQ==",
+              "dev": true
+            }
           }
         },
+        "colorette": {
+          "version": "1.2.2",
+          "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
+          "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
+          "dev": true
+        },
         "electron-to-chromium": {
-          "version": "1.3.360",
-          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.360.tgz",
-          "integrity": "sha512-RE1pv2sjQiDRRN1nI0fJ0eQHZ9le4oobu16OArnwEUV5ycAU5SNjFyvzjZ1gPUAqBa2Ud1XagtW8j3ZXfHuQHA==",
+          "version": "1.3.750",
+          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.750.tgz",
+          "integrity": "sha512-Eqy9eHNepZxJXT+Pc5++zvEi5nQ6AGikwFYDCYwXUFBr+ynJ6pDG7MzZmwGYCIuXShLJM0n4bq+aoKDmvSGJ8A==",
           "dev": true
         },
         "node-releases": {
-          "version": "1.1.50",
-          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.50.tgz",
-          "integrity": "sha512-lgAmPv9eYZ0bGwUYAKlr8MG6K4CvWliWqnkcT2P8mMAgVrH3lqfBPorFlxiG1pHQnqmavJZ9vbMXUTNyMLbrgQ==",
-          "dev": true,
-          "requires": {
-            "semver": "^6.3.0"
-          },
-          "dependencies": {
-            "semver": {
-              "version": "6.3.0",
-              "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-              "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
-              "dev": true
-            }
-          }
+          "version": "1.1.73",
+          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.73.tgz",
+          "integrity": "sha512-uW7fodD6pyW2FZNZnp/Z3hvWKeEW1Y8R1+1CnErE8cXFXzl5blBOoVB41CvMer6P6Q0S5FXDwcHgFd1Wj0U9zg==",
+          "dev": true
         }
       }
     },
@@ -3116,38 +3126,43 @@
           }
         },
         "browserslist": {
-          "version": "4.8.7",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.8.7.tgz",
-          "integrity": "sha512-gFOnZNYBHrEyUML0xr5NJ6edFaaKbTFX9S9kQHlYfCP0Rit/boRIz4G+Avq6/4haEKJXdGGUnoolx+5MWW2BoA==",
+          "version": "4.16.6",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.16.6.tgz",
+          "integrity": "sha512-Wspk/PqO+4W9qp5iUTJsa1B/QrYn1keNCcEP5OvP7WBwT4KaDly0uONYmC6Xa3Z5IqnUgS0KcgLYu1l74x0ZXQ==",
           "dev": true,
           "requires": {
-            "caniuse-lite": "^1.0.30001027",
-            "electron-to-chromium": "^1.3.349",
-            "node-releases": "^1.1.49"
+            "caniuse-lite": "^1.0.30001219",
+            "colorette": "^1.2.2",
+            "electron-to-chromium": "^1.3.723",
+            "escalade": "^3.1.1",
+            "node-releases": "^1.1.71"
+          },
+          "dependencies": {
+            "caniuse-lite": {
+              "version": "1.0.30001236",
+              "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001236.tgz",
+              "integrity": "sha512-o0PRQSrSCGJKCPZcgMzl5fUaj5xHe8qA2m4QRvnyY4e1lITqoNkr7q/Oh1NcpGSy0Th97UZ35yoKcINPoq7YOQ==",
+              "dev": true
+            }
           }
         },
+        "colorette": {
+          "version": "1.2.2",
+          "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
+          "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
+          "dev": true
+        },
         "electron-to-chromium": {
-          "version": "1.3.360",
-          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.360.tgz",
-          "integrity": "sha512-RE1pv2sjQiDRRN1nI0fJ0eQHZ9le4oobu16OArnwEUV5ycAU5SNjFyvzjZ1gPUAqBa2Ud1XagtW8j3ZXfHuQHA==",
+          "version": "1.3.750",
+          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.750.tgz",
+          "integrity": "sha512-Eqy9eHNepZxJXT+Pc5++zvEi5nQ6AGikwFYDCYwXUFBr+ynJ6pDG7MzZmwGYCIuXShLJM0n4bq+aoKDmvSGJ8A==",
           "dev": true
         },
         "node-releases": {
-          "version": "1.1.50",
-          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.50.tgz",
-          "integrity": "sha512-lgAmPv9eYZ0bGwUYAKlr8MG6K4CvWliWqnkcT2P8mMAgVrH3lqfBPorFlxiG1pHQnqmavJZ9vbMXUTNyMLbrgQ==",
-          "dev": true,
-          "requires": {
-            "semver": "^6.3.0"
-          },
-          "dependencies": {
-            "semver": {
-              "version": "6.3.0",
-              "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-              "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
-              "dev": true
-            }
-          }
+          "version": "1.1.73",
+          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.73.tgz",
+          "integrity": "sha512-uW7fodD6pyW2FZNZnp/Z3hvWKeEW1Y8R1+1CnErE8cXFXzl5blBOoVB41CvMer6P6Q0S5FXDwcHgFd1Wj0U9zg==",
+          "dev": true
         }
       }
     },
@@ -3720,9 +3735,9 @@
           }
         },
         "lodash": {
-          "version": "4.17.20",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.20.tgz",
-          "integrity": "sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA==",
+          "version": "4.17.21",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+          "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
           "dev": true
         },
         "resolve-from": {
@@ -6774,15 +6789,24 @@
           }
         },
         "browserslist": {
-          "version": "4.12.0",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.12.0.tgz",
-          "integrity": "sha512-UH2GkcEDSI0k/lRkuDSzFl9ZZ87skSy9w2XAn1MsZnL+4c4rqbBd3e82UWHbYDpztABrPBhZsTEeuxVfHppqDg==",
+          "version": "4.16.6",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.16.6.tgz",
+          "integrity": "sha512-Wspk/PqO+4W9qp5iUTJsa1B/QrYn1keNCcEP5OvP7WBwT4KaDly0uONYmC6Xa3Z5IqnUgS0KcgLYu1l74x0ZXQ==",
           "dev": true,
           "requires": {
-            "caniuse-lite": "^1.0.30001043",
-            "electron-to-chromium": "^1.3.413",
-            "node-releases": "^1.1.53",
-            "pkg-up": "^2.0.0"
+            "caniuse-lite": "^1.0.30001219",
+            "colorette": "^1.2.2",
+            "electron-to-chromium": "^1.3.723",
+            "escalade": "^3.1.1",
+            "node-releases": "^1.1.71"
+          },
+          "dependencies": {
+            "caniuse-lite": {
+              "version": "1.0.30001236",
+              "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001236.tgz",
+              "integrity": "sha512-o0PRQSrSCGJKCPZcgMzl5fUaj5xHe8qA2m4QRvnyY4e1lITqoNkr7q/Oh1NcpGSy0Th97UZ35yoKcINPoq7YOQ==",
+              "dev": true
+            }
           }
         },
         "cacache": {
@@ -6884,6 +6908,12 @@
           "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
           "dev": true
         },
+        "colorette": {
+          "version": "1.2.2",
+          "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
+          "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
+          "dev": true
+        },
         "commander": {
           "version": "4.1.1",
           "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz",
@@ -6958,9 +6988,9 @@
               }
             },
             "postcss": {
-              "version": "7.0.35",
-              "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-              "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+              "version": "7.0.36",
+              "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+              "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
               "dev": true,
               "requires": {
                 "chalk": "^2.4.2",
@@ -6991,9 +7021,9 @@
           }
         },
         "electron-to-chromium": {
-          "version": "1.3.430",
-          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.430.tgz",
-          "integrity": "sha512-HMDYkANGhx6vfbqpOf/hc6hWEmiOipOHGDeRDeUb3HLD3XIWpvKQxFgWf0tgHcr3aNv6I/8VPecplqmQsXoZSw==",
+          "version": "1.3.750",
+          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.750.tgz",
+          "integrity": "sha512-Eqy9eHNepZxJXT+Pc5++zvEi5nQ6AGikwFYDCYwXUFBr+ynJ6pDG7MzZmwGYCIuXShLJM0n4bq+aoKDmvSGJ8A==",
           "dev": true
         },
         "emojis-list": {
@@ -7227,9 +7257,9 @@
           "dev": true
         },
         "node-releases": {
-          "version": "1.1.55",
-          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.55.tgz",
-          "integrity": "sha512-H3R3YR/8TjT5WPin/wOoHOUPHgvj8leuU/Keta/rwelEQN9pA/S2Dx8/se4pZ2LBxSd0nAGzsNzhqwa77v7F1w==",
+          "version": "1.1.73",
+          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.73.tgz",
+          "integrity": "sha512-uW7fodD6pyW2FZNZnp/Z3hvWKeEW1Y8R1+1CnErE8cXFXzl5blBOoVB41CvMer6P6Q0S5FXDwcHgFd1Wj0U9zg==",
           "dev": true
         },
         "normalize-path": {
@@ -7281,9 +7311,9 @@
           }
         },
         "postcss": {
-          "version": "7.0.29",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.29.tgz",
-          "integrity": "sha512-ba0ApvR3LxGvRMMiUa9n0WR4HjzcYm7tS+ht4/2Nd0NLtHpPIH77fuB9Xh1/yJVz9O/E/95Y/dn8ygWsyffXtw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -7393,9 +7423,9 @@
               }
             },
             "postcss": {
-              "version": "7.0.35",
-              "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-              "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+              "version": "7.0.36",
+              "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+              "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
               "dev": true,
               "requires": {
                 "chalk": "^2.4.2",
@@ -7536,8 +7566,7 @@
         },
         "ssri": {
           "version": "7.1.0",
-          "resolved": "https://registry.npmjs.org/ssri/-/ssri-7.1.0.tgz",
-          "integrity": "sha512-77/WrDZUWocK0mvA5NTRQyveUf+wsrIc6vyrxpS8tVvYBcX215QbafrJR3KtkpskIzoFLqqNuuYQvxaMjXJ/0g==",
+          "resolved": "",
           "dev": true,
           "requires": {
             "figgy-pudding": "^3.5.1",
@@ -9665,8 +9694,7 @@
         },
         "browserslist": {
           "version": "4.16.1",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.16.1.tgz",
-          "integrity": "sha512-UXhDrwqsNcpTYJBTZsbGATDxZbiVDsx6UjpmRUmtnP10pr8wAYr5LgFoEFw9ixriQH2mv/NX2SfGzE/o8GndLA==",
+          "resolved": "",
           "dev": true,
           "requires": {
             "caniuse-lite": "^1.0.30001173",
@@ -12835,8 +12863,7 @@
         },
         "kind-of": {
           "version": "6.0.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz",
-          "integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA=="
+          "resolved": ""
         }
       }
     },
@@ -13196,14 +13223,42 @@
       }
     },
     "browserslist": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.6.0.tgz",
-      "integrity": "sha512-Jk0YFwXBuMOOol8n6FhgkDzn3mY9PYLYGk29zybF05SbRTsMgPqmTNeQQhOghCxq5oFqAXE3u4sYddr4C0uRhg==",
+      "version": "4.16.6",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.16.6.tgz",
+      "integrity": "sha512-Wspk/PqO+4W9qp5iUTJsa1B/QrYn1keNCcEP5OvP7WBwT4KaDly0uONYmC6Xa3Z5IqnUgS0KcgLYu1l74x0ZXQ==",
       "dev": true,
       "requires": {
-        "caniuse-lite": "^1.0.30000967",
-        "electron-to-chromium": "^1.3.133",
-        "node-releases": "^1.1.19"
+        "caniuse-lite": "^1.0.30001219",
+        "colorette": "^1.2.2",
+        "electron-to-chromium": "^1.3.723",
+        "escalade": "^3.1.1",
+        "node-releases": "^1.1.71"
+      },
+      "dependencies": {
+        "caniuse-lite": {
+          "version": "1.0.30001236",
+          "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001236.tgz",
+          "integrity": "sha512-o0PRQSrSCGJKCPZcgMzl5fUaj5xHe8qA2m4QRvnyY4e1lITqoNkr7q/Oh1NcpGSy0Th97UZ35yoKcINPoq7YOQ==",
+          "dev": true
+        },
+        "colorette": {
+          "version": "1.2.2",
+          "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
+          "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
+          "dev": true
+        },
+        "electron-to-chromium": {
+          "version": "1.3.750",
+          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.750.tgz",
+          "integrity": "sha512-Eqy9eHNepZxJXT+Pc5++zvEi5nQ6AGikwFYDCYwXUFBr+ynJ6pDG7MzZmwGYCIuXShLJM0n4bq+aoKDmvSGJ8A==",
+          "dev": true
+        },
+        "node-releases": {
+          "version": "1.1.73",
+          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.73.tgz",
+          "integrity": "sha512-uW7fodD6pyW2FZNZnp/Z3hvWKeEW1Y8R1+1CnErE8cXFXzl5blBOoVB41CvMer6P6Q0S5FXDwcHgFd1Wj0U9zg==",
+          "dev": true
+        }
       }
     },
     "bser": {
@@ -13379,9 +13434,9 @@
           "dev": true
         },
         "normalize-url": {
-          "version": "4.5.0",
-          "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-4.5.0.tgz",
-          "integrity": "sha512-2s47yzUxdexf1OhyRi4Em83iQk0aPvwTddtFz4hnSSw9dCEsLEGf6SwIO8ss/19S9iBb5sJaOuTvTGDeZI00BQ==",
+          "version": "4.5.1",
+          "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-4.5.1.tgz",
+          "integrity": "sha512-9UZCFRHQdNrfTpGg8+1INIg93B6zE0aXMVFkw1WFwvO4SlZywU6aLg5Of0Ap/PgcbSw4LNxvMWXMeugwMCX0AA==",
           "dev": true
         }
       }
@@ -14308,9 +14363,9 @@
           }
         },
         "glob-parent": {
-          "version": "5.1.1",
-          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.1.tgz",
-          "integrity": "sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==",
+          "version": "5.1.2",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+          "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
           "requires": {
             "is-glob": "^4.0.1"
           }
@@ -14552,38 +14607,43 @@
       },
       "dependencies": {
         "browserslist": {
-          "version": "4.8.7",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.8.7.tgz",
-          "integrity": "sha512-gFOnZNYBHrEyUML0xr5NJ6edFaaKbTFX9S9kQHlYfCP0Rit/boRIz4G+Avq6/4haEKJXdGGUnoolx+5MWW2BoA==",
+          "version": "4.16.6",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.16.6.tgz",
+          "integrity": "sha512-Wspk/PqO+4W9qp5iUTJsa1B/QrYn1keNCcEP5OvP7WBwT4KaDly0uONYmC6Xa3Z5IqnUgS0KcgLYu1l74x0ZXQ==",
           "dev": true,
           "requires": {
-            "caniuse-lite": "^1.0.30001027",
-            "electron-to-chromium": "^1.3.349",
-            "node-releases": "^1.1.49"
+            "caniuse-lite": "^1.0.30001219",
+            "colorette": "^1.2.2",
+            "electron-to-chromium": "^1.3.723",
+            "escalade": "^3.1.1",
+            "node-releases": "^1.1.71"
+          },
+          "dependencies": {
+            "caniuse-lite": {
+              "version": "1.0.30001236",
+              "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001236.tgz",
+              "integrity": "sha512-o0PRQSrSCGJKCPZcgMzl5fUaj5xHe8qA2m4QRvnyY4e1lITqoNkr7q/Oh1NcpGSy0Th97UZ35yoKcINPoq7YOQ==",
+              "dev": true
+            }
           }
         },
+        "colorette": {
+          "version": "1.2.2",
+          "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
+          "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
+          "dev": true
+        },
         "electron-to-chromium": {
-          "version": "1.3.360",
-          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.360.tgz",
-          "integrity": "sha512-RE1pv2sjQiDRRN1nI0fJ0eQHZ9le4oobu16OArnwEUV5ycAU5SNjFyvzjZ1gPUAqBa2Ud1XagtW8j3ZXfHuQHA==",
+          "version": "1.3.750",
+          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.750.tgz",
+          "integrity": "sha512-Eqy9eHNepZxJXT+Pc5++zvEi5nQ6AGikwFYDCYwXUFBr+ynJ6pDG7MzZmwGYCIuXShLJM0n4bq+aoKDmvSGJ8A==",
           "dev": true
         },
         "node-releases": {
-          "version": "1.1.50",
-          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.50.tgz",
-          "integrity": "sha512-lgAmPv9eYZ0bGwUYAKlr8MG6K4CvWliWqnkcT2P8mMAgVrH3lqfBPorFlxiG1pHQnqmavJZ9vbMXUTNyMLbrgQ==",
-          "dev": true,
-          "requires": {
-            "semver": "^6.3.0"
-          },
-          "dependencies": {
-            "semver": {
-              "version": "6.3.0",
-              "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-              "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
-              "dev": true
-            }
-          }
+          "version": "1.1.73",
+          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.73.tgz",
+          "integrity": "sha512-uW7fodD6pyW2FZNZnp/Z3hvWKeEW1Y8R1+1CnErE8cXFXzl5blBOoVB41CvMer6P6Q0S5FXDwcHgFd1Wj0U9zg==",
+          "dev": true
         },
         "semver": {
           "version": "7.0.0",
@@ -14832,9 +14892,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -14881,9 +14941,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-          "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -14925,9 +14985,9 @@
           "dev": true
         },
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -15055,20 +15115,28 @@
           }
         },
         "nanoid": {
-          "version": "3.1.20",
-          "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.20.tgz",
-          "integrity": "sha512-a1cQNyczgKbLX9jwbS/+d7W8fX/RfgYR7lVWwWOGIPNgK2m0MWvrGF6/m4kk6U3QcFMnZf3RIhL0v2Jgh/0Uxw==",
+          "version": "3.1.23",
+          "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.23.tgz",
+          "integrity": "sha512-FiB0kzdP0FFVGDKlRLEQ1BgDzU87dy5NnzjeW9YZNt+/c3+q82EQDUwniSAUxp/F0gFNI1ZhKU1FqYsMuqZVnw==",
           "dev": true
         },
         "postcss": {
-          "version": "8.2.4",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.2.4.tgz",
-          "integrity": "sha512-kRFftRoExRVXZlwUuay9iC824qmXPcQQVzAjbCCgjpXnkdMCJYBu2gTwAaFBzv8ewND6O8xFb3aELmEkh9zTzg==",
+          "version": "8.3.0",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.0.tgz",
+          "integrity": "sha512-+ogXpdAjWGa+fdYY5BQ96V/6tAo+TdSSIMP5huJBIygdWwKtVoB5JWZ7yUd4xZ8r+8Kvvx4nyg/PQ071H4UtcQ==",
           "dev": true,
           "requires": {
-            "colorette": "^1.2.1",
-            "nanoid": "^3.1.20",
-            "source-map": "^0.6.1"
+            "colorette": "^1.2.2",
+            "nanoid": "^3.1.23",
+            "source-map-js": "^0.6.2"
+          },
+          "dependencies": {
+            "colorette": {
+              "version": "1.2.2",
+              "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
+              "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
+              "dev": true
+            }
           }
         },
         "postcss-value-parser": {
@@ -15097,12 +15165,6 @@
             "lru-cache": "^6.0.0"
           }
         },
-        "source-map": {
-          "version": "0.6.1",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-          "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-          "dev": true
-        },
         "yallist": {
           "version": "4.0.0",
           "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
@@ -15126,9 +15188,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -15335,9 +15397,9 @@
           "dev": true
         },
         "postcss": {
-          "version": "7.0.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-          "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -15645,9 +15707,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-          "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -16368,12 +16430,6 @@
       "integrity": "sha512-7vmuyh5+kuUyJKePhQfRQBhXV5Ce+RnaeeQArKu1EAMpL3WbgMt5WG6uQZpEVvYSSsxMXRKOewtDk9RaTKXRlA==",
       "dev": true
     },
-    "electron-to-chromium": {
-      "version": "1.3.137",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.137.tgz",
-      "integrity": "sha512-kGi32g42a8vS/WnYE7ELJyejRT7hbr3UeOOu0WeuYuQ29gCpg9Lrf6RdcTQVXSt/v0bjCfnlb/EWOOsiKpTmkw==",
-      "dev": true
-    },
     "elegant-spinner": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/elegant-spinner/-/elegant-spinner-1.0.1.tgz",
@@ -16536,6 +16592,14 @@
         "is-arrayish": "^0.2.1"
       }
     },
+    "error-stack-parser": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/error-stack-parser/-/error-stack-parser-2.0.6.tgz",
+      "integrity": "sha512-d51brTeqC+BHlwF0BhPtcYgF5nlzf9ZZ0ZIUQNZpc9ZB9qw5IJ2diTrBY9jlCJkTLITYPjmiX6OWCwH+fuyNgQ==",
+      "requires": {
+        "stackframe": "^1.1.1"
+      }
+    },
     "es-abstract": {
       "version": "1.13.0",
       "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.13.0.tgz",
@@ -16857,9 +16921,9 @@
           }
         },
         "glob-parent": {
-          "version": "5.1.1",
-          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.1.tgz",
-          "integrity": "sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==",
+          "version": "5.1.2",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+          "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
           "dev": true,
           "requires": {
             "is-glob": "^4.0.1"
@@ -16922,9 +16986,9 @@
           }
         },
         "lodash": {
-          "version": "4.17.20",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.20.tgz",
-          "integrity": "sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA==",
+          "version": "4.17.21",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+          "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
           "dev": true
         },
         "lru-cache": {
@@ -19514,8 +19578,7 @@
         },
         "ini": {
           "version": "1.3.5",
-          "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz",
-          "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==",
+          "resolved": "",
           "optional": true
         },
         "is-fullwidth-code-point": {
@@ -20653,9 +20716,9 @@
       "integrity": "sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw=="
     },
     "hosted-git-info": {
-      "version": "2.8.5",
-      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.5.tgz",
-      "integrity": "sha512-kssjab8CvdXfcXMXVcvsXum4Hwdq9XGtRD3TteMEvEbq0LXyiNQr6AprqKqfeaDXze7SxWvRxdpwE6ku7ikLkg==",
+      "version": "2.8.9",
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.9.tgz",
+      "integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==",
       "dev": true
     },
     "hsl-regex": {
@@ -20788,9 +20851,9 @@
       "dev": true
     },
     "html-webpack-plugin": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/html-webpack-plugin/-/html-webpack-plugin-4.3.0.tgz",
-      "integrity": "sha512-C0fzKN8yQoVLTelcJxZfJCE+aAvQiY2VUf3UuKrR4a9k5UMWYOtpDLsaXwATbcVCnI05hUS7L9ULQHWLZhyi3w==",
+      "version": "4.5.2",
+      "resolved": "https://registry.npmjs.org/html-webpack-plugin/-/html-webpack-plugin-4.5.2.tgz",
+      "integrity": "sha512-q5oYdzjKUIPQVjOosjgvCHQOv9Ett9CYYHlgvJeXG0qQvdSojnBq4vAdQBwn1+yGveAwHCoe/rMR86ozX3+c2A==",
       "dev": true,
       "requires": {
         "@types/html-minifier-terser": "^5.0.0",
@@ -20798,7 +20861,7 @@
         "@types/webpack": "^4.41.8",
         "html-minifier-terser": "^5.0.1",
         "loader-utils": "^1.2.3",
-        "lodash": "^4.17.15",
+        "lodash": "^4.17.20",
         "pretty-error": "^2.1.1",
         "tapable": "^1.1.3",
         "util.promisify": "1.0.0"
@@ -20899,29 +20962,59 @@
       }
     },
     "htmlparser2": {
-      "version": "3.10.1",
-      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.10.1.tgz",
-      "integrity": "sha512-IgieNijUMbkDovyoKObU1DUhm1iwNYE/fuifEoEHfd1oZKZDaONBSkal7Y01shxsM49R4XaMdGez3WnF9UfiCQ==",
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-6.1.0.tgz",
+      "integrity": "sha512-gyyPk6rgonLFEDGoeRgQNaEUvdJ4ktTmmUh/h2t7s+M8oPpIPxgNACWa+6ESR57kXstwqPiCut0V8NRpcwgU7A==",
       "dev": true,
       "requires": {
-        "domelementtype": "^1.3.1",
-        "domhandler": "^2.3.0",
-        "domutils": "^1.5.1",
-        "entities": "^1.1.1",
-        "inherits": "^2.0.1",
-        "readable-stream": "^3.1.1"
+        "domelementtype": "^2.0.1",
+        "domhandler": "^4.0.0",
+        "domutils": "^2.5.2",
+        "entities": "^2.0.0"
       },
       "dependencies": {
-        "readable-stream": {
-          "version": "3.5.0",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.5.0.tgz",
-          "integrity": "sha512-gSz026xs2LfxBPudDuI41V1lka8cxg64E66SGe78zJlsUofOg/yqwezdIcdfwik6B4h8LFmWPA9ef9X3FiNFLA==",
+        "dom-serializer": {
+          "version": "1.3.2",
+          "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.3.2.tgz",
+          "integrity": "sha512-5c54Bk5Dw4qAxNOI1pFEizPSjVsx5+bpJKmL2kPn8JhBUq2q09tTCa3mjijun2NfK78NMouDYNMBkOrPZiS+ig==",
           "dev": true,
           "requires": {
-            "inherits": "^2.0.3",
-            "string_decoder": "^1.1.1",
-            "util-deprecate": "^1.0.1"
+            "domelementtype": "^2.0.1",
+            "domhandler": "^4.2.0",
+            "entities": "^2.0.0"
           }
+        },
+        "domelementtype": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz",
+          "integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A==",
+          "dev": true
+        },
+        "domhandler": {
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-4.2.0.tgz",
+          "integrity": "sha512-zk7sgt970kzPks2Bf+dwT/PLzghLnsivb9CcxkvR8Mzr66Olr0Ofd8neSbglHJHaHa2MadfoSdNlKYAaafmWfA==",
+          "dev": true,
+          "requires": {
+            "domelementtype": "^2.2.0"
+          }
+        },
+        "domutils": {
+          "version": "2.7.0",
+          "resolved": "https://registry.npmjs.org/domutils/-/domutils-2.7.0.tgz",
+          "integrity": "sha512-8eaHa17IwJUPAiB+SoTYBo5mCdeMgdcAoXJ59m6DT1vw+5iLS3gNoqYaRowaBKtGVrOF1Jz4yDTgYKLK2kvfJg==",
+          "dev": true,
+          "requires": {
+            "dom-serializer": "^1.0.1",
+            "domelementtype": "^2.2.0",
+            "domhandler": "^4.2.0"
+          }
+        },
+        "entities": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
+          "integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==",
+          "dev": true
         }
       }
     },
@@ -27184,12 +27277,6 @@
         "package-json": "^6.3.0"
       }
     },
-    "lazy-cache": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/lazy-cache/-/lazy-cache-1.0.4.tgz",
-      "integrity": "sha1-odePw6UEdMuAhF07O24dpJpEbo4=",
-      "dev": true
-    },
     "lazy-universal-dotenv": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/lazy-universal-dotenv/-/lazy-universal-dotenv-3.0.1.tgz",
@@ -27784,9 +27871,9 @@
       }
     },
     "lodash": {
-      "version": "4.17.19",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.19.tgz",
-      "integrity": "sha512-JNvd8XER9GQX0v2qJgsaN/mzFCNA5BRe/j8JN9d+tWyGLSodKQHKFicdwNYzWwI3wjRnaKPsGj1XkBjx/F96DQ=="
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
     },
     "lodash-es": {
       "version": "4.17.11",
@@ -28399,8 +28486,7 @@
     },
     "merge-deep": {
       "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/merge-deep/-/merge-deep-3.0.2.tgz",
-      "integrity": "sha512-T7qC8kg4Zoti1cFd8Cr0M+qaZfOwjlPDEdZIIPPB2JZctjaPM4fX+i7HOId69tAti2fvO6X5ldfYUONDODsrkA==",
+      "resolved": "",
       "dev": true,
       "requires": {
         "arr-union": "^3.1.0",
@@ -28417,7 +28503,6 @@
             "for-own": "^0.1.3",
             "is-plain-object": "^2.0.1",
             "kind-of": "^3.0.2",
-            "lazy-cache": "^1.0.3",
             "shallow-clone": "^0.1.2"
           }
         },
@@ -28429,8 +28514,7 @@
           "requires": {
             "is-extendable": "^0.1.1",
             "kind-of": "^2.0.1",
-            "lazy-cache": "^0.2.3",
-            "mixin-object": "^2.0.1"
+            "lazy-cache": "^0.2.3"
           },
           "dependencies": {
             "kind-of": {
@@ -28537,16 +28621,16 @@
       "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg=="
     },
     "mime-db": {
-      "version": "1.43.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.43.0.tgz",
-      "integrity": "sha512-+5dsGEEovYbT8UY9yD7eE4XTc4UwJ1jBYlgaQQF38ENsKR3wj/8q8RFZrF9WIZpB2V1ArTVFUva8sAul1NzRzQ=="
+      "version": "1.48.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.48.0.tgz",
+      "integrity": "sha512-FM3QwxV+TnZYQ2aRqhlKBMHxk10lTbMt3bBkMAp54ddrNeVSfcQYOOKuGuy3Ddrm38I04If834fOUSq1yzslJQ=="
     },
     "mime-types": {
-      "version": "2.1.26",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.26.tgz",
-      "integrity": "sha512-01paPWYgLrkqAyrlDorC1uDwl2p3qZT7yl806vW7DvDoxwXi46jsjFbg+WdwotBIk6/MbEhO/dh5aZ5sNj/dWQ==",
+      "version": "2.1.31",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.31.tgz",
+      "integrity": "sha512-XGZnNzm3QvgKxa8dpzyhFTHmpP3l5YNusmne07VUOXxou9CqUqYa/HBy124RqtVh/O2pECas/MOcsDgpilPOPg==",
       "requires": {
-        "mime-db": "1.43.0"
+        "mime-db": "1.48.0"
       }
     },
     "mimer": {
@@ -28774,24 +28858,6 @@
         }
       }
     },
-    "mixin-object": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/mixin-object/-/mixin-object-2.0.1.tgz",
-      "integrity": "sha1-T7lJRB2rGCVA8f4DW6YOGUel5X4=",
-      "dev": true,
-      "requires": {
-        "for-in": "^0.1.3",
-        "is-extendable": "^0.1.1"
-      },
-      "dependencies": {
-        "for-in": {
-          "version": "0.1.8",
-          "resolved": "https://registry.npmjs.org/for-in/-/for-in-0.1.8.tgz",
-          "integrity": "sha1-2Hc5COMSVhCZUrH9ubP6hn0ndeE=",
-          "dev": true
-        }
-      }
-    },
     "mjml": {
       "version": "3.3.5",
       "resolved": "https://registry.npmjs.org/mjml/-/mjml-3.3.5.tgz",
@@ -30529,15 +30595,6 @@
         }
       }
     },
-    "node-releases": {
-      "version": "1.1.21",
-      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.21.tgz",
-      "integrity": "sha512-TwnURTCjc8a+ElJUjmDqU6+12jhli1Q61xOQmdZ7ECZVBZuQpN/1UnembiIHDM1wCcfLvh5wrWXUF5H6ufX64Q==",
-      "dev": true,
-      "requires": {
-        "semver": "^5.3.0"
-      }
-    },
     "node-sass": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-5.0.0.tgz",
@@ -30738,9 +30795,9 @@
           "optional": true
         },
         "glob-parent": {
-          "version": "5.1.1",
-          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.1.tgz",
-          "integrity": "sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==",
+          "version": "5.1.2",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+          "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
           "dev": true,
           "requires": {
             "is-glob": "^4.0.1"
@@ -31266,9 +31323,9 @@
           }
         },
         "postcss": {
-          "version": "7.0.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-          "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -31914,26 +31971,26 @@
       "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs="
     },
     "postcss": {
-      "version": "8.2.4",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.2.4.tgz",
-      "integrity": "sha512-kRFftRoExRVXZlwUuay9iC824qmXPcQQVzAjbCCgjpXnkdMCJYBu2gTwAaFBzv8ewND6O8xFb3aELmEkh9zTzg==",
+      "version": "8.3.0",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.0.tgz",
+      "integrity": "sha512-+ogXpdAjWGa+fdYY5BQ96V/6tAo+TdSSIMP5huJBIygdWwKtVoB5JWZ7yUd4xZ8r+8Kvvx4nyg/PQ071H4UtcQ==",
       "dev": true,
       "requires": {
-        "colorette": "^1.2.1",
-        "nanoid": "^3.1.20",
-        "source-map": "^0.6.1"
+        "colorette": "^1.2.2",
+        "nanoid": "^3.1.23",
+        "source-map-js": "^0.6.2"
       },
       "dependencies": {
-        "nanoid": {
-          "version": "3.1.20",
-          "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.20.tgz",
-          "integrity": "sha512-a1cQNyczgKbLX9jwbS/+d7W8fX/RfgYR7lVWwWOGIPNgK2m0MWvrGF6/m4kk6U3QcFMnZf3RIhL0v2Jgh/0Uxw==",
+        "colorette": {
+          "version": "1.2.2",
+          "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
+          "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
           "dev": true
         },
-        "source-map": {
-          "version": "0.6.1",
-          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-          "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+        "nanoid": {
+          "version": "3.1.23",
+          "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.23.tgz",
+          "integrity": "sha512-FiB0kzdP0FFVGDKlRLEQ1BgDzU87dy5NnzjeW9YZNt+/c3+q82EQDUwniSAUxp/F0gFNI1ZhKU1FqYsMuqZVnw==",
           "dev": true
         }
       }
@@ -31949,9 +32006,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -31999,9 +32056,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32054,9 +32111,9 @@
           "dev": true
         },
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32103,9 +32160,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32152,9 +32209,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32200,9 +32257,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.29",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.29.tgz",
-          "integrity": "sha512-ba0ApvR3LxGvRMMiUa9n0WR4HjzcYm7tS+ht4/2Nd0NLtHpPIH77fuB9Xh1/yJVz9O/E/95Y/dn8ygWsyffXtw==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32237,9 +32294,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-          "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32274,9 +32331,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32311,9 +32368,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32348,9 +32405,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32386,9 +32443,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32436,9 +32493,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32653,9 +32710,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32777,9 +32834,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-          "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32817,9 +32874,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-          "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32857,9 +32914,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-          "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32896,9 +32953,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-          "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32935,9 +32992,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-          "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -32974,9 +33031,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-          "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -33012,9 +33069,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-          "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -33049,9 +33106,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -33086,9 +33143,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -33124,9 +33181,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -33223,47 +33280,78 @@
           },
           "dependencies": {
             "postcss": {
-              "version": "7.0.35",
-              "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-              "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+              "version": "7.0.36",
+              "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+              "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
               "dev": true,
               "requires": {
                 "chalk": "^2.4.2",
                 "source-map": "^0.6.1",
                 "supports-color": "^6.1.0"
+              },
+              "dependencies": {
+                "source-map": {
+                  "version": "0.6.1",
+                  "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+                  "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+                  "dev": true
+                },
+                "supports-color": {
+                  "version": "6.1.0",
+                  "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz",
+                  "integrity": "sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==",
+                  "dev": true,
+                  "requires": {
+                    "has-flag": "^3.0.0"
+                  }
+                }
               }
             }
           }
         },
         "browserslist": {
-          "version": "4.16.1",
-          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.16.1.tgz",
-          "integrity": "sha512-UXhDrwqsNcpTYJBTZsbGATDxZbiVDsx6UjpmRUmtnP10pr8wAYr5LgFoEFw9ixriQH2mv/NX2SfGzE/o8GndLA==",
+          "version": "4.16.6",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.16.6.tgz",
+          "integrity": "sha512-Wspk/PqO+4W9qp5iUTJsa1B/QrYn1keNCcEP5OvP7WBwT4KaDly0uONYmC6Xa3Z5IqnUgS0KcgLYu1l74x0ZXQ==",
           "dev": true,
           "requires": {
-            "caniuse-lite": "^1.0.30001173",
-            "colorette": "^1.2.1",
-            "electron-to-chromium": "^1.3.634",
+            "caniuse-lite": "^1.0.30001219",
+            "colorette": "^1.2.2",
+            "electron-to-chromium": "^1.3.723",
             "escalade": "^3.1.1",
-            "node-releases": "^1.1.69"
+            "node-releases": "^1.1.71"
+          },
+          "dependencies": {
+            "caniuse-lite": {
+              "version": "1.0.30001236",
+              "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001236.tgz",
+              "integrity": "sha512-o0PRQSrSCGJKCPZcgMzl5fUaj5xHe8qA2m4QRvnyY4e1lITqoNkr7q/Oh1NcpGSy0Th97UZ35yoKcINPoq7YOQ==",
+              "dev": true
+            },
+            "colorette": {
+              "version": "1.2.2",
+              "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz",
+              "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==",
+              "dev": true
+            }
           }
         },
         "electron-to-chromium": {
-          "version": "1.3.646",
-          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.646.tgz",
-          "integrity": "sha512-P+3q8ugIPezulqoBYaLoUsF0fT4YNpe+zEDmdDUDnHZUAeSbBjMbis+JjJp9duU8BdfWV3VXf27NTBcwhRTsAQ==",
+          "version": "1.3.750",
+          "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.750.tgz",
+          "integrity": "sha512-Eqy9eHNepZxJXT+Pc5++zvEi5nQ6AGikwFYDCYwXUFBr+ynJ6pDG7MzZmwGYCIuXShLJM0n4bq+aoKDmvSGJ8A==",
           "dev": true
         },
         "node-releases": {
-          "version": "1.1.70",
-          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.70.tgz",
-          "integrity": "sha512-Slf2s69+2/uAD79pVVQo8uSiC34+g8GWY8UH2Qtqv34ZfhYrxpYpfzs9Js9d6O0mbDmALuxaTlplnBTnSELcrw==",
+          "version": "1.1.73",
+          "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-1.1.73.tgz",
+          "integrity": "sha512-uW7fodD6pyW2FZNZnp/Z3hvWKeEW1Y8R1+1CnErE8cXFXzl5blBOoVB41CvMer6P6Q0S5FXDwcHgFd1Wj0U9zg==",
           "dev": true
         },
         "postcss": {
-          "version": "7.0.35",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz",
-          "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -33558,13 +33646,13 @@
       }
     },
     "pretty-error": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/pretty-error/-/pretty-error-2.1.1.tgz",
-      "integrity": "sha1-X0+HyPkeWuPzuoerTPXgOxoX8aM=",
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/pretty-error/-/pretty-error-2.1.2.tgz",
+      "integrity": "sha512-EY5oDzmsX5wvuynAByrmY0P0hcp+QpnAKbJng2A2MPjVKXCxrDSUkzghVJ4ZGPIv+JC4gX8fPUWscC0RtjsWGw==",
       "dev": true,
       "requires": {
-        "renderkid": "^2.0.1",
-        "utila": "~0.4"
+        "lodash": "^4.17.20",
+        "renderkid": "^2.0.4"
       }
     },
     "pretty-format": {
@@ -36034,16 +36122,104 @@
       "integrity": "sha1-wkvOKig62tW8P1jg1IJJuSN52O8="
     },
     "renderkid": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/renderkid/-/renderkid-2.0.3.tgz",
-      "integrity": "sha512-z8CLQp7EZBPCwCnncgf9C4XAi3WR0dv+uWu/PjIyhhAb5d6IJ/QZqlHFprHeKT+59//V6BNUsLbvN8+2LarxGA==",
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/renderkid/-/renderkid-2.0.6.tgz",
+      "integrity": "sha512-GIis2GBr/ho0pFNf57D4XM4+PgnQuTii0WCPjEZmZfKivzUfGuRdjN2aQYtYMiNggHmNyBve+thFnNR1iBRcKg==",
       "dev": true,
       "requires": {
-        "css-select": "^1.1.0",
-        "dom-converter": "^0.2",
-        "htmlparser2": "^3.3.0",
-        "strip-ansi": "^3.0.0",
-        "utila": "^0.4.0"
+        "css-select": "^4.1.3",
+        "dom-converter": "^0.2.0",
+        "htmlparser2": "^6.1.0",
+        "lodash": "^4.17.21",
+        "strip-ansi": "^6.0.0"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "5.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.0.tgz",
+          "integrity": "sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg==",
+          "dev": true
+        },
+        "css-select": {
+          "version": "4.1.3",
+          "resolved": "https://registry.npmjs.org/css-select/-/css-select-4.1.3.tgz",
+          "integrity": "sha512-gT3wBNd9Nj49rAbmtFHj1cljIAOLYSX1nZ8CB7TBO3INYckygm5B7LISU/szY//YmdiSLbJvDLOx9VnMVpMBxA==",
+          "dev": true,
+          "requires": {
+            "boolbase": "^1.0.0",
+            "css-what": "^5.0.0",
+            "domhandler": "^4.2.0",
+            "domutils": "^2.6.0",
+            "nth-check": "^2.0.0"
+          }
+        },
+        "css-what": {
+          "version": "5.0.1",
+          "resolved": "https://registry.npmjs.org/css-what/-/css-what-5.0.1.tgz",
+          "integrity": "sha512-FYDTSHb/7KXsWICVsxdmiExPjCfRC4qRFBdVwv7Ax9hMnvMmEjP9RfxTEZ3qPZGmADDn2vAKSo9UcN1jKVYscg==",
+          "dev": true
+        },
+        "dom-serializer": {
+          "version": "1.3.2",
+          "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.3.2.tgz",
+          "integrity": "sha512-5c54Bk5Dw4qAxNOI1pFEizPSjVsx5+bpJKmL2kPn8JhBUq2q09tTCa3mjijun2NfK78NMouDYNMBkOrPZiS+ig==",
+          "dev": true,
+          "requires": {
+            "domelementtype": "^2.0.1",
+            "domhandler": "^4.2.0",
+            "entities": "^2.0.0"
+          }
+        },
+        "domelementtype": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz",
+          "integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A==",
+          "dev": true
+        },
+        "domhandler": {
+          "version": "4.2.0",
+          "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-4.2.0.tgz",
+          "integrity": "sha512-zk7sgt970kzPks2Bf+dwT/PLzghLnsivb9CcxkvR8Mzr66Olr0Ofd8neSbglHJHaHa2MadfoSdNlKYAaafmWfA==",
+          "dev": true,
+          "requires": {
+            "domelementtype": "^2.2.0"
+          }
+        },
+        "domutils": {
+          "version": "2.7.0",
+          "resolved": "https://registry.npmjs.org/domutils/-/domutils-2.7.0.tgz",
+          "integrity": "sha512-8eaHa17IwJUPAiB+SoTYBo5mCdeMgdcAoXJ59m6DT1vw+5iLS3gNoqYaRowaBKtGVrOF1Jz4yDTgYKLK2kvfJg==",
+          "dev": true,
+          "requires": {
+            "dom-serializer": "^1.0.1",
+            "domelementtype": "^2.2.0",
+            "domhandler": "^4.2.0"
+          }
+        },
+        "entities": {
+          "version": "2.2.0",
+          "resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
+          "integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==",
+          "dev": true
+        },
+        "nth-check": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.0.0.tgz",
+          "integrity": "sha512-i4sc/Kj8htBrAiH1viZ0TgU8Y5XqCaV/FziYK6TBczxmeKm3AEFWqqF3195yKudrarqy7Zu80Ra5dobFjn9X/Q==",
+          "dev": true,
+          "requires": {
+            "boolbase": "^1.0.0"
+          }
+        },
+        "strip-ansi": {
+          "version": "6.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.0.tgz",
+          "integrity": "sha512-AuvKTrTfQNYNIctbR1K/YGTR1756GycPsg7b9bdV9Duqur4gv6aKqHXah67Z8ImS7WEz5QVcOtlfW2rZEugt6w==",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "^5.0.0"
+          }
+        }
       }
     },
     "repeat-element": {
@@ -37468,8 +37644,7 @@
         },
         "kind-of": {
           "version": "6.0.2",
-          "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.2.tgz",
-          "integrity": "sha512-s5kLOcnH0XqDO+FvuaLX8DDjZ18CGFk7VygH40QoKPUQhW4e2rvM0rwUq0t8IQDOwYSeLK01U90OjzBTme2QqA=="
+          "resolved": ""
         }
       }
     },
@@ -37550,6 +37725,12 @@
       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
       "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
     },
+    "source-map-js": {
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-0.6.2.tgz",
+      "integrity": "sha512-/3GptzWzu0+0MBQFrDKzw/DvvMTUORvgY6k6jd/VS6iCR4RDTKWH6v6WPwQoUO8667uQEf9Oe38DxAYWY5F/Ug==",
+      "dev": true
+    },
     "source-map-resolve": {
       "version": "0.5.2",
       "resolved": "https://registry.npmjs.org/source-map-resolve/-/source-map-resolve-0.5.2.tgz",
@@ -37655,11 +37836,6 @@
       "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
       "dev": true
     },
-    "srcdoc-polyfill": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/srcdoc-polyfill/-/srcdoc-polyfill-0.2.0.tgz",
-      "integrity": "sha1-CX7R66rg5V6ApLiJGSvUL/F8eFE="
-    },
     "sshpk": {
       "version": "1.16.1",
       "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.16.1.tgz",
@@ -37690,12 +37866,51 @@
       "integrity": "sha512-ji9qxRnOVfcuLDySj9qzhGSEFVobyt1kIOSkj1qZzYLzq7Tos/oUUWvotUPQLlrsidqsK6tBH89Bc9kL5zHA6w==",
       "dev": true
     },
+    "stack-generator": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/stack-generator/-/stack-generator-2.0.5.tgz",
+      "integrity": "sha512-/t1ebrbHkrLrDuNMdeAcsvynWgoH/i4o8EGGfX7dEYDoTXOYVAkEpFdtshlvabzc6JlJ8Kf9YdFEoz7JkzGN9Q==",
+      "requires": {
+        "stackframe": "^1.1.1"
+      }
+    },
     "stack-utils": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/stack-utils/-/stack-utils-1.0.2.tgz",
       "integrity": "sha512-MTX+MeG5U994cazkjd/9KNAapsHnibjMLnfXodlkXw76JEea0UiNzrqidzo1emMwk7w5Qhc9jd4Bn9TBb1MFwA==",
       "dev": true
     },
+    "stackframe": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/stackframe/-/stackframe-1.2.0.tgz",
+      "integrity": "sha512-GrdeshiRmS1YLMYgzF16olf2jJ/IzxXY9lhKOskuVziubpTYcYqyOwYeJKzQkwy7uN0fYSsbsC4RQaXf9LCrYA=="
+    },
+    "stacktrace-gps": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/stacktrace-gps/-/stacktrace-gps-3.0.4.tgz",
+      "integrity": "sha512-qIr8x41yZVSldqdqe6jciXEaSCKw1U8XTXpjDuy0ki/apyTn/r3w9hDAAQOhZdxvsC93H+WwwEu5cq5VemzYeg==",
+      "requires": {
+        "source-map": "0.5.6",
+        "stackframe": "^1.1.1"
+      },
+      "dependencies": {
+        "source-map": {
+          "version": "0.5.6",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
+          "integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
+        }
+      }
+    },
+    "stacktrace-js": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/stacktrace-js/-/stacktrace-js-2.0.2.tgz",
+      "integrity": "sha512-Je5vBeY4S1r/RnLydLl0TBTi3F2qdfWmYsGvtfZgEI+SCprPppaIhQf5nGcal4gI4cGpCV/duLcAzT1np6sQqg==",
+      "requires": {
+        "error-stack-parser": "^2.0.6",
+        "stack-generator": "^2.0.5",
+        "stacktrace-gps": "^3.0.4"
+      }
+    },
     "state-toggle": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/state-toggle/-/state-toggle-1.0.3.tgz",
@@ -38316,9 +38531,9 @@
       },
       "dependencies": {
         "postcss": {
-          "version": "7.0.17",
-          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.17.tgz",
-          "integrity": "sha512-546ZowA+KZ3OasvQZHsbuEpysvwTZNGJv9EfyCQdsIDltPSWHAeTQ5fQy/Npi2ZDtLI3zs7Ps/p6wThErhm9fQ==",
+          "version": "7.0.36",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
+          "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
           "dev": true,
           "requires": {
             "chalk": "^2.4.2",
@@ -38584,9 +38799,9 @@
           "dev": true
         },
         "lodash": {
-          "version": "4.17.20",
-          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.20.tgz",
-          "integrity": "sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA==",
+          "version": "4.17.21",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+          "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
           "dev": true
         },
         "string-width": {
@@ -39447,9 +39662,9 @@
       }
     },
     "ua-parser-js": {
-      "version": "0.7.19",
-      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.19.tgz",
-      "integrity": "sha512-T3PVJ6uz8i0HzPxOF9SWzWAlfN/DavlpQqepn22xgve/5QecC+XMCAtmUNnY7C9StehaV6exjUCI801lOI7QlQ=="
+      "version": "0.7.28",
+      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.28.tgz",
+      "integrity": "sha512-6Gurc1n//gjp9eQNXjD9O3M/sMwVtN5S8Lv9bvOYBfKfDNiIIhqiyi01vMBO45u4zkDE420w/e0se7Vs+sIg+g=="
     },
     "uglify-js": {
       "version": "3.4.10",
@@ -39950,9 +40165,9 @@
       }
     },
     "url-parse": {
-      "version": "1.4.7",
-      "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.4.7.tgz",
-      "integrity": "sha512-d3uaVyzDB9tQoSXFvuSUNFibTd9zxd2bkVrDRvF5TmvWWQwqE4lgYJ5m+x1DbecWkw+LK4RNl2CU1hHuOKPVlg==",
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.1.tgz",
+      "integrity": "sha512-HOfCOUJt7iSYzEx/UqgtwKRMC6EU91NFhsCHMv9oM03VJcVo2Qrp8T8kI9D7amFf1cu+/3CEhgb3rF9zL7k85Q==",
       "dev": true,
       "requires": {
         "querystringify": "^2.1.1",
@@ -40528,9 +40743,9 @@
           "optional": true
         },
         "glob-parent": {
-          "version": "5.1.1",
-          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.1.tgz",
-          "integrity": "sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==",
+          "version": "5.1.2",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+          "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
           "optional": true,
           "requires": {
             "is-glob": "^4.0.1"
@@ -41777,9 +41992,9 @@
       }
     },
     "websocket-extensions": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.3.tgz",
-      "integrity": "sha512-nqHUnMXmBzT0w570r2JpJxfiSD1IzoI+HGVdd3aZ0yNi3ngvQ4jv1dtHt5VGxfI2yj5yqImPhOK4vmIh2xMbGg==",
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.4.tgz",
+      "integrity": "sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==",
       "dev": true
     },
     "whatwg-encoding": {
@@ -41999,8 +42214,7 @@
     },
     "ws": {
       "version": "7.3.0",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-7.3.0.tgz",
-      "integrity": "sha512-iFtXzngZVXPGgpTlP1rBqsUK82p9tKqsWRPg5L56egiljujJT3vGAYnHANvFxBieXrTFavhzhxW52jnaWV+w2w==",
+      "resolved": "",
       "dev": true
     },
     "xdg-basedir": {
diff --git a/package.json b/package.json
index 1fa3c4c2e0..a8ffb92f1b 100644
--- a/package.json
+++ b/package.json
@@ -120,7 +120,7 @@
     "node-sass": "^5.0.0",
     "nodemon": "^2.0.7",
     "optimize-css-assets-webpack-plugin": "^5.0.3",
-    "postcss": "^8.2.4",
+    "postcss": "^8.3.0",
     "postcss-focus": "^4.0.0",
     "postcss-loader": "^4.2.0",
     "postcss-preset-env": "^6.7.0",
@@ -181,9 +181,9 @@
     "jest-express": "^1.11.0",
     "jsdom": "^9.8.3",
     "jshint": "^2.11.0",
-    "lodash": "^4.17.19",
+    "lodash": "^4.17.21",
     "loop-protect": "github:catarak/loop-protect",
-    "mime-types": "^2.1.26",
+    "mime-types": "^2.1.31",
     "mjml": "^3.3.2",
     "mockingoose": "^2.13.2",
     "mongoose": "^5.12.3",
@@ -228,7 +228,7 @@
     "sinon": "^7.5.0",
     "sinon-mongoose": "^2.3.0",
     "slugify": "^1.3.6",
-    "srcdoc-polyfill": "^0.2.0",
+    "stacktrace-js": "^2.0.2",
     "styled-components": "^5.0.0",
     "styled-theming": "^2.2.0",
     "url": "^0.11.0",
diff --git a/server/controllers/embed.controller.js b/server/controllers/embed.controller.js
index b8c11447cc..599267ac79 100644
--- a/server/controllers/embed.controller.js
+++ b/server/controllers/embed.controller.js
@@ -26,7 +26,7 @@ export function serveProject(req, res) {
       const sketchDoc = window.document;
 
       const base = sketchDoc.createElement('base');
-      const fullUrl = `${req.protocol}://${req.get('host')}${req.originalUrl}`;
+      const fullUrl = `//${req.get('host')}${req.originalUrl}`;
       base.href = `${fullUrl}/`;
       sketchDoc.head.appendChild(base);
 
diff --git a/server/domain-objects/createDefaultFiles.js b/server/domain-objects/createDefaultFiles.js
index 1903406cec..696a9b222d 100644
--- a/server/domain-objects/createDefaultFiles.js
+++ b/server/domain-objects/createDefaultFiles.js
@@ -9,8 +9,8 @@ function draw() {
 const defaultHTML = `<!DOCTYPE html>
 <html>
   <head>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.3.1/p5.js"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.3.1/addons/p5.sound.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/addons/p5.sound.min.js"></script>
     <link rel="stylesheet" type="text/css" href="style.css">
     <meta charset="utf-8" />
 
diff --git a/server/models/collection.js b/server/models/collection.js
index 066e9b90cc..c7fc0d1ee7 100644
--- a/server/models/collection.js
+++ b/server/models/collection.js
@@ -53,4 +53,5 @@ collectionSchema.pre('save', function generateSlug(next) {
   return next();
 });
 
-export default mongoose.model('Collection', collectionSchema);
+export default mongoose.models.Collection ||
+  mongoose.model('Collection', collectionSchema);
diff --git a/server/models/project.js b/server/models/project.js
index 3244cc8cce..4dfd25aeef 100644
--- a/server/models/project.js
+++ b/server/models/project.js
@@ -93,4 +93,5 @@ projectSchema.methods.isSlugUnique = async function isSlugUnique(cb) {
   }
 };
 
-export default mongoose.model('Project', projectSchema);
+export default mongoose.models.Project ||
+  mongoose.model('Project', projectSchema);
diff --git a/server/models/user.js b/server/models/user.js
index 57549c40ee..1ff4132b60 100644
--- a/server/models/user.js
+++ b/server/models/user.js
@@ -71,7 +71,6 @@ const userSchema = new Schema(
       lintWarning: { type: Boolean, default: false },
       textOutput: { type: Boolean, default: false },
       gridOutput: { type: Boolean, default: false },
-      soundOutput: { type: Boolean, default: false },
       theme: { type: String, default: 'light' },
       autorefresh: { type: Boolean, default: false },
       language: { type: String, default: 'en-US' },
@@ -306,4 +305,4 @@ userSchema.statics.EmailConfirmation = EmailConfirmationStates;
 userSchema.index({ username: 1 }, { collation: { locale: 'en', strength: 2 } });
 userSchema.index({ email: 1 }, { collation: { locale: 'en', strength: 2 } });
 
-export default mongoose.model('User', userSchema);
+export default mongoose.models.User || mongoose.model('User', userSchema);
diff --git a/server/previewServer.js b/server/previewServer.js
new file mode 100644
index 0000000000..cfbde3062c
--- /dev/null
+++ b/server/previewServer.js
@@ -0,0 +1,92 @@
+import Express from 'express';
+import mongoose from 'mongoose';
+import path from 'path';
+import webpack from 'webpack';
+import cors from 'cors';
+import webpackDevMiddleware from 'webpack-dev-middleware';
+import webpackHotMiddleware from 'webpack-hot-middleware';
+import config from '../webpack/config.dev';
+import embedRoutes from './routes/embed.routes';
+import assetRoutes from './routes/asset.routes';
+import renderPreviewIndex from './views/previewIndex';
+
+const app = new Express();
+
+// This also works if you take out the mongoose connection
+// but i have no idea why
+const mongoConnectionString = process.env.MONGO_URL;
+// Connect to MongoDB
+mongoose.Promise = global.Promise;
+mongoose.connect(mongoConnectionString, {
+  useNewUrlParser: true,
+  useUnifiedTopology: true
+});
+mongoose.set('useCreateIndex', true);
+mongoose.connection.on('error', () => {
+  console.error(
+    'MongoDB Connection Error. Please make sure that MongoDB is running.'
+  );
+  process.exit(1);
+});
+
+const allowedCorsOrigins = [
+  /p5js\.org$/,
+  process.env.EDITOR_URL,
+  process.env.PREVIEW_URL
+];
+
+// to allow client-only development
+if (process.env.CORS_ALLOW_LOCALHOST === 'true') {
+  allowedCorsOrigins.push(/localhost/);
+}
+
+// Enable Cross-Origin Resource Sharing (CORS)
+const corsMiddleware = cors({
+  credentials: true,
+  origin: allowedCorsOrigins
+});
+app.use(corsMiddleware);
+// Enable pre-flight OPTIONS route for all end-points
+app.options('*', corsMiddleware);
+
+// Run Webpack dev server in development mode
+if (process.env.NODE_ENV === 'development') {
+  const compiler = webpack(config);
+  app.use(
+    webpackDevMiddleware(compiler, {
+      publicPath: config.output.publicPath
+    })
+  );
+  app.use(webpackHotMiddleware(compiler));
+}
+
+app.use(
+  Express.static(path.resolve(__dirname, '../dist/static'), {
+    maxAge:
+      process.env.STATIC_MAX_AGE ||
+      (process.env.NODE_ENV === 'production' ? '1d' : '0')
+  })
+);
+
+app.get('/', (req, res) => {
+  res.send(renderPreviewIndex());
+});
+
+app.use('/', embedRoutes);
+app.use('/', assetRoutes);
+
+// Handle missing routes.
+app.get('*', (req, res) => {
+  res.status(404);
+  res.type('txt').send('Not found.');
+});
+
+app.listen(process.env.PREVIEW_PORT, (error) => {
+  if (!error) {
+    console.log(
+      `p5.js Preview Server is running on port: ${process.env.PREVIEW_PORT}`
+    );
+  }
+});
+
+export default app;
diff --git a/server/routes/redirectEmbed.routes.js b/server/routes/redirectEmbed.routes.js
new file mode 100644
index 0000000000..d0450dfc22
--- /dev/null
+++ b/server/routes/redirectEmbed.routes.js
@@ -0,0 +1,21 @@
+import { Router } from 'express';
+
+const router = new Router();
+const previewUrl = process.env.PREVIEW_URL;
+
+router.get('/:username/embed/:project_id', (req, res) => {
+  const { username, project_id: projectId } = req.params;
+  res.redirect(301, `${previewUrl}/${username}/embed/${projectId}`);
+});
+
+router.get('/:username/present/:project_id', (req, res) => {
+  const { username, project_id: projectId } = req.params;
+  res.redirect(301, `${previewUrl}/${username}/present/${projectId}`);
+});
+
+router.get('/embed/:project_id', (req, res) => {
+  const { project_id: projectId } = req.params;
+  res.redirect(301, `${previewUrl}/embed/${projectId}`);
+});
+
+export default router;
diff --git a/server/scripts/examples.js b/server/scripts/examples.js
index c1c709bcbc..e981856109 100644
--- a/server/scripts/examples.js
+++ b/server/scripts/examples.js
@@ -9,8 +9,8 @@ import Project from '../models/project';
 const defaultHTML = `<!DOCTYPE html>
 <html lang="en">
   <head>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.3.1/p5.js"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.10.2/addons/p5.sound.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/addons/p5.sound.min.js"></script>
     <link rel="stylesheet" type="text/css" href="style.css">
     <meta charset="utf-8" />
   </head>
diff --git a/server/server.js b/server/server.js
index df6bc3ae63..bffd7ab544 100644
--- a/server/server.js
+++ b/server/server.js
@@ -24,7 +24,7 @@ import files from './routes/file.routes';
 import collections from './routes/collection.routes';
 import aws from './routes/aws.routes';
 import serverRoutes from './routes/server.routes';
-import embedRoutes from './routes/embed.routes';
+import redirectEmbedRoutes from './routes/redirectEmbed.routes';
 import assetRoutes from './routes/asset.routes';
 import passportRoutes from './routes/passport.routes';
 import { requestsOfTypeJSON } from './utils/requestsOfType';
@@ -37,7 +37,11 @@ const MongoStore = connectMongo(session);
 
 app.get('/health', (req, res) => res.json({ success: true }));
 
-const allowedCorsOrigins = [/p5js\.org$/];
+const allowedCorsOrigins = [
+  /p5js\.org$/,
+  process.env.EDITOR_URL,
+  process.env.PREVIEW_URL
+];
 
 // to allow client-only development
 if (process.env.CORS_ALLOW_LOCALHOST === 'true') {
@@ -141,9 +145,7 @@ app.use('/editor', requestsOfTypeJSON(), collections);
 // isomorphic rendering
 app.use('/', serverRoutes);
 
-app.use(assetRoutes);
-
-app.use('/', embedRoutes);
+app.use('/', redirectEmbedRoutes);
 app.use('/', passportRoutes);
 
 // configure passport
diff --git a/server/views/index.js b/server/views/index.js
index e60199e51d..f7e5b4b229 100644
--- a/server/views/index.js
+++ b/server/views/index.js
@@ -34,7 +34,7 @@ export function renderIndex() {
         window.process.env.UPLOAD_LIMIT = ${process.env.UPLOAD_LIMIT ? `${process.env.UPLOAD_LIMIT}` : undefined};
         window.process.env.MOBILE_ENABLED = ${process.env.MOBILE_ENABLED ? `${process.env.MOBILE_ENABLED}` : undefined};
         window.process.env.TRANSLATIONS_ENABLED = ${process.env.TRANSLATIONS_ENABLED === 'true' ? true : false}; 
-        window.process.env.PREVIEW_SCRIPTS_URL = '${process.env.NODE_ENV === 'production' ? `${assetsManifest['/previewScripts.js']}` : '/previewScripts.js'}';
+        window.process.env.PREVIEW_URL = '${process.env.PREVIEW_URL}';
       </script>
     </head>
     <body>
diff --git a/server/views/previewIndex.js b/server/views/previewIndex.js
new file mode 100644
index 0000000000..60cb6e15b4
--- /dev/null
+++ b/server/views/previewIndex.js
@@ -0,0 +1,38 @@
+function renderPreviewIndex() {
+  const assetsManifest =
+    process.env.webpackAssets && JSON.parse(process.env.webpackAssets);
+  return `
+    <!DOCTYPE html>
+    <html lang="en">
+      <head>
+        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <script>
+          if (!window.process) {
+            window.process = {};
+          }
+          if (!window.process.env) {
+            window.process.env = {};
+          }
+          window.process.env.PREVIEW_SCRIPTS_URL = '${
+            process.env.NODE_ENV === 'production'
+              ? `${assetsManifest['/previewScripts.js']}`
+              : '/previewScripts.js'
+          }';
+          window.process.env.EDITOR_URL = '${process.env.EDITOR_URL}';
+        </script>
+        </head>
+      <body>
+        <div id="root" class="root-app">
+        </div>
+        <script src='${
+          process.env.NODE_ENV === 'production'
+            ? `${assetsManifest['/previewApp.js']}`
+            : '/previewApp.js'
+        }'></script>
+      </body>
+    </html>
+  `;
+}
+
+export default renderPreviewIndex;
diff --git a/translations/locales/de/translations.json b/translations/locales/de/translations.json
index 2b163dc3ef..071b45b0ed 100644
--- a/translations/locales/de/translations.json
+++ b/translations/locales/de/translations.json
@@ -166,9 +166,7 @@
     "PlainText": "Nur Text",
     "TextOutputARIA": "Text Ausgabe an",
     "TableText": "Tabellarisch",
-    "TableOutputARIA": "Tabellarische Ausgabe an",
-    "Sound": "Sound",
-    "SoundOutputARIA": "sound Ausgabe an"
+    "TableOutputARIA": "Tabellarische Ausgabe an"
   },
   "KeyboardShortcuts": {
     "Title": "Tastenkürzel",
diff --git a/translations/locales/en-US/translations.json b/translations/locales/en-US/translations.json
index c779fa25b1..6d23572c46 100644
--- a/translations/locales/en-US/translations.json
+++ b/translations/locales/en-US/translations.json
@@ -166,9 +166,7 @@
     "PlainText": "Plain-text",
     "TextOutputARIA": "text output on",
     "TableText": "Table-text",
-    "TableOutputARIA": "table output on",
-    "Sound": "Sound",
-    "SoundOutputARIA": "sound output on"
+    "TableOutputARIA": "table output on"
   },
   "KeyboardShortcuts": {
     "Title": " Keyboard Shortcuts",
diff --git a/translations/locales/es-419/translations.json b/translations/locales/es-419/translations.json
index 8cd22a0e04..fc70c17f17 100644
--- a/translations/locales/es-419/translations.json
+++ b/translations/locales/es-419/translations.json
@@ -166,9 +166,7 @@
     "PlainText": "Texto sin formato",
     "TextOutputARIA": "Salida de texto activado",
     "TableText": "Tablero de texto",
-    "TableOutputARIA": "Salida de tablero activado",
-    "Sound": "Sonido",
-    "SoundOutputARIA": "Salida de sonido activado"
+    "TableOutputARIA": "Salida de tablero activado"
   },
   "KeyboardShortcuts": {
     "Title": " Atajos de teclado",
diff --git a/translations/locales/hi/translations.json b/translations/locales/hi/translations.json
index 77089272b6..c73c800e2e 100644
--- a/translations/locales/hi/translations.json
+++ b/translations/locales/hi/translations.json
@@ -166,9 +166,7 @@
       "PlainText": "प्लेन-टेक्स्ट",
       "TextOutputARIA": "टेक्स्ट आउटपुट चालू",
       "TableText": "टेबल-टेक्स्ट",
-      "TableOutputARIA": "टेबल आउटपुट चालू",
-      "Sound": "साउन्ड",
-      "SoundOutputARIA": "साउन्ड आउटपुट चालू"
+      "TableOutputARIA": "टेबल आउटपुट चालू"
     },
     "KeyboardShortcuts": {
       "Title": " कीबोर्ड शॉर्टकट",
diff --git a/translations/locales/ja/translations.json b/translations/locales/ja/translations.json
index f2cd24ca1a..0dda043d2c 100644
--- a/translations/locales/ja/translations.json
+++ b/translations/locales/ja/translations.json
@@ -166,9 +166,7 @@
       "PlainText": "プレーンテキスト",
       "TextOutputARIA": "テキスト出力 オン",
       "TableText": "テーブルテキスト",
-      "TableOutputARIA": "テーブルテキスト出力 オン",
-      "Sound": "サウンド",
-      "SoundOutputARIA": "サウンド出力 オン"
+      "TableOutputARIA": "テーブルテキスト出力 オン"
     },
     "KeyboardShortcuts": {
       "Title": " キーボードショートカット",
diff --git a/translations/locales/pt-BR/translations.json b/translations/locales/pt-BR/translations.json
index a22d73011c..1bfa6cacb5 100644
--- a/translations/locales/pt-BR/translations.json
+++ b/translations/locales/pt-BR/translations.json
@@ -166,9 +166,7 @@
     "PlainText": "Texto sem formatação",
     "TextOutputARIA": "Saída de texto ativado",
     "TableText": "Tabela de texto",
-    "TableOutputARIA": "tabela de texto ativada",
-    "Sound": "Som",
-    "SoundOutputARIA": "Saída de som ativada"
+    "TableOutputARIA": "tabela de texto ativada"
   },
   "KeyboardShortcuts": {
     "Title": " Atalhos de Teclado",
diff --git a/webpack/config.dev.js b/webpack/config.dev.js
index 1205c13239..fd0521d1ed 100644
--- a/webpack/config.dev.js
+++ b/webpack/config.dev.js
@@ -7,8 +7,6 @@ if (process.env.NODE_ENV === 'development') {
   require('dotenv').config();
 }
 
-
-// react hmr being fucked up has to do with the multiple entries!!! cool.
 module.exports = {
   mode: 'development',
   devtool: 'cheap-module-eval-source-map',
@@ -20,7 +18,15 @@ module.exports = {
       'react-hot-loader/patch',
       './client/index.jsx',
     ],
+    'previewApp': [
+      'core-js/modules/es6.promise',
+      'core-js/modules/es6.array.iterator',
+      'webpack-hot-middleware/client',
+      'react-hot-loader/patch',
+      './client/modules/Preview/previewIndex.jsx',
+    ],
     previewScripts: [
+      '@babel/polyfill',
       path.resolve(__dirname, '../client/utils/previewEntry.js')
     ]
   },
diff --git a/webpack/config.prod.js b/webpack/config.prod.js
index 4939d291a2..dae6452848 100644
--- a/webpack/config.prod.js
+++ b/webpack/config.prod.js
@@ -11,9 +11,7 @@ if (process.env.NODE_ENV === "development") {
   require('dotenv').config();
 }
 
-const sharedObj = {};
-
-module.exports = [{
+module.exports = {
   devtool: 'source-map',
   mode: 'production',
   entry: {
@@ -22,6 +20,16 @@ module.exports = [{
       'core-js/modules/es6.promise',
       'core-js/modules/es6.array.iterator',
       path.resolve(__dirname, '../client/index.jsx')
+    ],
+    'previewApp': [
+      '@babel/polyfill',
+      'core-js/modules/es6.promise',
+      'core-js/modules/es6.array.iterator',
+      path.resolve(__dirname, '../client/modules/Preview/previewIndex.jsx')
+    ],
+    previewScripts: [
+      '@babel/polyfill',
+      path.resolve(__dirname, '../client/utils/previewEntry.js')
     ]
   },
   output: {
@@ -158,8 +166,7 @@ module.exports = [{
   plugins: [
     new WebpackManifestPlugin({
       basePath: '/',
-      filename: 'manifest.json',
-      seed: sharedObj
+      filename: 'manifest.json'
     }),
     new MiniCssExtractPlugin({
       filename: 'app.[hash].css',
@@ -171,52 +178,4 @@ module.exports = [{
     }
     )
   ]
-},
-{
-  entry: {
-    previewScripts: [
-      path.resolve(__dirname, '../client/utils/previewEntry.js')
-    ]
-  },
-  target: 'web',
-  devtool: 'source-map',
-  mode: 'production',
-  output: {
-    path: path.resolve(__dirname, '../dist/static'),
-    filename: 'previewScripts.[hash].js',
-    publicPath: '/'
-  },
-  resolve: {
-    extensions: ['*', '.js', '.jsx'],
-    modules: [
-      'client',
-      'node_modules',
-    ],
-  },
-  module: {
-    rules: [
-      {
-        test: /\.jsx?$/,
-        exclude: /node_modules/,
-        loader: 'babel-loader',
-        options: {
-          babelrc: true
-        }
-      }
-    ]
-  },
-  optimization: {
-    minimize: true,
-    minimizer: [new TerserJSPlugin({
-      sourceMap: true,
-      parallel: true
-    })],
-  },
-  plugins: [
-    new WebpackManifestPlugin({
-      basePath: '/',
-      filename: 'manifest.json',
-      seed: sharedObj
-    })
-  ]
-}];
+};
diff --git a/webpack/config.server.js b/webpack/config.server.js
index 227de90bdf..0dd0b5c740 100644
--- a/webpack/config.server.js
+++ b/webpack/config.server.js
@@ -4,11 +4,15 @@ const nodeExternals = require('webpack-node-externals');
 
 module.exports = {
 
-  entry: ['@babel/polyfill', path.resolve(__dirname, '../server/server.js')],
-
+  entry: {
+    server:
+      ['@babel/polyfill', path.resolve(__dirname, '../server/server.js')],
+    previewServer:
+      ['@babel/polyfill', path.resolve(__dirname, '../server/previewServer.js')],
+  },
   output: {
     path: path.resolve(__dirname, '../dist/'),
-    filename: 'server.bundle.js',
+    filename: '[name].bundle.js',
   },
 
   target: 'node',